/* ============================================================
   x365 Audit Tool — theme-aura.css  ·  "Frosted Aura" layer
   ------------------------------------------------------------
   Re-hues x365 to the theadminstack.com "Frosted Aura" light
   design system so the tool matches the main site exactly.
   LOAD THIS AFTER style.css (and app.css) in every page.

   Core palette:  #5C7E8F Aura · #4C6B7A Aura-600 (buttons)
                  #D4DDE2 Frost · #EFF3F6 Aura-50 · #FFFFFF White
   Ink (replaces near-black): #1F2F38
   Severity hues are preserved — hue still means risk, not brand.
   ============================================================ */

/* 1. Pin the Frosted Aura light palette on every token, in both the
      default (:root) and (defensive) .dark states so the palette is
      identical regardless of any stray flag. */
:root,
html,
html.dark,
html:not(.dark) {
  color-scheme: light;

  --bg:        #FFFFFF;
  --bg-1:      #FFFFFF;
  --bg-2:      #EFF3F6;   /* aura-50  — stripes / code / subtle fills */
  --bg-3:      #D4DDE2;   /* frost    — chips / rails */

  --surface:   #FFFFFF;
  --surface-2: rgba(31,47,56,0.03);
  --surface-3: rgba(31,47,56,0.05);

  --border:    #D4DDE2;
  --border-2:  #BCCBD3;
  --border-3:  #9DB0BA;

  --accent:        #4C6B7A;   /* aura-600 — AA 5.7:1 under white button text */
  --accent-inv:    #FFFFFF;
  --accent-2:      #3C5563;   /* aura-700 — links / small accent text */
  --accent-subtle: #EFF3F6;
  --accent-dim:    #EFF3F6;
  --accent-glow:   rgba(92,126,143,0.16);

  --text:   #1F2F38;   /* aura-900  13.7:1 on white */
  --text-2: #3C5563;   /* aura-700   7.9:1 on white */
  --text-3: #6E7478;   /* muted / captions */
  --text-4: #BCCBD3;

  --shadow-sm: 0 1px 2px rgba(31,47,56,0.06);
  --shadow-md: 0 8px 24px rgba(31,47,56,0.10);
  --shadow-lg: 0 18px 48px rgba(31,47,56,0.14);
}

/* Keep the legacy status aliases pointed at the (unchanged) severity hues. */
:root {
  --green:  var(--sev-low);
  --red:    var(--sev-critical);
  --orange: var(--sev-medium);
  --blue:   #5C7E8F;   /* "info" reads as aura, not blue */
}

/* 2. Page background: the signature cool "aura" wash over white */
body {
  background:
    radial-gradient(1200px 500px at 80% -10%, rgba(92,126,143,0.14), transparent 60%),
    radial-gradient(900px 400px at 10% 10%, rgba(212,221,226,0.55), transparent 55%),
    var(--bg);
  background-attachment: fixed;
  color: var(--text);
}
.app-shell, .app-main { background: transparent; }

/* Links / small accent text use aura-700 (AA 7.9:1 on white) */
a { color: var(--accent-2); }
a:hover { color: var(--accent); }

/* Focus ring — aura-600 */
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 4px; }

/* 3. Single theme: hide every theme toggle (matches main site) */
[data-theme-toggle], .theme-toggle { display: none !important; }

/* 4. Aura polish on brand marks that used the mono near-black accent */
.logo-mark,
.topbar-logo .logo-mark,
.auth-gate-logo em,
.audit-overlay-logo em,
.nav-logo em { color: var(--accent); opacity: 1; }

/* Primary buttons: solid aura-600, aura-700 on hover (crisper than opacity) */
.btn-primary { background: var(--accent); color: var(--accent-inv); }
.btn-primary:hover { background: var(--accent-2); opacity: 1; color: var(--accent-inv); }

/* Frosted sticky headers, like the main site's translucent nav */
.site-nav, .app-topbar { background: rgba(255,255,255,0.72); backdrop-filter: blur(10px); }

.hero-badge .dot { background: var(--sev-low); }