/* ============================================================
   JumpSpark Store Themes
   5 themes: blossom | midnight | forest | ocean | sunset
   Default (no class) = original look (backward compatible)
   ============================================================ */

/* ── Google Fonts ─────────────────────────────────────────── */
@import url('https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&family=Nunito:wght@400;600;700;800;900&family=Cinzel:wght@400;600;700&family=Crimson+Pro:ital,wght@0,300;0,400;0,600;1,300;1,400&family=Cormorant+Garamond:ital,wght@0,400;0,600;0,700;1,400;1,600;1,700&family=Lato:wght@300;400;700;900&family=Fraunces:ital,opsz,wght@0,9..144,300;0,9..144,700;0,9..144,900;1,9..144,400&family=DM+Sans:opsz,wght@9..40,400;9..40,500;9..40,600&family=Syne:wght@400;600;700;800&family=Poppins:wght@300;400;500;600;700&display=swap');

/* ── Keyframe animations ──────────────────────────────────── */
@keyframes blossomShimmer {
    0%   { background-position: -200% center; }
    100% { background-position: 200% center; }
}
@keyframes goldGlow {
    0%, 100% { text-shadow: 0 0 6px rgba(255,215,0,0.3); }
    50%       { text-shadow: 0 0 18px rgba(255,215,0,0.7), 0 0 36px rgba(255,215,0,0.25); }
}
@keyframes sunsetPulse {
    0%, 100% { box-shadow: 0 4px 14px rgba(255,107,53,0.35); }
    50%       { box-shadow: 0 6px 28px rgba(255,107,53,0.65), 0 0 0 4px rgba(255,107,53,0.1); }
}
@keyframes forestBreath {
    0%, 100% { opacity: 1; }
    50%       { opacity: 0.85; }
}
@keyframes oceanRise {
    from { transform: translateY(6px); opacity: 0; }
    to   { transform: translateY(0);   opacity: 1; }
}

/* ── SHARED: btn-primary / text-primary / border-primary ──── */
body[class*="theme-"] .btn-primary {
    background-color: var(--t-primary) !important;
    color: var(--t-btn-text) !important;
    transition: background-color 0.2s ease, box-shadow 0.2s ease, transform 0.15s ease !important;
}
body[class*="theme-"] .btn-primary:hover {
    background-color: var(--t-secondary) !important;
    transform: translateY(-1px) !important;
}
body[class*="theme-"] .text-primary  { color: var(--t-primary) !important; }
body[class*="theme-"] .border-primary { border-color: var(--t-primary) !important; }

/* ── Shared transitions ───────────────────────────────────── */
body[class*="theme-"] a.bg-white,
body[class*="theme-"] div.bg-white {
    transition: box-shadow 0.3s ease, transform 0.3s ease, border-color 0.2s ease !important;
}
body[class*="theme-"] input,
body[class*="theme-"] textarea,
body[class*="theme-"] select {
    transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
}
body[class*="theme-"] aside a {
    transition: background-color 0.15s ease, color 0.15s ease, padding-left 0.15s ease !important;
}
body[class*="theme-"] footer a {
    transition: color 0.15s ease !important;
}

/* ============================================================
   🌸 BLOSSOM — High-fashion editorial feminine
   Heading: DM Serif Display (editorial serif contrast)
   Body: Nunito (warm rounded grotesque)
   Identity: Luxury perfume brand meets fashion magazine
   ============================================================ */
