/* ================================================================
   ROYAL MODERN SKIN — custom override layer
   ----------------------------------------------------------------
   Loaded AFTER theme.css. Every rule is scoped under
   `body.theme-saree`, so removing the <link> in base.php (or the
   body class) reverts the site to the stock theme with no cleanup.

   Direction : royal, not antique. Deep wine + real gold against warm
               ivory, executed with contemporary type, soft radii and
               layered depth. Grandeur without filigree.
   Type      : Playfair Display (regal display) + Plus Jakarta Sans.

   1.  Design Tokens
   2.  Typography & Base
   3.  Buttons
   4.  Announcement Bar & Promise Strip
   5.  Header / Navigation
   6.  Mini Cart
   7.  Hero Slider
   8.  Section Headings
   9.  Category Grid
   10. Product Cards
   11. Royal Editorial Band
   12. Brand Carousel
   13. Breadcrumbs & Inner Pages
   14. Footer
   15. Misc
   16. Responsive
   ================================================================ */


/* ---- 1. Design Tokens ---- */
body.theme-saree {
    /* Jewel core */
    --wine:       #5C1A2B;
    --wine-deep:  #3B0F1C;
    --wine-dark:  #24101A;
    --wine-tint:  #F6ECEE;

    /* Gold — a metal, used sparingly, never as filigree */
    --gold:       #C9A227;
    --gold-lt:    #E8D08B;
    --gold-dk:    #A67C13;
    --gold-grad:  linear-gradient(135deg, #E8D08B 0%, #C9A227 48%, #A67C13 100%);

    /* Warm neutrals */
    --ivory:      #FBF8F4;
    --cream:      #F5EFE7;
    --surface:    #FFFFFF;

    --ink:        #221319;
    --ink-2:      #4A3B40;
    --muted:      #857077;
    --border:     #EAE0D7;

    --ff-d: 'Playfair Display', Georgia, serif;
    --ff:   'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;

    /* Warm-tinted depth — richer than neutral grey shadow */
    --sh-1: 0 1px 2px rgba(59, 15, 28, .05);
    --sh-2: 0 3px 10px rgba(59, 15, 28, .07), 0 1px 2px rgba(59, 15, 28, .05);
    --sh-3: 0 14px 36px rgba(59, 15, 28, .12), 0 3px 8px rgba(59, 15, 28, .06);
    --sh-4: 0 28px 68px rgba(59, 15, 28, .18), 0 5px 14px rgba(59, 15, 28, .08);

    --r-sm: 10px;
    --r-md: 14px;
    --r-lg: 20px;
    --r-pill: 999px;

    --ease: cubic-bezier(.2, .8, .2, 1);

    /* Fine diagonal weave, same cloth motif as the hero — layered under
       a solid/gradient fill so buttons read as fabric, not flat color. */
    --tex-on-wine: repeating-linear-gradient(45deg, rgba(255,255,255,.07) 0 1px, transparent 1px 9px),
                   repeating-linear-gradient(-45deg, rgba(255,255,255,.07) 0 1px, transparent 1px 9px);
    --tex-on-gold: repeating-linear-gradient(45deg, rgba(59,15,28,.08) 0 1px, transparent 1px 9px),
                   repeating-linear-gradient(-45deg, rgba(59,15,28,.08) 0 1px, transparent 1px 9px);
}


/* ---- 2. Typography & Base ---- */
body.theme-saree {
    font-family: var(--ff);
    background: var(--ivory);
    color: var(--ink);
    font-size: 15px;
    line-height: 1.62;
    letter-spacing: -.005em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Display serif, tight — regal but contemporary */
body.theme-saree h1,
body.theme-saree h2,
body.theme-saree h3 {
    font-family: var(--ff-d);
    font-weight: 600;
    line-height: 1.13;
    letter-spacing: -.018em;
    color: var(--ink);
}

body.theme-saree a { color: var(--ink); transition: color .2s var(--ease); }
body.theme-saree a:hover { color: var(--wine); }

body.theme-saree .price-new,
body.theme-saree .price-old,
body.theme-saree .minicart-total {
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum";
}

/* Gold text, as metal rather than flat yellow */
body.theme-saree .u-gold {
    background: var(--gold-grad);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* Small eyebrow label above headings */
body.theme-saree .u-eyebrow {
    display: inline-block;
    font-family: var(--ff);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--gold-dk);
    margin-bottom: 10px;
}

/* Short gold bar — the single ornament that survives */
body.theme-saree .u-bar {
    display: block;
    width: 46px;
    height: 3px;
    border-radius: var(--r-pill);
    background: var(--gold-grad);
    margin-top: 14px;
}
body.theme-saree .u-bar--center { margin-left: auto; margin-right: auto; }


/* ---- 3. Buttons ---- */
body.theme-saree .btn,
body.theme-saree .btn--full,
body.theme-saree button.fn-btn {
    font-family: var(--ff);
    font-size: 14px;
    font-weight: 600;
    letter-spacing: -.008em;
    text-transform: none;
    background: var(--tex-on-wine), var(--wine);
    border: 1px solid var(--wine);
    color: #fff;
    border-radius: var(--r-sm);
    padding: 13px 28px;
    box-shadow: var(--sh-1);
    transition: background-color .24s var(--ease), border-color .24s var(--ease),
                transform .24s var(--ease), box-shadow .24s var(--ease);
}
body.theme-saree .btn:hover,
body.theme-saree .btn--full:hover,
body.theme-saree button.fn-btn:hover {
    background: var(--tex-on-wine), var(--wine-deep);
    border-color: var(--wine-deep);
    color: #fff;
    transform: translateY(-2px);
    box-shadow: var(--sh-3);
}
body.theme-saree .btn:active { transform: translateY(0); }

/* Gold button — reserved for the one primary moment per section */
body.theme-saree .btn-gold {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    font-family: var(--ff);
    font-size: 14px;
    font-weight: 700;
    letter-spacing: -.008em;
    background: var(--tex-on-gold), var(--gold-grad);
    border: 0;
    color: var(--wine-dark);
    border-radius: var(--r-sm);
    padding: 14px 32px;
    box-shadow: 0 6px 20px rgba(201, 162, 39, .3);
    transition: transform .24s var(--ease), box-shadow .24s var(--ease), filter .24s var(--ease);
}
body.theme-saree .btn-gold:hover {
    color: var(--wine-dark);
    transform: translateY(-2px);
    filter: brightness(1.06);
    box-shadow: 0 12px 30px rgba(201, 162, 39, .4);
}

body.theme-saree .btn-viewall {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: -.008em;
    text-transform: none;
    color: var(--wine);
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--r-sm);
    padding: 13px 30px;
    box-shadow: var(--sh-1);
    transition: all .24s var(--ease);
}
body.theme-saree .btn-viewall:hover {
    background: var(--tex-on-wine), var(--wine);
    border-color: var(--wine);
    color: #fff;
    transform: translateY(-2px);
    box-shadow: var(--sh-3);
}
body.theme-saree .section-viewall-wrap { margin-top: 36px; text-align: center; }


/* ---- 4. Announcement Bar & Promise Strip ---- */
body.theme-saree .announce-bar {
    background: linear-gradient(90deg, var(--wine-dark) 0%, var(--wine) 50%, var(--wine-dark) 100%);
    color: rgba(255, 255, 255, .9);
    border-bottom: 1px solid rgba(201, 162, 39, .28);
    padding: 0;
}
body.theme-saree .announce-text {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    height: 38px;
    font-size: 12.5px;
    font-weight: 500;
    letter-spacing: -.002em;
    text-transform: none;
    text-align: center;
}
body.theme-saree .announce-text span { white-space: nowrap; }
/* Gold diamonds, not dots — the one ornament the announce bar gets */
body.theme-saree .announce-text .sep {
    width: 5px;
    height: 5px;
    background: var(--gold);
    border-radius: 1px;
    transform: rotate(45deg);
    flex: none;
}

body.theme-saree .usp-bar {
    border-top: 0;
    border-bottom: 1px solid var(--border);
    background: var(--surface);
}
body.theme-saree .usp-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 8px;
}
body.theme-saree .usp-item {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 3px 12px;
    padding: 22px 14px;
    text-align: left;
    border-left: 0;
    border-radius: var(--r-md);
    transition: background .24s var(--ease);
}
body.theme-saree .usp-item:hover { background: var(--cream); }
body.theme-saree .usp-item i {
    font-size: 17px;
    color: var(--gold-dk);
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--wine-tint);
    border-radius: var(--r-pill);
    flex: none;
}
body.theme-saree .usp-item strong {
    font-family: var(--ff);
    font-size: 13.5px;
    font-weight: 600;
    letter-spacing: -.012em;
    text-transform: none;
    color: var(--ink);
    display: block;
    width: calc(100% - 52px);
}
body.theme-saree .usp-item span {
    font-size: 12.5px;
    color: var(--muted);
    display: block;
    width: calc(100% - 52px);
    margin-left: 52px;
    margin-top: -3px;
}


/* ---- 5. Header / Navigation ----
   A warm ivory bar rather than white: it continues the page ground
   instead of capping it, and a hairline gold rule underneath is what
   ties the header to the wine-and-gold hero below. */
body.theme-saree .hdr-content {
    background: rgba(251, 248, 244, .92);
    -webkit-backdrop-filter: saturate(180%) blur(16px);
    backdrop-filter: saturate(180%) blur(16px);
}
body.theme-saree .hdr {
    background: rgba(251, 248, 244, .92);
    /* Deliberately NO backdrop-filter on the wrapper. theme.css puts one
       here, which makes .hdr the containing block for its fixed-position
       descendants — the drawer and its dimmer then size to the header's box
       instead of the viewport. The blur belongs on the inner bars anyway,
       which is where it is actually visible. */
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    border-bottom: 0;
    box-shadow: 0 1px 0 rgba(59, 15, 28, .05);
}
body.theme-saree .hdr.hdr--scrolled { box-shadow: 0 6px 24px rgba(59, 15, 28, .09); }

body.theme-saree .hdr-desktop .hdr-content {
    position: relative;
    border-bottom: 1px solid var(--border);
    padding: 0;
}
/* The gold rule: strongest at centre, dissolving at both edges */
body.theme-saree .hdr-desktop .hdr-content::after {
    content: '';
    position: absolute;
    left: 0; right: 0; bottom: -1px;
    height: 1px;
    pointer-events: none;
    background: linear-gradient(90deg,
        transparent 0%,
        rgba(201, 162, 39, .30) 16%,
        rgba(201, 162, 39, .75) 50%,
        rgba(201, 162, 39, .30) 84%,
        transparent 100%);
}
body.theme-saree .hdr.hdr--scrolled .hdr-content { background: rgba(251, 248, 244, .97); }

