/* app-shells.css — Mein-Tag V2-UI Shells (.mt-aufg-app/.mt-anfr-app/.mt-vk-app)

 Quelle: extrahiert aus mein-tag.css ("fuer Tab Meine
 Aufgaben"-Block + zugehoerige Mobile/Tablet-Overrides). Inhalt 1:1.

 Konsumenten: web/js/sections/mein-tag.js — die drei Listen-Apps in der
 mittleren Spalte (Aufgaben / Anfragen / Verkaufschancen) teilen sich
 die Shell-Layout (flex column, Toolbar oben, GroupedList unten).

 GroupedList-Modul-CSS (.grouped-list / .gl-*) liegt in components.css —
 SSOT fuer alle Konsumenten.

 Card-Hoehe konsistent gemacht (132px Desktop/Tablet, 142px Mobile)
 damit alle drei Listen-Tabs gleich aussehen. Specificity-Bump
 (.mein-tag-grid) noetig, weil anfragen.css spaeter geladen wird.

 Aufgaben-Karten haben Mein-Tag-spezifischen Violet-Gradient; Anfragen + VK haben eigene Backgrounds aus anfragen.css /
 verkaufschancen-Section.
 ========================================================================== */

.mt-aufg-app,
.mt-anfr-app,
.mt-vk-app { display: flex; flex-direction: column; min-height: 0; flex: 1; }

/* V2-Toolbar haengt direkt an der Sub-Tab-Leiste — eigene Top-Border weglassen,
 damit keine Doppellinie entsteht (Sub-Tab-Leiste hat schon einen Bottom-Border). */
.mt-aufg-app .app-page-toolbar,
.mt-anfr-app .app-page-toolbar,
.mt-vk-app .app-page-toolbar {
 border-top: none;
}

/* Schmale Spalten-Toolbars (Aufgaben/Anfragen/VK stehen im 3-Spalten-Layout,
 je ~460px). Der globale Positions-Stabilitaets-Default (rigide 440px-Suche +
 wachsender Spacer, toolbar.css) passt hier NICHT: eine 440px-Suche laesst der
 Icon-Reihe + „+"-Button rechts keinen Platz → Overflow/Clipping. Diese
 Spalten-Toolbars haben keine variablen Pills/Center-Controls (ein View-Wechsel
 tauscht die ganze Spalten-App, nicht die Controls EINER Toolbar), also gibt es
 hier nichts, das „springen" koennte — es greift weiter das greedy-Such-Modell
 wie vor 2026-07-13: LEFT waechst, die Suche fuellt den Rest und darf schrumpfen,
 der Spacer ist aus. (Gleiche Mechanik wie der globale Mobile-Modus.) */
.mt-aufg-app .app-toolbar-left,
.mt-anfr-app .app-toolbar-left,
.mt-vk-app .app-toolbar-left { flex: 1 1 auto; }
.mt-aufg-app .app-toolbar-flex,
.mt-anfr-app .app-toolbar-flex,
.mt-vk-app .app-toolbar-flex { display: none; }
/* Suche fuellt den Rest, behaelt aber eine NUTZBARE Mindestbreite (nicht 0):
   frueher schrumpfte sie auf ihr Icon, weil das State-Segmented vollen Platz
   nahm — und die Tier-Engine misst ein grow-Element ueber min-width, sah die
   Suche also als 0px und eskalierte nie (das Segmented klappte nie ein). Mit
   einer echten min-width „sieht" die Engine den Suchbedarf und klappt bei Enge
   zuerst das Segmented zum Status-Dropdown ein (Tier 9), statt die Suche zu
   erdruecken. Auf <600px greift der globale greedy-Mobile-Override
   (min-width:100px !important, toolbar.css) — dort bleibt es beim greedy-Modus. */
.mt-aufg-app .app-search-input,
.mt-anfr-app .app-search-input,
.mt-vk-app .app-search-input { flex: 1 1 auto; min-width: 176px; max-width: none; }

/* GroupedList-Container: scrollt vertikal innerhalb der Spalte. */
.mt-aufg-app .mt-aufg-list,
.mt-anfr-app .mt-anfr-list,
.mt-vk-app .mt-vk-list {
 flex: 1;
 min-height: 0;
 overflow-y: auto;
 overscroll-behavior: contain;
 padding: var(--space-3);
 scrollbar-width: thin;
}

/* GroupedList-Modul-CSS (.grouped-list / .gl-*) liegt in components.css. */

/* V2-Karten in den Listen — nur was ueber .card-v2-Defaults hinausgeht. */
.mt-aufg-card,
.mt-anfr-card,
.mt-vk-card { cursor: pointer; }

/* Einheitliche Card-Hoehe in Mein Tag fuer alle drei
 Listen (Aufgaben/Anfragen/VK). Aufgaben kommen aus dem Kanban-Pfad mit
 .card-v2--compact (148px fix); im Mein-Tag-Scope angleichen, damit die
 Spalten-Tabs nicht unterschiedlich hohe Karten zeigen.
 Specificity-Bump (.mein-tag-grid) noetig, weil anfragen.css spaeter geladen
 wird und mit .app-scope .card-v2.anfr-card-app { height: 180px } konkurriert. */
