/* ==========================================================================
   legacy-bridge — reroutes the site-wide /css/style.css design system
   --------------------------------------------------------------------------
   healtharea/patientarea/hospitalarea's area.php still loads /css/style.css
   on every page (it predates the shell and still supplies some page-content
   rules, per that file's own docblock). That stylesheet owns its own
   accent, bg, text, success, warning, danger, and glass custom-property token set
   (a blue "Design System v3" palette), which generic Bootstrap-ish classes
   used in page content (.btn-primary, .alert-info, .nav-tabs, etc.) read
   from — so without this bridge, those elements render in the old blue
   palette inside an otherwise-Meridian shell.

   Overriding the same custom-property names here, scoped to body.lx (which
   wraps every LX-shell page), re-points every one of style.css's colour
   tokens — and everything derived from them via its own "legacy aliases" and
   "pricing token aliases" blocks — at Meridian's tokens. This works
   regardless of stylesheet load order: body.lx is a closer ancestor than
   :root for anything inside the shell, so its values always win for
   properties that are read by descendants of body.lx.

   Excludes body.lx-lite (public.php/auth.php's marketing and login pages):
   those carry their own, more targeted bridge (marketing.css/auth.css) with
   a few deliberate, mode-invariant departures from this one — most
   critically --bg-footer, which marketing.css hardcodes to a literal dark
   colour because #site-footer's white text is mode-invariant by design.
   Without this exclusion, body.lx's closer proximity to #site-footer than
   :root made this file's own (mode-reactive, cream-in-light-mode)
   --bg-footer win instead, silently breaking that contrast in light mode. */

body.lx:not(.lx-lite) {
  --bg-base:      var(--lx-bg-sunk);
  --bg-elevated:  var(--lx-glass);
  --bg-card:      var(--lx-glass);
  --bg-surface:   var(--lx-glass-subtle);
  --bg-nav:       var(--lx-bg-sunk);
  --bg-input:     var(--lx-fill);
  --bg-footer:    var(--lx-bg-sunk);

  --accent:       var(--lx-accent);
  --accent-2:     var(--lx-accent);
  --accent-light: var(--lx-accent);
  --accent-dark:  var(--lx-accent);
  --accent-xdark: var(--lx-accent);

  --glow-a: var(--lx-accent-soft);
  --glow-b: var(--lx-accent-soft);
  --glow-c: var(--lx-accent-soft);

  --text-1:      var(--lx-t1);
  --text-2:      var(--lx-t2);
  --text-3:      var(--lx-t3);
  --text-4:      var(--lx-t4);
  --text-inv:    var(--lx-t-inv);
  --text-accent: var(--lx-accent);

  --glass-fill:     var(--lx-fill);
  --glass-fill-2:   var(--lx-fill-hover);
  --glass-fill-3:   var(--lx-fill-active);
  --glass-border:   var(--lx-glass-border);
  --glass-border-2: var(--lx-glass-border-strong);
  --glass-shadow:   var(--lx-shadow-raised);
  --glass-shadow-2: var(--lx-shadow-floating);
  --glass-shadow-3: var(--lx-shadow-overlay);

  --success: var(--lx-success);
  --warning: var(--lx-warning);
  --danger:  var(--lx-danger);
  --info:    var(--lx-info);

  --f-display: var(--lx-f-display);
  --f-body:    var(--lx-f-ui);
  --f-mono:    var(--lx-f-mono);

  /* ── Orphaned surface tokens ───────────────────────────────────────────────
     These names are referenced by per-page and per-widget CSS carried over
     from the pre-shell dark theme, but were never defined anywhere — the
     stylesheet that owned them is gone. Each therefore resolved to its
     hardcoded dark fallback (#1a1a2e, #1a1f2e, rgba(255,255,255,0.03)…), or,
     where the author wrote no fallback, to nothing at all — an invalid value,
     so the element rendered with no surface whatsoever. Either way the card
     lost its glass. Defining them here restores the intended surface without
     touching the ~40 call sites. */
  --card-bg:    var(--lx-glass);
  --glass-bg:   var(--lx-glass);
  --bg-glass:   var(--lx-glass);
  --surface:    var(--lx-glass);
  --bg-secondary: var(--lx-glass);
  --bg-2:       var(--lx-glass);

  --surface-2:    var(--lx-glass-subtle);
  --bg-tertiary:  var(--lx-glass-subtle);
  --ha-bg-soft:   var(--lx-glass-subtle);

  --bg-default: var(--lx-bg);
  --bg-primary: var(--lx-bg);
  --bg-1:       var(--lx-bg);

  --panel-bg:   var(--lx-panel-surface);
  --bg-panel:   var(--lx-panel-surface);

  --glass-hover:        var(--lx-fill-hover);
  --hover-bg:           var(--lx-fill-hover);
  --bg-elevated-hover:  var(--lx-fill-hover);

  --glass-border-hover: var(--lx-glass-border-strong);
  --ha-border:          var(--lx-glass-border);
  --ld-border:          var(--lx-glass-border);

  --shadow: var(--lx-glass-shadow);
  --radius: var(--lx-r-md);
}
