/* ============================================================
   NEOLITHIC — OPT-IN LIGHT THEME
   Applies only under  <html data-theme="light">.  Dark is the
   site default (bare :root) and is untouched by this file.

   Strategy: the storefront is almost entirely --neo-* / Blocksy
   token consumers, so re-pointing the token blocks flips the
   whole site to a warm-parchment light palette taken from the
   /mrkt console (secondary tones darkened for legibility on a
   light ground — see notes inline).

   TYPOGRAPHY IS NOT TOUCHED — Cinzel + Source Serif 4, the type
   scale and the spacing tokens stay exactly as in dark mode.

   The ONLY surfaces kept dark are the ones that are photography
   or video rather than UI: the homepage full-bleed slide deck,
   its slide sections, and the Find Your Mark video experience.
   The bloodline archive keeps ONLY its video-hero text band dark.

   :root[data-theme="light"] (0,2,0) outranks bare :root (0,1,0),
   so token overrides win regardless of stylesheet order; the
   plugin also enqueues this file after blocksy-overrides.css and
   theme-overwrite.css.
   ============================================================ */

:root[data-theme="light"],
html[data-theme="light"] {

    /* ---- core.css design tokens (single source of truth) ----
       gold/sand/muted are a few shades darker than the raw /mrkt
       values: those are used here at 9-11px, weight 300, and often
       at opacity < 1 (fine as a glow on black, too faint on cream). */
    --neo-ground: #f4f1ea;   /* page background      (/mrkt --paper) */
    --neo-panel:  #ffffff;   /* card / panel surface (/mrkt --card)  */
    --neo-line:   #e0d9c6;   /* borders / hairlines                  */
    --neo-gold:   #7a5e15;   /* accent  (darker antique gold, ~5:1)  */
    --neo-gold-soft: rgba(122, 94, 21, 0.34);
    --neo-cream:  #1c1a14;   /* primary text         (/mrkt --ink)   */
    --neo-sand:   #3f3a2c;   /* secondary text (darkened)            */
    --neo-muted:  #5a5443;   /* muted text (darkened, ~5.6:1)        */

    /* --neo-vault-* sub-palette (roles preserved, values swapped) */
    --neo-vault:           #ffffff;
    --neo-vault-soft:      #faf8f2;
    --neo-vault-line:      #e0d9c6;
    --neo-vault-text:      #1c1a14;
    --neo-vault-soft-text: #3f3a2c;
    --neo-vault-muted:     #5a5443;
    --neo-vault-gold:      #7a5e15;

    /* ---- Blocksy / Elementor framework tokens ----
       --e-global-color-blocksy_palette_* and --theme-*-color reference
       these palette vars, so they follow automatically. */
    --theme-palette-color-1: #7a5e15;   /* accent / links        */
    --theme-palette-color-2: #5f4912;   /* accent hover (darker) */
    --theme-palette-color-3: #1c1a14;   /* body text             */
    --theme-palette-color-4: #1c1a14;   /* headings              */
    --theme-palette-color-5: #e0d9c6;   /* borders               */
    --theme-palette-color-6: #1c1a14;   /* (overwrite treats 6-8 as ink) */
    --theme-palette-color-7: #f4f1ea;   /* page ground           */
    --theme-palette-color-8: #ffffff;   /* light surface         */

    --theme-selection-text-color: #f4f1ea;      /* on the gold selection bg */
    --theme-button-text-initial-color: #f4f1ea; /* cream on the gold button (AA) */
    --theme-button-text-hover-color:   #7a5e15; /* gold text, transparent bg on hover */

    /* the two hard-coded Elementor globals from theme-overwrite.css */
    --e-global-color-a0d0582: #7a5e15;   /* button hover background */
    --e-global-color-1da63e0: #f4f1ea;   /* button hover text      */

    /* ---- blog.css names (bare :root, despite the "scoped" comment) ---- */
    --gold:         #7a5e15;
    --site-bg:      #f4f1ea;
    --cream:        #1c1a14;
    --panel-bg:     #ffffff;
    --border-light: #e0d9c6;
    --field-line:   #d6cdb8;
    --label:        #5a5443;
    --muted:        #3f3a2c;

    /* ---- header sub-palette (header-menu.css --neo-h-*) ----
       header goes light on every page except the dark homepage; the
       home override below pins these back to dark for body.home. */
    --neo-h-gold:   #7a5e15;
    --neo-h-cream:  #1c1a14;
    --neo-h-sand:   #3f3a2c;
    --neo-h-ground: #f4f1ea;
    --neo-h-line:   rgba(122, 94, 21, 0.20);
}