body.theme-saree .sticky-holder {
    background: rgba(251, 248, 244, .95);
    -webkit-backdrop-filter: saturate(180%) blur(16px);
    backdrop-filter: saturate(180%) blur(16px);
    border-bottom: 1px solid var(--border);
    box-shadow: var(--sh-2);
}

/* Deep topline — the first royal note on the page */
body.theme-saree .hdr-topline {
    background: var(--wine-dark);
    border-bottom: 0;
    font-size: 12.5px;
}
body.theme-saree .hdr-topline .custom-text { color: rgba(255, 255, 255, .62); }
body.theme-saree .hdr-topline .custom-text span { color: var(--gold-lt); font-weight: 600; }
body.theme-saree .hdr-topline-center .custom-text {
    text-transform: none;
    letter-spacing: -.002em;
    font-size: 12.5px;
    color: rgba(255, 255, 255, .62);
}
body.theme-saree .hdr-topline-left .custom-text {
    font-size: 11px;
    font-weight: 500;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, .5);
}
body.theme-saree .dropdn_account {
    display: flex;
    align-items: center;
    gap: 12px;
}
body.theme-saree .topline-sep {
    width: 1px;
    height: 12px;
    background: rgba(255, 255, 255, .18);
    flex: none;
}
body.theme-saree .dropdn-link {
    font-size: 12.5px;
    font-weight: 500;
    letter-spacing: -.006em;
    text-transform: none;
    color: rgba(255, 255, 255, .78);
}
body.theme-saree .dropdn-link:hover { color: var(--gold-lt); }

body.theme-saree .logo img,
body.theme-saree .logo-holder img { max-height: 50px; width: auto; }

/* --- Nav: centred, uppercase, tracked wide. The tracking is what
       reads as boutique rather than as a generic shop bar. --- */
body.theme-saree .hdr-nav { flex: 1; justify-content: center; }
body.theme-saree .mmenu { justify-content: center; gap: 0; }

body.theme-saree .mmenu > li > a {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-family: var(--ff);
    font-size: 11.5px;
    font-weight: 600;
    letter-spacing: .13em;
    text-transform: uppercase;
    color: var(--ink-2);
    padding: 12px 14px;
    margin: 0;
    border-radius: 0;
    position: relative;
    background: none;
    white-space: nowrap;
    transition: color .22s var(--ease);
}
/* Gold rule grows out from the centre of the label */
body.theme-saree .mmenu > li > a::after {
    display: block;
    content: '';
    position: absolute;
    left: 50%; right: 50%;
    bottom: 4px;
    height: 2px;
    border-radius: var(--r-pill);
    background: var(--gold-grad);
    transition: left .3s var(--ease), right .3s var(--ease);
}
body.theme-saree .mmenu > li:hover > a::after,
body.theme-saree .mmenu > li.is-hovered > a::after,
body.theme-saree .mmenu > li.is-active > a::after { left: 14px; right: 14px; }

body.theme-saree .mmenu > li:hover > a,
body.theme-saree .mmenu > li.is-hovered > a,
body.theme-saree .mmenu > li.is-active > a {
    color: var(--wine);
    background: none;
}

/* Caret on items that carry a submenu */
body.theme-saree .mmenu-caret {
    font-size: 8px;
    opacity: .5;
    transition: transform .24s var(--ease), opacity .24s var(--ease);
}
body.theme-saree .mmenu > li:hover .mmenu-caret,
body.theme-saree .mmenu > li.is-hovered .mmenu-caret { opacity: 1; transform: rotate(180deg); }

/* "More ▾" overflow item, generated by the priority-nav script */
body.theme-saree .js-more-item > a.js-more-toggle {
    font-family: var(--ff);
    font-size: 11.5px;
    font-weight: 600;
    letter-spacing: .13em;
    text-transform: uppercase;
    color: var(--ink-2);
    background: none;
    border: 0;
    border-radius: 0;
    padding: 12px 14px;
}
body.theme-saree .js-more-item > a.js-more-toggle:hover,
body.theme-saree .js-more-item.is-hovered > a.js-more-toggle {
    color: var(--wine);
    background: none;
    border: 0;
}
/* Right-align so the last dropdown never runs off the container */
body.theme-saree .js-more-item .mmenu-submenu { left: auto; right: 0; }

body.theme-saree .mmenu-submenu {
    background: var(--surface);
    border: 1px solid var(--border);
    border-top: 2px solid transparent;
    border-image: var(--gold-grad) 1;
    box-shadow: var(--sh-4);
    border-radius: var(--r-md);
    padding: 8px;
    margin-top: 2px;
}
body.theme-saree .submenu-list li a {
    font-size: 13px;
    font-weight: 500;
    letter-spacing: -.008em;
    color: var(--ink-2);
    padding: 9px 14px;
    border-radius: var(--r-sm);
    transition: background .18s var(--ease), color .18s var(--ease), padding-left .18s var(--ease);
}
body.theme-saree .submenu-list li a:hover {
    color: var(--wine);
    background: var(--wine-tint);
    padding-left: 18px;
}

/* --- Action cluster (account + cart) --- */
body.theme-saree .hdr-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 0 0 auto;
}
body.theme-saree .hdr-act {
    position: relative;
    width: 42px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    color: var(--ink-2);
    background: rgba(255, 255, 255, .55);
    border: 1px solid var(--border);
    border-radius: var(--r-pill);
    transition: color .24s var(--ease), background .24s var(--ease),
                border-color .24s var(--ease), transform .24s var(--ease);
}
body.theme-saree .hdr-act:hover {
    color: var(--wine);
    background: var(--wine-tint);
    border-color: rgba(201, 162, 39, .5);
    transform: translateY(-1px);
}
/* Label appears under the icon rather than crowding the bar */
body.theme-saree .hdr-act::after {
    content: attr(data-label);
    position: absolute;
    top: calc(100% + 9px);
    left: 50%;
    transform: translateX(-50%) translateY(-4px);
    padding: 5px 10px;
    border-radius: var(--r-sm);
    background: var(--wine-dark);
    color: #fff;
    font-size: 11px;
    font-weight: 500;
    letter-spacing: -.004em;
    white-space: nowrap;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    box-shadow: var(--sh-3);
    transition: opacity .2s var(--ease), transform .2s var(--ease), visibility .2s var(--ease);
}
body.theme-saree .hdr-act:hover::after {
    opacity: 1;
    visibility: visible;
    transform: translateX(-50%) translateY(0);
}

/* Keyboard focus is gold, and must clear the underline animation */
body.theme-saree .hdr-act:focus-visible,
body.theme-saree .minicart-link:focus-visible,
body.theme-saree .mmenu > li > a:focus-visible,
body.theme-saree .hdr-mobile-btn:focus-visible {
    outline: 2px solid var(--gold);
    outline-offset: 3px;
    border-radius: var(--r-sm);
}

/* --- Mobile bar & drawer --- */
body.theme-saree .hdr-mobile {
    background: rgba(251, 248, 244, .95);
    border-bottom: 1px solid var(--border);
}
body.theme-saree .hdr-mobile-btn {
    position: relative;
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    color: var(--ink-2);
    border-radius: var(--r-pill);
    transition: color .22s var(--ease), background .22s var(--ease);
}
body.theme-saree .hdr-mobile-btn:hover,
body.theme-saree .hdr-mobile-btn:active { color: var(--wine); background: var(--wine-tint); }
body.theme-saree .hdr-mobile-badge {
    position: absolute;
    top: 2px;
    right: 0;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--gold-grad);
    color: var(--wine-dark);
    font-size: 10px;
    font-weight: 800;
    line-height: 1;
    border-radius: var(--r-pill);
    box-shadow: 0 0 0 2px var(--ivory);
}

/* Closed position is driven by transform, not by a hardcoded negative left.
   theme.css parks the panel at left:-310px, a figure tuned to its own
   width:290px — so any change to the width leaves part of the drawer on
   screen, pinned over the left edge of the page. translateX(-100%) is
   always exactly one panel-width off screen, whatever the width is. */
body.theme-saree .mobilemenu {
    background: var(--ivory);
    left: 0;
    transform: translateX(-100%);
    transition: transform .3s var(--ease);
    will-change: transform;
}
body.theme-saree .mobilemenu.active,
body.theme-saree .mobilemenu.is-open {
    left: 0;
    transform: translateX(0);
}
body.theme-saree .mobilemenu a { color: var(--ink); text-transform: none; }
/* Drawer header carries the wine so the panel reads as part of the brand */
body.theme-saree .mobilemenu-close {
    background: var(--wine-dark);
    border-bottom: 0;
    color: var(--gold-lt);
    font-family: var(--ff-d);
    font-size: 17px;
    font-weight: 600;
    letter-spacing: -.01em;
    text-transform: none;
    padding: 18px 20px;
}
body.theme-saree .mobilemenu-close::after { color: rgba(255, 255, 255, .7); }
/* The drawer list is <ul class="nav nav-level-1">, and `.nav` is a Bootstrap
   component: `display:flex; flex-wrap:wrap`. That turns every category into a
   flex item, so they lay out side by side in wrapping rows instead of
   stacking. Nothing in theme.css sets display on the list, so Bootstrap wins.
   Force a plain vertical stack. */
body.theme-saree .mobilemenu .nav,
body.theme-saree .mobilemenu .nav-level-1,
body.theme-saree .mobilemenu .nav-level-2 {
    display: block;
    flex-wrap: nowrap;
    width: 100%;
    padding-left: 0;
    margin-bottom: 0;
}
body.theme-saree .mobilemenu .nav > li,
body.theme-saree .mobilemenu .nav-level-1 > li,
body.theme-saree .mobilemenu .nav-level-2 > li {
    display: block;
    width: 100%;
    flex: none;
}

body.theme-saree .nav-level-1 > li > a {
    font-size: 11.5px;
    font-weight: 600;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--ink-2);
    padding: 15px 20px;
    border-bottom: 1px solid var(--border);
}
body.theme-saree .nav-level-1 > li > a:hover,
body.theme-saree .nav-level-1 > li > a.is-active {
    color: var(--wine);
    background: var(--wine-tint);
}
body.theme-saree .nav-level-1 > li:has(.nav-level-2) > a::after {
    border-right-color: var(--gold-dk);
    border-bottom-color: var(--gold-dk);
}
body.theme-saree .nav-level-2 { background: var(--ivory); }
body.theme-saree .nav-level-2 li a {
    font-size: 13.5px;
    color: var(--ink-2);
    border-bottom: 1px solid var(--border);
}
body.theme-saree .nav-level-2 li a:hover { color: var(--wine); background: var(--wine-tint); }
body.theme-saree .nav-toggle { background: var(--wine-tint); border-bottom: 1px solid var(--border); }
body.theme-saree .nav-back { color: var(--wine); }
body.theme-saree .nav-title { color: var(--wine); letter-spacing: .1em; }

