/* tokens.css — Farbachse „Aurora Editorial" für MiMa (Plan v1.2, W2-A · Entscheide E2/E11)
 *
 * MiMa verlässt hier bewusst die Hausfarben Blau/Orange. Es ist die einzige OSP-App, die
 * nicht im Intranet und App-Launcher verlinkt ist und einen geschlossenen Nutzerkreis hat —
 * die eigene Farbwelt macht auf einen Blick klar, dass man in vertraulichen Personaldaten
 * steht.
 *
 * ⚠️ Blutrot ist MARKE, nicht Status. Es trägt Sidebar, Kopfzeile und Primärknopf und
 * erscheint NIE als Zeilen- oder Zellfarbe. Statusaussagen laufen über Jade, Bernstein und
 * ein helles Signal-Orange, immer zusammen mit einer Form — nie über Farbe allein. Die
 * Punkteskala 0–5 läuft von Grau nach Jade, nicht als Ampel: Eine 1 ist eine Lücke, die
 * geschlossen werden kann, keine Störung.
 *
 * Diese Datei wird NACH /shared/dark-mode.css geladen und überschreibt dessen Tokens.
 * Die gemeinsamen Namen (--color-*) bleiben erhalten — die rund 900 bestehenden Regeln in
 * style.css laufen dadurch unverändert weiter, und NZA, RMS und Intranet bleiben unberührt.
 */

/* ================= Hell (Standard) ================= */
:root, html:not(.dark) {
  /* Marke */
  --color-primary:       #7B1E22;   /* Blutrot */
  --color-primary-dark:  #5A1418;
  --color-primary-deep:  #4A1015;   /* Sidebar */
  --color-primary-light: #9B3038;

  /* Akzent: Jade — aktive Navigation, Erfolg, Skalenende */
  --color-accent:        #2F6E4F;
  --color-accent-dark:   #24563E;

  /* Signalfarben */
  --color-success: #2F855A;
  --color-warning: #B7791F;
  --color-danger:  #C2410C;
  --color-info:    #2F6E4F;
  --color-purple:  #6B4E71;

  /* Flächen — warmes Papier statt kaltem Grau */
  --color-bg:           #F7F4F1;
  --color-card:         #FFFFFF;
  --color-bg-light:     #F1EBE6;
  --color-border:       #E3D9D2;
  --color-border-light: #EFE8E3;
  --color-text:         #241A18;
  --color-text-muted:   #5C4B45;
  --color-text-lighter: #77645C;

  --color-overlay:      rgba(36, 26, 24, .42);
  --color-loading-bg:   rgba(255, 255, 255, .9);
  --color-hover-row:    #F6EFEC;
  --color-table-stripe: #FBF8F6;
  --color-input-border: #E3D9D2;

  --shadow-unified:       0 1px 3px rgba(74, 16, 21, .08);
  --shadow-hover-unified: 0 4px 16px rgba(74, 16, 21, .12);
  --shadow-modal:         0 24px 60px rgba(36, 26, 24, .22);
  --shadow-focus:         0 0 0 3px rgba(123, 30, 34, .18);

  /* Feedback bleibt bewusst außerhalb der Blutrot/Jade-Achse (FB-2026-009) */
  --signal-orange: #DC500F;

  /* Flächen von Knöpfen sind eigene Token: Dieselbe Farbe kann nicht zugleich als Text
     auf hellem Grund (braucht hell im Dunkelmodus) und als Fläche unter weißer Schrift
     (braucht dunkel) taugen. Weiß auf diesen Flächen erreicht 4.5:1 in beiden Fassungen. */
  --btn-primary-bg: #7B1E22;
  --btn-accent-bg:  #2A6247;
  --btn-signal-bg:  #BC420C;

  /* Statusflächen (Badges, Ampeln) */
  --ok-bg:  #E6F2EB;  --ok-fg:  #216B45;  --ok-li: #BFDFCD;
  --warn-bg: #FBF1DF; --warn-fg: #8A5B12;
  --err-bg: #FBEBE3;  --err-fg: #9A340B;  --err-li: #F0C9B4;
  --neutral-bg: #F1EBE6; --neutral-fg: #7C6A63;

  /* Pastellflächen kleiner Kennzeichnungen */
  --tag-blau-bg: #E7EFEB; --tag-blau-fg: #2A5B44;
  --tag-lila-bg: #EFE9F1; --tag-lila-fg: #5A4360;
  --tag-gruen-bg: #E6F2EB; --tag-gruen-fg: #216B45; --tag-gruen-li: #BFDFCD;
  --tag-gelb-bg: #FBF1DF; --tag-gelb-fg: #8A5B12; --tag-gelb-li: #EBD3A3;

  /* Glas-Optik der Karten (design-v2.css) */
  --glass-bg:      rgba(255, 255, 255, .72);
  --glass-border:  rgba(255, 255, 255, .55);
  --glass-blur:    blur(22px) saturate(170%);
  --glass-shadow:  0 8px 32px rgba(74, 16, 21, .10);
  --aurora-op:     .50;

  /* Aurora-Lichter: vier aus der eigenen Achse, ein warmes Bernstein als fünftes (E11) */
  --aurora-1: #7B1E22;  --aurora-2: #9B3038;  --aurora-3: #2F6E4F;
  --aurora-4: #1F4D3A;  --aurora-5: #B7791F;

  /* Verlauf der Seitenleiste — eigene Token, damit die Fläche im Dunkeln nicht
     vom aufgehellten Marken-Ton getragen wird (der ist für Text gedacht). */
  --sidebar-von: #4A1015;  --sidebar-bis: #6B191E;

  /* Punkteskala der Matrix: Grau → Jade */
  --mx-null-bg: #EFE9E5;  --mx-null-fg: #6B5A53;
  --mx-1-bg: #EFF5F1;     --mx-2-bg: #DFEDE5;
  --mx-3-bg: #C6E0D1;     --mx-4-bg: #9CCDB2;
  --mx-5-bg: #6EB994;     --mx-p-fg: #12351F;
  --mx-v-on: #2F855A;     --mx-v-off: #CBBEB7;
  --mx-eng: #B7791F;
}

