﻿/* ─────────────────────────────────────────────────────────────────────────
   lebasino — pages the template never designed
   ─────────────────────────────────────────────────────────────────────────
   The lebasino HTML template only has the home page, shop/product and blog.
   Login/register, cart, checkout, dashboard, tickets, order tracking,
   contact/faq/about, compare, auctions and the error page fall back to the
   shared /Views/{Controller}/ markup, whose classes (auth-card, cart-page,
   dash-shell, track-page, ...) exist in no lebasino stylesheet.

   This file is the charmineh layer for that same shared markup (charmineh.css
   §3-4, 11, 15-17, 29-37 and the page sections), rescoped from .charmineh-page
   to .lb-std and re-tokened onto the lebasino palette (Peyda, #c83b3b).
   _BaseLayout adds .lb-std to <body> and links this file ONLY for those pages,
   so nothing here reaches the template's own designed pages. Element-level
   rules (input, h1, .btn, .card) are further limited to .lb-main, the wrapper
   _Layout puts around the page body, so the template header/footer stay as-is.
   ───────────────────────────────────────────────────────────────────────── */

/* ── 1. DESIGN TOKENS — charmineh names, lebasino values ─────────────────── */
.lb-std {

    --color-primary-50 : #FBEEEE;
    --color-primary-100: #F6D5D5;
    --color-primary-200: #EEB3B3;
    --color-primary-300: #E38585;
    --color-primary-400: #D65E5E;
    --color-primary-500: var(--primary-color, #C83B3B);
    --color-primary-600: var(--primary-dark, #A52C2C);
    --color-primary-700: #862424;
    --color-primary-800: #661B1B;

    --pn-canvas   : #FFFFFF;
    --pn-surface  : #FFFFFF;
    --pn-sunken   : #F7F8FA;
    --pn-ink      : var(--text-color, #242B3D);
    --pn-body     : #4A5163;
    --pn-muted    : #6B7280;
    --pn-hairline : rgba(36, 43, 61, .10);
    --pn-hairline-strong: rgba(36, 43, 61, .22);

    --pn-link      : var(--pn-ink);
    --pn-buy       : var(--primary-color, #C83B3B);
    --pn-buy-hover : var(--primary-dark, #A52C2C);
    --pn-buy-ink   : #FFFFFF;
    --pn-buy-solid : var(--primary-color, #C83B3B);
    --pn-blush     : #FBEEEE;
    --pn-gold      : #E0A526;
    --pn-price     : var(--primary-color, #C83B3B);
    --pn-sale      : #D64545;
    --pn-success   : #2F855A;
    --pn-danger    : #9B3226;
    --pn-warning   : #8A6A22;
    --pn-star      : #E0A526;
    --pn-shimmer   : #F1F2F5;

    --pn-ff       : "Peyda", Tahoma, sans-serif;
    --pn-ff-med   : "Peyda", Tahoma, sans-serif;
    --pn-ff-bold  : "Peyda", Tahoma, sans-serif;
    --pn-ff-black : "Peyda", Tahoma, sans-serif;
    --pn-ff-thin  : "Peyda", Tahoma, sans-serif;
    --pn-ff-light : "Peyda", Tahoma, sans-serif;

    --fs-display : clamp(2.25rem, 1.1rem + 4.2vw, 4rem);    /* 36 → 64 */
    --fs-h1      : clamp(1.5rem, 1.15rem + 1vw, 2rem);      /* 24 → 32 */
    --fs-h2      : clamp(1.25rem, 1rem + 1vw, 1.75rem);     /* 20 → 28 */
    --fs-h3      : 1.25rem;                                 /* 20 */
    --fs-body-lg : 1.0625rem;                               /* 17 */
    --fs-body    : 0.9375rem;                               /* 15 */
    --fs-body-sm : 0.8125rem;                               /* 13 */
    --fs-caption : 0.75rem;                                 /* 12 */

    --lh-heading : 1.45;
    --lh-body    : 1.85;
    --lh-snug    : 1.6;
    --ls         : 0;
    --ls-label   : .14em;

    --space-1 : 0.25rem;   /*   4 */
    --space-2 : 0.5rem;    /*   8 */
    --space-3 : 0.75rem;   /*  12 */
    --space-4 : 1rem;      /*  16 */
    --space-5 : 1.5rem;    /*  24 */
    --space-6 : 2rem;      /*  32 */
    --space-7 : 2.75rem;   /*  44 */
    --space-8 : 3.5rem;    /*  56 */
    --space-9 : 4.5rem;    /*  72 */
    --space-10: 6rem;      /*  96 */
    --space-11: 7.5rem;    /* 120 */
    --space-12: 10rem;     /* 160 */

    --pn-r-sm : 8px;
    --pn-r-md : 12px;
    --pn-r-lg : 18px;
    --pn-r-xl : 28px;
    --pn-r-pill: 999px;

    --pn-sh-1 : none;
    --pn-sh-2 : 0 4px 18px rgba(36, 36, 36, .06);
    --pn-sh-3 : 0 18px 50px rgba(36, 36, 36, .12);

    /* ══ 1g. Layout ═════════════════════════════════════════════════════ */
    --pn-container : 1320px;
    --pn-narrow    : 680px;
    --pn-gutter    : var(--space-4);
    --pn-side-w    : 260px;         /* filter rail */
    --pn-card-min  : 200px;
    --pn-card-max  : 230px;

    /* ══ 1h. Controls ═══════════════════════════════════════════════════ */
    --pn-hit    : 44px;
    --pn-btn-h  : 48px;
    --pn-input-h: 48px;

    /* ══ 1i. Focus / disabled ═══════════════════════════════════════════ */
    --pn-focus     : var(--primary-color, #C83B3B);
    --pn-focus-ring: 0 0 0 2px var(--pn-canvas), 0 0 0 4px var(--primary-color, #C83B3B);
    --pn-disabled-o: .45;

    --dur-fast : 160ms;
    --dur      : 280ms;
    --dur-slow : 480ms;
    --ease     : cubic-bezier(.22, .61, .36, 1);
    --ease-out : cubic-bezier(.16, 1, .3, 1);
}

@media (min-width: 768px)  { .lb-std { --pn-gutter: var(--space-5); --pn-card-min: 200px; --pn-card-max: 220px; } }
@media (min-width: 1280px) { .lb-std { --pn-gutter: var(--space-6); --pn-card-min: 220px; --pn-card-max: 235px; } }

/* ── 2. BASE ─────────────────────────────────────────────────────────────── */
.lb-std .lb-main,
.lb-std .auth-page-wrap {
    color: var(--pn-body);
    font-family: var(--pn-ff);
    font-size: var(--fs-body);
    line-height: var(--lh-body);
}
.lb-std .num-fa { font-family: var(--pn-ff); font-feature-settings: "tnum"; }

/* lebasino's style.css lets .container run to 1440px (the template's elementor
   sections cap themselves); the shared views lean on Bootstrap's .container, so
   their cards ran edge to edge. Same column as charmineh's .pn-container. */
.lb-std .lb-main .container { max-width: var(--pn-container); }

/* ─────────────────────────────────────────────────────────────────────────
   3. LAYOUT
   ───────────────────────────────────────────────────────────────────────── */
.lb-std .pn-container {
    width: 100%;
    max-width: var(--pn-container);
    margin-inline: auto;
    padding-inline: var(--pn-gutter);
}

.lb-std .shop-page {
    padding-block: var(--space-5) var(--space-10);
}

/* Filter rail + results. Replaces .row/.col-lg-3/.col-lg-9, which do not
   exist in this theme at all — Bootstrap is not loaded here, so the old
   markup had no grid whatsoever and every block stacked full width. */
.lb-std .shop-layout {
    display: grid;
    gap: var(--space-5);
    grid-template-columns: 1fr;
    align-items: start;
}

@media (min-width: 1024px) {
    .lb-std .shop-layout {
        grid-template-columns: var(--pn-side-w) minmax(0, 1fr);
        gap: var(--space-6);
    }
}

.lb-std .shop-layout-main { min-width: 0; }

/* ─────────────────────────────────────────────────────────────────────────
   4. BREADCRUMB
   ───────────────────────────────────────────────────────────────────────── */
.lb-std .shop-breadcrumb {
    padding-block: var(--space-3);
    border-bottom: 1px solid var(--pn-hairline);
    background: var(--pn-surface);
}

.lb-std .breadcrumb {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: var(--fs-body-sm);
}

.lb-std .breadcrumb-item { color: var(--pn-muted); }
.lb-std .breadcrumb-item a { color: var(--pn-muted); text-decoration: none; }
.lb-std .breadcrumb-item a:hover { color: var(--pn-link); }
.lb-std .breadcrumb-item.active { color: var(--pn-ink); font-family: var(--pn-ff-med); }

.lb-std .dash-breadcrumb { margin-bottom: var(--space-4); }

.lb-std .breadcrumb-item + .breadcrumb-item::before {
    content: "/";
    margin-inline-end: var(--space-2);
    color: var(--pn-hairline-strong);
}


/* ─────────────────────────────────────────────────────────────────────────
   11. BUTTONS / CTA
   ───────────────────────────────────────────────────────────────────────── */
.lb-std .pn-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    min-height: var(--pn-btn-h);
    padding-inline: var(--space-4);
    border: 1px solid transparent;
    border-radius: var(--pn-r-md);
    font-family: var(--pn-ff-med);
    font-size: var(--fs-body-sm);
    line-height: 1;
    text-decoration: none;
    cursor: pointer;
    transition: background-color var(--dur-fast) var(--ease),
                border-color var(--dur-fast) var(--ease),
                color var(--dur-fast) var(--ease);
}

/* primary = buy. The only orange on the page. */
.lb-std .pn-btn-buy {
    width: 100%;
    background: var(--pn-buy);
    color: var(--pn-buy-ink);          /* navy on orange — 5.60:1 */
    font-family: var(--pn-ff-bold);
}
.lb-std .pn-btn-buy:hover { background: var(--pn-buy-hover); }

/* secondary */
.lb-std .pn-btn-secondary {
    background: var(--pn-surface);
    border-color: var(--pn-hairline-strong);
    color: var(--pn-ink);
}
.lb-std .pn-btn-secondary:hover { background: var(--pn-sunken); }

/* solid blue — informational primary (apply filter, etc.) */
.lb-std .pn-btn-primary {
    background: var(--color-primary-500);
    color: #fff;
}
.lb-std .pn-btn-primary:hover { background: var(--color-primary-600); }

/* tertiary */
.lb-std .pn-btn-quiet {
    min-height: var(--pn-hit);
    padding-inline: var(--space-2);
    background: transparent;
    color: var(--pn-link);
}
.lb-std .pn-btn-quiet:hover { text-decoration: underline; }

.lb-std .price-range-btn {
    width: 100%;
    min-height: var(--pn-btn-h);
    border: 0;
    border-radius: var(--pn-r-md);
    background: var(--color-primary-500);
    color: #fff;
    font-family: var(--pn-ff-med);
    font-size: var(--fs-body-sm);
    cursor: pointer;
    transition: background-color var(--dur-fast) var(--ease);
}
.lb-std .price-range-btn:hover { background: var(--color-primary-600); }

.lb-std .pn-btn:disabled,
.lb-std .price-range-btn:disabled {
    opacity: var(--pn-disabled-o);
    cursor: not-allowed;
}


/* ─────────────────────────────────────────────────────────────────────────
   15. CART INTERACTION FEEDBACK
   product-card.js owns the request. This is presentation only.
   ───────────────────────────────────────────────────────────────────────── */
.lb-std .product-card-add-btn.is-busy { pointer-events: none; opacity: .85; }
.lb-std .product-card-add-btn.is-busy .pn-btn-icon { animation: pn-spin .7s linear infinite; }

/* product-card.js adds .added on a successful /cart/add */
.lb-std .product-card-add-btn.added {
    background: var(--pn-success);
    color: #fff;                       /* 5.44:1 */
}

@keyframes pn-spin { to { transform: rotate(360deg); } }

/* ─────────────────────────────────────────────────────────────────────────
   16. EMPTY / LOADING STATES
   ───────────────────────────────────────────────────────────────────────── */
.lb-std .pn-empty {
    display: grid;
    justify-items: center;
    gap: var(--space-3);
    padding: var(--space-10) var(--space-5);
    border-radius: var(--pn-r-lg);
    background: var(--pn-surface);
    text-align: center;
}
.lb-std .pn-empty-icon { font-size: 2.5rem; color: var(--pn-hairline-strong); }
.lb-std .pn-empty-title {
    font-family: var(--pn-ff-bold);
    font-size: var(--fs-h3);
    color: var(--pn-ink);
}
.lb-std .pn-empty-text {
    max-width: 42ch;
    font-size: var(--fs-body-sm);
    color: var(--pn-muted);
}

/* skeleton grid — shown while a filter request is in flight */
.lb-std .pn-skeleton-card {
    border-radius: var(--pn-r-lg);
    background: var(--pn-surface);
    padding: var(--space-3);
}
.lb-std .pn-skeleton-box {
    border-radius: var(--pn-r-md);
    background: linear-gradient(90deg, var(--pn-sunken) 25%, var(--pn-shimmer) 37%, var(--pn-sunken) 63%);
    background-size: 400% 100%;
    animation: pn-shimmer 1.4s ease infinite;
}
.lb-std .pn-skeleton-media { aspect-ratio: 1 / 1; margin-bottom: var(--space-3); }
.lb-std .pn-skeleton-line { height: 12px; margin-bottom: var(--space-2); }
.lb-std .pn-skeleton-line.is-short { width: 60%; }

@keyframes pn-shimmer {
    from { background-position: 100% 50%; }
    to   { background-position: 0 50%; }
}

.lb-std .is-loading-grid { opacity: .5; pointer-events: none; }

/* ─────────────────────────────────────────────────────────────────────────
   17. ACCESSIBILITY
   The bought template ships `*:focus{outline:transparent}` in
   tpl/assets/css/style.css, which removes the focus ring from every control
   in this theme. That rule is layer-free too, so this block restores a real
   focus indicator scoped to the theme.
   ───────────────────────────────────────────────────────────────────────── */
.lb-std :focus-visible {
    outline: 2px solid var(--pn-focus);
    outline-offset: 2px;
    border-radius: 4px;
}

.lb-std .pn-input:focus-visible,
.lb-std .sort-select:focus-visible,
.lb-std .price-range-inputs input:focus-visible {
    outline: none;
    border-color: var(--pn-focus);
    box-shadow: var(--pn-focus-ring);
}

.lb-std .pn-skip-link {
    position: absolute;
    inset-inline-start: -9999px;
    top: 0;
    z-index: 10000;
}
.lb-std .pn-skip-link:focus {
    inset-inline-start: var(--space-4);
    top: var(--space-4);
    padding: var(--space-3) var(--space-4);
    border-radius: var(--pn-r-md);
    background: var(--pn-surface);
    box-shadow: var(--pn-sh-3);
}

.lb-std .pn-visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
}


/* ── 29. STEPS ─────────────────────────────────────────────────────────── */
.lb-std .checkout-steps {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: var(--space-1);
    margin-bottom: var(--space-6);
}

.lb-std .step-item {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    min-height: var(--pn-hit);
    padding-inline: var(--space-4);
    border-radius: var(--pn-r-pill);
    background: var(--pn-surface);
    color: var(--pn-muted);
    font-size: var(--fs-body-sm);
}
.lb-std .step-item.active {
    background: var(--color-primary-500);
    color: #fff;                       /* 5.36:1 */
}
.lb-std .step-item.done {
    background: var(--color-primary-50);
    color: var(--color-primary-700);   /* 9.93:1 */
}

.lb-std .step-num {
    display: grid;
    place-items: center;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: var(--pn-sunken);
    color: var(--pn-muted);
    font-size: var(--fs-caption);
    font-family: var(--pn-ff-bold);
}
.lb-std .step-item.active .step-num { background: #fff; color: var(--color-primary-500); }
.lb-std .step-item.done .step-num { background: var(--color-primary-500); color: #fff; }

.lb-std .step-arrow { color: var(--pn-hairline-strong); }

@media (max-width: 575.98px) {
    .lb-std .step-item { padding-inline: var(--space-3); font-size: var(--fs-caption); }
    .lb-std .step-item span { display: none; }   /* numbers only on small screens */
    .lb-std .step-item.active span { display: inline; }
}

/* ── 30. BUY-PATH PAGE SHELL ───────────────────────────────────────────── */
.lb-std .cart-page,
.lb-std .checkout-page { padding-block: var(--space-6) var(--space-10); }

.lb-std .buy-layout {
    display: grid;
    gap: var(--space-5);
    grid-template-columns: 1fr;
    align-items: start;
}

@media (min-width: 1024px) {
    .lb-std .buy-layout {
        grid-template-columns: minmax(0, 1fr) 360px;
        gap: var(--space-6);
    }
}

.lb-std .buy-main { min-width: 0; }

/* ── 31. CART ITEMS ───────────────────────────────────────────────────────
   The original markup was a <table> that needed a 600px horizontal scroll on
   phones. Rebuilt as a list of grid rows: two columns on mobile, five on
   desktop. All ids the cart JS depends on are unchanged.                  */
.lb-std .cart-list {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.lb-std .cart-row {
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr) auto;
    grid-template-areas:
        "media info remove"
        "media price price"
        "media qty   total";
    gap: var(--space-2) var(--space-3);
    align-items: center;
    padding: var(--space-4);
    border-radius: var(--pn-r-lg);
    background: var(--pn-surface);
}

@media (min-width: 768px) {
    .lb-std .cart-row {
        grid-template-columns: 80px minmax(0, 1fr) auto auto auto;
        grid-template-areas: "media info price qty total remove";
        gap: var(--space-4);
    }
}

.lb-std .cart-cell-media  { grid-area: media; }
.lb-std .cart-cell-info   { grid-area: info; min-width: 0; }
.lb-std .cart-cell-price  { grid-area: price; }
.lb-std .cart-cell-qty    { grid-area: qty; }
.lb-std .cart-cell-total  { grid-area: total; }
.lb-std .cart-cell-remove { grid-area: remove; justify-self: end; }

.lb-std .cart-product-img {
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
    border-radius: var(--pn-r-md);
    background: var(--pn-sunken);
    object-fit: contain;
}

.lb-std .cart-product-title {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    font-size: var(--fs-body-sm);
    line-height: 1.5;
    color: var(--pn-ink);
    text-decoration: none;
}
.lb-std .cart-product-title:hover { color: var(--pn-link); }

.lb-std .cart-product-variant {
    margin-top: var(--space-1);
    font-size: var(--fs-caption);
    color: var(--pn-muted);
}

.lb-std .cart-price {
    font-family: var(--pn-ff-bold);
    font-size: var(--fs-body-sm);
    color: var(--pn-price);
    white-space: nowrap;
}
.lb-std .price-old {
    display: block;
    font-size: var(--fs-caption);
    color: var(--pn-muted);
    text-decoration: line-through;
}

.lb-std .cart-cell-label {
    display: block;
    font-size: var(--fs-caption);
    color: var(--pn-muted);
}
@media (min-width: 768px) {
    .lb-std .cart-cell-label { display: none; }   /* header row covers it */
}

.lb-std .cart-qty-control {
    display: inline-flex;
    align-items: center;
    border: 1px solid var(--pn-hairline-strong);
    border-radius: var(--pn-r-md);
    overflow: hidden;
}
.lb-std .cart-qty-control button {
    width: var(--pn-hit);
    height: var(--pn-hit);
    border: 0;
    background: var(--pn-surface);
    color: var(--pn-ink);
    cursor: pointer;
    transition: background-color var(--dur-fast) var(--ease);
}
.lb-std .cart-qty-control button:hover { background: var(--pn-sunken); }
.lb-std .cart-qty-control input {
    width: 44px;
    height: var(--pn-hit);
    border: 0;
    border-inline: 1px solid var(--pn-hairline-strong);
    background: var(--pn-surface);
    color: var(--pn-ink);
    font-family: var(--pn-ff-bold);
    font-size: var(--fs-body-sm);
    text-align: center;
    appearance: textfield;
    -moz-appearance: textfield;
}
.lb-std .cart-qty-control input::-webkit-outer-spin-button,
.lb-std .cart-qty-control input::-webkit-inner-spin-button { appearance: none; margin: 0; }

.lb-std .cart-remove-btn {
    display: grid;
    place-items: center;
    width: var(--pn-hit);
    height: var(--pn-hit);
    border: 0;
    border-radius: var(--pn-r-md);
    background: transparent;
    color: var(--pn-muted);
    cursor: pointer;
    transition: background-color var(--dur-fast) var(--ease),
                color var(--dur-fast) var(--ease);
}
.lb-std .cart-remove-btn:hover { background: var(--pn-sunken); color: var(--pn-danger); }

.lb-std .cart-actions { margin-top: var(--space-4); }

.lb-std .continue-shopping-link {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    min-height: var(--pn-hit);
    color: var(--pn-link);
    font-size: var(--fs-body-sm);
    text-decoration: none;
}
.lb-std .continue-shopping-link:hover { text-decoration: underline; }

.lb-std .cart-empty { max-width: 520px; margin-inline: auto; }

/* ── 32. ORDER SUMMARY ─────────────────────────────────────────────────── */
.lb-std .cart-summary-box {
    position: sticky;
    top: var(--space-4);
    padding: var(--space-5);
    border-radius: var(--pn-r-lg);
    background: var(--pn-surface);
    box-shadow: var(--pn-sh-1);
}

.lb-std .cart-summary-title {
    margin: 0 0 var(--space-4);
    padding-bottom: var(--space-3);
    border-bottom: 1px solid var(--pn-hairline);
    font-family: var(--pn-ff-bold);
    font-size: var(--fs-h3);
    color: var(--pn-ink);
}

.lb-std .summary-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    padding-block: var(--space-2);
    font-size: var(--fs-body-sm);
    color: var(--pn-body);
}

.lb-std .summary-row.total-row {
    margin-top: var(--space-2);
    padding-top: var(--space-3);
    border-top: 1px solid var(--pn-hairline);
    font-family: var(--pn-ff-bold);
    font-size: var(--fs-body);
    color: var(--pn-ink);
}
.lb-std .summary-amount {
    font-family: var(--pn-ff-black);
    font-size: var(--fs-body-lg);
    color: var(--pn-price);
}

.lb-std .summary-free,
.lb-std .summary-discount { color: var(--pn-success); }   /* 5.44:1 */

.lb-std .checkout-summary-items {
    margin-bottom: var(--space-3);
    padding-bottom: var(--space-3);
    border-bottom: 1px solid var(--pn-hairline);
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}
.lb-std .checkout-summary-item {
    display: flex;
    align-items: center;
    gap: var(--space-3);
}
.lb-std .checkout-summary-item .cart-product-img { width: 44px; flex-shrink: 0; }
.lb-std .checkout-summary-item-body { flex: 1; min-width: 0; }
.lb-std .checkout-summary-item-name {
    display: block;
    font-size: var(--fs-body-sm);
    color: var(--pn-ink);
}
.lb-std .checkout-summary-item-qty {
    display: block;
    font-size: var(--fs-caption);
    color: var(--pn-muted);
}
.lb-std .checkout-summary-item-price {
    font-family: var(--pn-ff-med);
    font-size: var(--fs-body-sm);
    color: var(--pn-price);
    white-space: nowrap;
}

.lb-std .checkout-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    width: 100%;
    min-height: var(--pn-btn-h);
    margin-top: var(--space-4);
    padding-inline: var(--space-4);
    border: 0;
    border-radius: var(--pn-r-md);
    background: var(--pn-buy);
    color: var(--pn-buy-ink);          /* navy on orange — 5.60:1 */
    font-family: var(--pn-ff-bold);
    font-size: var(--fs-body);
    text-decoration: none;
    cursor: pointer;
    transition: background-color var(--dur-fast) var(--ease);
}
.lb-std .checkout-btn:hover { background: var(--pn-buy-hover); }
.lb-std .checkout-btn:disabled { opacity: var(--pn-disabled-o); cursor: not-allowed; }
.lb-std .checkout-btn.is-loading { cursor: progress; }
.lb-std .checkout-btn.is-loading .js-submit-icon { animation: pn-spin .7s linear infinite; }

/* small helpers used by the checkout markup */
.lb-std .checkout-totals { display: block; }
.lb-std .checkout-note-field { margin-top: var(--space-4); }
.lb-std .checkout-wallet-body { flex: 1; min-width: 0; }
.lb-std .checkout-wallet-icon { color: var(--pn-success); }

.lb-std .checkout-trust-note {
    margin: var(--space-3) 0 0;
    font-size: var(--fs-caption);
    color: var(--pn-muted);
    text-align: center;
}

/* ── 33. CHECKOUT SECTIONS + FORM ──────────────────────────────────────── */
.lb-std .checkout-section {
    margin-bottom: var(--space-4);
    padding: var(--space-5);
    border-radius: var(--pn-r-lg);
    background: var(--pn-surface);
    box-shadow: var(--pn-sh-1);
}

.lb-std .checkout-section-title {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0 0 var(--space-4);
    font-family: var(--pn-ff-bold);
    font-size: var(--fs-h3);
    color: var(--pn-ink);
}
.lb-std .checkout-section-title i { color: var(--color-primary-500); }

.lb-std .checkout-fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }

.lb-std .contact-form-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-4);
}
@media (min-width: 640px) {
    .lb-std .contact-form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.lb-std .contact-form-group { display: flex; flex-direction: column; gap: var(--space-2); }
.lb-std .contact-form-group.full-width { grid-column: 1 / -1; }

.lb-std .contact-form-group label {
    font-family: var(--pn-ff-med);
    font-size: var(--fs-body-sm);
    color: var(--pn-body);
}

.lb-std .contact-form-group input,
.lb-std .contact-form-group select,
.lb-std .contact-form-group textarea {
    width: 100%;
    padding: var(--space-3) var(--space-4);
    border: 1px solid var(--pn-hairline-strong);
    border-radius: var(--pn-r-md);
    background: var(--pn-surface);
    color: var(--pn-ink);
    font-family: var(--pn-ff);
    font-size: var(--fs-body-sm);
    line-height: var(--lh-snug);
    transition: border-color var(--dur-fast) var(--ease),
                box-shadow var(--dur-fast) var(--ease);
}
.lb-std .contact-form-group input,
.lb-std .contact-form-group select { min-height: var(--pn-input-h); }
.lb-std .contact-form-group textarea { resize: vertical; }
.lb-std .contact-form-group input::placeholder,
.lb-std .contact-form-group textarea::placeholder { color: var(--pn-muted); }

.lb-std .contact-form-group input:focus-visible,
.lb-std .contact-form-group select:focus-visible,
.lb-std .contact-form-group textarea:focus-visible {
    outline: none;
    border-color: var(--pn-focus);
    box-shadow: var(--pn-focus-ring);
}

.lb-std .contact-form-group input[dir="ltr"] { direction: ltr; text-align: left; }

.lb-std .contact-form-group input.has-error,
.lb-std .contact-form-group select.has-error,
.lb-std .contact-form-group textarea.has-error {
    border-color: var(--pn-danger);
    box-shadow: 0 0 0 3px rgba(179, 38, 30, .16);
}
.lb-std .field-error {
    font-size: var(--fs-caption);
    line-height: var(--lh-snug);
    color: var(--pn-danger);
}

/* ── 34. SELECTABLE OPTION CARDS ───────────────────────────────────────── */
.lb-std .delivery-options-list,
.lb-std .payment-options-list {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.lb-std .delivery-option,
.lb-std .payment-option,
.lb-std .wallet-use-box {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    min-height: var(--pn-hit);
    padding: var(--space-4);
    border: 1px solid var(--pn-hairline-strong);
    border-radius: var(--pn-r-md);
    background: var(--pn-surface);
    cursor: pointer;
    transition: border-color var(--dur-fast) var(--ease),
                background-color var(--dur-fast) var(--ease);
}

.lb-std .delivery-option.selected,
.lb-std .payment-option.selected {
    border-color: var(--color-primary-400);
    background: var(--color-primary-50);
}

.lb-std .delivery-option:focus-within,
.lb-std .payment-option:focus-within,
.lb-std .wallet-use-box:focus-within,
.lb-std .gateway-option:focus-within {
    border-color: var(--pn-focus);
    box-shadow: var(--pn-focus-ring);
}

.lb-std .delivery-option input[type="radio"],
.lb-std .payment-option input[type="radio"],
.lb-std .wallet-use-box input[type="checkbox"] {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    accent-color: var(--color-primary-500);
    cursor: pointer;
}

.lb-std .delivery-option-icon,
.lb-std .payment-option-icon {
    flex-shrink: 0;
    color: var(--color-primary-500);
    font-size: 1.125rem;
}

.lb-std .delivery-option-title,
.lb-std .payment-option-title {
    font-family: var(--pn-ff-med);
    font-size: var(--fs-body-sm);
    color: var(--pn-ink);
}
.lb-std .delivery-option-desc,
.lb-std .payment-option-desc {
    font-size: var(--fs-caption);
    color: var(--pn-body);             /* 10.9:1 — muted fails at this size */
}
.lb-std .delivery-option-price {
    margin-inline-start: auto;
    font-family: var(--pn-ff-bold);
    font-size: var(--fs-body-sm);
    color: var(--pn-price);
    white-space: nowrap;
}

/* gateways */
.lb-std .gateway-list {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
    margin-block: var(--space-2);
    margin-inline-start: var(--space-7);
}
.lb-std .gateway-option {
    position: relative;
    display: flex;
    align-items: center;
    gap: var(--space-2);
    min-height: var(--pn-hit);
    min-width: 150px;
    padding-inline: var(--space-3);
    border: 1px solid var(--pn-hairline-strong);
    border-radius: var(--pn-r-md);
    background: var(--pn-surface);
    cursor: pointer;
    transition: border-color var(--dur-fast) var(--ease),
                background-color var(--dur-fast) var(--ease);
}
/* visually hidden but still focusable — display:none would drop the radio
   out of the tab order entirely and make gateways mouse-only */
.lb-std .gateway-option input {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: 0;
    opacity: 0;
    pointer-events: none;
}
.lb-std .gateway-option.selected {
    border-color: var(--color-primary-400);
    background: var(--color-primary-50);
}
.lb-std .gateway-logo { width: 28px; height: 28px; object-fit: contain; }
.lb-std .gateway-name {
    flex: 1;
    font-size: var(--fs-caption);
    color: var(--pn-ink);
}
.lb-std .gateway-check { opacity: 0; color: var(--color-primary-500); }
.lb-std .gateway-option.selected .gateway-check { opacity: 1; }

/* wallet */
.lb-std .wallet-use-box { background: var(--pn-sunken); margin-bottom: var(--space-4); }
.lb-std .wallet-use-box.checked {
    border-color: var(--pn-success);
    background: rgba(15, 122, 56, .07);
}
.lb-std .wallet-use-box .payment-option-icon { color: var(--pn-success); }
.lb-std .wallet-use-check { margin-inline-start: auto; opacity: 0; color: var(--pn-success); }
.lb-std .wallet-use-box.checked .wallet-use-check { opacity: 1; }

.lb-std .payment-methods-hint {
    margin-bottom: var(--space-2);
    font-size: var(--fs-body-sm);
    color: var(--pn-body);
}
.lb-std .payment-methods-hint b { color: var(--pn-price); }

.lb-std .wallet-covers-note {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin-top: var(--space-2);
    padding: var(--space-3) var(--space-4);
    border-radius: var(--pn-r-md);
    background: rgba(15, 122, 56, .07);
    color: var(--pn-success);
    font-size: var(--fs-body-sm);
}

/* ── 35. COUPON ───────────────────────────────────────────────────────── */
.lb-std .coupon-box { margin-block: var(--space-3); }
.lb-std .coupon-form { display: flex; gap: var(--space-2); }
.lb-std .coupon-input {
    flex: 1;
    min-width: 0;
    min-height: var(--pn-input-h);
    padding-inline: var(--space-3);
    border: 1px solid var(--pn-hairline-strong);
    border-radius: var(--pn-r-md);
    background: var(--pn-surface);
    color: var(--pn-ink);
    font-family: var(--pn-ff);
    font-size: var(--fs-body-sm);
}
.lb-std .coupon-btn {
    flex-shrink: 0;
    min-height: var(--pn-btn-h);
    padding-inline: var(--space-4);
    border: 1px solid var(--pn-hairline-strong);
    border-radius: var(--pn-r-md);
    background: var(--pn-surface);
    color: var(--pn-ink);
    font-family: var(--pn-ff-med);
    font-size: var(--fs-body-sm);
    cursor: pointer;
    transition: background-color var(--dur-fast) var(--ease);
}
.lb-std .coupon-btn:hover { background: var(--pn-sunken); }
.lb-std .coupon-btn:disabled { opacity: var(--pn-disabled-o); cursor: not-allowed; }

.lb-std .coupon-msg { margin-top: var(--space-2); font-size: var(--fs-caption); }
.lb-std .coupon-msg.ok  { color: var(--pn-success); }
.lb-std .coupon-msg.err { color: var(--pn-danger); }

/* ── 36. CHECKOUT ERROR + MOBILE BAR ───────────────────────────────────── */
.lb-std .checkout-error {
    margin-top: var(--space-4);
    padding: var(--space-3) var(--space-4);
    border: 1px solid rgba(179, 38, 30, .3);
    border-radius: var(--pn-r-md);
    background: rgba(179, 38, 30, .07);
    color: var(--pn-danger);
    font-size: var(--fs-body-sm);
    line-height: var(--lh-snug);
}

.lb-std .checkout-mobile-bar { display: none; }

@media (max-width: 1023.98px) {
    .lb-std .checkout-mobile-bar {
        display: flex;
        position: sticky;
        bottom: 0;
        z-index: 900;
        align-items: center;
        gap: var(--space-4);
        margin-top: var(--space-4);
        padding: var(--space-3) var(--space-4);
        padding-bottom: calc(var(--space-3) + env(safe-area-inset-bottom, 0px));
        border-top: 1px solid var(--pn-hairline);
        background: var(--pn-surface);
        box-shadow: 0 -8px 24px rgba(28, 25, 23, .10);
    }
    .lb-std .checkout-mobile-bar-label {
        display: block;
        font-size: var(--fs-caption);
        color: var(--pn-muted);
    }
    .lb-std .checkout-mobile-bar-value {
        display: block;
        font-family: var(--pn-ff-black);
        font-size: var(--fs-body-lg);
        color: var(--pn-price);
        white-space: nowrap;
    }
    .lb-std .checkout-mobile-bar-amount { min-width: 0; }
    .lb-std .checkout-mobile-bar .checkout-btn { flex: 1; margin-top: 0; }
    /* charmineh hides the summary's .checkout-btn here because its own views add
       .checkout-mobile-bar. The shared /Views/Cart and /Views/Checkout have no
       bar, so that rule left a phone with no way to check out — dropped. */
    .lb-std .cart-summary-box { position: static; }
}

/* ── 37. ORDER CONFIRMATION ────────────────────────────────────────────── */
.lb-std .order-done-page {
    display: grid;
    place-items: center;
    min-height: 60vh;
    padding-block: var(--space-9);
}

.lb-std .order-done-card {
    width: 100%;
    max-width: 540px;
    margin-inline: auto;
    padding: var(--space-8) var(--space-6);
    border-radius: var(--pn-r-xl);
    background: var(--pn-surface);
    box-shadow: var(--pn-sh-2);
    text-align: center;
}

.lb-std .order-done-icon {
    display: grid;
    place-items: center;
    width: 72px;
    height: 72px;
    margin: 0 auto var(--space-5);
    border-radius: 50%;
    background: var(--pn-success);
    color: #fff;                       /* 5.44:1 */
    font-size: 1.75rem;
}

.lb-std .order-done-title {
    margin: 0 0 var(--space-3);
    font-family: var(--pn-ff-black);
    font-size: var(--fs-h2);
    color: var(--pn-ink);              /* ink, not green — the tick already says success */
}

.lb-std .order-done-code {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    margin-block: var(--space-4);
    padding: var(--space-3) var(--space-4);
    border-radius: var(--pn-r-md);
    background: var(--pn-sunken);
    font-size: var(--fs-body-sm);
    color: var(--pn-body);
}
.lb-std .order-done-code strong {
    font-family: var(--pn-ff-bold);
    color: var(--pn-ink);
}

.lb-std .order-done-desc {
    margin: 0 0 var(--space-5);
    font-size: var(--fs-body-sm);
    line-height: var(--lh-body);
    color: var(--pn-body);
}

.lb-std .order-done-summary {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    margin-bottom: var(--space-5);
    padding: var(--space-4);
    border-radius: var(--pn-r-md);
    background: var(--pn-sunken);
    text-align: start;
}
.lb-std .order-done-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    font-size: var(--fs-body-sm);
    color: var(--pn-body);
}
.lb-std .order-done-row .amount {
    font-family: var(--pn-ff-black);
    font-size: var(--fs-body-lg);
    color: var(--pn-price);
}

.lb-std .order-done-actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-3);
    justify-content: center;
}

.lb-std .order-done-btn-primary,
.lb-std .order-done-btn-secondary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    min-height: var(--pn-btn-h);
    padding-inline: var(--space-5);
    border: 1px solid transparent;
    border-radius: var(--pn-r-md);
    font-family: var(--pn-ff-med);
    font-size: var(--fs-body-sm);
    text-decoration: none;
}
.lb-std .order-done-btn-primary {
    background: var(--color-primary-500);
    color: #fff;
}
.lb-std .order-done-btn-primary:hover { background: var(--color-primary-600); }
.lb-std .order-done-btn-secondary {
    border-color: var(--pn-hairline-strong);
    background: var(--pn-surface);
    color: var(--pn-ink);
}
.lb-std .order-done-btn-secondary:hover { background: var(--pn-sunken); }

.lb-std .order-done-home {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    min-height: var(--pn-hit);
    margin-top: var(--space-3);
    color: var(--pn-muted);
    font-size: var(--fs-body-sm);
    text-decoration: none;
}
.lb-std .order-done-home:hover { color: var(--pn-link); }


.lb-std .faq-accordion { display: grid; gap: var(--space-2); }

.lb-std .faq-item {
    border: 1px solid var(--pn-hairline);
    border-radius: var(--pn-r-md);
    overflow: hidden;
}
.lb-std .faq-item.open { border-color: var(--pn-hairline-strong); }

.lb-std .faq-question {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    width: 100%;
    min-height: var(--pn-hit);
    padding: var(--space-3) var(--space-4);
    border: 0;
    background: transparent;
    color: var(--pn-ink);
    font-family: var(--pn-ff-med);
    font-size: var(--fs-body-sm);
    text-align: start;
    cursor: pointer;
}
.lb-std .faq-question:hover { background: var(--pn-sunken); }

.lb-std .faq-icon {
    flex-shrink: 0;
    color: var(--pn-muted);
    transition: transform var(--dur) var(--ease);
}
.lb-std .faq-item.open .faq-icon { transform: rotate(180deg); }

.lb-std .faq-answer {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows var(--dur) var(--ease);
}
.lb-std .faq-item.open .faq-answer { grid-template-rows: 1fr; }

.lb-std .faq-answer > .faq-answer-body {
    overflow: hidden;
    padding-inline: var(--space-4);
    font-size: var(--fs-body-sm);
    line-height: var(--lh-body);
    color: var(--pn-body);
}
.lb-std .faq-answer-body > p { margin: 0; }
.lb-std .faq-item.open .faq-answer > .faq-answer-body { padding-bottom: var(--space-4); }
.lb-std .faq-asked-by {
    margin-top: var(--space-2);
    font-size: var(--fs-caption);
    color: var(--pn-muted);
}


.lb-std .page-hero {
    padding-block: var(--space-8);
    border-bottom: 1px solid var(--pn-hairline);
    background: var(--pn-sunken);
    text-align: center;
}
.lb-std .page-hero-title {
    margin: 0;
    font-family: var(--pn-ff-black);
    font-size: var(--fs-h1);
    line-height: var(--lh-heading);
    color: var(--pn-ink);
}
.lb-std .page-hero-desc {
    margin: var(--space-2) 0 0;
    font-size: var(--fs-body);
    color: var(--pn-muted);
}

.lb-std .static-page { padding-block: var(--space-8) var(--space-10); }
.lb-std .static-section + .static-section { margin-top: var(--space-8); }

.lb-std .static-sec-head { margin-bottom: var(--space-5); text-align: center; }
.lb-std .static-sec-title {
    margin: 0;
    font-family: var(--pn-ff-black);
    font-size: var(--fs-h2);
    line-height: var(--lh-heading);
    color: var(--pn-ink);
}
.lb-std .static-sec-sub {
    margin: var(--space-2) 0 0;
    font-size: var(--fs-body-sm);
    color: var(--pn-muted);
}

.lb-std .about-intro {
    display: grid;
    gap: var(--space-6);
    align-items: center;
}
@media (min-width: 900px) {
    .lb-std .about-intro { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
}

.lb-std .about-intro-img {
    border-radius: var(--pn-r-lg);
    background: var(--pn-sunken);
    overflow: hidden;
}
.lb-std .about-intro-img img { display: block; width: 100%; height: auto; }

.lb-std .about-intro-text h2 {
    margin: 0 0 var(--space-3);
    font-family: var(--pn-ff-black);
    font-size: var(--fs-h2);
    line-height: var(--lh-heading);
    color: var(--pn-ink);
}
.lb-std .about-intro-text p {
    margin: 0 0 var(--space-3);
    font-size: var(--fs-body);
    line-height: var(--lh-body);
    color: var(--pn-body);
    text-align: justify;
}

.lb-std .about-stats-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-4);
}
@media (min-width: 768px) {
    .lb-std .about-stats-row { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
.lb-std .about-stat-card {
    padding: var(--space-5) var(--space-3);
    border: 1px solid var(--pn-hairline);
    border-radius: var(--pn-r-lg);
    background: var(--pn-surface);
    text-align: center;
}
.lb-std .about-stat-num {
    font-family: var(--pn-ff-black);
    font-size: var(--fs-h2);
    color: var(--pn-buy);
    font-variant-numeric: tabular-nums;
}
.lb-std .about-stat-label {
    margin-top: var(--space-1);
    font-size: var(--fs-body-sm);
    color: var(--pn-muted);
}

.lb-std .value-grid,
.lb-std .team-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: var(--space-4);
}

.lb-std .value-card { padding: var(--space-5) var(--space-3); text-align: center; }
.lb-std .value-icon {
    display: grid;
    place-items: center;
    width: 64px;
    height: 64px;
    margin: 0 auto var(--space-3);
    border-radius: var(--pn-r-lg);
    background: var(--pn-sunken);
    font-size: 1.75rem;
    color: var(--pn-buy);
}
.lb-std .value-card h3 {
    margin: 0 0 var(--space-2);
    font-family: var(--pn-ff-med);
    font-size: var(--fs-body-lg);
    color: var(--pn-ink);
}
.lb-std .value-card p {
    margin: 0;
    font-size: var(--fs-body-sm);
    line-height: var(--lh-body);
    color: var(--pn-muted);
}

.lb-std .team-member-card {
    padding: var(--space-5) var(--space-3);
    border: 1px solid var(--pn-hairline);
    border-radius: var(--pn-r-lg);
    background: var(--pn-surface);
    text-align: center;
}
.lb-std .team-avatar {
    display: grid;
    place-items: center;
    width: 72px;
    height: 72px;
    margin: 0 auto var(--space-3);
    border-radius: 50%;
    background: var(--pn-sunken);
    font-size: 1.75rem;
    color: var(--pn-muted);
}
.lb-std .team-name {
    font-family: var(--pn-ff-med);
    font-size: var(--fs-body);
    color: var(--pn-ink);
}
.lb-std .team-role { margin-top: 2px; font-size: var(--fs-body-sm); color: var(--pn-muted); }

.lb-std .contact-info-cards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: var(--space-4);
}
.lb-std .contact-info-card {
    padding: var(--space-5);
    border: 1px solid var(--pn-hairline);
    border-radius: var(--pn-r-lg);
    background: var(--pn-surface);
    text-align: center;
}
.lb-std .contact-info-icon {
    display: grid;
    place-items: center;
    width: 56px;
    height: 56px;
    margin: 0 auto var(--space-3);
    border-radius: 50%;
    background: var(--pn-sunken);
    font-size: 1.375rem;
    color: var(--pn-buy);
}
.lb-std .contact-info-title {
    margin: 0 0 var(--space-2);
    font-family: var(--pn-ff-med);
    font-size: var(--fs-body);
    color: var(--pn-ink);
}
.lb-std .contact-info-value {
    margin: 0;
    font-size: var(--fs-body-sm);
    line-height: var(--lh-body);
    color: var(--pn-body);
}
.lb-std .contact-info-value a { color: var(--pn-ink); text-decoration: none; }
.lb-std .contact-info-value a:hover { text-decoration: underline; }
.lb-std .contact-info-note { display: block; font-size: var(--fs-caption); color: var(--pn-muted); }

.lb-std .contact-layout { display: grid; gap: var(--space-5); align-items: start; }
@media (min-width: 900px) {
    .lb-std .contact-layout { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); }
}

