/* =========================================================
   White mode — monochrome (no blue).
   Rule: paper page, ink content. Loaded after theme-light.css. The blue accent tokens
   are remapped to ink, so every selection state, link and focus ring turns ink, and
   primary actions become ink pills with light text.
   ========================================================= */

html[data-theme="light"] {
    /* Soft paper palette: a barely-warm off-white (chroma ≤ 0.009, hue ~80) instead of pure white,
       so large areas don't glare. Cards sit one step lighter than the page, insets one step darker.
       Ink is a deep near-black (17:1) and muted a heavy grey (9.2:1) against the page.
       theme-light.css's blue-hued tokens are replaced. */
    --theme-paper: oklch(94.6% 0.0045 80);
    --theme-surface: oklch(97.4% 0.0035 80);
    --theme-surface-2: oklch(91.8% 0.0055 80);
    --theme-ink: oklch(13% 0.004 70);
    --theme-muted: oklch(36% 0.008 75);
    --theme-line: oklch(86% 0.007 80);
    --theme-line-strong: oklch(73% 0.009 80);
    --theme-shadow: 0 18px 48px rgba(46, 36, 22, 0.09);
    --theme-blue: oklch(13% 0.004 70);
    --theme-blue-dark: oklch(8% 0.003 70);
    --theme-blue-soft: oklch(91% 0.006 80);
    /* Shared action fill (primary buttons, chat bubble) — used by the page-level light sheets too.
       Text stays ink; anything you press is blue (#1d4ed8, white label 6.7:1). */
    --mono-ink-bg: linear-gradient(180deg, #2563eb 0%, #1d4ed8 100%);
    --mono-ink-bg-hover: linear-gradient(180deg, #1d4ed8 0%, #1e40af 100%);
    --mono-ink-shadow: 0 8px 20px rgba(29, 78, 216, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.16);
}

/* Hard-coded blues that bypass the tokens */
html[data-theme="light"] body.home-bw-theme {
    --accent-light: oklch(40% 0 0);
    --accent-rgb: 20, 33, 61;
}

html[data-theme="light"] body.home-bw-theme #lc-widget {
    --lc-accent-light: oklch(40% 0 0);
}

html[data-theme="light"] .mkt { --mkt-glow: rgba(0, 0, 0, 0.06); }
html[data-theme="light"] .sv { --sv-glow: rgba(0, 0, 0, 0.06); }

html[data-theme="light"] body.home-bw-theme .dash-platform-wrap--desktop .pill-btn.is-active,
html[data-theme="light"] body.home-bw-theme .dash-platform-wrap--mobile .pill-btn.is-active,
html[data-theme="light"] body.home-bw-theme .pill-btn.is-active,
html[data-theme="light"] body.home-bw-theme .dash-view-btn.active {
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.22) !important;
}

/* Home platforms (phone): the open pass is the black metal card, white CTA inside */
@media (max-width: 767px) {
    html[data-theme="light"] .hmw {
        --hmw-glow: rgba(0, 0, 0, 0.05);
        --hmw-open-bg: repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.025) 0 1px, transparent 1px 3px), linear-gradient(135deg, #1d1d20 0%, #4a4a51 38%, #18181b 58%, #5e5e66 100%);
        --hmw-open-line: rgba(255, 255, 255, 0.22); --hmw-open-fg: #fff; --hmw-open-muted: rgba(255, 255, 255, 0.62); --hmw-open-dash: rgba(255, 255, 255, 0.28);
        --hmw-cta-bg: #fff; --hmw-cta-fg: #0a0a0a; --hmw-cta-ico-bg: #0a0a0a; --hmw-cta-ico-fg: #fff;
        --hmw-focus: var(--theme-ink);
    }
}

/* ---------- Primary actions → blue pill (--mono-ink-bg), white text ----------
   .ink-cta tags utility-class buttons (cart, mobile menu, phone home) that are primary actions too.
   Same selector shape as theme-light.css's "primary blue action" rule so this one,
   loaded later at equal specificity, takes over. */
html[data-theme="light"] body.home-bw-theme :is(
    .hero-btn-primary,
    .feat-card-buy,
    .home-cta__button,
    .dash-product-buy,
    .dash-compact-buy,
    .dash-add-all-btn,
    .pay-submit,
    .sc-btn--buy,
    .sc-btn--support,
    .terms-cta__btn,
    .ink-cta,
    #lc-toggle,
    #lc-start-form button[type="submit"],
    #lc-send
) {
    color: #fff !important;
    background: var(--mono-ink-bg) !important;
    border-color: var(--theme-ink) !important;
    box-shadow: var(--mono-ink-shadow) !important;
}

html[data-theme="light"] body.home-bw-theme :is(
    .hero-btn-primary,
    .feat-card-buy,
    .home-cta__button,
    .dash-product-buy,
    .dash-compact-buy,
    .dash-add-all-btn,
    .pay-submit,
    .sc-btn--buy,
    .sc-btn--support,
    .terms-cta__btn,
    .ink-cta,
    #lc-toggle,
    #lc-start-form button[type="submit"],
    #lc-send
) :is(i, span:not(.lc-badge), svg) {
    color: #fff !important;
}

html[data-theme="light"] body.home-bw-theme :is(
    .hero-btn-primary,
    .feat-card-buy,
    .home-cta__button,
    .dash-product-buy,
    .dash-compact-buy,
    .dash-add-all-btn,
    .pay-submit:not(:disabled),
    .sc-btn--buy,
    .sc-btn--support,
    .terms-cta__btn,
    .ink-cta,
    #lc-toggle,
    #lc-start-form button[type="submit"],
    #lc-send
):hover {
    color: #fff !important;
    background: var(--mono-ink-bg-hover) !important;
}

html[data-theme="light"] body.home-bw-theme .pay-submit:disabled {
    opacity: 0.45;
    box-shadow: none !important;
}

/* Mobile "More" sheet: Telegram button */
html[data-theme="light"] body.home-bw-theme #navbar #mobile-menu .bg-accent,
html[data-theme="light"] body.home-bw-theme #navbar #mobile-menu .bg-accent:hover {
    color: #fff !important;
    background: var(--mono-ink-bg) !important;
    box-shadow: var(--mono-ink-shadow) !important;
}

html[data-theme="light"] body.home-bw-theme .nav-icon-plate {
    background: var(--theme-surface);
    border-color: var(--theme-line);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
}

/* Phone "More" sheet uses the same icon plates */
html[data-theme="light"] body.home-bw-theme #mobile-menu .nav-icon-plate svg {
    color: var(--theme-ink);
}

/* Terms sidebar card header ("Key protections · N sections") — white-on-white without this */
html[data-theme="light"] body.home-bw-theme #termsPage .terms-overview__head {
    border-bottom-color: var(--theme-line);
}

html[data-theme="light"] body.home-bw-theme #termsPage .terms-overview__title {
    color: var(--theme-muted);
}

html[data-theme="light"] body.home-bw-theme #termsPage .terms-overview__count {
    color: var(--theme-muted);
    border-color: var(--theme-line);
    background: var(--theme-surface-2);
}

/* Footer Telegram icon uses the brand blue — black like every other icon on the white page */
html[data-theme="light"] body.home-bw-theme footer .fa-telegram {
    color: var(--theme-ink) !important;
}

/* Phone marketplace results bar: theme-light.css boxes it in a square bordered card inside the
   rounded filter shell; like the dark theme it is an open row, separated by a hairline. */
html[data-theme="light"] body.home-bw-theme .dash-mobile-bar {
    background: transparent !important;
    border: 0 !important;
    border-top: 1px solid var(--theme-line) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}