/* ═══════════════════════════════════════════════════════════════════
   KOHISTANI.COM — LEGACY TOKEN SHIM
   v1.0.0  •  companion to brand-tokens.css v1.0.0

   PURPOSE
   style.css references 13 variable names that its own :root block never
   defines. They are leftovers from the pre-redesign stylesheet, which
   still lives at legacy/assets/css/style.css but is loaded by no live
   template. Every `var(--card-bg)` etc. without a fallback therefore
   resolves to nothing, the declaration is invalid at computed-value
   time, and the rule silently does not apply.

   ⚠ READ BEFORE DEPLOYING
   This file makes ~22 currently-dead declarations start working. That
   is a fix, but it WILL change how some pages render — mostly panels
   that are currently transparent gaining their proper card surface,
   and muted text switching from a hardcoded grey to the themed token.
   Deploy it on its own, not bundled with the palette change, so you can
   see what moves. Review these areas in both light and dark:
     • stories list + search input   (lines ~2439-2466)
     • dashboard notifications       (lines ~7997, 8104)
     • ticket / support panels       (lines ~6027-6207)
     • scrollbar thumb hover         (line ~5514)

   LOAD ORDER
     bootstrap.min.css
     brand-tokens.css     ← shared, byte-identical across both sites
     k-compat.css         ← this file
     assets/css/style.css

   Like km-compat.css, this file is temporary. Retire each alias by
   rewriting its call sites to the shared token name.
   ═══════════════════════════════════════════════════════════════════ */


/* ───────────────────────────────────────────────────────────────────
   1. SURFACES
   Mapped to the shared surface scale, so these rules become
   theme-aware for the first time.
   ─────────────────────────────────────────────────────────────────── */

:root {
  --body-bg:        var(--surface-body);
  --card-bg:        var(--surface-card);
  --surface-raised: var(--surface-card);
  --surface-2:      var(--surface-alt);   /* fallback in use: rgba(0,0,0,.04) */

  /* style.css defines --border but CALLS --border-color in 39 places,
     only 3 of which carry a fallback. The other 36 border declarations
     have been silently dropped since the redesign — story headings,
     tables, dashboard panels and card outlines all lost their rules.
     Expect borders to reappear on those elements. */
  --border-color:   var(--border);
}


/* ───────────────────────────────────────────────────────────────────
   2. TEXT
   The fallbacks in style.css (#6c757d, #888) are hardcoded Bootstrap
   greys that never changed between themes. Routing them through the
   shared tokens is the actual fix.
   ─────────────────────────────────────────────────────────────────── */

:root {
  --body-text:  var(--text-primary);
  --body-color: var(--text-primary);
  --text-muted: var(--text-secondary);    /* fallback in use: #6c757d */
  --text-muted-2: var(--text-tertiary);   /* fallback in use: #888    */
  --brand-gray: var(--text-tertiary);     /* was #7D7D7D in DOCS spec */
}


/* ───────────────────────────────────────────────────────────────────
   3. GEOMETRY
   ─────────────────────────────────────────────────────────────────── */

:root {
  --radius:   var(--radius-md);   /* 8px  */
  --navbar-h: var(--nav-height);  /* 64px — note: the one fallback in
                                     style.css says 60px, so the navbar
                                     offset shifts by 4px. Confirm no
                                     sticky-header overlap after deploy. */
}


/* ───────────────────────────────────────────────────────────────────
   4. ADMIN
   --admin-border and --admin-text-muted ARE defined, but only in
   admin/assets/css/admin.css. The rules using them in the main
   style.css run outside that file's reach on non-admin pages.
   Aliased here so behaviour is consistent everywhere.
   ─────────────────────────────────────────────────────────────────── */

:root {
  --admin-border:     var(--border);          /* fallback in use: #e9ecef */
  --admin-text-muted: var(--text-secondary);  /* fallback in use: #6b7280 */
}


/* ───────────────────────────────────────────────────────────────────
   5. EDITORIAL DISPLAY FACE  ← kohistani.com only

   This is the deliberate Tier-3 divergence from kohistanimedia.com.
   brand-tokens.css defaults --font-display to the Inter body stack;
   the brand site overrides it with its serif. Keep this override —
   it is the one typographic difference the two sites should keep.
   ─────────────────────────────────────────────────────────────────── */

:root {
  --font-display: 'Cormorant Garamond', 'Georgia', serif;
}


/* ═══════════════════════════════════════════════════════════════════
   NOT ALIASED — these are correct as-is, do not add them here:

     --cat-color, --chip-color, --guide-cat-color
         Set inline per-element from PHP in guides/show.php
         (lines 284, 309, 358, 529). Working as designed.

     --shorts-gap
         Defined locally inside style.css. Fine.

   CLEANUP after this file is in place:
     • legacy/assets/css/style.css is loaded by no live template.
       It is the source of the stale palette in DOCS/frontend.md
       (#F8F7F5 body, #0d1117 dark, #1a7fd4 blue). Delete it, or move
       it out of the document root, so nobody builds from it again.
     • Then update DOCS/frontend.md § Color Tokens to point at
       brand-tokens.css instead of restating values.
   ═══════════════════════════════════════════════════════════════════ */