/* HUGO Gestaltung: alle Werte der Oberfläche an einer Stelle (Bauauftrag Oberfläche vom 09.10.2026, Abschnitt 3).
   Kein Farbwert und keine Pixelgröße außerhalb dieser Datei (Wächter: testing/test_zeitwirtschaft_oberflaeche.py).
   Doku: docs/modules/zeitwirtschaft_oberflaeche.md */

@font-face {
    font-family: "Geist";
    src: url("fonts/Geist-Variable.woff2") format("woff2");
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}

:root {
    /* Schrift: eine Familie, selbst gehostet (Geist 1.401, SIL OFL) */
    --h-font: "Geist", system-ui, -apple-system, "Segoe UI", sans-serif;
    --h-font-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;

    /* Größen: Meta, Text, Zeilentitel, Seitentitel am Rechner, Seitentitel am Handy und Kennzahl */
    --h-size-meta: 12px;
    --h-size-text: 14px;
    --h-size-row: 16px;
    --h-size-title: 20px;
    --h-size-title-phone: 24px;
    --h-size-figure: 24px;
    --h-leading: 1.5;
    --h-leading-tight: 1.2;

    /* Stärken: Text, Bezeichnungen und Schaltflächen, Überschriften und Kennzahlen */
    --h-weight-text: 400;
    --h-weight-label: 500;
    --h-weight-strong: 600;

    /* Farben */
    --h-ground: #F4F4F5;
    --h-surface: #FFFFFF;
    --h-line: #E4E4E7;
    --h-line-strong: #D4D4D8;
    --h-text: #18181B;
    --h-text-2: #52525B;
    --h-text-3: #71717A;
    --h-primary: #0F1B33;
    --h-primary-hover: #1E2A44;
    --h-on-primary: #FFFFFF;
    --h-link: #1D4ED8;

    /* Status: immer Punkt plus Text (hugo/c/status.html), Zuordnung in zeitwirtschaft/ui_status.py */
    --h-ok: #15803D;
    --h-todo: #B45309;
    --h-error: #B91C1C;
    --h-wait: #1D4ED8;
    --h-neutral: #71717A;
    /* zarte Flächen nur für Hinweise (hugo/c/notice.html) */
    --h-ok-soft: #F0FDF4;
    --h-todo-soft: #FFFBEB;
    --h-error-soft: #FEF2F2;
    --h-wait-soft: #EFF6FF;
    --h-primary-tint: rgba(15, 27, 51, 0.08);

    /* Ecken: Badge und Kästchen, Schaltfläche und Eingabe, Karte, Fläche am Handy */
    --h-radius-badge: 8px;
    --h-radius-control: 12px;
    --h-radius-card: 16px;
    --h-radius-sheet: 24px;
    --h-radius-round: 9999px;

    /* Höhen: mit Maus 40, mit Finger 48 (unten); Touch-Ziel mindestens 44 */
    --h-control: 40px;
    --h-touch: 44px;
    --h-row: 40px;

    /* Abstände */
    --h-space-1: 4px;
    --h-space-2: 8px;
    --h-space-3: 12px;
    --h-space-4: 16px;
    --h-space-5: 24px;
    --h-space-6: 32px;

    /* Linien, Symbole, Punkte */
    --h-hairline: 1px;
    --h-icon-s: 16px;
    --h-icon-m: 20px;
    --h-icon-stroke: 1.75;
    --h-dot: 8px;
    --h-date-box: 52px;
    --h-avatar: 44px;
    --h-badge: 20px;

    /* Schatten: nur Jetzt-Karte, Menüs und Dialoge */
    --h-shadow-card: 0 1px 2px rgba(24, 24, 27, 0.06);
    --h-shadow-menu: 0 8px 24px rgba(24, 24, 27, 0.12);
    --h-backdrop: rgba(24, 24, 27, 0.32);

    /* Fokus und Bewegung */
    --h-focus-width: 2px;
    --h-focus-offset: 2px;
    --h-duration: 150ms;

    /* Maße */
    --h-side-width: 240px;
    --h-measure: 72ch;
    --h-dialog-width: 480px;
    --h-menu-width: 240px;
    --h-field-width: 480px;
    --h-card-min: 200px;
    --h-column-min: 360px;
}

@media (pointer: coarse) {
    :root {
        --h-control: 48px;
        --h-row: 48px;
    }
}

@media (prefers-reduced-motion: reduce) {
    :root {
        --h-duration: 0ms;
    }
}