/* AllArounder — Night (V2 "לילה") blog override.
   Loaded AFTER each post's own inline <style>, and AFTER /assets/css/style.css
   (which provides the v6-nav + v6-footer chrome). It flips the token-driven
   Olive-Branch LIGHT palette to the v6 Night palette, then rescues the cases a pure
   token-flip can't fix: hardcoded colors that bypass tokens, and the dual-use tokens
   --forest (dark TEXT *and* dark panel BG) and --cream (light panel BG *and* light TEXT).
   Article PROSE is never touched in the HTML — only its skin. */

/* ── 1. token flip (wins: declared after the post's own :root) ── */
:root{
  /* accents */
  --olive:#C8A96E; --sage:#7A9E6C; --sage-text:#CDC6B7;
  --light-sage:#E2C488; --lsage:#E2C488;
  /* text tokens (were dark) → cream */
  --forest:#F5F0E8; --dark:#F5F0E8; --dark-olive:#F5F0E8; --ink:#F5F0E8;
  --muted:rgba(245,240,232,.58);
  /* surfaces */
  --white:#1e2d1a;   /* page background */
  --cream:#253220;   /* panel background (was light cream) */
  --border:#344530;
  --shadow:0 18px 44px -22px rgba(0,0,0,.7);
  --font:'Rubik','Assistant',sans-serif;
}

