/* Eigene Buchungsseite (Cluster 2, 05.10.2026).
   Übernommen aus dem abgenommenen Mockup (00_meta/initiativen/buchungsseite/
   mockup_quellen/src/gemeinsam.css im Repo Praxisdaten, Version 29 der
   Leinwand). Seit dem 14.10.2026 in der Gestaltung „autism us.“: Farben,
   Schrift und Zustände aus dem Kanon des Skills spektrum-muenster
   (assets/colors_and_type.css), Dunkelmodus nach Variante A2. Das dunkle
   Thema folgt dem Farbschema des Systems (prefers-color-scheme), mit
   data-theme am Wurzelelement als Übersteuerung. Die Schrift Lexend liegt
   auf dem eigenen Server (static/css/fonts.css). Kernbraun bleibt im Dunkeln
   Fläche (--sm-bg-accent) mit Creme darauf; --sm-kernbraun wird dort zur
   Akzentschrift Kernbraun hell. Bedienelemente tragen den grauen Feldrand
   (--sm-outline, --sm-feldrand), gewählt ist Kernbraun. */
html{background:#ffffff}
body{margin:0}
.sm{--sm-kernbraun:#6C4B3A;--sm-kern-hover:#5a3f31;--sm-moos:#686646;--sm-blau:var(--sm-moos);--sm-ink:#1a1410;--sm-ink-soft:#1a1410;--sm-soft:#666666;--sm-stone:#666666;--sm-paper:#ffffff;--sm-paper-warm:#F7F5F2;--sm-cream-warm:#EFE8DF;--sm-border:#E0DAD3;--sm-line:rgba(26,20,16,0.12);--sm-bg-accent:#6C4B3A;--sm-fg-on-accent:#ffffff;--sm-hint-fg:#1a1410;--sm-hint-bg:#F2F2F2;--sm-hint-border:#6C4B3A;--sm-warn-fg:#1a1410;--sm-warn-bg:#FCF8F6;--sm-warn-border:#B4806F;--sm-fehler-fg:#A03A2C;--sm-fehler-bg:#F8E9E6;--sm-fehler-border:#A03A2C;--sm-erfolg-fg:#686646;--sm-erfolg-bg:#EEEEE4;--sm-erfolg-border:#686646;--sm-focus:#6C4B3A;--sm-shadow-card:0 18px 40px rgba(0,0,0,0.07);--sm-page-bg:#ffffff;--sm-tint:rgba(108,75,58,0.07);--sm-outline:#8C8C8C;--sm-outline-hover:#6C4B3A;--sm-feldrand:#8C8C8C;--sm-input-placeholder:#6B6B6B;--sm-input-selected:#6C4B3A;container-type:inline-size;container-name:sm;min-height:100vh;box-sizing:border-box;background:var(--sm-page-bg);color:var(--sm-ink-soft);font:300 1rem/1.6 'Lexend',system-ui,-apple-system,'Segoe UI',Arial,sans-serif;-webkit-font-smoothing:antialiased}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){background:#1A1A1A}:root:not([data-theme="light"]) .sm{--sm-kernbraun:#D2AE97;--sm-kern-hover:#5a3f31;--sm-moos:#B5B38C;--sm-blau:var(--sm-moos);--sm-ink:#F2F2F2;--sm-ink-soft:#F2F2F2;--sm-soft:#C4C4C4;--sm-stone:#C4C4C4;--sm-paper:#1A1A1A;--sm-paper-warm:#262626;--sm-cream-warm:#262626;--sm-border:rgba(255,255,255,0.09);--sm-line:rgba(255,255,255,0.12);--sm-bg-accent:#6C4B3A;--sm-fg-on-accent:#F7F5F2;--sm-hint-fg:#F2F2F2;--sm-hint-bg:#262626;--sm-hint-border:#D2AE97;--sm-warn-fg:#F2F2F2;--sm-warn-bg:rgba(174,156,154,.12);--sm-warn-border:#AE9C9A;--sm-fehler-fg:#F0A08F;--sm-fehler-bg:#262626;--sm-fehler-border:#F0A08F;--sm-erfolg-fg:#B5B38C;--sm-erfolg-bg:#262626;--sm-erfolg-border:#B5B38C;--sm-focus:#D2AE97;--sm-shadow-card:0 18px 40px rgba(0,0,0,0.5);--sm-page-bg:#1A1A1A;--sm-tint:rgba(210,174,151,0.10);--sm-outline:#8A8A8A;--sm-outline-hover:#D2AE97;--sm-feldrand:#8A8A8A;--sm-input-placeholder:#9A9A9A;--sm-input-selected:#D2AE97}}
:root[data-theme="dark"]{background:#1A1A1A}
:root[data-theme="dark"] .sm{--sm-kernbraun:#D2AE97;--sm-kern-hover:#5a3f31;--sm-moos:#B5B38C;--sm-blau:var(--sm-moos);--sm-ink:#F2F2F2;--sm-ink-soft:#F2F2F2;--sm-soft:#C4C4C4;--sm-stone:#C4C4C4;--sm-paper:#1A1A1A;--sm-paper-warm:#262626;--sm-cream-warm:#262626;--sm-border:rgba(255,255,255,0.09);--sm-line:rgba(255,255,255,0.12);--sm-bg-accent:#6C4B3A;--sm-fg-on-accent:#F7F5F2;--sm-hint-fg:#F2F2F2;--sm-hint-bg:#262626;--sm-hint-border:#D2AE97;--sm-warn-fg:#F2F2F2;--sm-warn-bg:rgba(174,156,154,.12);--sm-warn-border:#AE9C9A;--sm-fehler-fg:#F0A08F;--sm-fehler-bg:#262626;--sm-fehler-border:#F0A08F;--sm-erfolg-fg:#B5B38C;--sm-erfolg-bg:#262626;--sm-erfolg-border:#B5B38C;--sm-focus:#D2AE97;--sm-shadow-card:0 18px 40px rgba(0,0,0,0.5);--sm-page-bg:#1A1A1A;--sm-tint:rgba(210,174,151,0.10);--sm-outline:#8A8A8A;--sm-outline-hover:#D2AE97;--sm-feldrand:#8A8A8A;--sm-input-placeholder:#9A9A9A;--sm-input-selected:#D2AE97}
.sm *,.sm *::before,.sm *::after{box-sizing:border-box}
.buehne{padding:48px 24px 64px}
.karte{max-width:780px;margin:0 auto;background:var(--sm-paper);border:1px solid var(--sm-border);border-radius:26px;box-shadow:var(--sm-shadow-card);padding:36px 44px 36px}
.kopf{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 24px;margin:0 0 32px}
.logo{display:block;width:150px;height:auto}
.weg{display:flex;flex-wrap:wrap;gap:4px 10px;margin:0;padding:0;list-style:none;font-size:0.8125rem;color:var(--sm-stone)}
.weg li{display:flex;gap:10px;align-items:center}
.weg li+li::before{content:"›";color:var(--sm-stone)}
.weg [aria-current="step"]{color:var(--sm-ink);font-weight:500}
.eyebrow{display:block;margin:0 0 8px;padding:0;font-family:'Lexend',system-ui,sans-serif;font-weight:400;font-size:12.5px;line-height:1.4;letter-spacing:1.6px;text-transform:uppercase;color:var(--sm-moos)}
.sm h1{margin:0 0 12px;font-family:'Lexend',system-ui,sans-serif;font-weight:600;font-size:2.1rem;line-height:1.2;letter-spacing:-0.02em;color:var(--sm-kernbraun);text-wrap:balance}
.sm h2{margin:0 0 12px;font-family:'Lexend',system-ui,sans-serif;font-weight:600;font-size:1.4rem;line-height:1.3;letter-spacing:-0.01em;color:var(--sm-kernbraun);text-wrap:balance}
.sm p{margin:0 0 12px;text-wrap:pretty}
.lead{font-size:1.0625rem;max-width:60ch}
.leise{color:var(--sm-stone);font-size:0.9375rem;max-width:64ch}
.sm a{color:var(--sm-moos);text-underline-offset:3px}
.sm a:hover{color:var(--sm-kernbraun)}
.abschnitt{margin:32px 0 0;padding:28px 0 0;border-top:1px solid var(--sm-line)}
.pill{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:11px 22px;border-radius:999px;font:500 0.9375rem/1.3 'Lexend',system-ui,sans-serif;text-decoration:none;cursor:pointer;border:2px solid transparent;transition:background-color .15s ease-out,transform .15s ease-out,box-shadow .15s ease-out}
.pill svg{width:16px;height:16px;flex:none}
.sm .pill--primaer{background:var(--sm-bg-accent);border-color:var(--sm-bg-accent);color:var(--sm-fg-on-accent)}
.sm .pill--primaer:hover{background:var(--sm-kern-hover);border-color:var(--sm-kern-hover);color:var(--sm-fg-on-accent);box-shadow:0 2px 6px rgba(0,0,0,0.06)}
.sm .pill--rand{background:var(--sm-paper);border-color:var(--sm-moos);color:var(--sm-moos)}
.sm .pill--rand:hover{background:var(--sm-paper-warm);border-color:var(--sm-moos);transform:translateY(-1px)}
.sm .pill--leise{background:transparent;color:var(--sm-moos);text-decoration:underline;padding-left:10px;padding-right:10px}
.sm .pill:disabled{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}
.sm .pill:active{transform:translateY(0)}
.sm :focus-visible{outline:2px solid var(--sm-focus);outline-offset:2px}
.hinweis{border-radius:14px;padding:16px 20px;font-size:0.9375rem;line-height:1.55;margin:20px 0 0}
.hinweis p:last-child,.hinweis ul:last-child{margin-bottom:0}
.sm .hinweis .eyebrow{color:inherit}
.hinweis--info{background:var(--sm-hint-bg);color:var(--sm-hint-fg);border:1px solid var(--sm-hint-border)}
.hinweis--warn{background:var(--sm-warn-bg);color:var(--sm-warn-fg);border:1px solid var(--sm-warn-border)}
.hinweis--warn{position:relative;padding-left:46px}
/* Warndreieck (Variante C, Freigabe 31.10.2026): Form als Maske, Farbe vom Warnrand, damit Hell und Dunkel greifen. */
.hinweis--warn::before{content:"";position:absolute;left:18px;top:17px;width:18px;height:18px;background:var(--sm-warn-border);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 1.6 15 14.2H1z' fill='none' stroke='black' stroke-width='1.5' stroke-linejoin='round'/%3E%3Crect x='7.25' y='5.8' width='1.5' height='4.4' rx='.75'/%3E%3Ccircle cx='8' cy='12.1' r='.9'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 1.6 15 14.2H1z' fill='none' stroke='black' stroke-width='1.5' stroke-linejoin='round'/%3E%3Crect x='7.25' y='5.8' width='1.5' height='4.4' rx='.75'/%3E%3Ccircle cx='8' cy='12.1' r='.9'/%3E%3C/svg%3E") center/contain no-repeat}
.sm .hinweis a{color:inherit}
.hinweis ul{margin:0;padding-left:20px}
/* Barrierefreiheit (Cluster 3, Zielgröße nach WCAG 2.5.8): Die Links
   der Fehlerzusammenfassung stehen sonst enger als 24 Pixel übereinander. */
.hinweis li+li{margin-top:6px}
/* Fokusring des Kanons (2 px mit 2 px Abstand, 14.10.2026): Ein Link der
   Fehlerzusammenfassung, der bei 390 Pixeln umbricht, bekäme sonst je Zeile
   einen eigenen Ring, die sich überlagern; als ein Kasten trägt er einen
   geschlossenen Ring ringsum. */
.hinweis li a{display:inline-block}
.daten{background:var(--sm-paper-warm);border:1px solid var(--sm-border);border-radius:14px;padding:12px 20px;margin:20px 0 0}
.daten dl{margin:0;display:grid;grid-template-columns:140px minmax(0,1fr)}
.daten dt,.daten dd{margin:0;padding:5px 0}
.daten dt{color:var(--sm-stone);font-size:0.9375rem}
.daten dd{color:var(--sm-ink);font-weight:400}
.woche{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin:28px 0 4px}
.sm .woche h2{margin:0;font-size:1.3rem}
.woche__knoepfe{display:flex;gap:8px;flex-wrap:wrap}
.tage{list-style:none;margin:12px 0 0;padding:0}
.tag{display:grid;grid-template-columns:190px minmax(0,1fr);gap:8px 20px;padding:16px 0;border-top:1px solid var(--sm-line);align-items:start}
.sm .tag h3{margin:0;padding-top:11px;font:500 1rem/1.4 'Lexend',system-ui,sans-serif;color:var(--sm-ink)}
.zeiten{display:flex;flex-wrap:wrap;gap:10px}
.zeit{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:10px 18px;border-radius:999px;border:2px solid var(--sm-outline);background:var(--sm-paper);color:var(--sm-ink);font:400 1rem/1.2 'Lexend',system-ui,sans-serif;cursor:pointer;transition:background-color .15s ease-out,border-color .15s ease-out}
.zeit:hover{background:var(--sm-cream-warm);border-color:var(--sm-outline-hover)}
.zeit__ort{color:var(--sm-stone);font-size:0.875rem}
.sm .zeit--an{background:var(--sm-bg-accent);border-color:var(--sm-bg-accent);color:var(--sm-fg-on-accent);font-weight:500}
.sm .zeit--an:hover{background:var(--sm-kern-hover);border-color:var(--sm-kern-hover)}
.sm .zeit--an .zeit__ort{color:var(--sm-fg-on-accent)}
.zeit svg{width:16px;height:16px;flex:none}
.tag__leer{margin:0;padding-top:11px;color:var(--sm-stone);font-size:0.9375rem}
.wahlgruppe{border:0;margin:24px 0 0;padding:0;min-width:0}
.wahlgruppe legend{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:0;margin:0 0 8px;font-weight:500;color:var(--sm-ink)}
.segment{display:inline-flex;flex-wrap:wrap;gap:4px;padding:4px;border-radius:999px;background:var(--sm-cream-warm);border:1px solid var(--sm-border)}
.segment label{position:relative;display:inline-flex;align-items:center;min-height:44px;padding:8px 18px;border-radius:999px;cursor:pointer;font-size:0.9375rem;color:var(--sm-soft)}
.segment input{position:absolute;inset:0;opacity:0;margin:0;cursor:pointer}
.segment label:has(input:checked){background:var(--sm-paper);color:var(--sm-ink);font-weight:500;box-shadow:inset 0 0 0 1px var(--sm-feldrand)}
.segment label:has(input:focus-visible){outline:2px solid var(--sm-focus);outline-offset:2px}
.auswahl{position:sticky;bottom:12px;margin:24px 0 0;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 20px;padding:14px 16px 14px 20px;border-radius:20px;background:var(--sm-paper-warm);border:1px solid var(--sm-border)}
.auswahl__text{margin:0;color:var(--sm-ink);font-weight:400}
.auswahl__text span{display:block;font-size:0.875rem;font-weight:300;color:var(--sm-stone)}
.feld{margin:22px 0 0}
.lab{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-weight:500;color:var(--sm-ink);margin:0 0 6px}
.pflicht{font-family:'Lexend',system-ui,sans-serif;font-weight:500;font-size:11px;line-height:1.5;letter-spacing:1.6px;text-transform:uppercase;padding:1px 8px;border-radius:999px;border:1px solid var(--sm-warn-border);background:var(--sm-warn-bg);color:var(--sm-warn-fg)}
.stern{color:var(--sm-stone);font-weight:400}
.hilfe{margin:6px 0 0;font-size:0.875rem;color:var(--sm-stone)}
.eingabe{display:block;width:100%;min-height:48px;padding:12px 14px;border-radius:12px;border:1px solid var(--sm-feldrand);background:var(--sm-paper);color:var(--sm-ink);font:400 1rem/1.4 'Lexend',system-ui,sans-serif}
.eingabe::placeholder{color:var(--sm-input-placeholder);opacity:1}
.eingabe:focus{border-color:var(--sm-input-selected)}
.fehler .eingabe{border:2px solid var(--sm-fehler-border)}
.meldung{display:flex;gap:8px;align-items:flex-start;margin:6px 0 0;color:var(--sm-fehler-fg);font-size:0.875rem;font-weight:400}
.meldung svg{flex:none;width:16px;height:16px;margin-top:2px}
.optionen{display:grid;gap:10px}
.option{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:2px 12px;align-items:start;padding:14px 18px;border-radius:14px;border:1px solid var(--sm-feldrand);background:var(--sm-paper);cursor:pointer}
.option:has(input:checked){border-color:var(--sm-input-selected);box-shadow:inset 0 0 0 1px var(--sm-input-selected);background:var(--sm-tint)}
.option input{margin:2px 0 0;width:20px;height:20px;accent-color:var(--sm-input-selected)}
.option__titel{font-weight:500;color:var(--sm-ink)}
.option__preis{font-weight:500;color:var(--sm-ink);white-space:nowrap}
.option__text{grid-column:2 / 4;font-size:0.875rem;color:var(--sm-stone)}
.haken{display:grid;grid-template-columns:auto minmax(0,1fr);gap:12px;align-items:start;cursor:pointer;color:var(--sm-ink);font-weight:400}
.haken input{width:22px;height:22px;margin:1px 0 0;accent-color:var(--sm-input-selected)}
.haken .pflicht{margin-left:6px;vertical-align:1px}
.summe{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:8px;margin:28px 0 0;padding:18px 0 0;border-top:1px solid var(--sm-line);font-size:1.0625rem;color:var(--sm-ink)}
.summe strong{font-weight:500;font-size:1.3rem}
.aktionen{display:flex;flex-wrap:wrap;align-items:center;gap:12px 16px;margin:20px 0 0}
.schritte{list-style:none;margin:0;padding:0}
.schritte li{display:grid;grid-template-columns:28px minmax(0,1fr);gap:14px;padding:14px 0;border-top:1px solid var(--sm-line)}
.schritte li:first-child{border-top:0;padding-top:4px}
.nr{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:999px;background:var(--sm-bg-accent);color:var(--sm-fg-on-accent);font-weight:500;font-size:0.875rem}
.schritte p{margin:0}
.schritte b{font-weight:500;color:var(--sm-ink)}
.fuss{max-width:780px;margin:20px auto 0;display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 20px;padding:0 8px;font-size:0.8125rem;color:var(--sm-soft)}
.fuss nav{display:flex;flex-wrap:wrap;gap:4px 16px}
.sm .fuss a{color:var(--sm-soft)}
/* Widerrufslink (§ 356a Abs. 1 Satz 3 BGB, hervorgehoben platziert; 10.11.2026): eigene Zeile, volle Textfarbe, kräftiger, unterstrichen. */
.sm .fuss a.fuss__widerruf{flex-basis:100%;color:var(--sm-ink);font-size:0.9375rem;font-weight:600;text-decoration:underline}
.sm .fuss a.fuss__widerruf:hover{color:var(--sm-kernbraun)}
/* Aufklappbares Feld (Absage, Verschieben und Erstattung; 10.11.2026). */
.sm details{margin:12px 0 0}
.sm summary{padding:10px 0;font:500 0.9375rem/1.4 'Lexend',system-ui,sans-serif;color:var(--sm-moos);cursor:pointer}
.sm summary:hover{color:var(--sm-kernbraun)}
.sm details[open]>summary{margin-bottom:4px}
.karte--breit{max-width:900px}
.kalender-bereich{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:28px 44px;margin:28px 0 0;align-items:start}
.monat{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 12px}
.sm .monat h2{margin:0;font-size:1.3rem}
.monat__knoepfe{display:flex;gap:8px}
.rundknopf{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:999px;border:2px solid var(--sm-outline);background:var(--sm-paper);color:var(--sm-kernbraun);cursor:pointer}
.rundknopf:hover{background:var(--sm-cream-warm);border-color:var(--sm-outline-hover)}
.rundknopf:disabled{opacity:.5;cursor:not-allowed}
.rundknopf svg{width:16px;height:16px}
.kal{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px 4px;justify-items:center}
.kal__kopf{font-family:'Lexend',system-ui,sans-serif;font-weight:400;font-size:11.5px;letter-spacing:1.6px;text-transform:uppercase;color:var(--sm-stone);padding:4px 0}
.kal__kopf abbr{text-decoration:none}
.kal__tag{display:inline-flex;align-items:center;justify-content:center;width:100%;max-width:44px;aspect-ratio:1 / 1;border-radius:999px;font:400 1rem/1 'Lexend',system-ui,sans-serif;border:2px solid transparent;background:transparent}
.kal__tag--zu{color:var(--sm-stone)}
.kal__tag--frei{border-color:var(--sm-outline-hover);background:var(--sm-paper);color:var(--sm-ink);font-weight:500;cursor:pointer;transition:background-color .15s ease-out}
.kal__tag--frei:hover{background:var(--sm-cream-warm)}
.sm .kal__tag--an,.sm .kal__tag--an:hover{background:var(--sm-bg-accent);border-color:var(--sm-bg-accent);color:var(--sm-fg-on-accent)}
.kal__legende{margin:12px 0 0;font-size:0.875rem;color:var(--sm-stone)}
.tageszeiten{min-width:0}
.sm .tageszeiten h2{font-size:1.3rem;margin:6px 0 14px}
.tageszeiten .zeiten{display:grid;grid-template-columns:minmax(0,1fr);gap:8px}
.sm .tageszeiten .zeit{justify-content:space-between;width:100%;padding:10px 20px;flex:none}
.zeit__zeit{display:inline-flex;align-items:center;gap:8px}
.tageszeiten .zeit__ort{white-space:nowrap}
.tageszeiten .auswahl{position:static;margin-top:20px}
@container sm (max-width: 760px){
.kalender-bereich{grid-template-columns:minmax(0,1fr)}
.kal{gap:4px 2px}
}
@container sm (max-width: 640px){
.buehne{padding:16px 12px 40px}
.karte{padding:24px 20px;border-radius:20px}
.kopf{margin-bottom:24px}
.logo{width:128px}
.sm h1{font-size:1.75rem}
.tag{grid-template-columns:minmax(0,1fr);padding:14px 0}
.sm .tag h3,.tag__leer{padding-top:0}
.zeit{flex:1 1 140px}
.daten dl{grid-template-columns:minmax(0,1fr)}
.daten dt{padding-bottom:0}
.daten dd{padding-top:0;padding-bottom:8px}
.aktionen .pill,.auswahl .pill{width:100%}
.woche__knoepfe{width:100%}
.woche__knoepfe .pill{flex:1 1 0}
.segment{display:flex;border-radius:20px}
.segment label{flex:1 1 auto;justify-content:center}
}
@media (prefers-reduced-motion: reduce){.sm *{transition:none !important}}
/* Seiten Terminart, Gespräch und Ort (Mockup: Terminarten, Gespraechsart, Ort) */
.arten{display:grid;gap:14px;margin:28px 0 0}
.sm .art{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 20px;align-items:center;padding:20px 22px;border-radius:14px;border:1px solid var(--sm-feldrand);background:var(--sm-paper);color:var(--sm-ink-soft);text-decoration:none;transition:background-color .15s ease-out,border-color .15s ease-out}
.sm .art:hover{background:var(--sm-paper-warm);border-color:var(--sm-input-selected);color:var(--sm-ink-soft)}
.sm .art h2{margin:0;font-size:1.4rem}
.art__text{margin:4px 0 0;color:var(--sm-stone);font-size:0.9375rem}
.art__pfeil{grid-column:2;grid-row:1 / span 2;display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:999px;border:2px solid var(--sm-outline);color:var(--sm-kernbraun)}
.art__pfeil svg{width:16px;height:16px}
/* Logo hell und dunkel */
.logo--dunkel{display:none}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .logo--hell{display:none}:root:not([data-theme="light"]) .logo--dunkel{display:block}}
:root[data-theme="dark"] .logo--hell{display:none}
:root[data-theme="dark"] .logo--dunkel{display:block}
/* Köderfeld: für Menschen unsichtbar, auch für Bildschirmleser */
.koeder{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}
/* Formulare ohne eigene Gestalt (Knöpfe in GET-Formularen) */
.sm form{margin:0}
.sm button.kal__tag{cursor:pointer}
.nur-lesbar{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
/* Auswahlkasten der Terminwahl wie im Mockup: erste Zeile klein in Steingrau
   (Sichtabgleich Cluster 2, 05.10.2026). */
.sm .auswahl__text{font-size:0.875rem;font-weight:300;color:var(--sm-stone)}
/* Genehmigte Empfehlung: Monatsfläche ohne Logo, Uhrzeit mit Originalrosette.
   Seit dem 14.10.2026 in der Zustandsfarbe Erfolg (Moos, Kanon) statt Grün;
   die Bedeutung trägt zusätzlich die Legende unter dem Kalender. */
.kal__tag--empfehlung{background:var(--sm-erfolg-bg);border:2px solid var(--sm-erfolg-border);color:var(--sm-ink)}
.zeit--empfehlung{background:var(--sm-erfolg-bg);border-color:var(--sm-erfolg-border);color:var(--sm-ink)}
.zeit__rosette{width:20px;height:20px;flex-shrink:0}
.sm .kal__tag--empfehlung.kal__tag--an,.sm .zeit--empfehlung.zeit--an{background:var(--sm-bg-accent);color:var(--sm-fg-on-accent);border-color:var(--sm-bg-accent)}
.kal__legende{font-size:.85rem;line-height:1.6;color:var(--sm-soft)}

.zeit--empfehlung .zeit__ort{color:inherit}

.sm .zeit--empfehlung.zeit--an .zeit__ort{color:inherit}

/* Rosette an den empfohlenen Uhrzeiten im Dunkelmodus (F5, 16.10.2026): Die
   Blätter des Hellmodus sind auf Weiß gezeichnet und verschwinden auf #1A1A1A.
   Im Dunkelmodus liegt deshalb eine helle Scheibe in Creme #F7F5F2 darunter;
   der Hellmodus bleibt unverändert. */
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .zeit__rosette{background:#F7F5F2;border-radius:50%;padding:2px;width:24px;height:24px}}
:root[data-theme="dark"] .zeit__rosette{background:#F7F5F2;border-radius:50%;padding:2px;width:24px;height:24px}

/* Abstand zwischen Kalender und dem Satz „Grün markierte Tage …“ (F5, 16.10.2026).
   Die allgemeine Regel .sm p setzt den oberen Rand auf 0; diese Regel ist
   auf den Satz unter dem Kalender beschränkt. */
.kalender-bereich>div>form+.kal__legende{margin-top:20px}