/*
 * module/startklar/assets/kurshalten.css – Kurs halten, mobil zuerst.
 *
 * Definiert KEINE eigenen Grundfarben: Die Jugendseite laedt vorher
 * jugend-farben.css (Navy, Lime, Cyan), die Betriebsseite setzt die hellen
 * Werte selbst. Fest sind nur die Themenfarben des Betriebsberichts
 * (Gruen #22B573, Gelb #F5B400, Rot #E5484D, Grau) - die stehen als
 * Inline-Farbe an den Punkten, aus KH_FARBEN in kurshalten-daten.php.
 */
*{box-sizing:border-box;}
body{margin:0;background:var(--paper);color:var(--ink);font-family:'Inter',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  padding:20px 16px 64px;font-size:16px;line-height:1.55;}
.kh-huelle{max-width:640px;margin:0 auto;}
.kh-logo img{height:46px;width:auto;display:block;margin:0 0 16px;}
.kh-karte,.kh-bogen{background:var(--white);border:1px solid var(--rand);border-radius:var(--radius-lg,20px);padding:24px 20px;margin:0 0 18px;}
@media(min-width:600px){.kh-karte,.kh-bogen{padding:32px 36px;}}
h1{font-family:'Space Grotesk',sans-serif;font-size:23px;line-height:1.25;margin:0 0 12px;}
h2{font-family:'Space Grotesk',sans-serif;font-size:17px;margin:22px 0 8px;}
h3{font-size:15px;margin:16px 0 6px;}
p{margin:0 0 12px;}
a{color:var(--blue);}
.kh-klein{font-size:13.5px;color:var(--ink-soft);}
.kh-entwurf{display:inline-block;font-size:11.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;
  color:#8a6100;background:#FFF3D6;border-radius:6px;padding:2px 8px;margin:0 0 10px;font-style:normal;}
.kh-fehler{background:var(--fehler-bg,#fdecec);border:1px solid var(--fehler-border,#e15656);color:var(--fehler-text,#b3261e);
  border-radius:12px;padding:12px 15px;margin:0 0 14px;}
.kh-danke{font-weight:700;color:var(--neon,#1f7a45);font-size:17px;}
.kh-liste{padding-left:20px;margin:0 0 12px;}
.kh-liste li{margin:0 0 8px;}
.kh-links{margin-top:20px;font-size:14px;}

/* Knoepfe */
.kh-knopf{display:inline-block;font-family:inherit;font-size:16px;font-weight:700;border:none;border-radius:999px;
  padding:13px 24px;cursor:pointer;text-decoration:none;background:var(--neon,#07152E);color:var(--paper,#fff);min-height:48px;}
.kh-knopf--leise{background:transparent;color:var(--ink);border:1.5px solid var(--rand-hell,var(--rand));font-weight:600;font-size:14.5px;}
.kh-knopf--mini{font-size:13px;padding:6px 12px;min-height:0;margin:4px 6px 0 0;background:transparent;color:var(--blue);border:1.5px solid var(--rand);}
.kh-knopf:focus-visible,.kh-option:focus-within{outline:3px solid var(--blue);outline-offset:2px;}
.kh-inline{display:inline;margin:0;}
.kh-linkknopf{background:none;border:none;padding:0;font:inherit;color:var(--blue);text-decoration:underline;cursor:pointer;}
.kh-knoepfe{display:flex;flex-wrap:wrap;gap:10px;align-items:center;}
.kh-knopf:disabled{opacity:.45;cursor:not-allowed;}
.kh-zusage{border:1.5px solid var(--rand);border-radius:14px;padding:12px 14px;margin:12px 0;font-size:14px;}
.kh-zusage p{margin:0 0 8px;}
.kh-zusage label{display:flex;gap:10px;align-items:flex-start;margin:0 0 8px;}
.kh-zusage input{width:20px;height:20px;flex:none;margin-top:1px;}
.kh-nein{margin-top:10px;}

/* Einwilligung */
.kh-haken{display:flex;gap:12px;align-items:flex-start;border:1.5px solid var(--rand);border-radius:14px;padding:13px 15px;margin:0 0 10px;cursor:pointer;}
.kh-haken input{width:22px;height:22px;flex:none;margin-top:1px;accent-color:var(--blue);}

/* Fragebogen */
.kh-schritt{border:none;margin:0 0 26px;padding:0;min-width:0;}
.kh-schritt legend{padding:0;margin:0 0 14px;width:100%;}
.kh-zaehler{display:block;font-size:13px;color:var(--ink-soft);margin:0 0 6px;}
.kh-fragetext{display:block;font-size:19px;font-weight:600;line-height:1.4;}
.kh-bezug{font-weight:600;color:var(--blue);}
.kh-skala,.kh-optionen{display:flex;flex-direction:column;gap:8px;}
.kh-option{display:flex;gap:12px;align-items:center;border:1.5px solid var(--rand);border-radius:14px;padding:12px 14px;cursor:pointer;min-height:50px;}
.kh-option input{width:20px;height:20px;flex:none;accent-color:var(--blue);}
.kh-option:has(input:checked){border-color:var(--blue);background:var(--blue-soft,#DCEBFF);}
.kh-option--klein{min-height:0;padding:9px 12px;font-size:14px;}
.kh-wert{font-family:'Space Grotesk',sans-serif;font-weight:700;width:18px;text-align:center;flex:none;}
.kh-na{margin-top:6px;border-style:dashed;}
.kh-bogen textarea,.kh-bogen input[type=text]{width:100%;font:inherit;color:inherit;background:transparent;border:1.5px solid var(--rand-hell,var(--rand));
  border-radius:12px;padding:11px 13px;margin-top:6px;}
.kh-zusatz{display:block;margin-top:10px;}
/* Mit JavaScript: eine Frage je Bildschirm */
.kh-js .kh-schritt{display:none;}
.kh-js .kh-schritt.kh-aktiv{display:block;}
.kh-fortschritt{display:none;height:6px;border-radius:99px;background:var(--rand);margin:0 0 20px;overflow:hidden;}
.kh-js .kh-fortschritt{display:block;}
.kh-fortschritt-balken{height:100%;width:0;background:var(--neon,var(--blue));transition:width .25s;}
.kh-nav{display:flex;justify-content:space-between;gap:10px;margin-top:6px;}
.kh-nav[hidden]{display:none;}

/* Persoenlicher Bericht */
.kh-hilfe{border:1.5px solid var(--hinweis-rand,#E7E4DC);background:var(--hinweis-bg,#FFF9E8);border-radius:16px;padding:16px 18px;margin:20px 0;}
.kh-hilfe h2{margin-top:0;}
.kh-sicht{border-top:1px solid var(--rand);margin-top:22px;padding-top:6px;}
.kh-stellen{list-style:none;padding:0;margin:0;}
.kh-stellen li{margin:0 0 14px;font-size:14.5px;line-height:1.5;}
.kh-verlauf{padding-left:20px;}
.kh-verlauf li{margin:0 0 14px;}

/* Betrieb */
.kh-fall{border:1.5px solid var(--rand);border-radius:16px;padding:16px 18px;margin:0 0 16px;}
.kh-punkt{display:inline-block;width:14px;height:14px;border-radius:50%;vertical-align:-2px;}
.kh-verlaufstabelle{border-collapse:collapse;margin:12px 0 4px;font-size:13.5px;width:100%;}
.kh-verlaufstabelle th,.kh-verlaufstabelle td{padding:5px 6px;text-align:center;}
.kh-verlaufstabelle tbody th{text-align:left;font-weight:500;}
.kh-bericht{border-top:1px solid var(--rand);padding:10px 0;}
.kh-bericht summary,.kh-beenden summary,.kh-eigene summary{cursor:pointer;font-weight:600;}
.kh-gesamt{font-weight:600;margin-top:10px;}
.kh-themen{list-style:none;padding:0;margin:0 0 10px;}
.kh-themen li{margin:0 0 6px;}
.kh-impuls{border-left:3px solid var(--blue);padding:4px 0 4px 12px;margin:10px 0;}
.kh-impuls p{margin:4px 0 0;font-size:14.5px;}
.kh-offen{margin:12px 0 4px;}
.kh-beenden{margin-top:10px;}
.kh-formular label{display:block;margin:0 0 10px;font-size:14px;}
.kh-formular input{display:block;width:100%;font:inherit;border:1.5px solid var(--rand);border-radius:10px;padding:10px 12px;margin-top:4px;background:#fff;color:inherit;}
.kh-formular .kh-zusage label{display:flex;}
.kh-formular .kh-zusage input{display:inline-block;width:20px;margin-top:1px;}
.kh-kurzliste{list-style:none;padding:0;margin:8px 0 0;}
.kh-kurzliste li{border-top:1px solid var(--rand);padding:12px 0;}
.kh-links-zeile{margin:6px 0 0;font-size:14px;}
.kh-link-wichtig{font-weight:700;}