/* ================= Dunkel ================= */
html.dark, :root[data-theme="dark"] {
  --color-primary:       #E4787C;   /* aufgehelltes Blutrot — trägt Text, nicht Flächen */
  --color-primary-dark:  #B8434A;
  --color-primary-deep:  #23100F;   /* Sidebar */
  --color-primary-light: #E88A8E;

  --color-accent:        #4FA47A;
  --color-accent-dark:   #3E8C63;

  --color-success: #4FA47A;
  --color-warning: #D9A441;
  --color-danger:  #E4713F;
  --color-info:    #4FA47A;
  --color-purple:  #A98FB0;

  --color-bg:           #16110F;
  --color-card:         #211A18;
  --color-bg-light:     #2C2320;
  --color-border:       #40332F;
  --color-border-light: #332A26;
  --color-text:         #F4EDE8;
  --color-text-muted:   #C6B7B0;
  --color-text-lighter: #94837C;

  --color-overlay:      rgba(10, 6, 5, .72);
  --color-loading-bg:   rgba(22, 17, 15, .9);
  --color-hover-row:    rgba(212, 87, 92, .09);
  --color-table-stripe: rgba(44, 35, 32, .5);
  --color-input-border: #40332F;

  --shadow-unified:       0 1px 3px rgba(0, 0, 0, .4);
  --shadow-hover-unified: 0 4px 16px rgba(0, 0, 0, .5);
  --shadow-modal:         0 24px 60px rgba(0, 0, 0, .6);
  --shadow-focus:         0 0 0 3px rgba(212, 87, 92, .28);

  --signal-orange: #F2762E;
  --btn-primary-bg: #8E2A2F;
  --btn-accent-bg:  #2A6247;
  --btn-signal-bg:  #A83A0A;

  --ok-bg:  rgba(79, 164, 122, .18);  --ok-fg:  #86D6AA;  --ok-li: rgba(79, 164, 122, .38);
  --warn-bg: rgba(217, 164, 65, .18); --warn-fg: #EBC77E;
  --err-bg: rgba(228, 113, 63, .18);  --err-fg: #F0A57F;  --err-li: rgba(228, 113, 63, .38);
  --neutral-bg: rgba(148, 131, 124, .16); --neutral-fg: #B4A49D;

  --tag-blau-bg: rgba(79, 164, 122, .16); --tag-blau-fg: #86D6AA;
  --tag-lila-bg: rgba(169, 143, 176, .16); --tag-lila-fg: #C9B2CE;
  --tag-gruen-bg: rgba(79, 164, 122, .16); --tag-gruen-fg: #86D6AA; --tag-gruen-li: rgba(79, 164, 122, .35);
  --tag-gelb-bg: rgba(217, 164, 65, .16); --tag-gelb-fg: #EBC77E; --tag-gelb-li: rgba(217, 164, 65, .35);

  /* Im Dunkeln ist das Glas dichter und die Aurora blasser — sonst wird Text unlesbar
     (Regel 5 des Bauplans). */
  --glass-bg:     rgba(33, 26, 24, .62);
  --glass-border: rgba(255, 255, 255, .08);
  --glass-shadow: 0 8px 32px rgba(0, 0, 0, .45);
  --aurora-op:    .34;

  --aurora-1: #8E2429;  --aurora-2: #6B1F24;  --aurora-3: #2F6E4F;
  --aurora-4: #1B4133;  --aurora-5: #8A5B12;

  --sidebar-von: #1E0D0C;  --sidebar-bis: #351416;

  --mx-null-bg: rgba(148, 131, 124, .14);  --mx-null-fg: #A6968F;
  --mx-1-bg: rgba(47, 133, 90, .12);       --mx-2-bg: rgba(47, 133, 90, .24);
  --mx-3-bg: rgba(47, 133, 90, .38);       --mx-4-bg: rgba(47, 133, 90, .54);
  --mx-5-bg: rgba(47, 133, 90, .74);       --mx-p-fg: #EAF7F0;
  --mx-v-on: #4FA47A;                      --mx-v-off: #574843;
  --mx-eng: #D9A441;
}
