/**
 * PLM Digitales Programmheft - Theme Variables
 *
 * Diese Datei definiert die Standard-Farbwerte.
 * Kunden können diese Variablen in ihrem eigenen CSS überschreiben.
 *
 * Einbindung im Host (z.B. TYPO3):
 *
 *   :root {
 *     --plm-primary: #003366;
 *     --plm-primary-contrast: #ffffff;
 *   }
 *
 * Die Komponenten erben die Werte automatisch.
 */

:root {
  /* ========================================
     PRIMARY / BRAND
     Hauptfarbe für aktive Zustände, Buttons
     ======================================== */
  --plm-primary: #111827;
  --plm-primary-contrast: #ffffff;

  /* ========================================
     BACKGROUND
     Hintergrundfarben (hell -> dunkel)
     ======================================== */
  --plm-bg-page: #f3f4f6;           /* Seiten-Hintergrund */
  --plm-bg-card: #ffffff;           /* Karten, Modals */
  --plm-bg-input: #ffffff;          /* Eingabefelder */
  --plm-bg-button: #f9fafb;         /* Standard-Buttons */
  --plm-bg-hover: #fafafa;          /* Hover-Zustand */
  --plm-bg-highlight: #f1f5f9;      /* Hervorgehobene Bereiche */

  /* ========================================
     TEXT
     Textfarben (dunkel -> hell)
     ======================================== */
  --plm-text-primary: #0f172a;      /* Haupttext, Überschriften */
  --plm-text-secondary: #374151;    /* Sekundärer Text */
  --plm-text-muted: #6b7280;        /* Dezenter Text, Hinweise */
  --plm-text-label: #4b5563;        /* Labels, Kategorien */

  /* ========================================
     BORDER
     Rahmenfarben
     ======================================== */
  --plm-border: #e5e7eb;            /* Standard-Rahmen */
  --plm-border-input: #d1d5db;      /* Eingabefelder */
  --plm-border-strong: #cbd5e1;     /* Betonte Rahmen */

  /* ========================================
     BADGE
     Farben für Badges/Tags
     ======================================== */
  --plm-badge-bg: #ffffff;          /* Standard-Badge Hintergrund */
  --plm-badge-text: #0f172a;        /* Standard-Badge Text */
  --plm-badge-border: #e5e7eb;      /* Standard-Badge Rahmen */

  --plm-badge-room-bg: #f1f5f9;     /* Raum-Badge Hintergrund */
  --plm-badge-room-border: #e2e8f0; /* Raum-Badge Rahmen */

  --plm-badge-org-text: #6b7280;    /* Organisations-Badge Text */

  /* ========================================
     ERROR / STATUS
     Fehler- und Statusfarben
     ======================================== */
  --plm-error: #b91c1c;
  --plm-error-bg: #fef2f2;
  --plm-error-border: #fecaca;

  /* ========================================
     OVERLAY / MODAL
     Modal-Hintergrund
     ======================================== */
  --plm-overlay: rgba(0, 0, 0, 0.45);

  /* ========================================
     SHADOWS
     Schatten
     ======================================== */
  --plm-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.04);
  --plm-shadow-md: 0 6px 18px rgba(0, 0, 0, 0.08);

  /* ========================================
     BORDER RADIUS
     Rundungen
     ======================================== */
  --plm-radius-sm: 12px;
  --plm-radius-md: 14px;
  --plm-radius-lg: 16px;
  --plm-radius-xl: 18px;
  --plm-radius-full: 999px;
}


/* ============================================
   BEISPIEL: Kundenspezifisches Theme
   ============================================

   Kopieren und anpassen für Corporate Design:

   :root {
     --plm-primary: #003366;
     --plm-primary-contrast: #ffffff;
     --plm-badge-room-bg: #e0f2fe;
     --plm-badge-room-border: #bae6fd;
   }

   ============================================ */