/*
 * fc-tokens.css — die eine Farbquelle für alles, was FitCONNECT im Browser
 * zeigt: Website, Shop und Partner-Konsole.
 *
 * ── Warum diese Datei existiert ──────────────────────────────────────────────
 * Die App sagt in `Frontend_v2/lib/widget/common/brand.dart`
 * `#667EEA → #AB68FF`. Die Stylesheets sagten `#667EEA → #764BA2`. Zwei
 * Violett, die auffallen, sobald ein Partner zwischen App und Konsole
 * wechselt. Ab hier steht der Wert an genau einer Stelle.
 *
 * ── Das Farbgesetz ──────────────────────────────────────────────────────────
 *   Violett  heißt "das ist FitCONNECT"  (Identität, nie ein Knopf)
 *   Rosé     heißt "drück hier"          (genau EINE Aktion je Ansicht,
 *                                         immer mit weißem Inhalt)
 *   Amber    liegt passiv                (Haken, fokussierter Rahmen, Icon)
 *   Grün/Bernstein/Rot sind Buchungs-ZUSTÄNDE und zählen nicht als Akzent.
 *
 * Gegenstück in der App: `brand.dart` (kBrandA/kBrandB/kActionRose/
 * kAccentAmber). Wer hier etwas ändert, ändert es dort mit — sonst beginnt
 * die Drift von vorn.
 *
 * ── Benutzung ───────────────────────────────────────────────────────────────
 * Immer mit Rückfallwert schreiben:  var(--fc-brand-b, #AB68FF)
 * Wird die Datei auf einer Seite vergessen, fällt eine `var()` ohne Rückfall
 * auf "ungültig" zurück und die Fläche verschwindet, statt nur falsch zu sein.
 */

:root {
  /* ── Identität ── */
  --fc-brand-a: #667EEA;   /* kBrandA */
  --fc-brand-b: #AB68FF;   /* kBrandB */
  --fc-brand-a-rgb: 102, 126, 234;
  --fc-brand-b-rgb: 171, 104, 255;
  --fc-brand-a-deep: #5A6FD6;
  --fc-brand-b-deep: #8B4FE0;

  --fc-brand-grad: linear-gradient(135deg, #667EEA 0%, #AB68FF 100%);
  --fc-brand-grad-deep: linear-gradient(135deg, #5A6FD6 0%, #8B4FE0 100%);

  /* ── Aktion ── */
  --fc-action: #EC4899;    /* kActionRose */
  --fc-action-rgb: 236, 72, 153;
  --fc-action-ink: #FFFFFF;

  /* ── Passiver Akzent ── */
  --fc-amber: #FFC107;     /* kAccentAmber */
  --fc-amber-rgb: 255, 193, 7;

  /* ── Buchungszustände (kein Akzent, eine Bedeutung) ──
   *
   * Gegenstück in der App: `BookingStateColors` in
   * `Frontend_v2/lib/widget/common/booking_status_style.dart`. Die Werte sind
   * paarweise gleich; wer hier einen ändert, ändert ihn dort mit.
   *
   * "Voll" ist nicht dasselbe wie "abgelehnt", auch wenn beide rot sind: das
   * eine ist eine Kapazität, das andere eine Entscheidung. Sie teilen sich
   * den Wert, aber jeder Zustand hat seinen eigenen Namen, damit eine
   * spätere Trennung an einer Stelle passiert.
   */
  --fc-state-ok: #10B981;      /* bestätigt / noch Plätze frei */
  --fc-state-open: #F59E0B;    /* offen / angefragt            */
  --fc-state-off: #EF4444;     /* abgelehnt                    */
  --fc-state-full: #EF4444;    /* complet — kein Platz mehr    */
  --fc-state-mine: #FF7A45;    /* die eigene Buchung           */
  --fc-state-idle: #8E8CA3;    /* geschlossen / nicht verfügbar */
  --fc-state-ok-rgb: 16, 185, 129;
  --fc-state-open-rgb: 245, 158, 11;
  --fc-state-off-rgb: 239, 68, 68;
  --fc-state-full-rgb: 239, 68, 68;
  --fc-state-mine-rgb: 255, 122, 69;
  --fc-state-idle-rgb: 142, 140, 163;

  /* ── Form ──
   *
   * Der Gratuit-Dialog gibt die Radien vor: 28 für ein Blatt, das über allem
   * liegt, 24 für eine Fläche darunter. Sie standen im Browser als 22, 18,
   * 16, 14 und 12 verteilt herum — fünf Radien ohne Grund.
   */
  --fc-radius-dialog: 28px;
  --fc-radius-card: 24px;
  --fc-radius-panel: 16px;
  --fc-radius-pill: 999px;

  /* ── Bewegung ──
   * Ruhig, nicht nervös. Wer eine längere Dauer braucht, hat vermutlich eine
   * Animation gebaut, die niemand sehen will.
   */
  --fc-motion: 180ms;
  --fc-motion-slow: 240ms;
  --fc-ease: cubic-bezier(.22, .61, .36, 1);
}

/*
 * Wer „weniger Bewegung" eingestellt hat, bekommt sie nicht.
 *
 * Das ist keine Höflichkeit: Bewegung löst bei vestibulären Störungen
 * Schwindel und Übelkeit aus. Die Gestaltung darf davon nicht abhängen —
 * jeder Zustand muss auch stillstehend ablesbar sein.
 */
@media (prefers-reduced-motion: reduce) {
  :root {
    --fc-motion: 0ms;
    --fc-motion-slow: 0ms;
  }
}