:root {
  /* Theme-Variablen (werden zur Laufzeit von applyClientConfig() überschrieben) */
  --spd-red: #E3000F;
  --spd-red-dark: #b5000c;
  --spd-red-deeper: #8a0009;
  --spd-red-light: #fde8e9;
  --spd-red-mid: #f9c0c3;
  --sidebar-bg: #1a0002;
  --theme-rgb: 227, 0, 15;
  --on-primary: #ffffff;
  --bg: #f7f6f4;
  --surface: #ffffff;
  --surface2: #f2f1ee;
  --border: #e0deda;
  --border2: #c8c6c0;
  --text: #1a1917;
  --text2: #6b6960;
  --text3: #9c9a91;
  --green: #1a6b3a;
  --green-light: #e8f5ee;
  --amber: #92600a;
  --amber-light: #fef4e4;
  --radius: 8px;
  --radius-lg: 12px;
  --shadow: 0 1px 3px rgba(0,0,0,.07), 0 1px 2px rgba(0,0,0,.04);
  --shadow-md: 0 4px 16px rgba(0,0,0,.1), 0 2px 4px rgba(0,0,0,.06);
}
* { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif; background: var(--bg); color: var(--text); font-size: 14px; line-height: 1.5; }
button, input, select { font-family: inherit; }

.shell { display: flex; min-height: 100vh; }
.sidebar { width: 228px; background: var(--sidebar-bg); display: flex; flex-direction: column; flex-shrink: 0; position: fixed; top: 0; left: 0; height: 100vh; z-index: 50; }
.main { margin-left: 228px; flex: 1; min-width: 0; padding: 28px 32px; max-width: 1320px; overflow-x: clip; /* I-61: clip statt hidden – kein Scroll-Container, sticky thead funktioniert */ }

