/* ═══════════════════════════════════════════════════════════════════════
   AAMOS Theme Fix — Global Consistency Layer
   Skapad: 2026-04-30 · WARMODE audit
   Erik: "SÄKERSTÄLL TEMAT ÖVERALLT"

   Löser:
   1. Playfair Display → Inter Tight överallt (logo/brand)
   2. Badges + status-pills: synliga i BÅDA light och dark mode
   3. Inline style white-bg / black-text: osynlighetsfix i dark mode
   4. AAMOS DYNASTY → AAMOS Pro i brand-element
   5. data-theme="dark" stöd för sidor med prefers-color-scheme
   6. Foundation Charter / status-pillar kontrast
   ═══════════════════════════════════════════════════════════════════════ */

/* ──────────────────────────────────────────────────────────────────────
   FONTS — Importera Inter Tight för alla sidor
   ────────────────────────────────────────────────────────────────────── */
@import url('https://fonts.googleapis.com/css2?family=Inter+Tight:wght@400;500;600;700;800;900&family=Inter:wght@300;400;500;600;700;800&display=swap');

/* ──────────────────────────────────────────────────────────────────────
   PLAYFAIR ERADICATION — Ersätt serif med Inter Tight ÖVERALLT
   ────────────────────────────────────────────────────────────────────── */

/* Logo-mark cirkel/ruta (A-bokstaven i sidebaren på dashboards) */
.sb-logo-mark {
  font-family: 'Inter Tight', 'Inter', -apple-system, sans-serif !important;
  font-weight: 800 !important;
}

/* Sidebar brand-namn */
.sb-logo-name,
.sb-wordmark,
.hd-logo,
.brand {
  font-family: 'Inter Tight', 'Inter', -apple-system, sans-serif !important;
  font-weight: 700 !important;
}

/* Catch-all: inga Playfair-element ska synas */
[style*="Playfair"],
[class*="playfair"] {
  font-family: 'Inter Tight', 'Inter', -apple-system, sans-serif !important;
}

/* ──────────────────────────────────────────────────────────────────────
   DARK MODE — data-theme="dark" MAPPAR formation-v2.html variabler
   (formation-v2 + formation.html använder prefers-color-scheme, 
    inte data-theme. Denna block synkar dem med AAMOS-temat.)
   ────────────────────────────────────────────────────────────────────── */
[data-theme="dark"] body,
html.dark body {
  background: #111110 !important;
  color: #dedad2 !important;
}

[data-theme="dark"] .sidebar,
html.dark .sidebar {
  background: #0c1428 !important;
}

[data-theme="dark"] .card,
html.dark .card {
  background: #1c1b18 !important;
  border-color: #2d2c28 !important;
}

[data-theme="dark"] .topbar,
html.dark .topbar {
  background: #1c1b18 !important;
  border-bottom-color: #2d2c28 !important;
}

[data-theme="dark"] table th,
html.dark table th {
  background: #161512 !important;
  color: #b8b4ac !important;
}

[data-theme="dark"] input.fi,
[data-theme="dark"] select.fi,
[data-theme="dark"] textarea.fi,
html.dark input.fi,
html.dark select.fi,
html.dark textarea.fi {
  background: #1c1b18 !important;
  color: #dedad2 !important;
  border-color: #2d2c28 !important;
}

/* ──────────────────────────────────────────────────────────────────────
   BADGES — DARK MODE (data-theme="dark" + html.dark + prefers-color-scheme:dark)
   Täcker ALLA badge-varianter som används i AAMOS
   ────────────────────────────────────────────────────────────────────── */

/* Base badge reset dark */
[data-theme="dark"] .badge,
[data-theme="dark"] [class*="badge"]:not([class*="aamos-badge"]):not([class*="sb-badge"]),
html.dark .badge,
html.dark [class*="badge"]:not([class*="aamos-badge"]):not([class*="sb-badge"]),
@media (prefers-color-scheme: dark) {
  /* Handled below separately */
}

/* GREEN badge (.bg = Bekräftad / Aktiv / OK / Giltigt / Signerat) */
[data-theme="dark"] .badge.bg,
[data-theme="dark"] .bg.badge,
html.dark .badge.bg,
html.dark .bg.badge {
  background: rgba(42,176,106,0.18) !important;
  color: #4fd98a !important;
  border: 1px solid rgba(42,176,106,0.35) !important;
}

/* AMBER badge (.ba = Utkast / Pågående / Åtgärd krävs) */
[data-theme="dark"] .badge.ba,
[data-theme="dark"] .ba.badge,
html.dark .badge.ba,
html.dark .ba.badge {
  background: rgba(212,154,10,0.18) !important;
  color: #f0c050 !important;
  border: 1px solid rgba(212,154,10,0.35) !important;
}