.lb-std .contact-form-section,
.lb-std .contact-social {
    padding: var(--space-5);
    border: 1px solid var(--pn-hairline);
    border-radius: var(--pn-r-lg);
    background: var(--pn-surface);
}
.lb-std .contact-form-section > .static-sec-head { text-align: start; }

.lb-std .contact-submit-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    margin-top: var(--space-4);
    min-height: var(--pn-btn-h);
    padding-inline: var(--space-6);
    border: 0;
    border-radius: var(--pn-r-md);
    background: var(--pn-buy);
    color: var(--pn-buy-ink);
    font-family: var(--pn-ff-med);
    font-size: var(--fs-body);
    cursor: pointer;
    transition: background-color var(--dur) var(--ease);
}
.lb-std .contact-submit-btn:hover { background: var(--pn-buy-hover); }

.lb-std .contact-map {
    display: grid;
    place-items: center;
    gap: var(--space-2);
    height: 260px;
    margin-bottom: var(--space-4);
    border: 1px solid var(--pn-hairline);
    border-radius: var(--pn-r-lg);
    background: var(--pn-sunken);
    color: var(--pn-muted);
    font-size: var(--fs-body-sm);
}
.lb-std .contact-map > i { font-size: 2rem; color: var(--pn-hairline-strong); }