/* Sidebar */
.sidebar-logo { padding: 20px 18px 16px; border-bottom: 1px solid rgba(255,255,255,.1); display: flex; align-items: center; gap: 12px; }
.sidebar-logo img { width: 44px; height: 44px; border-radius: 6px; flex-shrink: 0; }
.sidebar-logo .logo-title { font-size: 15px; font-weight: 600; color: #fff; letter-spacing: -.2px; line-height: 1.2; }
.sidebar-logo .logo-sub { font-size: 11px; color: rgba(255,255,255,.5); margin-top: 2px; font-family: ui-monospace, 'SF Mono', SFMono-Regular, Menlo, Consolas, 'Courier New', monospace; }
.sidebar-year { padding: 14px 16px 10px; }
.sidebar-year label { font-size: 10px; color: rgba(255,255,255,.4); text-transform: uppercase; letter-spacing: .7px; display: block; margin-bottom: 6px; }
.year-select { width: 100%; padding: 7px 10px; border: 1px solid rgba(255,255,255,.15); border-radius: var(--radius); font-size: 13px; background: rgba(255,255,255,.08); color: #fff; font-weight: 500; cursor: pointer; }
.year-select:focus { outline: none; border-color: var(--spd-red); }
.year-select option { background: var(--sidebar-bg); color: #fff; }
.nav { flex: 1; padding: 6px 10px; overflow-y: auto; }
.nav-item { display: flex; align-items: center; gap: 10px; padding: 9px 10px; border-radius: var(--radius); cursor: pointer; color: rgba(255,255,255,.6); font-size: 14px; font-weight: 400; border: none; background: none; width: 100%; text-align: left; transition: all .15s; }
.nav-item:hover { background: rgba(255,255,255,.16); color: #fff; }
.nav-item.active { background: rgba(255,255,255,.18); color: #fff; font-weight: 600; }
.nav-item .nav-icon { width: 16px; height: 16px; flex-shrink: 0; opacity: .75; }
.nav-item.active .nav-icon { opacity: 1; }
.nav-bottom { padding: 6px 10px 10px; border-top: 1px solid rgba(255,255,255,.08); font-size: 14px; }
.sidebar-footer { padding: 14px 18px; border-top: 1px solid rgba(255,255,255,.08); }
.sidebar-footer .version { font-size: 10px; color: rgba(255,255,255,.3); font-family: ui-monospace, 'SF Mono', SFMono-Regular, Menlo, Consolas, 'Courier New', monospace; }

/* Pages */
.page { display: none; animation: fadeIn .2s ease; }
.page.active { display: block; }
@keyframes fadeIn { from {opacity:0;transform:translateY(4px)} to {opacity:1;transform:translateY(0)} }
.page-header { margin-bottom: 24px; position:sticky; top:0; z-index:8; background:var(--bg); padding-bottom:8px; box-shadow:0 2px 8px rgba(0,0,0,.06); }
.page-title { font-size: 22px; font-weight: 600; letter-spacing: -.4px; }
.page-title span { color: var(--spd-red); }
.page-sub { font-size: 13px; color: var(--text2); margin-top: 3px; }

/* Cards */
.card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 20px; box-shadow: var(--shadow); }
.card-title { font-size: 11px; font-weight: 500; color: var(--text3); margin-bottom: 14px; text-transform: uppercase; letter-spacing: .5px; }
.card.kal-fullscreen { position: fixed; inset: 0; z-index: 9000; border-radius: 0; overflow: auto; max-width: none; margin: 0; padding: 16px; }
.card.kal-fullscreen .kal-hide-in-fs { display: none !important; }
#kal-fs-exitbtn { display:none; position:fixed; top:10px; right:14px; z-index:9001; background:var(--surface); border:1px solid var(--border); border-radius:6px; padding:6px 16px; cursor:pointer; font-size:13px; font-weight:500; box-shadow:var(--shadow-md); }
/* Vollbild: ansichtsspezifische Layouts */
.card.kal-fullscreen #kal-wandkalender { min-height: calc(100vh - 80px); }
.card.kal-fullscreen .wkal-fs-year .wkal-day { min-height: 54px; }
.card.kal-fullscreen .wkal-fs-4m .wkal-day { min-height: 80px; }
.card.kal-fullscreen .wkal-fs-1m { height: calc(100vh - 85px); }
.card.kal-fullscreen .wkal-fs-1m .wkal-month { height: 100%; display: flex; flex-direction: column; }
.card.kal-fullscreen .wkal-fs-1m .wkal-day-grid { flex: 1; display: grid; grid-template-columns: repeat(7,1fr); align-content: stretch; }
.card.kal-fullscreen .wkal-fs-1m .wkal-day { min-height: unset; }

/* Metrics */
.metrics { display: grid; grid-template-columns: repeat(auto-fit, minmax(155px, 1fr)); gap: 12px; margin-bottom: 24px; align-items: stretch; }
.metric { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 16px 18px; min-height: 120px; display: flex; flex-direction: column; }
.metric-label { font-size: 11px; color: var(--text3); text-transform: uppercase; letter-spacing: .5px; margin-bottom: 6px; }
.metric-val { font-size: 22px; font-weight: 600; letter-spacing: -.5px; color: var(--text); font-family: ui-monospace, 'SF Mono', SFMono-Regular, Menlo, Consolas, 'Courier New', monospace; }
.metric-val.pos { color: var(--green); }
.metric-val.neg { color: var(--spd-red); }
.metric-sub { font-size: 11px; color: var(--text3); margin-top: 4px; }
/* Card-Flip für Detailansicht */
.metric-flip { padding: 0; cursor: pointer; perspective: 900px; }
.metric-flip-inner { position: relative; width: 100%; height: 100%; min-height: 120px; transform-style: preserve-3d; transition: transform .45s cubic-bezier(.4,0,.2,1); }
.metric-flip.is-flipped .metric-flip-inner { transform: rotateY(180deg); }
.metric-flip-front, .metric-flip-back { position: absolute; inset: 0; backface-visibility: hidden; -webkit-backface-visibility: hidden; padding: 16px 18px; display: flex; flex-direction: column; background: var(--surface); border-radius: var(--radius-lg); }
.metric-flip-back { transform: rotateY(180deg); font-size: 11px; color: var(--text3); line-height: 1.65; }
.metric-flip-back .flip-title { font-size: 12px; font-weight: 600; color: var(--text); margin-bottom: 6px; }
.metric-flip-hint { font-size: 9px; color: var(--text3); opacity: .6; margin-top: auto; padding-top: 4px; }

.grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 16px; }

/* Tables */
.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; font-size: 13px; }
th { text-align: left; padding: 8px 12px; font-size: 11px; font-weight: 500; color: var(--text3); text-transform: uppercase; letter-spacing: .4px; border-bottom: 1px solid var(--border); background: var(--surface2); white-space: nowrap; }
td { padding: 10px 12px; border-bottom: 1px solid var(--border); color: var(--text); vertical-align: middle; }
tr:last-child td { border-bottom: none; }
tr:hover td { background: #fff8f8; }
.mono { font-family: ui-monospace, 'SF Mono', SFMono-Regular, Menlo, Consolas, 'Courier New', monospace; font-size: 12px; }

/* Badges */
.badge { display: inline-flex; align-items: center; padding: 2px 8px; border-radius: 20px; font-size: 11px; font-weight: 500; white-space: nowrap; }
.badge-red { background: var(--spd-red-light); color: var(--spd-red-dark); }
.badge-green { background: var(--green-light); color: var(--green); }
.badge-err { background: var(--spd-red-light); color: var(--spd-red-dark); }
.badge-amber { background: var(--amber-light); color: var(--amber); }
.badge-gray { background: var(--surface2); color: var(--text2); }
.badge-blue { background: #e8f0fb; color: #1a4a8c; }
/* Vorgang-Status-Badges: neutral, unabhängig von Parteifarbe */
.badge-vs-draft     { background:#f1f5f9; color:#475569; }
.badge-vs-submitted { background:#dbeafe; color:#1e40af; }
.badge-vs-committee { background:#fef9c3; color:#713f12; }
.badge-vs-delayed   { background:#ffedd5; color:#c2410c; }
.badge-vs-referred  { background:#ede9fe; color:#5b21b6; }
.badge-vs-passed    { background:#d1fae5; color:#065f46; }
.badge-vs-inprog    { background:#cffafe; color:#155e75; }
.badge-vs-done      { background:#dcfce7; color:#166534; }
.badge-vs-rejected  { background:#fee2e2; color:#991b1b; }
.badge-vs-withdrawn { background:#f3f4f6; color:#6b7280; }
.badge-vs-sent      { background:#d1fae5; color:#065f46; }
.badge-vs-archived  { background:#f3f4f6; color:#374151; }
.badge-vs-review    { background:#fef3c7; color:#92400e; border:1px solid #fcd34d; }
.badge-vs-approved  { background:#d1fae5; color:#065f46; border:1px solid #6ee7b7; }

/* Buttons */
.btn { padding: 8px 14px; border-radius: var(--radius); border: 1px solid var(--border); background: var(--surface); color: var(--text); font-size: 13px; font-weight: 400; transition: all .15s; cursor: pointer; user-select: none; -webkit-user-select: none; }
.btn:hover { background: var(--surface2); border-color: var(--border2); }
.btn-primary { background: var(--spd-red); color: #fff; border-color: var(--spd-red); }
.btn-primary:hover { background: var(--spd-red-dark); border-color: var(--spd-red-dark); }
.btn-sm { padding: 5px 10px; font-size: 12px; }
.btn-danger { border-color: #f0a8a3; color: var(--spd-red-dark); }
.btn-danger:hover { background: var(--spd-red-light); }
.btn-success { background: #16a34a; border-color: #15803d; color: #fff; }
.btn-ki { background: #d4a800; color: #fff; border-color: #b8900a; font-weight: 600; display: inline-flex; align-items: center; gap: 6px; }
.btn-ki:hover { background: #b8900a; border-color: #7a5f00; color: #fff; }
.btn-ki .ki-badge { background: rgba(255,255,255,.92); color: #7a5500; font-size: 10px; font-weight: 800; padding: 1px 6px; border-radius: 3px; letter-spacing: .4px; flex-shrink: 0; animation: ki-badge-pulse 1.8s ease-in-out infinite; }
@keyframes ki-badge-pulse { 0%,100%{opacity:1} 50%{opacity:.5} }
@media(prefers-reduced-motion:reduce){.btn-ki .ki-badge{animation:none}}
/* KI-Label: goldener Badge für Titel, Überschriften und Dekorations-Icons (außerhalb von Buttons) */
.ki-label{display:inline-flex;align-items:center;background:#d4a800;color:#fff;font-size:10px;font-weight:800;padding:1px 6px;border-radius:3px;letter-spacing:.4px;vertical-align:middle;animation:ki-badge-pulse 1.8s ease-in-out infinite;}
.ki-label-lg{display:inline-flex;align-items:center;background:#d4a800;color:#fff;font-size:15px;font-weight:800;padding:5px 14px;border-radius:6px;letter-spacing:1px;animation:ki-badge-pulse 1.8s ease-in-out infinite;}
@media(prefers-reduced-motion:reduce){.ki-label,.ki-label-lg{animation:none}}
.btn-success:hover { background: #15803d; border-color: #166534; }

/* Form */
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.form-group { display: flex; flex-direction: column; gap: 5px; }
.form-group label { font-size: 11px; color: var(--text2); font-weight: 500; text-transform: uppercase; letter-spacing: .4px; }
.form-control { padding: 8px 10px; border: 1px solid var(--border); border-radius: var(--radius); font-size: 13px; background: var(--surface); color: var(--text); transition: border-color .15s; }
.form-control:focus { outline: none; border-color: var(--spd-red); box-shadow: 0 0 0 3px rgba(var(--theme-rgb), .1); }
.form-control:hover:not(:focus) { border-color: var(--border2); }

/* Info boxes */
.info-box { background: #fff3e0; border: 1px solid #ffd08a; border-radius: var(--radius); padding: 10px 14px; font-size: 13px; color: #7a4a00; margin-bottom: 16px; }
.info-icon { display:inline-flex; align-items:center; justify-content:center; width:16px; height:16px; border-radius:50%; background:rgba(var(--theme-rgb),.85); color:#fff; font-size:9px; font-weight:700; margin-left:4px; vertical-align:middle; cursor:pointer; border:none; line-height:1; flex-shrink:0; transition:opacity .15s,transform .1s; text-decoration:none; }
.info-icon:hover { opacity:.75; transform:scale(1.15); }
.tut-link-btn { display:inline-flex; align-items:center; gap:3px; padding:2px 8px; border-radius:10px; background:rgba(var(--theme-rgb),.1); color:var(--spd-red); border:1px solid rgba(var(--theme-rgb),.25); font-size:11px; cursor:pointer; margin-left:8px; font-family:inherit; font-weight:500; vertical-align:middle; transition:background .15s; }
.tut-link-btn:hover { background:rgba(var(--theme-rgb),.2); }
th[title] { cursor: default; }
.warn-box { background: var(--amber-light); border: 1px solid #e8c97a; border-radius: var(--radius); padding: 10px 14px; font-size: 13px; color: var(--amber); margin-bottom: 16px; }
.success-box { background: var(--green-light); border: 1px solid #8ecfa8; border-radius: var(--radius); padding: 10px 14px; font-size: 13px; color: var(--green); margin-bottom: 16px; }
.danger-box { background: var(--spd-red-light); border: 1px solid var(--spd-red-mid); border-radius: var(--radius); padding: 10px 14px; font-size: 13px; color: var(--spd-red-dark); margin-bottom: 16px; }

/* Progress */
.progress-bar { height: 5px; background: var(--surface2); border-radius: 3px; overflow: hidden; margin-top: 6px; }
.progress-fill { height: 100%; border-radius: 3px; transition: width .4s; background: var(--spd-red); }

/* Upload / Drag-and-Drop */
.upload-zone { border: 2px dashed var(--border); border-radius: var(--radius-lg); padding: 32px; text-align: center; cursor: pointer; transition: all .2s; background: var(--bg); user-select: none; }
.drop-zone { border: 2px dashed var(--border2); border-radius: var(--radius-lg); padding: 28px 20px; text-align: center; cursor: pointer; transition: border-color .15s, background .15s; background: var(--surface2); user-select: none; }
.drop-zone:hover, .drop-zone.active { border-color: var(--spd-red); background: var(--spd-red-light); }
.drop-zone-icon { font-size: 32px; margin-bottom: 10px; }
.drop-zone-text { font-size: 14px; font-weight: 500; margin-bottom: 4px; color: var(--text); }
.drop-zone-sub { font-size: 12px; color: var(--text3); }
.upload-zone:hover, .upload-zone.drag-over { border-color: var(--spd-red); background: var(--spd-red-light); }
.upload-zone.drag-over { border-style: solid; }
.upload-zone input { display: none; }
.upload-icon { font-size: 28px; margin-bottom: 8px; }
.upload-title { font-weight: 500; font-size: 14px; margin-bottom: 4px; }
.upload-sub { font-size: 12px; color: var(--text3); }

/* Chart */
.chart-wrap { position: relative; height: 220px; width: 100%; }
.chart-legend { display: flex; gap: 16px; flex-wrap: wrap; margin-top: 10px; }
.legend-item { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--text2); }
.legend-dot { width: 10px; height: 10px; border-radius: 2px; flex-shrink: 0; }

/* Modal */
.modal-overlay { display: none; position: fixed; inset: 0; background: rgba(0,0,0,.35); z-index: 200; align-items: center; justify-content: center; backdrop-filter: blur(2px); }
#sigModal { z-index: 300; } /* Unterschrift-Modal über awModal (beide können gleichzeitig offen sein) */
.modal-overlay.open { display: flex; }
.modal { background: var(--surface); border-radius: var(--radius-lg); padding: 24px; width: min(520px, 92vw); box-shadow: var(--shadow-md); border: 1px solid var(--border); max-height: 90vh; overflow-y: auto; }
.modal-title { font-size: 16px; font-weight: 600; margin-bottom: 16px; user-select: none; -webkit-user-select: none; }
.modal-footer { display: flex; gap: 8px; justify-content: flex-end; margin-top: 20px; }

/* Heat table */
.heat-table th, .heat-table td { padding: 7px 8px; font-size: 12px; }
.heat-cell { min-width: 52px; text-align: right; border-radius: 4px; font-family: ui-monospace, 'SF Mono', SFMono-Regular, Menlo, Consolas, 'Courier New', monospace; font-size: 11px; }

/* Goal editor */
.goal-row { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.goal-year { font-size: 13px; font-weight: 500; min-width: 45px; }
.goal-input { width: 140px; }

.divider { height: 1px; background: var(--border); margin: 20px 0; }
.flex-between { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }

/* Toast */
.toast-container { position: fixed; bottom: 24px; right: 24px; z-index: 500; display: flex; flex-direction: column; gap: 8px; pointer-events: none; }
.toast { background: var(--text); color: #fff; padding: 10px 16px; border-radius: var(--radius); font-size: 13px; box-shadow: var(--shadow-md); animation: toastIn .25s ease; pointer-events: auto; max-width: 300px; }
.toast.success { background: var(--green); }
.toast.error { background: var(--spd-red-dark); }
@keyframes toastIn { from { transform: translateY(10px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
@keyframes spin { to { transform: rotate(360deg); } }

/* Accentuate active year in sidebar */
.year-badge { display: inline-block; background: var(--spd-red); color: #fff; font-size: 10px; font-family: ui-monospace, 'SF Mono', SFMono-Regular, Menlo, Consolas, 'Courier New', monospace; padding: 1px 6px; border-radius: 4px; margin-left: auto; }

/* Nav-Gruppen und Sub-Items */
.nav-group-btn { display: flex; align-items: center; gap: 10px; padding: 9px 10px; border-radius: var(--radius); cursor: pointer; color: rgba(255,255,255,.7); font-size: 13px; font-weight: 500; border: none; background: none; width: 100%; text-align: left; transition: all .15s; margin-top: 4px; }
.nav-group-btn:hover { background: rgba(255,255,255,.16); color: #fff; }
.nav-group-btn.open { color: #fff; }
.nav-group-btn .nav-icon { width: 16px; height: 16px; flex-shrink: 0; opacity: .75; }
.nav-group-btn .nav-chevron { margin-left: auto; font-size: 11px; transition: transform .2s ease; display: inline-block; opacity: .6; }
.nav-group-btn.open .nav-chevron { transform: rotate(90deg); opacity: 1; }
.nav-submenu { overflow: hidden; max-height: 0; transition: max-height .22s ease; }
.nav-submenu.open { max-height: 600px; }
/* [I-20] Nav-Badges */
.nav-badge { display: inline-flex; align-items: center; justify-content: center; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; font-size: 10px; font-weight: 700; line-height: 1; margin-left: auto; background: var(--spd-red); color: #fff; flex-shrink: 0; }
.nav-badge.warn { background: #e65100; }
.nav-badge.hidden { display: none; }
.nav-item.active .nav-badge { background: rgba(255,255,255,.3); }
.nav-item.nav-sub { padding-left: 26px; font-size: 12px; color: rgba(255,255,255,.5); }
.nav-item.nav-sub .nav-icon { width: 13px; height: 13px; opacity: .6; }
.nav-item.nav-sub:hover { background: rgba(255,255,255,.10); color: rgba(255,255,255,.9); }
/* [C7] Passwort-Stärke-Anzeige */
.pw-strength-wrap { margin-top:4px; margin-bottom:10px; }
.pw-strength-bar { display:flex; gap:3px; height:4px; margin-bottom:5px; }
.pw-strength-bar span { flex:1; border-radius:2px; background:rgba(0,0,0,.12); transition:background .25s; }
.pw-strength-label { font-size:11px; font-weight:600; }
.pw-strength-hint { font-size:11px; color:#888; margin-top:2px; line-height:1.4; }
.pw-req-note { font-size:11.5px; color:#92400e; line-height:1.5; margin-top:4px; margin-bottom:8px; padding:7px 9px; background:#fffbeb; border:1px solid #f59e0b; border-radius:5px; }
.pw-req-note--modal { color:#555; background:rgba(0,0,0,.04); border:1px solid var(--border,#ddd); border-radius:5px; padding:7px 9px; font-size:11.5px; line-height:1.5; margin-bottom:10px; }
/* [C7] Skip-to-content Link */
.skip-link { position:absolute; top:-60px; left:8px; background:#E3000F; color:#fff; padding:6px 14px; border-radius:4px; font-size:13px; font-weight:600; text-decoration:none; z-index:99999; transition:top .15s; }
.skip-link:focus { top:8px; }
/* [I-19] Globale Suche */
.gs-search-btn { display:flex; align-items:center; gap:8px; width:calc(100% - 20px); margin:8px 10px 4px; padding:7px 10px; background:rgba(0,0,0,.25); border:1px solid rgba(255,255,255,.12); border-radius:var(--radius); color:rgba(255,255,255,.65); font-size:12px; cursor:pointer; transition:background .15s,border-color .15s; }
.gs-search-btn:hover { background:rgba(0,0,0,.38); border-color:rgba(255,255,255,.22); color:rgba(255,255,255,.9); }
.gs-search-btn svg { flex-shrink:0; opacity:.7; }
.gs-search-btn .gs-hint { margin-left:auto; font-size:10px; opacity:.45; background:rgba(255,255,255,.1); border-radius:3px; padding:1px 5px; font-family:monospace; }
#global-search-overlay { display:none; position:fixed; inset:0; background:rgba(0,0,0,.5); z-index:9992; align-items:flex-start; justify-content:center; padding-top:72px; backdrop-filter:blur(3px); }
#global-search-overlay.gs-open { display:flex; }
.gs-modal { background:var(--surface); border-radius:var(--radius-lg); width:min(640px,94vw); max-height:72vh; display:flex; flex-direction:column; box-shadow:0 8px 50px rgba(0,0,0,.35); border:1px solid var(--border); overflow:hidden; }
.gs-bar { display:flex; align-items:center; gap:10px; padding:13px 16px; border-bottom:1px solid var(--border); flex-shrink:0; }
.gs-bar input { flex:1; border:none; background:transparent; font-size:15px; color:var(--text); outline:none; }
.gs-bar input::placeholder { color:var(--text3); }
.gs-esc { font-size:10px; color:var(--text3); background:var(--bg); border:1px solid var(--border); border-radius:4px; padding:2px 6px; cursor:pointer; white-space:nowrap; flex-shrink:0; }
#gs-results { overflow-y:auto; flex:1; padding:6px 0 8px; }
.gs-section-hdr { padding:8px 16px 3px; font-size:10.5px; font-weight:700; color:var(--text3); text-transform:uppercase; letter-spacing:.07em; }
.gs-item { display:flex; align-items:center; gap:10px; padding:8px 16px; cursor:pointer; transition:background .1s; }
.gs-item:hover, .gs-item.gs-focused { background:var(--hover); }
.gs-item-icon { font-size:15px; flex-shrink:0; width:20px; text-align:center; }
.gs-item-label { font-size:13px; font-weight:500; color:var(--text); flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.gs-item-label mark { background:transparent; color:var(--spd-red); font-weight:700; font-style:normal; }
.gs-item-sub { font-size:11px; color:var(--text3); flex-shrink:0; max-width:200px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.gs-empty { padding:32px 16px; text-align:center; color:var(--text3); font-size:13px; }
.gs-noresult { padding:24px 16px; text-align:center; color:var(--text3); font-size:13px; }
.gs-more { padding:1px 16px 8px; font-size:11px; color:var(--text3); }
.nav-section-group { display: flex; align-items: center; font-size: 11px; font-weight: 600; letter-spacing: .9px; text-transform: uppercase; color: rgba(var(--theme-rgb),.85); padding: 14px 10px 5px; background: none; border: none; width: 100%; text-align: left; cursor: pointer; user-select: none; transition: color .15s; }
.nav-section-group:hover { color: rgba(var(--theme-rgb),1); }
.nav-section-group .nav-chevron { margin-left: auto; font-size: 9px; transition: transform .2s ease; opacity: .75; display: inline-block; }
.nav-section-group.open .nav-chevron { transform: rotate(90deg); opacity: 1; }
/* Day-popup for Wandkalender */
.kal-day-popup { position: fixed; background: #fff; border: 1px solid var(--border); border-radius: 8px; box-shadow: 0 4px 20px rgba(0,0,0,.18); padding: 10px 12px; min-width: 220px; max-width: 320px; z-index: 9999; font-size: 13px; }
.kal-popup-head { display: flex; align-items: center; font-weight: 600; font-size: 12px; color: var(--text2); margin-bottom: 8px; border-bottom: 1px solid var(--border); padding-bottom: 6px; gap: 8px; }
.kal-popup-item { display: flex; align-items: center; gap: 7px; padding: 4px 0; cursor: pointer; border-radius: 4px; }
.kal-popup-item:hover { background: var(--surface2); padding-left: 4px; }
.kal-popup-badge { font-size: 10px; font-weight: 700; padding: 1px 6px; border-radius: 3px; flex-shrink: 0; }
/* Kürzel badges in Wandkalender cells */
.wkal-kuerzel-list { display: flex; flex-direction: column; gap: 1px; margin-top: 2px; overflow: hidden; }
.wkal-kuerzel-badge { font-size: 8px; font-weight: 700; padding: 0 3px; border-radius: 2px; line-height: 1.5; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; display: block; }
/* Ausschüsse cards page */
.ausschuesse-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 16px; padding: 4px 0; }
.ausschuss-card { background: var(--surface1); border: 1px solid var(--border); border-radius: 10px; overflow: hidden; cursor: pointer; transition: transform .15s, box-shadow .15s; user-select: none; }
.ausschuss-card:hover { transform: translateY(-2px); box-shadow: 0 6px 24px rgba(0,0,0,.12); }
.ausschuss-card-header { padding: 16px; display: flex; align-items: center; justify-content: center; min-height: 56px; }
.ausschuss-card-kuerzel { font-size: 24px; font-weight: 800; color: #fff; letter-spacing: .5px; text-shadow: 0 1px 3px rgba(0,0,0,.3); }
.ausschuss-card-body { padding: 12px 16px 8px; }
.ausschuss-card-name { font-weight: 600; font-size: 13px; color: var(--text1); line-height: 1.35; margin-bottom: 8px; }
.ausschuss-card-meta { font-size: 11px; color: var(--text3); display: flex; flex-direction: column; gap: 4px; }
.ausschuss-card-actions { padding: 8px 12px; border-top: 1px solid var(--border); display: flex; gap: 6px; justify-content: flex-end; background: var(--surface2); }
/* Sidebar collapse (desktop) */
.sidebar { transition: transform .3s ease; }
.main { transition: margin-left .3s ease; }
body.sidebar-collapsed .sidebar { transform: translateX(-228px); }
body.sidebar-collapsed .main { margin-left: 0; }
body.sidebar-collapsed .vt-wizard-nav-bar { left: 0; }
.nav-item.nav-sub.active { background: rgba(255,255,255,.18); color: #fff; font-weight: 600; }
.nav-item.nav-placeholder { opacity: .6; cursor: pointer; }
.nav-item.nav-placeholder:hover { background: rgba(255,255,255,.16); color: #fff; opacity: .85; }

/* Copyright-Footer (immer sichtbar unter jeder Seite) */
.main { padding-bottom: 72px; }
.copyright-footer {
  position: fixed;
  left: 228px;
  right: 0;
  bottom: 0;
  background: linear-gradient(180deg, rgba(247,246,244,.0) 0%, var(--bg) 18%, var(--bg) 100%);
  padding: 12px 32px 14px;
  z-index: 30;
  border-top: 1px solid var(--border);
  backdrop-filter: blur(4px);
}
.copyright-footer .cr-line {
  max-width: 1320px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 8px;
  font-size: 11.5px;
  color: var(--text2);
  line-height: 1.45;
}
.copyright-footer .cr-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px; height: 18px;
  border-radius: 50%;
  background: var(--spd-red);
  color: #fff;
  font-size: 11px;
  font-weight: 600;
  flex-shrink: 0;
}
.copyright-footer .cr-sep { color: var(--text3); }
.copyright-footer .cr-more {
  margin-left: auto;
  background: none;
  border: 1px solid var(--border2);
  color: var(--text);
  font-size: 11px;
  padding: 3px 10px;
  border-radius: var(--radius);
  cursor: pointer;
  transition: all .15s;
}
.copyright-footer .cr-more:hover { background: var(--spd-red); border-color: var(--spd-red); color: #fff; }
/* Mobile-Header & Drawer (nur auf schmalen Bildschirmen sichtbar) */
.mobile-header { display: none; position: fixed; top: 0; left: 0; right: 0; height: 52px; background: var(--sidebar-bg); color: #fff; z-index: 60; align-items: center; padding: 0 14px; gap: 12px; border-bottom: 1px solid rgba(255,255,255,.1); }
.mobile-burger { background: none; border: none; color: #fff; padding: 8px; cursor: pointer; display: flex; align-items: center; justify-content: center; border-radius: 6px; }
.mobile-burger:hover, .mobile-burger:active { background: rgba(255,255,255,.12); }
.mobile-title { font-size: 15px; font-weight: 600; letter-spacing: -.2px; }
.mobile-title .mt-sub { font-size: 10px; color: rgba(255,255,255,.55); margin-left: 8px; font-family: ui-monospace, 'SF Mono', SFMono-Regular, Menlo, Consolas, 'Courier New', monospace; font-weight: 400; }
.mobile-backdrop { display: none; position: fixed; inset: 0; background: rgba(0,0,0,.55); z-index: 45; }
body.sidebar-open .mobile-backdrop { display: block; }

@media (max-width: 900px) {
  .mobile-header { display: flex; }
  .main { margin-left: 0; padding: 68px 14px 90px; max-width: 100%; }
  .sidebar { transform: translateX(-100%); transition: transform .22s ease; box-shadow: 0 0 30px rgba(0,0,0,.45); }
  body.sidebar-open .sidebar { transform: translateX(0); }
  .metrics { grid-template-columns: repeat(auto-fit, minmax(135px, 1fr)); gap: 8px; margin-bottom: 16px; }
  .metric { min-height: 100px; }
  .metric-flip-inner { min-height: 100px; }
  .grid2, .form-grid { grid-template-columns: 1fr; gap: 10px; }
  .card { padding: 14px; }
  .page-title { font-size: 19px; }
  .page-sub { font-size: 12px; }
  table { font-size: 12px; }
  table th, table td { padding: 6px 8px; }
  .chart-wrap { height: 260px !important; }
  .modal { width: min(96vw, 720px) !important; padding: 16px; max-height: 88vh; overflow-y: auto; }
  .flex-between { flex-wrap: wrap; gap: 8px; }
  .copyright-footer { left: 0; padding: 10px 14px; }
  .copyright-footer .cr-line { font-size: 10.5px; }
  .vt-wizard-nav-bar { left: 0; padding: 10px 14px 14px; }
  /* [C10] Chart-Grids auf Tablet kollabieren */
  .aus-grid, .aus-grid-3 { grid-template-columns: 1fr; }
  .chart-container { height: 200px; }
}
/* ── Admin-Modal (Entwickler-Konfiguration) ─────────────────────────────── */
.admin-overlay { display: none; position: fixed; inset: 0; background: rgba(10,10,10,.7); z-index: 1000; align-items: flex-start; justify-content: center; overflow-y: auto; padding: 24px 12px; backdrop-filter: blur(3px); }
.admin-overlay.open { display: flex; }
.admin-modal { background: var(--surface); border-radius: var(--radius-lg); width: min(680px, 100%); box-shadow: 0 8px 40px rgba(0,0,0,.3); border: 1px solid var(--border); overflow: hidden; }
.admin-head { background: linear-gradient(135deg, #2a2a2a, #1a1a1a); color: #fff; padding: 18px 22px; display: flex; align-items: center; gap: 12px; }
.admin-head .badge-dev { background: #fbbf24; color: #1a1a1a; padding: 2px 8px; border-radius: 4px; font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: .5px; }
.admin-head .title { font-size: 16px; font-weight: 600; flex: 1; }
.admin-head .close-x { background: none; border: 0; color: rgba(255,255,255,.7); font-size: 22px; cursor: pointer; line-height: 1; padding: 0 4px; }
.admin-head .close-x:hover { color: #fff; }
.admin-body { padding: 22px; }
.admin-section { margin-bottom: 22px; }
.admin-section-title { font-size: 11px; font-weight: 600; color: var(--text2); text-transform: uppercase; letter-spacing: .8px; margin-bottom: 10px; padding-bottom: 6px; border-bottom: 1px solid var(--border); }
.admin-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.admin-grid-1 { display: grid; grid-template-columns: 1fr; gap: 12px; }
.admin-foot { padding: 14px 22px; background: var(--surface2); border-top: 1px solid var(--border); display: flex; gap: 10px; justify-content: flex-end; flex-wrap: wrap; }
.admin-foot .left { margin-right: auto; font-size: 11px; color: var(--text3); align-self: center; }
.hash-display { background: #fff8e1; border: 1px solid #fbbf24; border-radius: var(--radius); padding: 12px; margin-top: 10px; }
.hash-display code { display: block; word-break: break-all; font-size: 11px; padding: 6px; background: #fff; border-radius: 4px; margin: 6px 0; user-select: all; }
.hash-display .copy-btn { font-size: 11px; }
.logo-preview { width: 56px; height: 56px; border-radius: 6px; object-fit: contain; background: #f4f4f4; border: 1px solid var(--border); margin-right: 10px; }
.logo-row { display: flex; align-items: flex-start; gap: 4px; }
.theme-swatch { display: inline-block; width: 12px; height: 12px; border-radius: 2px; margin-right: 6px; vertical-align: middle; border: 1px solid rgba(0,0,0,.1); }
@media (max-width: 600px) { .admin-grid { grid-template-columns: 1fr; } }

@media (max-width: 480px) {
  .main { padding: 62px 10px 90px; }
  .metrics { grid-template-columns: 1fr 1fr; gap: 6px; }
  .card { padding: 12px; }
  .page-title { font-size: 17px; }
  table th, table td { padding: 5px 6px; font-size: 11px; }
  .btn { padding: 7px 10px; font-size: 12px; }
  .btn-sm { padding: 5px 8px; font-size: 11px; }
  .chart-wrap { height: 220px !important; }
  /* [C10] Weitere Anpassungen für sehr kleine Screens */
  .aus-grid, .aus-grid-3 { grid-template-columns: 1fr; }
  .chart-container { height: 180px; }
  .committee-row { grid-template-columns: 1fr 1fr; gap: 6px; }
  .role-row { grid-template-columns: 1fr 1fr; gap: 6px; }
  .modal-footer { flex-wrap: wrap; gap: 6px; }
  .modal-footer .btn { flex: 1 1 auto; min-width: 120px; }
  .page-header .flex-between { flex-direction: column; align-items: flex-start; }
}

/* ── Onboarding-Wizard ───────────────────────────────────────────────────── */
.wizard-step { display: none; }
.wizard-step.active { display: block; animation: fadeIn .25s ease; }
.wizard-progress { display: flex; gap: 0; margin-bottom: 28px; align-items: center; }
.wizard-dot { width: 32px; height: 32px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 600; flex-shrink: 0; border: 2px solid var(--border); color: var(--text3); background: var(--surface2); transition: all .25s; }
.wizard-dot.done { background: var(--green); border-color: var(--green); color: #fff; }
.wizard-dot.active { background: var(--spd-red); border-color: var(--spd-red); color: #fff; box-shadow: 0 0 0 4px rgba(var(--theme-rgb),.15); }
.wizard-line { height: 3px; flex: 1; background: var(--border); border-radius: 2px; margin: 0 6px; transition: background .3s; }
.wizard-line.done { background: var(--green); }
.wizard-label { font-size: 10px; color: var(--text3); text-align: center; margin-top: 4px; }
.wizard-step-title { font-size: 18px; font-weight: 600; letter-spacing: -.3px; margin-bottom: 6px; }
.wizard-step-sub { font-size: 13px; color: var(--text2); margin-bottom: 20px; line-height: 1.6; }
.wizard-footer { display: flex; gap: 8px; justify-content: flex-end; margin-top: 24px; padding-top: 16px; border-top: 1px solid var(--border); }

/* ── Dashboard Empty State / Returning-User-Banner ───────────────────────── */
.dash-banner { border-radius: var(--radius-lg); padding: 20px 24px; margin-bottom: 20px; display: flex; align-items: flex-start; gap: 16px; }
.dash-banner-icon { font-size: 30px; flex-shrink: 0; line-height: 1; }
.dash-banner-title { font-size: 15px; font-weight: 600; margin-bottom: 4px; }
.dash-banner-sub { font-size: 13px; line-height: 1.55; }
.dash-banner-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; }
.dash-banner.welcome { background: linear-gradient(135deg, var(--spd-red-light), #fff); border: 1px solid var(--spd-red-mid); }
.dash-banner.returning { background: var(--amber-light); border: 1px solid #e8c97a; }
.dash-banner.birthday { background: linear-gradient(135deg,#fff8e1,#fff); border: 1px solid #f9c642; }

/* Geburtstags-Widget */
.bday-list { display: flex; flex-direction: column; gap: 8px; }
.bday-item { display: flex; align-items: center; gap: 12px; padding: 10px 14px; background: var(--surface2); border-radius: var(--radius); font-size: 13px; }
@media(min-width:700px){.bday-list{flex-direction:row;flex-wrap:wrap;}.bday-item{flex:1 1 260px;min-width:220px;}}
.bday-avatar { width: 34px; height: 34px; border-radius: 50%; background: linear-gradient(135deg,rgba(var(--theme-rgb),.18),rgba(var(--theme-rgb),.08)); display: flex; align-items: center; justify-content: center; font-size: 16px; flex-shrink: 0; }
.bday-info { flex: 1; min-width: 0; }
.bday-name { font-weight: 600; color: var(--text); }
.bday-date { font-size: 11px; color: var(--text2); margin-top: 1px; }
.bday-actions { display: flex; gap: 5px; flex-shrink: 0; }
.bday-today { border: 2px solid #f9c642; background: #fffbea; }

/* Ausschuss-Rows im Mitglieder-Modal */
.committee-row { display: grid; grid-template-columns: 2fr 1fr 1fr auto; gap: 8px; margin-bottom: 8px; align-items: end; }
.committee-badge { display: inline-flex; align-items: center; padding: 2px 7px; border-radius: 12px; font-size: 10px; font-weight: 500; background: rgba(var(--theme-rgb),.1); color: var(--spd-red); border: 1px solid rgba(var(--theme-rgb),.2); margin: 2px 2px 2px 0; white-space: nowrap; }
.committees-cell { display: flex; flex-wrap: wrap; gap: 2px; max-width: 260px; }
.laufzettel-item { display: flex; align-items: flex-start; gap: 10px; padding: 5px 8px; border-radius: 5px; cursor: pointer; transition: background .1s; }
.laufzettel-item:hover { background: rgba(0,0,0,.04); }
.laufzettel-item input[type=checkbox] { margin-top: 2px; flex-shrink: 0; width: 15px; height: 15px; cursor: pointer; }
.empty-chart { display: flex; align-items: center; justify-content: center; height: 220px; color: var(--text3); font-size: 13px; flex-direction: column; gap: 8px; }
.empty-chart-icon { font-size: 28px; opacity: .4; }

/* ── Lösch-Bestätigungs-Modal ────────────────────────────────────────────── */
.delete-confirm-icon { font-size: 40px; text-align: center; margin-bottom: 4px; }
.delete-confirm-title { font-size: 16px; font-weight: 600; text-align: center; margin-bottom: 6px; }
.delete-confirm-msg { font-size: 13px; color: var(--text2); text-align: center; line-height: 1.6; margin-bottom: 20px; }

/* ── API-Key Hilfe-Box ───────────────────────────────────────────────────── */
.api-steps { display: flex; flex-direction: column; gap: 6px; margin: 10px 0 0; }
.api-step { display: flex; align-items: flex-start; gap: 8px; font-size: 12px; }
.api-step-num { width: 20px; height: 20px; border-radius: 50%; background: var(--spd-red); color: #fff; font-size: 10px; font-weight: 700; display: flex; align-items: center; justify-content: center; flex-shrink: 0; margin-top: 1px; }

/* ── Vorgangsverwaltung ──────────────────────────────────────────────────── */
.vtag-pill { display:inline-flex;align-items:center;padding:2px 8px;border-radius:12px;font-size:10px;font-weight:500;background:rgba(var(--theme-rgb),.1);color:var(--spd-red);border:1px solid rgba(var(--theme-rgb),.2);white-space:nowrap; }
.v-filter-bar { display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:16px;padding:12px 14px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg); }
.v-filter-bar select,.v-filter-bar input { font-size:12px;padding:5px 8px;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);color:var(--text);cursor:pointer; }
.v-filter-bar select:focus,.v-filter-bar input:focus { outline:none;border-color:var(--spd-red); }
.v-filter-bar input[type=search] { min-width:160px; }
.v-filter-bar .v-filter-sep { width:1px;height:24px;background:var(--border);flex-shrink:0; }
.vtable tr:hover td { background:#fff8f8; }
.vtable td { vertical-align:top;padding:10px 12px; }
/* I-61 Sticky Table Headers: .table-wrap:has(.sticky-thead) als Scroll-Container mit max-height */
/* Fix v5.6.10b: overflow-x:auto auf .table-wrap erzeugt implizit overflow-y:auto → kein Sticky im Viewport-Kontext möglich.
   Lösung: table-wrap mit sticky-thead bekommt max-height + overflow-y:auto → th klebt am top des table-wrap-Containers. */
.sticky-thead th { position:sticky;top:0;z-index:2; }
.table-wrap:has(.sticky-thead) { max-height:calc(100vh - 200px);overflow-y:auto; }
@media(max-width:900px){.table-wrap:has(.sticky-thead){max-height:calc(100vh - 280px);}}
/* Monats-Trennzeile in der konsolidierten Anwesenheits-Tabelle [I-61 Anwesenheit] */
.aw-month-sep td { font-size:11px;font-weight:700;color:var(--text3);text-transform:uppercase;letter-spacing:.6px;padding:10px 8px 4px;background:var(--surface2);border-bottom:2px solid var(--border);pointer-events:none; }
.vresub-overdue { background:var(--spd-red-light)!important; }
.v-timeline-dot { width:8px;height:8px;border-radius:50%;background:var(--spd-red);flex-shrink:0;margin-top:4px; }
.modal-lg { width:min(680px,95vw); }

/* ── Tablet-Unterschriften ───────────────────────────────────────────────── */
/* [SIG-6] Stift verlässt sigModal → kein Element im Dokument darf selektiert werden */
body.sig-active, body.sig-active *{user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
#sig-canvas{border:2px solid var(--border);border-radius:var(--radius);width:100%;height:180px;
  touch-action:none;cursor:crosshair;background:#fff;display:block}
#sig-canvas.active{border-color:var(--spd-red)}
.sig-image{max-width:180px;max-height:50px;border:1px solid var(--border);border-radius:3px;
  background:#fff;vertical-align:middle}
.sig-placeholder{font-size:11px;color:var(--text3);font-style:italic}
.dok-card{border:1px solid var(--border);border-radius:var(--radius);padding:12px;
  cursor:pointer;transition:border-color .15s,background .15s}
.dok-card:hover{border-color:var(--border2);background:var(--surface2)}
.dok-card.selected{border-color:var(--spd-red);background:var(--spd-red-light)}
.dok-card input[type=radio]{accent-color:var(--spd-red)}

/* ── Sitzungsdetail-Vollbild [Phase 7a] ──────────────────────────────────── */
.sd-page{position:fixed;inset:0;z-index:100;background:var(--bg);display:flex;flex-direction:column;overflow:hidden}
.sd-page.hidden{display:none}
.sd-header{display:flex;align-items:center;gap:12px;padding:10px 20px;background:var(--bg);border-bottom:2px solid var(--border);flex-shrink:0;flex-wrap:wrap}
.sd-back-btn{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--spd-red);background:none;border:none;cursor:pointer;padding:4px 8px;border-radius:5px}
.sd-back-btn:hover{background:rgba(192,57,43,.08)}
.sd-title-block{flex:1;min-width:0}
.sd-title{font-size:15px;font-weight:700;color:var(--text1);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sd-meta{font-size:12px;color:var(--text3);margin-top:1px}
.sd-body{flex:1;overflow:auto;padding:16px 20px}
.sd-split{display:flex;gap:16px;height:100%;min-height:0}
.sd-panel{flex:1;min-width:0;display:flex;flex-direction:column;gap:12px;overflow:auto}
.sd-panel-right{flex:1;min-width:0;display:flex;flex-direction:column;overflow:hidden}
.sd-panel-pdf{background:var(--surface2);border-radius:8px;border:2px dashed var(--border);display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:300px;flex:1;gap:8px;color:var(--text3)}
.sd-section-title{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--text3);margin-bottom:6px;padding-bottom:4px;border-bottom:1px solid var(--border)}
.sd-card{background:var(--surface);border-radius:8px;border:1px solid var(--border);padding:12px 14px}
/* Anwesenheits-Box */
.aw-box{background:var(--surface);border-radius:8px;border:1px solid var(--border);padding:12px 14px}
.aw-box-status{display:flex;align-items:center;gap:10px;margin-bottom:10px;flex-wrap:wrap}
.aw-box-btns{display:flex;gap:8px;flex-wrap:wrap}
/* Dok-Indikatoren in der Liste */
.sd-doc-badge{display:inline-block;padding:1px 7px;border-radius:4px;font-size:10px;font-weight:600;white-space:nowrap;border:1px solid}
.sd-doc-badge.has{background:#e8f5e9;color:#2e7d32;border-color:#a5d6a7;cursor:pointer}
.sd-doc-badge.missing{background:#f5f5f5;color:#bdbdbd;border-color:#e0e0e0;cursor:default}
/* Abstimmungs-Buttons */
.sd-votum-btn{padding:3px 10px;border-radius:4px;border:1px solid;font-size:11px;font-weight:600;cursor:pointer;transition:opacity .15s}
.sd-votum-btn:not(.active){opacity:.35}
.sd-votum-btn.ja{background:#e8f5e9;color:#1b5e20;border-color:#81c784}
.sd-votum-btn.nein{background:#ffebee;color:#b71c1c;border-color:#ef9a9a}
.sd-votum-btn.enthalten{background:#fff8e1;color:#e65100;border-color:#ffe082}
.sd-votum-btn.verschieben{background:#e3f2fd;color:#0d47a1;border-color:#90caf9}
.sd-votum-btn.sonstiges{background:#f3e5f5;color:#4a148c;border-color:#ce93d8}
.sd-votum-btn.kenntnisnahme{background:#eceff1;color:#37474f;border-color:#90a4ae}
/* ── Anwesenheits-Modul ──────────────────────────────────────────────────── */
.aw-status-badge{display:inline-flex;align-items:center;padding:2px 8px;border-radius:12px;font-size:10px;font-weight:600;white-space:nowrap}
.aw-offen{background:#f3f4f6;color:#6b7280}
.aw-erfasst{background:#fef3c7;color:#92600a}
.aw-eingereicht{background:#d1fae5;color:#065f46}
.aw-abgesagt{background:#fee2e2;color:#991b1b}
.aw-member-row{display:flex;align-items:center;gap:10px;padding:8px 12px;border-bottom:1px solid var(--border);transition:background .1s}
.aw-member-row:hover{background:var(--surface2)}
.aw-member-row:focus{outline:2px solid var(--spd-red);outline-offset:-2px;background:rgba(var(--theme-rgb),.09)}
.aw-member-row:last-child{border-bottom:none}
.aw-cb{width:20px;height:20px;accent-color:var(--spd-red);cursor:pointer;flex-shrink:0}
.aw-money{font-family:ui-monospace,'SF Mono',SFMono-Regular,Menlo,Consolas,'Courier New',monospace;font-size:12px;color:var(--green);margin-left:auto;white-space:nowrap;display:none}
.aw-money.absent{color:var(--spd-red);text-decoration:line-through;opacity:.6}
.aw-btn-row{padding:12px;border-top:1px solid var(--border);display:flex;gap:8px;justify-content:space-between;align-items:center;flex-wrap:wrap}
@media print{
  body *{visibility:hidden}
  #aw-print-area,#aw-print-area *{visibility:visible}
  #aw-print-area{position:fixed;top:0;left:0;width:100%;padding:20px}
  /* CI-Vorlagen-Print */
  #vorlagen-print-wrapper,#vorlagen-print-wrapper *{visibility:visible}
  #vorlagen-print-wrapper{position:fixed;top:0;left:0;width:210mm;padding:0;margin:0}
  .vorlagen-no-print{display:none!important}
  .no-print{display:none!important}
}

/* ── CI-Vorlagen-Generator ───────────────────────────────────────────────── */
.vorlagen-type-card{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:32px 24px;border-radius:var(--radius-lg);border:2px solid var(--border);cursor:pointer;transition:border-color .18s,background .18s,box-shadow .18s;background:var(--surface);text-align:center}
.vorlagen-type-card:hover{border-color:var(--spd-red);background:var(--spd-red-light);box-shadow:var(--shadow-md)}
.vorlagen-type-card .vc-icon{font-size:36px}
.vorlagen-type-card .vc-title{font-size:15px;font-weight:600;color:var(--text)}
.vorlagen-type-card .vc-sub{font-size:12px;color:var(--text2)}
/* DIN A4 Preview */
#vorlagen-preview{background:#fff;width:210mm;min-height:297mm;padding:15mm 20mm 20mm 20mm;box-shadow:0 4px 24px rgba(0,0,0,.15);border-radius:4px;font-family:'Times New Roman',serif;font-size:11pt;color:#000;box-sizing:border-box;overflow:hidden}
.vp-header{display:grid;grid-template-columns:1fr auto 1fr;align-items:start;margin-bottom:4mm;padding-bottom:3mm;border-bottom:2px solid #E3000F}
.vp-header-left{display:flex;flex-direction:column;gap:3px}
.vp-header-left .vp-org{font-size:9pt;color:#E3000F;font-weight:700;line-height:1.3}
.vp-header-center{display:flex;justify-content:center;align-items:flex-start;padding:0 8mm}
.vp-header-right{text-align:right;font-size:7.5pt;color:#333;line-height:1.5}
.vp-spd-logo-wrap{display:flex;flex-direction:column;align-items:center;gap:2px}
.vp-spd-city{font-size:10pt;font-weight:800;color:#E3000F;letter-spacing:2px;font-family:Arial,sans-serif}
.vp-pm-title{font-size:16pt;font-weight:700;color:#000;margin:5mm 0 2mm 0;font-family:Arial,sans-serif}
.vp-pm-date{font-size:9pt;color:#555;margin-bottom:4mm}
.vp-pm-lead{font-size:10.5pt;font-weight:600;color:#111;margin-bottom:3mm;line-height:1.5}
.vp-pm-body{font-size:10pt;line-height:1.6;margin-bottom:3mm;white-space:pre-wrap}
.vp-pm-footer{margin-top:6mm;padding-top:3mm;border-top:1px solid #ccc;font-size:8.5pt;color:#555}
.vp-antrag-receiver{border:1px solid #888;padding:4mm 5mm;margin-bottom:5mm;font-size:10pt;line-height:1.6;max-width:80mm;font-family:Arial,sans-serif}
.vp-antrag-type{font-size:14pt;font-weight:700;text-decoration:underline;margin-bottom:3mm;font-family:Arial,sans-serif}
.vp-antrag-betreff{font-size:11pt;margin-bottom:4mm;font-family:Arial,sans-serif}
.vp-antrag-body{font-size:10pt;line-height:1.6;margin-bottom:3mm;white-space:pre-wrap}
.vp-antrag-section{font-size:10pt;font-weight:700;margin:4mm 0 1mm 0;font-family:Arial,sans-serif}
.vp-sign{margin-top:12mm;font-size:10pt}
.vp-sign-grid{display:flex;gap:8mm;align-items:flex-end}
.vp-sign-col{flex:1;min-width:0}
.vp-sign-line{border-top:1px solid #000;margin-top:8mm;margin-bottom:2mm}
.bk-logo-preview{max-width:80px;max-height:80px;object-fit:contain;border:1px solid var(--border);border-radius:4px;display:block;margin-bottom:6px}
#vorlagen-preview-scaler{overflow-x:auto;overflow-y:hidden}
/* ── Vorlagen-Wizard (v5.6.0) ────────────────────────────────────────────── */
#vt-wizard-nav{display:flex;align-items:center;margin-bottom:20px;padding-bottom:16px;border-bottom:2px solid var(--border)}
.vt-wstep{display:flex;flex-direction:column;align-items:center;gap:3px;cursor:pointer;opacity:.4;transition:opacity .2s;user-select:none}
.vt-wstep.active{opacity:1;pointer-events:none}
.vt-wstep.done{opacity:.75}
.vt-wsnum{width:28px;height:28px;border-radius:50%;border:2px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;background:var(--surface);color:var(--text2);flex-shrink:0}
.vt-wstep.active .vt-wsnum{background:var(--spd-red);border-color:var(--spd-red);color:#fff}
.vt-wstep.done .vt-wsnum{background:var(--green,#22c55e);border-color:var(--green,#22c55e);color:#fff}
.vt-wslabel{font-size:11px;font-weight:600;color:var(--text3);white-space:nowrap}
.vt-wstep.active .vt-wslabel{color:var(--spd-red)}
.vt-wstep.done .vt-wslabel{color:var(--text2)}
.vt-wsline{flex:1;height:2px;background:var(--border);margin:0 6px;margin-bottom:16px;min-width:16px}
.vt-ki-box{background:rgba(168,81,0,.07);border:1px solid rgba(168,81,0,.22);border-radius:var(--radius);padding:10px 12px;margin-bottom:16px;display:flex;align-items:center;gap:10px}
.vt-wizard-nav-bar{position:fixed;left:228px;right:0;bottom:0;z-index:40;display:flex;gap:8px;padding:10px 32px 14px;background:var(--bg);border-top:1px solid var(--border);margin:0}

/* ── Phase 3: Auswertungen & KI ─────────────────────────────────────────── */
.aus-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:16px; }
.aus-grid-3 { display:grid; grid-template-columns:1fr 1fr 1fr; gap:16px; margin-bottom:16px; }
.chart-container { position:relative; height:240px; }
.ki-suggest-pill { display:inline-flex; align-items:center; gap:5px; padding:4px 10px; border-radius:20px; font-size:12px; background:rgba(var(--theme-rgb),.08); border:1px solid rgba(var(--theme-rgb),.2); color:var(--spd-red); cursor:pointer; margin:3px 3px 3px 0; transition:background .15s; }
.ki-suggest-pill:hover { background:rgba(var(--theme-rgb),.18); }
.ki-suggest-pill.accept { background:var(--green-light); border-color:var(--green); color:var(--green); }
.sem-result { padding:10px 12px; border-bottom:1px solid var(--border); cursor:pointer; }
.sem-result:hover { background:var(--surface2); }
.sem-result:last-child { border-bottom:none; }
.sem-score { display:inline-block; padding:1px 7px; border-radius:10px; font-size:10px; font-weight:600; background:var(--green-light); color:var(--green); margin-left:6px; }

/* ── Phase 2: Timeline ───────────────────────────────────────────────────── */
.v-timeline { position:relative; padding-left:24px; }
.v-timeline::before { content:''; position:absolute; left:7px; top:0; bottom:0; width:2px; background:var(--border); border-radius:2px; }
.v-tl-month { font-size:11px; font-weight:600; color:var(--text3); text-transform:uppercase; letter-spacing:.6px; margin:20px 0 8px; padding-left:0; }
.v-tl-item { position:relative; margin-bottom:10px; cursor:pointer; user-select:none; }
.v-tl-item::before { content:''; position:absolute; left:-21px; top:10px; width:10px; height:10px; border-radius:50%; background:var(--spd-red); border:2px solid var(--surface); flex-shrink:0; }
.v-tl-card { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-lg); padding:12px 14px; transition:box-shadow .15s,border-color .15s; }
.v-tl-card:hover { box-shadow:var(--shadow-md); border-color:var(--border2); }
.v-tl-title { font-size:13px; font-weight:500; margin-bottom:4px; }
.v-tl-meta { display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
/* ── Verknüpfungen ───────────────────────────────────────────────────────── */
.vlink-item { display:flex; align-items:center; gap:8px; padding:6px 8px; background:var(--bg); border:1px solid var(--border); border-radius:var(--radius); margin-bottom:5px; font-size:12px; }
.vlink-item .vlink-remove { margin-left:auto; cursor:pointer; color:var(--spd-red); font-size:14px; line-height:1; opacity:.6; border:none; background:none; padding:2px 4px; }
.vlink-item .vlink-remove:hover { opacity:1; }
.vlink-search-results { position:absolute; z-index:100; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); max-height:180px; overflow-y:auto; box-shadow:var(--shadow-md); width:100%; top:100%; left:0; }
.vlink-result { padding:8px 10px; cursor:pointer; font-size:12px; border-bottom:1px solid var(--border); }
.vlink-result:hover { background:var(--surface2); }
.vlink-result:last-child { border-bottom:none; }
/* ── Wiedervorlagen-Seite ────────────────────────────────────────────────── */
.vresub-row { display:flex; align-items:flex-start; gap:12px; padding:10px 12px; border-bottom:1px solid var(--border); cursor:pointer; transition:background .1s; }
.vresub-row:hover { background:var(--surface2); }
.vresub-row:last-child { border-bottom:none; }
.vresub-overdue-row { background:var(--spd-red-light); }
.vresub-overdue-row:hover { background:#fdd; }
.wv-metric-tab { cursor:pointer; transition:box-shadow .15s,border-color .15s; border:2px solid transparent; }
.wv-metric-tab:hover { border-color:var(--border-strong,#cbd5e1); }
.wv-metric-tab.active { border-color:var(--spd-red)!important; box-shadow:0 0 0 3px rgba(227,0,15,.12); }

/* ── v5.1: Sidebar-Sektionslabels ───────────────────────────────────────── */
.nav-section-label {
  font-size: 9.5px;
  font-weight: 600;
  letter-spacing: .9px;
  text-transform: uppercase;
  color: rgba(var(--theme-rgb),.85);
  padding: 14px 10px 5px;
  display: block;
  user-select: none;
}
.nav-section-divider {
  height: 1px;
  background: rgba(255,255,255,.07);
  margin: 6px 10px 2px;
}

/* ── v5.0: Sidebar-Einrichtungs-Fortschritt ─────────────────────────────── */
.sidebar-setup-bar {
  margin: 8px 10px 4px;
  border-radius: 6px;
  background: rgba(227,0,15,.18);
  border: 1px solid rgba(227,0,15,.35);
  padding: 7px 9px;
  cursor: pointer;
  transition: background .15s;
  display: none; /* wird per JS eingeblendet wenn < 100% */
}
.sidebar-setup-bar:hover { background: rgba(227,0,15,.28); }
.sidebar-setup-bar .sb-label {
  font-size: 9.5px;
  font-weight: 600;
  color: rgba(255,200,200,.9);
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 5px;
}
.sidebar-setup-bar .sb-track {
  height: 4px;
  background: rgba(255,255,255,.15);
  border-radius: 2px;
  overflow: hidden;
}
.sidebar-setup-bar .sb-fill {
  height: 100%;
  border-radius: 2px;
  background: rgba(255,160,160,.8);
  transition: width .4s ease;
}

/* ── v5.0b: Setup-Checkliste in Sidebar ─────────────────────────────────── */
.sc-item {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 7px 10px;
  cursor: pointer;
  border-bottom: 1px solid rgba(255,255,255,.06);
  transition: background .12s;
}
.sc-item:last-child { border-bottom: none; }
.sc-item:hover { background: rgba(255,255,255,.08); }
.sc-dot {
  width: 18px; height: 18px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 10px; font-weight: 700;
  flex-shrink: 0; margin-top: 1px;
}
.sc-ok   { background: rgba(26,107,58,.7);  color: #a8f0c0; }
.sc-miss { background: rgba(227,0,15,.5);   color: #ffd0d0; }
.sc-text { flex: 1; min-width: 0; }
.sc-label  { font-size: 11px; font-weight: 500; color: rgba(255,255,255,.8); line-height: 1.3; }
.sc-detail { font-size: 9.5px; color: rgba(255,255,255,.45); margin-top: 1px; }

/* ── WANDKALENDER ────────────────────────────────────────────────────────── */
.wkal-grid{display:grid;gap:8px}
.wkal-month{background:var(--surface);border:1px solid var(--border);border-radius:6px;overflow:hidden}
.wkal-month-title{padding:5px 8px;background:var(--spd-red);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.4px;color:#fff;border-bottom:1px solid var(--border)}
.wkal-day-grid{display:grid;grid-template-columns:repeat(7,1fr)}
.wkal-dh{font-size:9px;text-align:center;padding:3px 1px;color:var(--text3);background:var(--surface2);border-bottom:1px solid var(--border);font-weight:600}
.wkal-dh.wkend-h{background:rgba(0,0,0,.05);color:var(--text2)}
.wkal-day{position:relative;min-height:22px;text-align:center;padding:2px 1px 3px;border-right:1px solid var(--border);border-bottom:1px solid var(--border);cursor:default}
.wkal-day.wkend{background:rgba(0,0,0,.04)}
.wkal-day.wkal-ferien{background:rgba(30,120,220,.09)}
.wkal-day.wkal-feiertag{background:rgba(255,150,0,.18)!important}
.wkal-day.wkal-today .wkal-daynr{background:var(--spd-red);color:#fff;border-radius:50%;width:15px;height:15px;line-height:15px;font-weight:700;margin:0 auto}
.wkal-day.wkal-empty{background:var(--surface2);opacity:.3}
.wkal-daynr{display:block;font-size:9px;line-height:14px;color:var(--text2)}
.wkal-dots{display:flex;justify-content:center;gap:1px;flex-wrap:wrap;padding:0 1px}
.wkal-dot{display:block;width:4px;height:4px;border-radius:50%;flex-shrink:0}

/* ── [I-25] CHATBOT-WIDGET ──────────────────────────────────────────────────── */
#chat-widget-btn{position:fixed;bottom:24px;right:24px;width:52px;height:52px;border-radius:50%;background:var(--spd-red);color:#fff;border:none;cursor:pointer;font-size:0;box-shadow:0 4px 16px rgba(0,0,0,.22),0 2px 4px rgba(0,0,0,.10);z-index:195;display:flex;align-items:center;justify-content:center;transition:background .15s,transform .15s,box-shadow .15s;}
#chat-widget-btn:hover{background:var(--spd-red-dark);transform:scale(1.06);box-shadow:0 6px 20px rgba(0,0,0,.28);}
#chat-widget-btn.chat-open{background:var(--spd-red-dark);}
#chat-widget-btn::after{content:'KI';position:absolute;top:-3px;right:-3px;background:#d4a800;color:#fff;font-size:8px;font-weight:800;padding:1px 4px;border-radius:3px;letter-spacing:.3px;animation:ki-badge-pulse 1.8s ease-in-out infinite;pointer-events:none;}
@media(prefers-reduced-motion:reduce){#chat-widget-btn::after{animation:none}}
#chat-panel{position:fixed;bottom:88px;right:24px;width:360px;height:520px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:0 8px 32px rgba(0,0,0,.15),0 2px 8px rgba(0,0,0,.08);z-index:195;display:none;flex-direction:column;overflow:hidden;animation:chatPanelIn .2s ease;}
#chat-panel.open{display:flex;}
@keyframes chatPanelIn{from{opacity:0;transform:translateY(12px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}
.chat-header{display:flex;align-items:center;gap:10px;padding:13px 16px;border-bottom:1px solid var(--border);background:var(--spd-red);color:#fff;flex-shrink:0;border-radius:var(--radius-lg) var(--radius-lg) 0 0;}
.chat-header-icon{font-size:18px;flex-shrink:0;}
.chat-header-info{flex:1;min-width:0;}
.chat-header-title{font-weight:600;font-size:14px;line-height:1.2;}
.chat-header-sub{font-size:11px;opacity:.72;margin-top:1px;}
.chat-close-btn{background:none;border:none;color:rgba(255,255,255,.7);cursor:pointer;font-size:18px;line-height:1;padding:3px 5px;border-radius:4px;transition:color .15s,background .15s;flex-shrink:0;}
.chat-close-btn:hover{color:#fff;background:rgba(255,255,255,.18);}
.chat-messages{flex:1;overflow-y:auto;padding:12px;display:flex;flex-direction:column;gap:8px;scroll-behavior:smooth;}
.chat-msg{max-width:86%;padding:9px 12px;border-radius:12px;font-size:13px;line-height:1.5;word-break:break-word;}
.chat-msg.user{align-self:flex-end;background:var(--spd-red);color:#fff;border-bottom-right-radius:3px;}
.chat-msg.assistant{align-self:flex-start;background:var(--surface2);color:var(--text);border:1px solid var(--border);border-bottom-left-radius:3px;}
.chat-msg.chat-system-info{align-self:center;font-size:11px;color:var(--text3);background:none;padding:3px 8px;max-width:100%;text-align:center;border:none;}
.chat-typing{align-self:flex-start;display:flex;gap:4px;align-items:center;padding:10px 14px;background:var(--surface2);border:1px solid var(--border);border-radius:12px;border-bottom-left-radius:3px;}
.chat-typing span{width:6px;height:6px;background:var(--text3);border-radius:50%;animation:chatTypingDot 1.2s infinite;}
.chat-typing span:nth-child(2){animation-delay:.2s;}
.chat-typing span:nth-child(3){animation-delay:.4s;}
@keyframes chatTypingDot{0%,80%,100%{transform:scale(.55);opacity:.4}40%{transform:scale(1);opacity:1}}
.chat-input-row{display:flex;gap:8px;padding:10px 12px;border-top:1px solid var(--border);background:var(--surface);flex-shrink:0;align-items:flex-end;}
#chat-input{flex:1;border:1px solid var(--border2);border-radius:8px;padding:8px 11px;font-size:13px;font-family:inherit;resize:none;min-height:38px;max-height:100px;line-height:1.45;background:var(--surface);color:var(--text);transition:border-color .15s;overflow-y:auto;}
#chat-input:focus{outline:none;border-color:var(--spd-red);}
#chat-send-btn{background:var(--spd-red);color:#fff;border:none;border-radius:8px;padding:0 13px;cursor:pointer;transition:background .15s;flex-shrink:0;height:38px;display:flex;align-items:center;justify-content:center;}
#chat-send-btn:hover{background:var(--spd-red-dark);}
#chat-send-btn:disabled{opacity:.45;cursor:not-allowed;}
@media(max-width:480px){#chat-panel{right:8px;left:8px;width:auto;bottom:82px;height:calc(100vh - 110px);max-height:520px;}#chat-widget-btn{right:16px;bottom:16px;}}
/* [H38] Custom Tooltip */
#frp-tip{position:fixed;z-index:99999;background:#1e2030;color:#f0f0f5;font-size:11.5px;line-height:1.55;padding:8px 11px;border-radius:8px;pointer-events:none;opacity:0;transition:opacity .1s;max-width:280px;box-shadow:0 4px 16px rgba(0,0,0,.32);word-break:break-word;white-space:normal;}
#frp-tip.vis{opacity:1;}
/* Kinder von Tooltip-Zellen leiten alle Mouse-Events an die übergeordnete td weiter */
td[data-tip] *{pointer-events:none;}
