/* * MARK: CSS-Variablen - Light Mode (Standard) */

:root {
    /* Akzentfarben */
    --akzent-gelb: #fdcc04;
    --akzent-rosa: #fc6c85;
    --akzent-gelb-hover: #e6b900;
    --akzent-rosa-hover: #e55a73;

    /* Hintergruende - Light Mode */
    --bg-primary: #fafaf8;
    --bg-secondary: #f5f5f3;
    --bg-tertiary: #eeeee9;
    --bg-card: #ffffff;
    --bg-sidebar: #f8f8f6;
    --bg-header: rgba(255, 255, 255, 0.85);
    --bg-hover: rgba(0, 0, 0, 0.04);
    --bg-active: rgba(0, 0, 0, 0.06);
    --bg-modal-overlay: rgba(0, 0, 0, 0.3);

    /* Textfarben */
    --text-primary: #1d1d1f;
    --text-secondary: #6e6e73;
    --text-tertiary: #9a9a9f;
    --text-inverse: #ffffff;
    --text-link: #0066cc;
    --text-link-hover: #004499;

    /* Rahmen */
    --border-color: rgba(0, 0, 0, 0.08);
    --border-color-strong: rgba(0, 0, 0, 0.15);

    /* Schatten */
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.04);
    --shadow-md: 0 2px 8px rgba(0, 0, 0, 0.06);
    --shadow-lg: 0 4px 16px rgba(0, 0, 0, 0.08);
    --shadow-card: 0 1px 3px rgba(0, 0, 0, 0.05);

    /* Status-Farben */
    --status-entwurf: #f59e0b;
    --status-aktiv: #10b981;
    --status-archiviert: #9ca3af;
    --status-fehler: #dc2626;
    --status-fehler-bg: rgba(239, 68, 68, 0.1);
    --status-fehler-border: rgba(239, 68, 68, 0.2);

    /* Abstände */
    --spacing-xs: 0.25rem;
    --spacing-sm: 0.5rem;
    --spacing-md: 1rem;
    --spacing-lg: 1.5rem;
    --spacing-xl: 2rem;
    --spacing-2xl: 3rem;

    /* Rundungen */
    --radius-sm: 6px;
    --radius-md: 10px;
    --radius-lg: 14px;
    --radius-xl: 20px;

    /* Typografie */
    --font-family: 'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    --font-size-xs: 0.75rem;
    --font-size-sm: 0.8125rem;
    --font-size-base: 0.9375rem;
    --font-size-md: 1.0625rem;
    --font-size-lg: 1.25rem;
    --font-size-xl: 1.5rem;
    --font-size-2xl: 2rem;
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    --line-height: 1.6;

    /* Layout */
    --sidebar-breite: 280px;
    --header-hoehe: 56px;
    --max-content-breite: 960px;

    /* Übergänge */
    --transition-fast: 150ms ease;
    --transition-normal: 250ms ease;
    --transition-slow: 350ms ease;
}

/* * MARK: CSS-Variablen - Soft Dark Mode */

[data-theme="dark"] {
    --bg-primary: #1c1c1e;
    --bg-secondary: #2c2c2e;
    --bg-tertiary: #3a3a3c;
    --bg-card: #252528;
    --bg-sidebar: #222224;
    --bg-header: rgba(28, 28, 30, 0.9);
    --bg-hover: rgba(255, 255, 255, 0.06);
    --bg-active: rgba(255, 255, 255, 0.1);
    --bg-modal-overlay: rgba(0, 0, 0, 0.55);

    --text-primary: #e5e5e7;
    --text-secondary: #a1a1a6;
    --text-tertiary: #6e6e73;
    --text-inverse: #1d1d1f;
    --text-link: #5aadff;
    --text-link-hover: #80c4ff;

    --border-color: rgba(255, 255, 255, 0.08);
    --border-color-strong: rgba(255, 255, 255, 0.15);

    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.2);
    --shadow-md: 0 2px 8px rgba(0, 0, 0, 0.25);
    --shadow-lg: 0 4px 16px rgba(0, 0, 0, 0.3);
    --shadow-card: 0 1px 3px rgba(0, 0, 0, 0.2);
}