/**
 * KSV Wolfenbüttel — Design-Token (Single Point of Change)
 *
 * Farben und Logo sind noch in Arbeit.
 * Zum Anpassen: nur diese Datei ändern — wirkt auf alle Module.
 */

/* ── Inter Font (lokal, Variable Font) ───────────────────────────── */

@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 400 700;
    font-display: swap;
    src: url('../fonts/inter-latin.woff2') format('woff2');
}

/* ── Gelasio Font (lokal, Variable Font) ─────────────────────────── */
/* Display-Schrift. Steht in --font-display BEWUSST VOR Georgia:
   Georgia ist auf Android und den meisten Linux-Systemen nicht
   vorhanden, dort fiele die Seite sonst auf Times New Roman zurueck.
   Gelasio ist metrisch kompatibel zu Georgia (gleiche Vorschubbreiten),
   das Layout bleibt also identisch, egal welche der beiden greift.
   Reihenfolge nicht "aufraeumend" umdrehen. */

@font-face {
    font-family: 'Gelasio';
    font-style: normal;
    font-weight: 400 700;
    font-display: swap;
    src: url('../fonts/gelasio-latin.woff2') format('woff2');
}

@font-face {
    font-family: 'Gelasio';
    font-style: italic;
    font-weight: 400 700;
    font-display: swap;
    src: url('../fonts/gelasio-latin-italic.woff2') format('woff2');
}

/* ── Design-Token ────────────────────────────────────────────────── */

:root {
    /* Farben — Platzhalter, wird angepasst sobald Farbkonzept steht.
       RGB-Tripel werden für rgba()-Berechnungen in Bootstrap-Komponenten
       benötigt; bei Farbwechsel BEIDE Werte (Hex + RGB) anpassen. */
    --color-primary: #2992D1;
    --color-primary-hover: #2280B8;
    --color-primary-light: #D9EFFA;
    --color-primary-rgb: 41, 146, 209;
    --color-primary-hover-rgb: 34, 128, 184;
    --color-secondary: #104E7B;
    --color-secondary-hover: #0D3F63;
    --color-secondary-rgb: 16, 78, 123;
    --color-accent: #E8A525;
    --color-accent-hover: #D1941F;
    --color-accent-rgb: 232, 165, 37;

    /* ── Erweiterte Palette (Wasser / Erd / Papier / Tinte) ───────
       Wasser-Tokens sind Aliase auf die Brand-Palette → ziehen
       automatisch mit, wenn Primary/Secondary im Admin geändert werden.
       Erd-/Papier-/Tinte-Tokens sind eigenständig und im Admin
       unter „Theme" pflegbar (color_tertiary, color_tertiary_soft,
       color_paper, color_ink). */

    --color-water-bright: var(--color-primary);
    --color-water-mid:    var(--color-secondary);
    --color-water-deep:   var(--color-secondary-hover);
    --color-water-light:  var(--color-primary-light);
    --color-water-mist:   #EEF6FB;
    --color-water-deep-rgb: 13, 63, 99;

    --color-tertiary:       #6B5B3E;  /* Bark — admin-pflegbar */
    --color-tertiary-soft:  #5E7A4F;  /* Moss — admin-pflegbar */
    --color-tertiary-warm:  #F5EFE2;  /* Warm-Beige (abgeleitet) */
    --color-tertiary-sand:  #E8DFC9;  /* Sand (abgeleitet) */
    --color-tertiary-stone: #C9BFA8;  /* Stone (abgeleitet) */
    --color-tertiary-rgb:   107, 91, 62;

    --color-paper:      #FBFAF6;  /* admin-pflegbar */
    --color-paper-warm: var(--color-tertiary-warm);
    --color-ink:        #1A2230;  /* admin-pflegbar */
    --color-ink-soft:   #3A4555;
    --color-ink-mute:   #6B7585;
    --color-ink-rgb:    26, 34, 48;

    --color-accent-sun: var(--color-accent);

    /* Hintergründe */
    --color-bg: #ffffff;
    --color-bg-light: #f8f9fa;
    --color-bg-dark: #212529;

    /* Text */
    --color-text: #212529;
    --color-text-muted: #6c757d;
    --color-text-light: #ffffff;

    /* Status */
    --color-success: #198754;
    --color-warning: #ffc107;
    --color-danger: #dc3545;
    --color-info: #0dcaf0;

    /* Typografie */
    --font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-heading: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    /* Gelasio vor Georgia — siehe @font-face-Block oben (Georgia fehlt auf Android/Linux) */
    --font-display: 'Gelasio', 'Georgia', 'Times New Roman', serif;
    --font-size-base: 1rem;
    --font-size-sm: 0.875rem;
    --font-size-lg: 1.125rem;
    --line-height-base: 1.6;

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

    /* Formen */
    --border-radius: 0.5rem;
    --border-radius-sm: 0.25rem;
    --border-radius-lg: 0.75rem;
    --border-color: #dee2e6;

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

    /* Layout */
    --header-height: 72px;
    --footer-bg: var(--color-water-deep);
    --container-max-width: 1140px;

    /* Übergänge */
    --transition-fast: 150ms ease;
    --transition-base: 250ms ease;

    /* Focus-Ring (abgeleitet von Primary) */
    --focus-ring-color: rgba(41, 146, 209, 0.25);
}