/* Global page background. header-scroll.css hard-codes
   `body, html { background:#0a0805 !important }` site-wide — the one literal
   the token flip cannot reach. Override at higher specificity. */
html[data-theme="light"],
html[data-theme="light"] body {
    background: var(--neo-ground) !important;
}

/* Elementor's kit stylesheet re-declares the --theme-* / --e-global-color-*
   tokens on `body.elementor-kit-62`, which is a CLOSER ancestor than :root —
   so the :root block above is shadowed for every element inside <body>
   (this is why grid action <button>s stayed near-white). Re-assert the whole
   framework token set on <body> too. */
html[data-theme="light"] body {
    --theme-palette-color-1: #7a5e15;
    --theme-palette-color-2: #5f4912;
    --theme-palette-color-3: #1c1a14;
    --theme-palette-color-4: #1c1a14;
    --theme-palette-color-5: #e0d9c6;
    --theme-palette-color-6: #1c1a14;
    --theme-palette-color-7: #f4f1ea;
    --theme-palette-color-8: #ffffff;

    --theme-text-color: #1c1a14;
    --theme-headings-color: #1c1a14;
    --theme-link-initial-color: #7a5e15;
    --theme-link-hover-color: #5f4912;
    --theme-border-color: #e0d9c6;
    --theme-button-text-initial-color: #f4f1ea;
    --theme-button-text-hover-color: #7a5e15;

    --e-global-color-primary: #1c1a14;
    --e-global-color-secondary: #3f3a2c;
    --e-global-color-text: #1c1a14;
    --e-global-color-accent: #7a5e15;
    --e-global-color-blocksy_palette_1: #7a5e15;
    --e-global-color-blocksy_palette_2: #5f4912;
    --e-global-color-blocksy_palette_3: #1c1a14;
    --e-global-color-blocksy_palette_4: #1c1a14;
    --e-global-color-blocksy_palette_5: #e0d9c6;
    --e-global-color-blocksy_palette_6: #1c1a14;
    --e-global-color-blocksy_palette_7: #f4f1ea;
    --e-global-color-blocksy_palette_8: #ffffff;
    --e-global-color-a0d0582: #7a5e15;   /* button / button-hover background */
    --e-global-color-1da63e0: #f4f1ea;   /* button hover text */
}

/* Woo cart/checkout hard-code the dark gold on form controls. */
:root[data-theme="light"] body.woocommerce-checkout input[type="radio"],
:root[data-theme="light"] body.woocommerce-checkout input[type="checkbox"],
:root[data-theme="light"] body.woocommerce-cart input[type="radio"],
:root[data-theme="light"] body.woocommerce-cart input[type="checkbox"] {
    accent-color: #7a5e15;
}

/* ============================================================
   HEADER — light bar + dark nav on every page once the bar is
   solid (scrolled / hovered / mega open). The ONLY time it keeps
   its dark styling is while it is still transparent AND sitting
   over a full-bleed media hero — the homepage slide deck, the
   Origin page, the bloodline archives, Find Your Mark — where
   cream nav is the only thing legible on the image.
   header-scroll.css / header-menu.css hard-code the solid states
   to rgba(10,8,5,…) !important, so we override each with a light
   counterpart.
   ============================================================ */

/* Homepage: fully cinematic, header never gets a solid state — keep it dark. */
html[data-theme="light"] body.home {
    --neo-h-gold:   #c9a84c;
    --neo-h-cream:  #f5f0e8;
    --neo-h-sand:   #ddd5c0;
    --neo-h-ground: #0a0805;
    --neo-h-line:   rgba(201, 168, 76, 0.14);
}

/* Other media-hero pages: cream nav ONLY while the bar is transparent over
   the hero; once it goes solid it inherits the light --neo-h-* from :root. */
html[data-theme="light"] body:has(.neo-origin-page) .neo-header:not(.is-scrolled):not(.neo-mega-open):not(:hover),
html[data-theme="light"] body:has(.neo-plp) .neo-header:not(.is-scrolled):not(.neo-mega-open):not(:hover),
html[data-theme="light"] body:has(.neo-fym) .neo-header:not(.is-scrolled):not(.neo-mega-open):not(:hover) {
    --neo-h-gold:   #c9a84c;
    --neo-h-cream:  #f5f0e8;
    --neo-h-sand:   #ddd5c0;
    --neo-h-ground: #0a0805;
    --neo-h-line:   rgba(201, 168, 76, 0.14);
}