body.theme-saree .mobilemenu-foot {
    padding: 18px 20px 26px;
    border-top: 1px solid var(--border);
    background: var(--cream);
}
body.theme-saree .mm-foot-link {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 0;
    font-size: 13.5px;
    font-weight: 500;
    color: var(--ink);
}
body.theme-saree .mm-foot-link i { font-size: 16px; color: var(--gold-dk); }
body.theme-saree .mm-foot-link:hover { color: var(--wine); }
body.theme-saree .mm-foot-note {
    margin: 12px 0 0;
    font-size: 11.5px;
    line-height: 1.55;
    color: var(--muted);
}


/* ---- 6. Mini Cart ----
   theme.css paints .minicart-link with var(--accent) (the #5b21b6 purple
   from global.php). Overridden here to match the ghost action buttons —
   a quiet pill that still carries the running total, with the gold
   counter as the only saturated mark in the bar. */
body.theme-saree .minicart { position: relative; }

body.theme-saree .minicart-link {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    height: 42px;
    padding: 0 16px 0 14px;
    border-radius: var(--r-pill);
    background: rgba(255, 255, 255, .55);
    border: 1px solid var(--border);
    color: var(--ink);
    font-family: var(--ff);
    font-size: 13px;
    font-weight: 600;
    letter-spacing: -.008em;
    box-shadow: none;
    transition: background .24s var(--ease), border-color .24s var(--ease),
                color .24s var(--ease), transform .24s var(--ease);
}
body.theme-saree .minicart-link:hover {
    background: var(--wine-tint);
    border-color: rgba(201, 162, 39, .5);
    color: var(--wine);
    transform: translateY(-1px);
}
body.theme-saree .minicart-link:active { transform: translateY(0); }

body.theme-saree .minicart-link i {
    font-size: 18px;
    line-height: 1;
    color: var(--wine);
    transition: transform .26s var(--ease);
}
body.theme-saree .minicart-link:hover i { transform: scale(1.08); }

/* The bag icon already says "cart" — the word is redundant */
body.theme-saree .minicart-title { display: none; }

body.theme-saree .minicart-total {
    font-size: 13px;
    font-weight: 700;
    color: inherit;
    background: none;
    border-radius: 0;
    padding: 0;
    opacity: 1;
}

/* Counter floats on the corner instead of sitting inline */
body.theme-saree .minicart-qty {
    position: absolute;
    top: -7px;
    right: -5px;
    min-width: 22px;
    width: auto;
    height: 22px;
    padding: 0 6px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--gold-grad);
    color: var(--wine-dark);
    font-family: var(--ff);
    font-size: 11px;
    font-weight: 800;
    line-height: 1;
    border-radius: var(--r-pill);
    box-shadow: 0 0 0 2px var(--ivory), 0 2px 8px rgba(59, 15, 28, .35);
}
/* Dark sticky/mobile bars need a matching ring colour */
body.theme-saree .sticky-holder .minicart-qty {
    box-shadow: 0 0 0 2px rgba(255, 255, 255, .96), 0 2px 8px rgba(59, 15, 28, .35);
}

body.theme-saree .minicart-drop {
    border: 1px solid var(--border);
    border-radius: var(--r-md);
    box-shadow: var(--sh-4);
    overflow: hidden;
}
body.theme-saree .minicart-drop h3 {
    font-family: var(--ff-d);
    font-size: 21px;
    font-weight: 600;
    text-transform: none;
    letter-spacing: -.014em;
    color: var(--ink);
}
body.theme-saree .minicart-drop-close {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .1em;
    color: var(--muted);
    transition: color .2s var(--ease);
}
body.theme-saree .minicart-drop-close:hover { color: var(--wine); }
body.theme-saree .minicart-prd { border-bottom: 1px solid var(--border); }
body.theme-saree .minicart-prd-image img { border-radius: var(--r-sm); }
body.theme-saree .minicart-prd-name h2 a {
    font-family: var(--ff);
    font-size: 13.5px;
    font-weight: 600;
    color: var(--ink);
}
body.theme-saree .minicart-prd-price b { color: var(--wine); }
body.theme-saree .minicart-drop-summa b {
    font-family: var(--ff-d);
    font-size: 21px;
    color: var(--wine);
}

/* Drop the total once the nav needs the room, leaving an icon-only pill */
@media (max-width: 1199px) {
    body.theme-saree .minicart-link {
        gap: 0;
        padding: 0;
        width: 42px;
        justify-content: center;
    }
    body.theme-saree .minicart-total { display: none; }
    body.theme-saree .minicart-link i { font-size: 19px; }
    body.theme-saree .minicart-qty { top: -5px; right: -5px; }
}
body.theme-saree .minicart-drop {
    border: 1px solid var(--border);
    border-radius: var(--r-md);
    box-shadow: var(--sh-4);
    overflow: hidden;
}
body.theme-saree .minicart-drop h3 {
    font-family: var(--ff-d);
    font-size: 21px;
    font-weight: 600;
}


/* ---- 7a. Royal Hero (typography-led, no image dependency) ---- */
body.theme-saree .hero-royal {
    position: relative;
    overflow: hidden;
    padding: clamp(58px, 8vw, 104px) 0;
    background:
        radial-gradient(90% 120% at 78% 12%, rgba(201, 162, 39, .20) 0%, transparent 58%),
        radial-gradient(70% 100% at 10% 92%, rgba(201, 162, 39, .10) 0%, transparent 55%),
        linear-gradient(125deg, var(--wine-dark) 0%, var(--wine-deep) 48%, var(--wine) 100%);
    color: #fff;
}
/* Fine diagonal weave — texture at 3% opacity, reads as cloth not pattern */
body.theme-saree .hero-royal::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image:
        repeating-linear-gradient(45deg, rgba(255,255,255,.05) 0 1px, transparent 1px 9px),
        repeating-linear-gradient(-45deg, rgba(255,255,255,.05) 0 1px, transparent 1px 9px);
    pointer-events: none;
}
/* Gold seam closing the hero */
body.theme-saree .hero-royal::after {
    content: "";
    position: absolute;
    left: 0; right: 0; bottom: 0;
    height: 3px;
    background: var(--gold-grad);
}

body.theme-saree .hero-royal-inner {
    position: relative;
    z-index: 1;
    max-width: 760px;
}
body.theme-saree .hero-royal .u-eyebrow {
    color: var(--gold-lt);
    display: inline-flex;
    align-items: center;
    gap: 9px;
}
body.theme-saree .hero-royal .u-eyebrow::before {
    content: "";
    width: 26px;
    height: 2px;
    border-radius: var(--r-pill);
    background: var(--gold-grad);
}
body.theme-saree .hero-royal h1 {
    font-family: var(--ff-d);
    font-size: clamp(34px, 5.4vw, 66px);
    font-weight: 600;
    line-height: 1.06;
    letter-spacing: -.026em;
    color: #fff;
    margin: 0 0 20px;
}
body.theme-saree .hero-royal h1 em {
    font-style: italic;
    font-weight: 500;
    background: var(--gold-grad);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
body.theme-saree .hero-royal p {
    font-family: var(--ff);
    font-size: clamp(14.5px, 1.3vw, 17px);
    line-height: 1.72;
    color: rgba(255, 255, 255, .74);
    margin: 0 0 32px;
    max-width: 520px;
}
body.theme-saree .hero-cta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px;
}
body.theme-saree .btn-ghost {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    font-family: var(--ff);
    font-size: 14px;
    font-weight: 600;
    letter-spacing: -.008em;
    color: #fff;
    background: rgba(255, 255, 255, .07);
    border: 1px solid rgba(255, 255, 255, .26);
    border-radius: var(--r-sm);
    padding: 14px 30px;
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
    transition: background .24s var(--ease), border-color .24s var(--ease), transform .24s var(--ease);
}
body.theme-saree .btn-ghost:hover {
    background: rgba(255, 255, 255, .14);
    border-color: rgba(255, 255, 255, .5);
    color: #fff;
    transform: translateY(-2px);
}


/* ---- 7b. Offers Band (contains the loud promo artwork) ---- */
body.theme-saree .offers-band { padding: 52px 0; background: var(--ivory); }
body.theme-saree .offers-band .hero-section {
    border-radius: var(--r-lg);
    overflow: hidden;
    box-shadow: var(--sh-3);
    max-width: 1040px;
    margin: 0 auto;
}
body.theme-saree .offers-band .hero-section::after { display: none; }
body.theme-saree .offers-band .carousel-item img {
    height: clamp(190px, 22vw, 300px);
}


/* ---- 7c. Secondary Sliders ---- */
body.theme-saree .hero-section { background: var(--cream); position: relative; }

/* Banner height. Explicit clamp — without it the natural ~1.71 image ratio
   makes the slider ~820px tall on a wide screen. Tune: min / fluid / max. */
body.theme-saree .hero-section .carousel-item img {
    width: 100%;
    height: clamp(260px, 30vw, 420px);
    object-fit: cover;
    object-position: center;
    display: block;
}
@media (max-width: 768px) {
    body.theme-saree .hero-section .carousel-item img { height: clamp(180px, 38vw, 280px); }
}
@media (max-width: 480px) {
    body.theme-saree .hero-section .carousel-item img { height: clamp(140px, 42vw, 200px); }
}

body.theme-saree .carousel-control-prev,
body.theme-saree .carousel-control-next {
    width: 46px;
    height: 46px;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(255, 255, 255, .93);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    border: 0;
    border-radius: var(--r-pill);
    box-shadow: var(--sh-2);
    opacity: 0;
    transition: opacity .28s var(--ease), transform .28s var(--ease);
    margin: 0 22px;
}
body.theme-saree .hero-section:hover .carousel-control-prev,
body.theme-saree .hero-section:hover .carousel-control-next { opacity: 1; }
body.theme-saree .carousel-control-prev:hover,
body.theme-saree .carousel-control-next:hover { transform: translateY(-50%) scale(1.08); }
body.theme-saree .carousel-control-prev-icon,
body.theme-saree .carousel-control-next-icon {
    width: 11px; height: 11px;
    filter: none;
    background-image: none;
    border-top: 2px solid var(--wine);
    border-right: 2px solid var(--wine);
    border-radius: 1px;
}
body.theme-saree .carousel-control-prev-icon { transform: rotate(-135deg); margin-left: 4px; }
body.theme-saree .carousel-control-next-icon { transform: rotate(45deg); margin-right: 4px; }