.mein-tag-grid .mt-aufg-app .card-v2.card-v2--compact.mt-aufg-card,
.mein-tag-grid .mt-anfr-app .card-v2.anfr-card-app,
.mein-tag-grid .mt-vk-app .card-v2.vk-card-app {
 /* Hoehe von 120px auf 132px erhoeht. 120px reichten
 bei vollen Karten (Header + Subtitle + Context-Pille + Footer +
 Progress-Strip 3px) nicht — der Inhalt presste den Footer-Avatar
 direkt auf die Progress-Bar. 132px = 120px + 12px Atempolster fuer den
 Bottom-Bereich (genug fuer Progress-Strip 3px + ~9px Spalt zum
 Avatar). Karten ohne Progress-Strip wirken minimal hoeher; das ist
 vertretbar fuer die Lesbarkeit. */
 height: 132px;
 min-height: 132px;
}

/* Title-Slot auf 1 Zeile begrenzen, damit der Header
 (HERKUNFT-Pill + A-Nr + Status-Pill) nicht durch reservierte 2-Zeilen-Hoehe
 (calc(1.35em * 2) ≈ 38px) verdraengt wird. Im 120px-Frame brauchen wir
 diese 19px fuer die Badge-Reihe oben. Workspace/Kanban (148px+) bleibt bei
 Default 2-Zeilen, weil dort genug Platz ist. */
.mein-tag-grid .mt-aufg-app .card-v2.card-v2--compact.mt-aufg-card .card-app-title,
.mein-tag-grid .mt-anfr-app .card-v2.anfr-card-app .card-app-title,
.mein-tag-grid .mt-vk-app .card-v2.vk-card-app .card-app-title {
 -webkit-line-clamp: 1;
 min-height: calc(1.35em * 1);
 white-space: nowrap;
 overflow: hidden;
 text-overflow: ellipsis;
}

/* Aufgaben-Karten: hochwertiger, einzigartiger Hintergrund analog Anfragen
 (DarkBlue-50-Gradient) und VK (Turquoise-100-Gradient). Violet-100-Gradient
 diagonal (135deg) mit doppeltem Stop — warm-violett oben links, weiss unten
 rechts. Plus subtiler radialer Lichteinfall oben rechts (analog Premium-
 Material-Karten). Nur im Mein-Tag-Scope, um Kanban (weisse Karte) nicht zu
 beruehren. */
.mt-aufg-app .card-v2.mt-aufg-card {
 background:
 radial-gradient(circle at 95% 0%,
 color-mix(in srgb, var(--lod-violet-100) 80%, transparent) 0%,
 transparent 45%),
 linear-gradient(135deg,
 var(--lod-violet-100) 0%,
 color-mix(in srgb, var(--lod-violet-100) 30%, var(--color-surface)) 40%,
 var(--color-surface) 100%);
}

/* Projekt-Pill in der Toolbar (slots.center) — visuell identisch zum
 Gruppierungs-Trigger, aber ohne festen min-width. */
.app-scope .mt-aufg-projekt-pill {
 /* Erbt .app-tb-btn-Defaults (Hoehe 36, Border, Hover-Logik). */
 max-width: 220px;
}
.app-scope .mt-aufg-projekt-pill-label {
 overflow: hidden;
 text-overflow: ellipsis;
 white-space: nowrap;
}

/* Day-Selector-Scope-Pill ("gebucht am Tag", entfernbar). Erbt .app-tb-btn +
   .has-value (Brand-getoent = aktiver Scope). Dismiss-X am Ende signalisiert,
   dass ein Klick den Scope entfernt (→ mtSelectDay(null)). */
.app-scope .mt-aufg-tag-pill {
 display: inline-flex;
 align-items: center;
 gap: var(--space-1);
}
.app-scope .mt-aufg-tag-pill.hidden { display: none; }
.app-scope .mt-aufg-tag-pill-label { white-space: nowrap; }

/* Notebook 1000-1399: keine Sonderbehandlung noetig — V2-Toolbar tier-System
 greift selbststaendig, GroupedList ist ohnehin 1-Spalten-Layout. */

/* Tablet 600-999: weniger Padding. */
@media (max-width: 999px) {
 .mt-aufg-app .mt-aufg-list,
 .mt-anfr-app .mt-anfr-list,
 .mt-vk-app .mt-vk-list { padding: var(--space-2); }
 /* GroupedList-Tablet-Override (.grouped-list gap) liegt in components.css. */
 /* einheitliche Card-Hoehe responsive.
 Tablet von 120 auf 132 angeglichen an Desktop —
 gleicher Atempolster fuer Footer/Progress-Bar. */
 .mein-tag-grid .mt-aufg-app .card-v2.card-v2--compact.mt-aufg-card,
 .mein-tag-grid .mt-anfr-app .card-v2.anfr-card-app,
 .mein-tag-grid .mt-vk-app .card-v2.vk-card-app { height: 132px; min-height: 132px; }
}

/* Mobile <600: Liste ohne horizontales Padding (volle Breite), Headerschrift
 bleibt lesbar. Toolbar bringt eigenes Mobile-Verhalten via Tier-System.
 GroupedList-Mobile-Padding (.gl-group-header / .gl-group-cards) liegt in
 components.css. */
@media (max-width: 599px) {
 .mt-aufg-app .mt-aufg-list,
 .mt-anfr-app .mt-anfr-list,
 .mt-vk-app .mt-vk-list { padding: var(--space-2) 0; }
 /* einheitliche Card-Hoehe Mobile.
 Mobile von 130 auf 142 erhoeht (= 132 Desktop +
 10 fuer den 2-Zeilen-Titel auf schmalen Screens). Atempolster zur
 Progress-Bar bleibt erhalten. */
 .mein-tag-grid .mt-aufg-app .card-v2.card-v2--compact.mt-aufg-card,
 .mein-tag-grid .mt-anfr-app .card-v2.anfr-card-app,
 .mein-tag-grid .mt-vk-app .card-v2.vk-card-app { height: 142px; min-height: 142px; }
}