/* 4.2.4: Verwaltung – Rückweg, „Springen zu“, „Änderung erkannt“, Übersicht in Gruppen (für alle Designs)
   und die wählbaren Farben „Hell und ruhig“ und „MBAS IT Kontrast“ (nur Übersicht und Seiten der Verwaltung,
   Organisation › Darstellung). Tagesgeschäft, Unterschriftsseite und Inhaber-Link bleiben unberührt. */

/* ---------- 1. Bausteine für alle Designs ---------- */
.admin-crumb{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13px;color:var(--muted);margin:0 0 6px}
.admin-crumb .link-button{background:none;border:0;padding:0;min-height:0;color:var(--green);font:inherit;font-weight:650;cursor:pointer;box-shadow:none}
.admin-crumb .link-button:hover{text-decoration:underline}
.admin-crumb span:last-child{color:var(--text);font-weight:600}

.jumpnav{position:sticky;top:0;z-index:6;display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin:0 0 16px;padding:8px 0;background:var(--bg);border-bottom:1px solid var(--line)}
.jumpnav-label{font-size:11px;font-weight:650;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-right:4px}
.jumpnav button{min-height:32px;padding:5px 12px;border-radius:999px;border:1px solid var(--line);background:var(--surface);color:var(--text);font-size:13px;font-weight:500;white-space:nowrap;box-shadow:none}
.jumpnav button:hover{border-color:var(--green)}
.jumpnav button.on{background:var(--green);border-color:var(--green);color:var(--primary-text,#fff);font-weight:600}
.card h2[id]{scroll-margin-top:64px}
@media(max-width:700px){.jumpnav-label{display:none}.jumpnav{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-left:-4px;margin-right:-4px;padding-left:4px;padding-right:4px}.jumpnav::-webkit-scrollbar{display:none}}

.page-tools{display:flex;align-items:center;justify-content:flex-end;gap:10px}
.change-chip{display:inline-flex;align-items:center;gap:7px;min-height:30px;padding:4px 11px;border-radius:999px;border:1px solid var(--warning,#805207);background:var(--warning-soft,#fff3dc);color:var(--warning,#805207);font-size:12px;font-weight:650;cursor:pointer;box-shadow:none}
.change-chip i{width:8px;height:8px;border-radius:50%;background:currentColor;animation:mb-chip-blink 1.1s ease-in-out infinite}
@keyframes mb-chip-blink{50%{opacity:.15}}
@media(prefers-reduced-motion:reduce){.change-chip i{animation:none}}

.admin-hub{margin-top:18px}
.admin-hub-title{font-size:12px!important;font-weight:650;letter-spacing:.09em;text-transform:uppercase;color:var(--muted)!important;margin:0 0 8px!important}
.admin-hub .status-grid{grid-template-columns:repeat(auto-fill,minmax(230px,1fr));margin-bottom:0}

.diagnostic-details{margin-top:10px}
.diagnostic-details summary{cursor:pointer;font-weight:600;font-size:13px;padding:4px 0}
.diagnostic-details[open] summary{margin-bottom:8px}

.design-options-admin{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:700px){.design-options-admin{grid-template-columns:1fr}}
.swatch-admin-hell-1{background:#ffffff}.swatch-admin-hell-2{background:#2563eb}.swatch-admin-hell-3{background:#f7f8fa}
.swatch-admin-kontrast-1{background:#0b1e33}.swatch-admin-kontrast-2{background:#94ba30}.swatch-admin-kontrast-3{background:#0e7c86}

/* ---------- 2. Farben je Auswahl (Tokens hell / dunkel) ---------- */
html[data-design] .shell[data-admin-design=hell]{
  --bg:#f7f8fa;--surface:#ffffff;--input:#ffffff;--text:#111827;--muted:#5f6b7a;--line:#e3e7ee;--row:#f9fafb;
  --green:#2563eb;--green-dark:#1d4ed8;--soft:#eef3fe;--blue:#1d4ed8;--primary-text:#ffffff;--t3-shadow:none;
  --sb-bg:#ffffff;--sb-text:#1f2937;--sb-muted:#6b7280;--sb-line:#e3e7ee;--sb-icon:#9ca3af;--sb-hover:#f3f4f6;--sb-active-bg:#eef3fe;--sb-active-text:#1d4ed8;--sb-input:#ffffff;
  --top-bg:#ffffff;--top-text:#111827;--top-line:#e3e7ee
}
html[data-design][data-theme=dark] .shell[data-admin-design=hell]{
  --bg:#0f141b;--surface:#171e27;--input:#121921;--text:#e7ebf0;--muted:#a1acba;--line:#2a333f;--row:#1b232d;
  --green:#7aa7ff;--green-dark:#a3c2ff;--soft:#1b2a44;--blue:#a3c2ff;--primary-text:#0f141b;
  --sb-bg:#151b23;--sb-text:#e2e7ee;--sb-muted:#9aa5b4;--sb-line:#2a333f;--sb-icon:#7d8898;--sb-hover:#1e2631;--sb-active-bg:#1b2a44;--sb-active-text:#a3c2ff;--sb-input:#121921;
  --top-bg:#151b23;--top-text:#e7ebf0;--top-line:#2a333f
}
html[data-design] .shell[data-admin-design=kontrast]{
  --bg:#eef2f6;--surface:#ffffff;--input:#ffffff;--text:#0f2236;--muted:#4f6276;--line:#d6dee8;--row:#f5f8fb;
  --green:#0e7c86;--green-dark:#0a6169;--soft:#e3f4f2;--blue:#0a6169;--primary-text:#ffffff;--t3-shadow:0 1px 2px #0b1e3310;
  --sb-bg:#0b1e33;--sb-text:#e6eef7;--sb-muted:#a9bccf;--sb-line:#1f3a55;--sb-icon:#a9bccf;--sb-hover:#ffffff12;--sb-active-bg:#94ba30;--sb-active-text:#0b1e33;--sb-input:#13304d;
  --top-bg:#0b1e33;--top-text:#ffffff;--top-line:#1f3a55;--edge:#94ba30;--card-edge:#00abde
}
html[data-design][data-theme=dark] .shell[data-admin-design=kontrast]{
  --bg:#0a1522;--surface:#122235;--input:#0e1b2b;--text:#e8f0f8;--muted:#a9bccf;--line:#24405c;--row:#162a40;
  --green:#4fc3cc;--green-dark:#7ad6dd;--soft:#123a40;--blue:#7ad6dd;--primary-text:#06161f;
  --sb-bg:#07121f;--sb-text:#e6eef7;--sb-muted:#9fb3c8;--sb-line:#1b3550;--sb-icon:#9fb3c8;--sb-hover:#ffffff10;--sb-active-bg:#94ba30;--sb-active-text:#07121f;--sb-input:#0e1b2b;
  --top-bg:#07121f;--top-text:#ffffff;--top-line:#1b3550;--edge:#94ba30;--card-edge:#00abde
}

/* ---------- 3. Gemeinsame Gestaltung beider Auswahlen ---------- */
html[data-design] .shell[data-admin-design]{background:var(--bg);color:var(--text);min-height:100vh}
html[data-design] .shell[data-admin-design] .app-workspace,html[data-design] .shell[data-admin-design] .main{background:var(--bg)}
html[data-design] .shell[data-admin-design] .sidebar{--text:var(--sb-text);--muted:var(--sb-muted);--line:var(--sb-line);--green:var(--sb-text);--soft:var(--sb-line);--surface:var(--sb-bg);--input:var(--sb-input);background:var(--sb-bg);color:var(--sb-text)}
html[data-design] .shell[data-admin-design] .sidebar-brand{border-bottom-color:var(--sb-line)}
html[data-design] .shell[data-admin-design] .sidebar-brand strong{color:var(--sb-text)}
html[data-design] .shell[data-admin-design] .sidebar-brand span,html[data-design] .shell[data-admin-design] .sidebar-caption,html[data-design] .shell[data-admin-design] .sidebar .theme-choice,html[data-design] .shell[data-admin-design] .sidebar-collapse,html[data-design] .shell[data-admin-design] .sidebar .nav-group{color:var(--sb-muted)}
html[data-design] .shell[data-admin-design] .sidebar-collapse{border-color:var(--sb-line);background:transparent}
html[data-design] .shell[data-admin-design] .sidebar select{background:var(--sb-input);color:var(--sb-text);border-color:var(--sb-line)}
html[data-design] .shell[data-admin-design] .sidebar .nav button{min-height:38px;padding:8px 12px;border-radius:8px;color:var(--sb-text);font-size:13px;font-weight:500;box-shadow:none}
html[data-design] .shell[data-admin-design] .sidebar .nav button svg{stroke:var(--sb-icon)}
html[data-design] .shell[data-admin-design] .sidebar .nav button:hover{background:var(--sb-hover);color:var(--sb-text)}
html[data-design] .shell[data-admin-design] .sidebar .nav button.active{background:var(--sb-active-bg);color:var(--sb-active-text);font-weight:650;box-shadow:none}
html[data-design] .shell[data-admin-design] .sidebar .nav button.active svg{stroke:var(--sb-active-text)}
html[data-design] .shell[data-admin-design] .topbar{background:var(--top-bg);color:var(--top-text);border-bottom:1px solid var(--top-line)}
html[data-design] .shell[data-admin-design] .topbar strong,html[data-design] .shell[data-admin-design] .topbar .user-summary{color:var(--top-text)}
html[data-design] .shell[data-admin-design] .scopebar{background:var(--surface);border-color:var(--line)}
html[data-design] .shell[data-admin-design] .page-head{margin-bottom:10px}
html[data-design] .shell[data-admin-design] .page-head h1{font-size:25px;letter-spacing:-.4px;font-weight:650;color:var(--text)}
html[data-design] .shell[data-admin-design] .card{border-radius:10px;padding:18px 20px;border-color:var(--line);background:var(--surface);box-shadow:var(--t3-shadow)}
html[data-design] .shell[data-admin-design] .card h2{font-size:17px;font-weight:650;color:var(--text)}
html[data-design] .shell[data-admin-design] .card h3{color:var(--text)}
html[data-design] .shell[data-admin-design] .main button{border-radius:8px;min-height:34px;padding:6px 12px;font-size:13px}
html[data-design] .shell[data-admin-design] .main button.primary{background:var(--green);border-color:var(--green);color:var(--primary-text)}
html[data-design] .shell[data-admin-design] .main button.primary:hover{background:var(--green-dark);border-color:var(--green-dark)}
html[data-design] .shell[data-admin-design] .status-card{border-radius:10px;padding:14px 16px;box-shadow:none}
html[data-design] .shell[data-admin-design] .status-card-link{color:var(--green)}

/* ---------- 4. Nur „Hell und ruhig“ ---------- */
html[data-design] .shell[data-admin-design=hell] .sidebar{border-right:1px solid var(--sb-line)}

/* ---------- 5. Nur „MBAS IT Kontrast“ ---------- */
html[data-design] .shell[data-admin-design=kontrast] .sidebar{border-right:3px solid var(--edge)}
html[data-design] .shell[data-admin-design=kontrast] .sidebar .nav-group{color:#4fc6ec;letter-spacing:.12em}
html[data-design] .shell[data-admin-design=kontrast] .topbar button{background:transparent;color:var(--top-text);border-color:#ffffff40}
html[data-design] .shell[data-admin-design=kontrast] .topbar .app-version{background:#ffffff1f;color:var(--top-text)}
html[data-design] .shell[data-admin-design=kontrast] .main .card{border-left:4px solid var(--card-edge)}
html[data-design] .shell[data-admin-design=kontrast] .main .card[data-new-version]{border-left-color:var(--edge)}
html[data-design] .shell[data-admin-design=kontrast] .jumpnav{background:var(--sb-bg);border:0;border-radius:8px;padding:6px 8px;gap:2px;top:4px}
html[data-design] .shell[data-admin-design=kontrast] .jumpnav-label{color:#4fc6ec;padding-left:6px}
html[data-design] .shell[data-admin-design=kontrast] .jumpnav button{background:transparent;border-color:transparent;color:var(--sb-text);border-radius:6px}
html[data-design] .shell[data-admin-design=kontrast] .jumpnav button.on{background:var(--edge);border-color:var(--edge);color:#0b1e33}
html[data-design] .shell[data-admin-design=kontrast] .admin-hub-title{color:var(--green)!important}
html[data-design] .shell .main .admin-crumb .link-button{padding:0;min-height:0;border:0;background:none;color:var(--green);font-size:13px}