body.theme-saree .carousel-indicators li { background: rgba(255, 255, 255, .5); border-radius: var(--r-pill); }
body.theme-saree .carousel-indicators li.active { background: var(--gold-lt); }


/* ---- 8. Section Headings ---- */
body.theme-saree .holder { padding: 62px 0; }

body.theme-saree .home-section-hdr {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    margin-bottom: 30px;
    padding-bottom: 0;
    border-bottom: 0;
}
body.theme-saree .home-section-hdr h2 {
    font-family: var(--ff-d);
    font-size: 34px;
    font-weight: 600;
    line-height: 1.14;
    letter-spacing: -.02em;
    margin: 0;
    color: var(--ink);
    padding-left: 0;
    position: relative;
    padding-bottom: 15px;
}
/* gold underline replaces the old left bar */
body.theme-saree .home-section-hdr h2::before {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    top: auto;
    width: 46px;
    height: 3px;
    border-radius: var(--r-pill);
    background: var(--gold-grad);
}

body.theme-saree .section-hdr-right { display: flex; align-items: center; gap: 14px; }
body.theme-saree .view-all-link {
    font-size: 13.5px;
    font-weight: 600;
    letter-spacing: -.008em;
    text-transform: none;
    color: var(--wine);
    border-bottom: 0;
    padding: 8px 14px;
    border-radius: var(--r-sm);
    transition: background .22s var(--ease);
}
body.theme-saree .view-all-link:hover { background: var(--wine-tint); }

body.theme-saree .cnav-btn {
    width: 38px;
    height: 38px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--r-pill);
    color: var(--ink-2);
    box-shadow: var(--sh-1);
    transition: all .22s var(--ease);
}
body.theme-saree .cnav-btn:hover {
    background: var(--wine);
    border-color: var(--wine);
    color: #fff;
    box-shadow: var(--sh-2);
}


/* ---- 9. Category Grid ---- */
body.theme-saree .cat-grid-section {
    padding: 68px 0 62px;
    background: var(--cream);
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
}
body.theme-saree .cat-grid-hdr { text-align: center; margin-bottom: 38px; }
body.theme-saree .cat-grid-hdr h2 {
    font-family: var(--ff-d);
    font-size: 40px;
    font-weight: 600;
    letter-spacing: -.022em;
    margin: 0 0 7px;
    color: var(--ink);
}
body.theme-saree .cat-grid-hdr p {
    font-size: 14.5px;
    color: var(--muted);
    letter-spacing: -.006em;
    margin: 0;
}
/* filigree rule -> short gold bar */
body.theme-saree .cat-grid-hdr-line {
    display: block;
    position: relative;
    width: 46px;
    height: 3px;
    margin: 18px auto 0;
    background: var(--gold-grad);
    border-radius: var(--r-pill);
}
body.theme-saree .cat-grid-hdr-line::after { display: none; }

body.theme-saree .cat-grid { gap: 28px; }

body.theme-saree .cat-gc {
    border-radius: var(--r-lg);
    border: 0;
    box-shadow: var(--sh-2);
    overflow: hidden;
    transition: box-shadow .38s var(--ease), transform .38s var(--ease);
}
body.theme-saree .cat-gc:hover { box-shadow: var(--sh-4); transform: translateY(-5px); }
body.theme-saree .cat-gc-media { aspect-ratio: 4 / 5; }
body.theme-saree .cat-gc-media img {
    width: 100%; height: 100%;
    object-fit: cover;
    transition: transform 1.05s var(--ease);
}
body.theme-saree .cat-gc:hover .cat-gc-media img { transform: scale(1.07); }

body.theme-saree .cat-gc-overlay {
    background: linear-gradient(180deg, transparent 30%, rgba(36, 16, 26, .86) 100%);
    padding: 22px 18px 19px;
}
body.theme-saree .cat-gc-name {
    font-family: var(--ff-d);
    font-size: 21px;
    font-weight: 600;
    letter-spacing: -.014em;
    color: #fff;
}
body.theme-saree .cat-gc-cta {
    font-family: var(--ff);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: none;
    color: var(--gold-lt);
    margin-top: 3px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: gap .28s var(--ease);
}
body.theme-saree .cat-gc:hover .cat-gc-cta { gap: 11px; }

body.theme-saree .cat-gc-fallback {
    background: linear-gradient(150deg, var(--wine) 0%, var(--wine-dark) 100%) !important;
}
body.theme-saree .cat-gc-letter {
    font-family: var(--ff-d);
    font-size: 52px;
    font-weight: 600;
    color: var(--gold-lt);
}


/* ---- 10. Product Cards ---- */
body.theme-saree .prd-grid { gap: 0; }

/* theme.css wraps every card in a white panel (bg + 1px border + 14px
   radius). This skin is editorial instead: a rounded image sitting on the
   page ground with the text below it, which is why .prd-info only carries
   2px of side padding. Without this reset the copy sits 2px off a visible
   border — cramped on desktop, unreadable on a phone-width card. */
body.theme-saree .prd {
    background: transparent;
    border: 0;
    border-radius: 0;
    overflow: visible;
    box-shadow: none;
}
body.theme-saree .prd:hover { box-shadow: none; transform: none; }

body.theme-saree .prd-inside {
    background: transparent;
    border: 0;
    border-radius: var(--r-md);
    box-shadow: none;
    padding: 0 0 18px;
    transition: transform .3s var(--ease);
}
body.theme-saree .prd:hover .prd-inside { transform: translateY(-4px); }

body.theme-saree .prd-img-area {
    background: var(--cream);
    border-radius: var(--r-md);
    overflow: hidden;
    box-shadow: var(--sh-1);
    transition: box-shadow .3s var(--ease);
}
body.theme-saree .prd:hover .prd-img-area { box-shadow: var(--sh-3); }

body.theme-saree .prd-img {
    display: block;
    aspect-ratio: 3 / 4;
    overflow: hidden;
    border-radius: var(--r-md);
}
body.theme-saree .prd-img img {
    width: 100%; height: 100%;
    object-fit: cover;
    transition: transform 1.05s var(--ease);
}
body.theme-saree .prd:hover .prd-img img { transform: scale(1.06); }

body.theme-saree .prd-badges { top: 11px; left: 11px; }
body.theme-saree .prd-badges span,
body.theme-saree .badge-new,
body.theme-saree .badge-sale {
    background: var(--gold-grad);
    color: var(--wine-dark);
    font-family: var(--ff);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: -.002em;
    text-transform: none;
    border-radius: var(--r-pill);
    padding: 5px 12px;
    box-shadow: var(--sh-1);
}

body.theme-saree .prd-wish {
    top: 11px; right: 11px;
    width: 34px; height: 34px;
    background: rgba(255, 255, 255, .95);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    border: 0;
    border-radius: var(--r-pill);
    color: var(--ink-2);
    box-shadow: var(--sh-1);
    opacity: 0;
    transform: translateY(-4px);
    transition: opacity .26s var(--ease), transform .26s var(--ease), color .2s var(--ease);
}
body.theme-saree .prd:hover .prd-wish { opacity: 1; transform: translateY(0); }
body.theme-saree .prd-wish:hover { color: var(--wine); }

body.theme-saree .prd-info { padding: 16px 2px 0; text-align: left; }

body.theme-saree .prd-title {
    font-family: var(--ff);
    font-size: 14.5px;
    font-weight: 500;
    line-height: 1.42;
    letter-spacing: -.012em;
    margin: 0 0 5px;
    min-height: 41px;
}
body.theme-saree .prd-title a { color: var(--ink); }
body.theme-saree .prd-title a:hover { color: var(--wine); }

body.theme-saree .prd-bottom {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 11px;
    margin-top: 4px;
}
body.theme-saree .prd-price-row { justify-content: flex-start; }
body.theme-saree .price-new {
    font-family: var(--ff-d);
    font-size: 21px;
    font-weight: 600;
    letter-spacing: -.014em;
    color: var(--wine);
}
body.theme-saree .price-old {
    font-size: 13px;
    color: var(--muted);
    text-decoration: line-through;
    margin-left: 8px;
}

