/**
 * Aufgabengenerator - Core Styles
 * CSS Variables, Reset, Base, Typography
 * Version: 2.0
 */

/* ===== CSS VARIABLEN ===== */
:root {
  /* Primäre Farben (Light Mode Defaults, überschrieben durch theme.css) */
  --primary: #2563eb;
  --primary-dark: #1d4ed8;
  --primary-light: #3b82f6;
  --primary-bg: #eff6ff;

  /* Status-Farben (Light Mode Defaults, überschrieben durch theme.css) */
  --success: #16a34a;
  --success-bg: #dcfce7;
  --success-border: #86efac;
  --danger: #dc2626;
  --danger-bg: #fee2e2;
  --danger-border: #fca5a5;
  --warning: #ca8a04;
  --warning-bg: #fef9c3;
  --warning-border: #fcd34d;

  /* Neutrale Farben - Aliase für Theme-Variablen (Abwärtskompatibilität) */
  --bg: var(--bg-page, #f8fafc);
  --bg-white: var(--bg-card, #ffffff);
  --fg: var(--text-primary, #0f172a);
  --fg-muted: var(--text-muted, #64748b);
  --border: var(--border-default, #e2e8f0);
  --border-dark: var(--border-strong, #cbd5e1);

  /* Komponenten */
  --chip-bg: var(--bg-subtle, #f1f5f9);
  --chip-fg: var(--text-secondary, #334155);
  --code-bg: var(--bg-subtle, #f1f5f9);
  --header-height: 56px;
  --sidebar-width: 260px;
  --sidebar-width-collapsed: 60px;

  /* Abstände */
  --spacing-xs: 4px;
  --spacing-sm: 8px;
  --spacing-md: 16px;
  --spacing-lg: 24px;
  --spacing-xl: 32px;
  --spacing-2xl: 48px;

  /* Border Radius */
  --radius-sm: 4px;
  --radius: 8px;
  --radius-lg: 12px;
  --radius-full: 9999px;
}

/* ===== RESET & BASIS ===== */
*, *::before, *::after {
  box-sizing: border-box;
}

html {
  font-size: 16px;
  scroll-behavior: smooth;
}

body {
  margin: 0;
  padding: 0;
  font-family: 'Source Sans 3', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  font-size: 1rem;
  line-height: 1.6;
  color: var(--text-primary, var(--fg));
  background: var(--bg-page, var(--bg));
  min-height: 100vh;
}

/* ===== TYPOGRAFIE ===== */
h1, h2, h3, h4, h5, h6 {
  margin: 0 0 var(--spacing-md);
  font-weight: 600;
  line-height: 1.3;
}

h1 { font-size: 1.75rem; }
h2 { font-size: 1.5rem; }
h3 { font-size: 1.25rem; }
h4 { font-size: 1.125rem; }
h5 { font-size: 1rem; }
h6 { font-size: 0.875rem; }

p {
  margin: 0 0 var(--spacing-md);
}

.lead {
  font-size: 1.1rem;
  color: var(--text-muted, var(--fg-muted));
}

.text-muted {
  color: var(--text-muted, var(--fg-muted));
}

.text-success { color: var(--success); }
.text-danger { color: var(--danger); }
.text-warning { color: var(--warning); }