.lb-std .contact-social h3 {
    margin: 0 0 var(--space-4);
    font-family: var(--pn-ff-med);
    font-size: var(--fs-body-lg);
    color: var(--pn-ink);
}
.lb-std .social-list { display: grid; gap: var(--space-2); }
.lb-std .social-row {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    min-height: var(--pn-hit);
    padding: var(--space-2) var(--space-3);
    border: 1px solid var(--pn-hairline);
    border-radius: var(--pn-r-md);
    color: inherit;
    text-decoration: none;
    transition: border-color var(--dur-fast) var(--ease), background-color var(--dur-fast) var(--ease);
}
.lb-std .social-row:hover { border-color: var(--pn-hairline-strong); background: var(--pn-sunken); }
.lb-std .social-icon {
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    flex-shrink: 0;
    border-radius: 50%;
    background: var(--pn-sunken);
    font-size: 1.125rem;
    color: var(--pn-ink);
}
.lb-std .social-name { display: block; font-size: var(--fs-body-sm); color: var(--pn-ink); }
.lb-std .social-handle {
    display: block;
    font-size: var(--fs-caption);
    color: var(--pn-muted);
    overflow-wrap: anywhere;
}

.lb-std .faq-page-body { max-width: 860px; margin-inline: auto; }

.lb-std .faq-search-bar {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    height: var(--pn-input-h);
    padding-inline: var(--space-4);
    margin-bottom: var(--space-4);
    border: 1px solid var(--pn-hairline-strong);
    border-radius: var(--pn-r-pill);
    background: var(--pn-surface);
    color: var(--pn-muted);
}
.lb-std .faq-search-bar:focus-within {
    border-color: var(--pn-focus);
    box-shadow: var(--pn-focus-ring);
}
.lb-std .faq-search-bar input {
    flex: 1;
    min-width: 0;
    border: 0;
    background: transparent;
    color: var(--pn-ink);
    font-family: inherit;
    font-size: var(--fs-body);
    outline: 0;
}

