/* ============================================
   CSS VARIABLES (Theme)
   ============================================ */

:root{
  --font-sans: "Segoe UI", sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;

  --bg-page: #fdf6f6;
  --bg-surface: #ffffff;

  --text: #3a1a1a;
  --text-inverse: #ffffff;

  --brand: #a94442;
  --brand-strong: #d43f3a;

  --sidebar-bg: #f2dede;
  --border-soft: #ebcccc;
  --border-card: #e4b9b9;

  --hover-soft: #f9cfcf;

  --shadow-1: 0 2px 4px rgba(0,0,0,0.1);

  --radius-4: 4px;
  --radius-5: 5px;
  --radius-8: 8px;
  --radius-10: 10px;

  --space-0: 0;
  --space-2: 2px;
  --space-3: 3px;
  --space-5: 5px;
  --space-6: 6px;
  --space-7: 7px;
  --space-8: 8px;
  --space-10: 10px;
  --space-12: 12px;
  --space-15: 15px;
  --space-20: 20px;
  --space-25: 25px;
  --space-30: 30px;
  --space-40: 40px;

  --z-sidebar-mobile: 999;

  /* Log level colors (logviewer.css) */
  --log-bg: #111111;
  --log-border: var(--brand);
  --log-text: #eeeeee;
  --log-line-border: #333333;

  --log-debug-bg: #222222;
  --log-debug-text: #aaaaaa;

  --log-info-bg: #004477;
  --log-info-text: #cceeff;

  --log-warn-bg: #663c00;
  --log-warn-text: #ffcc00;

  --log-error-bg: #660000;
  --log-error-text: #ffcccc;

  /* Neue Variablen fürs überarbeitete Design
/* ============================================
   VARIABLES
   - zentrale Farbpalette + Basistokens
============================================ */

  /* Base */
  --color-white: #fff;
  --color-black: #000;

  /* Farben für List_Cards pro Module */
  --color-members: #17a2b8; /* Mitglieder - Info */
  --color-horses:  #fd7e14; /* Pferde - Orange */
  --color-lessons: #20c997; /* Unterricht - Success */
  --color-storage: #6610f2; /* Lager - Edit */
  --color-users:   #e83e8c; /* Benutzer - Danger */ 
  
  /* Page */
  --color-bg: #faf7f7;
  --color-text: #3a1a1a;
  --color-heading: #4a1a1a;

  /* Brand / Actions */
  --color-primary: #0d6efd;     /* Info/View */
  --color-edit: #6f42c1;        /* Edit */
  --color-success: #28a745;     /* Success */
  --color-warning: #ffc107;     /* Warning */
  --color-danger: #dc3545;      /* Danger/Delete */
  --color-secondary: #6c757d;   /* Neutral */
  --color-filter: #f0f0f0;      /* Filter */

  /* Borders / neutrals */
  --color-border-soft: #e5cccc;
  --color-border: #e6e6e6;
  --color-border-2: #e0e0e0;
  --color-row-alt: #fafafa;
  --color-hover-bg: #f7f7f7;

  --color-muted: #666;
  --color-muted-2: #555;
  --color-muted-3: #444;

  /* Status backgrounds */
  --color-status-aktiv: #ecf9ec;
  --color-status-neu: #eaf2ff;
  --color-status-wartung: #fff8e1;
  --color-status-fehler: #ffe5e7;
  --color-status-neutral: #f0f0f0;

  /* Badges */
  --color-badge-aktiv: #5cb85c;
  --color-badge-neutral: #777;

  /* Alerts */
  --color-alert-success-bg: #e6f6ea;
  --color-alert-success-border: #b7e1c2;
  --color-alert-success-text: #1e7e34;

  --color-alert-warning-bg: #fff4d6;
  --color-alert-warning-border: #ffe08a;
  --color-alert-warning-text: #856404;

  --color-alert-error-bg: #fdecea;
  --color-alert-error-border: #f5c6cb;
  --color-alert-error-text: #842029;

  /* Layout */
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 12px;
  --radius-xl: 16px;

  --shadow-sm: 0 1px 2px rgba(0,0,0,0.08);
  --shadow-md: 0 2px 4px rgba(0,0,0,0.10);
  --shadow-lg: 0 3px 6px rgba(0,0,0,0.14);
  --shadow-xl: 0 4px 10px rgba(0,0,0,0.18);

  --transition-fast: 0.2s ease;
  /* Dashboard Variablen */
  --mixed-sm: 160px;
  --mixed-md: 200px;
  --mixed-lg: 260px;
  --mixed-xl: 320px;

  /* Row system */
  --mixed-row-sm: 80px;   /* 1/2 LG */
  --mixed-row-md: 110px; /* 1/2 XL */
  --mixed-row-lg: 160px;

  /* Debug */
  --debug-row-color: rgba(255,0,0,0.15);


  /* ============================================================
     Phase 4 (0.0.77) — Public-Naming-Aliase
     Im Public-Bereich werden alternative Variablen-Namen verwendet
     (--card-bg, --accent, --color-error etc.) die historisch nie
     definiert waren. Statt alle Public-CSS umzuschreiben, bilden wir
     hier Aliase auf die existierenden Admin-Variablen.
     ============================================================ */

  /* Brand & Akzent */
  --accent: var(--color-primary);
  --accent-light: rgba(13, 110, 253, 0.15);
  --color-primary-alpha: rgba(13, 110, 253, 0.15);
  --color-primary-dark: var(--brand-strong);

  /* Backgrounds & Surfaces */
  --card-bg: var(--bg-surface);
  --card-active-bg: var(--color-hover-bg);
  --color-surface: var(--bg-surface);
  --color-bg-subtle: var(--color-row-alt);
  --color-input-bg: var(--bg-surface);
  --color-disabled-bg: var(--color-filter);
  --icon-bg: var(--color-filter);

  /* Borders */
  --border-color: var(--color-border);
  --color-input-border: var(--color-border);
  --border-radius: var(--radius-sm);
  --border-radius-lg: var(--radius-lg);

  /* Text */
  --text-muted: var(--color-muted);
  --text-primary: var(--color-text);
  --color-text-muted: var(--color-muted);

  /* Danger / Error (Alarme + Inline) */
  --danger: var(--color-danger);
  --danger-border: var(--color-alert-error-border);
  --color-error: var(--color-danger);
  --color-error-bg: var(--color-alert-error-bg);
  --color-error-border: var(--color-alert-error-border);
  --color-danger-bg: var(--color-alert-error-bg);
  --color-danger-border: var(--color-alert-error-border);
  --color-danger-text: var(--color-alert-error-text);

  /* Success */
  --color-success-bg: var(--color-alert-success-bg);
  --color-success-border: var(--color-alert-success-border);
  --color-success-text: var(--color-alert-success-text);

  /* Warning */
  --color-warning-bg: var(--color-alert-warning-bg);
  --color-warning-border: var(--color-alert-warning-border);
  --color-warning-text: var(--color-alert-warning-text);

  /* Info (neu - keine direkte Vorlage in Admin-Variablen) */
  --color-info-bg: #e3f2fd;
  --color-info-border: #90caf9;
  --color-info-text: #0c5494;

  /* ============================================================
     Phase 5 (0.0.96) — Zentralisiertes Design-System
     Tokens für die durchgängige Optik aller Module. Module-CSS
     soll nur noch diese Werte referenzieren — keine eigenen
     hardcoded px/Farben mehr.
     Vorbild: system_management.css
     ============================================================ */

  /* Fehlte: --radius (system_management nutzt es ohne dass es definiert war) */
  --radius: 6px;

  /* Touch-Targets — durchgaengig fuer Mobile */
  --touch-min: 44px;          /* Apple HIG / Material Mindestmass */
  --touch-icon-btn: 40px;     /* Quadratische Icon-Buttons */

  /* Standardhoehen */
  --control-height: 38px;     /* Inputs, Selects, Standard-Buttons */
  --control-height-sm: 32px;  /* Compacte Variante */
  --control-height-lg: 44px;  /* Touch / Primary-Action */

  /* Container-Limits — Inhaltsbreite */
  --container-max: 1100px;    /* Wie system_management */
  --container-narrow: 800px;  /* Form-Cards, schmale Inhalte */

  /* Z-index-Schichten — kollisionsfrei */
  --z-tooltip: 1000;
  --z-dropdown: 1100;
  --z-modal-backdrop: 1200;
  --z-modal: 1210;
  --z-toast: 1300;

  /* Breakpoints (als Strings — nur fuer Container-Queries) */
  /* @media (max-width: 760px) → mobile */
  /* @media (max-width: 480px) → narrow */

}
