/*
 * newLook - Tokens, Farbschema 05: Cyan / Graphit
 *
 * Cyan auf Graphit - der hoechste Kontrast der fuenf. Schwarz traegt hier am meisten: Info, Ueberschriften, Tooltips.
 *
 * Aktivieren:   cp tokens_05.css tokens.css
 * Zurueck:      cp tokens_green.css tokens.css   (INSPINIA-Tuerkis, der Ausgangsstand)
 *
 * Gleicher Variablensatz wie tokens.css - newlook.css und legacy-bridge.css
 * brauchen nichts zu wissen. Je Akzent ein Quartett: gefuellt / hover / heller
 * Grund (Badges, Alerts) / Text auf dem hellen Grund. Die vier gehoeren zusammen.
 * Alles ab "Schrift" ist in allen fuenf Schemata identisch.
 */

:root {

    /* ---- Farben: Akzente ------------------------------------------------- */
    --nl-primary:         #0c7c98;   /* Knoepfe, aktive Navigation, Fokus #0891b2; */
    --nl-primary-hover:   #0e7490;
    --nl-primary-soft:    #cffafe;
    --nl-primary-text:    #155e75;
    --nl-link:            #0891b2;   /* Links = Primaerton, klar erkennbar */

    --nl-navy:             #111827;   /* Tooltips, inverse Badges - das "Schwarz dazwischen" */

    --nl-success:         #16a34a;
    --nl-success-hover:   #15803d;
    --nl-success-soft:    #dcfce7;
    --nl-success-text:    #166534;

    --nl-warning:         #dda01e;
    --nl-warning-hover:   #a16207;
    --nl-warning-soft:    #fef9c3;
    --nl-warning-text:    #5c3606;

    --nl-danger:          #dc2626;
    --nl-danger-hover:    #b91c1c;
    --nl-danger-soft:     #fee2e2;
    --nl-danger-text:     #991b1b;

    --nl-info:            #111827;   /* Schwarz: Info-Badges und -Alerts */
    --nl-info-hover:      #030712;
    --nl-info-soft:       #e5e7eb;
    --nl-info-text:       #111827;

    --nl-neutral-soft:     #e5e7eb;   /* Badge ohne Farbklasse */
    --nl-neutral-text:     #4b5563;

    /* ---- Farben: Flaechen und Text --------------------------------------- */
    --nl-text:             #374151;
    --nl-text-strong:      #111827;   /* Ueberschriften - dasselbe Schwarz wie info */
    --nl-text-muted:       #6b7280;
    --nl-border:           #e5e7eb;
    --nl-border-strong:    #d1d5db;
    --nl-bg-page:          #f7f9fb;
    --nl-bg-card:          #ffffff;
    --nl-bg-subtle:        #fbfcfd;   /* Tabellenkoepfe, Kartenkoepfe, Zebra */
    --nl-bg-hover:         #eef2f6;

    /* ---- Schrift ---------------------------------------------------------- */
    /* Entscheidung 3: Inter. Barlow bleibt an zweiter Stelle - Rueckweg:
       die beiden Namen tauschen und in den Layouts den Google-Fonts-Link. */
    --nl-font-body:        "Inter", "Barlow", system-ui, -apple-system, "Segoe UI", sans-serif;
    --nl-font-heading:     "Inter", "Barlow Semi Condensed", system-ui, -apple-system, "Segoe UI", sans-serif;
    --nl-font-mono:        ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    --nl-font-size:        14px;
    --nl-font-size-sm:     13px;
    --nl-font-size-xs:     12px;
    --nl-line-height:      1.5;

    /* ---- Form ------------------------------------------------------------- */
    --nl-radius-sm:        4px;
    --nl-radius:           6px;
    --nl-radius-lg:        10px;
    --nl-radius-pill:      100px;
    --nl-shadow-card:      0 1px 2px rgba(35, 46, 60, .04), 0 1px 3px rgba(35, 46, 60, .06);
    --nl-shadow-pop:       0 6px 24px rgba(35, 46, 60, .14);
    --nl-shadow-focus:     0 0 0 3px rgba(8, 145, 178, .22);

    /* ---- Abstaende -------------------------------------------------------- */
    --nl-space-1:          4px;
    --nl-space-2:          8px;
    --nl-space-3:          12px;
    --nl-space-4:          16px;
    --nl-space-5:          24px;
    --nl-space-6:          32px;

    /* ---- Steuerelemente --------------------------------------------------- */
    --nl-control-height:   36px;
    --nl-control-height-sm: 30px;
    --nl-control-height-xs: 24px;
}