/* ============================================================================
 * v10 (22.10.2026) · Aufgabenportal im iPhone-App-Design, NUR unter html.nv-app
 * (User-Agent NorvoltApp/ und unter 768 px, gesetzt von app-telefon.js).
 * Browser, iPad und die App auf dem iPad sehen nichts davon.
 * NORVOLT-CI: Navy #0B2D4F, Gruen #478341/#3B6C37, Linie #DFE4E9, Flaeche #F4F6F8.
 * ========================================================================== */
.app-nur { display: none !important; }

html.nv-app, html.nv-app body { height: 100%; background: #F4F6F8; overflow-x: clip; }
html.nv-app body { -webkit-tap-highlight-color: transparent; }
.nv-app .app-nur { display: revert !important; }

.nv-app #ansicht-board:not([hidden]) { display: flex; flex-direction: column; height: 100dvh; }

/* Leiste oben: deckend ueber der Statusleiste, Symbole in Navy */
.nv-app .kopf {
  flex: 0 0 auto; height: calc(44px + env(safe-area-inset-top)); padding: env(safe-area-inset-top) 6px 0 12px;
  background: #F4F6F8; color: #1C2630; border-bottom: 0;
}
.nv-app .kopf-logo, .nv-app .kopf-titel { display: none; }
.nv-app #knopf-glocke, .nv-app #knopf-einstellungen { display: none; }
.nv-app .kopf-knopf svg { stroke: #0B2D4F; }
.nv-app .kopf-knopf svg .voll { fill: #0B2D4F; }
.nv-app .kopf-knopf:hover { background: transparent; }

/* Grosser Titel */
.nv-app .app-grosstitel-auf {
  display: block; flex: 0 0 auto; margin: 0; padding: 0 16px 8px; background: #F4F6F8;
  font-size: 32px; line-height: 38px; font-weight: 700; letter-spacing: -.01em; color: #0B2D4F;
}

/* Bereiche als Chipreihe, Spalten als Segment */
.nv-app .reiter-leiste { flex: 0 0 auto; background: #F4F6F8; border-bottom: 0; padding: 0 16px 8px; }
.nv-app .statusreiter { flex: 0 0 auto; display: flex; background: #F4F6F8; border-bottom: 0; padding: 0 16px 10px; gap: 6px; }
.nv-app .status-reiter-knopf { min-height: 36px; border-radius: 18px; font-size: 13px; padding: 6px 12px; }
.nv-app .status-reiter-knopf.ist-aktiv { background: #0B2D4F; border-color: #0B2D4F; color: #fff; }

/* Board: fuellt den Platz zwischen Titel und Tab-Leiste */
.nv-app .board { flex: 1 1 auto; height: auto !important; min-height: 0; background: #F4F6F8; }
.nv-app .spalte { background: #F4F6F8; }
.nv-app .spalten-kopf, .nv-app .spalten-strich, .nv-app .spalte .knopf-neu { display: none; }

/* Karten als kompakte Zeilen in einer gruppierten Liste */
.nv-app .spalten-liste {
  margin: 0 16px; padding: 0 !important; gap: 0 !important; background: #fff;
  border: 1px solid #DFE4E9; border-radius: 12px; overflow: hidden auto; align-self: start; max-height: 100%; flex: 0 1 auto !important;
}
.nv-app .spalten-liste > .leer-hinweis { padding: 16px; }
.nv-app .karte {
  border: 0; border-radius: 0; box-shadow: none; padding: 11px 16px; min-height: 64px;
  display: flex; flex-direction: column; justify-content: center; background: #fff;
}
.nv-app .karte + .karte { border-top: 1px solid #DFE4E9; }
.nv-app .karte:active { background: #F4F6F8; }
.nv-app .karte-bereich { margin-bottom: 2px; font-size: 12px; }
.nv-app .karte-titel { font-size: 16px; line-height: 21px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.nv-app .karte-fuss { margin-top: 4px; min-height: 0; gap: 8px; font-size: 13px; }
.nv-app .karte-fuss .avatar { width: 20px; height: 20px; font-size: 9px; }

/* Tab-Leiste unten */
.nv-app .app-tabs-auf {
  flex: 0 0 auto; display: flex !important; background: #fff; border-top: 1px solid #DFE4E9;
  padding: 0 env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
}
.nv-app .app-tab-auf {
  position: relative; flex: 1 1 0; min-width: 0; height: 50px; display: flex; flex-direction: column; align-items: center;
  justify-content: center; gap: 2px; border: 0; background: transparent; color: #5A6672; font: inherit; font-size: 10.5px; font-weight: 500;
}
.nv-app .app-tab-auf svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
.nv-app .app-tab-auf.aktiv { color: #3B6C37; }
.nv-app .app-tab-auf.aktiv svg { stroke: #478341; }
.nv-app .app-tab-zahl {
  position: absolute; top: 3px; left: calc(50% + 4px); min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px;
  background: #C8952A; color: #1C2630; font-size: 11px; font-weight: 700; line-height: 18px; text-align: center; border: 2px solid #fff;
}

/* Dialoge: Blatt von unten ueber die volle Breite, Safe Area unten */
.nv-app .dialog, .nv-app .dialog-schmal { padding-bottom: env(safe-area-inset-bottom); }