/* Demo "Papierloses Büro": Papierblatt, Fundstellen, Prüfungen, Fristen, Kundenlink, Überblick */
.pb-ico { width: 40px; height: 40px; border-radius: 10px; background: var(--lime-hell); color: var(--gruen); display: inline-flex; align-items: center; justify-content: center; flex: none; }
.pb-ico.gross { width: 44px; height: 44px; }

/* Papierblatt */
.brief-klappe { margin: 12px 0 0; }
.brief-klappe > summary { list-style: none; min-height: 44px; display: inline-flex; align-items: center; gap: 8px; cursor: pointer; }
.brief-klappe > summary::-webkit-details-marker { display: none; }
.papier { background: #fffefa; border: 1px solid #e3ddc9; border-radius: 6px; box-shadow: 0 2px 10px rgba(21, 44, 40, .08); padding: 22px 22px 26px; font-size: 14.5px; line-height: 1.55; max-height: 560px; overflow-y: auto; margin-top: 6px; }
.papier .bz { display: block; white-space: pre-wrap; overflow-wrap: anywhere; min-height: 1.2em; }
.papier .bz:first-child { font-weight: 700; font-size: 16px; }
.papier.xml { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 14px; line-height: 1.5; background: #f8f9f6; }
.papier.xml .bz:first-child { font-weight: 400; font-size: 14px; }
.papier mark { background: #ffe58a; color: var(--tinte); border-radius: 3px; padding: 1px 2px; box-shadow: 0 0 0 2px #e8b923; }
.papier .bz-mark { background: #fff7d6; }

/* Erkannte Angaben */
.feld-liste { list-style: none; margin: 12px 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 8px; }
.feld { width: 100%; min-height: 52px; text-align: left; display: flex; flex-direction: column; gap: 2px; padding: 8px 12px; border-radius: 10px; border: 1px solid var(--linie); background: var(--weiss); color: var(--tinte); font: inherit; cursor: pointer; }
.feld span { font-size: 14px; color: var(--muted); }
.feld b { font-size: 15px; overflow-wrap: anywhere; }
.feld:hover { border-color: var(--gruen); }
.feld.an { border-color: #e8b923; background: #fff7d6; box-shadow: inset 3px 0 0 #e8b923; }
.abschnitt-h3 { font-size: 16px; margin: 18px 0 8px; }

/* Prüfungen */
.befunde { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.befund { display: flex; gap: 10px; align-items: flex-start; padding: 9px 12px; border-radius: 10px; font-size: 14.5px; }
.befund > div { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.befund > div > span:last-child { overflow-wrap: anywhere; }
.befund.ok { background: #eaf4ee; } .befund.ok > .ico { color: var(--erfolg); }
.befund.hinweis { background: #fbf3e2; } .befund.hinweis > .ico { color: #8a5a12; }
.befund.sperre { background: #f9e4e0; } .befund.sperre > .ico { color: var(--gefahr); }
.vorschlag-satz { display: flex; gap: 10px; align-items: flex-start; font-weight: 600; margin: 0 0 8px; }
.vorschlag-satz > .ico { color: var(--erfolg); margin-top: 2px; flex: none; }
.vorschlag-satz.gesperrt > .ico { color: var(--gefahr); }
.ablage-liste { list-style: none; margin: 0 0 8px; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.ablage-liste li { display: flex; gap: 10px; align-items: flex-start; font-size: 14.5px; }
.ablage-liste li > .ico { color: var(--gruen); margin-top: 2px; flex: none; }
.ablage-liste li > div { display: flex; flex-direction: column; min-width: 0; }
.umbruch { overflow-wrap: anywhere; }
.frist-liste, .frist-kurz { list-style: none; margin: 0 0 8px; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.frist-zeile { background: var(--weiss); border: 1px solid var(--linie); border-radius: 10px; padding: 9px 12px; display: flex; flex-direction: column; gap: 3px; font-size: 14.5px; }
.fz-kopf { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.fz-weg, .fk-weg { color: var(--muted); font-size: 14px; }
.fz-we { display: flex; gap: 6px; align-items: flex-start; color: #7a4f0f; font-size: 14px; font-weight: 600; }
.frist-kurz li { font-size: 14.5px; padding-left: 12px; border-left: 3px solid var(--lime); }
.lesbar { border: 1px solid var(--linie); border-radius: 10px; background: var(--weiss); padding: 6px 12px; }
.lb-zeile { display: flex; justify-content: space-between; gap: 12px; padding: 6px 0; border-bottom: 1px solid var(--linie-hell); font-size: 14.5px; }
.lb-zeile:last-child { border-bottom: 0; }
.lb-zeile.summe { font-weight: 650; }
.lb-zeile b { white-space: nowrap; }
.wirkung .knopf.primaer { margin-top: 8px; }

/* Fristen */
.frist-karten { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.frist-karte { display: grid; grid-template-columns: 170px minmax(0, 1fr); gap: 14px; background: var(--weiss); border: 1px solid var(--linie); border-radius: var(--radius); padding: 12px 14px; }
.frist-karte.gesperrt { border-color: #e6bdb5; background: #fdf6f4; }
.fk-datum { display: flex; flex-direction: column; gap: 2px; }
.fk-datum span { color: var(--muted); font-size: 14px; }
.fk-inhalt { display: flex; flex-direction: column; gap: 4px; min-width: 0; font-size: 14.5px; }
.fk-kopf { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; }
.fk-kopf b { font-size: 16px; }
.fk-stand .pille { white-space: normal; }
.kurz-liste { list-style: none; margin: 0 0 8px; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.kurz-liste li { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; font-size: 14.5px; padding: 8px 0; border-bottom: 1px solid var(--linie-hell); }
.kurz-liste li > span:first-child { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.kurz-liste small { color: var(--muted); font-size: 14px; }
.kurz-liste .pille { white-space: normal; flex: none; max-width: 45%; }
.gesperrt-karte h2 .ico { color: var(--gefahr); }
.zahl-vorschau { list-style: none; margin: 10px 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.zv-wahl { display: flex; gap: 12px; align-items: flex-start; padding: 10px 12px; border: 1px solid var(--linie); border-radius: 10px; cursor: pointer; min-height: 44px; }
.zv-wahl input { width: 24px; height: 24px; margin: 2px 0 0; flex: none; accent-color: var(--gruen); }
.zv-text { display: flex; flex-direction: column; gap: 2px; font-size: 14.5px; min-width: 0; overflow-wrap: anywhere; }

/* Fragen */
.fragen-knoepfe { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.fragen-knoepfe .frage { white-space: normal; text-align: left; justify-content: flex-start; height: auto; min-height: 44px; }
.antwort { margin-top: 16px; }
.antwort-satz { display: flex; gap: 10px; align-items: flex-start; font-size: 16.5px; line-height: 1.5; background: #f6fbe6; border: 1px solid #c9df86; border-radius: 10px; padding: 12px 14px; margin: 0 0 10px; }
.antwort-satz > .ico { color: var(--gruen); flex: none; margin-top: 3px; }
.quellen { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 10px; }
.quelle-karte { display: flex; flex-direction: column; gap: 4px; align-items: flex-start; border: 1px solid var(--linie); border-radius: 10px; padding: 10px 12px; background: var(--weiss); min-width: 0; }
.quelle-karte > b { font-size: 15px; overflow-wrap: anywhere; }
.q-stelle { font-size: 14px; background: #fffefa; border: 1px dashed #e3ddc9; border-radius: 6px; padding: 6px 8px; width: 100%; overflow-wrap: anywhere; }
.q-stelle mark { background: #ffe58a; border-radius: 3px; }
.suche label { display: block; font-weight: 600; margin: 6px 0; }
.suche-zeile { display: flex; gap: 8px; flex-wrap: wrap; }
.suche-zeile .eingabe { flex: 1 1 220px; min-height: 44px; font-size: 16px; }

/* Kundenlink */
.kunden-raster { display: grid; grid-template-columns: minmax(0, 400px) minmax(0, 1fr); gap: 28px; align-items: start; }
.tel-ueberschrift { display: flex; align-items: center; gap: 8px; font-weight: 650; margin: 0 0 10px; color: var(--muted); font-size: 14px; text-transform: uppercase; letter-spacing: .08em; }
.tel-rahmen { border: 10px solid #1c2522; border-radius: 42px; background: #1c2522; box-shadow: var(--schatten-gross); overflow: hidden; max-width: 400px; }
.tel-app { background: #f4f6f1; border-radius: 32px; overflow: hidden; min-height: 640px; display: flex; flex-direction: column; }
.tel-appkopf { display: flex; align-items: center; gap: 10px; padding: 18px 16px 12px; background: var(--gruen); color: #fff; }
.tel-appkopf b { flex: 1; font-size: 16px; }
.tel-marke { width: 32px; height: 32px; border-radius: 9px; background: var(--lime); color: var(--gruen); display: inline-flex; align-items: center; justify-content: center; }
.tel-inhalt { padding: 14px 14px 22px; flex: 1; }
.tel-gruss { font-size: 22px; font-weight: 650; margin: 2px 0 10px; }
.tel-h { font-size: 14px; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); margin: 18px 0 8px; }
.tel-liste { list-style: none; margin: 0 0 12px; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.tel-karte { background: var(--weiss); border: 1px solid var(--linie); border-radius: 14px; padding: 12px; display: flex; flex-direction: column; gap: 4px; }
.tel-klein { font-size: 14px; color: var(--muted); }
.tel-ok { display: inline-flex; gap: 6px; align-items: center; color: var(--erfolg); font-weight: 600; font-size: 14px; }
.tel-aufgabe { display: flex; gap: 12px; align-items: center; }
.tel-aufgabe > div { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.tel-aufgabe .attrappe { width: 72px; flex: none; }
.tel-breit { width: 100%; margin-top: 8px; }
.attrappe { display: block; border-radius: 8px; }
.buero-sicht h2 .ico { color: var(--gruen); }
.akte-liste { list-style: none; margin: 10px 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.akte-stueck { display: flex; gap: 12px; align-items: flex-start; padding: 10px 12px; border-radius: 10px; background: #f6f7f2; }
.akte-stueck .attrappe { width: 64px; flex: none; }
.akte-stueck > div { display: flex; flex-direction: column; gap: 4px; align-items: flex-start; min-width: 0; font-size: 14.5px; }
.akte-stueck .pille { white-space: normal; }
.blatt-bild { display: flex; gap: 12px; flex-wrap: wrap; }
.blatt-bild .attrappe { width: 200px; max-width: 100%; }

@media (max-width: 860px) {
  .kunden-raster { grid-template-columns: minmax(0, 1fr); }
  .tel-rahmen { max-width: none; border-width: 8px; border-radius: 34px; }
  .tel-app { border-radius: 26px; min-height: 0; }
  .frist-karte { grid-template-columns: minmax(0, 1fr); gap: 6px; }
  .papier { padding: 14px; max-height: 420px; }
  .feld-liste { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 6px; }
  .feld-liste li.breit { grid-column: 1 / -1; }
  .feld { min-height: 44px; padding: 5px 10px; gap: 0; }
  .feld b { font-size: 14.5px; }
  .ok-klappe { margin-top: 6px; }
  .ok-klappe > summary { list-style: none; min-height: 44px; display: inline-flex; align-items: center; gap: 8px; cursor: pointer; color: var(--erfolg); }
  .ok-klappe > summary::-webkit-details-marker { display: none; }
  .pb-aktionen { flex-wrap: nowrap; flex-direction: row; gap: 8px; }
  .pb-aktionen .knopf { flex: 1 1 0; min-width: 0; }
  /* Nicht klebend: Die Leiste lag am Handy über Prüfungen und Warnungen (Codex 14.11.2026). Sie steht am Ende des Vorschlags. */
  .pb-aktionen { background: #fbfdf5; border: 1px solid #c9df86; border-radius: 12px; padding: 8px; }
  .befunde { gap: 4px; }
  .befund { padding: 7px 10px; }
  .quellen { grid-template-columns: minmax(0, 1fr); }
}
@media (prefers-reduced-motion: reduce) { .papier { scroll-behavior: auto; } }

/* Schrift überall mindestens 14 px (auch am Rechner, Kern-Werte bleiben für die Fahrschule unverändert) */
body :is(.eyebrow, .pille, .klein, .mini-h, .entwurf-label, .kennzahl span, .pz-text, .abschnitt-satz, .gedaempft.klein, .tel-h, .nav-gruppe, .fuss-text) { font-size: 14px; }
.kennzahlen { grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); }
.kennzahl b { white-space: nowrap; }
@media (max-width: 860px) { .kennzahlen { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } .kennzahl b { font-size: 21px; } }
.fk-zweit { color: var(--muted); font-size: 14px; }
.kurz-liste li > b { white-space: nowrap; flex: none; }
