/* THE CALIBRE DARK THEME — matches The Calibre Index. Variable inversion + targeted
   overrides for the specific light components/text found by browser audit. Additive only. */
@import url('/fonts.css');
:root{
  --paper:#070b16; --paper-warm:#111a2e; --panel:#111a2e; --panel-2:#0d1424;
  --ink:#eef2f8; --muted:#8ba0c2;
  --line:#1e2b45; --accent:#e0663f; --accent-dark:#b8431f; --accent2:#f2a03d;
}
body{
  background-color:var(--paper);
  background-image:
    radial-gradient(1200px 600px at 78% -10%, rgba(224,102,63,.10), transparent 60%),
    radial-gradient(900px 500px at 10% 8%, rgba(45,120,190,.08), transparent 55%);
  background-attachment:fixed; background-repeat:no-repeat;
  color:var(--ink); font-family:Inter, system-ui, -apple-system, sans-serif; -webkit-font-smoothing:antialiased;
}
::selection{ background:rgba(224,102,63,.35); }
::-webkit-scrollbar{ width:11px; height:11px; }
::-webkit-scrollbar-thumb{ background:var(--line); border-radius:10px; border:3px solid var(--paper); }

/* --- light component backgrounds -> dark --- */
.review-card, .precheck-promo, .price-card, .tp-panel, .calibre-answer,
.encapsulate-cta, .spec-strip, .footer-col{ background:var(--panel) !important; border-color:var(--line) !important; }
.spec-strip, footer, .site-footer{ background:var(--panel-2) !important; }
.price-card.featured{ background:linear-gradient(180deg, rgba(224,102,63,.10), var(--panel)) !important; border:1px solid var(--accent) !important; }
input:not([type=checkbox]):not([type=radio]), select, textarea{
  background:var(--panel) !important; color:var(--ink) !important; border:1px solid var(--line) !important; }
input::placeholder, textarea::placeholder{ color:var(--muted) !important; }

/* --- dark text -> light: colour the CONTAINER so all descendants inherit --- */
.review-card, .precheck-promo, .price-card, .tp-panel, .tp-tiers, .tp-tier, .calibre-answer,
.calibre-answer-name, .encapsulate-cta, .spec-strip, .spec-grid, .spec-item,
footer, .footer-inner, .footer-col, .footer-logo, .footer-tagline{ color:var(--ink) !important; }
.review-role, .price-desc, .price-per, .footer-tagline, .tp-sub, .spec-sub{ color:var(--muted) !important; }