.lb-std .faq-category-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
    margin-bottom: var(--space-5);
}
.lb-std .faq-tab {
    min-height: 36px;
    padding-inline: var(--space-4);
    border: 1px solid var(--pn-hairline-strong);
    border-radius: var(--pn-r-pill);
    background: var(--pn-surface);
    color: var(--pn-body);
    font-family: inherit;
    font-size: var(--fs-body-sm);
    cursor: pointer;
    transition: border-color var(--dur-fast) var(--ease),
                background-color var(--dur-fast) var(--ease),
                color var(--dur-fast) var(--ease);
}
.lb-std .faq-tab:hover { border-color: var(--pn-ink); }
.lb-std .faq-tab.active {
    border-color: var(--pn-ink);
    background: var(--pn-buy);
    color: var(--pn-surface);
}

.lb-std .faq-empty {
    padding: var(--space-8) var(--space-4);
    text-align: center;
    font-size: var(--fs-body-sm);
    color: var(--pn-muted);
}

.lb-std .compare-page { padding-block: var(--space-5) var(--space-10); }

.lb-std .cmp-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    flex-wrap: wrap;
    margin-bottom: var(--space-5);
}
.lb-std .cmp-title {
    margin: 0;
    font-family: var(--pn-ff-black);
    font-size: var(--fs-h1);
    line-height: var(--lh-heading);
    color: var(--pn-ink);
}
.lb-std .cmp-add-more {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    min-height: var(--pn-hit);
    padding-inline: var(--space-4);
    border: 1px solid var(--pn-hairline-strong);
    border-radius: var(--pn-r-md);
    color: var(--pn-ink);
    font-size: var(--fs-body-sm);
    text-decoration: none;
    transition: border-color var(--dur-fast) var(--ease), background-color var(--dur-fast) var(--ease);
}
.lb-std .cmp-add-more:hover { border-color: var(--pn-ink); background: var(--pn-sunken); }

.lb-std .cmp-empty {
    display: grid;
    justify-items: center;
    gap: var(--space-2);
    padding: var(--space-10) var(--space-4);
    border: 1px solid var(--pn-hairline);
    border-radius: var(--pn-r-lg);
    background: var(--pn-surface);
    text-align: center;
}
.lb-std .cmp-empty > i { font-size: 2rem; color: var(--pn-hairline-strong); }
.lb-std .cmp-empty p { margin: 0; font-size: var(--fs-body-lg); color: var(--pn-ink); }
.lb-std .cmp-empty span { font-size: var(--fs-body-sm); color: var(--pn-muted); }
.lb-std .cmp-shop-btn {
    margin-top: var(--space-3);
    min-height: var(--pn-btn-h);
    padding-inline: var(--space-6);
    display: inline-flex;
    align-items: center;
    border-radius: var(--pn-r-md);
    background: var(--pn-buy);
    color: var(--pn-buy-ink);
    font-family: var(--pn-ff-med);
    font-size: var(--fs-body);
    text-decoration: none;
    transition: background-color var(--dur) var(--ease);
}
.lb-std .cmp-shop-btn:hover { background: var(--pn-buy-hover); }

.lb-std .cmp-table-wrap {
    overflow-x: auto;
    border: 1px solid var(--pn-hairline);
    border-radius: var(--pn-r-lg);
    background: var(--pn-surface);
}

.lb-std .cmp-table {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--fs-body-sm);
}
.lb-std .cmp-table th,
.lb-std .cmp-table td {
    padding: var(--space-3) var(--space-4);
    border-bottom: 1px solid var(--pn-hairline);
    color: var(--pn-body);
    text-align: center;
    vertical-align: middle;
}
.lb-std .cmp-table tr:last-child > * { border-bottom: 0; }

.lb-std .cmp-table tbody tr:nth-child(even) { background: var(--pn-sunken); }

.lb-std .cmp-row-head {
    position: sticky;
    inset-inline-start: 0;
    z-index: 1;
    min-width: 120px;
    background: var(--pn-surface);
    color: var(--pn-ink);
    font-family: var(--pn-ff-med);
    text-align: start;
    white-space: nowrap;
}
.lb-std .cmp-table tbody tr:nth-child(even) .cmp-row-head { background: var(--pn-sunken); }

.lb-std .cmp-table thead th {
    position: relative;
    min-width: 180px;
    background: var(--pn-surface);
    vertical-align: top;
}
.lb-std .cmp-table thead .cmp-row-head { z-index: 2; }

.lb-std .cmp-product {
    display: grid;
    justify-items: center;
    gap: var(--space-2);
    color: inherit;
    text-decoration: none;
}

.lb-std .cmp-product picture { display: block; width: 100%; max-width: 140px; }
.lb-std .cmp-product img {
    width: 100%;
    max-width: 140px;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    border-radius: var(--pn-r-md);
    background: var(--pn-sunken);
}
.lb-std .cmp-product-name {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    font-family: var(--pn-ff-med);
    font-size: var(--fs-body-sm);
    line-height: 1.5;
    color: var(--pn-ink);
}
.lb-std .cmp-product:hover .cmp-product-name { text-decoration: underline; }

.lb-std .cmp-remove {
    position: absolute;
    inset-inline-end: var(--space-2);
    top: var(--space-2);
    z-index: 1;
    display: grid;
    place-items: center;
    width: 28px;
    height: 28px;
    border: 1px solid var(--pn-hairline-strong);
    border-radius: 50%;
    background: var(--pn-surface);
    color: var(--pn-muted);
    font-size: var(--fs-body-lg);
    line-height: 1;
    cursor: pointer;
    transition: color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease);
}
.lb-std .cmp-remove:hover { border-color: var(--pn-danger); color: var(--pn-danger); }

.lb-std .cmp-price {
    font-family: var(--pn-ff-black);
    font-size: var(--fs-body-lg);
    color: var(--pn-price);
}
.lb-std .cmp-price-old {
    font-size: var(--fs-caption);
    color: var(--pn-muted);
    text-decoration: line-through;
}

.lb-std .cmp-yes { color: var(--pn-success); }
.lb-std .cmp-no  { color: var(--pn-danger); }
.lb-std .cmp-none { color: var(--pn-muted); }

.lb-std .cmp-cart-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    width: 100%;
    min-height: var(--pn-btn-h);
    padding-inline: var(--space-4);
    border: 0;
    border-radius: var(--pn-r-md);
    background: var(--pn-buy);
    color: var(--pn-buy-ink);
    font-family: var(--pn-ff-med);
    font-size: var(--fs-body-sm);
    cursor: pointer;
    transition: background-color var(--dur) var(--ease);
}
.lb-std .cmp-cart-btn:hover { background: var(--pn-buy-hover); }

.lb-std .compare-bar {
    position: fixed;
    inset-inline: 0;
    bottom: 0;
    z-index: 120;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: var(--space-3);
    padding: var(--space-3) var(--space-4);
    padding-bottom: calc(var(--space-3) + env(safe-area-inset-bottom, 0px));
    background: var(--pn-buy);
    color: var(--pn-surface);
    box-shadow: 0 -4px 24px rgba(28, 25, 23, .18);
    animation: cb-rise var(--dur) var(--ease-out);
}

@media (max-width: 767.98px) {
    .lb-std .compare-bar { bottom: 56px; }
}

@keyframes cb-rise {
    from { transform: translateY(100%); }
    to   { transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
    .lb-std .compare-bar { animation: none; }
}

.lb-std .cb-count {
    font-family: var(--pn-ff-med);
    font-size: var(--fs-body-sm);
    color: rgba(255, 255, 255, .82);
}

.lb-std .cb-go {
    display: inline-flex;
    align-items: center;
    min-height: var(--pn-hit);
    padding-inline: var(--space-5);
    border-radius: var(--pn-r-md);
    background: var(--pn-buy);
    color: var(--pn-buy-ink);
    font-family: var(--pn-ff-med);
    font-size: var(--fs-body-sm);
    text-decoration: none;
    transition: background-color var(--dur) var(--ease);
}
.lb-std .cb-go:hover { background: var(--pn-buy-hover); }

.lb-std .cb-clear {
    min-height: var(--pn-hit);
    padding-inline: var(--space-4);
    border: 1px solid rgba(255, 255, 255, .28);
    border-radius: var(--pn-r-md);
    background: transparent;
    color: rgba(255, 255, 255, .82);
    font-family: inherit;
    font-size: var(--fs-body-sm);
    cursor: pointer;
    transition: border-color var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease);
}
.lb-std .cb-clear:hover { border-color: #fff; color: #fff; }

.lb-std .compare-btn.active {
    border-color: var(--pn-ink);
    background: var(--pn-buy);
    color: var(--pn-surface);
}

.lb-std:has(.compare-bar) { padding-bottom: 72px; }

.lb-std .cart-qty-control button:disabled {
    opacity: var(--pn-disabled-o);
    cursor: not-allowed;
}
.lb-std .cart-qty-control button:disabled:hover { background: transparent; }

.lb-std .cart-qty-note {
    display: block;
    margin-top: var(--space-1);
    font-size: var(--fs-caption);
    line-height: 1.5;
    color: var(--pn-danger);
}

.lb-std .auth-page-wrap {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: var(--space-8) var(--pn-gutter) var(--space-10);
    background: var(--pn-canvas);
}

.lb-std .auth-card {
    width: 100%;
    max-width: 460px;
    overflow: hidden;
    border: 1px solid var(--pn-hairline);
    border-radius: var(--pn-r-lg);
    background: var(--pn-surface);
    box-shadow: var(--pn-sh-2);
}

.lb-std .auth-card-header {
    padding: var(--space-6) var(--space-6) var(--space-5);
    background: var(--color-primary-600);
    color: #fff;
    text-align: center;
}

.lb-std .auth-brand-logo {
    display: block;
    margin-bottom: var(--space-2);
    font-family: var(--pn-ff-black);
    font-size: var(--fs-h2);
    line-height: var(--lh-heading);
    color: #fff;
}

.lb-std .auth-header-title {
    margin: 0;
    font-family: var(--pn-ff);
    font-size: var(--fs-body);
    line-height: var(--lh-snug);
    color: rgba(255, 255, 255, .78);
}

.lb-std .auth-card-body { padding: var(--space-6); }

.lb-std .auth-step-desc {
    margin: 0 0 var(--space-5);
    font-size: var(--fs-body-sm);
    line-height: var(--lh-body);
    color: var(--pn-muted);
    text-align: center;
}
.lb-std .auth-step-desc strong {
    font-family: var(--pn-ff-bold);
    color: var(--pn-ink);
}

.lb-std .auth-input-group {
    position: relative;
    margin-bottom: var(--space-3);
}

.lb-std .auth-input-icon {
    position: absolute;
    inset-inline-start: var(--space-3);
    top: 50%;
    transform: translateY(-50%);
    color: var(--pn-muted);
    font-size: 1rem;
    line-height: 1;
    pointer-events: none;
}

.lb-std .auth-input-group input,
.lb-std .captcha-row .text-box {
    width: 100%;
    height: var(--pn-input-h);
    padding-inline: var(--space-8) var(--space-3);
    border: 1px solid var(--pn-hairline-strong);
    border-radius: var(--pn-r-md);
    background: var(--pn-surface);
    color: var(--pn-ink);
    font-family: var(--pn-ff);
    font-size: var(--fs-body);
    transition: border-color var(--dur-fast) var(--ease),
                box-shadow var(--dur-fast) var(--ease);
}
.lb-std .captcha-row .text-box { padding-inline: var(--space-3); }

.lb-std .auth-input-group input::placeholder,
.lb-std .captcha-row .text-box::placeholder { color: var(--pn-muted); }

.lb-std .auth-input-group input:focus-visible,
.lb-std .captcha-row .text-box:focus-visible {
    outline: none;
    border-color: var(--pn-focus);
    box-shadow: var(--pn-focus-ring);
}

.lb-std .auth-input-group input[readonly] {
    background: var(--pn-sunken);
    color: var(--pn-muted);
}

.lb-std .auth-input-group input[type="number"] { -moz-appearance: textfield; }
.lb-std .auth-input-group input[type="number"]::-webkit-outer-spin-button,
.lb-std .auth-input-group input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.lb-std .auth-card-body .text-danger {
    display: block;
    margin: calc(var(--space-2) * -1) 0 var(--space-3);
    font-size: var(--fs-caption);
    line-height: var(--lh-snug);
    color: var(--pn-danger);
}

.lb-std .auth-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    width: 100%;
    min-height: var(--pn-btn-h);
    margin-top: var(--space-4);
    padding-inline: var(--space-4);
    border: 0;
    border-radius: var(--pn-r-md);
    background: var(--color-primary-500);
    color: #fff;
    font-family: var(--pn-ff-bold);
    font-size: var(--fs-body);
    line-height: 1;
    cursor: pointer;
    transition: background-color var(--dur-fast) var(--ease);
}
.lb-std .auth-btn:hover { background: var(--color-primary-600); }
.lb-std .auth-btn:disabled {
    opacity: var(--pn-disabled-o);
    cursor: not-allowed;
}

.lb-std .auth-links-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    margin-top: var(--space-4);
}
.lb-std .auth-links-row a {
    color: var(--pn-link);
    font-size: var(--fs-body-sm);
    text-decoration: underline;
    text-underline-offset: 3px;
}
.lb-std .auth-links-row a:hover { color: var(--pn-body); }

.lb-std .auth-home-link {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    margin-top: var(--space-5);
    padding-top: var(--space-4);
    border-top: 1px solid var(--pn-hairline);
    color: var(--pn-muted);
    font-size: var(--fs-body-sm);
    text-decoration: none;
}
.lb-std .auth-home-link:hover { color: var(--pn-ink); }

.lb-std .auth-check-label {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: var(--space-4) 0 0;
    font-size: var(--fs-body-sm);
    line-height: var(--lh-snug);
    color: var(--pn-body);
    cursor: pointer;
}
.lb-std .auth-check-label input[type="checkbox"] {
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    accent-color: var(--color-primary-500);
}
.lb-std .auth-check-label a {
    color: var(--pn-link);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.lb-std .captcha-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-2);
    margin-top: var(--space-3);
}
/* DNTCaptcha wraps image + refresh + input in one plain <div>; make that the row
   so the refresh button stays beside the image instead of dropping under it. */
.lb-std .captcha-row > div {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-2);
    width: 100%;
}
.lb-std .captcha-row img {
    flex: 0 1 auto;
    max-width: calc(100% - var(--pn-hit) - var(--space-2));
    border: 1px solid var(--pn-hairline-strong);
    border-radius: var(--pn-r-sm);
    background: #fff;
}
.lb-std .captcha-row .text-box { flex: 1 0 100%; }
.lb-std .captcha-row .captcha-refresh {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--pn-hit);
    height: var(--pn-hit);
    border: 1px solid var(--pn-hairline-strong);
    border-radius: var(--pn-r-md);
    background: var(--pn-surface);
    color: var(--pn-ink);
    font-size: 1rem;
    line-height: 1;
    text-decoration: none;
    cursor: pointer;
}
.lb-std .captcha-row .captcha-refresh:hover { background: var(--pn-sunken); }
.lb-std .captcha-row .text-danger { flex-basis: 100%; }

.lb-std .timerLogin {
    margin-top: var(--space-3);
    font-family: var(--pn-ff-med);
    font-size: var(--fs-body);
    color: var(--pn-ink);
    text-align: center;
}
.lb-std .timerLogin:empty { display: none; }
/* پلاگینِ simple.timer برای دقیقه و ثانیه div جدا می‌سازد؛ بدونِ flex دو خطی می‌شد. */
.lb-std .timerLogin { display: flex; justify-content: center; align-items: baseline; direction: ltr; }
.lb-std .timerLogin > div:empty { display: none; }

