/* ==========================================================================
   Saraf · dark variant ("espresso"). Enabled with html.sf-dark (?sf=dark / ?sf=light).
   Only tokens and the few places that hard-coded paper. Everything else follows.
   ========================================================================== */
html.sf-dark {
	--sf-paper: #171110;
	--sf-paper-2: #1F1715;
	--sf-paper-3: #2A201C;
	--sf-ink: #F1EAE0;
	--sf-ink-soft: #B7A697;
	--sf-sand: #3A2D27;
	--sf-gold: #C4AE86;
	--sf-gold-soft: #D8C7A4;
	--sf-espresso: #0F0B0A;
	--sf-espresso-2: #1A1311;
	--sf-line: rgba(241,234,224,.14);
	--sf-shadow: 0 30px 60px -28px rgba(0,0,0,.8);
	--sf-shadow-sm: 0 14px 30px -18px rgba(0,0,0,.8);
	--on-ground-line: rgba(241,234,224,.16);
	--on-ground-accent: var(--sf-gold);
	--accent-line: var(--sf-gold);
	--surface: #1F1715; --sf-card: #1F1715;
	--btn-default-bgcolor: #2A201C;
	--btn-default-bgcolor-hover: #3A2D27;
	color-scheme: dark;
}
html.sf-dark [data-tone="paper2"] { --ground: var(--sf-paper-2); --ground-2: var(--sf-paper-3); --surface: var(--sf-paper-3); }
html.sf-dark [data-tone="espresso"] { --ground: var(--sf-paper-2); --ground-2: var(--sf-paper-3); }
/* theme variables that base.css pins to literal ink */
html.sf-dark, html.sf-dark body { --wd-primary-color: #C4AE86; --wd-alternative-color: #F1EAE0; --wd-link-color: #F1EAE0; --wd-link-color-hover: #D8C7A4; --btn-color: #F1EAE0; --btn-color-hover: #D8C7A4; --wd-text-color: #B7A697; --wd-title-color: #F1EAE0; --wd-entities-title-color: #F1EAE0; --wd-entities-title-color-hover: #D8C7A4; --wd-main-bgcolor: #171110; }

/* ground: the lights get warmer, the grain switches to screen so it still reads */
html.sf-dark body::before { background:
	radial-gradient(70% 55% at 88% -5%, rgba(196,174,134,.14), transparent 70%),
	radial-gradient(55% 45% at -8% 70%, rgba(30,140,140,.10), transparent 70%),
	radial-gradient(45% 40% at 60% 110%, rgba(102,12,12,.14), transparent 70%); }
html.sf-dark body::after { mix-blend-mode: screen; opacity: .07; }
html.sf-dark ::selection { background: var(--sf-gold); color: #171110; }

/* header: light logo everywhere, dark glass when sticky */
html.sf-dark .whb-header .site-logo img, html.sf-dark .whb-header.whb-sticked .site-logo img, html.sf-dark body.single-product .whb-header .site-logo img, html.sf-dark body.page-template-default:not(.sf-home) .whb-header .site-logo img { filter: brightness(0) invert(1) opacity(.95) !important; }
html.sf-dark body .whb-header.whb-sticked .whb-general-header, html.sf-dark body .whb-sticked .whb-general-header, html.sf-dark body .whb-general-header.whb-sticked, html.sf-dark body .whb-header.whb-sticked .whb-main-header { background: rgba(23,17,16,.92) !important; box-shadow: 0 1px 0 var(--sf-line), 0 18px 40px -30px rgba(0,0,0,.8); }
html.sf-dark body .whb-header .wd-header-nav > .wd-nav { --nav-color-hover: var(--sf-gold-soft); --nav-color-active: var(--sf-gold-soft); }
html.sf-dark .whb-header .wd-header-cart .wd-cart-number, html.sf-dark .whb-header .wd-tools-count { background: var(--sf-gold) !important; color: #171110 !important; }
html.sf-dark .wd-search-full-screen { background: rgba(23,17,16,.97); }

/* brand gradient becomes a quiet espresso fade; the wine stays in the buttons */
html.sf-dark .phero[data-tone="wine"] > .chapter__bg, html.sf-dark .phero[data-tone="paper2"] > .chapter__bg { background: linear-gradient(180deg, #0F0B0A 0%, #1F1310 40%, var(--sf-paper) 100%) !important; }
html.sf-dark .lp__grad { background: linear-gradient(180deg, #0F0B0A 0%, #241512 45%, var(--sf-paper) 100%); }
html.sf-dark .lp__facts { border-top-color: var(--sf-line); }
html.sf-dark .lp__facts b { color: var(--sf-gold-soft); }
html.sf-dark .lp__bar { background: rgba(23,17,16,.94); }
html.sf-dark body .lp .btn--wine { background: var(--sf-gold-soft) !important; color: #171110 !important; border-color: var(--sf-gold-soft) !important; }
html.sf-dark body .lp .btn--wine:hover { background: #fff !important; }
html.sf-dark .sf-footer::before { opacity: .7; }

/* chapters that painted paper directly */
html.sf-dark .custom__card { background: rgba(23,17,16,.9) !important; border-color: var(--sf-line); }
html.sf-dark .cfg__caption { background: rgba(23,17,16,.9); color: var(--sf-ink); }
html.sf-dark .cfg__caption small { color: var(--sf-ink-soft); }
html.sf-dark .cfg__opt:has(input:checked) { background: var(--sf-ink); color: #171110; }
html.sf-dark .cfg__step legend b { color: #171110; }
html.sf-dark .orbit__pin, html.sf-dark .orbit__stage { background: var(--sf-paper); }
html.sf-dark .orbit__frame { background: #EFE7DC; border-radius: 2px; }
html.sf-dark .orbit__bar { background: rgba(241,234,224,.18); }
html.sf-dark .orbit__bar i { background: var(--sf-gold); }
html.sf-dark .strip__item { color: var(--sf-ink); }
html.sf-dark .band, html.sf-dark .night { background: var(--sf-espresso); }
html.sf-dark .band::before, html.sf-dark .night::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 1px; background: var(--sf-line); z-index: 3; }
html.sf-dark .ig__hover { background: rgba(0,0,0,.45); }
html.sf-dark .sf-footer { background: var(--sf-espresso); }
html.sf-dark .sf-footer__tag, html.sf-dark .sf-footer__hours { color: var(--sf-ink-soft) !important; }

/* shop cards and inputs */
html.sf-dark .wd-product .wd-add-btn .button, html.sf-dark .wd-product .wd-add-btn > a, html.sf-dark .wd-product .sf-inquiry-btn, html.sf-dark .wd-product .add_to_cart_button { border-color: rgba(241,234,224,.5) !important; }
html.sf-dark .wd-product .wd-add-btn .button:hover, html.sf-dark .wd-product .wd-add-btn > a:hover, html.sf-dark .wd-product .sf-inquiry-btn:hover { background: var(--sf-ink) !important; color: #171110 !important; }
html.sf-dark .wd-product .wd-wishlist-btn > a { background: rgba(23,17,16,.85); }
html.sf-dark .woocommerce form .form-row input.input-text, html.sf-dark .woocommerce form .form-row textarea, html.sf-dark .woocommerce form .form-row select, html.sf-dark .form__field input, html.sf-dark .form__field textarea, html.sf-dark .form__field select, html.sf-dark input.input-text, html.sf-dark textarea { background: var(--sf-paper-2) !important; color: var(--sf-ink) !important; border-color: var(--sf-line) !important; }
html.sf-dark ::placeholder { color: var(--sf-ink-soft); opacity: .8; }
html.sf-dark .btn--paper { --bg: var(--sf-ink); --fg: #171110; --bg-h: #fff; --fg-h: #171110; }
html.sf-dark #cookiez-banner, html.sf-dark .cookiez-banner { background: #1F1715 !important; color: var(--sf-ink) !important; }

/* ---------- places that used "paper" to mean light text: pin them light ---------- */
html.sf-dark { --sf-light: #F1EAE0; --sf-wine: #8E1E1E; --sf-wine-deep: #6E1414; }
html.sf-dark .hero--pour .hero__title, html.sf-dark .hero--pour .hero__lead, html.sf-dark .tile, html.sf-dark .ig__hover, html.sf-dark .phero--img .phero__title, html.sf-dark .phero[data-tone="wine"] .phero__title, html.sf-dark .phero[data-tone="paper2"] .phero__title, html.sf-dark .reel__name, html.sf-dark .night, html.sf-dark .night__title, html.sf-dark .band, html.sf-dark .band__line, html.sf-dark .band__cta, html.sf-dark .lp, html.sf-dark .lp__title, html.sf-dark .lp__chips li, html.sf-dark .sf-footer, html.sf-dark .sf-footer li, html.sf-dark .sf-footer li a, html.sf-dark .sf-social__a, html.sf-dark .sf-dock__btn, html.sf-dark .scrollToTop { color: var(--sf-light) !important; }
html.sf-dark .hero--pour .hero__title em, html.sf-dark .hero__title em, html.sf-dark .sf-h2 .elementor-heading-title em { color: var(--sf-gold-soft) !important; }
html.sf-dark body .hero--pour .hero__ctas .btn--sand, html.sf-dark body .btn.btn--paper-ghost { color: var(--sf-light) !important; border-color: rgba(241,234,224,.7) !important; }
html.sf-dark body .hero--pour .hero__ctas .btn--sand:hover { border-color: var(--sf-light) !important; }
html.sf-dark .btn--wine, html.sf-dark .btn--ink { --fg: var(--sf-light); --fg-h: var(--sf-light); }
html.sf-dark .btn { --fg-h: var(--sf-light); }
html.sf-dark .btn--ghost-light { --fg: var(--sf-light); --bg-h: var(--sf-light); --fg-h: #171110; border-color: rgba(241,234,224,.5); }
html.sf-dark body .btn.btn--wine, html.sf-dark body a.btn.btn--wine, html.sf-dark body button.btn.btn--wine, html.sf-dark body .btn.btn--wine:hover, html.sf-dark body .btn-color-primary, html.sf-dark body .button.btn-color-primary, html.sf-dark .single_add_to_cart_button, html.sf-dark .checkout-button, html.sf-dark #place_order, html.sf-dark .woocommerce .button.alt, html.sf-dark .wd-product .product-label.onsale { color: var(--sf-light) !important; }
html.sf-dark body .btn.btn--ink, html.sf-dark body .btn.btn--ghost:hover, html.sf-dark body .btn.btn--sand:hover, html.sf-dark .wd-product .wd-add-btn .button:hover, html.sf-dark .wd-product .sf-inquiry-btn:hover { color: #171110 !important; }
html.sf-dark .wscard:hover .wscard__go { color: #171110; }
html.sf-dark body.sf-dark-top .whb-header:not(.whb-sticked) { --sf-hdr-ink: var(--sf-light); }
html.sf-dark .sf-cursor.is-dark { border-color: var(--sf-light); }
html.sf-dark .sf-dock__count { color: #171110; }
html.sf-dark .sf-lens { border-color: rgba(241,234,224,.3); }
/* landing hero buttons: ghost stays transparent, the gold WhatsApp button gets dark text */
html.sf-dark body .btn.btn--paper-ghost { background: transparent !important; color: var(--sf-light) !important; border-color: rgba(241,234,224,.7) !important; }
html.sf-dark body .btn.btn--paper-ghost:hover { background: var(--sf-light) !important; color: #171110 !important; }
html.sf-dark body .lp .btn.btn--wine, html.sf-dark body .lp .btn.btn--wine:hover, html.sf-dark body .lp__bar .btn { color: #171110 !important; }
