/* vitaqm-ui-fixes.css · nicht-destruktive UI-Korrekturen auf arbeit2 (Override NACH Haralds CSS) · 09.08.2026 */

/* (2) Kopf-Brand: kein Überlappen — Dachmarke raus (passte nicht in die niedrige
   Kopfzeile) + Untertitel einzeilig mit Ellipsis. Brand = "VitaQM" + Untertitel. */
.marke{ height:auto; min-height:64px; overflow:visible; align-items:center; }
.brand{ align-items:flex-start; line-height:1.14; min-width:0; }
.brand-dach{ display:none !important; }
.marke .brand > div{ min-width:0; }
.marke .brand small{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%; }

/* (1) Menü: saubere Umbrüche statt mitten im Wort */
.side .nav-text{
  overflow-wrap:break-word !important;
  word-break:normal !important;
  -webkit-hyphens:auto; hyphens:auto;
}

/* (3) Sidebar-Breite ziehbar: Griff am rechten Rand (JS setzt --nav-w) */
.side{ position:relative; }
.side-resizer{ position:absolute; top:0; right:-4px; width:9px; height:100%; cursor:col-resize; z-index:40; }
.side-resizer:hover, .side-resizer.aktiv{ background:linear-gradient(90deg,transparent,rgba(14,138,156,.35)); }

/* (4) Externe-Dokument-Vorschau: deutlich größer + kleine Bilder/Scans füllen die Fläche */
.ext-vorschau{ min-height:min(84vh,920px) !important; }
.ext-vorschau img{ width:100%; height:auto; max-height:100%; object-fit:contain; cursor:zoom-in; }
.ext-vorschau img.ext-zoom{ width:auto; height:auto; max-width:none; max-height:none; object-fit:none; cursor:zoom-out; }
.ext-vorschau{ overflow:auto !important; align-items:flex-start !important; }

/* (5) Schulungsmatrix: Spaltenköpfe sprechend statt Kürzel — höher + lesbar */
.hm-kopf{ height:186px !important; width:30px !important; min-width:30px !important; }
.hm-kopf span{ color:var(--ink2) !important; max-height:174px; overflow:hidden; text-overflow:ellipsis; }