.lb-std .auth-resend-row {
    display: flex;
    justify-content: center;
    margin-top: var(--space-3);
}
.lb-std #retrieve-code {
    min-height: var(--pn-hit);
    padding-inline: var(--space-5);
    border: 1px solid var(--pn-hairline-strong);
    border-radius: var(--pn-r-md);
    background: var(--pn-surface);
    color: var(--pn-ink);
    font-family: var(--pn-ff-med);
    font-size: var(--fs-body-sm);
    cursor: pointer;
    transition: background-color var(--dur-fast) var(--ease);
}
.lb-std #retrieve-code:hover { background: var(--pn-sunken); }

.lb-std .d-none { display: none; }

@media (max-width: 575px) {
    .lb-std .auth-card-header { padding: var(--space-5) var(--space-4); }
    .lb-std .auth-card-body   { padding: var(--space-5) var(--space-4); }
    .lb-std .auth-links-row   { flex-direction: column; align-items: stretch; text-align: center; }
}

.lb-std .auction-page {
    padding-block: var(--space-6) var(--space-10);
    background: var(--pn-canvas);
}

.lb-std .auction-head { margin-bottom: var(--space-6); }
.lb-std .auction-head h1 {
    margin: 0 0 var(--space-2);
    font-family: var(--pn-ff-black);
    font-size: var(--fs-h1);
    line-height: var(--lh-heading);
    color: var(--pn-ink);
}
.lb-std .auction-head p {
    margin: 0;
    font-size: var(--fs-body);
    line-height: var(--lh-body);
    color: var(--pn-muted);
}
.lb-std .auction-head span { color: var(--pn-ink); }

.lb-std .auction-empty {
    padding: var(--space-9) var(--space-5);
    border: 1px dashed var(--pn-hairline-strong);
    border-radius: var(--pn-r-lg);
    background: var(--pn-surface);
    color: var(--pn-muted);
    font-size: var(--fs-body);
    text-align: center;
}

.lb-std .auction-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(var(--pn-card-min), 1fr));
    gap: var(--pn-gutter);
}

.lb-std .auction-card {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid var(--pn-hairline);
    border-radius: var(--pn-r-lg);
    background: var(--pn-surface);
    color: inherit;
    text-decoration: none;
    transition: border-color var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.lb-std .auction-card:hover {
    border-color: var(--pn-hairline-strong);
    box-shadow: var(--pn-sh-2);
}

.lb-std .auction-card-media {
    position: relative;
    aspect-ratio: 1 / 1;
    background: var(--pn-sunken);
}
.lb-std .auction-card-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.lb-std .auction-chip {
    position: absolute;
    inset-block-start: var(--space-2);
    inset-inline-start: var(--space-2);
    z-index: 1;
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    padding: 4px var(--space-2);
    border-radius: var(--pn-r-pill);
    background: var(--pn-buy);
    color: #fff;
    font-family: var(--pn-ff-med);
    font-size: var(--fs-caption);
    line-height: 1.6;
}
.lb-std .auction-chip--soon { background: var(--color-primary-500); }

.lb-std .auction-card-body {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: var(--space-2);
    padding: var(--space-3);
}
.lb-std .auction-card-title {
    margin: 0;
    font-family: var(--pn-ff-med);
    font-size: var(--fs-body-sm);
    line-height: var(--lh-snug);
    color: var(--pn-ink);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.lb-std .auction-card-price {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: var(--space-1);
    margin-top: auto;
}
.lb-std .auction-card-price .js-price-label {
    flex-basis: 100%;
    font-size: var(--fs-caption);
    color: var(--pn-muted);
}
.lb-std .auction-card-price strong {
    font-family: var(--pn-ff-black);
    font-size: var(--fs-body-lg);
    color: var(--pn-price);
}
.lb-std .auction-card-price em {
    font-style: normal;
    font-size: var(--fs-caption);
    color: var(--pn-muted);
}

.lb-std .auction-card-foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-2);
    padding-top: var(--space-2);
    border-top: 1px solid var(--pn-hairline);
    font-size: var(--fs-caption);
    color: var(--pn-muted);
}
.lb-std .auction-countdown {
    font-family: var(--pn-ff-med);
    color: var(--pn-ink);
    font-variant-numeric: tabular-nums;
    direction: ltr;
}

.lb-std .auction-pager {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--space-2);
    margin-top: var(--space-7);
}
.lb-std .auction-pager-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-1);
    min-width: var(--pn-hit);
    min-height: var(--pn-hit);
    padding-inline: var(--space-3);
    border: 1px solid var(--pn-hairline-strong);
    border-radius: var(--pn-r-md);
    background: var(--pn-surface);
    color: var(--pn-ink);
    font-size: var(--fs-body-sm);
    text-decoration: none;
}
.lb-std .auction-pager-btn:hover { background: var(--pn-sunken); }
.lb-std .auction-pager-btn.is-active {
    border-color: var(--pn-ink);
    background: var(--pn-buy);
    color: var(--pn-surface);
}

.lb-std .auction-layout {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-5);
    align-items: start;
}
@media (min-width: 992px) {
    .lb-std .auction-layout { grid-template-columns: minmax(0, 1fr) 400px; }
    .lb-std .auction-panel  { position: sticky; top: var(--space-4); }
}

.lb-std .auction-media { min-width: 0; }

.lb-std .auction-gallery {
    padding: var(--space-3);
    border: 1px solid var(--pn-hairline);
    border-radius: var(--pn-r-lg);
    background: var(--pn-surface);
}
.lb-std .auction-gallery-main {
    aspect-ratio: 4 / 3;
    overflow: hidden;
    border-radius: var(--pn-r-md);
    background: var(--pn-sunken);
}
.lb-std .auction-gallery-main img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.lb-std .auction-gallery-empty {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    font-size: 2.5rem;
    color: var(--pn-hairline-strong);
}
.lb-std .auction-gallery-thumbs {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
    margin-top: var(--space-3);
}
.lb-std .auction-thumb {
    width: 64px;
    height: 64px;
    padding: 0;
    overflow: hidden;
    border: 1px solid var(--pn-hairline-strong);
    border-radius: var(--pn-r-sm);
    background: var(--pn-surface);
    cursor: pointer;
}
.lb-std .auction-thumb img { width: 100%; height: 100%; object-fit: cover; }
.lb-std .auction-thumb.is-active { border-color: var(--pn-ink); border-width: 2px; }

.lb-std .auction-idcard {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
    margin-top: var(--space-4);
}
.lb-std .auction-idcard-item {
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    padding: var(--space-2) var(--space-3);
    border: 1px solid var(--pn-hairline);
    border-radius: var(--pn-r-pill);
    background: var(--pn-surface);
    font-size: var(--fs-body-sm);
    color: var(--pn-muted);
}
.lb-std .auction-idcard-item b { color: var(--pn-ink); font-family: var(--pn-ff-med); }

.lb-std .auction-trust {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: var(--space-2);
    margin-top: var(--space-4);
}
.lb-std .auction-trust-item {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3);
    border: 1px solid var(--pn-hairline);
    border-radius: var(--pn-r-md);
    background: var(--pn-surface);
    font-size: var(--fs-body-sm);
    color: var(--pn-body);
}
.lb-std .auction-trust-item i { color: var(--pn-muted); }

.lb-std .auction-product-link {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    margin-top: var(--space-4);
    font-size: var(--fs-body-sm);
    color: var(--pn-link);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.lb-std .auction-share {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin-top: var(--space-4);
    font-size: var(--fs-body-sm);
    color: var(--pn-muted);
}
.lb-std .auction-share-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--pn-hit);
    height: var(--pn-hit);
    border: 1px solid var(--pn-hairline-strong);
    border-radius: var(--pn-r-md);
    background: var(--pn-surface);
    color: var(--pn-ink);
    cursor: pointer;
    text-decoration: none;
}
.lb-std .auction-share-btn:hover { background: var(--pn-sunken); }

.lb-std .auction-panel {
    padding: var(--space-5);
    border: 1px solid var(--pn-hairline);
    border-radius: var(--pn-r-lg);
    background: var(--pn-surface);
    box-shadow: var(--pn-sh-2);
}
.lb-std .auction-panel h1 {
    margin: 0 0 var(--space-4);
    font-family: var(--pn-ff-bold);
    font-size: var(--fs-h2);
    line-height: var(--lh-heading);
    color: var(--pn-ink);
}

.lb-std .auction-hero-price {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: var(--space-2);
    padding: var(--space-4);
    border-radius: var(--pn-r-md);
    background: var(--pn-sunken);
}
.lb-std .auction-hero-price .lbl {
    flex-basis: 100%;
    font-size: var(--fs-body-sm);
    color: var(--pn-muted);
}
.lb-std .auction-hero-price .val {
    font-family: var(--pn-ff-black);
    font-size: var(--fs-h1);
    line-height: 1.2;
    color: var(--pn-ink);
    font-variant-numeric: tabular-nums;
}
.lb-std .auction-hero-price .cur { font-size: var(--fs-body-sm); color: var(--pn-muted); }

.lb-std .auction-clock {
    margin-top: var(--space-4);
    padding: var(--space-4);
    border: 1px solid var(--pn-hairline);
    border-radius: var(--pn-r-md);
    text-align: center;
}
.lb-std .auction-clock .lbl {
    margin-bottom: var(--space-3);
    font-size: var(--fs-body-sm);
    color: var(--pn-muted);
}
.lb-std .auction-clock-boxes {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--space-2);
    direction: ltr;
}
.lb-std .auction-clock-box {
    padding: var(--space-2) 0;
    border-radius: var(--pn-r-sm);
    background: var(--pn-sunken);
}
.lb-std .auction-clock-box b {
    display: block;
    font-family: var(--pn-ff-black);
    font-size: var(--fs-h3);
    line-height: 1.3;
    color: var(--pn-ink);
    font-variant-numeric: tabular-nums;
}
.lb-std .auction-clock-box span {
    font-size: var(--fs-caption);
    color: var(--pn-muted);
}

.lb-std .auction-clock--soon { border-color: var(--pn-hairline-strong); background: var(--pn-sunken); }
.lb-std .auction-clock--soon .auction-clock-box { background: var(--pn-surface); }

.lb-std .auction-extended {
    margin-top: var(--space-3);
    font-size: var(--fs-body-sm);
    color: var(--pn-buy);
}
.lb-std .auction-extended[hidden] { display: none; }

.lb-std .auction-facts {
    margin: var(--space-4) 0 0;
    padding: 0;
    list-style: none;
}
.lb-std .auction-facts li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    padding: var(--space-3) 0;
    border-bottom: 1px solid var(--pn-hairline);
    font-size: var(--fs-body-sm);
}
.lb-std .auction-facts li:last-child { border-bottom: 0; }
.lb-std .auction-facts span  { color: var(--pn-muted); }
.lb-std .auction-facts strong { font-family: var(--pn-ff-med); color: var(--pn-ink); }

.lb-std .auction-note {
    margin-top: var(--space-4);
    padding: var(--space-3) var(--space-4);
    border: 1px solid var(--pn-hairline-strong);
    border-inline-start: 3px solid var(--pn-muted);
    border-radius: var(--pn-r-md);
    background: var(--pn-sunken);
    font-size: var(--fs-body-sm);
    line-height: var(--lh-body);
    color: var(--pn-body);
}
.lb-std .auction-note strong { display: block; color: var(--pn-ink); font-family: var(--pn-ff-bold); }
.lb-std .auction-note small  { display: block; margin-top: var(--space-1); color: var(--pn-muted); }
.lb-std .auction-note--warn    { border-inline-start-color: var(--pn-warning); }
.lb-std .auction-note--info    { border-inline-start-color: var(--color-primary-500); }
.lb-std .auction-note--success { border-inline-start-color: var(--pn-success); }
.lb-std .auction-note--muted   { border-inline-start-color: var(--pn-hairline-strong); color: var(--pn-muted); }

.lb-std .auction-bid-box { margin-top: var(--space-4); }
.lb-std .auction-bid-box label {
    display: block;
    margin-bottom: var(--space-2);
    font-size: var(--fs-body-sm);
    color: var(--pn-body);
}
.lb-std .auction-bid-input {
    width: 100%;
    height: 52px;
    padding-inline: var(--space-4);
    border: 1px solid var(--pn-hairline-strong);
    border-radius: var(--pn-r-md);
    background: var(--pn-surface);
    color: var(--pn-ink);
    font-family: var(--pn-ff-bold);
    font-size: var(--fs-h3);
    text-align: center;
    font-variant-numeric: tabular-nums;
}
.lb-std .auction-bid-input:focus-visible {
    outline: none;
    border-color: var(--pn-focus);
    box-shadow: var(--pn-focus-ring);
}
.lb-std .auction-hint {
    margin-top: var(--space-2);
    font-size: var(--fs-caption);
    color: var(--pn-muted);
}
.lb-std .auction-hint b { color: var(--pn-ink); }

.lb-std .auction-badge-lead {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin-bottom: var(--space-3);
    padding: var(--space-2) var(--space-3);
    border-radius: var(--pn-r-md);
    background: var(--pn-success);
    color: #fff;
    font-family: var(--pn-ff-med);
    font-size: var(--fs-body-sm);
}
.lb-std .auction-badge-lead[hidden] { display: none; }

.lb-std .auction-proxy {
    margin-top: var(--space-3);
    padding: var(--space-3);
    border-radius: var(--pn-r-md);
    background: var(--pn-sunken);
}
.lb-std .auction-proxy label {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
    cursor: pointer;
    color: var(--pn-ink);
}
.lb-std .auction-proxy input[type="checkbox"] {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    accent-color: var(--color-primary-500);
}
.lb-std .auction-proxy p {
    margin: var(--space-2) 0 0;
    font-size: var(--fs-caption);
    line-height: var(--lh-body);
    color: var(--pn-muted);
}

.lb-std .auction-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    width: 100%;
    min-height: var(--pn-btn-h);
    margin-top: var(--space-4);
    padding-inline: var(--space-4);
    border: 1px solid transparent;
    border-radius: var(--pn-r-md);
    font-family: var(--pn-ff-bold);
    font-size: var(--fs-body);
    line-height: 1;
    cursor: pointer;
    transition: background-color var(--dur-fast) var(--ease);
}
.lb-std .auction-btn--primary {
    background: var(--pn-buy);
    color: var(--pn-buy-ink);
}
.lb-std .auction-btn--primary:hover { background: var(--pn-buy-hover); }
.lb-std .auction-btn--buynow {
    background: var(--pn-surface);
    border-color: var(--pn-hairline-strong);
    color: var(--pn-ink);
}
.lb-std .auction-btn--buynow:hover { background: var(--pn-sunken); }
.lb-std .auction-btn:disabled { opacity: var(--pn-disabled-o); cursor: not-allowed; }

.lb-std .auction-details-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-5);
    margin-top: var(--space-6);
}
@media (min-width: 992px) {
    .lb-std .auction-details-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.lb-std .auction-section {
    margin-top: var(--space-5);
    padding: var(--space-5);
    border: 1px solid var(--pn-hairline);
    border-radius: var(--pn-r-lg);
    background: var(--pn-surface);
}
.lb-std .auction-details-grid .auction-section { margin-top: 0; }
.lb-std .auction-section > h2 {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0 0 var(--space-4);
    font-family: var(--pn-ff-bold);
    font-size: var(--fs-h3);
    line-height: var(--lh-heading);
    color: var(--pn-ink);
}
.lb-std .auction-section > h2 i { color: var(--pn-muted); font-size: .9em; }

.lb-std .auction-desc {
    font-size: var(--fs-body);
    line-height: var(--lh-body);
    color: var(--pn-body);
}
.lb-std .auction-desc img { max-width: 100%; height: auto; border-radius: var(--pn-r-md); }

.lb-std .auction-specs,
.lb-std .auction-bids {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--fs-body-sm);
}
.lb-std .auction-specs th,
.lb-std .auction-specs td,
.lb-std .auction-bids th,
.lb-std .auction-bids td {
    padding: var(--space-3);
    border-bottom: 1px solid var(--pn-hairline);
    text-align: right;
}
.lb-std .auction-specs th {
    width: 40%;
    color: var(--pn-muted);
    font-family: var(--pn-ff);
    font-weight: normal;
}
.lb-std .auction-specs td { color: var(--pn-ink); }