/* RED badge (.br = Ej signerat / Ej vald / Kritiskt) */
[data-theme="dark"] .badge.br,
[data-theme="dark"] .br.badge,
html.dark .badge.br,
html.dark .br.badge {
  background: rgba(200,72,72,0.18) !important;
  color: #ff7f7f !important;
  border: 1px solid rgba(200,72,72,0.35) !important;
}

/* NEUTRAL badge (.bn = Currency/neutral) */
[data-theme="dark"] .badge.bn,
[data-theme="dark"] .bn.badge,
html.dark .badge.bn,
html.dark .bn.badge {
  background: rgba(155,181,214,0.15) !important;
  color: #9bb5d6 !important;
  border: 1px solid rgba(155,181,214,0.25) !important;
}

/* GOLD badge (.bgo = Rekommenderat / Analys) */
[data-theme="dark"] .badge.bgo,
[data-theme="dark"] .bgo.badge,
html.dark .badge.bgo,
html.dark .bgo.badge {
  background: rgba(212,160,48,0.15) !important;
  color: #e4b040 !important;
  border: 1px solid rgba(212,160,48,0.30) !important;
}

/* ── STATUS-PILL (watchman, group-health, cron-jobs) ── */
[data-theme="dark"] .status-pill.up,
html.dark .status-pill.up {
  background: rgba(42,176,106,0.15) !important;
  color: #4fd98a !important;
  border: 1px solid rgba(42,176,106,0.30) !important;
}
[data-theme="dark"] .status-pill.down,
html.dark .status-pill.down {
  background: rgba(232,116,116,0.15) !important;
  color: #ff7f7f !important;
  border: 1px solid rgba(232,116,116,0.30) !important;
}
[data-theme="dark"] .status-pill.warn,
html.dark .status-pill.warn {
  background: rgba(232,176,116,0.15) !important;
  color: #f0c050 !important;
  border: 1px solid rgba(232,176,116,0.30) !important;
}

/* ── STATUS-BADGE (ceo/cfo/cmo etc dashboards) ── */
[data-theme="dark"] .status-badge,
html.dark .status-badge {
  color: #dedad2 !important;
}
[data-theme="dark"] .status-badge.status-active,
[data-theme="dark"] .status-badge[class*="signerat"],
html.dark .status-badge.status-active,
html.dark .status-badge[class*="signerat"] {
  background: rgba(42,176,106,0.18) !important;
  color: #4fd98a !important;
  border: 1px solid rgba(42,176,106,0.35) !important;
}
[data-theme="dark"] .status-badge.status-pending,
[data-theme="dark"] .status-badge[class*="utkast"],
[data-theme="dark"] .status-badge[class*="draft"],
html.dark .status-badge.status-pending,
html.dark .status-badge[class*="utkast"],
html.dark .status-badge[class*="draft"] {
  background: rgba(212,154,10,0.18) !important;
  color: #f0c050 !important;
  border: 1px solid rgba(212,154,10,0.35) !important;
}
[data-theme="dark"] .status-badge.status-blocked,
[data-theme="dark"] .status-badge.status-error,
html.dark .status-badge.status-blocked,
html.dark .status-badge.status-error {
  background: rgba(200,72,72,0.18) !important;
  color: #ff7f7f !important;
  border: 1px solid rgba(200,72,72,0.35) !important;
}

/* ── AV-STATUS (formation specific) ── */
[data-theme="dark"] .av-status,
[data-theme="dark"] [class*="av-status"],
html.dark .av-status,
html.dark [class*="av-status"] {
  color: #dedad2 !important;
}
[data-theme="dark"] .av-status-signerat,
html.dark .av-status-signerat {
  background: rgba(42,176,106,0.18) !important;
  color: #4fd98a !important;
  border: 1px solid rgba(42,176,106,0.35) !important;
}
[data-theme="dark"] .av-status-utkast,
html.dark .av-status-utkast {
  background: rgba(212,154,10,0.18) !important;
  color: #f0c050 !important;
  border: 1px solid rgba(212,154,10,0.35) !important;
}

/* ──────────────────────────────────────────────────────────────────────
   prefers-color-scheme: dark — formation-v2.html / formation.html
   Dessa sidor saknar data-theme-stöd; detta täcker deras CSS-variabler
   ────────────────────────────────────────────────────────────────────── */
