/* ==========================================================================
   app-scope.css — v2 App-Scope Reset + Tab-Layout-SSOT

   Quelle: extrahiert aus app.css (Bloecke "Reset innerhalb app-scope" und
   die globale `.tab-content:has(> .app-scope)`-Regel aus dem Block
   "Seiten-Shell Grundstruktur fuer v2"). Inhalt 1:1 uebernommen.

   Architektur-Begruendung (uebernommen aus app.css-Header):
   Alle Regeln sind unter `.app-scope` gescoped. Hintergrund: Die Handoff-
   `app.css` enthaelt globale Reset-Regeln (`* { box-sizing: border-box }`,
   `html, body { overflow: hidden }`, `button { cursor: pointer }`), die
   auf Altseiten gezogen werden wuerden, wenn die Datei global in `index.html`
   geladen waere. Die Scope-Klasse ist CSS-Isolation, keine Feature-Flag-
   Architektur.
   ========================================================================== */

/* ══════════════════════════════════════════════════════════════════════════
   Reset innerhalb app-scope
   ══════════════════════════════════════════════════════════════════════════ */

.app-scope,
.app-scope *,
.app-scope *::before,
.app-scope *::after {
  box-sizing: border-box;
}

.app-scope {
  /* Container wird vom Markup auf 100% Höhe des Content-Bereichs gesetzt.
     Kein overflow: hidden hier — das entscheidet die Seite selbst. Layout
     (display:flex / height:100%) konsolidiert hier — frueher in zwei Bloecken. */
  color: var(--lod-gray-900);
  font-family: var(--lod-font-body);
  font-size: var(--font-size-md);
  line-height: var(--lh-comfortable);
  display: flex;
  flex-direction: column;
  height: 100%;
  width: 100%;
}

.app-scope button,
.app-scope input,
.app-scope select,
.app-scope textarea {
  font-family: inherit;
  font-size: inherit;
  color: inherit;
}
.app-scope button { cursor: pointer; border: none; background: none; padding: 0; }
.app-scope a { color: inherit; text-decoration: none; }

/* ══════════════════════════════════════════════════════════════════════════
   Tab-Layout-SSOT (globale Regel, nicht .app-scope-gescoped)

   Wirkt auf jeden #tab-content-* Container, der einen .app-scope-Root als
   direktes Child hat. Hebt das Default-Padding (var(--space-6) aus
   layout.css:930) auf, damit die v2-App-Shell die Layout-Hoheit hat.
   Globaler Override mit !important — laeuft Cascade-unabhaengig.
   ══════════════════════════════════════════════════════════════════════════ */

/* Das Tab-Content-Panel eines v2-Tabs darf kein eigenes Padding haben —
   Padding wird innerhalb der Shell vom Seiten-Markup selbst entschieden.
   Wirkt nur auf Tab-Panels, die einen .app-scope-Root direkt als Child haben. */
.tab-content:has(> .app-scope) {
  padding: 0 !important;
  overflow: hidden !important;  /* Drawer-Scroll-Container macht eigene Scroll-Regelung */
}