/* Hausmeister-Web-App (Spec 2026-09-29): Schale fuer das Handy. Basis shared/app-theme.css, Auftragsliste
   shared/hausmeister-liste.css; protel-frontend-app/styles.css wird NICHT geladen (die paar geliehenen Regeln stehen unten). */
.hw-body { margin: 0; min-height: 100vh; background: var(--bg, #f1f5f9); font-family: Inter, system-ui, sans-serif; }
.hw-login { display: grid; place-items: center; min-height: 100vh; padding: 16px; }
.hw-login__karte { display: grid; gap: 12px; width: min(380px, 100%); padding: 24px; border-radius: 16px; background: #fff; box-shadow: 0 10px 30px rgba(15, 23, 42, 0.12); }
.hw-login__titel { margin: 0; font-size: 24px; }
.hw-app { max-width: 900px; margin: 0 auto; padding: 0 12px 32px; }
.hw-kopf { position: sticky; top: 0; z-index: 10; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 12px 0 8px; background: var(--bg, #f1f5f9); }
.hw-kopf__text { display: grid; }
.hw-reiter { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 12px; }
.hw-reiter__knopf { min-height: 48px; border: 1px solid var(--border, #d1d5db); border-radius: 12px; background: #fff; font: inherit; font-size: 16px; font-weight: 600; cursor: pointer; }
.hw-reiter__knopf.is-active { border-color: #0f766e; background: #0f766e; color: #fff; }
.hw-seite .box__actions { flex-wrap: wrap; }
/* Inline-Meldungen (Anmeldung, Dialog-Fehler) bleiben im Fluss; nur #hw-meldung ist ein Toast */
.hw-body .msg:not(#hw-meldung) { position: static; max-width: none; box-shadow: none; }
#hw-meldung { position: fixed; left: 12px; right: 12px; bottom: calc(12px + env(safe-area-inset-bottom, 0px)); z-index: 80; max-width: 560px; margin: 0 auto; box-shadow: 0 8px 24px rgba(15, 23, 42, 0.18); }
/* Formularfelder gross genug fuer den Finger und 16px, damit iOS beim Fokus nicht zoomt */
.hw-body input:not([type="checkbox"]):not([type="radio"]):not([type="file"]), .hw-body select, .hw-body textarea { min-height: 44px; font-size: 16px; }
.hw-body .btn { min-height: 44px; }
/* Reiter Woche (woche.js) */
.hw-woche__kopf { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 8px; }
.hw-woche__kopf .btn { min-width: 44px; min-height: 44px; font-size: 20px; }
.hw-woche__titel { display: grid; text-align: center; }
.hw-woche__leiste { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 10px 0; }
.hw-heute { margin-bottom: 18px; }
.hw-heute__titel { margin: 6px 0 10px; font-size: 18px; }
.hw-karten { display: grid; gap: 8px; }
.hw-karte { display: grid; gap: 4px; width: 100%; min-width: 0; min-height: 56px; padding: 12px 14px; border: 1px solid var(--border, #e5e7eb); border-left-width: 6px; border-radius: 12px; background: var(--surface, #fff); text-align: left; font: inherit; font-size: 15px; cursor: pointer; white-space: normal; justify-content: stretch; justify-items: stretch; box-sizing: border-box; }
.hw-karte--gross { min-height: 68px; font-size: 17px; }
.hw-karte--aufgabe { border-left-color: var(--teal, #0d9488); }
.hw-karte--termin { border-left-color: var(--violet, #7c3aed); }
.hw-karte--auftrag { border-left-color: var(--warning, #d97706); }
.hw-karte.is-erledigt { opacity: 0.6; }
.hw-karte.is-erledigt .hw-karte__titel { text-decoration: line-through; }
.hw-karte.is-ueberfaellig { background: var(--danger-soft, #fef2f2); border-color: #fca5a5; }
.hw-karte.is-verpasst .hw-karte__info { color: var(--danger, #b91c1c); }
/* Termine aus dem Stadthallenkalender (nur Info) */
.hw-karte.is-kalender { border-left-style: dashed; background: #faf5ff; }
.hw-karte__oben { display: flex; gap: 8px; align-items: baseline; min-width: 0; justify-content: flex-start; }
.hw-karte__haken { min-width: 18px; color: #0f766e; font-weight: 700; }
.hw-karte__titel { min-width: 0; font-weight: 600; overflow-wrap: anywhere; }
.hw-karte__info { min-width: 0; color: var(--muted, #6b7280); font-size: 13px; overflow-wrap: anywhere; }
.hw-tag { margin-bottom: 14px; }
.hw-tag.is-vorbei { opacity: 0.8; }
.hw-tag__titel { margin: 0 0 6px; font-size: 15px; }
.hw-tag__leer { margin: 0; }
/* Reiter Auftraege: Hausmeister-Liste (shared/hausmeister-liste.css) ohne Portal-Rahmen, Karten direkt auf dem Grund */
.hw-body .pf-hm.box { border: 0; background: transparent; box-shadow: none; overflow: visible; }
.hw-body .pf-hm .box__head { padding: 0 0 10px; border: 0; background: transparent; }
.hw-body .pf-hm .box__icon { display: none; }
.hw-body .pf-hm .box__body { padding: 0; }
.hw-body .pf-hm__filter { padding: 0 0 16px; }
.hw-body .pf-hm__chip { min-height: 40px; font-size: 15px; }
.hw-body .pf-hm__segment { min-height: 36px; }
.hw-body .pf-hm__filter select, .hw-body .pf-hm__filter input, .hw-body .pf-hm__mehrfach-text { height: 48px; min-height: 48px; box-sizing: border-box; }
.hw-body .pf-hm__mehrfach-text { padding-top: 12px; font-size: 16px; }
.hw-body .pf-hm__karten { grid-template-columns: 1fr; }
.hw-body .pf-hm__karte { box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08); }
/* frueher aus protel-frontend-app/styles.css geliehen */
.hw-body .pf-hk__schalter { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; }
#wa-bild-gross { display: flex; align-items: center; justify-content: center; }
#wa-bild-gross.hidden { display: none; }
#wa-bild-gross img { max-width: 96vw; max-height: 92vh; border-radius: 8px; background: #000; }
.pf-wa__bild-zu { position: fixed; top: 16px; right: 16px; }
/* Reiter Planung (wartung.js aus dem Front End, shared/wartung-planung.css): nur fuer Planer */
.hw-reiter--drei { grid-template-columns: 1fr 1fr 1fr; }
.hw-reiter--drei .hw-reiter__knopf { font-size: 15px; }
.hw-body .pf-wa.box { border: 0; background: transparent; box-shadow: none; overflow: visible; }
.hw-body .pf-wa .box__head { padding: 0 0 10px; border: 0; background: transparent; }
.hw-body .pf-wa .box__body { padding: 0; }
.hw-body .pf-hk__filter { display: grid; gap: 10px; padding: 0 0 14px; }
.hw-body .pf-hk__chips { display: flex; gap: 6px; padding: 4px 2px; overflow-x: auto; scrollbar-width: none; }
.hw-body .pf-hk__chips::-webkit-scrollbar { display: none; }
.hw-body .pf-hk__chip { flex: none; min-height: 40px; padding: 4px 14px; border: 1px solid var(--border, #d1d5db); border-radius: 999px; background: var(--surface, #fff); color: var(--text, #0f172a); font: inherit; font-size: 15px; font-weight: 500; cursor: pointer; }
.hw-body .pf-hk__chip.is-active { border-color: var(--primary, #4f46e5); background: var(--primary, #4f46e5); color: #fff; }
.hw-body .pf-wa__suche { min-width: 0; }
/* Auftragstabelle als Karten: Ort, Status, Nr. oben; Beschreibung; darunter die uebrigen Angaben */
.hw-body .pf-wa__tabelle, .hw-body .pf-wa__tabelle tbody { display: block; width: 100%; }
.hw-body .pf-wa__tabelle thead { display: none; }
.hw-body .pf-wa__tabelle tr { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin-bottom: 10px; padding: 14px; border: 1px solid var(--border, #e5e7eb); border-left: 4px solid #cbd5e1; border-radius: 14px; background: var(--surface, #fff); box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08); }
.hw-body .pf-wa__tabelle tr.is-hoch { border-left-color: #dc2626; }
.hw-body .pf-wa__tabelle tr.is-in_arbeit { border-left-color: var(--primary, #4f46e5); }
.hw-body .pf-wa__tabelle tr.is-on_hold { border-left-color: #d97706; }
.hw-body .pf-wa__tabelle tr.is-erledigt, .hw-body .pf-wa__tabelle tr.is-abgelehnt { background: var(--surface-2, #f8fafc); box-shadow: none; }
.hw-body .pf-wa__tabelle td { display: block; padding: 0; border: 0; font-size: 13px; color: var(--muted, #6b7280); }
.hw-body .pf-wa__tabelle td:empty { display: none; }
.hw-body .pf-wa__tabelle td:nth-child(2) { order: 1; max-width: 55%; overflow: hidden; padding: 2px 10px; border-radius: 8px; background: var(--surface-3, #f1f5f9); color: var(--text, #0f172a); font-size: 18px; font-weight: 700; text-overflow: ellipsis; }
.hw-body .pf-wa__tabelle td:nth-child(5) { order: 2; }
.hw-body .pf-wa__tabelle td:nth-child(1) { order: 3; margin-left: auto; font-size: 12px; }
.hw-body .pf-wa__tabelle td:nth-child(1)::before { content: "Nr. "; }
.hw-body .pf-wa__tabelle td:nth-child(3) { order: 4; flex: 0 0 100%; max-width: none; overflow: visible; color: var(--text, #0f172a); font-size: 16px; font-weight: 600; line-height: 1.35; white-space: normal; overflow-wrap: anywhere; }
.hw-body .pf-wa__tabelle td:nth-child(4) { order: 5; }
.hw-body .pf-wa__tabelle td:nth-child(4):not(.is-hoch) { display: none; }
.hw-body .pf-wa__tabelle td:nth-child(4)::before { content: "Prio "; }
.hw-body .pf-wa__tabelle td:nth-child(6) { order: 6; }
.hw-body .pf-wa__tabelle td:nth-child(6)::before { content: "Zugewiesen "; }
.hw-body .pf-wa__tabelle td:nth-child(7) { order: 7; }
.hw-body .pf-wa__tabelle td:nth-child(7)::before { content: "Geplant "; }
.hw-body .pf-wa__tabelle td:nth-child(8) { order: 8; }
.hw-body .pf-wa__tabelle td:nth-child(9) { display: none; }
.hw-body .pf-wa__tabelle td:nth-child(10) { order: 9; }
.hw-body .pf-wa__tabelle td:nth-child(10)::before { content: "Bilder "; }
.hw-body .pf-wa__tabelle .badge { display: inline-block; padding: 2px 8px; border-radius: 999px; font-size: 12px; font-weight: 600; }
/* Auftragsdialog auf dem Handy: eine Spalte, Knoepfe umbrechen */
.hw-body .pf-wa__dialog .form-grid { grid-template-columns: 1fr; }
.hw-body .pf-wa__dialog .modal-card__foot { flex-wrap: wrap; gap: 8px; }
.hw-body .pf-wa__dialog .modal-card__foot .btn { flex: 1 1 auto; }
.hw-body .pf-wa__dialog .spacer { display: none; }