/* ── 2. base ── */
body{background:#1e2d1a;color:#F5F0E8;font-family:'Rubik','Assistant',sans-serif;}
/* the blog ships no reveal-on-scroll JS; style.css's .reveal{opacity:0} would hide
   blog content, so force it visible */
.reveal{opacity:1!important;transform:none!important;}

/* ── 3. prose body: rescue hardcoded dark text (e.g. .article-body{color:#2A3020}) ── */
.article-body,.post-body,.content-wrap{color:rgba(245,240,232,.86)!important;}
.article-body p,.post-body p,.article-body li,.post-body li{color:rgba(245,240,232,.85);}
.article-body h2,.article-body h3,.article-body h4,
.post-body h2,.post-body h3,.post-body h4{color:#F5F0E8!important;}
.article-body strong,.post-body strong{color:#F5F0E8!important;}
.article-body em,.post-body em{color:#E2C488!important;}
.article-body a,.post-body a{color:#C8A96E;}
.article-body blockquote,.post-body blockquote{background:#253220!important;color:rgba(245,240,232,.8)!important;border-color:#7A9E6C!important;}
.article-body h2{border-bottom-color:rgba(200,169,110,.32)!important;}

/* ── 4. hero (—-forest bg → flipped to cream → re-dark; title was --cream → re-light) ── */
.article-hero,.post-hero{background:linear-gradient(168deg,#1e2d1a,#253220)!important;}
.article-title,.article-hero h1,.post-hero h1,.post-hero .article-title{color:#F5F0E8!important;}
.article-subtitle{color:rgba(245,240,232,.72)!important;}
.article-cat,.post-cat-badge{background:rgba(200,169,110,.14)!important;color:#E2C488!important;}
.post-feature-image img{box-shadow:0 20px 50px -18px rgba(0,0,0,.75);}

/* ── 5. light panels (used #fff / --cream / --white as bg) → dark panels ── */
.author-card,.author-box,.toc,.related-card,.sidebar-card,.intro-box,
.tool-card,.use-case-card,.signal-card,.signal-card-body,.pillar-card,.principle-card,
.compare-card,.week-card,.content-type-card,.step-card,.step-box,
.decision-item,.rate-box,.box-step,.faq-item,.faq-body{background:#253220!important;border-color:#344530!important;}
.author-bio,.author-role{color:rgba(245,240,232,.66)!important;}
.author-name,.related-card-title,.related-title,.toc a,.tool-name,.pillar-title,
.faq-q,.faq-title,.principle-title,.signal-card-title{color:#F5F0E8!important;}
.toc-title{color:rgba(245,240,232,.55)!important;}
.article-tag,.tool-tag,.related-card-cat,.post-cat-badge{background:#2c3c27!important;color:#E2C488!important;border-color:#344530!important;}

/* ── 6. number / icon badges (likely dark or accent bg) → gold ── */
.step-num,.box-step-num,.pillar-num,.seq-num,.uc-number,.q-number,.num,
.principle-num,.signal-icon,.ci-icon,.rule-icon,.signal-card-icon,.mistake-check,.mistake-cross{
  background:linear-gradient(135deg,#E2C488,#A88A4E)!important;color:#23180a!important;}

/* ── 7. highlight / insight / warning boxes ── */
.highlight-box,.box-insight,.box-truth,.box-do,.green-flag{background:linear-gradient(135deg,#2c3c27,#253220)!important;border-color:rgba(200,169,110,.3)!important;color:rgba(245,240,232,.86)!important;}
.box-myth,.box-dont,.box-warning,.warning-box,.mistake-box,.red-flag{background:rgba(190,90,70,.10)!important;border-color:rgba(200,120,90,.42)!important;color:rgba(245,240,232,.86)!important;}

/* ── 8. compare / contrast columns + labels ── */
.compare-col,.box-compare-col,.week-col,.compare-table,.compare-item{background:#253220!important;border-color:#344530!important;}
.good,.good-label,.truth-label,.do-label{color:#95b886!important;}
.bad,.bad-label,.dont-label,.myth-label{color:#e8a08f!important;}

/* ── 9. cta box → dark panel + gold button ── */
.cta-box,.cta-band{background:#253220!important;border:1px solid rgba(200,169,110,.3)!important;}
.cta-box h3,.cta-eyebrow{color:#F5F0E8!important;}
.cta-box p{color:rgba(245,240,232,.72)!important;}
.cta-box .btn,.cta-btn,.btn-cta,.btn-sidebar{background:linear-gradient(135deg,#E2C488,#C8A96E)!important;color:#23180a!important;}

/* ── 10. sidebar audit promo ── */
.sidebar-audit{background:linear-gradient(160deg,#2c3c27,#1e2d1a)!important;border-color:rgba(200,169,110,.3)!important;}
/* the audit card's own rule sets `.sidebar-audit h4{color:var(--white)}` (line ~320), which the Night flip
   turns into the DARK page-bg color (--white -> #1e2d1a) -> dark-on-dark, invisible heading. The sibling
   .sidebar-card h4 reads cream via --forest; this same-specificity later rule clobbers it. Force cream. (2026-06-18) */
.sidebar-audit h4{color:#F5F0E8!important;}

/* ── 11. existing blog scroll-top + progress bar in Night gold ── */
#scroll-top{background:linear-gradient(135deg,#E2C488,#C8A96E)!important;}
#scroll-top svg{stroke:#23180a!important;}
#progress-bar{background:linear-gradient(90deg,#C8A96E,#E2C488)!important;}

/* ── 12. v6 mobile-menu overlay (id-scoped to beat the post's inline .mobile-menu) ── */
#mobileMenu{display:none;flex-direction:column;background:rgba(30,45,26,0.98);position:fixed;inset:0;z-index:950;align-items:center;justify-content:center;gap:8px;padding:40px 24px;border-bottom:none!important;}
#mobileMenu.open{display:flex;}
#mobileMenu a{font-family:'Rubik',sans-serif;font-size:clamp(1.6rem,5vw,2.4rem);font-weight:700;color:#F5F0E8!important;padding:10px 20px!important;border-bottom:none!important;transition:color .15s;}
#mobileMenu a:hover{color:#C8A96E!important;}
#mobileMenu .m-close{position:absolute;inset-block-start:20px;inset-inline-start:20px;background:none;border:1px solid rgba(245,240,232,0.3);border-radius:50%;width:40px;height:40px;color:rgba(245,240,232,0.7);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1.2rem;}

/* ── 13. flagship additions: data tables, warn box, inline code (geo-aeo-hebrew-2026; additive, no existing post uses these classes) ── */
.post-body table.data-table{background:#253220!important;border-color:#344530!important;}
.post-body table.data-table thead th{background:#2c3c27!important;color:#F5F0E8!important;}
.post-body table.data-table td{color:rgba(245,240,232,.85)!important;border-top-color:#344530!important;}
.post-body table.data-table tbody tr:nth-child(even){background:rgba(122,158,108,.06)!important;}
.post-body table.data-table strong{color:#F5F0E8!important;}
.warn-box{background:rgba(200,120,90,.10)!important;border-color:rgba(200,120,90,.35)!important;border-inline-start:4px solid #C8784B!important;}
.warn-box p{color:rgba(245,240,232,.86)!important;}
.warn-box strong{color:#e8a08f!important;}
.post-body code{background:rgba(200,169,110,.16)!important;color:#E2C488!important;}

/* ── 14. nav at the un-scrolled top (all night-theme posts): each post's inline <style> ships a LIGHT nav fallback ( nav{background:rgba(245,240,232,.96)} + .nav-logo img{mix-blend-mode:multiply} ). Under the Night token-flip the nav text/logo turn cream, so at scrollY 0 it was cream-on-cream and the cream logo multiplied to invisible. Restore a dark nav + clean cream logo; style.css's .v6-nav.scrolled keeps the on-scroll state. Fixes the "header looks washed only at the very top" report (2026-06-18). ── */
/* nav background MOVED to single-source style.css (2026-06-19): it was forced dark HERE only on
   blog posts, so the homepage (no blog-night.css) stayed transparent -> that asymmetry was the
   per-page header divergence Nave caught. The opaque forest background now lives once in
   style.css and applies to every page. Removed here so the header has exactly one style source. */
/* logo: the brand asset is a WIDE wordmark image (1689x360, icon + "AllArounder"). The
   canonical chrome (style.css) renders it height:34px / width:auto. But some posts' inline
   <style> ship the wrong rule .nav-logo img{width:32px;height:32px;object-fit:contain} —
   that crams the wide logo into a 32px SQUARE, scaling it to ~32px wide x 7px tall: a tiny,
   faint logo (the "header is different on some pages" report, 2026-06-19). Section 14 above
   only normalized the blend mode, not the box, so the size drift survived. Force the canonical
   box here so EVERY night blog page renders the logo identically to allarounder.io home. ── */
/* nav logo box MOVED to single-source style.css nav lock (2026-06-19). */

/* ── 15. breadcrumb clearance (2026-06-18): the fixed v6 nav is 64px tall, but each
   post-hero's own padding-top (64px desktop / 48px mobile) let the breadcrumb tuck UNDER
   the header instead of sitting snug below it ("why isn't the breadcrumb stuck to the top").
   Clear the nav + a comfortable gap on every night blog post, single-source. ── */
.post-hero{padding-block-start:96px!important;}
@media(max-width:680px){.post-hero{padding-block-start:82px!important;}}

/* -- 16. breadcrumb is NOT the legacy cream nav (2026-06-18): each post's inline <style>
   ships a bare `nav{}` cream sticky-bar fallback (section 14 describes it). That bare selector
   also matches `<nav class="hero-breadcrumb">`, painting a cream/white bar across the dark hero
   (the "white bar" report). The breadcrumb's own `.hero-breadcrumb{}` rule sets only color, so
   background/position/height/padding fall through to the bare nav rule. Neutralize them here so
   the breadcrumb is plain light text on the hero. Single-source across every night post. -- */
.post-hero .hero-breadcrumb{background:transparent!important;position:static!important;height:auto!important;padding:0!important;border-block-end:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;z-index:auto!important;}

/* -- 17. checklist box (2026-06-19): the inline `.checklist` bg is
   linear-gradient(var(--forest),var(--olive)); the section-1 token-flip remaps --forest to
   cream (#F5F0E8), so the intended dark-green box renders CREAM while the list text stays cream
   -> light-on-light, unreadable (the "5 פעולות שתעשו השבוע" box). Used on ai-search (HE+EN),
   seo-basics, local-seo. Force a proper dark Night panel + readable cream text + gold hairline,
   single-source across every post that uses it. -- */
.checklist{background:linear-gradient(135deg,#2c3c27,#253220)!important;border:1px solid rgba(200,169,110,.3)!important;}
.checklist li{color:rgba(245,240,232,.88)!important;}
.checklist strong{color:#F5F0E8!important;}
.checklist h3{color:#F5F0E8!important;}

/* ── 18. nav DIRECTION (2026-06-19): the visible "header is different on some pages" report.
   The injected v6 header markup is byte-identical site-wide (drift-guard=0). But each night
   post's inline <style> ships a LEGACY `.nav-inner{direction:ltr}` (from an older back-button
   nav). On an RTL Hebrew page that single declaration flips the whole header to LTR — logo
   jumps to the LEFT, actions to the RIGHT — so the same header renders MIRROR-IMAGED vs the
   homepage + blog index (which carry no such inline rule and stay RTL, logo right). The fix is
   NOT per-page: force `.nav-inner` to INHERIT the document direction here in the single-source
   night CSS (loaded last, so it beats the inline rule). Language-aware by construction: RTL on
   Hebrew posts (logo right, matches home), LTR on the English twins (logo left, correct for EN).
   One rule, every night post. NOTE: posts are inconsistent about WHERE they set the legacy
   ltr — some on `.nav-inner` (e.g. voice-dna), some on the bare `nav` element (e.g. the geo
   flagship: `nav{...direction:ltr}`). nav-inner inherits from nav, so we must force inherit on
   BOTH the nav element AND its inner, or the nav-level ltr leaks down. ── */
/* nav direction MOVED to single-source style.css nav lock (2026-06-19). */

/* ── 19. hero title line spacing (2026-06-19, Nave: "reduce the line spacing a bit"): each
   post's inline <style> sets the hero `h1{line-height:1.15}`. On the big ~52px display title
   that leaves an airy gap between wrapped lines. Tighten to 1.05 across every night post,
   single-source — targets the full hero-title selector set (same set section 4 recolors). ── */
.article-title,.article-hero h1,.post-hero h1,.post-hero .article-title{line-height:1.05!important;}

/* -- 20. contrast floor for mixed legacy article components (2026-07-05):
   Old post templates combine light-card components with the Night token flip. Keep the
   dark article shell, but pair every legacy surface with an explicit readable text color. -- */
.article-hero .article-meta,
.article-hero .article-meta span,
.article-hero .article-meta time,
.post-hero .post-meta,
.post-hero .post-meta span,
.post-hero .post-meta time,
.post-hero .meta-author{
  color:rgba(245,240,232,.86)!important;
  opacity:1!important;
  text-shadow:0 1px 8px rgba(0,0,0,.35)!important;
}
.post-hero .hero-breadcrumb,
.post-hero .hero-breadcrumb a,
.post-hero .hero-breadcrumb span{
  color:rgba(245,240,232,.82)!important;
  opacity:1!important;
}
.toc-list a{
  color:rgba(245,240,232,.82)!important;
  opacity:1!important;
}
.checklist li{
  background:rgba(245,240,232,.97)!important;
  border-color:rgba(90,112,64,.28)!important;
  color:#1E2D1A!important;
  opacity:1!important;
  text-shadow:none!important;
}
.checklist li *,
.checklist-step-title{
  color:#1E2D1A!important;
  opacity:1!important;
  text-shadow:none!important;
}
.step-num,
.box-step-num,
.pillar-num,
.seq-num,
.uc-number,
.q-number,
.num,
.principle-num{
  color:#182316!important;
  -webkit-text-fill-color:#182316!important;
}
.cta-box .btn,
.cta-btn,
.btn-cta,
.btn-sidebar{
  color:#182316!important;
  -webkit-text-fill-color:#182316!important;
}