body.theme-saree .prd-cart-btn {
    width: 100%;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    background: var(--wine-tint);
    border: 0;
    border-radius: var(--r-sm);
    color: var(--wine);
    font-size: 13.5px;
    font-weight: 600;
    letter-spacing: -.008em;
    text-transform: none;
    padding: 11px 10px;
    transition: background .22s var(--ease), color .22s var(--ease);
}
body.theme-saree .prd-cart-btn::after { content: "View"; font-family: var(--ff); }
body.theme-saree .prd-cart-btn:hover { background: var(--tex-on-wine), var(--wine); color: #fff; }

body.theme-saree .prd-info span[style*="color:red"] {
    color: var(--gold-dk) !important;
    font-size: 11.5px !important;
    font-weight: 600;
    text-transform: none;
    background: rgba(201, 162, 39, .12);
    border-radius: var(--r-pill);
    padding: 3px 10px;
    display: inline-block;
    margin-bottom: 7px;
}


/* ---- 11. Hero Stat Row ---- */
body.theme-saree .royal-stats {
    display: flex;
    justify-content: flex-start;
    gap: 52px;
    margin-top: 40px;
    padding-top: 30px;
    border-top: 1px solid rgba(201, 162, 39, .26);
    max-width: 520px;
}
body.theme-saree .royal-stat strong {
    display: block;
    font-family: var(--ff-d);
    font-size: 32px;
    font-weight: 600;
    letter-spacing: -.02em;
    background: var(--gold-grad);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
body.theme-saree .royal-stat span {
    font-size: 12.5px;
    color: rgba(255, 255, 255, .6);
    letter-spacing: .03em;
}


/* ---- 12. Brand Carousel ---- */
body.theme-saree .brand-carousel li img {
    filter: grayscale(100%);
    opacity: .45;
    transition: filter .32s var(--ease), opacity .32s var(--ease);
}
body.theme-saree .brand-carousel li:hover img { filter: grayscale(0); opacity: 1; }


/* ---- 13. Breadcrumbs & Inner Pages ---- */
body.theme-saree .breadcrumbs {
    font-size: 13px;
    font-weight: 500;
    text-transform: none;
    padding: 24px 0 0;
}
body.theme-saree .breadcrumbs li a { color: var(--muted); }
body.theme-saree .breadcrumbs li a:hover { color: var(--wine); }
body.theme-saree .breadcrumbs li span { color: var(--ink); }


/* ---- 13b. Product Detail Sidebar (trust badges + premium promo) ----
   theme.css builds these from var(--accent) — the stock purple/blue —
   so on the saree skin they showed up as an off-brand flat blue box.
   Restyled with the wine + gold vocabulary used across the rest of the
   site: trust badges get wine icon roundels, the promo countdown gets
   the hero's wine gradient + cloth weave and a gold seam, and the promo
   card underneath is fused to it as one seamless unit. */
body.theme-saree .sidebar-product { padding-left: 28px; }

body.theme-saree .shop-features-style4 {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--r-md);
    padding: 4px 18px;
    box-shadow: var(--sh-1);
}
body.theme-saree .shop-features-style4 .shop-feature {
    gap: 14px;
    padding: 16px 0;
    border-bottom: 1px solid var(--border);
    transition: padding-left .22s var(--ease);
}
body.theme-saree .shop-features-style4 .shop-feature:last-child { border-bottom: 0; }
body.theme-saree .shop-features-style4 .shop-feature:hover { padding-left: 4px; }
body.theme-saree .shop-features-style4 .shop-feature-icon {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 17px;
    color: var(--wine);
    background: var(--wine-tint);
    border-radius: var(--r-pill);
    flex-shrink: 0;
}
body.theme-saree .shop-features-style4 .shop-feature-text .text1 {
    font-family: var(--ff);
    font-size: 13.5px;
    font-weight: 600;
    letter-spacing: -.006em;
    color: var(--ink);
}

/* Countdown / premium promo — one fused card */
body.theme-saree .js-countdown-wrap { margin-top: 28px; }
body.theme-saree .countdown-box {
    position: relative;
    overflow: hidden;
    background:
        var(--tex-on-wine),
        radial-gradient(90% 140% at 82% 0%, rgba(201, 162, 39, .22) 0%, transparent 60%),
        linear-gradient(135deg, var(--wine) 0%, var(--wine-deep) 100%);
    border-radius: var(--r-md) var(--r-md) 0 0;
    padding: 20px 18px 18px;
    margin-top: 0;
    box-shadow: var(--sh-3);
}
body.theme-saree .countdown-box::after {
    content: "";
    position: absolute;
    left: 0; right: 0; bottom: 0;
    height: 3px;
    background: var(--gold-grad);
}
body.theme-saree .countdown-box > div:first-child {
    font-family: var(--ff) !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: .14em !important;
    text-transform: uppercase;
    color: var(--gold-lt) !important;
}
body.theme-saree .countdown {
    gap: 8px !important;
    margin-top: 4px;
}
body.theme-saree .countdown > span {
    display: flex;
    flex-direction: column-reverse;
    align-items: center;
    gap: 3px;
    background: rgba(255, 255, 255, .08);
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: var(--r-sm);
    padding: 9px 6px 7px;
    min-width: 54px;
    font-family: var(--ff);
    font-size: 9.5px;
    font-weight: 600;
    letter-spacing: .07em;
    color: rgba(255, 255, 255, .6);
}
body.theme-saree .countdown > span > span {
    font-family: var(--ff-d);
    font-size: 21px;
    font-weight: 600;
    color: #fff;
}
body.theme-saree .promo-text {
    background: var(--cream);
    border: 1px solid var(--border);
    border-top: 0;
    border-radius: 0 0 var(--r-md) var(--r-md);
    box-shadow: var(--sh-1);
    margin-top: 0;
    padding: 18px 16px 20px;
}
body.theme-saree .promo-text .text1 {
    font-family: var(--ff-d);
    font-size: 21px;
    font-weight: 600;
    color: var(--wine);
}
body.theme-saree .promo-text .text2 {
    font-family: var(--ff);
    font-size: 13px;
    color: var(--muted);
}
body.theme-saree .promo-text .text3 {
    font-family: var(--ff);
    font-size: 13.5px;
    font-weight: 600;
    color: var(--ink);
    margin-top: 4px;
}


/* ---- 13c. Product Detail — Share Row ----
   Was two bare 24px icon glyphs with a plain-text label, no card, no
   full-width footprint. Rebuilt as one full-width themed bar — the
   brand glyph colors stay for instant recognition, everything else
   (card chrome, radius, motion) follows the site's design tokens. */
body.theme-saree .prd-share-bar {
    margin-top: 24px;
    padding: 18px 18px 20px;
    background: var(--wine-tint);
    border: 1px solid var(--border);
    border-radius: var(--r-md);
}
body.theme-saree .prd-share-bar-label {
    display: block;
    font-family: var(--ff);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--wine);
}
body.theme-saree .prd-share-bar-icons {
    display: flex;
    gap: 12px;
    margin-top: 12px;
}
body.theme-saree .prd-share-btn {
    flex: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    padding: 13px 16px;
    font-family: var(--ff);
    font-size: 13.5px;
    font-weight: 600;
    letter-spacing: -.006em;
    color: var(--ink);
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--r-sm);
    box-shadow: var(--sh-1);
    transition: transform .24s var(--ease), box-shadow .24s var(--ease),
                background .24s var(--ease), border-color .24s var(--ease), color .24s var(--ease);
}
body.theme-saree .prd-share-btn i { font-size: 17px; transition: color .24s var(--ease); }
body.theme-saree .prd-share-btn:hover {
    color: #fff;
    transform: translateY(-2px);
    box-shadow: var(--sh-3);
}
body.theme-saree .prd-share-btn--whatsapp i { color: #25D366; }
body.theme-saree .prd-share-btn--whatsapp:hover {
    background: #25D366;
    border-color: #25D366;
}
body.theme-saree .prd-share-btn--whatsapp:hover i { color: #fff; }
body.theme-saree .prd-share-btn--facebook i { color: #1877F2; }
body.theme-saree .prd-share-btn--facebook:hover {
    background: #1877F2;
    border-color: #1877F2;
}
body.theme-saree .prd-share-btn--facebook:hover i { color: #fff; }
@media (max-width: 480px) {
    body.theme-saree .prd-share-bar-icons { flex-direction: column; }
}


/* ---- 14. Footer ---- */
body.theme-saree .page-footer { background: var(--wine-dark); border-top: 0; }

body.theme-saree .footer-trust {
    background: var(--cream);
    border-bottom: 0;
}
body.theme-saree .footer-trust-item { gap: 12px; }
body.theme-saree .fti-icon {
    width: 44px; height: 44px;
    background: var(--wine-tint);
    border: 0;
    border-radius: var(--r-pill);
    color: var(--gold-dk);
    font-size: 17px;
}
body.theme-saree .fti-text strong {
    font-family: var(--ff);
    font-size: 13.5px;
    font-weight: 600;
    letter-spacing: -.012em;
    text-transform: none;
    color: var(--ink);
}
body.theme-saree .fti-text span { font-size: 12.5px; color: var(--muted); }

body.theme-saree .footer-newsletter {
    background: transparent;
    border-top: 3px solid transparent;
    border-image: var(--gold-grad) 1;
    border-bottom: 1px solid rgba(255, 255, 255, .09);
}
body.theme-saree .fn-icon { color: var(--gold); }
body.theme-saree .fn-title {
    font-family: var(--ff-d);
    font-size: 26px;
    font-weight: 600;
    letter-spacing: -.02em;
    color: #fff;
}
body.theme-saree .fn-sub { font-size: 13.5px; color: rgba(255, 255, 255, .55); }
body.theme-saree .fn-input {
    background: rgba(255, 255, 255, .07);
    border: 1px solid rgba(201, 162, 39, .3);
    border-radius: var(--r-sm);
    color: #fff;
    padding: 13px 16px;
    font-size: 14px;
    font-family: var(--ff);
}
body.theme-saree .fn-input::placeholder { color: rgba(255, 255, 255, .38); }
body.theme-saree .fn-input:focus {
    border-color: var(--gold);
    outline: none;
    background: rgba(255, 255, 255, .1);
    box-shadow: none;
}
body.theme-saree .fn-btn {
    background: var(--tex-on-gold), var(--gold-grad);
    border: 0;
    color: var(--wine-dark);
    font-weight: 700;
}
body.theme-saree .fn-btn:hover { filter: brightness(1.07); color: var(--wine-dark); }

body.theme-saree .footer-main { background: transparent; padding: 54px 0 38px; }
body.theme-saree .footer-logo-img { max-height: 50px; width: auto; }
body.theme-saree .footer-tagline {
    font-size: 13.5px;
    line-height: 1.75;
    color: rgba(255, 255, 255, .55);
    max-width: 300px;
}
body.theme-saree .footer-col-title {
    font-family: var(--ff-d);
    font-size: 17px;
    font-weight: 600;
    letter-spacing: -.012em;
    text-transform: none;
    color: #fff;
    padding-bottom: 0;
    margin-bottom: 14px;
    border-bottom: 0;
}
body.theme-saree .footer-links li a {
    font-size: 13.5px;
    font-weight: 400;
    color: rgba(255, 255, 255, .55);
    padding: 6px 0;
    transition: color .2s var(--ease), padding-left .22s var(--ease);
}
body.theme-saree .footer-links li a:hover { color: var(--gold-lt); padding-left: 4px; }
body.theme-saree .fsocial-btn {
    width: 38px; height: 38px;
    background: rgba(255, 255, 255, .07);
    border: 1px solid rgba(201, 162, 39, .25);
    border-radius: var(--r-pill);
    color: rgba(255, 255, 255, .8);
    transition: all .22s var(--ease);
}
body.theme-saree .fsocial-btn:hover {
    background: var(--gold-grad);
    border-color: transparent;
    color: var(--wine-dark);
    transform: translateY(-2px);
}
body.theme-saree .footer-bottom {
    border-top: 1px solid rgba(255, 255, 255, .09);
    font-size: 13px;
    color: rgba(255, 255, 255, .45);
}
body.theme-saree .footer-bottom a { color: rgba(255, 255, 255, .7); }
body.theme-saree .footer-bottom a:hover { color: var(--gold-lt); }


/* ---- 14b. Auth Pages (site/login, site/register) ----
   theme.css builds these from var(--accent) — the #5b21b6 purple — so they
   read as a different site to the front page. Restyled here with the hero's
   own vocabulary: the brand panel gets the same wine gradient, gold radial
   glows, diagonal weave and gold seam, and the submit button is the gold
   `btn-gold` moment. Both views share the .auth-* system, so this covers
   login.php, register.php and the forgot-password panel alike. */
body.theme-saree .auth-wrap { padding: 8px 0 72px; }

body.theme-saree .auth-card {
    border: 1px solid var(--border);
    border-radius: var(--r-lg);
    box-shadow: var(--sh-4);
    background: var(--surface);
    overflow: hidden;
}

/* --- Brand panel: the hero, in a column --- */
body.theme-saree .auth-brand {
    background:
        radial-gradient(90% 120% at 78% 12%, rgba(201, 162, 39, .20) 0%, transparent 58%),
        radial-gradient(70% 100% at 10% 92%, rgba(201, 162, 39, .10) 0%, transparent 55%),
        linear-gradient(125deg, var(--wine-dark) 0%, var(--wine-deep) 48%, var(--wine) 100%);
    padding: 48px 40px;
}
/* theme.css uses ::before/::after for two decorative circles. Repurposed:
   ::before carries the hero's cloth weave, ::after the gold seam. */
body.theme-saree .auth-brand::before {
    width: auto; height: auto;
    inset: 0;
    top: 0; right: 0;
    border-radius: 0;
    background: none;
    background-image:
        repeating-linear-gradient(45deg, rgba(255,255,255,.05) 0 1px, transparent 1px 9px),
        repeating-linear-gradient(-45deg, rgba(255,255,255,.05) 0 1px, transparent 1px 9px);
}
body.theme-saree .auth-brand::after {
    width: 3px; height: auto;
    inset: 0 0 0 auto;
    bottom: 0; left: auto;
    border-radius: 0;
    background: var(--gold-grad);
}

body.theme-saree .auth-brand-logo { margin-bottom: 38px; }
body.theme-saree .auth-brand-logo-icon {
    background: var(--gold-grad);
    color: var(--wine-dark);
    font-family: var(--ff-d);
    font-size: 19px;
    font-weight: 600;
    border-radius: var(--r-sm);
    box-shadow: 0 4px 14px rgba(201, 162, 39, .3);
}
body.theme-saree .auth-brand-logo-name {
    font-family: var(--ff);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--gold-lt);
}
body.theme-saree .auth-brand-title {
    font-family: var(--ff-d);
    font-size: 38px;
    font-weight: 600;
    line-height: 1.08;
    letter-spacing: -.024em;
    color: #fff;
    margin-bottom: 20px;
    position: relative;
    padding-bottom: 18px;
}
/* The one ornament, same short gold bar the front page uses */
body.theme-saree .auth-brand-title::after {
    content: "";
    position: absolute;
    left: 0; bottom: 0;
    width: 46px; height: 3px;
    border-radius: var(--r-pill);
    background: var(--gold-grad);
}
body.theme-saree .auth-brand-sub {
    font-family: var(--ff);
    font-size: 14px;
    line-height: 1.7;
    color: rgba(255, 255, 255, .72);
    margin-bottom: 30px;
}
body.theme-saree .auth-perks li {
    font-size: 13.5px;
    font-weight: 500;
    letter-spacing: -.006em;
    color: rgba(255, 255, 255, .88);
}
body.theme-saree .auth-perk-icon {
    background: var(--gold-grad);
    color: var(--wine-dark);
    font-size: 10px;
    font-weight: 800;
}

/* --- Form panel --- */
body.theme-saree .auth-form-panel { background: var(--surface); padding: 48px 46px; }
body.theme-saree .auth-form-head { margin-bottom: 26px; }
body.theme-saree .auth-form-head h1 {
    font-family: var(--ff-d);
    font-size: 31px;
    font-weight: 600;
    letter-spacing: -.022em;
    color: var(--ink);
    margin-bottom: 7px;
}
body.theme-saree .auth-form-head p {
    font-size: 14px;
    color: var(--muted);
    letter-spacing: -.006em;
}

body.theme-saree .auth-label {
    font-family: var(--ff);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--ink-2);
}
body.theme-saree .auth-forgot {
    font-size: 12.5px;
    font-weight: 600;
    letter-spacing: -.006em;
    text-transform: none;
    color: var(--wine);
}
body.theme-saree .auth-forgot:hover { color: var(--wine-deep); }

body.theme-saree .auth-input,
body.theme-saree .auth-select {
    font-family: var(--ff);
    font-size: 14px;
    letter-spacing: -.008em;
    color: var(--ink);
    background-color: var(--cream);
    border: 1px solid var(--border);
    border-radius: var(--r-sm);
    padding-top: 13px;
    padding-bottom: 13px;
    transition: border-color .22s var(--ease), box-shadow .22s var(--ease), background .22s var(--ease);
}
/* Recolour the chevron baked into theme.css as a data URI (it is the old
   #6d6886 grey-purple) to the warm muted tone */
body.theme-saree .auth-select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23857077' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
}
body.theme-saree .auth-input:focus,
body.theme-saree .auth-select:focus {
    border-color: var(--wine);
    background-color: var(--surface);
    box-shadow: 0 0 0 3px rgba(92, 26, 43, .1);
}
body.theme-saree .auth-input::placeholder { color: var(--muted); opacity: .75; }
body.theme-saree .auth-input-icon { color: var(--muted); left: 15px; }
body.theme-saree .auth-eye { color: var(--muted); }
body.theme-saree .auth-eye:hover,
body.theme-saree .auth-eye.active { color: var(--wine); }

/* --- Primary action: the page's single gold moment --- */
body.theme-saree .auth-btn {
    font-family: var(--ff);
    font-size: 14.5px;
    font-weight: 700;
    letter-spacing: -.008em;
    background: var(--tex-on-gold), var(--gold-grad);
    color: var(--wine-dark) !important;
    border: 0;
    border-radius: var(--r-sm);
    padding: 14px 26px;
    box-shadow: 0 6px 20px rgba(201, 162, 39, .3);
    transition: transform .24s var(--ease), box-shadow .24s var(--ease), filter .24s var(--ease);
}
body.theme-saree .auth-btn:hover {
    opacity: 1;
    filter: brightness(1.06);
    transform: translateY(-2px);
    box-shadow: 0 12px 30px rgba(201, 162, 39, .4);
}
body.theme-saree .auth-btn:active { transform: translateY(0); }

body.theme-saree .auth-btn--alt {
    background: var(--wine-tint);
    color: var(--wine) !important;
    border: 1px solid var(--border);
    box-shadow: none;
    filter: none;
}
body.theme-saree .auth-btn--alt:hover {
    background: var(--tex-on-wine), var(--wine);
    color: #fff !important;
    border-color: var(--wine);
    filter: none;
    transform: translateY(-1px);
    box-shadow: var(--sh-2);
}

/* --- Supporting bits --- */
body.theme-saree .auth-bottom {
    border-top: 1px solid var(--border);
    font-size: 13.5px;
    color: var(--muted);
}
body.theme-saree .auth-bottom a { color: var(--wine); font-weight: 700; }

body.theme-saree .auth-check-row { font-size: 13px; color: var(--ink-2); }
body.theme-saree .auth-check-row a { color: var(--wine); font-weight: 600; }
body.theme-saree .auth-check-row input[type=checkbox] { accent-color: var(--wine); }
/* Replaces the inline var(--bg) styling that register.php used to carry */
body.theme-saree .auth-check-row--boxed {
    background: var(--cream);
    border: 1px solid var(--border);
    border-radius: var(--r-sm);
    padding: 13px 15px;
}
body.theme-saree .auth-check-row--boxed label { color: var(--ink); }

body.theme-saree .auth-alert {
    font-size: 13.5px;
    border-radius: var(--r-sm);
    letter-spacing: -.006em;
}
body.theme-saree .auth-alert--error {
    background: #FCF0F0;
    color: #8E2230;
    border: 1px solid #F0D2D4;
}
body.theme-saree .auth-alert--success {
    background: #F0F6F1;
    color: #2C6B45;
    border: 1px solid #CFE5D6;
}

@media (max-width: 991px) {
    body.theme-saree .auth-brand { padding: 40px 32px; }
    body.theme-saree .auth-brand-title { font-size: 31px; }
    body.theme-saree .auth-form-panel { padding: 40px 34px; }
}
@media (max-width: 767px) {
    /* theme.css hides the brand panel here, so the card becomes the form
       alone — give it a gold top seam so the page still reads as the skin. */
    body.theme-saree .auth-wrap { padding: 0 0 44px; }
    body.theme-saree .auth-card { border-radius: var(--r-md); min-height: 0; }
    body.theme-saree .auth-card::before {
        content: "";
        display: block;
        height: 3px;
        background: var(--gold-grad);
    }
    body.theme-saree .auth-form-panel { padding: 30px 20px 34px; }
    body.theme-saree .auth-form-head h1 { font-size: 25px; }
    body.theme-saree .auth-form-head p { font-size: 13.5px; }
}
@media (max-width: 480px) {
    body.theme-saree .auth-form-panel { padding: 26px 16px 30px; }
    body.theme-saree .auth-form-head h1 { font-size: 23px; }
}


/* ---- 14c. Cart ----
   cart.php used to carry its panels as inline styles built on var(--bg) /
   var(--accent), which no stylesheet can override. Those are now classes,
   styled here. */
body.theme-saree .cart-hdr { margin-bottom: 26px; }
body.theme-saree .cart-hdr h1 {
    font-family: var(--ff-d);
    font-size: 34px;
    font-weight: 600;
    letter-spacing: -.022em;
    color: var(--ink);
    margin: 0 0 4px;
}
body.theme-saree .cart-hdr p { font-size: 14px; color: var(--muted); margin: 0; }
body.theme-saree .cart-flash { margin-bottom: 16px; }

body.theme-saree .cart-panel {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--r-md);
    box-shadow: var(--sh-1);
    overflow: hidden;
}
body.theme-saree .cart-thead {
    display: none;
    grid-template-columns: 96px 1fr 100px 110px 110px 44px;
    gap: 16px;
    align-items: center;
    padding: 13px 20px;
    background: var(--cream);
    border-bottom: 1px solid var(--border);
    font-family: var(--ff);
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--muted);
}
body.theme-saree .cart-thead-c { text-align: center; }
body.theme-saree .cart-thead-r { text-align: right; }
/* The column header only makes sense while the rows are still a grid —
   theme.css collapses .cart-table-prd to a stacked layout below 992px.
   theme.css also gives the row 7 tracks (`96px 1fr repeat(4,auto) 44px`)
   for its 6 children, so the headings would not line up with the cells;
   both use the same 6-track template here. */