.lb-std .auction-bids thead th {
    background: var(--pn-sunken);
    color: var(--pn-muted);
    font-family: var(--pn-ff-med);
    font-weight: normal;
}
.lb-std .auction-bids .amount {
    font-family: var(--pn-ff-bold);
    color: var(--pn-ink);
    font-variant-numeric: tabular-nums;
}
.lb-std .auction-bids .time { color: var(--pn-muted); font-size: var(--fs-caption); }
.lb-std .auction-bids tr.is-lead td { background: rgba(21, 128, 61, .06); }
.lb-std .auction-tag {
    display: inline-block;
    margin-inline-start: var(--space-1);
    padding: 2px var(--space-2);
    border-radius: var(--pn-r-pill);
    background: var(--pn-sunken);
    color: var(--pn-muted);
    font-size: var(--fs-caption);
}

.lb-std .auction-videos { display: grid; gap: var(--space-4); }
.lb-std .auction-video-item h3 {
    margin: 0 0 var(--space-2);
    font-family: var(--pn-ff-med);
    font-size: var(--fs-body);
    color: var(--pn-ink);
}
.lb-std .auction-video-item video,
.lb-std .auction-video-item iframe {
    width: 100%;
    aspect-ratio: 16 / 9;
    border: 0;
    border-radius: var(--pn-r-md);
    background: var(--pn-sunken);
}

.lb-std .auction-proscons {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: var(--space-4);
}
.lb-std .auction-pros h3,
.lb-std .auction-cons h3 {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0 0 var(--space-2);
    font-family: var(--pn-ff-med);
    font-size: var(--fs-body);
}
.lb-std .auction-pros h3 { color: var(--pn-success); }
.lb-std .auction-cons h3 { color: var(--pn-danger); }
.lb-std .auction-pros ul,
.lb-std .auction-cons ul {
    margin: 0;
    padding-inline-start: var(--space-4);
    font-size: var(--fs-body-sm);
    line-height: var(--lh-body);
    color: var(--pn-body);
}

.lb-std .auction-how {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: var(--space-4);
}
.lb-std .auction-how-step { display: flex; gap: var(--space-3); }
.lb-std .auction-how-num {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--pn-buy);
    color: var(--pn-surface);
    font-family: var(--pn-ff-bold);
    font-size: var(--fs-body-sm);
}
.lb-std .auction-how-step b {
    display: block;
    margin-bottom: var(--space-1);
    font-family: var(--pn-ff-med);
    font-size: var(--fs-body);
    color: var(--pn-ink);
}
.lb-std .auction-how-step p {
    margin: 0;
    font-size: var(--fs-body-sm);
    line-height: var(--lh-body);
    color: var(--pn-muted);
}

.lb-std .auction-clock.is-urgent {
    border-color: var(--pn-sale);
    background: rgba(159, 18, 57, .05);
}
.lb-std .auction-clock.is-urgent .auction-clock-box b { color: var(--pn-sale); }

.lb-std .error-page {
    padding-block: var(--space-8) var(--space-10);
    background: var(--pn-canvas);
}

.lb-std .error-box {
    max-width: 640px;
    margin: 0 auto;
    padding: var(--space-7) var(--space-5);
    border: 1px solid var(--pn-hairline);
    border-radius: var(--pn-r-lg);
    background: var(--pn-surface);
    text-align: center;
}

.lb-std .error-code {
    font-family: var(--pn-ff-black);
    font-size: var(--fs-display);
    line-height: 1.1;
    color: var(--pn-hairline-strong);
    font-variant-numeric: tabular-nums;
}
.lb-std .error-title {
    margin: var(--space-3) 0 var(--space-2);
    font-family: var(--pn-ff-bold);
    font-size: var(--fs-h2);
    line-height: var(--lh-heading);
    color: var(--pn-ink);
}
.lb-std .error-desc {
    margin: 0;
    font-size: var(--fs-body);
    line-height: var(--lh-body);
    color: var(--pn-muted);
}
.lb-std .error-path {
    margin: var(--space-3) 0 0;
    font-size: var(--fs-caption);
    color: var(--pn-muted);
    word-break: break-all;
}

.lb-std .error-trace {
    margin: var(--space-4) 0 0;
    padding: var(--space-3);
    border: 1px dashed var(--pn-hairline-strong);
    border-radius: var(--pn-r-md);
    background: var(--pn-sunken);
    font-size: var(--fs-body-sm);
    color: var(--pn-body);
}
.lb-std .error-trace code {
    display: inline-block;
    padding: 2px var(--space-2);
    border-radius: var(--pn-r-sm);
    background: var(--pn-ink);
    color: var(--pn-surface);
    font-family: ui-monospace, Menlo, Consolas, monospace;
    font-size: var(--fs-body);
    letter-spacing: 1px;
    user-select: all;
}
.lb-std .error-trace small {
    display: block;
    margin-top: var(--space-2);
    font-size: var(--fs-caption);
    color: var(--pn-muted);
}

.lb-std .error-search {
    display: flex;
    gap: var(--space-2);
    max-width: 420px;
    margin: var(--space-5) auto 0;
}
.lb-std .error-search-input {
    flex: 1;
    height: var(--pn-input-h);
    padding-inline: var(--space-3);
    border: 1px solid var(--pn-hairline-strong);
    border-radius: var(--pn-r-md);
    background: var(--pn-surface);
    color: var(--pn-ink);
    font-family: var(--pn-ff);
    font-size: var(--fs-body-sm);
}
.lb-std .error-search-btn {
    min-height: var(--pn-btn-h);
    padding-inline: var(--space-4);
    border: 0;
    border-radius: var(--pn-r-md);
    background: var(--color-primary-500);
    color: #fff;
    font-family: var(--pn-ff-med);
    font-size: var(--fs-body-sm);
    cursor: pointer;
}
.lb-std .error-search-btn:hover { background: var(--color-primary-600); }

.lb-std .error-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--space-2);
    margin-top: var(--space-4);
}
.lb-std .error-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: var(--pn-btn-h);
    padding-inline: var(--space-5);
    border: 1px solid var(--pn-hairline-strong);
    border-radius: var(--pn-r-md);
    background: var(--pn-surface);
    color: var(--pn-ink);
    font-family: var(--pn-ff-med);
    font-size: var(--fs-body-sm);
    text-decoration: none;
}
.lb-std .error-btn:hover { background: var(--pn-sunken); }
.lb-std .error-btn-primary {
    border-color: var(--pn-ink);
    background: var(--pn-buy);
    color: var(--pn-surface);
}
.lb-std .error-btn-primary:hover { background: var(--color-primary-600); }

.lb-std .error-cats,
.lb-std .error-products { margin-top: var(--space-8); }

.lb-std .error-sec-title {
    margin: 0 0 var(--space-4);
    font-family: var(--pn-ff-bold);
    font-size: var(--fs-h3);
    color: var(--pn-ink);
}
.lb-std .error-cat-list {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
}
.lb-std .error-cat {
    display: inline-flex;
    align-items: center;
    min-height: var(--pn-hit);
    padding-inline: var(--space-4);
    border: 1px solid var(--pn-hairline);
    border-radius: var(--pn-r-pill);
    background: var(--pn-surface);
    color: var(--pn-ink);
    font-size: var(--fs-body-sm);
    text-decoration: none;
}
.lb-std .error-cat:hover { background: var(--pn-sunken); }

.lb-std .auction-rail > .auction-card { height: 100%; }


.lb-std .dashboard-page {
    padding-block: var(--space-6) var(--space-10);
    min-height: 60vh;
}

.lb-std .dash-shell {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-5);
    align-items: start;
}

@media (min-width: 1024px) {
    .lb-std .dash-shell {
        grid-template-columns: var(--pn-side-w) minmax(0, 1fr);
        gap: var(--space-6);
    }
}

.lb-std .dash-side { min-width: 0; }
.lb-std .dash-main-col { min-width: 0; }
.lb-std .dashboard-main {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-5);
}

@media (min-width: 1024px) {
    .lb-std .dashboard-sidebar {
        position: sticky;
        top: var(--space-5);
    }
}

.lb-std .user-profile-card {
    padding: var(--space-5) var(--space-4);
    margin-bottom: var(--space-3);
    border-radius: var(--pn-r-lg);
    background: var(--color-primary-600);
    color: #fff;
    text-align: center;
}

.lb-std .user-avatar {
    display: grid;
    place-items: center;
    width: 64px;
    height: 64px;
    margin: 0 auto var(--space-3);
    border-radius: 50%;
    background: rgba(255, 255, 255, .14);
    font-size: 1.5rem;
}

.lb-std .user-name {
    font-family: var(--pn-ff-bold);
    font-size: var(--fs-body-lg);
    line-height: var(--lh-heading);
}

.lb-std .user-phone {
    display: block;
    margin-top: var(--space-1);
    font-size: var(--fs-body-sm);
    color: rgba(255, 255, 255, .72);
}

.lb-std .dashboard-nav {
    display: flex;
    flex-direction: column;
    padding: var(--space-2);
    border: 1px solid var(--pn-hairline);
    border-radius: var(--pn-r-lg);
    background: var(--pn-surface);
}

.lb-std .dashboard-nav-item {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    min-height: var(--pn-hit);
    padding: var(--space-2) var(--space-3);
    border-radius: var(--pn-r-sm);
    color: var(--pn-body);
    font-size: var(--fs-body-sm);
    text-decoration: none;
    transition: background-color var(--dur-fast) var(--ease),
                color var(--dur-fast) var(--ease);
}

.lb-std .dashboard-nav-item i { font-size: 1.15em; color: var(--pn-muted); }

.lb-std .dashboard-nav-item:hover { background: var(--pn-sunken); color: var(--pn-ink); }

.lb-std .dashboard-nav-item.active {
    background: var(--pn-sunken);
    color: var(--pn-ink);
    font-family: var(--pn-ff-bold);
}

.lb-std .dashboard-nav-item:hover i,
.lb-std .dashboard-nav-item.active i { color: var(--pn-ink); }

.lb-std .dashboard-nav-item.logout-item { color: var(--pn-danger); }
.lb-std .dashboard-nav-item.logout-item i { color: var(--pn-danger); }
.lb-std .dashboard-nav-item.logout-item:hover { background: #FDF2F2; color: var(--pn-danger); }

.lb-std .dashboard-stats-row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: var(--space-3);
}

.lb-std .stat-card {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-4);
    border: 1px solid var(--pn-hairline);
    border-radius: var(--pn-r-lg);
    background: var(--pn-surface);
}

.lb-std .stat-icon {
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    width: 44px;
    height: 44px;
    border-radius: var(--pn-r-md);
    background: var(--pn-sunken);
    color: var(--pn-ink);
    font-size: 1.15rem;
}

.lb-std .stat-icon.red,
.lb-std .stat-icon.blue { background: var(--pn-sunken); color: var(--pn-ink); }
.lb-std .stat-icon.green { background: #F0FDF4; color: var(--pn-success); }
.lb-std .stat-icon.orange { background: #FFFBEB; color: var(--pn-buy); }

.lb-std .stat-info { min-width: 0; }
.lb-std .stat-info .stat-value {
    font-family: var(--pn-ff-bold);
    font-size: var(--fs-h3);
    color: var(--pn-ink);
    line-height: 1.2;
}
.lb-std .stat-info .stat-label {
    font-size: var(--fs-body-sm);
    color: var(--pn-muted);
}

.lb-std .dashboard-panel {
    border: 1px solid var(--pn-hairline);
    border-radius: var(--pn-r-lg);
    background: var(--pn-surface);
    overflow: hidden;
}

.lb-std .dashboard-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    flex-wrap: wrap;
    padding: var(--space-4) var(--space-5);
    border-bottom: 1px solid var(--pn-hairline);
}

.lb-std .dashboard-panel-title {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
    font-family: var(--pn-ff-bold);
    font-size: var(--fs-h3);
    color: var(--pn-ink);
    line-height: var(--lh-heading);
}
.lb-std .dashboard-panel-title i { color: var(--pn-muted); font-size: .95em; }

.lb-std .dashboard-panel-link {
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    font-size: var(--fs-body-sm);
    color: var(--pn-link);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.lb-std .dashboard-panel-body { padding: var(--space-5); }

.lb-std .table-responsive {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.lb-std .orders-table {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--fs-body-sm);
}

.lb-std .orders-table th {
    padding: var(--space-3);
    border-bottom: 1px solid var(--pn-hairline-strong);
    background: var(--pn-sunken);
    color: var(--pn-muted);
    font-family: var(--pn-ff-med);
    font-size: var(--fs-caption);
    text-align: start;
    white-space: nowrap;
}

.lb-std .orders-table td {
    padding: var(--space-3);
    border-bottom: 1px solid var(--pn-hairline);
    color: var(--pn-body);
    vertical-align: middle;
}

.lb-std .orders-table tbody tr:last-child td { border-bottom: 0; }
.lb-std .orders-table tbody tr:hover td { background: var(--pn-canvas); }

.lb-std .order-status-badge {
    display: inline-block;
    padding: 4px var(--space-2);
    border-radius: var(--pn-r-pill);
    font-size: var(--fs-caption);
    font-family: var(--pn-ff-med);
    white-space: nowrap;
}

.lb-std .status-pending    { background: #FFFBEB; color: var(--pn-warning); }
.lb-std .status-processing { background: var(--pn-sunken); color: var(--pn-ink); }
.lb-std .status-shipped    { background: #F0FDF4; color: var(--pn-success); }
.lb-std .status-delivered  { background: #DCFCE7; color: #166534; }
.lb-std .status-cancelled  { background: #FEF2F2; color: var(--pn-danger); }

.lb-std .order-detail-btn,
.lb-std .order-pay-btn,
.lb-std .address-edit-btn,
.lb-std .address-delete-btn {
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    min-height: 34px;
    padding-inline: var(--space-3);
    border: 1px solid var(--pn-hairline-strong);
    border-radius: var(--pn-r-md);
    background: var(--pn-surface);
    color: var(--pn-ink);
    font-family: var(--pn-ff-med);
    font-size: var(--fs-body-sm);
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    transition: background-color var(--dur-fast) var(--ease),
                border-color var(--dur-fast) var(--ease);
}

.lb-std .order-detail-btn:hover,
.lb-std .address-edit-btn:hover { background: var(--pn-sunken); }

.lb-std .order-pay-btn {
    border-color: transparent;
    background: var(--pn-buy);
    color: var(--pn-buy-ink);
    font-family: var(--pn-ff-bold);
}
.lb-std .order-pay-btn:hover { background: var(--pn-buy-hover); }
.lb-std .order-pay-btn:disabled { opacity: var(--pn-disabled-o); cursor: not-allowed; }

.lb-std .address-delete-btn {
    border-color: rgba(179, 38, 30, .35);
    color: var(--pn-danger);
}
.lb-std .address-delete-btn:hover { background: #FEF2F2; }

.lb-std .order-unavailable {
    font-size: var(--fs-caption);
    color: var(--pn-danger);
    white-space: nowrap;
}

.lb-std .profile-section-title {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: var(--space-5) 0 var(--space-3);
    font-family: var(--pn-ff-bold);
    font-size: var(--fs-body-lg);
    color: var(--pn-ink);
}
.lb-std .profile-section-title:first-child { margin-top: 0; }
.lb-std .profile-section-title i { color: var(--pn-muted); font-size: .95em; }

.lb-std .profile-form-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: var(--space-4);
}

.lb-std .profile-form-group { display: grid; gap: var(--space-2); min-width: 0; }

.lb-std .profile-form-group > label {
    font-size: var(--fs-body-sm);
    color: var(--pn-muted);
}

.lb-std .profile-form-group p { margin: 0; }

.lb-std .form-control-plaintext {
    font-size: var(--fs-body);
    color: var(--pn-ink);
}

.lb-std .dashboard-page .form-control {
    width: 100%;
    min-height: var(--pn-input-h);
    padding: var(--space-2) var(--space-3);
    border: 1px solid var(--pn-hairline-strong);
    border-radius: var(--pn-r-md);
    background: var(--pn-surface);
    color: var(--pn-ink);
    font-family: var(--pn-ff);
    font-size: var(--fs-body-sm);
    transition: border-color var(--dur-fast) var(--ease),
                box-shadow var(--dur-fast) var(--ease);
}
.lb-std .dashboard-page .form-control::placeholder { color: var(--pn-muted); }
.lb-std .dashboard-page .form-control:focus-visible {
    outline: none;
    border-color: var(--pn-focus);
    box-shadow: var(--pn-focus-ring);
}
.lb-std .dashboard-page textarea.form-control { min-height: 84px; resize: vertical; }

.lb-std .profile-shaba-wrap {
    display: flex;
    align-items: stretch;
    gap: var(--space-2);
    direction: ltr;
}
.lb-std .profile-shaba-prefix {
    display: grid;
    place-items: center;
    padding-inline: var(--space-3);
    border: 1px solid var(--pn-hairline-strong);
    border-radius: var(--pn-r-md);
    background: var(--pn-sunken);
    color: var(--pn-muted);
    font-size: var(--fs-body-sm);
}

.lb-std .profile-save-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: var(--pn-btn-h);
    padding-inline: var(--space-6);
    border: 0;
    border-radius: var(--pn-r-md);
    background: var(--color-primary-500);
    color: #fff;
    font-family: var(--pn-ff-bold);
    font-size: var(--fs-body-sm);
    cursor: pointer;
    transition: background-color var(--dur-fast) var(--ease);
}
.lb-std .profile-save-btn:hover { background: var(--color-primary-600); }
.lb-std .profile-save-btn:disabled { opacity: var(--pn-disabled-o); cursor: not-allowed; }

.lb-std .pn-field-row { display: grid; gap: var(--space-2); min-width: 0; }
.lb-std .pn-field-row > label {
    font-size: var(--fs-body-sm);
    color: var(--pn-muted);
}
.lb-std .pn-field-row .pn-input { padding-inline: var(--space-3); }

.lb-std .pn-check {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--fs-body-sm);
    color: var(--pn-body);
    cursor: pointer;
}
.lb-std .pn-check input { width: 18px; height: 18px; accent-color: var(--color-primary-500); }

.lb-std .addresses-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: var(--space-4);
}

.lb-std .address-item-card {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    padding: var(--space-4);
    border: 1px solid var(--pn-hairline);
    border-radius: var(--pn-r-lg);
    background: var(--pn-surface);
}
.lb-std .address-item-card.default-address { border-color: var(--pn-ink); }

.lb-std .address-default-badge {
    position: absolute;
    top: var(--space-3);
    inset-inline-end: var(--space-3);
    padding: 2px var(--space-2);
    border-radius: var(--pn-r-pill);
    background: var(--pn-buy);
    color: #fff;
    font-size: var(--fs-caption);
}

.lb-std .address-item-title {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
    padding-inline-end: 72px;
    font-family: var(--pn-ff-bold);
    font-size: var(--fs-body);
    color: var(--pn-ink);
}

.lb-std .address-item-text {
    font-size: var(--fs-body-sm);
    line-height: var(--lh-snug);
    color: var(--pn-body);
}

.lb-std .address-item-actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
    margin-top: auto;
    padding-top: var(--space-2);
}

.lb-std .addr-form-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: var(--space-4);
}
.lb-std .addr-col-full { grid-column: 1 / -1; }
.lb-std .addr-textarea { height: auto; min-height: 84px; padding: var(--space-3); resize: vertical; }

.lb-std .addr-form-actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-3);
    margin-top: var(--space-5);
}