/* Light solid-header states — every page except the homepage. */
html[data-theme="light"] body:not(.home) .neo-header.is-scrolled,
html[data-theme="light"] body:not(.home) .neo-header:hover,
html[data-theme="light"] body:not(.home) .neo-header.neo-mega-open {
    background: rgba(244, 241, 234, 0.95) !important;
    border-bottom-color: rgba(122, 94, 21, 0.18) !important;
}
html[data-theme="light"] body:not(.home) .neo-header .elementor-nav-menu--main > .elementor-nav-menu > li.menu-item-has-children > ul.sub-menu,
html[data-theme="light"] body:not(.home) .neo-header .elementor-nav-menu--main .elementor-nav-menu--dropdown {
    background: rgba(244, 241, 234, 0.98) !important;
    border-bottom-color: rgba(122, 94, 21, 0.18) !important;
}
html[data-theme="light"] body:not(.home) .neo-mobile-overlay {
    background: #f4f1ea !important;
    background: rgba(244, 241, 234, 0.97) !important;
}
/* Mega-menu image box + its "Carry the bloodline" caption CTA. Something
   (a Code Snippet / the Elementor header template) paints the caption bar
   #0a0805; the image box is hard-coded to #0a0805 in header-menu.css.
   Clear both in the light theme. */
html[data-theme="light"] .neo-mega-media__inner {
    background: #ffffff !important;
    border-color: rgba(122, 94, 21, 0.20) !important;
}
html[data-theme="light"] .neo-mega-cap,
html[data-theme="light"] li.neo-mega-media .neo-mega-cap,
html[data-theme="light"] .neo-header .neo-mega-cap {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    color: var(--neo-h-gold) !important;
}
html[data-theme="light"] .neo-mega-cap:hover {
    color: var(--neo-h-sand) !important;
}

/* Elementor marks the current page's menu item with a dark background —
   invisible on the dark theme, an ugly slab on the light dropdown. Clear it. */
html[data-theme="light"] .neo-header .elementor-nav-menu--main a.elementor-item-active,
html[data-theme="light"] .neo-header .elementor-nav-menu--main a.elementor-sub-item.elementor-item-active,
html[data-theme="light"] .neo-header .elementor-nav-menu--dropdown a.elementor-item-active {
    background-color: transparent !important;
}

/* ============================================================
   KEEP DARK — surfaces that are photo / video, or text sitting
   on top of them: the light palette is never applied here.
   Homepage slide deck + its sections, Find Your Mark, the Origin
   page (captions over the bg video), the WHOLE bloodline archive
   (`.neo-plp` — looping videos with dark scrims that must read
   the same as in dark mode), product-image lock badges, and the
   PDP image zoom hint + full-screen lightbox.
   ============================================================ */
html[data-theme="light"] body.home,
html[data-theme="light"] .neo-slides,
html[data-theme="light"] .neo-slide,
html[data-theme="light"] .neo-origin,
html[data-theme="light"] .neo-origin-page,
html[data-theme="light"] .neo-bloodline,
html[data-theme="light"] .neo-series,
html[data-theme="light"] .neo-piece,
html[data-theme="light"] .neo-threshold,
html[data-theme="light"] .neo-plp,
html[data-theme="light"] .neo-fym,
html[data-theme="light"] .neo-fym-pop,
html[data-theme="light"] .neo-fym-notify,
html[data-theme="light"] .neo-shop-piece__lock,
html[data-theme="light"] .neo-pdp-gallery__zoom-hint,
html[data-theme="light"] .neo-pdp-lightbox,
html[data-theme="light"] .neo-dark,
html[data-theme="light"] .neo-fullbleed.neo-dark {
    --neo-ground: #0a0805;
    --neo-panel:  #14110a;
    --neo-line:   #2a2618;
    --neo-gold:   #c9a84c;
    --neo-gold-soft: rgba(201, 168, 76, 0.4);
    --neo-cream:  #f5f0e8;
    --neo-sand:   #ddd5c0;
    --neo-muted:  #8f8a78;

    --neo-vault:           #1f1a14;
    --neo-vault-soft:      #2a2418;
    --neo-vault-line:      #3d3324;
    --neo-vault-text:      #f5f0e8;
    --neo-vault-soft-text: #c8bea8;
    --neo-vault-muted:     #8a8170;
    --neo-vault-gold:      #d4a843;

    --gold:         #c9a84c;
    --site-bg:      #171409;
    --cream:        #f5f0e8;
    --panel-bg:     #111009;
    --border-light: #1e1c14;
    --field-line:   #2a2718;
    --label:        #8a8576;
    --muted:        #b0b0b0;
}