@media (min-width: 992px) {
    body.theme-saree .cart-thead,
    body.theme-saree .cart-row { display: grid; grid-template-columns: 96px 1fr 100px 110px 110px 44px; }
}

body.theme-saree .cart-row { padding: 16px 20px; border-bottom: 1px solid var(--border); }
body.theme-saree .cart-table-prd-image img { border-radius: var(--r-sm); border: 1px solid var(--border); }
body.theme-saree .cart-table-prd-name h2 {
    font-family: var(--ff);
    font-size: 14.5px;
    font-weight: 600;
    letter-spacing: -.012em;
}
body.theme-saree .cart-table-prd-name h2 a { color: var(--ink); }
body.theme-saree .cart-table-prd-name h2 a:hover { color: var(--wine); }
body.theme-saree .cart-table-prd-name h5 { color: var(--muted); }
body.theme-saree .cart-gst { font-size: 12px; color: var(--muted); margin-top: 4px; }
body.theme-saree .cart-table-prd-price { text-align: right; }
body.theme-saree .cart-table-prd-qty span,
body.theme-saree .cart-table-prd-price span {
    font-size: 10.5px;
    letter-spacing: .1em;
    color: var(--muted);
}
body.theme-saree .cart-table-prd-price b { color: var(--wine); font-weight: 700; }
body.theme-saree .cart-table-prd-action a {
    background: var(--cream);
    border: 1px solid var(--border);
    color: var(--muted);
    border-radius: var(--r-pill);
}
body.theme-saree .cart-table-prd-action .icon-cross:hover {
    background: var(--wine-tint);
    border-color: rgba(142, 34, 48, .3);
    color: #8E2230;
}