/* --- light buttons -> themed accent --- */
.price-cta, .footer-newsletter-btn{ background:var(--accent) !important; color:#160b06 !important; border:none !important; }

/* --- children with their own explicit dark colour: explicit overrides --- */
.review-quote, .pricing-intro, .gr-tier, .gr-tier-score, .gr-tier-name,
.price-features li, .footer-col li, .footer-col a, .tp-tiers li, .spec-strip li,
.price-card li, .price-name, .price-amount{ color:var(--ink) !important; }

/* encapsulation CTA panel (light gradient) -> dark. NB: .caliber-slab-face stays
   light on purpose — it's the physical slab mockup. */
.encapsulate-inner{ background:var(--panel) !important; color:var(--ink) !important; border:1px solid var(--line) !important; }

/* --- registry --- */
.reg-row, .reg-pop{ background:var(--panel) !important; border:1px solid var(--line) !important; color:var(--ink) !important; }
.reg-row:hover{ border-color:var(--accent) !important; }
.reg-name, .reg-cert, .reg-pop-num{ color:var(--ink) !important; }
.reg-set-info, .reg-date, .reg-dist-grade, .reg-pop-label, .reg-sub{ color:var(--muted) !important; }
.reg-page-btn, .reg-prev, .reg-next{ background:var(--panel) !important; color:var(--ink) !important; border:1px solid var(--line) !important; }

/* --- shared content-page components (order/precheck/account/contact/legal) --- */
.card, .panel, .how-step, .callout, .ac-card, .info-card, .box, .step, .tp-panel,
.detail-card, .form-card, .summary-card, .ord-again{ background:var(--panel) !important; border-color:var(--line) !important; color:var(--ink) !important; }

/* --- registry: pager buttons (#prev/#next) had no dark override at all --- */
#prev, #next{ background:var(--panel) !important; color:var(--ink) !important; border:1px solid var(--line) !important; }

/* --- inline <code> snippets (cookie policy etc) were still light-theme --- */
code{ background:var(--panel-2) !important; color:var(--accent2) !important; }

/* --- form validation error banner (contact page etc) was an unthemed light-pink box --- */
.msg.err{ background:rgba(224,102,63,.12) !important; color:var(--accent2) !important; border-color:rgba(224,102,63,.35) !important; }

/* --- account: "Send us your cards" panel boxes (leftover light backgrounds
   made the address + packing-list boxes render white-on-white) --- */
.sp-box, .sp-pack{ background:var(--panel) !important; border-color:var(--line) !important; }
.sp-steps li{ color:var(--ink) !important; }
.drop{ background:var(--panel) !important; border:1.5px dashed var(--line) !important; color:var(--ink) !important; }
.seg{ background:var(--panel-2) !important; border:1px solid var(--line) !important; }
.btn.ghost, .dz-btn.ghost, .btn-ghost{ background:var(--panel) !important; color:var(--ink) !important; border:1px solid var(--line) !important; }
.how-step small, .card small, .muted, .sub, .hint, .fine, .dz-sub{ color:var(--muted) !important; }

/* --- order page: inline-styled light notice banners (targeted by their inline style) --- */
[style*="rgb(58, 52, 41)"]{ background:var(--panel-2) !important; color:var(--muted) !important; border-color:var(--line) !important; }
[style*="align-items:flex-start"][style*="11px 14px"]{ background:rgba(224,160,32,.10) !important; border:1px solid rgba(242,160,61,.35) !important; color:#f0d9a8 !important; }

/* --- admin --- */
.admin-sidebar, aside.admin-sidebar{ background:var(--panel-2) !important; border-color:var(--line) !important; }
.admin-sidebar a, .admin-sidebar button, .admin-nav a, .side-link, .admin-sidebar .active{ color:var(--ink) !important; }
.stat, a.stat, .admin-card, .admin-panel, .adm-card, .metric-card{ background:var(--panel) !important; border:1px solid var(--line) !important; color:var(--ink) !important; }
table{ color:var(--ink) !important; }
table th{ color:var(--muted) !important; border-color:var(--line) !important; background:var(--panel-2) !important; }
table td, table tr{ background:transparent !important; border-color:var(--line) !important; }
tbody tr:hover td{ background:rgba(224,102,63,.06) !important; }

/* --- homepage2 (conversion page). NB: .slab/.grade/.floatnums stay light = physical slab mockup --- */
.card-b, .strip, .guar, .step-b{ background:var(--panel) !important; border:1px solid var(--line) !important; color:var(--ink) !important; }
.band{ background:transparent !important; color:var(--ink) !important; }
.top{ background:rgba(7,11,22,.72) !important; border-color:var(--line) !important; }
.card-b h3, .card-b p, .guar strong, .guar span, .strip *{ color:var(--ink) !important; }

/* homepage2 FAQ accordions */
details, .faq-item{ background:var(--panel) !important; border:1px solid var(--line) !important; color:var(--ink) !important; }
summary, details *{ color:var(--ink) !important; }

/* homepage2 pricing + final CTA */
.plan{ background:var(--panel) !important; border:1px solid var(--line) !important; color:var(--ink) !important; }
.plan.feature{ border:1px solid var(--accent) !important; }
.plan h3, .plan-name, .plan-price, .price-big{ color:var(--ink) !important; }
.final{ background:var(--panel-2) !important; color:var(--ink) !important; }

/* --- homepage2 visual polish: depth + contrast so panels read like the rest of the site --- */
.card-b, .plan, .guar, .step-b, details, .strip{
  background:linear-gradient(180deg,#141d32,#0e1626) !important;
  border:1px solid #26364f !important;
  box-shadow:0 14px 38px rgba(0,0,0,.42) !important;
}
.plan.feature{ border:1.5px solid var(--accent) !important; box-shadow:0 18px 50px rgba(224,102,63,.20) !important; }
.card-b h3, .plan h3, .guar strong, summary, .strip strong{ color:#f5f8fd !important; }
.card-b p, .guar p, .guar span, .plan li, .plan-features li, .plan ul li, details p, .strip{ color:#bcc9e0 !important; }
.card-b .num, .guar .ic, .plan .price, .price-big{ }

/* --- homepage2 FAINT TEXT FIX: #2b3345 body colour left dark on dark --- */
.hero .sub, .split p, .founder p, .plan li{ color:#c6d2e6 !important; }
.split strong, .founder strong{ color:#ffffff !important; }
/* grade badge used background:var(--ink) (now light) -> terracotta, white text readable */
.grade{ background:var(--accent) !important; color:#fff !important; box-shadow:0 8px 24px rgba(224,102,63,.35) !important; }

/* homepage2 STRAIGHT TALK: inline-styled #2b3345 paragraphs (beat inline via attribute + !important) */
[style*="#2b3345"]{ color:#c6d2e6 !important; }
[style*="#2b3345"] strong, p[style*="#2b3345"] strong{ color:#ffffff !important; }

/* homepage2 slab: when a real showcase card is loaded, drop the placeholder stripe + blue gradient */
.slab .card.has-real{ background-color:#0b1020 !important; }
.slab .card.has-real::after{ content:none !important; }

/* homepage2 slab: keep the grade badge in front of the card */
.slab{ overflow:visible !important; }
.slab .grade{ z-index:5 !important; }

/* --- pre-check page: literal light-theme text/background colours left over from
   the old --paper:#f4f1ea theme were never added to the patch list above, so they
   stayed near-black on the new dark background (audit fix) --- */
.lead, .tips, .ov-sub, .f-sub, .cta-grade .cta-p{ color:var(--muted) !important; }
.guide-note{ background:var(--panel) !important; border-color:var(--line) !important; color:var(--ink) !important; }
.quality-warn{ background:rgba(224,160,32,.10) !important; color:#f0d9a8 !important; }
.quality-warn.poor{ background:rgba(224,102,63,.12) !important; color:var(--accent2) !important; }
