/* ============================================================================
   @immo24/ui — Design-Tokens
   Basis: Skill immo24-themes v1.3.1 (Werte unverändert übernommen)
   Ergänzt um die Rollen-Tokens, die im Bestand gefehlt haben.

   Regel: im Markup NUR var(--token). Nie Hex.
   ============================================================================ */

@import url('https://fonts.googleapis.com/css2?family=Barlow:wght@400;500;600;700&display=swap');

:root {
  /* ── Marke (unverändert aus immo24-themes) ─────────────────────────────── */
  --navy:       #1a3a5c;
  --navy-dark:  #122843;
  --navy-light: #254d7a;
  --accent:     #B8CC3A;
  --amber:      #d99826;

  /* ── Flächen & Text ────────────────────────────────────────────────────── */
  --bg:      #f9fafb;
  --bg-soft: #f3f4f6;
  --white:   #ffffff;
  --text:    #111827;
  --muted:   #6b7280;
  --border:  #e5e7eb;
  --red:     #dc2626;
  --green:   #16a34a;

  /* ── Textfarbe AUF Flächen ─────────────────────────────────────────────── */
  --on-navy:   #ffffff;      /* 11,64 : 1  ✔ */
  --on-accent: var(--navy);  /* 8,32 : 1   ✔ — NEU.
                                Weiß auf Akzent wären 1,79 : 1. Es gab dieses Token
                                bisher nicht, deshalb wurde --on-navy zweckentfremdet
                                und die Kontrastregel im ETV auf drei Knöpfen verletzt
                                (Befund E8, u. a. „TOP abschließen"). */

  /* ── Knopf-Rollen: macht die richtige Wahl zur bequemen Wahl ───────────── */
  --btn-primary-bg:   var(--navy);
  --btn-primary-fg:   var(--on-navy);
  --btn-primary-bg-h: var(--navy-light);
  --btn-ghost-fg:     var(--navy);
  --btn-danger-bg:    var(--red);
  --btn-danger-fg:    #ffffff;

  /* ── Navigation (neu — die Grammatik, die beide Apps gemeinsam bekommen) ─ */
  --nav-bg:          var(--navy);       /* eine Seitenleisten-Helligkeit für beide */
  --nav-fg:          rgba(255,255,255,.82);
  --nav-fg-strong:   #ffffff;
  --nav-active-bg:   var(--accent);
  --nav-active-fg:   var(--on-accent);  /* NIE weiß */
  --nav-group-fg:    rgba(255,255,255,.45);
  --nav-hover-bg:    rgba(255,255,255,.10);
  --nav-w:           240px;
  --nav-w-collapsed: 64px;
  --topbar-h:        56px;
  --bottombar-h:     60px;

  /* ── Abstandsskala (neu — fehlte im Bestand komplett) ──────────────────── */
  --sp-1: 4px;   --sp-2: 8px;   --sp-3: 12px;  --sp-4: 16px;
  --sp-5: 24px;  --sp-6: 32px;  --sp-7: 48px;  --sp-8: 64px;

  /* ── Schriftskala (neu) ────────────────────────────────────────────────── */
  --fs-xs: .75rem;  --fs-sm: .875rem; --fs-md: 1rem;
  --fs-lg: 1.25rem; --fs-xl: 1.5rem;  --fs-2xl: 2rem;
  --lh-tight: 1.25; --lh-normal: 1.5;

  /* ── Form ──────────────────────────────────────────────────────────────── */
  --radius:    6px;
  --radius-lg: 10px;
  --radius-pill: 999px;
  --shadow-sm: 0 1px 3px rgba(0,0,0,.08);
  --shadow:    0 4px 16px rgba(0,0,0,.10);
  --shadow-lg: 0 8px 32px rgba(0,0,0,.14);

  /* ── Klickflächen (Nutzerwunsch: große Schaltflächen; Handy gleichwertig) ─ */
  --touch-min: 44px;
  --touch-comfort: 56px;

  /* ── Schrift ───────────────────────────────────────────────────────────── */
  --font: 'Barlow', system-ui, sans-serif;

  /* ── Status ────────────────────────────────────────────────────────────── */
  --chip-info-bg: rgba(37,99,235,.10);   --chip-info-fg: #2563eb;
  --chip-warn-bg: rgba(217,152,38,.16);  --chip-warn-fg: #b9791a;
  --chip-ok-bg:   rgba(22,163,74,.12);   --chip-ok-fg:   #16a34a;
  --chip-danger-bg: rgba(220,38,38,.12); --chip-danger-fg: #dc2626;

  /* ── Umbruchpunkte (als Dokumentation; @media braucht feste Werte) ─────── */
  --bp-mobile: 640px;   /* darunter: untere Leiste statt Seitenleiste */
  --bp-tablet: 1024px;  /* darunter: Seitenleiste eingeklappt */
}