body.theme-saree .cart-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    padding: 16px 20px;
    background: var(--cream);
}
body.theme-saree .btn--sm { font-size: 13px; padding: 9px 17px; }

/* Sidebar blocks */
body.theme-saree .cart-side {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--r-md);
    box-shadow: var(--sh-1);
    margin-bottom: 16px;
    overflow: hidden;
}
body.theme-saree .cart-side .sidebar-block_title {
    background: var(--cream);
    border-bottom: 1px solid var(--border);
    padding: 14px 20px;
    cursor: default;
}
body.theme-saree .cart-side .sidebar-block_title span {
    font-family: var(--ff);
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--ink-2);
}
body.theme-saree .cart-side-body { padding: 20px; }

body.theme-saree .cart-sum-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-bottom: 12px;
    font-size: 14px;
}
body.theme-saree .cart-sum-label { color: var(--muted); }
body.theme-saree .cart-sum-value {
    font-family: var(--ff-d);
    font-size: 18px;
    font-weight: 600;
    color: var(--wine);
}
body.theme-saree .cart-sum-old { font-size: 13px; color: var(--muted); margin-left: 7px; }

body.theme-saree .cart-premium-note {
    background: rgba(201, 162, 39, .12);
    border: 1px solid rgba(201, 162, 39, .34);
    border-radius: var(--r-sm);
    padding: 10px 14px;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--gold-dk);
    margin-bottom: 12px;
}

body.theme-saree .cart-grand {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding-top: 14px;
    border-top: 1px solid var(--border);
}
body.theme-saree .cart-grand-label {
    font-family: var(--ff);
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--muted);
}
body.theme-saree .card-total-price {
    font-family: var(--ff-d);
    font-size: 26px;
    font-weight: 600;
    letter-spacing: -.018em;
    color: var(--wine);
}

/* Checkout is the primary action on this page — give it the gold */
body.theme-saree .cart-checkout-btn {
    background: var(--gold-grad);
    border: 0;
    color: var(--wine-dark);
    font-size: 14.5px;
    font-weight: 700;
    border-radius: var(--r-sm);
    padding: 15px 26px;
    box-shadow: 0 6px 20px rgba(201, 162, 39, .3);
}
body.theme-saree .cart-checkout-btn:hover {
    background: var(--gold-grad);
    color: var(--wine-dark);
    filter: brightness(1.06);
    transform: translateY(-2px);
    box-shadow: 0 12px 30px rgba(201, 162, 39, .4);
}

body.theme-saree .cart-trust {
    display: flex;
    gap: 8px;
    justify-content: center;
    flex-wrap: wrap;
    margin-top: 18px;
}
body.theme-saree .cart-trust-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    flex: 1 1 0;
    min-width: 84px;
    text-align: center;
    font-size: 11.5px;
    color: var(--muted);
}
body.theme-saree .cart-trust-item i {
    font-size: 16px;
    color: var(--gold-dk);
    width: 36px; height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--wine-tint);
    border-radius: var(--r-pill);
}

body.theme-saree .cart-empty { text-align: center; padding: 76px 20px 84px; }
body.theme-saree .cart-empty-icon {
    width: 84px; height: 84px;
    margin: 0 auto 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 34px;
    color: var(--gold-dk);
    background: var(--wine-tint);
    border: 1px solid rgba(201, 162, 39, .3);
    border-radius: var(--r-pill);
}
body.theme-saree .cart-empty h2 {
    font-family: var(--ff-d);
    font-size: 29px;
    font-weight: 600;
    letter-spacing: -.02em;
    color: var(--ink);
    margin: 0 0 8px;
}
body.theme-saree .cart-empty p { font-size: 14.5px; color: var(--muted); margin: 0 0 28px; }


/* ---- 14d. Status Pages (registration success / failure) ---- */
body.theme-saree .status-wrap { display: flex; justify-content: center; padding: 8px 0 40px; }
body.theme-saree .status-card {
    position: relative;
    width: 100%;
    max-width: 620px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--r-lg);
    box-shadow: var(--sh-3);
    padding: 46px 44px 40px;
    text-align: center;
    overflow: hidden;
}
/* Gold seam across the top, echoing the hero's closing seam */
body.theme-saree .status-card::before {
    content: "";
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 3px;
    background: var(--gold-grad);
}

body.theme-saree .status-icon {
    width: 66px; height: 66px;
    margin: 0 auto 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--r-pill);
    background: var(--gold-grad);
    color: var(--wine-dark);
    box-shadow: 0 8px 24px rgba(201, 162, 39, .32);
}
/* Failure keeps the same shape but drops the celebratory gold */
body.theme-saree .status-card--fail .status-icon {
    background: var(--wine-tint);
    border: 1px solid rgba(142, 34, 48, .28);
    color: #8E2230;
    box-shadow: none;
}
body.theme-saree .status-card--fail .u-eyebrow { color: #8E2230; }

body.theme-saree .status-card .u-eyebrow { display: block; margin-bottom: 6px; }
body.theme-saree .status-title {
    font-family: var(--ff-d);
    font-size: 34px;
    font-weight: 600;
    line-height: 1.12;
    letter-spacing: -.024em;
    color: var(--ink);
    margin: 0 0 16px;
}
body.theme-saree .status-title em {
    font-style: italic;
    font-weight: 500;
    background: var(--gold-grad);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
body.theme-saree .status-card--fail .status-title em {
    background: none;
    -webkit-text-fill-color: currentColor;
    color: var(--wine);
}

body.theme-saree .status-text {
    font-size: 14.5px;
    line-height: 1.72;
    color: var(--ink-2);
    margin: 0 auto 26px;
    max-width: 460px;
}
body.theme-saree .status-flash {
    background: var(--cream);
    border: 1px solid var(--border);
    border-radius: var(--r-sm);
    padding: 11px 16px;
    font-size: 13.5px;
    color: var(--ink-2);
    margin-bottom: 20px;
}

body.theme-saree .status-meta {
    list-style: none;
    margin: 0 0 28px;
    padding: 0;
    border: 1px solid var(--border);
    border-radius: var(--r-md);
    background: var(--cream);
    overflow: hidden;
    text-align: left;
}
body.theme-saree .status-meta li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 13px 18px;
    border-bottom: 1px solid var(--border);
}
body.theme-saree .status-meta li:last-child { border-bottom: 0; }
body.theme-saree .status-meta span {
    font-family: var(--ff);
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--muted);
}
body.theme-saree .status-meta b {
    font-size: 15px;
    font-weight: 700;
    color: var(--wine);
    font-variant-numeric: tabular-nums;
}
body.theme-saree .status-meta-note {
    font-size: 13px !important;
    font-weight: 500 !important;
    font-style: italic;
    color: var(--muted) !important;
}

body.theme-saree .status-actions {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    flex-wrap: wrap;
}

@media (max-width: 767px) {
    body.theme-saree .cart-hdr h1 { font-size: 25px; }
    body.theme-saree .cart-row { padding: 14px 14px; }
    body.theme-saree .cart-actions { padding: 14px; }
    body.theme-saree .cart-actions .btn { flex: 1 1 auto; justify-content: center; }
    body.theme-saree .cart-side-body { padding: 16px; }
    body.theme-saree .cart-empty { padding: 52px 16px 60px; }
    body.theme-saree .cart-empty h2 { font-size: 23px; }

    body.theme-saree .status-card { padding: 34px 20px 30px; border-radius: var(--r-md); }
    body.theme-saree .status-title { font-size: 26px; }
    body.theme-saree .status-text { font-size: 14px; }
    body.theme-saree .status-meta li { padding: 12px 14px; }
    body.theme-saree .status-actions .btn-gold,
    body.theme-saree .status-actions .btn { flex: 1 1 100%; justify-content: center; }
}


/* ---- 15. Misc ---- */
body.theme-saree .body-preloader { background: var(--ivory); }
body.theme-saree .dot { background: var(--wine); }

body.theme-saree .back-to-top,
body.theme-saree #backToTop {
    background: var(--wine);
    border: 1px solid rgba(201, 162, 39, .4);
    border-radius: var(--r-pill);
    color: var(--gold-lt);
    box-shadow: var(--sh-3);
    transition: transform .22s var(--ease), background .22s var(--ease);
}
body.theme-saree .back-to-top:hover,
body.theme-saree #backToTop:hover { background: var(--wine-deep); transform: translateY(-2px); }

