/*
  Blechmodul-Werkbank: Tokens (Designuebergabe 25.09.2026, tokens.css).

  WARUM EINE EIGENE DATEI
  -----------------------
  Der Entwurf liefert Rollen als CSS-Variablen. Markenwerte bleiben aus
  main.css, die Werkbank-Rollen (--ai-*) aus ai-werkbank.css; neu sind nur
  die Rollen mit Praefix --bm- (Zonen, Buehne, Masse, Bottom Sheet).

  Geladen NACH ai-werkbank.css und VOR blech-modul.css (base.html).

  Zwei Werte des Entwurfs gelten fuer die GANZE Werkbank:
    * --ai-kopf-hoehe 44 px (war 48; Entscheidung Christian 25.09.2026 -
      noetig fuer >= 60 % Buehne bei 1280 x 720).
  Alles, was die Formensprache der uebrigen Assistent-Schritte veraendern
  wuerde (deckende Felder, schmalere Panels, kleinere Knopfradien), gilt
  nur im Blechmodus `.ai-werkbank.ai-dialog-blech` - Katalog, Formular und
  Preis der anderen Familien sehen aus wie bisher.
*/

:root {
    --ai-kopf-hoehe: 44px;

    /* Zonen der Werkbank */
    --bm-kopf-bg: #0f1113;
    --bm-befehl-bg: #14171b;
    --bm-befehl-hoehe: 52px;
    --bm-liste-bg: #111316;
    --bm-liste-breite: 248px;
    --bm-liste-leiste: 56px;
    --bm-fuss-bg: #0f1113;
    --bm-fuss-hoehe: 56px;
    --bm-modus-bg: #1b1325;
    --bm-modus-rand: rgba(178, 92, 247, 0.55);
    --bm-trenner: rgba(255, 255, 255, 0.08);

    /* Buehne (hell) */
    --bm-buehne-bg: #f7f8fa;
    --bm-raster-fein: rgba(28, 33, 38, 0.06);
    --bm-raster-grob: rgba(28, 33, 38, 0.13);
    --bm-linie: #1c2126;
    --bm-linie-2: #5b6470;
    --bm-teil-hell: hsl(213 9% 76%);
    --bm-teil-dunkel: hsl(213 9% 36%);
    --bm-mass-x: #7a1fc7;
    --bm-mass-y: #0f7f86;
    --bm-fehler-auf-hell: #c42b44;
    --bm-naht: #ce90a6;
    --bm-gummiband: #9e27fb;
    --bm-fadenkreuz: rgba(122, 31, 199, 0.55);

    /* Text auf dunkel */
    --bm-text-3: #a3a8af;
    --bm-text-4: #8d939b;
    --bm-link: #d6b3f8;
    --bm-cta-text: #171121;
    /* Hauptknopf: Marken-Verlauf auch ohne theme-marke (angemeldete Mitarbeiter
       haben ein anderes Farbthema ohne --cta-gradient - der Knopf war dort ohne
       Hintergrund und nur beim Ueberfahren sichtbar, 26.09.2026). */
    --bm-cta-bg: var(--cta-gradient, linear-gradient(100deg, #f6e760 0%, #f2dd68 45%, #ce90a6 115%));
    --bm-beispiel: #e8dc6a;

    /* Typografie (Inter 4.1, lokal) */
    --bm-schrift: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --bm-t-11: 0.6875rem;
    --bm-t-12: 0.75rem;
    --bm-t-13: 0.8125rem;
    --bm-t-14: 0.875rem;
    --bm-t-15: 0.9375rem;
    --bm-t-16: 1rem;
    --bm-t-18: 1.125rem;

    /* Bottom Sheet (Handy) */
    --bm-sheet-radius: 18px 18px 0 0;

    /* Bewegung */
    --bm-halten: 350ms;
    --bm-touch-versatz: 76px;
}

/* Nur im Blechmodus: deckende Zonen statt Glas, Panelbreite nach Fenster. */
.ai-werkbank.ai-dialog-blech {
    --ai-feld-bg: #14171b;
    --ai-feld-bg-stark: #14171b;
    --ai-feld-rand: rgba(255, 255, 255, 0.08);
    --ai-rolle-auswahl-weich: rgba(158, 39, 251, 0.2);
    --ai-knopf-radius: 10px;
    --ai-panel-breite: 248px;
    --ai-buehne-bg: var(--bm-buehne-bg);
}

@media (min-width: 1360px) {
    .ai-werkbank.ai-dialog-blech {
        --ai-panel-breite: 288px;
    }
}

@media (min-width: 1600px) {
    .ai-werkbank.ai-dialog-blech {
        --ai-panel-breite: 320px;
    }
}

@media (prefers-reduced-motion: reduce) {
    :root {
        --ai-dauer: 0ms;
    }
}