/* ══ RoutineHeld Design-System (Design-Vorlage, 25.09.2026) ══════════════
   EINE Quelle für Familienplaner (wand.html) und Einstellungen (uhr-eltern.html) —
   und seit 26.09.2026 (Phase 7, «Eine App, drei Ansichten») auch für die Kinder-
   Ansichten: die --rh-kid-*-Tokens unten sind Design-Vorlage «Kinderbereich» und
   gelten für Tageskreis, RoutineUhr (Standard-Design «Holz») und die Übersicht.
   Personenfarben hängen am PLATZ der Person (Person 1, 2, …), nie am Namen —
   die Zuordnung macht PERSON_COLORS im Skript, die Tokens hier sind Rollen.
   Bei Änderungen den ?v=-Parameter in beiden Seiten erhöhen. */
@font-face {
  font-family: 'Nunito Sans';
  src: url('/fonts/nunito-sans-latin.woff2') format('woff2');
  font-weight: 200 1000;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
    U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
:root {
  --font-family: 'RH Emoji', 'Nunito Sans', 'Inter', system-ui, sans-serif;

  /* Basis */
  --rh-bg: #F7F4ED;
  --rh-surface: #FFFEFB;
  --rh-surface-soft: #F2EFE7;
  --rh-text: #243B53;
  /* Kontraste nachgerechnet (Barrierefreiheit 29.09.2026): Text-2/-3 ≥ 4,5:1 auf Grund und Fläche */
  --rh-text-2: #5B6978;
  --rh-text-3: #636D78;
  --rh-border: #E7E3DA;

  /* Akzent: hell für Flächen, «strong» für Knöpfe mit weisser Schrift (Kontrast) */
  --rh-accent: #DCA66D;
  --rh-accent-soft: #F3E3CF;
  --rh-accent-strong: #9A6A36;   /* weisse Schrift 4,7:1 (vorher 3,3:1) */
  --rh-accent-deep: #8F6232;
  /* Heute-Hervorhebung: nur ein Hauch Akzent */
  --rh-today: #FBF5EC;
  /* «Als Nächstes»: ruhiges Hellblau, hebt sich vom Rest ab */
  --rh-next: #EAF1F6;

  /* Kinder-Handschrift (Design-Vorlage «Kinderbereich», 26.09.2026): Leinenweiss als Grund (Briefing v2: kein Creme/Beige), weisse
     runde Karten, Pastellkreise, Navy-Text, Blau für «Jetzt», Rot/Blau für die Zeiger.
     Bunt fürs Kind, ruhig für die Eltern — Grund, Schriften und Symbole sind dieselben. */
  --rh-kid-bg: #FAFAF7;
  --rh-kid-bg-active: #F3F3EF;
  --rh-kid-surface: #FFFFFF;
  --rh-kid-text: #2F3B4C;
  --rh-kid-text-2: #5E6877;       /* ≥ 4,4:1 auch auf den Pastellflächen */
  --rh-kid-line: #E9E8E2;
  --rh-kid-sun: #FCEAC2;
  --rh-kid-sky: #D9E8F7;
  --rh-kid-leaf: #DCEBD3;
  --rh-kid-peach: #F9E1CF;
  --rh-kid-lilac: #E8E0F4;
  --rh-kid-rose: #F8DDE0;
  --rh-kid-sand: #F3E9DA;
  --rh-kid-ring: #EEEDE7;
  --rh-kid-ring-outer: #E1E0D8;
  --rh-kid-blue: #4A86D8;
  --rh-kid-blue-soft: #E1ECF9;
  --rh-kid-green: #5A9A58;        /* weisser Haken ≥ 3:1 */
  --rh-kid-green-soft: #F1F8EE;
  --rh-kid-red: #E4573D;
  --rh-kid-shadow: 0 6px 22px rgba(47, 59, 76, .07);

  /* Status (sparsam) */
  --status-success: #7FA78A;
  --status-warning: #D5A25F;
  --status-error: #C77F7F;
  --status-info: #83A9C1;

  /* Familie (für «alle») */
  --person-family: #D8CDBD;
  --person-family-soft: #F1ECE4;

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

  /* Radien */
  --radius-sm: 8px; --radius-md: 12px; --radius-card: 16px; --radius-large: 20px;

  /* Schatten */
  --shadow-card: 0 2px 8px rgba(36, 59, 83, 0.06);
  --shadow-high: 0 4px 14px rgba(36, 59, 83, 0.08);

  /* Schriftgrössen */
  --font-xs: 12px; --font-sm: 14px; --font-md: 16px; --font-lg: 18px;
  --font-xl: 20px; --font-2xl: 24px; --font-3xl: 32px;
}

/* Nachtgrün: dieselben Rollen, dunkel belegt — alle Bausteine passen sich an */
body.theme-nacht {
  --rh-bg: #12160e;
  --rh-surface: #1a2114;
  --rh-surface-soft: #232b1c;
  --rh-text: #e4e7dc;
  --rh-text-2: #b9c4aa;
  --rh-text-3: #8a9878;
  --rh-border: #2c3524;
  --rh-accent: #d9b36a;
  --rh-accent-soft: #2f3522;
  --rh-accent-strong: #a8874a;
  --rh-accent-deep: #d9b36a;
  --rh-today: #1c2415;
  --rh-next: #213040;
  --person-family: #6a6456;
  --person-family-soft: #262a1f;
  --shadow-card: 0 2px 8px rgba(0, 0, 0, 0.25);
  --shadow-high: 0 4px 14px rgba(0, 0, 0, 0.35);
}

/* Datums-Pille (Ausfall-Tage einer Routine, «Zwei Zuhause» einzelne Tage) — eine Form für beide Editoren */
.datePill { display: inline-flex; align-items: center; gap: 2px; background: var(--rh-accent-soft); color: var(--rh-text);
  border-radius: 999px; padding: 3px 4px 3px 12px; font-weight: 600; font-size: 14px; }

/* Sichtbarer Tastatur-Fokus für Planer + Einstellungen (UI-Brille 01.10.2026) — Touch bleibt unberührt */
:where(button, a, [tabindex], input, select, textarea, summary):focus-visible { outline: 3px solid var(--rh-accent); outline-offset: 2px; }
body.theme-nacht :where(button, a, [tabindex], summary):focus-visible { outline-color: #d9b36a; }