/* ===================================================================
   Iran Trust News — «Midnight & Gold» redesign layer (2026-08-27)
   Loads AFTER site.css. Repaints the whole token set and restyles the
   masthead, navigation, lead story, section headings and cards.
   Structure and the admin panel are untouched — delete this file and
   the <link> in layouts/app.blade.php to go back.
   =================================================================== */

/* ---- 1. tokens: midnight is now the default, light is the companion ---- */
:root{
  color-scheme:dark;
  --paper:#0d1b2a;          /* page */
  --surface:#16293d;        /* cards / panels */
  --surface-2:#1d3550;      /* raised */
  --ink:#e8edf3;
  --muted:#93a4b8;
  --line:#243b54;
  --line-strong:#3a5675;
  --navy:#081522;
  --navy-soft:#16293d;
  --teal:#c9a227;           /* the accent — now gold */
  --teal-dark:#e0bc4a;
  --amber:#e0bc4a;
  --danger:#e4636f;
  --success:#3fbf88;
  --shadow:0 18px 50px rgba(0,0,0,.45);
  --radius:0;
}
[data-theme="light"]{
  color-scheme:light;
  --paper:#f4f1e9;
  --surface:#ffffff;
  --surface-2:#faf7f0;
  --ink:#0d1b2a;
  --muted:#5d6b7c;
  --line:#ddd7c9;
  --line-strong:#a99c7e;
  --navy:#0d1b2a;
  --navy-soft:#16293d;
  --teal:#8a6d0f;
  --teal-dark:#6b540a;
  --amber:#c9a227;
  --danger:#b02532;
  --success:#12724c;
  --shadow:0 18px 46px rgba(13,27,42,.10);
}
/* the old toggle wrote data-theme="dark"; keep it meaning «midnight» */
[data-theme="dark"]{ color-scheme:dark; }

/* ---- 2. typography: bigger, tighter display type ---- */
body{ background:var(--paper); color:var(--ink); }
h1,h2,h3,.front-title,.section-heading h2{ letter-spacing:-.03em; }
.front-title{ font-size:clamp(30px,4.4vw,52px); font-weight:900; line-height:1.14; }
.front-intro{ border-bottom:2px solid var(--teal); padding-bottom:18px; }

/* ---- 3. masthead: a gold rule instead of the old teal underline ---- */
.site-header{ background:var(--paper); border-bottom:1px solid var(--line); }
.utility-bar{ background:var(--navy); color:#dfe7f0; border-bottom:1px solid var(--line); }
.utility-actions>a,.utility-edition{ color:#c8d4e2; }
.masthead{ border-bottom:3px double var(--teal); }
.brand-mark{
  background:var(--teal); color:var(--navy);
  box-shadow:inset 0 -5px 0 rgba(0,0,0,.28);
}
.brand-mark i{ color:var(--navy); }
.brand-copy strong{ color:var(--ink); }
.brand-copy small{ color:var(--teal); letter-spacing:.3em; }
.header-search{ border-bottom:1px solid var(--teal); }
.theme-toggle{ border:1px solid var(--line-strong); color:var(--ink); }
.theme-toggle:hover{ background:var(--teal); color:var(--navy); border-color:var(--teal); }

/* ---- 4. navigation: gold marker, uppercase tracking ---- */
.main-nav{ background:var(--surface); border-block:1px solid var(--line); }
.nav-list a{ color:var(--ink); font-weight:700; letter-spacing:-.01em; }
.nav-list a::after{ background:var(--teal); height:3px; }
.nav-list a:hover,.nav-list a.active{ color:var(--teal-dark); }

/* ---- 5. breaking bar ---- */
.breaking-bar{ background:var(--navy); border-block:1px solid var(--line); }
.breaking-label{ background:var(--teal); color:var(--navy); font-weight:900; }
.bf-item{ color:#e6edf5; }

/* ---- 6. section headings: numbered, gold rule ---- */
.section-heading{ border-bottom:2px solid var(--teal); }
.section-heading h2{ color:var(--ink); font-weight:900; }
.section-heading .section-number{ color:var(--teal); font-weight:900; opacity:1; }
.section-heading p{ color:var(--muted); }
.section-heading>a{ color:var(--teal-dark); font-weight:800; }
.section-heading.inverse{ border-bottom-color:var(--teal); }

/* ---- 7. cards & lead story ---- */
.lead-story,.reports-grid>*,.video-card,.post-card,.news-row,.daily-brief,.topic-index,.popular-strip{
  background:var(--surface); border:1px solid var(--line); border-radius:var(--radius);
}
.lead-story{ box-shadow:var(--shadow); }
.lead-copy .story-overline,.story-overline{ color:var(--teal); font-weight:800; letter-spacing:.12em; }
.story-link{ color:var(--ink); }
.story-link:hover{ color:var(--teal-dark); }
.meta,.dur{ color:var(--muted); }
.thumb{ border:1px solid var(--line); }

/* ---- 8. market strip ---- */
.market-strip{ background:var(--navy); border-block:1px solid var(--line); }
.market-label span{ color:var(--teal); }
.market-item strong{ color:#eef3f9; }
.market-item small,.market-source{ color:#9fb0c4; }

/* ---- 9. footer ---- */
.site-footer{ background:var(--navy); color:#cfdae7; border-top:3px double var(--teal); }
.site-footer a{ color:#cfdae7; }
.site-footer a:hover{ color:var(--teal); }

/* ---- 10. misc surfaces that were built for a cream page ---- */
.daily-brief,.brief-all,.empty-state,.timeline-list,.newsletter{ color:var(--ink); }
.empty-state{ background:var(--surface-2); border:1px dashed var(--line-strong); }
.red-title{ color:var(--danger); }
.pulse-dot,.breaking-label i{ background:var(--navy); }

/* ---- 11. leftovers that were hardcoded for the old cream page ---- */

/* image placeholders were light grey — a bright block on a midnight page */
.lead-visual,.story-card-visual,.news-row-visual{ background:#1b3149; }
.video-card .thumb{ background:#081522; }

/* controls that flip to the accent on hover: label them with the page navy */
.market-source:hover,.card-arrow:hover,.search-page-form button:hover,
.form>button:hover,.btn:hover{ color:var(--navy); }

/* the no-image lead card + archive intro */
.lead-story.lead-no-image{ background:var(--surface-2); color:var(--ink); }
.lead-no-image .story-overline,.lead-no-image .lead-copy>p,
.archive-lead-copy>p{ color:var(--muted); }
.lead-no-image .story-link{ border-color:var(--teal); }

/* alert chips were built for a light background */
.alert,.flash-error{ background:#3a1116; color:#f2b3ba; border-color:#6d1f28; }
.flash-success,.alert.success{ background:#10301f; color:#8fe0b6; border-color:#1d5c3b; }

/* the old hardcoded navy #0b1220 shows up as a slightly-off block next to the new one */
.newsletter-panel{ background:var(--surface-2); border:1px solid var(--line); }