body.theme-saree ::selection { background: var(--wine); color: #fff; }

body.theme-saree .form-control,
body.theme-saree input[type="text"],
body.theme-saree input[type="email"],
body.theme-saree input[type="password"],
body.theme-saree input[type="tel"],
body.theme-saree textarea,
body.theme-saree select {
    font-family: var(--ff);
    border-radius: var(--r-sm);
    border: 1px solid var(--border);
    font-size: 14px;
}
body.theme-saree .form-control:focus,
body.theme-saree input:focus,
body.theme-saree textarea:focus,
body.theme-saree select:focus {
    border-color: var(--wine);
    box-shadow: 0 0 0 3px rgba(92, 26, 43, .1);
    outline: none;
}

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


/* ---- 16. Responsive ---- */
@media (max-width: 1199px) {
    body.theme-saree .home-section-hdr h2 { font-size: 30px; }
    body.theme-saree .cat-grid-hdr h2 { font-size: 34px; }
    body.theme-saree .royal-band h2 { font-size: 36px; }
    /* Tighten the tracking before the priority-nav script starts
       folding categories into "More" */
    body.theme-saree .mmenu > li > a,
    body.theme-saree .js-more-item > a.js-more-toggle {
        letter-spacing: .09em;
        padding: 12px 11px;
    }
    body.theme-saree .mmenu > li:hover > a::after,
    body.theme-saree .mmenu > li.is-hovered > a::after,
    body.theme-saree .mmenu > li.is-active > a::after { left: 11px; right: 11px; }
}

@media (max-width: 991px) {
    body.theme-saree .usp-grid { grid-template-columns: repeat(2, 1fr); }
    body.theme-saree .holder { padding: 46px 0; }
    body.theme-saree .cat-grid-section { padding: 50px 0 46px; }
    body.theme-saree .royal-band { padding: 58px 0; }
    body.theme-saree .royal-stats { gap: 34px; }

    /* theme.css reveals the "Explore" label on :hover only — which never
       happens on a touch screen. Below the desktop breakpoint it is always on. */
    body.theme-saree .cat-gc-cta {
        opacity: 1;
        transform: none;
    }
    /* Touch has no un-hover: a tap leaves the lift and the image zoom stuck
       on until the next tap elsewhere. Disable both below the desktop range. */
    body.theme-saree .cat-gc:hover { transform: none; }
    body.theme-saree .prd:hover .prd-inside { transform: none; }
    body.theme-saree .prd:hover .prd-img img,
    body.theme-saree .cat-gc:hover .cat-gc-media img { transform: none; }
    body.theme-saree .prd:hover .prd-img-area { box-shadow: var(--sh-1); }
}

/* ================================================================
   MOBILE (<= 767px)
   Below this width app.js's carouselTab bails out (w < maxSM), so the
   product rows are never slick-initialized. theme.css then leaves them
   as `display:flex; overflow:hidden`, which renders 8 products and
   clips 6 of them with no way to reach them. Everything below turns
   that dead row into a real swipeable rail and sizes the rest of the
   front page for a phone.
   ================================================================ */
@media (max-width: 767px) {

    /* ---- Product rails ---- */
    body.theme-saree .prd-carousel-wrap {
        overflow: visible;
        /* bleed to the viewport edge so the rail reads as scrollable */
        margin-left: -15px;
        margin-right: -15px;
    }
    body.theme-saree .prd-carousel:not(.slick-initialized) {
        overflow-x: auto;
        overflow-y: hidden;
        flex-wrap: nowrap;
        gap: 12px;
        padding: 4px 15px 6px;
        scroll-snap-type: x mandatory;
        scroll-padding-left: 15px;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        -ms-overflow-style: none;
        overscroll-behavior-x: contain;
    }
    body.theme-saree .prd-carousel:not(.slick-initialized)::-webkit-scrollbar { display: none; }
    /* Two cards fill the screen with the third clearly peeking, so the
       rail reads as swipeable instead of as a cut-off grid */
    body.theme-saree .prd-carousel:not(.slick-initialized) .prd {
        flex: 0 0 46%;
        min-width: 0;
        scroll-snap-align: start;
    }

    /* ---- Section headers: title on its own line, actions under it ---- */
    body.theme-saree .home-section-hdr {
        flex-wrap: wrap;
        align-items: center;
        gap: 6px 12px;
        margin-bottom: 18px;
    }
    body.theme-saree .home-section-hdr h2 {
        font-size: 23px;
        padding-bottom: 12px;
        flex: 1 1 100%;
    }
    body.theme-saree .section-hdr-right {
        flex: 1 1 100%;
        justify-content: flex-start;
        margin-top: -4px;
    }
    body.theme-saree .view-all-link { padding: 6px 0; font-size: 13px; }
    /* The rail is swiped, not clicked — the arrows are noise on a phone */
    body.theme-saree .carousel-nav { display: none; }

    /* ---- Hero ---- */
    body.theme-saree .hero-royal { padding: 46px 0 42px; }
    body.theme-saree .hero-royal h1 { margin-bottom: 16px; }
    body.theme-saree .hero-royal p { margin-bottom: 26px; }
    body.theme-saree .hero-cta { gap: 10px; }
    body.theme-saree .hero-cta .btn-gold,
    body.theme-saree .hero-cta .btn-ghost {
        flex: 1 1 100%;
        justify-content: center;
        padding: 14px 20px;
    }

    /* ---- Category rail: snap + breathing room at the edges ---- */
    body.theme-saree .cat-grid-scroll {
        margin-left: -15px;
        margin-right: -15px;
        scroll-snap-type: x mandatory;
        scroll-padding-left: 15px;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior-x: contain;
    }
    body.theme-saree .cat-grid {
        width: max-content;
        margin: 0;
        padding: 4px 15px;
        gap: 12px;
    }
    body.theme-saree .cat-gc { scroll-snap-align: start; }
    body.theme-saree .cat-gc-name { font-size: 15px; }
    body.theme-saree .cat-gc-letter { font-size: 40px; }
    body.theme-saree .cat-gc-overlay { padding: 26px 13px 13px; }
    body.theme-saree .cat-gc-cta { font-size: 11px; }

    /* ---- Banner bands ---- */
    body.theme-saree .offers-band { padding: 32px 0; }
    body.theme-saree .offers-band .hero-section { border-radius: var(--r-md); }
    body.theme-saree .cat-grid-hdr { margin-bottom: 22px; }

    /* ---- Product card at phone width (~46% of viewport) ---- */
    body.theme-saree .prd-inside { padding-bottom: 2px; }
    body.theme-saree .prd-info { padding: 11px 2px 0; gap: 4px; }
    body.theme-saree .prd-title {
        font-size: 13px;
        line-height: 1.38;
        min-height: 36px;   /* two lines, so prices stay on one baseline */
        margin-bottom: 3px;
    }
    body.theme-saree .prd-bottom { gap: 8px; margin-top: 2px; }
    body.theme-saree .price-new { font-size: 17px; }
    body.theme-saree .price-old { font-size: 12px; margin-left: 6px; }
    body.theme-saree .prd-cart-btn {
        font-size: 12.5px;
        padding: 9px 8px;
        gap: 5px;
        border-radius: var(--r-sm);
    }
    /* The heart is href="#" with no handler bound on this page (app.js only
       wires .js-label-wishlist, used by view-category). It is hover-revealed,
       so it is invisible on desktop touch anyway — don't spend card width on
       a dead control. */
    body.theme-saree .prd-wish { display: none; }
    body.theme-saree .prd-info span[style*="color:red"] {
        font-size: 10.5px !important;
        padding: 2px 8px;
        margin-bottom: 5px;
    }

    /* ---- Drawer ---- */
    body.theme-saree .mobilemenu { width: min(84vw, 320px); }
    body.theme-saree .mm-foot-link { padding: 11px 0; }
}

/* Drawer backdrop — lives outside the media query so it also covers
   tablet widths, where the drawer is still the only nav. */
body.theme-saree .mobilemenu-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1900;
    background: rgba(36, 16, 26, .5);
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
    opacity: 0;
    visibility: hidden;
    transition: opacity .3s var(--ease), visibility .3s var(--ease);
}
body.theme-saree.slidemenu-open .mobilemenu-backdrop {
    opacity: 1;
    visibility: visible;
}

@media (max-width: 767px) {
    body.theme-saree { font-size: 14.5px; }
    body.theme-saree .cat-grid-hdr h2 { font-size: 27px; }
    body.theme-saree .cat-grid-hdr p { font-size: 13.5px; }
    body.theme-saree .royal-band { padding: 46px 0; }
    body.theme-saree .royal-band h2 { font-size: 27px; }
    body.theme-saree .royal-band p { font-size: 14.5px; }
    body.theme-saree .royal-stats {
        gap: 20px;
        margin-top: 30px;
        padding-top: 24px;
    }
    body.theme-saree .royal-stat strong { font-size: 23px; }
    body.theme-saree .royal-stat span { font-size: 11.5px; }
    body.theme-saree .announce-text {
        height: auto;
        padding: 9px 12px;
        font-size: 12px;
        gap: 11px;
    }
    body.theme-saree .fn-title { font-size: 21px; }
    body.theme-saree .carousel-control-prev,
    body.theme-saree .carousel-control-next { display: none; }
}

@media (max-width: 575px) {
    body.theme-saree .usp-item {
        padding: 15px 8px;
        flex-direction: column;
        text-align: center;
        gap: 7px;
    }
    body.theme-saree .usp-item strong,
    body.theme-saree .usp-item span { width: 100%; margin-left: 0; text-align: center; }
    body.theme-saree .usp-item span { display: none; }
    body.theme-saree .royal-stats { flex-wrap: wrap; gap: 18px 26px; }
    body.theme-saree .announce-text .sep:nth-of-type(2) { display: none; }
    body.theme-saree .announce-text span:last-child { display: none; }

    body.theme-saree .holder { padding: 34px 0; }
    body.theme-saree .cat-grid-section { padding: 36px 0 32px; }
    body.theme-saree .home-section-hdr h2 { font-size: 21px; padding-bottom: 11px; }
    body.theme-saree .cat-grid-hdr h2 { font-size: 23px; }
}

@media (max-width: 480px) {
    /* Card is ~135px wide here — trim type before it starts wrapping badly */
    body.theme-saree .prd-title { font-size: 12.5px; min-height: 34px; }
    body.theme-saree .price-new { font-size: 15.5px; }
    body.theme-saree .prd-cart-btn { font-size: 12px; padding: 8px 6px; gap: 4px; }
    body.theme-saree .prd-carousel:not(.slick-initialized) { gap: 10px; }

    body.theme-saree .cat-gc { flex: 0 0 132px; width: 132px; }
    body.theme-saree .cat-gc-name { font-size: 14px; }
    body.theme-saree .cat-gc-letter { font-size: 34px; }

    body.theme-saree .hero-royal { padding: 38px 0 34px; }
    body.theme-saree .hero-royal .u-eyebrow { font-size: 10px; letter-spacing: .13em; }
    body.theme-saree .hero-royal p { font-size: 14px; line-height: 1.65; }

    /* theme.css hides .minicart-title/.minicart-total here — the mobile bar
       uses .hdr-mobile-btn instead, so nothing to reconcile. */
    body.theme-saree .hdr-mobile .logo-holder img { max-height: 34px; }
    body.theme-saree .announce-text { font-size: 11.5px; padding: 8px 12px; }
}