/* Homepage: nothing behind the fixed slides should flash light.
   The footer is itself a `.neo-slide` — exclude it so it can go light. */
html[data-theme="light"]:has(body.home),
html[data-theme="light"] body.home,
html[data-theme="light"] body.home .neo-slide:not(.neo-footer) {
    background: #0a0805 !important;
}

/* ============================================================
   CHROME STAYS LIGHT — even on the dark homepage.
   The footer slide, the Grug/Oracle drawer and the cart drawer
   are UI panels, not part of the cinematic deck. They live inside
   body.home / .neo-slide / .neo-header, so they inherit the dark
   pin — re-assert the light palette directly on each. (No-op on
   document pages, where they are already light.)
   ============================================================ */
html[data-theme="light"] .neo-footer,
html[data-theme="light"] .neo-oracle,
html[data-theme="light"] .neo-oracle-trigger,
html[data-theme="light"] .neo-oracle-hint,
html[data-theme="light"] .elementor-menu-cart__container,
html[data-theme="light"] .elementor-menu-cart__main {
    --neo-ground: #f4f1ea;
    --neo-panel:  #ffffff;
    --neo-line:   #e0d9c6;
    --neo-gold:   #7a5e15;
    --neo-gold-soft: rgba(122, 94, 21, 0.34);
    --neo-cream:  #1c1a14;
    --neo-sand:   #3f3a2c;
    --neo-muted:  #5a5443;

    --neo-vault:           #ffffff;
    --neo-vault-soft:      #faf8f2;
    --neo-vault-line:      #e0d9c6;
    --neo-vault-text:      #1c1a14;
    --neo-vault-soft-text: #3f3a2c;
    --neo-vault-muted:     #5a5443;
    --neo-vault-gold:      #7a5e15;

    --gold:         #7a5e15;
    --site-bg:      #f4f1ea;
    --cream:        #1c1a14;
    --panel-bg:     #ffffff;
    --border-light: #e0d9c6;
    --field-line:   #d6cdb8;
    --label:        #5a5443;
    --muted:        #3f3a2c;
}
html[data-theme="light"] .neo-oracle__drawer,
html[data-theme="light"] .elementor-menu-cart__main,
html[data-theme="light"] .neo-footer {
    background: var(--neo-panel) !important;
}

/* Homepage header: transparent bar + cream nav at rest (same as the bloodline
   PLP). Home has no scroll, so :hover / mega-open is what turns it into a
   light bar with dark nav. The rest-state cream --neo-h-* comes from the
   `body.home` block higher up; base transparency from header-scroll.css. */
html[data-theme="light"] body.home .neo-header:hover,
html[data-theme="light"] body.home .neo-header.is-scrolled,
html[data-theme="light"] body.home .neo-header.neo-mega-open,
/* Footer is the active slide → it's a light UI panel, not photo/video, so the
   header switches to the light bar while it's on screen (reverts on the way
   back up to a dark slide). slide-controller.js sets `.is-active`. */
html[data-theme="light"] body.home:has(.neo-slide.neo-footer.is-active) .neo-header {
    --neo-h-gold:   #7a5e15;
    --neo-h-cream:  #1c1a14;
    --neo-h-sand:   #3f3a2c;
    --neo-h-ground: #f4f1ea;
    --neo-h-line:   rgba(122, 94, 21, 0.20);
    background: rgba(244, 241, 234, 0.97) !important;
    border-bottom: 1px solid rgba(122, 94, 21, 0.18) !important;
}
html[data-theme="light"] body.home .neo-header .elementor-nav-menu--main > .elementor-nav-menu > li.menu-item-has-children > ul.sub-menu,
html[data-theme="light"] body.home .neo-header .elementor-nav-menu--main .elementor-nav-menu--dropdown {
    background: rgba(244, 241, 234, 0.98) !important;
}
html[data-theme="light"] body.home .neo-mobile-overlay {
    background: rgba(244, 241, 234, 0.97) !important;
}
/* The Elementor header template (post-8679.css) pins the nav links + icons to
   #f5f0e8; the --neo-h-* token flip does not reach them. Force ink colour for
   the light-bar states. */