body.theme-blossom {
    --t-primary:      #c2185b;
    --t-secondary:    #ad1457;
    --t-accent:       #7b1fa2;
    --t-bg:           #fdf6f9;
    --t-surface:      #ffffff;
    --t-card-bg:      #ffffff;
    --t-header-bg:    #ffffff;
    --t-footer-bg:    #fce4ec;
    --t-text:         #2d0018;
    --t-text-muted:   #78184a;
    --t-border:       #f8bbd0;
    --t-btn-text:     #ffffff;
    font-family: 'Nunito', sans-serif;
    background: linear-gradient(160deg, #fdf6f9 0%, #fce4ec 60%, #fdf2f8 100%) !important;
    color: var(--t-text) !important;
    scroll-behavior: smooth;
}

/* Selection */
body.theme-blossom ::selection {
    background-color: rgba(194,24,91,0.18);
    color: var(--t-text);
}

/* Scrollbar */
body.theme-blossom::-webkit-scrollbar { width: 6px; }
body.theme-blossom::-webkit-scrollbar-track { background: #fce4ec; }
body.theme-blossom::-webkit-scrollbar-thumb { background: linear-gradient(180deg, #f48fb1, #c2185b); border-radius: 3px; }

/* Header — frosted glass with shimmer accent line */
body.theme-blossom header {
    background: rgba(255,255,255,0.96) !important;
    border-bottom: none !important;
    box-shadow: 0 4px 32px rgba(194,24,91,0.07) !important;
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    position: relative;
}
body.theme-blossom header::after {
    content: '';
    position: absolute;
    bottom: 0; left: 0; right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent 15%, rgba(194,24,91,0.35) 50%, transparent 85%);
}
body.theme-blossom header .text-gray-900,
body.theme-blossom header .text-gray-600,
body.theme-blossom header span { color: var(--t-text) !important; }
body.theme-blossom header svg  { color: var(--t-text) !important; stroke: var(--t-text) !important; }

/* Headings — DM Serif Display for editorial contrast */
body.theme-blossom h1 {
    font-family: 'DM Serif Display', serif !important;
    color: var(--t-text) !important;
    font-weight: 400 !important;
    letter-spacing: -0.03em !important;
    line-height: 1.15 !important;
    font-style: italic !important;
}
body.theme-blossom h2 {
    font-family: 'DM Serif Display', serif !important;
    color: var(--t-text) !important;
    font-weight: 400 !important;
    letter-spacing: -0.02em !important;
}
body.theme-blossom h3 {
    font-family: 'Nunito', sans-serif !important;
    color: var(--t-text) !important;
    font-weight: 700 !important;
}

/* Body text */
body.theme-blossom .text-gray-900 { color: var(--t-text) !important; }
body.theme-blossom .text-gray-700 { color: var(--t-text) !important; }
body.theme-blossom .text-gray-600 { color: var(--t-text-muted) !important; }
body.theme-blossom .text-gray-500 { color: var(--t-text-muted) !important; }
body.theme-blossom .text-gray-400 { color: #c48b9f !important; }

/* Backgrounds */
body.theme-blossom .bg-gray-50  { background-color: #fdf6f9 !important; }
body.theme-blossom .bg-gray-100 { background-color: #fce4ec !important; }
body.theme-blossom .bg-white    { background-color: var(--t-surface) !important; }

/* Borders */
body.theme-blossom .border-gray-200 { border-color: var(--t-border) !important; }
body.theme-blossom .border-gray-300 { border-color: var(--t-border) !important; }

/* Product cards — soft luxury with inner glow */
body.theme-blossom a.bg-white,
body.theme-blossom div.bg-white {
    background: #ffffff !important;
    border-color: #fce4ec !important;
    border-radius: 1.5rem !important;
    box-shadow: 0 2px 12px rgba(194,24,91,0.06), inset 0 1px 0 rgba(255,255,255,0.9) !important;
}
body.theme-blossom a.bg-white:hover {
    box-shadow: 0 16px 40px rgba(194,24,91,0.18), 0 4px 12px rgba(194,24,91,0.1) !important;
    transform: translateY(-5px) !important;
    border-color: #f48fb1 !important;
}
body.theme-blossom a.bg-white img {
    transition: transform 0.5s cubic-bezier(0.25,0.46,0.45,0.94) !important;
    border-radius: 1.25rem 1.25rem 0 0;
}
body.theme-blossom a.bg-white:hover img { transform: scale(1.07) !important; }

/* Inputs — pill style */
body.theme-blossom input[type="text"],
body.theme-blossom input[type="email"],
body.theme-blossom input[type="search"],
body.theme-blossom textarea,
body.theme-blossom select {
    background: #fff5f8 !important;
    border-color: var(--t-border) !important;
    color: var(--t-text) !important;
    border-radius: 2rem !important;
    padding: 0.6rem 1.2rem !important;
}
body.theme-blossom input::placeholder,
body.theme-blossom textarea::placeholder { color: #c48b9f !important; }
body.theme-blossom input:focus,
body.theme-blossom textarea:focus,
body.theme-blossom select:focus {
    border-color: var(--t-primary) !important;
    box-shadow: 0 0 0 3px rgba(194,24,91,0.12) !important;
    outline: none !important;
    background: #ffffff !important;
}

/* Buttons — editorial pill with shimmer */
body.theme-blossom button[type="submit"],
body.theme-blossom .btn-primary {
    background: linear-gradient(135deg, #c2185b 0%, #e91e8c 50%, #c2185b 100%) !important;
    background-size: 200% auto !important;
    color: #fff !important;
    border-radius: 2rem !important;
    font-weight: 700 !important;
    font-family: 'Nunito', sans-serif !important;
    border: none !important;
    padding: 0.7rem 1.75rem !important;
    letter-spacing: 0.02em !important;
    box-shadow: 0 4px 16px rgba(194,24,91,0.3) !important;
    transition: all 0.35s ease !important;
}
body.theme-blossom button[type="submit"]:hover,
body.theme-blossom .btn-primary:hover {
    background-position: right center !important;
    box-shadow: 0 8px 24px rgba(194,24,91,0.45) !important;
    transform: translateY(-2px) !important;
}

/* Price — branded pink, DM Serif Display */
body.theme-blossom .font-bold.text-gray-900 {
    color: var(--t-primary) !important;
    font-family: 'DM Serif Display', serif !important;
    font-weight: 400 !important;
    font-style: italic !important;
    font-size: 1.05em !important;
}

/* Category pills */
body.theme-blossom a[style*="background-color"] {
    border-radius: 2rem !important;
    transition: opacity 0.15s ease, transform 0.15s ease !important;
}
body.theme-blossom a[style*="background-color"]:hover {
    opacity: 0.88 !important;
    transform: translateY(-1px) !important;
}

/* Sidebar */
body.theme-blossom aside .bg-white {
    background: linear-gradient(160deg, #ffffff 0%, #fff5f8 100%) !important;
    border-color: var(--t-border) !important;
    border-radius: 1.5rem !important;
    box-shadow: 0 2px 12px rgba(194,24,91,0.06) !important;
}
body.theme-blossom aside a.text-gray-600 { color: var(--t-text-muted) !important; }
body.theme-blossom aside a:hover { background-color: #fce4ec !important; border-radius: 0.5rem !important; }

/* Pagination */
body.theme-blossom .border-gray-200.rounded-xl {
    border-color: var(--t-border) !important;
    border-radius: 2rem !important;
    color: var(--t-text) !important;
    transition: all 0.2s ease !important;
}
body.theme-blossom .border-gray-200.rounded-xl:hover {
    background: #fce4ec !important;
}

/* Footer */
body.theme-blossom footer {
    background: linear-gradient(180deg, #fce4ec 0%, #f8bbd0 100%) !important;
    border-top: none !important;
    color: var(--t-text-muted) !important;
}
body.theme-blossom footer p,
body.theme-blossom footer a,
body.theme-blossom footer span { color: var(--t-text-muted) !important; }
body.theme-blossom footer a:hover { color: var(--t-primary) !important; }

/* ============================================================
   🌙 MIDNIGHT — Noir luxury brutalism
   Heading: Cinzel (Roman editorial caps)
   Body: Crimson Pro (old-style serif)
   Identity: Bottega Veneta x Blade Runner
   ============================================================ */
body.theme-midnight {
    --t-primary:     #e94560;
    --t-secondary:   #c73652;
    --t-accent:      #ffd700;
    --t-bg:          #080808;
    --t-surface:     #111118;
    --t-card-bg:     #13131f;
    --t-header-bg:   #080808;
    --t-footer-bg:   #080808;
    --t-text:        #ede8e3;
    --t-text-muted:  #8a8a9a;
    --t-border:      #252535;
    --t-btn-text:    #ffffff;
    font-family: 'Crimson Pro', Georgia, serif;
    font-size: 1.05rem;
    background-color: var(--t-bg) !important;
    color: var(--t-text) !important;
    scroll-behavior: smooth;
}

/* Selection */
body.theme-midnight ::selection {
    background-color: rgba(233,69,96,0.3);
    color: #fff;
}

/* Scrollbar */
body.theme-midnight::-webkit-scrollbar { width: 4px; }
body.theme-midnight::-webkit-scrollbar-track { background: #080808; }
body.theme-midnight::-webkit-scrollbar-thumb { background: var(--t-primary); }

/* Header — true noir, gold accent bottom */
body.theme-midnight header {
    background: rgba(6,6,10,0.98) !important;
    border-bottom: none !important;
    box-shadow: 0 4px 40px rgba(0,0,0,0.6) !important;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    position: relative;
}
body.theme-midnight header::after {
    content: '';
    position: absolute;
    bottom: 0; left: 0; right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent 20%, rgba(255,215,0,0.55) 50%, transparent 80%);
}
body.theme-midnight header .text-gray-900,
body.theme-midnight header .text-gray-600,
body.theme-midnight header span { color: var(--t-text) !important; }
body.theme-midnight header svg  { color: var(--t-text) !important; stroke: var(--t-text) !important; }

/* Headings — Cinzel: Roman editorial caps */
body.theme-midnight h1 {
    font-family: 'Cinzel', serif !important;
    color: var(--t-text) !important;
    font-weight: 600 !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase !important;
    line-height: 1.2 !important;
}
body.theme-midnight h2 {
    font-family: 'Cinzel', serif !important;
    color: var(--t-text) !important;
    font-weight: 400 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
}
body.theme-midnight h3 {
    font-family: 'Cinzel', serif !important;
    color: var(--t-text-muted) !important;
    font-weight: 400 !important;
    letter-spacing: 0.1em !important;
    text-transform: uppercase !important;
    font-size: 0.8em !important;
}

/* Body text */
body.theme-midnight .text-gray-900 { color: var(--t-text) !important; }
body.theme-midnight .text-gray-700 { color: var(--t-text) !important; }
body.theme-midnight .text-gray-600 { color: var(--t-text-muted) !important; }
body.theme-midnight .text-gray-500 { color: var(--t-text-muted) !important; }
body.theme-midnight .text-gray-400 { color: #555568 !important; }

/* Backgrounds */
body.theme-midnight .bg-gray-50  { background-color: var(--t-bg) !important; }
body.theme-midnight .bg-gray-100 { background-color: var(--t-surface) !important; }
body.theme-midnight .bg-white    { background-color: var(--t-surface) !important; }

/* Borders */
body.theme-midnight .border-gray-200 { border-color: var(--t-border) !important; }
body.theme-midnight .border-gray-300 { border-color: var(--t-border) !important; }

/* Product cards — sharp brutalist, glowing border on hover */
body.theme-midnight a.bg-white,
body.theme-midnight div.bg-white {
    background-color: var(--t-card-bg) !important;
    border-color: var(--t-border) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}
body.theme-midnight a.bg-white:hover {
    border-color: var(--t-primary) !important;
    box-shadow: 0 0 0 1px var(--t-primary), 0 12px 40px rgba(233,69,96,0.25), inset 0 0 60px rgba(233,69,96,0.03) !important;
    transform: translateY(-3px) !important;
}
body.theme-midnight a.bg-white img {
    transition: transform 0.5s ease !important;
    border-radius: 0;
}
body.theme-midnight a.bg-white:hover img { transform: scale(1.06) !important; }

/* Inputs — sharp, dark */
body.theme-midnight input[type="text"],
body.theme-midnight input[type="email"],
body.theme-midnight input[type="search"],
body.theme-midnight textarea,
body.theme-midnight select {
    background-color: var(--t-surface) !important;
    border-color: var(--t-border) !important;
    color: var(--t-text) !important;
    border-radius: 0 !important;
    padding: 0.6rem 1rem !important;
    font-family: 'Crimson Pro', serif !important;
    font-size: 1rem !important;
}
body.theme-midnight input::placeholder,
body.theme-midnight textarea::placeholder { color: #555568 !important; }
body.theme-midnight input:focus,
body.theme-midnight textarea:focus,
body.theme-midnight select:focus {
    border-color: var(--t-primary) !important;
    box-shadow: 0 0 0 1px var(--t-primary), 0 0 16px rgba(233,69,96,0.15) !important;
    outline: none !important;
}

/* Buttons — flat, sharp, uppercase, roman */
body.theme-midnight button[type="submit"],
body.theme-midnight .btn-primary {
    background: var(--t-primary) !important;
    color: #fff !important;
    border-radius: 0 !important;
    font-family: 'Cinzel', serif !important;
    font-weight: 600 !important;
    letter-spacing: 0.15em !important;
    text-transform: uppercase !important;
    font-size: 0.72rem !important;
    border: none !important;
    padding: 0.75rem 2rem !important;
    box-shadow: none !important;
    transition: background 0.2s ease, box-shadow 0.2s ease, transform 0.15s ease !important;
}
body.theme-midnight button[type="submit"]:hover,
body.theme-midnight .btn-primary:hover {
    background: var(--t-secondary) !important;
    box-shadow: 0 0 24px rgba(233,69,96,0.5) !important;
    transform: translateY(-1px) !important;
}

/* Price — gold with animated glow (luxury signal) */
body.theme-midnight .font-bold.text-gray-900 {
    color: var(--t-accent) !important;
    font-family: 'Cinzel', serif !important;
    font-weight: 600 !important;
    animation: goldGlow 3s ease-in-out infinite !important;
}
body.theme-midnight .text-gray-400.line-through { color: #3a3a4a !important; }

/* Category pills */
body.theme-midnight a[style*="background-color"] {
    border-radius: 0 !important;
    transition: opacity 0.15s ease !important;
}

/* Sidebar */
body.theme-midnight aside .bg-white {
    background-color: var(--t-surface) !important;
    border-color: var(--t-border) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    border-left: 2px solid var(--t-primary) !important;
}
body.theme-midnight aside a.text-gray-600 { color: var(--t-text-muted) !important; }
body.theme-midnight aside a:hover {
    color: var(--t-primary) !important;
    background: rgba(233,69,96,0.06) !important;
    padding-left: 1.25rem !important;
}
body.theme-midnight aside h3 {
    font-family: 'Cinzel', serif !important;
    color: var(--t-text-muted) !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase !important;
}

/* Pagination */
body.theme-midnight .border-gray-200.rounded-xl {
    background-color: var(--t-surface) !important;
    border-color: var(--t-border) !important;
    border-radius: 0 !important;
    color: var(--t-text-muted) !important;
    transition: all 0.2s ease !important;
}
body.theme-midnight .border-gray-200.rounded-xl:hover {
    border-color: var(--t-primary) !important;
    color: var(--t-primary) !important;
}

/* Footer */
body.theme-midnight footer {
    background-color: #040404 !important;
    border-top: 1px solid var(--t-border) !important;
    color: var(--t-text-muted) !important;
}
body.theme-midnight footer p,
body.theme-midnight footer a,
body.theme-midnight footer span { color: var(--t-text-muted) !important; }
body.theme-midnight footer a:hover { color: var(--t-primary) !important; }

/* Out of stock */
body.theme-midnight .text-red-500 { color: var(--t-primary) !important; }

/* Flash messages */
body.theme-midnight .bg-green-50 { background-color: #0d2b1a !important; border-color: #166534 !important; color: #86efac !important; }
body.theme-midnight .bg-red-50   { background-color: #2b0d0d !important; border-color: #991b1b !important; color: #fca5a5 !important; }

/* ============================================================
   🌿 FOREST — Arts & Crafts literary
   Heading: Cormorant Garamond (old-soul ink-pressed serif)
   Body: Lato (clean, earthy humanist sans)
   Identity: William Morris workshop meets Scandinavian nature spa
   ============================================================ */
body.theme-forest {
    --t-primary:     #2d5a27;
    --t-secondary:   #4a7c40;
    --t-accent:      #bc4749;
    --t-bg:          #f5efe0;
    --t-surface:     #fafaf3;
    --t-card-bg:     #ffffff;
    --t-header-bg:   #2d5a27;
    --t-footer-bg:   #1a3a15;
    --t-text:        #1a2b1c;
    --t-text-muted:  #3d5c35;
    --t-border:      #c5d4a8;
    --t-btn-text:    #ffffff;
    font-family: 'Lato', sans-serif;
    font-weight: 400;
    background-color: var(--t-bg) !important;
    /* subtle parchment grain */
    background-image: radial-gradient(circle at 20% 50%, rgba(56,102,65,0.04) 0%, transparent 60%),
                      radial-gradient(circle at 80% 20%, rgba(188,71,73,0.03) 0%, transparent 50%) !important;
    color: var(--t-text) !important;
    scroll-behavior: smooth;
}

/* Selection */
body.theme-forest ::selection {
    background-color: rgba(74,124,64,0.25);
    color: var(--t-text);
}

/* Scrollbar */
body.theme-forest::-webkit-scrollbar { width: 7px; }
body.theme-forest::-webkit-scrollbar-track { background: #e8ddc8; }
body.theme-forest::-webkit-scrollbar-thumb { background: #6a994e; border-radius: 0; }
body.theme-forest::-webkit-scrollbar-thumb:hover { background: var(--t-primary); }

/* Header — solid forest canopy */
body.theme-forest header,
body.theme-forest header.theme-header,
body.theme-forest header.bg-white {
    background-color: var(--t-header-bg) !important;
    border-bottom: none !important;
    box-shadow: 0 6px 32px rgba(20,46,17,0.45) !important;
    position: relative;
}
body.theme-forest header::after {
    content: '';
    position: absolute;
    bottom: 0; left: 0; right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent 10%, rgba(167,201,87,0.45) 50%, transparent 90%);
}
body.theme-forest header .text-gray-900,
body.theme-forest header .text-gray-600,
body.theme-forest header span,
body.theme-forest header a { color: rgba(255,255,255,0.95) !important; }
body.theme-forest header svg {
    color: rgba(255,255,255,0.85) !important;
    stroke: rgba(255,255,255,0.85) !important;
}

/* Headings — Cormorant Garamond: ink-pressed literary serif */
body.theme-forest h1 {
    font-family: 'Cormorant Garamond', serif !important;
    color: var(--t-primary) !important;
    font-weight: 700 !important;
    font-style: italic !important;
    letter-spacing: -0.02em !important;
    line-height: 1.15 !important;
    font-size: 1.15em !important;
}
body.theme-forest h2 {
    font-family: 'Cormorant Garamond', serif !important;
    color: var(--t-text) !important;
    font-weight: 600 !important;
    letter-spacing: -0.01em !important;
}
body.theme-forest h3 {
    font-family: 'Lato', sans-serif !important;
    color: var(--t-text) !important;
    font-weight: 700 !important;
    letter-spacing: 0.04em !important;
    text-transform: uppercase !important;
    font-size: 0.82em !important;
}

/* Body text */
body.theme-forest .text-gray-900 { color: var(--t-text) !important; }
body.theme-forest .text-gray-700 { color: var(--t-text) !important; }
body.theme-forest .text-gray-600 { color: var(--t-text-muted) !important; }
body.theme-forest .text-gray-500 { color: var(--t-text-muted) !important; }
body.theme-forest .text-gray-400 { color: #7a9e6a !important; }

/* Backgrounds */
body.theme-forest .bg-gray-50  { background-color: var(--t-bg) !important; }
body.theme-forest .bg-gray-100 { background-color: #eae4d0 !important; }
body.theme-forest .bg-white    { background-color: var(--t-surface) !important; }

/* Borders */
body.theme-forest .border-gray-200 { border-color: var(--t-border) !important; }
body.theme-forest .border-gray-300 { border-color: var(--t-border) !important; }

/* Product cards — natural handcrafted feel */
body.theme-forest a.bg-white,
body.theme-forest div.bg-white {
    background-color: var(--t-card-bg) !important;
    border-color: var(--t-border) !important;
    border-radius: 0.25rem !important;
    box-shadow: 0 2px 0 #c5d4a8, 0 4px 16px rgba(26,42,28,0.06) !important;
}
body.theme-forest a.bg-white:hover {
    box-shadow: 0 2px 0 #6a994e, 0 12px 32px rgba(45,90,39,0.18) !important;
    transform: translateY(-4px) !important;
    border-color: var(--t-secondary) !important;
}
body.theme-forest a.bg-white img {
    transition: transform 0.45s ease !important;
    border-radius: 0.125rem 0.125rem 0 0;
}
body.theme-forest a.bg-white:hover img { transform: scale(1.05) !important; }

/* Inputs — warm parchment */
body.theme-forest input[type="text"],
body.theme-forest input[type="email"],
body.theme-forest input[type="search"],
body.theme-forest textarea,
body.theme-forest select {
    background-color: #fafaf3 !important;
    border-color: var(--t-border) !important;
    color: var(--t-text) !important;
    border-radius: 0.25rem !important;
    padding: 0.6rem 1rem !important;
    border-bottom: 2px solid var(--t-border) !important;
}
body.theme-forest input::placeholder,
body.theme-forest textarea::placeholder { color: #8aaa7a !important; }
body.theme-forest input:focus,
body.theme-forest textarea:focus,
body.theme-forest select:focus {
    border-color: var(--t-secondary) !important;
    border-bottom-color: var(--t-primary) !important;
    box-shadow: 0 2px 0 var(--t-primary) !important;
    outline: none !important;
    background-color: #ffffff !important;
}

/* Buttons — forest guild: solid, honest */
body.theme-forest button[type="submit"],
body.theme-forest .btn-primary {
    background: var(--t-primary) !important;
    color: #fff !important;
    border-radius: 0.25rem !important;
    font-family: 'Lato', sans-serif !important;
    font-weight: 900 !important;
    letter-spacing: 0.06em !important;
    text-transform: uppercase !important;
    font-size: 0.8rem !important;
    border: none !important;
    padding: 0.7rem 1.75rem !important;
    box-shadow: 0 3px 0 #1a3a15 !important;
    transition: all 0.15s ease !important;
}
body.theme-forest button[type="submit"]:hover,
body.theme-forest .btn-primary:hover {
    background: var(--t-secondary) !important;
    box-shadow: 0 1px 0 #1a3a15 !important;
    transform: translateY(2px) !important;
}
body.theme-forest button[type="submit"]:active,
body.theme-forest .btn-primary:active {
    box-shadow: none !important;
    transform: translateY(3px) !important;
}

/* Price — accent red (berry/rowan contrast) */
body.theme-forest .font-bold.text-gray-900 {
    color: var(--t-accent) !important;
    font-family: 'Cormorant Garamond', serif !important;
    font-weight: 700 !important;
    font-size: 1.1em !important;
}

/* Category pills */
body.theme-forest a[style*="background-color"] {
    border-radius: 0.25rem !important;
    transition: opacity 0.15s ease, transform 0.15s ease !important;
}
body.theme-forest a[style*="background-color"]:hover {
    opacity: 0.88 !important;
    transform: translateY(-1px) !important;
}

/* Sidebar */
body.theme-forest aside .bg-white {
    background-color: #f0e8d4 !important;
    border-color: var(--t-border) !important;
    border-radius: 0.25rem !important;
    border-left: 3px solid var(--t-primary) !important;
    box-shadow: 2px 2px 0 #c5d4a8 !important;
}
body.theme-forest aside a.text-gray-600 { color: var(--t-text-muted) !important; }
body.theme-forest aside a:hover {
    background-color: #ddeec8 !important;
    border-radius: 0.125rem !important;
    padding-left: 1.25rem !important;
}
body.theme-forest aside h3 {
    font-family: 'Cormorant Garamond', serif !important;
    color: var(--t-text) !important;
    font-weight: 700 !important;
    font-style: italic !important;
}

/* Pagination */
body.theme-forest .border-gray-200.rounded-xl {
    background-color: #f0e8d4 !important;
    border-color: var(--t-border) !important;
    border-radius: 0.25rem !important;
    color: var(--t-text) !important;
    box-shadow: 2px 2px 0 #c5d4a8 !important;
    transition: all 0.15s ease !important;
}
body.theme-forest .border-gray-200.rounded-xl:hover {
    background-color: var(--t-primary) !important;
    color: #fff !important;
    border-color: var(--t-primary) !important;
    box-shadow: 2px 2px 0 #1a3a15 !important;
    transform: translateY(-1px) !important;
}

/* Footer — deep canopy */
body.theme-forest footer {
    background-color: var(--t-footer-bg) !important;
    border-top: none !important;
    color: rgba(255,255,255,0.75) !important;
}
body.theme-forest footer p,
body.theme-forest footer a,
body.theme-forest footer span { color: rgba(255,255,255,0.75) !important; }
body.theme-forest footer a:hover { color: #a7c957 !important; }

/* ============================================================
   🌊 OCEAN — Marine scientific minimalism
   Heading: Fraunces (high-contrast optical size serif)
   Body: DM Sans (clean humanist geometric)
   Identity: Oceanographic institute meets Kinfolk magazine
   ============================================================ */
body.theme-ocean {
    --t-primary:     #005f99;
    --t-secondary:   #0096c7;
    --t-accent:      #023e8a;
    --t-bg:          #f7fbff;
    --t-surface:     #ffffff;
    --t-card-bg:     #ffffff;
    --t-header-bg:   #ffffff;
    --t-footer-bg:   #012a4a;
    --t-text:        #012a4a;
    --t-text-muted:  #1a4f6e;
    --t-border:      #cae9ff;
    --t-btn-text:    #ffffff;
    font-family: 'DM Sans', sans-serif;
    font-size: 1rem;
    background-color: var(--t-bg) !important;
    color: var(--t-text) !important;
    scroll-behavior: smooth;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Selection */
body.theme-ocean ::selection {
    background-color: rgba(0,150,199,0.2);
    color: var(--t-accent);
}

/* Scrollbar */
body.theme-ocean::-webkit-scrollbar { width: 5px; }
body.theme-ocean::-webkit-scrollbar-track { background: var(--t-bg); }
body.theme-ocean::-webkit-scrollbar-thumb { background: #90e0ef; }
body.theme-ocean::-webkit-scrollbar-thumb:hover { background: var(--t-secondary); }

/* Header — pure white, hairline precision */
body.theme-ocean header {
    background: rgba(255,255,255,0.98) !important;
    border-bottom: none !important;
    box-shadow: 0 1px 0 #cae9ff, 0 4px 24px rgba(0,95,153,0.05) !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    position: relative;
}
body.theme-ocean header::after {
    content: '';
    position: absolute;
    bottom: 0; left: 0; right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent 10%, rgba(0,95,153,0.18) 50%, transparent 90%);
}
body.theme-ocean header .text-gray-900,
body.theme-ocean header .text-gray-600,
body.theme-ocean header span { color: var(--t-text) !important; }
body.theme-ocean header svg  { color: var(--t-text) !important; stroke: var(--t-text) !important; }

/* Headings — Fraunces: dramatic optical-size ink serif */
body.theme-ocean h1 {
    font-family: 'Fraunces', serif !important;
    color: var(--t-accent) !important;
    font-weight: 900 !important;
    letter-spacing: -0.04em !important;
    line-height: 1.1 !important;
    font-optical-sizing: auto;
}
body.theme-ocean h2 {
    font-family: 'Fraunces', serif !important;
    color: var(--t-text) !important;
    font-weight: 700 !important;
    letter-spacing: -0.02em !important;
}
body.theme-ocean h3 {
    font-family: 'DM Sans', sans-serif !important;
    color: var(--t-text) !important;
    font-weight: 600 !important;
    letter-spacing: 0.05em !important;
    text-transform: uppercase !important;
    font-size: 0.78em !important;
}

/* Body text */
body.theme-ocean .text-gray-900 { color: var(--t-text) !important; }
body.theme-ocean .text-gray-700 { color: var(--t-text) !important; }
body.theme-ocean .text-gray-600 { color: var(--t-text-muted) !important; }
body.theme-ocean .text-gray-500 { color: var(--t-text-muted) !important; }
body.theme-ocean .text-gray-400 { color: #6aaccc !important; }

/* Backgrounds */
body.theme-ocean .bg-gray-50  { background-color: var(--t-bg) !important; }
body.theme-ocean .bg-gray-100 { background-color: #e0f4ff !important; }
body.theme-ocean .bg-white    { background-color: var(--t-surface) !important; }

/* Borders */
body.theme-ocean .border-gray-200 { border-color: var(--t-border) !important; }
body.theme-ocean .border-gray-300 { border-color: var(--t-border) !important; }

/* Product cards — near-borderless, deep hover shadow */
body.theme-ocean a.bg-white,
body.theme-ocean div.bg-white {
    background-color: var(--t-card-bg) !important;
    border-color: transparent !important;
    border-radius: 0.75rem !important;
    box-shadow: 0 0 0 1px #e8f4ff, 0 2px 8px rgba(0,95,153,0.05) !important;
}
body.theme-ocean a.bg-white:hover {
    border-color: transparent !important;
    box-shadow: 0 0 0 1px #90e0ef, 0 16px 40px rgba(0,95,153,0.15) !important;
    transform: translateY(-5px) !important;
}
body.theme-ocean a.bg-white img {
    transition: transform 0.45s cubic-bezier(0.25,0.46,0.45,0.94) !important;
    border-radius: 0.625rem 0.625rem 0 0;
}
body.theme-ocean a.bg-white:hover img { transform: scale(1.05) !important; }

/* Inputs — razor clean */
body.theme-ocean input[type="text"],
body.theme-ocean input[type="email"],
body.theme-ocean input[type="search"],
body.theme-ocean textarea,
body.theme-ocean select {
    background-color: #f0f8ff !important;
    border-color: #cae9ff !important;
    color: var(--t-text) !important;
    border-radius: 0.5rem !important;
    padding: 0.6rem 1rem !important;
    font-family: 'DM Sans', sans-serif !important;
}
body.theme-ocean input::placeholder,
body.theme-ocean textarea::placeholder { color: #6aaccc !important; }
body.theme-ocean input:focus,
body.theme-ocean textarea:focus,
body.theme-ocean select:focus {
    border-color: var(--t-secondary) !important;
    box-shadow: 0 0 0 3px rgba(0,150,199,0.15) !important;
    outline: none !important;
    background-color: #ffffff !important;
}

/* Buttons — deep ocean, clean */
body.theme-ocean button[type="submit"],
body.theme-ocean .btn-primary {
    background: var(--t-primary) !important;
    color: #fff !important;
    border-radius: 0.5rem !important;
    font-family: 'DM Sans', sans-serif !important;
    font-weight: 600 !important;
    letter-spacing: 0.01em !important;
    border: none !important;
    padding: 0.7rem 1.75rem !important;
    box-shadow: 0 4px 14px rgba(0,95,153,0.3) !important;
    transition: all 0.2s ease !important;
}
body.theme-ocean button[type="submit"]:hover,
body.theme-ocean .btn-primary:hover {
    background: var(--t-secondary) !important;
    box-shadow: 0 8px 24px rgba(0,95,153,0.4) !important;
    transform: translateY(-2px) !important;
}

/* Price — Fraunces, deep navy, editorial */
body.theme-ocean .font-bold.text-gray-900 {
    color: var(--t-primary) !important;
    font-family: 'Fraunces', serif !important;
    font-weight: 700 !important;
    letter-spacing: -0.02em !important;
    font-size: 1.05em !important;
}

/* Category pills */
body.theme-ocean a[style*="background-color"] {
    border-radius: 0.375rem !important;
    transition: opacity 0.15s ease, transform 0.15s ease !important;
}
body.theme-ocean a[style*="background-color"]:hover {
    opacity: 0.88 !important;
    transform: translateY(-1px) !important;
}

/* Sidebar */
body.theme-ocean aside .bg-white {
    background-color: #eaf5ff !important;
    border-color: #cae9ff !important;
    border-radius: 0.75rem !important;
    box-shadow: none !important;
    border-left: 3px solid var(--t-secondary) !important;
}
body.theme-ocean aside a.text-gray-600 { color: var(--t-text-muted) !important; }
body.theme-ocean aside a:hover {
    background-color: #cae9ff !important;
    border-radius: 0.375rem !important;
}
body.theme-ocean aside h3 {
    font-family: 'DM Sans', sans-serif !important;
    color: var(--t-text) !important;
    font-weight: 600 !important;
    letter-spacing: 0.06em !important;
    text-transform: uppercase !important;
}

/* Pagination */
body.theme-ocean .border-gray-200.rounded-xl {
    background-color: #eaf5ff !important;
    border-color: #cae9ff !important;
    border-radius: 0.5rem !important;
    color: var(--t-primary) !important;
    transition: all 0.2s ease !important;
}
body.theme-ocean .border-gray-200.rounded-xl:hover {
    background-color: var(--t-primary) !important;
    color: #fff !important;
    border-color: var(--t-primary) !important;
    transform: translateY(-1px) !important;
}

/* Footer — deep navy trench */
body.theme-ocean footer {
    background-color: var(--t-footer-bg) !important;
    border-top: none !important;
    color: rgba(144,224,239,0.8) !important;
}
body.theme-ocean footer p,
body.theme-ocean footer a,
body.theme-ocean footer span { color: rgba(144,224,239,0.8) !important; }
body.theme-ocean footer a:hover { color: var(--t-secondary) !important; }

/* ============================================================
   🌅 SUNSET — Retro-futurist maximalism
   Heading: Syne (geometric grotesque, wide & bold)
   Body: Poppins (clean modern geometric)
   Identity: Wes Anderson directs a 1970s space-age boutique
   ============================================================ */
body.theme-sunset {
    --t-primary:     #e8521a;
    --t-secondary:   #c44210;
    --t-accent:      #0d6e5a;
    --t-bg:          #fef8f0;
    --t-surface:     #ffffff;
    --t-card-bg:     #ffffff;
    --t-header-bg:   #fef3e6;
    --t-footer-bg:   #003d6b;
    --t-text:        #150f05;
    --t-text-muted:  #6b4423;
    --t-border:      #fad5b0;
    --t-btn-text:    #ffffff;
    font-family: 'Poppins', sans-serif;
    font-weight: 300;
    background: linear-gradient(170deg, #fef8f0 0%, #fff3e4 100%) !important;
    color: var(--t-text) !important;
    scroll-behavior: smooth;
}

/* Selection */
body.theme-sunset ::selection {
    background-color: rgba(232,82,26,0.18);
    color: var(--t-text);
}

/* Scrollbar */
body.theme-sunset::-webkit-scrollbar { width: 6px; }
body.theme-sunset::-webkit-scrollbar-track { background: #fde8d0; }
body.theme-sunset::-webkit-scrollbar-thumb { background: linear-gradient(180deg, #ff8c42, #e8521a); border-radius: 3px; }

/* Header — warm cream with gradient accent */
body.theme-sunset header {
    background: rgba(255,252,246,0.97) !important;
    border-bottom: none !important;
    box-shadow: 0 4px 28px rgba(232,82,26,0.07) !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    position: relative;
}
body.theme-sunset header::after {
    content: '';
    position: absolute;
    bottom: 0; left: 0; right: 0;
    height: 2px;
    background: linear-gradient(90deg, transparent 15%, rgba(255,107,53,0.45) 50%, transparent 85%);
}
body.theme-sunset header .text-gray-900,
body.theme-sunset header .text-gray-600,
body.theme-sunset header span { color: var(--t-text) !important; }
body.theme-sunset header svg  { color: var(--t-text) !important; stroke: var(--t-text) !important; }

/* Headings — Syne: geometric wide bold */
body.theme-sunset h1 {
    font-family: 'Syne', sans-serif !important;
    color: var(--t-text) !important;
    font-weight: 800 !important;
    letter-spacing: -0.02em !important;
    line-height: 1.1 !important;
    text-transform: uppercase !important;
}
body.theme-sunset h2 {
    font-family: 'Syne', sans-serif !important;
    color: var(--t-text) !important;
    font-weight: 700 !important;
    letter-spacing: 0.02em !important;
    text-transform: uppercase !important;
}
body.theme-sunset h3 {
    font-family: 'Syne', sans-serif !important;
    color: var(--t-text-muted) !important;
    font-weight: 600 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    font-size: 0.8em !important;
}

/* Body text */
body.theme-sunset .text-gray-900 { color: var(--t-text) !important; }
body.theme-sunset .text-gray-700 { color: var(--t-text) !important; }
body.theme-sunset .text-gray-600 { color: var(--t-text-muted) !important; }
body.theme-sunset .text-gray-500 { color: var(--t-text-muted) !important; }
body.theme-sunset .text-gray-400 { color: #c4956a !important; }

/* Backgrounds */
body.theme-sunset .bg-gray-50  { background-color: var(--t-bg) !important; }
body.theme-sunset .bg-gray-100 { background-color: #fde8d0 !important; }
body.theme-sunset .bg-white    { background-color: var(--t-surface) !important; }

/* Borders */
body.theme-sunset .border-gray-200 { border-color: var(--t-border) !important; }
body.theme-sunset .border-gray-300 { border-color: var(--t-border) !important; }

/* Product cards — warm lift, generous rounding */
body.theme-sunset a.bg-white,
body.theme-sunset div.bg-white {
    background-color: var(--t-card-bg) !important;
    border-color: var(--t-border) !important;
    border-radius: 1.25rem !important;
    box-shadow: 0 3px 0 #fad5b0, 0 6px 20px rgba(232,82,26,0.07) !important;
}
body.theme-sunset a.bg-white:hover {
    box-shadow: 0 3px 0 #f5a87a, 0 18px 40px rgba(232,82,26,0.2) !important;
    transform: translateY(-5px) !important;
    border-color: #f5a87a !important;
}
body.theme-sunset a.bg-white img {
    transition: transform 0.45s ease !important;
    border-radius: 1rem 1rem 0 0;
}
body.theme-sunset a.bg-white:hover img { transform: scale(1.07) !important; }

/* Inputs — warm cream */
body.theme-sunset input[type="text"],
body.theme-sunset input[type="email"],
body.theme-sunset input[type="search"],
body.theme-sunset textarea,
body.theme-sunset select {
    background-color: #fff8f0 !important;
    border-color: var(--t-border) !important;
    color: var(--t-text) !important;
    border-radius: 0.75rem !important;
    padding: 0.6rem 1rem !important;
    font-family: 'Poppins', sans-serif !important;
    font-weight: 300 !important;
}
body.theme-sunset input::placeholder,
body.theme-sunset textarea::placeholder { color: #c4956a !important; }
body.theme-sunset input:focus,
body.theme-sunset textarea:focus,
body.theme-sunset select:focus {
    border-color: var(--t-primary) !important;
    box-shadow: 0 0 0 3px rgba(232,82,26,0.15) !important;
    outline: none !important;
    background-color: #ffffff !important;
}

/* Buttons — fire gradient, animated warm pulse */
body.theme-sunset button[type="submit"],
body.theme-sunset .btn-primary {
    background: linear-gradient(135deg, #ff6b35, #e8521a, #c44210) !important;
    color: #fff !important;
    border-radius: 0.75rem !important;
    font-family: 'Syne', sans-serif !important;
    font-weight: 700 !important;
    letter-spacing: 0.05em !important;
    text-transform: uppercase !important;
    font-size: 0.78rem !important;
    border: none !important;
    padding: 0.75rem 1.75rem !important;
    animation: sunsetPulse 2.5s ease-in-out infinite !important;
    transition: transform 0.2s ease, opacity 0.2s ease !important;
}
body.theme-sunset button[type="submit"]:hover,
body.theme-sunset .btn-primary:hover {
    animation: none !important;
    box-shadow: 0 8px 28px rgba(232,82,26,0.55) !important;
    transform: translateY(-2px) !important;
    opacity: 0.95 !important;
}

/* Price — accent teal for contrast pop */
body.theme-sunset .font-bold.text-gray-900 {
    color: var(--t-accent) !important;
    font-family: 'Syne', sans-serif !important;
    font-weight: 700 !important;
    letter-spacing: -0.01em !important;
}

/* Category pills */
body.theme-sunset a[style*="background-color"] {
    border-radius: 0.5rem !important;
    transition: opacity 0.15s ease, transform 0.15s ease !important;
}
body.theme-sunset a[style*="background-color"]:hover {
    opacity: 0.88 !important;
    transform: translateY(-1px) !important;
}

/* Sidebar */
body.theme-sunset aside .bg-white {
    background: linear-gradient(160deg, #ffffff 0%, #fff8f0 100%) !important;
    border-color: var(--t-border) !important;
    border-radius: 1.25rem !important;
    box-shadow: 0 3px 0 #fad5b0 !important;
    border-left: 3px solid var(--t-primary) !important;
}
body.theme-sunset aside a.text-gray-600 { color: var(--t-text-muted) !important; }
body.theme-sunset aside a:hover {
    background-color: #fde8d0 !important;
    border-radius: 0.5rem !important;
    padding-left: 1.1rem !important;
}
body.theme-sunset aside h3 {
    font-family: 'Syne', sans-serif !important;
    color: var(--t-text) !important;
    font-weight: 700 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
}

/* Pagination */
body.theme-sunset .border-gray-200.rounded-xl {
    background-color: #fff3e4 !important;
    border-color: var(--t-border) !important;
    border-radius: 0.75rem !important;
    color: var(--t-primary) !important;
    transition: all 0.2s ease !important;
}
body.theme-sunset .border-gray-200.rounded-xl:hover {
    background-color: var(--t-primary) !important;
    color: #fff !important;
    border-color: var(--t-primary) !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 12px rgba(232,82,26,0.3) !important;
}

/* Footer — deep sky blue */
body.theme-sunset footer {
    background-color: var(--t-footer-bg) !important;
    border-top: none !important;
    color: rgba(253,224,188,0.85) !important;
}
body.theme-sunset footer p,
body.theme-sunset footer a,
body.theme-sunset footer span { color: rgba(253,224,188,0.85) !important; }
body.theme-sunset footer a:hover { color: #ff8c42 !important; }

/* ============================================================
   PAYMENT METHOD CARD — semantic classes (checkout.php)
   ============================================================ */
.payment-card {
    border-color: #e5e7eb;
    background-color: #ffffff;
}
.payment-card-selected {
    border-color: #7c3aed !important;
    background-color: #f5f3ff !important;
}
.payment-card-unselected {
    border-color: #e5e7eb !important;
    background-color: #ffffff !important;
}
.payment-icon   { color: #7c3aed; stroke: #7c3aed; }
.payment-radio  { accent-color: #7c3aed; }
.payment-instructions {
    background-color: #ffffff;
    border: 1px solid #ddd6fe;
    color: #374151;
}
.payment-no-methods {
    background-color: #fffbeb;
    border: 1px solid #fcd34d;
    color: #92400e;
}

/* ── All themed bodies ── */
body[class*="theme-"] .payment-card {
    background-color: var(--t-surface) !important;
    border-color: var(--t-border) !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
}
body[class*="theme-"] .payment-card-selected {
    border-color: var(--t-primary) !important;
    background-color: var(--t-card-bg) !important;
}
body[class*="theme-"] .payment-card-unselected {
    border-color: var(--t-border) !important;
    background-color: var(--t-surface) !important;
}
body[class*="theme-"] .payment-icon  { color: var(--t-primary) !important; stroke: var(--t-primary) !important; }
body[class*="theme-"] .payment-radio { accent-color: var(--t-primary) !important; }
body[class*="theme-"] .payment-instructions {
    background-color: var(--t-surface) !important;
    border-color: var(--t-border) !important;
    color: var(--t-text) !important;
}
body[class*="theme-"] .payment-no-methods {
    background-color: var(--t-surface) !important;
    border-color: var(--t-border) !important;
    color: var(--t-text-muted) !important;
}

/* Light theme selected card tints */
body.theme-blossom .payment-card-selected { background-color: #fff0f8 !important; box-shadow: 0 0 0 3px rgba(194,24,91,0.1) !important; }
body.theme-forest  .payment-card-selected { background-color: #eef5e0 !important; box-shadow: 0 0 0 3px rgba(45,90,39,0.1) !important; }
body.theme-ocean   .payment-card-selected { background-color: #e8f4fd !important; box-shadow: 0 0 0 3px rgba(0,95,153,0.1) !important; }
body.theme-sunset  .payment-card-selected { background-color: #fff3e0 !important; box-shadow: 0 0 0 3px rgba(232,82,26,0.1) !important; }
body.theme-midnight .payment-card-selected { background-color: #1a0a2e !important; box-shadow: 0 0 0 1px var(--t-primary), 0 0 16px rgba(233,69,96,0.15) !important; }
body.theme-midnight .payment-instructions  { background-color: #0f0f2e !important; border-color: #2d2d4e !important; color: #f0f0f0 !important; }

/* ============================================================
   SHARED OVERRIDES (all themes)
   ============================================================ */
body[class*="theme-"] header .cart-badge {
    background-color: var(--t-primary) !important;
    color: #fff !important;
}
body[class*="theme-"] .text-primary   { color: var(--t-primary) !important; }
body[class*="theme-"] .border-primary { border-color: var(--t-primary) !important; }
body[class*="theme-"] .btn-primary {
    background-color: var(--t-primary) !important;
    color: var(--t-btn-text) !important;
}
body[class*="theme-"] .btn-primary:hover { background-color: var(--t-secondary) !important; }
body[class*="theme-"] a[style*="background-color"] { color: #fff !important; }
body[class*="theme-"] .text-red-500 { color: #ef4444 !important; }
body[class*="theme-"] .line-through  { opacity: 0.5; }
body[class*="theme-"] aside a.hover\:bg-gray-50:hover { background-color: rgba(0,0,0,0.05) !important; }

/* Qty inputs */
body[class*="theme-"] input[type="number"] {
    background-color: var(--t-surface) !important;
    border-color: var(--t-border) !important;
    color: var(--t-text) !important;
}
body[class*="theme-"] input[type="number"]:focus {
    border-color: var(--t-primary) !important;
    box-shadow: 0 0 0 3px rgba(0,0,0,0.08) !important;
    outline: none !important;
}
body.theme-midnight input[type="number"] {
    background-color: var(--t-surface) !important;
    color: var(--t-text) !important;
    border-color: var(--t-border) !important;
}

/* Label text */
body[class*="theme-"] label.text-gray-700,
body[class*="theme-"] label.text-sm { color: var(--t-text) !important; }

/* ── RESPONSIVE ───────────────────────────────────────────── */
@media (max-width: 640px) {
    body[class*="theme-"] a.bg-white,
    body[class*="theme-"] div.bg-white { border-radius: 1rem !important; }
    body[class*="theme-"] button[type="submit"],
    body[class*="theme-"] .btn-primary  { font-size: 0.82rem; padding: 0.55rem 1.1rem; }
    body.theme-midnight a.bg-white,
    body.theme-midnight div.bg-white    { border-radius: 0 !important; }
}

/* ============================================================
   MIDNIGHT — Dark utility box overrides
   ============================================================ */
body.theme-midnight .bg-amber-50   { background-color: #2a1f00 !important; border-color: #92400e !important; }
body.theme-midnight .border-amber-200 { border-color: #92400e !important; }
body.theme-midnight .text-amber-900 { color: #fcd34d !important; }
body.theme-midnight .text-amber-800 { color: #fbbf24 !important; }
body.theme-midnight .text-amber-700 { color: #f59e0b !important; }
body.theme-midnight .text-amber-600 { color: #d97706 !important; }
body.theme-midnight .bg-indigo-50  { background-color: #1a1a3e !important; border-color: #4338ca !important; }
body.theme-midnight .border-indigo-200 { border-color: #4338ca !important; }
body.theme-midnight .text-indigo-900 { color: #a5b4fc !important; }
body.theme-midnight .text-indigo-800 { color: #818cf8 !important; }
body.theme-midnight .text-indigo-700 { color: #6366f1 !important; }
body.theme-midnight .text-indigo-600 { color: #818cf8 !important; }
body.theme-midnight .border-indigo-200.rounded-lg { background-color: #0f0f2e !important; border-color: #4338ca !important; }
body.theme-midnight .text-indigo-800.tracking-widest { color: #a5b4fc !important; }
body.theme-midnight .bg-indigo-600 { background-color: #4338ca !important; color: #fff !important; }
body.theme-midnight .hover\:bg-indigo-700:hover { background-color: #3730a3 !important; }
body.theme-midnight .bg-blue-50    { background-color: #0a1628 !important; border-color: #1d4ed8 !important; }
body.theme-midnight .border-blue-200 { border-color: #1d4ed8 !important; }
body.theme-midnight .text-blue-900 { color: #93c5fd !important; }
body.theme-midnight .text-blue-800 { color: #60a5fa !important; }
body.theme-midnight .text-blue-600 { color: #3b82f6 !important; }
body.theme-midnight .text-blue-500 { color: #60a5fa !important; }
body.theme-midnight .hover\:bg-blue-50:hover { background-color: #0f1f3d !important; }
body.theme-midnight .bg-sky-50     { background-color: #0a1e2e !important; border-color: #0369a1 !important; }
body.theme-midnight .border-sky-200 { border-color: #0369a1 !important; }
body.theme-midnight .text-sky-900  { color: #7dd3fc !important; }
body.theme-midnight .text-sky-700  { color: #38bdf8 !important; }
body.theme-midnight .text-sky-600  { color: #0ea5e9 !important; }
body.theme-midnight .text-green-600 { color: #4ade80 !important; }
body.theme-midnight .bg-green-100  { background-color: #052e16 !important; }
body.theme-midnight .text-green-500 { color: #4ade80 !important; }
body.theme-midnight .bg-red-100    { background-color: #2d0a0a !important; }
body.theme-midnight .text-red-600  { color: #f87171 !important; }
body.theme-midnight .bg-purple-50  { background-color: #1a0a2e !important; border-color: #7c3aed !important; }
body.theme-midnight .border-purple-500 { border-color: #7c3aed !important; }
body.theme-midnight .text-purple-600 { color: #c084fc !important; }
body.theme-midnight .border-purple-200.rounded-lg,
body.theme-midnight .border-blue-200.rounded-lg { background-color: #0f0f2e !important; border-color: #4338ca !important; color: var(--t-text) !important; }
body.theme-midnight .border-purple-200.rounded-lg .text-gray-700,
body.theme-midnight .border-blue-200.rounded-lg .text-gray-700 { color: var(--t-text) !important; }
body.theme-midnight .bg-amber-50 .bg-white,
body.theme-midnight .bg-amber-50 div.bg-white { background-color: #1a1000 !important; border-color: #92400e !important; color: #fcd34d !important; }
body.theme-midnight .bg-amber-50 .text-gray-800 { color: #fcd34d !important; }
body.theme-midnight .text-gray-900.text-sm { color: var(--t-text) !important; }
body.theme-midnight input[type="tel"],
body.theme-midnight input[type="text"],
body.theme-midnight input[type="email"] {
    background-color: var(--t-surface) !important;
    border-color: var(--t-border) !important;
    color: var(--t-text) !important;
    border-radius: 0 !important;
}
body.theme-midnight input[type="tel"]::placeholder,
body.theme-midnight input[type="text"]::placeholder,
body.theme-midnight input[type="email"]::placeholder { color: var(--t-text-muted) !important; }
body.theme-midnight select option { background-color: var(--t-surface); color: var(--t-text); }
body.theme-midnight .bg-gray-50.rounded-xl { background-color: var(--t-surface) !important; }
body.theme-midnight .sticky.top-24.bg-white { background-color: var(--t-card-bg) !important; border-color: var(--t-border) !important; }
body.theme-midnight .text-gray-400.text-center { color: var(--t-text-muted) !important; }
body.theme-midnight .bg-green-50 { background-color: #0d2b1a !important; border-color: #166534 !important; color: #86efac !important; }
body.theme-midnight .bg-red-50   { background-color: #2b0d0d !important; border-color: #991b1b !important; color: #fca5a5 !important; }


/* ============================================================
   LAYOUT v2 — New component styles
   Announcement banner  Centered logo header  Category nav
   ============================================================ */

/* BLOSSOM announcement */
body.theme-blossom .theme-announcement {
    font-family: "DM Serif Display", serif !important;
    font-style: italic;
    letter-spacing: 0.03em;
    background: linear-gradient(90deg, #c2185b, #ad1457, #c2185b) !important;
}
body.theme-blossom .theme-nav {
    background: transparent !important;
    border-top: none !important;
}
body.theme-blossom .theme-nav a.text-gray-600 { color: var(--t-text-muted) !important; }
body.theme-blossom .theme-nav a.text-gray-600:hover {
    background: rgba(194,24,91,0.08) !important;
    color: var(--t-primary) !important;
}
body.theme-blossom .theme-nav-mobile {
    background: rgba(255,255,255,0.96) !important;
    border-top: 1px solid #f8bbd0 !important;
}
body.theme-blossom .theme-nav-mobile a.bg-gray-100 {
    background: rgba(252,228,236,0.6) !important;
    color: var(--t-text-muted) !important;
}
body.theme-blossom .theme-footer {
    background: linear-gradient(180deg, #fce4ec, #fdf0f5) !important;
    border-top: 1px solid #f8bbd0 !important;
}
body.theme-blossom .theme-footer p,
body.theme-blossom .theme-footer a,
body.theme-blossom .theme-footer span { color: #78184a !important; }
body.theme-blossom .theme-footer a:hover { color: var(--t-primary) !important; }

/* MIDNIGHT announcement */
body.theme-midnight .theme-announcement {
    font-family: "Cinzel", serif !important;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    font-size: 0.7rem !important;
    background: #080808 !important;
    border-bottom: 1px solid rgba(255,215,0,0.3);
    color: #ffd700 !important;
}
body.theme-midnight .theme-nav {
    background: transparent !important;
    border-top: none !important;
}
body.theme-midnight .theme-nav a.text-gray-600 { color: rgba(255,255,255,0.55) !important; }
body.theme-midnight .theme-nav a.text-gray-600:hover {
    background: rgba(255,215,0,0.08) !important;
    color: #ffd700 !important;
}
body.theme-midnight .theme-nav-mobile {
    background: #0d0d0d !important;
    border-top: 1px solid rgba(255,215,0,0.15) !important;
}
body.theme-midnight .theme-nav-mobile a.bg-gray-100 {
    background: rgba(255,255,255,0.06) !important;
    color: rgba(255,255,255,0.6) !important;
}
body.theme-midnight .theme-footer {
    background: #040404 !important;
    border-top: 1px solid rgba(255,215,0,0.12) !important;
}
body.theme-midnight .theme-footer p,
body.theme-midnight .theme-footer a,
body.theme-midnight .theme-footer span { color: rgba(255,255,255,0.4) !important; }
body.theme-midnight .theme-footer a:hover { color: #ffd700 !important; }

/* FOREST announcement */
body.theme-forest .theme-announcement {
    font-family: "DM Sans", sans-serif !important;
    letter-spacing: 0.04em;
    background: #1a3a15 !important;
}
body.theme-forest .theme-nav {
    background: transparent !important;
    border-top: none !important;
}
body.theme-forest .theme-nav a.text-gray-600 { color: rgba(255,255,255,0.75) !important; }
body.theme-forest .theme-nav a.text-gray-600:hover {
    background: rgba(255,255,255,0.1) !important;
    color: #a7c957 !important;
}
body.theme-forest .theme-nav-mobile {
    background: #f5edd8 !important;
    border-top: 2px solid #c5d4a8 !important;
}
body.theme-forest .theme-nav-mobile a.bg-gray-100 {
    background: rgba(197,212,168,0.4) !important;
    color: #3d5a1a !important;
}
body.theme-forest .theme-footer {
    background: #1a3a15 !important;
    border-top: none !important;
}
body.theme-forest .theme-footer p,
body.theme-forest .theme-footer a,
body.theme-forest .theme-footer span { color: rgba(242,232,207,0.65) !important; }
body.theme-forest .theme-footer a:hover { color: #c5d4a8 !important; }

/* OCEAN announcement */
body.theme-ocean .theme-announcement {
    font-family: "DM Sans", sans-serif !important;
    letter-spacing: 0.06em;
    background: #012a4a !important;
}
body.theme-ocean .theme-nav {
    background: transparent !important;
    border-top: none !important;
}
body.theme-ocean .theme-nav a.text-gray-600 { color: #34678c !important; font-weight: 500; }
body.theme-ocean .theme-nav a.text-gray-600:hover {
    background: rgba(0,95,153,0.08) !important;
    color: #005f99 !important;
}
body.theme-ocean .theme-nav-mobile {
    background: #f8fbfe !important;
    border-top: 1px solid rgba(0,95,153,0.12) !important;
}
body.theme-ocean .theme-nav-mobile a.bg-gray-100 {
    background: rgba(0,95,153,0.07) !important;
    color: #34678c !important;
}
body.theme-ocean .theme-footer {
    background: #012a4a !important;
    border-top: none !important;
}
body.theme-ocean .theme-footer p,
body.theme-ocean .theme-footer a,
body.theme-ocean .theme-footer span { color: rgba(202,240,248,0.55) !important; }
body.theme-ocean .theme-footer a:hover { color: #00b4d8 !important; }

/* SUNSET announcement */
body.theme-sunset .theme-announcement {
    font-family: "Syne", sans-serif !important;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    font-size: 0.72rem !important;
    background: linear-gradient(90deg, #ff6b35, #e85d26, #ff6b35) !important;
}
body.theme-sunset .theme-nav {
    background: transparent !important;
    border-top: none !important;
}
body.theme-sunset .theme-nav a.text-gray-600 { color: #7a4522 !important; font-weight: 600; }
body.theme-sunset .theme-nav a.text-gray-600:hover {
    background: rgba(255,107,53,0.1) !important;
    color: #ff6b35 !important;
}
body.theme-sunset .theme-nav-mobile {
    background: #fffbf5 !important;
    border-top: 1px solid #fad5b0 !important;
}
body.theme-sunset .theme-nav-mobile a.bg-gray-100 {
    background: rgba(255,213,176,0.5) !important;
    color: #7a4522 !important;
}
body.theme-sunset .theme-footer {
    background: linear-gradient(180deg, #fff8ef, #fff3e5) !important;
    border-top: 2px solid #fad5b0 !important;
}
body.theme-sunset .theme-footer p,
body.theme-sunset .theme-footer a,
body.theme-sunset .theme-footer span { color: #9a5a2a !important; }
body.theme-sunset .theme-footer a:hover { color: #ff6b35 !important; }

/* Cart badge: theme primary color */
body[class*="theme-"] .cart-badge {
    background-color: var(--t-primary) !important;
}


/* ============================================================
   LAYOUT v2.1 — Nav links + search flyout per-theme
   ============================================================ */

/* ── Default nav link style ─────────────────────────────────── */
.nav-link {
    color: #6b7280;
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    border-bottom: 2px solid transparent;
    transition: color 0.2s ease;
}
.nav-link:hover { color: #111827; background: transparent; }
.nav-link-active { color: #111827; border-bottom-color: var(--color-primary, #3B82F6); }

/* ── BLOSSOM — Maison Rose (editorial feminine) ─────────────── */
body.theme-blossom .theme-nav { background: transparent !important; border-top: none !important; }
body.theme-blossom .nav-link {
    color: #9c3065 !important;
    font-family: "DM Serif Display", serif !important;
    font-size: 1rem !important;
    font-weight: 400 !important;
    font-style: italic;
    letter-spacing: 0.01em;
    text-transform: none;
    border-bottom-width: 1px;
}
body.theme-blossom .nav-link:hover { color: var(--t-primary) !important; background: transparent; }
body.theme-blossom .nav-link-active { border-bottom-color: var(--t-primary) !important; color: var(--t-primary) !important; }
body.theme-blossom .theme-search-flyout {
    background: #fff;
    border: 1px solid #f8bbd0;
    box-shadow: 0 20px 60px rgba(194,24,91,0.1);
}
body.theme-blossom .theme-search-flyout input {
    font-family: "DM Serif Display", serif;
    font-style: italic;
    font-size: 1.1rem;
    color: #2d0018;
}

/* ── MIDNIGHT — Noir Prestige (dark luxury) ─────────────────── */
body.theme-midnight .theme-nav { background: transparent !important; border-top: none !important; }
body.theme-midnight .nav-link {
    color: rgba(255,255,255,0.3) !important;
    font-family: "Cinzel", serif !important;
    font-size: 0.72rem !important;
    font-weight: 400 !important;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    border-bottom-color: transparent;
    transition: color 0.25s ease;
}
body.theme-midnight .nav-link:hover { color: #ffd700 !important; background: transparent; }
body.theme-midnight .nav-link-active { border-bottom-color: rgba(255,215,0,0.7) !important; color: #ffd700 !important; }
body.theme-midnight .theme-search-flyout {
    background: #07070f;
    border: 1px solid rgba(255,215,0,0.12);
    box-shadow: 0 24px 80px rgba(0,0,0,0.7);
}
body.theme-midnight .theme-search-flyout input {
    color: #ede8e3;
    font-family: "Crimson Pro", serif;
    font-size: 1.15rem;
}
body.theme-midnight .theme-search-flyout input::placeholder { color: #383848; }

/* ── FOREST — Heritage Guild (literary artisan) ─────────────── */
body.theme-forest .theme-nav { background: transparent !important; border-top: none !important; }
body.theme-forest .nav-link {
    color: rgba(255,255,255,0.82) !important;
    font-family: "Cormorant Garamond", serif !important;
    font-size: 1.05rem !important;
    font-weight: 600 !important;
    font-style: italic;
    letter-spacing: 0.02em;
    text-transform: none;
    border-bottom-width: 1px;
    transition: color 0.2s ease;
}
body.theme-forest .nav-link:hover { color: #ffffff !important; background: transparent; }
body.theme-forest .nav-link-active { border-bottom-color: #a7c957 !important; color: #a7c957 !important; }
body.theme-forest .theme-search-flyout {
    background: #fafaf3;
    border: 1.5px solid #c5d4a8;
    box-shadow: 0 20px 50px rgba(26,58,21,0.18);
}
body.theme-forest .theme-search-flyout input { font-family: "DM Sans", sans-serif; color: #1a2b1c; }

/* ── OCEAN — Nordic Precision (scientific minimal) ───────────── */
body.theme-ocean .theme-nav { background: transparent !important; border-top: none !important; }
body.theme-ocean .nav-link {
    color: #6fa8c8 !important;
    font-family: "DM Sans", sans-serif !important;
    font-size: 0.7rem !important;
    font-weight: 600 !important;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    transition: color 0.2s ease;
}
body.theme-ocean .nav-link:hover { color: #005f99 !important; background: transparent; }
body.theme-ocean .nav-link-active { border-bottom-color: #005f99 !important; color: #005f99 !important; }
body.theme-ocean .theme-search-flyout {
    background: #fff;
    border: 1.5px solid #cae9ff;
    box-shadow: 0 16px 40px rgba(0,95,153,0.08);
}
body.theme-ocean .theme-search-flyout input { font-family: "DM Sans", sans-serif; color: #012a4a; }

/* ── SUNSET — Golden Horizon (warm bold energy) ─────────────── */
body.theme-sunset .theme-nav { background: transparent !important; border-top: none !important; }
body.theme-sunset .nav-link {
    color: #b07840 !important;
    font-family: "Syne", sans-serif !important;
    font-size: 0.7rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    transition: color 0.2s ease;
}
body.theme-sunset .nav-link:hover { color: #e85d26 !important; background: transparent; }
body.theme-sunset .nav-link-active { border-bottom-color: #ff6b35 !important; color: #e85d26 !important; }
body.theme-sunset .theme-search-flyout {
    background: #fffbf5;
    border: 1.5px solid #fad5b0;
    box-shadow: 0 16px 40px rgba(232,82,26,0.09);
}
body.theme-sunset .theme-search-flyout input { font-family: "Syne", sans-serif; color: #3d1a08; }

/* ══════════════════════════════════════════════════════════════
   SABLE — Warm Editorial (CHAGEE-inspired premium tea brand)
   Off-white parchment · dark espresso text · Playfair + DM Sans
   ══════════════════════════════════════════════════════════════ */

/* ── SABLE Base ──────────────────────────────────────────────── */
body.theme-sable {
    background-color: #f8f4ef;
    color: #1e1610;
    font-family: "DM Sans", sans-serif;
    --color-primary:   #3d2314;
    --color-secondary: #5c3826;
}

/* ── SABLE Header ────────────────────────────────────────────── */
body.theme-sable header,
body.theme-sable header.theme-header,
body.theme-sable header.bg-white {
    background-color: #f0ebe3 !important;
    box-shadow: 0 1px 0 rgba(61,35,20,0.12), 0 4px 24px rgba(61,35,20,0.06) !important;
    position: relative;
}
body.theme-sable header::after {
    content: '';
    position: absolute;
    bottom: 0; left: 0; right: 0; height: 1px;
    background: linear-gradient(90deg, transparent 0%, rgba(61,35,20,0.18) 30%, rgba(61,35,20,0.18) 70%, transparent 100%);
    pointer-events: none;
}

/* ── SABLE Logo row text ─────────────────────────────────────── */
body.theme-sable .theme-store-name {
    font-family: "Playfair Display", serif;
    font-size: 1.6rem;
    font-weight: 700;
    color: #1e1610;
    letter-spacing: 0.04em;
}

/* ── SABLE Nav ───────────────────────────────────────────────── */
body.theme-sable .theme-nav { background: transparent !important; border-top: none !important; }
body.theme-sable .nav-link {
    color: #7a5c48 !important;
    font-family: "DM Sans", sans-serif !important;
    font-size: 0.85rem !important;
    font-weight: 600 !important;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    transition: color 0.2s ease;
}
body.theme-sable .nav-link:hover { color: #1e1610 !important; background: transparent; }
body.theme-sable .nav-link-active,
body.theme-sable .nav-link-active[style],
body.theme-sable .nav-link[style] { color: #3d2314 !important; border-bottom-color: #3d2314 !important; }

/* ── SABLE Buttons ───────────────────────────────────────────── */
body.theme-sable .btn-primary,
body.theme-sable .theme-btn-primary,
body.theme-sable button[class*="bg-indigo"],
body.theme-sable a[class*="bg-indigo"] {
    background-color: #3d2314 !important;
    color: #f8f4ef !important;
    border: none !important;
    font-family: "DM Sans", sans-serif !important;
    font-weight: 600 !important;
    letter-spacing: 0.06em;
}
body.theme-sable .btn-primary:hover,
body.theme-sable .theme-btn-primary:hover {
    background-color: #5c3826 !important;
}

/* ── SABLE Product cards ─────────────────────────────────────── */
body.theme-sable .theme-card,
body.theme-sable .product-card {
    background: #fdf9f5;
    border: 1px solid rgba(61,35,20,0.1);
    box-shadow: 0 2px 10px rgba(61,35,20,0.05);
}
body.theme-sable .theme-card:hover,
body.theme-sable .product-card:hover {
    box-shadow: 0 8px 28px rgba(61,35,20,0.1);
    border-color: rgba(61,35,20,0.2);
}

/* ── SABLE Price ─────────────────────────────────────────────── */
body.theme-sable .theme-price { color: #3d2314; font-weight: 700; }

/* ── SABLE Cart badge + mobile active pill (inline style override) ── */
body.theme-sable .cart-badge[style] { background-color: #3d2314 !important; color: #f8f4ef !important; }
body.theme-sable .theme-nav-mobile a.text-white[style] { background-color: #3d2314 !important; color: #f8f4ef !important; }

/* ── SABLE Burger / icon buttons ─────────────────────────────── */
body.theme-sable .theme-icon-btn { color: #7a5c48 !important; }
body.theme-sable .theme-icon-btn:hover { color: #1e1610 !important; }

/* ── SABLE Search flyout ─────────────────────────────────────── */
body.theme-sable .theme-search-flyout {
    background: #f0ebe3;
    border: 1px solid rgba(61,35,20,0.15);
    box-shadow: 0 20px 50px rgba(61,35,20,0.12);
}
body.theme-sable .theme-search-flyout input {
    font-family: "DM Sans", sans-serif;
    color: #1e1610;
    background: transparent;
}

/* ══════════════════════════════════════════════════════════════
   STUDIO — Refined White (Interior Lab-inspired design studio)
   White header · deep teal accent · Raleway + DM Sans
   ══════════════════════════════════════════════════════════════ */

/* ── STUDIO Base ─────────────────────────────────────────────── */
body.theme-studio {
    background-color: #f4f8f7;
    color: #1c2e2b;
    font-family: "DM Sans", sans-serif;
    /* Override store primary/secondary so all var(--color-primary) uses pick up theme teal */
    --color-primary:   #2d8c7a;
    --color-secondary: #236e5e;
}

/* ── STUDIO Header ───────────────────────────────────────────── */
body.theme-studio header,
body.theme-studio header.theme-header,
body.theme-studio header.bg-white {
    background-color: #ffffff !important;
    box-shadow: 0 1px 0 rgba(45,140,122,0.15), 0 4px 24px rgba(45,140,122,0.05) !important;
    position: relative;
}
body.theme-studio header::after {
    content: '';
    position: absolute;
    bottom: 0; left: 0; right: 0; height: 2px;
    background: linear-gradient(90deg, transparent 0%, #2d8c7a 30%, #2d8c7a 70%, transparent 100%);
    opacity: 0.25;
    pointer-events: none;
}

/* ── STUDIO Logo row text ────────────────────────────────────── */
body.theme-studio .theme-store-name {
    font-family: "Raleway", sans-serif;
    font-size: 1.5rem;
    font-weight: 700;
    color: #1c2e2b;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

/* ── STUDIO Nav ──────────────────────────────────────────────── */
body.theme-studio .theme-nav { background: transparent !important; border-top: none !important; }
body.theme-studio .nav-link {
    color: #5a8a82 !important;
    font-family: "Raleway", sans-serif !important;
    font-size: 0.68rem !important;
    font-weight: 600 !important;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    transition: color 0.2s ease;
}
body.theme-studio .nav-link:hover { color: #2d8c7a !important; background: transparent; }
body.theme-studio .nav-link-active,
body.theme-studio .nav-link-active[style],
body.theme-studio .nav-link[style] { color: #2d8c7a !important; border-bottom-color: #2d8c7a !important; }

/* ── STUDIO Buttons ──────────────────────────────────────────── */
body.theme-studio .btn-primary,
body.theme-studio .theme-btn-primary,
body.theme-studio button[class*="bg-indigo"],
body.theme-studio a[class*="bg-indigo"] {
    background-color: #2d8c7a !important;
    color: #ffffff !important;
    border: none !important;
    font-family: "Raleway", sans-serif !important;
    font-weight: 600 !important;
    letter-spacing: 0.06em;
}
body.theme-studio .btn-primary:hover,
body.theme-studio .theme-btn-primary:hover {
    background-color: #236e5e !important;
}

/* ── STUDIO Product cards ────────────────────────────────────── */
body.theme-studio .theme-card,
body.theme-studio .product-card {
    background: #ffffff;
    border: 1px solid rgba(45,140,122,0.12);
    box-shadow: 0 2px 10px rgba(45,140,122,0.04);
}
body.theme-studio .theme-card:hover,
body.theme-studio .product-card:hover {
    box-shadow: 0 8px 28px rgba(45,140,122,0.1);
    border-color: rgba(45,140,122,0.25);
}

/* ── STUDIO Price ────────────────────────────────────────────── */
body.theme-studio .theme-price { color: #2d8c7a; font-weight: 700; }

/* ── STUDIO Cart badge + mobile active pill (inline style override) ── */
body.theme-studio .cart-badge[style] { background-color: #2d8c7a !important; }
body.theme-studio .theme-nav-mobile a.text-white[style] { background-color: #2d8c7a !important; }

/* ── STUDIO Burger / icon buttons ────────────────────────────── */
body.theme-studio .theme-icon-btn { color: #5a8a82 !important; }
body.theme-studio .theme-icon-btn:hover { color: #2d8c7a !important; }

/* ── STUDIO Search flyout ────────────────────────────────────── */
body.theme-studio .theme-search-flyout {
    background: #ffffff;
    border: 1.5px solid rgba(45,140,122,0.2);
    box-shadow: 0 16px 40px rgba(45,140,122,0.1);
}
body.theme-studio .theme-search-flyout input {
    font-family: "DM Sans", sans-serif;
    color: #1c2e2b;
}