.lb-std .order-meta-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: var(--space-4);
    margin-bottom: var(--space-4);
}

.lb-std .order-bottom-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-4);
    margin-top: var(--space-5);
}
@media (min-width: 768px) {
    .lb-std .order-bottom-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.lb-std .cart-product-info {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    min-width: 0;
}

.lb-std .wallet-top {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-4);
}
@media (min-width: 768px) {
    .lb-std .wallet-top { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.lb-std .wallet-balance-card {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    padding: var(--space-5);
    border-radius: var(--pn-r-lg);
    background: var(--color-primary-600);
    color: #fff;
}
.lb-std .wallet-balance-label {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--fs-body-sm);
    color: rgba(255, 255, 255, .75);
}
.lb-std .wallet-balance-value {
    font-family: var(--pn-ff-bold);
    font-size: var(--fs-h1);
    line-height: 1.2;
}
.lb-std .wallet-balance-unit { font-size: var(--fs-body-sm); font-family: var(--pn-ff); }
.lb-std .wallet-balance-stats {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-4);
    margin-top: var(--space-2);
    padding-top: var(--space-3);
    border-top: 1px solid rgba(255, 255, 255, .18);
    font-size: var(--fs-body-sm);
    color: rgba(255, 255, 255, .78);
}

.lb-std .wallet-charge-card {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    padding: var(--space-5);
    border: 1px solid var(--pn-hairline);
    border-radius: var(--pn-r-lg);
    background: var(--pn-surface);
}
.lb-std .wallet-charge-title {
    margin: 0;
    font-family: var(--pn-ff-bold);
    font-size: var(--fs-body-lg);
    color: var(--pn-ink);
}
.lb-std .wallet-quick-amounts {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(110px, 1fr));
    gap: var(--space-2);
}
.lb-std .wallet-quick-btn {
    min-height: 38px;
    padding-inline: var(--space-2);
    border: 1px solid var(--pn-hairline-strong);
    border-radius: var(--pn-r-md);
    background: var(--pn-surface);
    color: var(--pn-body);
    font-family: var(--pn-ff);
    font-size: var(--fs-body-sm);
    cursor: pointer;
    transition: background-color var(--dur-fast) var(--ease),
                border-color var(--dur-fast) var(--ease);
}
.lb-std .wallet-quick-btn span { font-size: var(--fs-caption); color: var(--pn-muted); }
.lb-std .wallet-quick-btn:hover { background: var(--pn-sunken); }
.lb-std .wallet-quick-btn.active {
    border-color: var(--pn-ink);
    background: var(--pn-sunken);
    color: var(--pn-ink);
    font-family: var(--pn-ff-bold);
}

.lb-std .wallet-charge-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    min-height: var(--pn-btn-h);
    border: 0;
    border-radius: var(--pn-r-md);
    background: var(--pn-buy);
    color: var(--pn-buy-ink);
    font-family: var(--pn-ff-bold);
    font-size: var(--fs-body-sm);
    cursor: pointer;
    transition: background-color var(--dur-fast) var(--ease);
}
.lb-std .wallet-charge-btn:hover { background: var(--pn-buy-hover); }
.lb-std .wallet-charge-btn:disabled { opacity: var(--pn-disabled-o); cursor: not-allowed; }

.lb-std .wallet-charge-hint { margin: 0; font-size: var(--fs-caption); color: var(--pn-muted); }

.lb-std .wallet-gift-card { grid-column: 1 / -1; }

.lb-std .wallet-type {
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    white-space: nowrap;
    font-family: var(--pn-ff-med);
}
.lb-std .wallet-type.is-deposit { color: var(--pn-success); }
.lb-std .wallet-type.is-withdraw { color: var(--pn-sale); }

.lb-std .wallet-badge {
    display: inline-block;
    padding: 4px var(--space-2);
    border-radius: var(--pn-r-pill);
    font-size: var(--fs-caption);
    white-space: nowrap;
}
.lb-std .wallet-badge-success { background: #F0FDF4; color: var(--pn-success); }
.lb-std .wallet-badge-pending { background: #FFFBEB; color: var(--pn-warning); }
.lb-std .wallet-badge-failed  { background: #FEF2F2; color: var(--pn-danger); }
.lb-std .wallet-row-pending td { background: #FFFDF5; }

.lb-std .dashboard-page .text-center { text-align: center; }
.lb-std .dashboard-page .text-muted  { color: var(--pn-muted); }
.lb-std .dashboard-page .text-danger { color: var(--pn-danger); font-size: var(--fs-caption); }
.lb-std .dashboard-page .text-nowrap { white-space: nowrap; }
.lb-std .dashboard-page .fw-medium   { font-family: var(--pn-ff-med); color: var(--pn-ink); }
.lb-std .dashboard-page .d-flex      { display: flex; }
.lb-std .dashboard-page .gap-2       { gap: var(--space-2); }
.lb-std .dashboard-page .py-3        { padding-block: var(--space-3); }
.lb-std .dashboard-page .py-5        { padding-block: var(--space-8); }
.lb-std .dashboard-page .mt-2        { margin-top: var(--space-2); }
.lb-std .dashboard-page .mt-3        { margin-top: var(--space-3); }
.lb-std .dashboard-page .mt-4        { margin-top: var(--space-4); }
.lb-std .dashboard-page .mb-2        { margin-bottom: var(--space-2); }

.lb-std .addr-picker {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: var(--space-3);
    margin-bottom: var(--space-4);
}

.lb-std .addr-pick-card {
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: var(--space-3);
    padding: var(--space-4);
    border: 1px solid var(--pn-hairline-strong);
    border-radius: var(--pn-r-lg);
    background: var(--pn-surface);
    cursor: pointer;
    transition: border-color var(--dur-fast) var(--ease),
                background-color var(--dur-fast) var(--ease);
}
.lb-std .addr-pick-card:hover { background: var(--pn-canvas); }
.lb-std .addr-pick-card.selected { border-color: var(--pn-ink); }

.lb-std .addr-pick-card input {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}
.lb-std .addr-pick-card:has(input:focus-visible) {
    outline: 2px solid var(--pn-focus);
    outline-offset: 2px;
}

.lb-std .addr-pick-body {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
    min-width: 0;
}

.lb-std .addr-pick-title {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-family: var(--pn-ff-bold);
    font-size: var(--fs-body);
    color: var(--pn-ink);
}

.lb-std .addr-pick-badge {
    padding: 2px var(--space-2);
    border-radius: var(--pn-r-pill);
    background: var(--pn-buy);
    color: #fff;
    font-family: var(--pn-ff);
    font-size: var(--fs-caption);
}

.lb-std .addr-pick-line,
.lb-std .addr-pick-meta {
    font-size: var(--fs-body-sm);
    line-height: var(--lh-snug);
    color: var(--pn-body);
}
.lb-std .addr-pick-meta { color: var(--pn-muted); }

.lb-std .addr-pick-check {
    margin-inline-start: auto;
    color: transparent;
    font-size: 1rem;
}
.lb-std .addr-pick-card.selected .addr-pick-check { color: var(--pn-ink); }

.lb-std .addr-pick-new { border-style: dashed; }

.lb-std .addr-picker-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
}

.lb-std .addr-edit-toggle {
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--pn-link);
    font-family: var(--pn-ff-med);
    font-size: var(--fs-body-sm);
    text-decoration: underline;
    text-underline-offset: 3px;
    cursor: pointer;
}

.lb-std .addr-book-link {
    font-size: var(--fs-body-sm);
    color: var(--pn-muted);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.lb-std .addr-save-box {
    display: flex;
    /* .contact-form-group is a column flex; without this the title input's
       flex-basis (220px) became its height. */
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-3);
}
/* عنوانِ آدرس کنارِ یک چک‌باکسِ ۱۸px می‌نشیند، پس ارتفاعِ پیش‌فرضِ فیلدهای
   فرم (padding 1.15rem) اینجا درشت به نظر می‌رسد. فقط همین یک فیلد کوتاه می‌شود. */
.lb-std .addr-save-box input[type="text"] {
    flex: 1 1 220px;
    padding: .65rem 1rem;
    font-size: var(--fs-body-sm); /* was 1.3rem — a 10px-root size; 20.8px here */
}

.lb-std .ticket-chat {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    max-height: 460px;
    overflow-y: auto;
    padding-inline-end: var(--space-2);
    margin-bottom: var(--space-5);
}

.lb-std .ticket-row { display: flex; }
.lb-std .ticket-row.is-admin { justify-content: flex-start; }
.lb-std .ticket-row.is-user  { justify-content: flex-end; }

.lb-std .ticket-bubble {
    max-width: min(75%, 46ch);
    padding: var(--space-3) var(--space-4);
    border: 1px solid var(--pn-hairline);
    border-radius: var(--pn-r-lg);
    background: var(--pn-surface);
}

.lb-std .ticket-row.is-admin .ticket-bubble {
    background: var(--pn-sunken);
    border-inline-start: 3px solid var(--pn-ink);
}
.lb-std .ticket-row.is-user .ticket-bubble {
    border-inline-end: 3px solid var(--pn-buy);
}

.lb-std .ticket-bubble-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--space-4);
    margin-bottom: var(--space-1);
}
.lb-std .ticket-bubble-name {
    font-family: var(--pn-ff-bold);
    font-size: var(--fs-body-sm);
    color: var(--pn-ink);
}
.lb-std .ticket-bubble-time {
    font-size: var(--fs-caption);
    color: var(--pn-muted);
    white-space: nowrap;
}
.lb-std .ticket-bubble-text {
    margin: 0;
    font-size: var(--fs-body-sm);
    line-height: var(--lh-snug);
    color: var(--pn-body);
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}
.lb-std .ticket-attach {
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    margin-top: var(--space-2);
    font-size: var(--fs-caption);
    color: var(--pn-link);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.lb-std .ticket-reply,
.lb-std .ticket-form-grid {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}
.lb-std .ticket-reply { border-top: 1px solid var(--pn-hairline); padding-top: var(--space-5); }

.lb-std .ticket-optional,
.lb-std .ticket-hint {
    font-size: var(--fs-caption);
    color: var(--pn-muted);
}
.lb-std .ticket-hint { display: block; margin-top: var(--space-1); }

.lb-std .ticket-form-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-3);
    margin-top: var(--space-5);
}

.lb-std .ticket-closed-note {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    margin: 0;
    padding: var(--space-4);
    border: 1px solid var(--pn-hairline);
    border-radius: var(--pn-r-md);
    background: var(--pn-sunken);
    font-size: var(--fs-body-sm);
    color: var(--pn-muted);
}

.lb-std .ticket-clip { color: var(--pn-muted); margin-inline-start: var(--space-1); }
.lb-std .ticket-date { color: var(--pn-muted); white-space: nowrap; }
.lb-std .ticket-count { font-size: var(--fs-caption); color: var(--pn-muted); }

.lb-std .dashboard-page .pagination {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-1);
    margin: 0;
    padding: 0;
    list-style: none;
}
.lb-std .dashboard-page .pagination .page-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 34px;
    min-height: 34px;
    padding-inline: var(--space-2);
    border: 1px solid var(--pn-hairline-strong);
    border-radius: var(--pn-r-sm);
    color: var(--pn-body);
    font-size: var(--fs-body-sm);
    text-decoration: none;
}
.lb-std .dashboard-page .pagination .page-link:hover { background: var(--pn-sunken); }
.lb-std .dashboard-page .pagination .page-item.active .page-link {
    border-color: var(--pn-ink);
    background: var(--pn-buy);
    color: #fff;
}

.lb-std .dashboard-page .justify-content-between { justify-content: space-between; }
.lb-std .dashboard-page .align-items-center      { align-items: center; }
.lb-std .dashboard-page .gap-3                   { gap: var(--space-3); }
.lb-std .dashboard-page .mb-1                    { margin-bottom: var(--space-1); }
.lb-std .dashboard-page .mb-4                    { margin-bottom: var(--space-4); }
.lb-std .dashboard-page .mb-0                    { margin-bottom: 0; }
.lb-std .dashboard-page .me-1                    { margin-inline-end: var(--space-1); }
.lb-std .dashboard-page .ms-1                    { margin-inline-start: var(--space-1); }
.lb-std .dashboard-page .ms-3                    { margin-inline-start: var(--space-3); }
.lb-std .dashboard-page .small                   { font-size: var(--fs-caption); }

.lb-std .track-page { padding-block: var(--space-6) var(--space-10); }

.lb-std .track-layout {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-5);
    align-items: start;
    max-width: 520px;
    margin-inline: auto;
}
@media (min-width: 1024px) {
    .lb-std .track-layout.has-result {
        grid-template-columns: 380px minmax(0, 1fr);
        gap: var(--space-6);
        max-width: none;
    }
}