html[data-theme="light"] body.home .neo-header:hover .elementor-nav-menu--main .elementor-nav-menu .elementor-item,
html[data-theme="light"] body.home .neo-header.neo-mega-open .elementor-nav-menu--main .elementor-nav-menu .elementor-item,
html[data-theme="light"] body.home:has(.neo-slide.neo-footer.is-active) .neo-header .elementor-nav-menu--main .elementor-nav-menu .elementor-item {
    color: #1c1a14 !important;
}
html[data-theme="light"] body.home .neo-header:hover .elementor-nav-menu--main .elementor-nav-menu .elementor-item:hover,
html[data-theme="light"] body.home .neo-header.neo-mega-open .elementor-nav-menu--main .elementor-nav-menu .elementor-item:hover,
html[data-theme="light"] body.home:has(.neo-slide.neo-footer.is-active) .neo-header .elementor-nav-menu--main .elementor-nav-menu .elementor-item:hover {
    color: #7a5e15 !important;
}
html[data-theme="light"] body.home .neo-header:hover .elementor-widget-icon .elementor-icon,
html[data-theme="light"] body.home .neo-header:hover .elementor-menu-cart__toggle .elementor-button-icon,
html[data-theme="light"] body.home .neo-header.neo-mega-open .elementor-widget-icon .elementor-icon,
html[data-theme="light"] body.home .neo-header.neo-mega-open .elementor-menu-cart__toggle .elementor-button-icon,
html[data-theme="light"] body.home:has(.neo-slide.neo-footer.is-active) .neo-header .elementor-widget-icon .elementor-icon,
html[data-theme="light"] body.home:has(.neo-slide.neo-footer.is-active) .neo-header .elementor-menu-cart__toggle .elementor-button-icon {
    color: #1c1a14 !important;
    fill: #1c1a14 !important;
}

/* ============================================================
   READABILITY — micro-labels that carry opacity < 1 in source
   (fine as a glow on black, too faint on cream). Restore full
   opacity on the light "document" surfaces.
   ============================================================ */
html[data-theme="light"] .neo-shop-piece__bloodline,
html[data-theme="light"] .neo-pdp-trust-line__item,
html[data-theme="light"] .neo-pdp-trust-line__dot,
html[data-theme="light"] .neo-pdp-breadcrumb {
    opacity: 1 !important;
}

/* Footer: one hard-coded translucent-cream hairline that vanishes on light. */
html[data-theme="light"] .neo-footer__base {
    border-top-color: var(--neo-line) !important;
}

/* Size-guide modal diagram: the default sizechart001 is a white-line drawing
   for the dark theme (invisible on the light modal). Swap in the black-line
   version. `content:url()` replaces the rendered image on the <img>. */
html[data-theme="light"] .neo-pdp-sizechart-img {
    content: url("/wp-content/uploads/2026/07/sizechart_light.png");
}

/* Grid action icons (Quick View / Wishlist / Cart) are <button>s, so the
   Elementor kit rule `.elementor-kit-62 button { color: var(--e-global-…) }`
   (specificity 0,2,0) beats `.neo-shop-action`. Restore the ink colour and
   keep hover / active gold. Covers the /shop grid, the bloodline PLP grid
   and the My Wishlist tab (same markup). */
html[data-theme="light"] .neo-shop-action,
html[data-theme="light"] .neo-plp-piece__action,
html[data-theme="light"] .neo-wishlist__action {
    color: var(--neo-cream) !important;
}
html[data-theme="light"] .neo-shop-action:hover,
html[data-theme="light"] .neo-shop-action:focus-visible,
html[data-theme="light"] .neo-shop-action--wishlist.is-active,
html[data-theme="light"] .neo-plp-piece__action:hover,
html[data-theme="light"] .neo-wishlist__action:hover {
    color: var(--neo-gold) !important;
}
html[data-theme="light"] .neo-shop-action svg,
html[data-theme="light"] .neo-shop-action svg *,
html[data-theme="light"] .neo-plp-piece__action svg,
html[data-theme="light"] .neo-plp-piece__action svg *,
html[data-theme="light"] .neo-wishlist__action svg,
html[data-theme="light"] .neo-wishlist__action svg * {
    stroke: currentColor !important;
}
html[data-theme="light"] .neo-shop-action--wishlist.is-active svg,
html[data-theme="light"] .neo-shop-action--wishlist.is-active svg * {
    fill: currentColor !important;
}
