/*
 * ClubCoPilot — Kern: Design-Tokens, Schrift, Fokus, Bewegung (docs/styleguide.md ist die verbindliche Quelle).
 *
 * Gilt in ALLEN Apps mit Oberfläche. Enthält bewusst keine Bauteil-Regeln (Karten, Knöpfe, Tabellen …), damit die
 * Apps mit eigenem Aussehen (Eintritt, Mitgliederportal, Warteliste) nur Schrift, Farben und Fokus übernehmen.
 * Die Bauteile stehen in ccp-komponenten.css (nur AdminLTE-Apps), das AdminLTE-Theme in ccp-theme.css.
 *
 * Akzentfarbe: --ccp-accent (Petrol). Apps, die die Vereinsfarbe tragen (Eintritt, Mitgliederportal), überschreiben
 * --ccp-accent, --ccp-accent-hover und --ccp-accent-soft nach dem Laden dieser Datei.
 *
 * ZWILLING: liegt byte-gleich in verwaltung (Original), platform, eintritt, selfservice und warteliste
 * (tests/Unit/C28ZwillingeTest.php). trainingsuebungen bleibt bewusst ausgenommen. Änderungen immer in
 * verwaltung machen und kopieren.
 */

:root {
    color-scheme: light;

    /* Flächen & Text */
    --ccp-bg: #f6f7f8;
    --ccp-surface: #fff;
    --ccp-surface-2: #f1f3f4;
    --ccp-line: #e3e6e8;
    --ccp-line-strong: #c3cbd0;
    --ccp-text: #1d2327;
    --ccp-muted: #5b6670;

    /* Marke (Petrol wie auf der Marketingseite) */
    --ccp-accent: #0f766e;
    --ccp-accent-hover: #115e59;
    --ccp-accent-soft: #eaf4f2;
    --ccp-accent-light: #5eead4;
    --ccp-amber: #f59e0b;

    /* Status */
    --ccp-ok: #047857;
    --ccp-ok-soft: #d1fae5;
    --ccp-warn: #a16207;
    --ccp-warn-soft: #fef9c3;
    --ccp-danger: #b42318;
    --ccp-danger-soft: #fee4e2;
    --ccp-badge-danger: #d92d20;

    /* Sidebar (dunkel, neutral) */
    --ccp-sb: #1f2629;
    --ccp-sb-2: #181e20;
    --ccp-sb-text: #c8d0d4;
    --ccp-sb-muted: #8f9ba1;
    --ccp-sb-hover: rgba(255, 255, 255, .06);
    --ccp-sb-active: rgba(45, 212, 191, .13);
    --ccp-sb-line: rgba(255, 255, 255, .08);

    /* Tooltip */
    --ccp-tt-bg: #1d2327;
    --ccp-tt-text: #f6f7f8;
    --ccp-tt-link: #7fd8cb;

    /* Form */
    --ccp-radius-sm: 7px;
    --ccp-radius: 9px;
    --ccp-radius-lg: 12px;
    --ccp-shadow: 0 1px 2px rgba(16, 24, 40, .05);
    --ccp-shadow-hover: 0 4px 14px -4px rgba(16, 24, 40, .14);
    --ccp-font: "Plus Jakarta Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
    --ccp-dur: .15s;
    --ccp-focus: #2dd4bf;

    /* Die vorhandene ccp-tabelle (ccp-tabelle.css) übernimmt den Akzent. */
    --ccp-tabelle-akzent: var(--ccp-accent);
    --ccp-tabelle-akzent-hell: var(--ccp-accent-soft);
    --ccp-tabelle-fokus: #0f766e;
}

/* ---------- Grundtypo ---------- */

body,
body .content-wrapper,
.swal2-popup,
.select2-container,
.tabulator {
    font-family: var(--ccp-font);
}

body {
    background: var(--ccp-bg);
    color: var(--ccp-text);
    font-size: .9375rem;
}

body .content-wrapper {
    background: var(--ccp-bg);
}

h1,
h2,
h3,
h4,
.h1,
.h2,
.h3,
.h4 {
    font-family: var(--ccp-font);
    font-weight: 800;
    letter-spacing: -.02em;
}

h5,
h6,
.h5,
.h6 {
    font-family: var(--ccp-font);
    font-weight: 700;
    letter-spacing: -.01em;
}

.content-header h1 {
    font-size: 1.6rem;
    font-weight: 800;
    letter-spacing: -.02em;
}

.tabular-nums,
.table td.text-right,
.info-box-number {
    font-variant-numeric: tabular-nums;
}

/* ---------- Fokus (WCAG 2.4.7 / 2.4.11) ---------- */

:where(a, button, input, textarea, select, summary, [tabindex]):focus-visible {
    outline: 3px solid var(--ccp-focus);
    outline-offset: 2px;
    border-radius: 4px;
}

/* ---------- Bewegung reduzieren ---------- */

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: .001ms !important;
        transition-duration: .001ms !important;
    }
}