.lb-std .track-form-card,
.lb-std .track-result {
    padding: var(--space-5);
    border: 1px solid var(--pn-hairline);
    border-radius: var(--pn-r-lg);
    background: var(--pn-surface);
}

.lb-std .track-form-card form {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}
.lb-std .track-form-hint {
    margin: 0 0 var(--space-4);
    font-size: var(--fs-body-sm);
    line-height: var(--lh-snug);
    color: var(--pn-muted);
}
.lb-std .track-form-card .pn-input { padding-inline: var(--space-3); }
.lb-std .track-submit { width: 100%; }

.lb-std .track-error {
    margin: var(--space-4) 0 0;
    padding: var(--space-3);
    border: 1px solid rgba(179, 38, 30, .35);
    border-radius: var(--pn-r-md);
    background: #FEF2F2;
    font-size: var(--fs-body-sm);
    color: var(--pn-danger);
}

.lb-std .track-login-note {
    margin: var(--space-4) 0 0;
    font-size: var(--fs-caption);
    color: var(--pn-muted);
}
.lb-std .track-login-note a { color: var(--pn-link); text-decoration: underline; text-underline-offset: 3px; }

.lb-std .track-result-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    flex-wrap: wrap;
    padding-bottom: var(--space-4);
    border-bottom: 1px solid var(--pn-hairline);
}
.lb-std .track-result-label {
    display: block;
    font-size: var(--fs-caption);
    color: var(--pn-muted);
}
.lb-std .track-result-code {
    font-family: var(--pn-ff-bold);
    font-size: var(--fs-body-lg);
    color: var(--pn-ink);
}

.lb-std .track-steps {
    display: grid;
    gap: var(--space-4);
    margin: var(--space-5) 0;
    padding: 0;
    list-style: none;
}
@media (min-width: 640px) {
    .lb-std .track-steps { grid-auto-flow: column; grid-auto-columns: 1fr; }
}

.lb-std .track-step {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--fs-body-sm);
    color: var(--pn-muted);
}
@media (min-width: 640px) {
    .lb-std .track-step {
        grid-template-columns: 1fr;
        justify-items: center;
        text-align: center;
        position: relative;
    }

    .lb-std .track-step:not(:last-child)::after {
        content: "";
        position: absolute;
        top: 7px;
        inset-inline-start: calc(-50% + 8px);
        width: calc(100% - 16px);
        height: 2px;
        background: var(--pn-hairline-strong);
    }
    .lb-std .track-step.is-done::after,
    .lb-std .track-step.is-current::after { background: var(--pn-buy); }
}

.lb-std .track-step-dot {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    border: 2px solid var(--pn-hairline-strong);
    background: var(--pn-surface);
}
.lb-std .track-step.is-done .track-step-dot { border-color: var(--pn-ink); background: var(--pn-buy); }
.lb-std .track-step.is-current .track-step-dot { border-color: var(--pn-buy); background: var(--pn-buy); }

.lb-std .track-step.is-done,
.lb-std .track-step.is-current { color: var(--pn-ink); }
.lb-std .track-step.is-current .track-step-title { font-family: var(--pn-ff-bold); }

.lb-std .track-step-date {
    display: block;
    font-size: var(--fs-caption);
    color: var(--pn-muted);
}

.lb-std .track-steps.is-canceled .track-step.is-current .track-step-dot {
    border-color: var(--pn-danger);
    background: var(--pn-danger);
}
.lb-std .track-steps.is-canceled .track-step.is-current { color: var(--pn-danger); }

.lb-std .track-facts {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: var(--space-4);
    margin: 0;
    padding-top: var(--space-4);
    border-top: 1px solid var(--pn-hairline);
}
.lb-std .track-facts dt {
    font-size: var(--fs-caption);
    color: var(--pn-muted);
    margin-bottom: var(--space-1);
}
.lb-std .track-facts dd {
    margin: 0;
    font-size: var(--fs-body-sm);
    color: var(--pn-ink);
}

.lb-std .order-done-track {
    margin: var(--space-3) 0 0;
    font-size: var(--fs-body-sm);
    color: var(--pn-muted);
}
.lb-std .order-done-track a { color: var(--pn-link); text-decoration: underline; text-underline-offset: 3px; }


/* آکاردئونِ FAQ دو پیاده‌سازی دارد: کالا/صفحهٔ سوالات با جاوااسکریپت
   کلاسِ .open می‌گیرند، ولی مقاله از <details> بومی استفاده می‌کند و
   هیچ‌وقت .open نمی‌گیرد — یعنی display:none بالا پاسخ را برای همیشه
   پنهان می‌کرد: باکس باز می‌شد و زیرش خالی بود. */
details[open] > .faq-answer { display: block; }

/* ── BASE CONTROLS / HEADINGS (inside .lb-main only) ─────────────────────── */
.lb-std .lb-main h1,
.lb-std .lb-main .pn-h1,
.lb-std .lb-main .shop-h1 {
    font-family: var(--pn-ff-light);
    font-weight: 300;
    color: var(--pn-ink);
    line-height: var(--lh-heading);
}


.lb-std .lb-main .pn-btn,
.lb-std .lb-main .btn {
    border-radius: var(--pn-r-sm);
    box-shadow: none;
    font-family: var(--pn-ff);
    font-weight: 400;
    letter-spacing: 0;
    transition: background-color var(--dur) var(--ease),
                color var(--dur) var(--ease),
                border-color var(--dur) var(--ease);
}
.lb-std .lb-main .pn-btn-primary,
.lb-std .lb-main .pn-btn-buy {
    background: var(--pn-buy-solid);
    color: var(--pn-buy-ink);
    border: 1px solid var(--pn-buy-solid);
}
.lb-std .lb-main .pn-btn-primary:hover,
.lb-std .lb-main .pn-btn-buy:hover {
    background: var(--pn-buy-hover);
    border-color: var(--pn-buy-hover);
}

.lb-std .lb-main .pn-btn-secondary,
.lb-std .lb-main .pn-btn-quiet {
    background: transparent;
    color: var(--pn-ink);
    border: 1px solid var(--pn-hairline-strong);
}
.lb-std .lb-main .pn-btn-secondary:hover,
.lb-std .lb-main .pn-btn-quiet:hover {
    background: transparent;
    border-color: var(--pn-ink);
}

.lb-std .lb-main .pn-input,
.lb-std .lb-main .form-control,
.lb-std .lb-main input[type="text"],
.lb-std .lb-main input[type="email"],
.lb-std .lb-main input[type="tel"],
.lb-std .lb-main input[type="password"],
.lb-std .lb-main input[type="number"],
.lb-std .lb-main textarea,
.lb-std .lb-main select {
    background: transparent;
    border: 0;
    border-bottom: 1px solid var(--pn-hairline-strong);
    border-radius: 0;
    box-shadow: none;
    color: var(--pn-ink);
    transition: border-color var(--dur) var(--ease);
}
.lb-std .lb-main .pn-input:focus,
.lb-std .lb-main .form-control:focus,
.lb-std .lb-main input:focus,
.lb-std .lb-main textarea:focus,
.lb-std .lb-main select:focus {
    outline: 0;
    border-bottom-color: var(--pn-ink);
    box-shadow: none;
}
.lb-std .lb-main ::placeholder { color: var(--pn-muted); opacity: 1; }

.lb-std .lb-main .pn-hd-input,
.lb-std .lb-main .pn-field .pn-input {
    border: 1px solid var(--pn-hairline);
    padding-inline: var(--space-4);
}

.lb-std .lb-main .card,
.lb-std .lb-main .pn-card,
.lb-std .lb-main .sidebar-widget,
.lb-std .lb-main .dash-card {
    background: var(--pn-surface);
    border: 1px solid var(--pn-hairline);
    border-radius: var(--pn-r-sm);
    box-shadow: none;
}
.lb-std .lb-main hr,
.lb-std .lb-main .pn-divider { border: 0; border-top: 1px solid var(--pn-hairline); }

.lb-std .lb-main .breadcrumb {
    font-size: var(--fs-caption);
    color: var(--pn-muted);
}
.lb-std .lb-main .breadcrumb-item a { color: var(--pn-muted); text-decoration: none; }
.lb-std .lb-main .breadcrumb-item a:hover { color: var(--pn-ink); }
.lb-std .lb-main .breadcrumb-item.active { color: var(--pn-ink); }

.lb-std .lb-main .pn-link,
.lb-std .lb-main .prose a {
    color: var(--pn-ink);
    text-decoration: underline;
    text-underline-offset: .3em;
    text-decoration-thickness: 1px;
    text-decoration-color: var(--pn-hairline-strong);
    transition: text-decoration-color var(--dur) var(--ease);
}
.lb-std .lb-main .pn-link:hover,
.lb-std .lb-main .prose a:hover { text-decoration-color: var(--pn-ink); }

.lb-std .lb-main :focus-visible {
    outline: 0;
    box-shadow: var(--pn-focus-ring);
    border-radius: var(--pn-r-sm);
}

@media (prefers-reduced-motion: reduce) {
    .lb-std .lb-main *,
    .lb-std .lb-main *::before,
    .lb-std .lb-main *::after {
        animation-duration: .01ms !important;
        transition-duration: .01ms !important;
    }
}

/* ═════════════════════════════════════════════════════════════════════════
   LEBASINO — where the shared markup differs from charmineh's copies
   ═════════════════════════════════════════════════════════════════════════ */

/* /Views/Home/Faq: the script toggles .open on .faq-question and .faq-answer
   (charmineh's own view moved it to .faq-item and wraps a .faq-answer-body), so
   the grid rule above never closes these and every answer showed. */
.lb-std .faq-answer:not(:has(> .faq-answer-body)) {
    display: none;
    padding: 0 var(--space-4) var(--space-4);
    font-size: var(--fs-body-sm);
    line-height: var(--lh-body);
    color: var(--pn-body);
}
.lb-std .faq-answer.open:not(:has(> .faq-answer-body)) { display: block; }
.lb-std .faq-question > i { transition: transform var(--dur) var(--ease); }
.lb-std .faq-question.open > i { transform: rotate(180deg); }

/* The shared views carry inline sizes written for ksport's 10px root
   (style="font-size:1.3rem" meant 13px). lebasino's root is 16px, so the order
   summary in checkout, the contact page and the dashboard cards printed them at
   1.6x. Inline styles only yield to !important; every value the shared views use
   (grep 'font-size:[0-9.]*rem' Views/{Cart,Checkout,Dashboard,Home,...}) is here. */
.lb-std .lb-main [style*="font-size:1.2rem"] { font-size: 12px !important; }
.lb-std .lb-main [style*="font-size:1.25rem"] { font-size: 12px !important; }
.lb-std .lb-main [style*="font-size:1.3rem"] { font-size: 13px !important; }
.lb-std .lb-main [style*="font-size:1.35rem"] { font-size: 14px !important; }
.lb-std .lb-main [style*="font-size:1.4rem"] { font-size: 14px !important; }
.lb-std .lb-main [style*="font-size:1.5rem"] { font-size: 15px !important; }
.lb-std .lb-main [style*="font-size:1.6rem"] { font-size: 16px !important; }
.lb-std .lb-main [style*="font-size:1.8rem"] { font-size: 18px !important; }
.lb-std .lb-main [style*="font-size:2rem"] { font-size: 20px !important; }
.lb-std .lb-main [style*="font-size:2.5rem"] { font-size: 25px !important; }
.lb-std .lb-main [style*="font-size:2.8rem"] { font-size: 28px !important; }
.lb-std .lb-main [style*="font-size:4rem"] { font-size: 40px !important; }
.lb-std .lb-main [style*="font-size: 1rem"] { font-size: 10px !important; }

/* Checkout «save this address»: the template styles bare checkboxes at 48px. */
.lb-std .addr-save-check input[type="checkbox"] {
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
    accent-color: var(--pn-buy);
}
.lb-std .addr-save-check { display: inline-flex; align-items: center; gap: var(--space-2); }

/* /Views/Cart: charmineh rewrote its cart without the <table>; the shared view
   still has .cart-table, which nothing styled — on a phone it pushed the page
   55px sideways. Desktop: a quiet table. Below 768px each row becomes a card. */
.lb-std .cart-table-wrap {
    border: 1px solid var(--pn-hairline);
    border-radius: var(--pn-r-md);
    background: var(--pn-surface);
}
.lb-std .cart-table { width: 100%; border-collapse: collapse; }
.lb-std .cart-table th {
    padding: var(--space-3) var(--space-4);
    border-bottom: 1px solid var(--pn-hairline);
    color: var(--pn-muted);
    font-size: var(--fs-caption);
    font-weight: 400;
    text-align: start;
    white-space: nowrap;
}
.lb-std .cart-table td {
    padding: var(--space-4);
    border-bottom: 1px solid var(--pn-hairline);
    vertical-align: middle;
}
.lb-std .cart-table tbody tr:last-child td { border-bottom: 0; }
.lb-std .cart-table .cart-product-info { display: flex; align-items: center; gap: var(--space-3); }
.lb-std .cart-table .cart-product-img { width: 72px; height: 72px; flex: 0 0 72px; object-fit: contain; }
.lb-std .cart-table .cart-product-title { color: var(--pn-ink); font-size: var(--fs-body-sm); text-decoration: none; }
.lb-std .cart-table .cart-product-variant { margin-top: var(--space-1); color: var(--pn-muted); font-size: var(--fs-caption); }
.lb-std .cart-table .price-old { display: block; color: var(--pn-muted); font-size: var(--fs-caption); text-decoration: line-through; }
.lb-std .cart-table .cart-price { white-space: nowrap; }

@media (max-width: 767px) {
    .lb-std .cart-table thead { display: none; }
    .lb-std .cart-table,
    .lb-std .cart-table tbody { display: block; }
    .lb-std .cart-table tr {
        display: grid;
        grid-template-columns: 1fr auto auto;
        align-items: center;
        gap: var(--space-2) var(--space-3);
        padding: var(--space-4);
        border-bottom: 1px solid var(--pn-hairline);
    }
    .lb-std .cart-table tbody tr:last-child { border-bottom: 0; }
    .lb-std .cart-table td { display: block; padding: 0; border: 0; }
    /* product spans the row; unit price is implied by the line total below it */
    .lb-std .cart-table td:nth-child(1) { grid-column: 1 / -1; }
    .lb-std .cart-table td:nth-child(2) { display: none; }
}

/* ── Contact: map, social links, form result (shared Views/Home/ContactUs, from default's dashboard.css) ── */
.lb-std .contact-info-cards + .row { margin-top: var(--space-6); }
.lb-std .contact-form-msg { margin: 0 0 var(--space-4); padding: var(--space-3) var(--space-4); border-radius: var(--pn-r-lg); background: #eef7ee; color: #2e6b32; font-size: var(--fs-body-sm); }
.lb-std .contact-map-box { border-radius: var(--pn-r-lg); overflow: hidden; margin-bottom: var(--space-4); border: 1px solid var(--pn-hairline); }
.lb-std .contact-map-box .site-page-map { margin: 0; }
.lb-std .contact-social-box { padding: var(--space-5); border: 1px solid var(--pn-hairline); border-radius: var(--pn-r-lg); background: var(--pn-surface); }
.lb-std .contact-social-title { margin: 0 0 var(--space-4); font-family: var(--pn-ff-med); font-size: var(--fs-body); color: var(--pn-ink); }
.lb-std .contact-social-list { display: flex; flex-direction: column; gap: var(--space-3); }
.lb-std .contact-social-row { display: flex; align-items: center; gap: var(--space-3); padding: var(--space-3) var(--space-4); border: 1px solid var(--pn-hairline); border-radius: var(--pn-r-lg); color: var(--pn-ink); text-decoration: none; }
.lb-std .contact-social-row:hover { border-color: var(--pn-hairline-strong); background: var(--pn-sunken); }
.lb-std .contact-social-icon { display: grid; place-items: center; width: 40px; height: 40px; flex-shrink: 0; border-radius: 50%; background: var(--pn-sunken); color: var(--pn-buy); }
.lb-std .contact-social-name { font-size: var(--fs-body-sm); }
