/* =========================================
   APP THEME - Zentrale Farbdefinitionen
   Alle App-weiten Farben an einer Stelle
   ========================================= */

:root {
  /* Haupt-Hintergrundfarben (aus index2.html) */
  --app-bg-primary: #0a0e27;           /* Haupthintergrund - dunkles Blau/Schwarz */
  --app-bg-secondary: #1a1a2e;         /* Sekundärer Hintergrund */
  --app-bg-tertiary: #16213e;          /* Tertiärer Hintergrund (Cards, etc.) */

  /* MDB Framework Override - WICHTIG für einheitlichen Hintergrund */
  --mdb-body-bg: #0a0e27;

  /* Gradient Hintergründe */
  --app-bg-gradient: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
  --app-bg-gradient-modal: linear-gradient(135deg, #1a1a2e 0%, #0a0e27 100%);
  --app-bg-gradient-bottom: linear-gradient(180deg, #1a1a2e 0%, #0a0e27 100%);

  /* Akzentfarben */
  --app-accent-primary: #00d4ff;       /* Cyan - Hauptakzent */
  --app-accent-secondary: #0066ff;     /* Blau */
  --app-accent-danger: #ff4444;        /* Rot für Fehler/Löschen */
  --app-accent-success: #4caf50;       /* Grün für Erfolg */

  /* UI Element Farben */
  --app-card-bg: #16213e;
  --app-card-hover: #1a2847;
  --app-input-bg: #0f1729;
  --app-button-bg: #666;
  --app-button-hover: #777;

  /* Transparente Overlays */
  --app-overlay-dark: rgba(0, 0, 0, 0.9);
  --app-overlay-medium: rgba(0, 0, 0, 0.7);
  --app-accent-overlay: rgba(0, 212, 255, 0.15);
  --app-danger-overlay: rgba(255, 68, 68, 0.2);

  /* Text Farben */
  --app-text-primary: #ffffff;
  --app-text-secondary: #b0b0b0;
  --app-text-muted: #666666;
}

/* Basis Body Styles - !important überschreibt MDB Framework */
body {
  background: #0a0e27 !important;
  background-color: #0a0e27 !important;
  color: #ffffff;
}

/* Globale HTML Hintergrund */
html {
  background: #0a0e27 !important;
  background-color: #0a0e27 !important;
}

/* Utility Klassen für schnelle Anwendung */
.bg-app-primary { background: var(--app-bg-primary) !important; }
.bg-app-secondary { background: var(--app-bg-secondary) !important; }
.bg-app-tertiary { background: var(--app-bg-tertiary) !important; }
.bg-app-gradient { background: var(--app-bg-gradient) !important; }
.bg-app-card { background: var(--app-card-bg) !important; }

.text-app-primary { color: var(--app-text-primary) !important; }
.text-app-secondary { color: var(--app-text-secondary) !important; }
.text-app-accent { color: var(--app-accent-primary) !important; }