@media (prefers-color-scheme: dark) {
  /* Badges — täcker formation-v2.html .bg / .ba / .br vars */
  .badge.bg {
    background: rgba(42,176,106,0.18) !important;
    color: #4fd98a !important;
    border: 1px solid rgba(42,176,106,0.35) !important;
  }
  .badge.ba {
    background: rgba(212,154,10,0.18) !important;
    color: #f0c050 !important;
    border: 1px solid rgba(212,154,10,0.35) !important;
  }
  .badge.br {
    background: rgba(200,72,72,0.18) !important;
    color: #ff7f7f !important;
    border: 1px solid rgba(200,72,72,0.35) !important;
  }
  .badge.bn {
    background: rgba(155,181,214,0.15) !important;
    color: #9bb5d6 !important;
    border: 1px solid rgba(155,181,214,0.25) !important;
  }
  .badge.bgo {
    background: rgba(212,160,48,0.15) !important;
    color: #e4b040 !important;
    border: 1px solid rgba(212,160,48,0.30) !important;
  }

  /* Foundation Charter status-pillar — täcker wsn */
  .wsn.pending {
    background: rgba(255,255,255,0.07) !important;
    border-color: rgba(255,255,255,0.20) !important;
    color: rgba(255,255,255,0.55) !important;
  }

  /* Sidebar wordmark — Inter Tight, ej serif */
  .sb-wordmark {
    font-family: 'Inter Tight', 'Inter', -apple-system, sans-serif !important;
    font-weight: 700 !important;
    letter-spacing: -0.02em !important;
  }
}

/* ──────────────────────────────────────────────────────────────────────
   INLINE STYLE FIXES — dark mode
   Fångar element med hårdkodade vita/svarta inline-stilar
   ────────────────────────────────────────────────────────────────────── */

/* Vita bakgrunder → genomskinligt mörkt overlay i dark mode */
[data-theme="dark"] [style*="background:#fff"],
[data-theme="dark"] [style*="background: #fff"],
[data-theme="dark"] [style*="background:#FFF"],
[data-theme="dark"] [style*="background: #FFF"],
[data-theme="dark"] [style*="background:white"],
[data-theme="dark"] [style*="background: white"],
[data-theme="dark"] [style*="background-color:#fff"],
[data-theme="dark"] [style*="background-color: #fff"],
[data-theme="dark"] [style*="background-color:white"],
html.dark [style*="background:#fff"],
html.dark [style*="background: #fff"],
html.dark [style*="background:#FFF"],
html.dark [style*="background: #FFF"],
html.dark [style*="background:white"],
html.dark [style*="background: white"],
html.dark [style*="background-color:#fff"],
html.dark [style*="background-color: #fff"],
html.dark [style*="background-color:white"] {
  background: rgba(255,255,255,0.05) !important;
  border-color: rgba(255,255,255,0.12) !important;
}

/* Svart text → ljust i dark mode */
[data-theme="dark"] [style*="color:#000"],
[data-theme="dark"] [style*="color: #000"],
[data-theme="dark"] [style*="color:#000000"],
[data-theme="dark"] [style*="color:black"],
[data-theme="dark"] [style*="color: black"],
html.dark [style*="color:#000"],
html.dark [style*="color: #000"],
html.dark [style*="color:#000000"],
html.dark [style*="color:black"],
html.dark [style*="color: black"] {
  color: #dedad2 !important;
}

/* ──────────────────────────────────────────────────────────────────────
   SIDEBAR BRAND — "AAMOS DYNASTY" → "AAMOS Pro"
   Döljer DYNASTY-texten och ersätter med Pro (CSS-trick för sidor
   som inte kan patchas i HTML direkt)
   ────────────────────────────────────────────────────────────────────── */

/* formation-v2.html + formation.html sidebar wordmark */
.sb-wordmark {
  font-family: 'Inter Tight', 'Inter', -apple-system, sans-serif !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
  font-size: 20px !important;
}
.sb-wordmark em {
  /* DYNASTY em-tag */
  font-style: normal !important;
  font-family: inherit !important;
}

/* sb-tag under wordmark — ta bort "Build Your Empire" */
.sb-tag {
  display: none !important;
}

/* dynasty-dashboard brand text */
.brand {
  font-family: 'Inter Tight', 'Inter', -apple-system, sans-serif !important;
}

/* ──────────────────────────────────────────────────────────────────────
   LIGHT MODE — Säkerställ cream-white bakgrund och kontrast
   ────────────────────────────────────────────────────────────────────── */
[data-theme="light"] body,
html.light body,
body.light {
  background: #FAFAF7 !important;
  color: #0a1628 !important;
}

/* Badges i light mode — tydliga färger */
[data-theme="light"] .badge.bg,
html.light .badge.bg,
body.light .badge.bg {
  background: #f0f8f4 !important;
  color: #1a5c3a !important;
  border: 1px solid #b8ddc9 !important;
}
[data-theme="light"] .badge.ba,
html.light .badge.ba,
body.light .badge.ba {
  background: #fff8ec !important;
  color: #7a4f00 !important;
  border: 1px solid #f5d78c !important;
}
[data-theme="light"] .badge.br,
html.light .badge.br,
body.light .badge.br {
  background: #fdf2f2 !important;
  color: #8b1a1a !important;
  border: 1px solid #f0b8b8 !important;
}

