/* personalantrag-drawer.css — Mein-Bereich Personalantrag-Drawer

   Quelle: extrahiert aus mein-bereich.css (Pakete ANTRAG-DRAWER + PA-UPGRADE
   View-Mode). Inhalt 1:1.

   Konsumenten: web/js/components/drawers/pa-drawer.js — der
   Drawer rendert Title-Section (PA-Title) + Number-Input-Wrap fuer
   Stunden/Tage + View-Mode-Title.
   ========================================================================== */

/* Drawer-Formular-Styles */
/* .app-drawer-number-wrap → jetzt Shared-SSOT in
   components/drawers/_shared/drawer-fields.css (.app-scope .app-drawer-number-wrap). */

/* ── Paket PA-UPGRADE: Personalantrag-Drawer View-Mode ────────────────── */
.pa-title-area { display: flex; align-items: center; gap: var(--space-3); margin-bottom: var(--space-3); }
.pa-title-label { font-size: var(--font-size-lg); font-weight: var(--fw-semibold); color: var(--color-text); }
.pa-title-dates { font-size: var(--font-size-sm); color: var(--color-text-muted); margin-top: var(--space-xxs); }
.pa-meta-line { font-size: var(--font-size-xs); color: var(--color-text-muted); margin-top: var(--space-3); padding-top: var(--space-2); border-top: 1px solid var(--color-border-light); }

/* ── Einzeltag-/Teil-Storno (genehmigte, mehrtaegige Antraege) ──────────────
   Vertikal gestapelt + 100 % Drawer-Breite → inhaerent responsiv (kein eigener
   Breakpoint noetig; laeuft im narrow-Drawer auf allen Groessen sauber um). */
.pa-tage-storno { margin-top: var(--space-4); padding-top: var(--space-3); border-top: 1px solid var(--color-border-light); }
.pa-tage-hint { font-size: var(--font-size-sm); color: var(--color-text-muted); margin: 0 0 var(--space-3) 0; }
.pa-tage-list { display: flex; flex-direction: column; gap: var(--space-1); margin-bottom: var(--space-3); }
.pa-tag-check { display: flex; align-items: center; gap: var(--space-2); font-size: var(--font-size-sm); color: var(--color-text); cursor: pointer; padding: var(--space-1) 0; }
.pa-tag-check input { flex: 0 0 auto; margin: 0; }