/* AAMOS badges i light mode */
[data-theme="light"] .aamos-badge-status-active,
html.light .aamos-badge-status-active {
  background: rgba(45,122,74,0.12) !important;
  color: #1a5c3a !important;
  border: 1px solid rgba(45,122,74,0.25) !important;
}
[data-theme="light"] .aamos-badge-status-pending,
html.light .aamos-badge-status-pending {
  background: rgba(184,115,15,0.12) !important;
  color: #7a4f00 !important;
  border: 1px solid rgba(184,115,15,0.25) !important;
}
[data-theme="light"] .aamos-badge-status-blocked,
html.light .aamos-badge-status-blocked {
  background: rgba(184,51,45,0.10) !important;
  color: #8b1a1a !important;
  border: 1px solid rgba(184,51,45,0.20) !important;
}

/* Status-pillar (Foundation Charter) i light mode */
[data-theme="light"] .wsn.pending,
html.light .wsn.pending {
  background: #f5f4ee !important;
  border-color: #dfddd8 !important;
  color: #6b6860 !important;
}

/* Sidebar i light mode */
[data-theme="light"] .sidebar,
html.light .sidebar,
body.light .sidebar {
  background: #F5F4EE !important;
  border-right: 1px solid #E2DDD0 !important;
}

/* Sidebar text i light mode (formation-v2.html sidebar är navy) */
[data-theme="light"] .sb-wordmark,
html.light .sb-wordmark,
body.light .sb-wordmark {
  color: #fff !important; /* sidebar är mörk, text förblir vit */
}

/* ──────────────────────────────────────────────────────────────────────
   TABLE — Kontrast i båda modes
   ────────────────────────────────────────────────────────────────────── */

/* Dark mode table headers */
[data-theme="dark"] table th,
html.dark table th {
  background: rgba(255,255,255,0.04) !important;
  color: rgba(255,255,255,0.6) !important;
  border-color: rgba(255,255,255,0.08) !important;
}
[data-theme="dark"] table td,
html.dark table td {
  border-color: rgba(255,255,255,0.05) !important;
  color: #dedad2 !important;
}

/* Light mode table */
[data-theme="light"] table th,
html.light table th {
  background: #F5F4EE !important;
  color: #0a1628 !important;
  border-color: #E2DDD0 !important;
}
[data-theme="light"] table td,
html.light table td {
  border-color: #E2DDD0 !important;
  color: #0a1628 !important;
}

/* ──────────────────────────────────────────────────────────────────────
   SIDEBAR LOGO-MARK — Inter Tight font
   ────────────────────────────────────────────────────────────────────── */
.sb-logo-mark {
  font-family: 'Inter Tight', 'Inter', -apple-system, sans-serif !important;
  font-weight: 800 !important;
}
.sb-logo-name {
  font-family: 'Inter Tight', 'Inter', -apple-system, sans-serif !important;
  font-weight: 700 !important;
}

/* ──────────────────────────────────────────────────────────────────────
   AAMOS-BRAND.CSS LIGHT MODE divider synlighet
   ────────────────────────────────────────────────────────────────────── */
[data-theme="light"] .aamos-divider,
html.light .aamos-divider,
body.light .aamos-divider {
  border-color: #E2DDD0 !important;
  opacity: 1 !important;
}

/* ──────────────────────────────────────────────────────────────────────
   FORMATION-V2.HTML SPECIFIC — dark mode wsn (wizard step numbers)
   ────────────────────────────────────────────────────────────────────── */
[data-theme="dark"] .wsn.pending,
html.dark .wsn.pending {
  background: rgba(255,255,255,0.06) !important;
  border-color: rgba(255,255,255,0.18) !important;
  color: rgba(255,255,255,0.45) !important;
}

/* ──────────────────────────────────────────────────────────────────────
   COMPLIANCE + DYNASTY DASHBOARDS
   ────────────────────────────────────────────────────────────────────── */

/* dynasty brand label */
.brand span {
  font-family: 'Inter Tight', 'Inter', -apple-system, sans-serif !important;
}

/* ──────────────────────────────────────────────────────────────────────
   PRINT LOGO — ta bort DYNASTY
   ────────────────────────────────────────────────────────────────────── */
.print-logo em {
  display: none !important;
}
.print-logo::after {
  content: " Pro";
}

/* ──────────────────────────────────────────────────────────────────────
   WALLENBERG PITCH — light mode only (force)
   ────────────────────────────────────────────────────────────────────── */
body[class*="pitch"],
.pitch-body {
  background: #FAFAF7 !important;
  color: #0a1628 !important;
}