:root {
    --navy: #071727;
    --navy-2: #0d253d;
    --blue: #1e69a8;
    --blue-light: #48a4e8;
    --gold: #d8b45b;
    --surface: #ffffff;
    --surface-soft: #f3f6f9;
    --text: #142132;
    --muted: #667587;
    --border: #dce4ec;
    --success: #14835d;
    --danger: #c23a43;
    --warning: #b37a13;
    --shadow: 0 18px 50px rgba(5, 25, 45, .1);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background: var(--surface-soft);
    color: var(--text);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    line-height: 1.6;
}
a { color: inherit; text-decoration: none; }
button, input, textarea, select { font: inherit; }
main { min-height: calc(100vh - 150px); }

.topbar {
    position: sticky;
    top: 0;
    z-index: 20;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px clamp(22px, 5vw, 76px);
    color: #fff;
    background: rgba(7, 23, 39, .96);
    border-bottom: 1px solid rgba(255,255,255,.08);
    backdrop-filter: blur(18px);
}
.brand { display: flex; align-items: center; gap: 13px; }
.brand strong, .brand small { display: block; }
.brand strong { font-size: .96rem; letter-spacing: .04em; }
.brand small { color: #aebfd0; font-size: .72rem; }
.badge-mark {
    display: grid;
    place-items: center;
    width: 48px;
    height: 48px;
    border: 2px solid var(--gold);
    border-radius: 50%;
    color: var(--gold);
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .06em;
}
.nav { display: flex; align-items: center; gap: 26px; }
.nav a { color: #d9e5ef; font-size: .9rem; font-weight: 650; }
.nav a:hover { color: #fff; }
.nav-toggle { display: none; color: #fff; background: none; border: 0; font-size: 1.5rem; }

.hero {
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) minmax(320px, .65fr);
    gap: clamp(40px, 7vw, 100px);
    align-items: center;
    min-height: 680px;
    padding: 90px clamp(22px, 7vw, 110px);
    color: #fff;
    background:
        linear-gradient(110deg, rgba(3,14,25,.96), rgba(8,35,58,.88)),
        radial-gradient(circle at 78% 20%, rgba(55,150,220,.35), transparent 36%);
}
.hero h1, .page-hero h1, .dashboard-heading h1, .ticket-heading h1 {
    margin: 12px 0 18px;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(2.4rem, 5vw, 5rem);
    line-height: 1.02;
    letter-spacing: -.035em;
}
.hero p { max-width: 680px; color: #bfd0dd; font-size: 1.13rem; }
.eyebrow {
    color: var(--blue-light);
    font-size: .72rem;
    font-weight: 850;
    letter-spacing: .16em;
    text-transform: uppercase;
}
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 46px;
    padding: 0 20px;
    border: 1px solid transparent;
    border-radius: 9px;
    font-weight: 750;
    cursor: pointer;
}
.button-primary { color: #fff; background: var(--blue); box-shadow: 0 10px 25px rgba(30,105,168,.25); }
.button-primary:hover { background: #195c94; }
.button-ghost { color: var(--text); background: #fff; border-color: var(--border); }
.hero .button-ghost { color: #fff; background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.2); }
.button-danger { color: #fff; background: var(--danger); }
.full-button { width: 100%; margin-top: 9px; }
.trust-row { display: flex; flex-wrap: wrap; gap: 22px; margin-top: 36px; color: #acc1d1; font-size: .84rem; }

.hero-panel {
    padding: 34px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 18px;
    background: rgba(255,255,255,.065);
    box-shadow: 0 30px 70px rgba(0,0,0,.25);
    backdrop-filter: blur(16px);
}
.status-dot { width: 12px; height: 12px; margin-bottom: 22px; border-radius: 50%; background: #4be1a0; box-shadow: 0 0 0 8px rgba(75,225,160,.1); }
.hero-panel h2 { margin: 10px 0; font-size: 1.65rem; }
.hero-panel p { color: #bcd0de; font-size: .95rem; }
.quick-stats { margin: 26px 0 0; }
.quick-stats div { display: flex; justify-content: space-between; padding: 13px 0; border-top: 1px solid rgba(255,255,255,.1); }
.quick-stats dt { color: #9fb4c4; }
.quick-stats dd { margin: 0; font-weight: 700; }

.section { padding: 90px clamp(22px, 7vw, 110px); }
.section-heading { max-width: 650px; margin-bottom: 38px; }
.section h2 { margin: 8px 0; font-family: Georgia, serif; font-size: clamp(2rem, 4vw, 3.3rem); }
.service-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.service-card {
    min-height: 245px;
    padding: 28px;
    border: 1px solid var(--border);
    border-radius: 15px;
    background: var(--surface);
    box-shadow: 0 10px 30px rgba(18,41,64,.04);
    transition: .2s ease;
}
.service-card:hover { transform: translateY(-4px); border-color: #a9c6dc; box-shadow: var(--shadow); }
.service-icon { display: inline-grid; place-items: center; width: 48px; height: 48px; border-radius: 11px; background: #eaf4fb; font-size: 1.35rem; }
.service-card h3 { margin: 20px 0 8px; font-size: 1.15rem; }
.service-card p { color: var(--muted); font-size: .92rem; }
.card-link { display: inline-block; margin-top: 13px; color: var(--blue); font-weight: 750; font-size: .88rem; }
.split-section { display: grid; grid-template-columns: .8fr 1.2fr; gap: 70px; background: #eaf0f5; }
.timeline { list-style: none; margin: 0; padding: 0; }
.timeline li { display: flex; gap: 22px; padding: 24px 0; border-bottom: 1px solid #cfd9e2; }
.timeline li > span { color: var(--blue); font-weight: 850; }
.timeline strong { display: block; margin-bottom: 4px; }
.timeline p { margin: 0; color: var(--muted); }

.page-hero { padding: 74px clamp(22px, 7vw, 110px); color: #fff; background: linear-gradient(120deg, var(--navy), var(--navy-2)); }
.page-hero.compact h1 { max-width: 850px; font-size: clamp(2.3rem, 4vw, 4rem); }
.page-hero p { color: #b8c9d8; }
.form-shell { max-width: 1060px; margin: -28px auto 70px; padding: 0 20px; position: relative; }
.ticket-form { overflow: hidden; border: 1px solid var(--border); border-radius: 18px; background: #fff; box-shadow: var(--shadow); }
.form-section { padding: 34px; border-bottom: 1px solid var(--border); }
.form-section-title { display: flex; align-items: center; gap: 14px; margin-bottom: 25px; }
.form-section-title > span { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; color: #fff; background: var(--blue); font-weight: 800; }
.form-section-title h2 { margin: 0; font-size: 1.18rem; }
.form-section-title p { margin: 0; color: var(--muted); font-size: .84rem; }
.category-options { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.category-option { position: relative; display: block; padding: 16px; border: 1px solid var(--border); border-radius: 10px; cursor: pointer; }
.category-option input { position: absolute; opacity: 0; }
.category-option span, .category-option strong, .category-option small { display: block; }
.category-option small { margin-top: 3px; color: var(--muted); }
.category-option.selected { border-color: var(--blue); background: #edf7ff; box-shadow: inset 0 0 0 1px var(--blue); }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.form-grid label, .stack-form label { color: #314255; font-size: .84rem; font-weight: 750; }
.form-grid .full { grid-column: 1 / -1; }
input, textarea, select {
    width: 100%;
    margin-top: 7px;
    padding: 13px 14px;
    border: 1px solid #cbd7e1;
    border-radius: 8px;
    color: var(--text);
    background: #fff;
    outline: none;
}
input:focus, textarea:focus, select:focus { border-color: var(--blue); box-shadow: 0 0 0 3px rgba(30,105,168,.12); }
textarea { resize: vertical; }
.form-submit { display: flex; align-items: center; justify-content: space-between; gap: 25px; padding: 26px 34px; background: #f7f9fb; }
.consent { display: flex; align-items: flex-start; gap: 10px; color: var(--muted); font-size: .82rem; }
.consent input { width: auto; margin-top: 4px; }

.success-page { max-width: 720px; margin: 90px auto; padding: 55px; text-align: center; border: 1px solid var(--border); border-radius: 20px; background: #fff; box-shadow: var(--shadow); }
.success-icon { display: grid; place-items: center; width: 72px; height: 72px; margin: 0 auto 22px; border-radius: 50%; color: #fff; background: var(--success); font-size: 2rem; }
.success-page h1 { font-family: Georgia, serif; font-size: 2.5rem; }
.reference-box { margin: 30px 0; padding: 23px; border-radius: 12px; background: var(--surface-soft); }
.reference-box span, .reference-box strong, .reference-box small { display: block; }
.reference-box strong { margin: 6px 0; color: var(--blue); font-size: 1.6rem; letter-spacing: .06em; }

.auth-background { background: linear-gradient(120deg, #061524, #102d48); }
.auth-shell { display: grid; place-items: center; min-height: 720px; padding: 50px 20px; }
.auth-card { width: min(470px, 100%); padding: 42px; border-radius: 18px; background: #fff; box-shadow: 0 30px 80px rgba(0,0,0,.25); }
.auth-card h1 { margin: 8px 0; font-family: Georgia, serif; font-size: 2.2rem; }
.auth-card p { color: var(--muted); }
.stack-form { display: grid; gap: 17px; margin-top: 25px; }
.security-note { display: block; margin-top: 18px; color: var(--muted); text-align: center; }

.dashboard-layout { display: grid; grid-template-columns: 260px 1fr; min-height: calc(100vh - 80px); }
.sidebar { padding: 28px 18px; color: #d8e5ef; background: var(--navy); }
.sidebar-user { display: flex; align-items: center; gap: 11px; padding: 0 10px 24px; margin-bottom: 15px; border-bottom: 1px solid rgba(255,255,255,.1); }
.sidebar-user strong, .sidebar-user small { display: block; }
.sidebar-user small { color: #8199ac; }
.avatar { display: grid; place-items: center; flex: 0 0 auto; width: 40px; height: 40px; border-radius: 50%; color: #fff; background: var(--blue); font-weight: 850; }
.sidebar > a { display: block; margin: 5px 0; padding: 12px 14px; border-radius: 8px; color: #a9bdcc; font-weight: 650; font-size: .9rem; }
.sidebar > a:hover, .sidebar > a.active { color: #fff; background: rgba(255,255,255,.09); }
.dashboard-content { min-width: 0; padding: 42px; }
.dashboard-heading, .ticket-heading { display: flex; align-items: center; justify-content: space-between; gap: 25px; margin-bottom: 30px; }
.dashboard-heading h1, .ticket-heading h1 { margin: 5px 0; font-size: clamp(2.1rem, 4vw, 3.7rem); }
.stat-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 22px; }
.stat-card { padding: 22px; border: 1px solid var(--border); border-radius: 13px; background: #fff; }
.stat-card span, .stat-card small { display: block; color: var(--muted); }
.stat-card strong { display: block; margin: 6px 0; font-size: 2rem; }
.dashboard-grid { display: grid; grid-template-columns: 1.5fr .7fr; gap: 20px; }
.panel { border: 1px solid var(--border); border-radius: 14px; background: #fff; box-shadow: 0 8px 22px rgba(17,39,59,.035); }
.panel-heading { display: flex; align-items: center; justify-content: space-between; padding: 23px; border-bottom: 1px solid var(--border); }
.panel-heading h2 { margin: 4px 0 0; font-size: 1.2rem; }
.panel-heading > a { color: var(--blue); font-weight: 750; font-size: .84rem; }
.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
th, td { padding: 16px 19px; border-bottom: 1px solid #e8edf2; text-align: left; font-size: .87rem; }
th { color: var(--muted); background: #f8fafb; font-size: .72rem; letter-spacing: .05em; text-transform: uppercase; }
td a strong, td a small { display: block; }
td a small { max-width: 280px; overflow: hidden; color: var(--muted); text-overflow: ellipsis; white-space: nowrap; }
.empty { padding: 40px; color: var(--muted); text-align: center; }
.status { display: inline-block; padding: 5px 9px; border-radius: 999px; font-size: .72rem; font-weight: 800; }
.status-open { color: #0e7952; background: #dff6ed; }
.status-claimed { color: #98640d; background: #fff0ca; }
.status-closed { color: #596675; background: #e8edf1; }
.status.large { padding: 9px 14px; }
.integration-list { padding: 14px 23px; }
.integration-list div { display: flex; justify-content: space-between; padding: 15px 0; border-bottom: 1px solid var(--border); }
.integration-list span { color: var(--muted); }
.integration-list + .button { margin: 0 23px 23px; width: calc(100% - 46px); }
.filter-bar { display: grid; grid-template-columns: 1fr 200px auto; gap: 10px; margin-bottom: 18px; }
.filter-bar input, .filter-bar select { margin: 0; }

.ticket-layout { display: grid; grid-template-columns: 1fr 330px; gap: 20px; }
.back-link { display: inline-block; margin-bottom: 15px; color: var(--blue); font-weight: 750; }
.conversation { overflow: hidden; }
.message { display: flex; gap: 14px; padding: 24px; border-bottom: 1px solid var(--border); }
.message > div:last-child { flex: 1; }
.message header { display: flex; justify-content: space-between; gap: 20px; }
.message header span { color: var(--muted); font-size: .76rem; }
.message p { margin: 7px 0 0; }
.staff-message { background: #f5faff; }
.reply-form { padding: 22px; background: #f8fafc; }
.reply-form textarea { margin: 0 0 12px; }
.ticket-sidebar { display: grid; align-content: start; gap: 16px; }
.details-card, .action-card { padding: 22px; }
.details-card dl { margin: 15px 0 0; }
.details-card dl div { padding: 12px 0; border-bottom: 1px solid var(--border); }
.details-card dt { color: var(--muted); font-size: .72rem; text-transform: uppercase; }
.details-card dd { margin: 3px 0 0; font-weight: 700; }

.transcript-page { max-width: 1000px; margin: 55px auto; padding: 0 20px; }
.transcript-header { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.transcript-header h1 { margin: 5px 0; font-family: Georgia, serif; font-size: 3rem; }
.transcript-meta { display: flex; flex-wrap: wrap; gap: 25px; margin: 25px 0; padding: 18px 22px; border-radius: 10px; background: #eaf0f5; }
.transcript-list { overflow: hidden; }
.transcript-message { padding: 22px; border-bottom: 1px solid var(--border); }
.transcript-message header { display: flex; justify-content: space-between; }
.transcript-message header span { color: var(--muted); font-size: .78rem; }

.personnel-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.personnel-card { padding: 20px; }
.personnel-head { display: flex; align-items: center; gap: 10px; }
.personnel-head > div:nth-child(2) { flex: 1; }
.personnel-head strong, .personnel-head small { display: block; }
.personnel-head small { color: var(--muted); }
.personnel-card dl { margin: 20px 0 0; }
.personnel-card dl div { display: flex; justify-content: space-between; padding: 11px 0; border-top: 1px solid var(--border); }
.personnel-card dt { color: var(--muted); }
.personnel-card dd { margin: 0; font-weight: 750; }
.empty-state { padding: 45px; text-align: center; }
.staff-list { padding: 12px 22px; }
.staff-list > div { display: flex; align-items: center; gap: 11px; padding: 13px 0; border-bottom: 1px solid var(--border); }
.staff-list > div > div { flex: 1; }
.staff-list strong, .staff-list small { display: block; }
.staff-list small { color: var(--muted); }
.role-chip { padding: 5px 9px; border-radius: 999px; color: var(--blue); background: #eaf4fb; font-size: .72rem; font-weight: 800; }

.flash, .error-list { max-width: 1060px; margin: 14px auto; padding: 14px 18px; border-radius: 9px; font-weight: 650; }
.flash-success { color: #0b6846; background: #dff6ed; }
.flash-error, .error-list { color: #942831; background: #fde6e8; }
.error-list p { margin: 3px 0; }

.footer { display: flex; justify-content: space-between; gap: 30px; padding: 35px clamp(22px, 7vw, 110px); color: #9eb1bf; background: #05111d; }
.footer strong { color: #fff; }
.footer p { margin: 3px 0 0; }
.footer-meta { display: flex; flex-direction: column; text-align: right; }

@media (max-width: 1050px) {
    .hero, .dashboard-grid, .ticket-layout, .split-section { grid-template-columns: 1fr; }
    .stat-grid { grid-template-columns: repeat(2, 1fr); }
    .service-grid, .personnel-grid { grid-template-columns: repeat(2, 1fr); }
    .ticket-sidebar { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 760px) {
    .nav-toggle { display: block; }
    .nav { display: none; position: absolute; top: 80px; left: 0; right: 0; flex-direction: column; align-items: flex-start; padding: 22px; background: var(--navy); }
    .nav.open { display: flex; }
    .hero { grid-template-columns: 1fr; min-height: auto; padding-top: 65px; }
    .service-grid, .category-options, .form-grid, .stat-grid, .personnel-grid { grid-template-columns: 1fr; }
    .form-grid .full { grid-column: auto; }
    .form-submit, .dashboard-heading, .ticket-heading, .transcript-header { align-items: stretch; flex-direction: column; }
    .dashboard-layout { grid-template-columns: 1fr; }
    .sidebar { display: flex; overflow-x: auto; padding: 10px; }
    .sidebar-user { display: none; }
    .sidebar > a { white-space: nowrap; }
    .dashboard-content { padding: 24px 16px; }
    .ticket-sidebar { grid-template-columns: 1fr; }
    .filter-bar { grid-template-columns: 1fr; }
    .footer { flex-direction: column; }
    .footer-meta { text-align: left; }
}
@media print {
    .topbar, .footer, .button { display: none !important; }
    body { background: #fff; }
    .transcript-page { max-width: none; margin: 0; }
    .panel { border: 0; box-shadow: none; }
}


.avatar-image{object-fit:cover}.personnel-link{display:block;color:inherit}.personnel-link:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:#aac8df}.warning-list{padding:0 22px}.warning-entry{padding:18px 0;border-bottom:1px solid var(--border)}.warning-entry strong,.warning-entry small{display:block}.warning-entry small{margin-top:5px;color:var(--muted)}.active-duty-panel{grid-column:1/-1}.active-officer-list{padding:8px 22px}.active-officer-row{display:flex;align-items:center;gap:12px;padding:13px 0;border-bottom:1px solid var(--border)}.active-officer-row>div{flex:1}.active-officer-row strong,.active-officer-row small{display:block}.active-officer-row small{color:var(--muted)}


/* Bürgerportal */
.reference-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin:30px 0 18px; }
.reference-grid .reference-box { margin:0; }
.access-code-box strong { color:var(--success); font-size:1.45rem; letter-spacing:.1em; }
.security-warning { padding:16px 18px; border:1px solid #e5c87b; border-radius:10px; color:#72520e; background:#fff7dd; text-align:left; }
.centered-actions { justify-content:center; }
.portal-help { margin-top:24px; padding:16px; border-radius:10px; background:var(--surface-soft); }
.portal-help p { margin:5px 0 0; font-size:.85rem; }
.citizen-portal-shell { max-width:1250px; margin:55px auto; padding:0 22px; }
.citizen-ticket-heading { display:flex; align-items:center; justify-content:space-between; gap:25px; margin-bottom:28px; }
.citizen-ticket-heading h1 { margin:5px 0; font-family:Georgia,serif; font-size:clamp(2rem,4vw,3.7rem); }
.citizen-ticket-heading p { margin:0; color:var(--muted); }
.citizen-ticket-layout { display:grid; grid-template-columns:1fr 330px; gap:20px; }
.conversation-intro { display:flex; justify-content:space-between; gap:20px; padding:18px 24px; color:var(--muted); background:#f8fafc; border-bottom:1px solid var(--border); }
.conversation-intro strong { color:var(--text); }
.citizen-message { background:#fff; }
.citizen-reply-form label { display:block; color:#314255; font-size:.84rem; font-weight:750; }
.closed-notice { margin:22px; padding:20px; border-radius:10px; background:#eef2f5; }
.closed-notice p { margin:5px 0 0; color:var(--muted); }
.muted-copy { color:var(--muted); font-size:.88rem; }
.internal-message { background:#fff7df; border-left:4px solid var(--warning); }
.reply-actions { display:flex; flex-wrap:wrap; gap:10px; }
.form-hint { display:block; margin-top:10px; color:var(--muted); }
.fresh-code-box { margin:14px 0; padding:16px; border:1px solid #a9d7be; border-radius:10px; background:#e9f8f0; }
.fresh-code-box small, .fresh-code-box strong, .fresh-code-box span { display:block; }
.fresh-code-box strong { margin:5px 0; color:var(--success); font-size:1.25rem; letter-spacing:.08em; }
.fresh-code-box span { color:#476657; font-size:.78rem; }

@media (max-width: 900px) {
    .citizen-ticket-layout { grid-template-columns:1fr; }
}
@media (max-width: 700px) {
    .reference-grid { grid-template-columns:1fr; }
    .citizen-ticket-heading, .conversation-intro { align-items:stretch; flex-direction:column; }
}


/* =========================================================
   Bürgerportal UI 2.0
   ========================================================= */
.citizen-portal-page {
    background:
        radial-gradient(circle at 18% 0%, rgba(30, 105, 168, .08), transparent 30rem),
        #edf2f6;
}

.citizen-portal {
    width: min(1380px, calc(100% - 48px));
    margin: 42px auto 70px;
}

.citizen-ticket-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    padding: 30px 34px;
    color: #fff;
    background:
        linear-gradient(115deg, rgba(6, 24, 41, .98), rgba(14, 49, 78, .95)),
        radial-gradient(circle at 85% 10%, rgba(72, 164, 232, .25), transparent 26rem);
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: 20px;
    box-shadow: 0 24px 65px rgba(6, 25, 43, .18);
}

.citizen-ticket-hero-main {
    display: flex;
    align-items: center;
    min-width: 0;
    gap: 20px;
}

.ticket-category-icon {
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    width: 66px;
    height: 66px;
    border: 1px solid rgba(255, 255, 255, .13);
    border-radius: 17px;
    background: rgba(255, 255, 255, .08);
    font-size: 1.75rem;
    box-shadow: inset 0 1px rgba(255, 255, 255, .08);
}

.citizen-ticket-hero h1 {
    overflow: hidden;
    margin: 7px 0 9px;
    color: #fff;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(1.75rem, 3vw, 3rem);
    line-height: 1.08;
    text-overflow: ellipsis;
}

.ticket-hero-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 20px;
    color: #adc2d2;
    font-size: .85rem;
}

.ticket-hero-meta span {
    position: relative;
}

.ticket-hero-meta span + span::before {
    position: absolute;
    left: -11px;
    content: "•";
    color: #5e7d94;
}

.ticket-hero-actions {
    display: grid;
    justify-items: end;
    flex: 0 0 auto;
    gap: 11px;
}

.copy-ticket-button {
    padding: 8px 12px;
    color: #c4d5e2;
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 8px;
    background: rgba(255, 255, 255, .06);
    font-size: .76rem;
    font-weight: 750;
    cursor: pointer;
}

.copy-ticket-button:hover {
    color: #fff;
    background: rgba(255, 255, 255, .12);
}

.ticket-progress-card {
    display: grid;
    grid-template-columns: auto 1fr auto 1fr auto;
    align-items: center;
    gap: 18px;
    margin: 18px 0;
    padding: 22px 28px;
    border: 1px solid var(--border);
    border-radius: 15px;
    background: #fff;
    box-shadow: 0 8px 28px rgba(18, 41, 64, .045);
}

.progress-step {
    display: flex;
    align-items: center;
    gap: 11px;
    min-width: 0;
    opacity: .48;
}

.progress-step > span {
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    width: 34px;
    height: 34px;
    border: 2px solid #c9d4de;
    border-radius: 50%;
    color: #82909d;
    background: #fff;
    font-size: .78rem;
    font-weight: 850;
}

.progress-step strong,
.progress-step small {
    display: block;
    white-space: nowrap;
}

.progress-step strong {
    font-size: .83rem;
}

.progress-step small {
    color: var(--muted);
    font-size: .69rem;
}

.progress-step.active {
    opacity: 1;
}

.progress-step.active > span {
    color: #fff;
    border-color: var(--blue);
    background: var(--blue);
    box-shadow: 0 0 0 5px rgba(30, 105, 168, .1);
}

.progress-line {
    height: 2px;
    border-radius: 99px;
    background: #dce4eb;
}

.progress-line.active {
    background: var(--blue);
}

.citizen-ticket-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 350px;
    align-items: start;
    gap: 18px;
}

.ticket-chat-card,
.ticket-info-card,
.ticket-security-card {
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 10px 32px rgba(18, 41, 64, .055);
}

.ticket-chat-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 23px 26px;
    border-bottom: 1px solid var(--border);
}

.ticket-chat-header h2,
.ticket-info-card h2,
.ticket-security-card h2 {
    margin: 4px 0 0;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1.35rem;
}

.message-count {
    padding: 5px 9px;
    color: #526577;
    border-radius: 999px;
    background: #edf2f6;
    font-size: .7rem;
    font-weight: 800;
}

.privacy-notice {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 18px 24px 2px;
    padding: 12px 14px;
    color: #466176;
    border: 1px solid #d6e7f3;
    border-radius: 10px;
    background: #f1f8fc;
    font-size: .79rem;
}

.privacy-notice p {
    margin: 0;
}

.chat-messages {
    display: grid;
    gap: 0;
    padding: 12px 24px 5px;
}

.chat-message {
    display: flex;
    gap: 13px;
    padding: 17px 0;
}

.chat-message + .chat-message {
    border-top: 1px solid #edf1f4;
}

.chat-avatar {
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    width: 40px;
    height: 40px;
    border-radius: 12px;
    color: #fff;
    background: linear-gradient(145deg, #2779b8, #155183);
    font-size: .85rem;
    font-weight: 850;
}

.chat-message-staff .chat-avatar {
    color: #ffe39a;
    background: linear-gradient(145deg, #172f46, #081b2b);
}

.chat-message-content {
    min-width: 0;
    flex: 1;
}

.chat-message-content > header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    margin-bottom: 7px;
}

.chat-message-content > header > div {
    display: flex;
    align-items: center;
    gap: 7px;
}

.chat-message-content time {
    flex: 0 0 auto;
    color: #8593a0;
    font-size: .7rem;
}

.sender-badge {
    padding: 2px 6px;
    color: #8a6618;
    border-radius: 5px;
    background: #fff0bd;
    font-size: .6rem;
    font-weight: 900;
    letter-spacing: .05em;
}

.chat-bubble {
    display: inline-block;
    max-width: min(760px, 100%);
    padding: 12px 15px;
    color: #263748;
    border: 1px solid #e0e7ed;
    border-radius: 4px 13px 13px 13px;
    background: #f7f9fb;
    line-height: 1.55;
    overflow-wrap: anywhere;
}

.chat-message-staff .chat-bubble {
    border-color: #cfe1ef;
    background: #eef7fd;
}

.citizen-composer {
    margin: 18px 24px 24px;
    padding: 19px;
    border: 1px solid #d9e2e9;
    border-radius: 13px;
    background: #f8fafc;
}

.composer-heading,
.composer-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
}

.composer-heading strong,
.composer-heading small {
    display: block;
}

.composer-heading small,
.composer-heading > span,
.composer-footer > span {
    color: var(--muted);
    font-size: .7rem;
}

.citizen-composer textarea {
    min-height: 132px;
    margin: 13px 0;
    border-color: #cbd7e0;
    background: #fff;
}

.citizen-ticket-sidebar {
    position: sticky;
    top: 102px;
    display: grid;
    gap: 16px;
}

.ticket-info-card,
.ticket-security-card {
    padding: 22px;
}

.ticket-info-list {
    margin: 17px 0 0;
}

.ticket-info-list > div {
    display: grid;
    grid-template-columns: 1fr;
    gap: 3px;
    padding: 13px 0;
    border-top: 1px solid #e7edf2;
}

.ticket-info-list dt {
    color: #7d8b98;
    font-size: .64rem;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.ticket-info-list dd {
    overflow-wrap: anywhere;
    margin: 0;
    color: #253749;
    font-size: .86rem;
    font-weight: 750;
}

.security-card-icon {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    margin-bottom: 15px;
    border-radius: 11px;
    background: #edf5fb;
    font-size: 1.2rem;
}

.ticket-security-card p {
    color: var(--muted);
    font-size: .8rem;
}

.new-ticket-link-card {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 17px 19px;
    color: #cfe0ec;
    border: 1px solid rgba(255,255,255,.07);
    border-radius: 13px;
    background: var(--navy);
    box-shadow: 0 12px 25px rgba(7, 23, 39, .12);
}

.new-ticket-link-card > span {
    display: grid;
    place-items: center;
    width: 35px;
    height: 35px;
    border-radius: 9px;
    background: rgba(255,255,255,.08);
    font-size: 1.25rem;
}

.new-ticket-link-card strong,
.new-ticket-link-card small {
    display: block;
}

.new-ticket-link-card small {
    color: #8fa7b9;
}

.ticket-closed-card {
    display: flex;
    align-items: center;
    gap: 15px;
    margin: 20px 24px 24px;
    padding: 18px;
    color: #345447;
    border: 1px solid #cbe5d8;
    border-radius: 12px;
    background: #edf8f2;
}

.ticket-closed-card > span {
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    width: 35px;
    height: 35px;
    color: #fff;
    border-radius: 50%;
    background: var(--success);
    font-weight: 900;
}

.ticket-closed-card p {
    margin: 3px 0 0;
    color: #587467;
    font-size: .8rem;
}

@media (max-width: 1060px) {
    .citizen-ticket-grid {
        grid-template-columns: 1fr;
    }

    .citizen-ticket-sidebar {
        position: static;
        grid-template-columns: 1fr 1fr;
    }

    .new-ticket-link-card {
        grid-column: 1 / -1;
    }
}

@media (max-width: 800px) {
    .citizen-portal {
        width: min(100% - 24px, 1380px);
        margin-top: 18px;
    }

    .citizen-ticket-hero {
        align-items: flex-start;
        flex-direction: column;
        padding: 24px;
    }

    .ticket-hero-actions {
        justify-items: start;
    }

    .ticket-progress-card {
        grid-template-columns: 1fr;
        gap: 10px;
        padding: 18px;
    }

    .progress-line {
        width: 2px;
        height: 18px;
        margin-left: 16px;
    }

    .progress-step strong,
    .progress-step small {
        white-space: normal;
    }

    .citizen-ticket-sidebar {
        grid-template-columns: 1fr;
    }

    .new-ticket-link-card {
        grid-column: auto;
    }
}

@media (max-width: 560px) {
    .citizen-ticket-hero-main {
        align-items: flex-start;
    }

    .ticket-category-icon {
        width: 50px;
        height: 50px;
        border-radius: 13px;
        font-size: 1.3rem;
    }

    .ticket-hero-meta {
        flex-direction: column;
        gap: 3px;
    }

    .ticket-hero-meta span + span::before {
        display: none;
    }

    .ticket-chat-header,
    .composer-heading,
    .composer-footer,
    .chat-message-content > header {
        align-items: flex-start;
        flex-direction: column;
    }

    .chat-messages {
        padding-inline: 16px;
    }

    .privacy-notice,
    .citizen-composer {
        margin-inline: 16px;
    }

    .chat-message {
        gap: 9px;
    }

    .chat-avatar {
        width: 34px;
        height: 34px;
        border-radius: 9px;
    }

    .composer-footer .button {
        width: 100%;
    }
}


/* LSPD favicon/logo and modern internal sidebar */
.brand-logo-wrap{display:grid;place-items:center;flex:0 0 auto;width:52px;height:52px}
.brand-logo{width:52px;height:52px;object-fit:contain;filter:drop-shadow(0 6px 12px rgba(0,0,0,.28))}
.admin-sidebar{position:sticky;top:80px;display:flex;flex-direction:column;align-self:start;height:calc(100vh - 80px);min-height:620px;padding:18px 14px 16px;overflow-y:auto;background:radial-gradient(circle at 30% -5%,rgba(38,105,157,.3),transparent 17rem),linear-gradient(180deg,#0b2237,#061421 74%);border-right:1px solid rgba(255,255,255,.07)}
.admin-sidebar-brand{display:flex;align-items:center;gap:12px;padding:12px;margin-bottom:20px;color:#fff;border:1px solid rgba(255,255,255,.08);border-radius:14px;background:rgba(255,255,255,.045)}
.admin-sidebar-brand img{width:48px;height:48px;flex:0 0 auto;object-fit:contain;filter:drop-shadow(0 7px 10px rgba(0,0,0,.25))}
.admin-sidebar-brand strong,.admin-sidebar-brand small{display:block}
.admin-sidebar-brand strong{font-size:.88rem;letter-spacing:.02em}
.admin-sidebar-brand small{margin-top:1px;color:#7895aa;font-size:.66rem}
.admin-nav{display:grid;gap:5px}
.admin-nav-section{padding:17px 12px 6px;color:#66849a;font-size:.61rem;font-weight:850;letter-spacing:.13em;text-transform:uppercase}
.admin-nav>a{position:relative;display:flex;align-items:center;gap:11px;min-height:43px;padding:9px 12px;color:#9db2c2;border:1px solid transparent;border-radius:10px;font-size:.83rem;font-weight:700;transition:.18s ease}
.admin-nav>a:hover{color:#fff;border-color:rgba(255,255,255,.07);background:rgba(255,255,255,.06);transform:translateX(2px)}
.admin-nav>a.active{color:#fff;border-color:rgba(86,167,226,.22);background:linear-gradient(90deg,rgba(30,105,168,.36),rgba(30,105,168,.12));box-shadow:inset 3px 0 #4aa5e6}
.admin-nav-icon{display:grid;place-items:center;width:25px;height:25px;flex:0 0 auto;color:#9ccceb;border-radius:7px;background:rgba(255,255,255,.055);font-size:.86rem}
.admin-sidebar-user{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:10px;padding:12px;margin-top:auto;color:#fff;border:1px solid rgba(255,255,255,.08);border-radius:13px;background:rgba(255,255,255,.045)}
.admin-user-avatar{display:grid;place-items:center;width:37px;height:37px;border:1px solid rgba(216,180,91,.45);border-radius:11px;color:#ffe5a5;background:#132f47;font-size:.82rem;font-weight:850}
.admin-sidebar-user strong,.admin-sidebar-user small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.admin-sidebar-user strong{font-size:.78rem}.admin-sidebar-user small{color:#7894a8;font-size:.64rem}
.admin-logout{display:grid;place-items:center;width:30px;height:30px;color:#8ba6b8;border-radius:8px;background:rgba(255,255,255,.04)}
.admin-logout:hover{color:#fff;background:rgba(194,58,67,.28)}
@media(max-width:760px){
.admin-sidebar{position:static;display:flex;flex-direction:row;align-items:center;width:100%;height:auto;min-height:0;padding:8px;overflow-x:auto;border-right:0;border-bottom:1px solid rgba(255,255,255,.08)}
.admin-sidebar-brand{flex:0 0 auto;padding:5px 8px;margin:0 5px 0 0}.admin-sidebar-brand img{width:33px;height:33px}.admin-sidebar-brand span{display:none}
.admin-nav{display:flex;flex:0 0 auto;gap:4px}.admin-nav-section,.admin-sidebar-user{display:none}
.admin-nav>a{min-height:38px;padding:7px 10px;white-space:nowrap}
}


/* Passwortverwaltung */
.password-card {
    position: relative;
    overflow: hidden;
}

.password-card::before {
    position: absolute;
    inset: 0 0 auto;
    height: 5px;
    content: "";
    background: linear-gradient(90deg, #d8b45b, #1e69a8);
}

.password-card-logo {
    display: block;
    width: 74px;
    height: 74px;
    margin: 0 auto 20px;
    object-fit: contain;
    filter: drop-shadow(0 9px 17px rgba(7, 23, 39, .2));
}

.password-rules {
    display: grid;
    gap: 5px;
    padding: 14px 16px;
    color: #536576;
    border: 1px solid #dce5ec;
    border-radius: 10px;
    background: #f5f8fa;
    font-size: .76rem;
}

.password-rules strong {
    color: #26394b;
    margin-bottom: 2px;
}

.password-rules span::before {
    margin-right: 7px;
    color: #14835d;
    content: "✓";
    font-weight: 900;
}

.account-back-link {
    display: block;
    margin-top: 20px;
    color: var(--blue);
    text-align: center;
    font-size: .82rem;
    font-weight: 750;
}

.field-help {
    display: block;
    margin-top: 6px;
    color: var(--muted);
    font-size: .72rem;
    font-weight: 500;
}

.permission-notice{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:18px;padding:13px 16px;color:#5b4a1d;border:1px solid #e8d697;border-radius:10px;background:#fff8df;font-size:.82rem}.permission-notice span{color:#7c6b3c}@media(max-width:760px){.permission-notice{align-items:flex-start;flex-direction:column;gap:4px}}


/* Mitarbeiter- und Berechtigungsverwaltung */
.staff-admin-layout {
    display: grid;
    grid-template-columns: minmax(420px, .85fr) minmax(420px, 1.15fr);
    gap: 20px;
}

.staff-editor-form {
    padding: 22px;
    margin: 0;
}

.permission-fieldset {
    display: grid;
    gap: 10px;
    margin: 4px 0 6px;
    padding: 17px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: #f8fafc;
}

.permission-fieldset legend {
    padding: 0 7px;
    color: #415467;
    font-size: .78rem;
    font-weight: 850;
}

.permission-option {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: start;
    gap: 11px;
    padding: 12px;
    border: 1px solid #dfe7ed;
    border-radius: 9px;
    background: #fff;
    cursor: pointer;
}

.permission-option:hover {
    border-color: #aac9df;
}

.permission-option input {
    width: auto;
    margin: 4px 0 0;
}

.permission-option strong,
.permission-option small {
    display: block;
}

.permission-option small {
    margin-top: 2px;
    color: var(--muted);
    font-size: .72rem;
    font-weight: 500;
}

.staff-management-list {
    display: grid;
    max-height: 760px;
    overflow-y: auto;
}

.staff-management-item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    padding: 15px 20px;
    border-bottom: 1px solid var(--border);
    transition: .16s ease;
}

.staff-management-item:hover,
.staff-management-item.selected {
    background: #f0f7fc;
}

.staff-management-item.selected {
    box-shadow: inset 4px 0 var(--blue);
}

.staff-management-identity strong,
.staff-management-identity small,
.staff-management-meta small {
    display: block;
}

.staff-management-identity small,
.staff-management-meta small {
    color: var(--muted);
    font-size: .69rem;
}

.staff-management-meta {
    display: grid;
    justify-items: end;
    gap: 5px;
}

.staff-danger-zone {
    padding: 22px;
    border-top: 1px solid var(--border);
    background: #fff8f8;
}

.staff-danger-zone h3 {
    margin: 0 0 15px;
    color: #812f36;
    font-size: 1rem;
}

.password-reset-form {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: end;
    gap: 10px;
    margin-bottom: 14px;
}

.password-reset-form input {
    margin-bottom: 0;
}

@media (max-width: 1050px) {
    .staff-admin-layout {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 620px) {
    .password-reset-form {
        grid-template-columns: 1fr;
    }

    .staff-management-item {
        grid-template-columns: auto 1fr;
    }

    .staff-management-meta {
        grid-column: 2;
        justify-items: start;
    }
}


/* =========================================================
   Mitarbeiterverwaltung UI 2.0
   ========================================================= */
.staff-page {
    background:
        radial-gradient(circle at 100% 0%, rgba(30,105,168,.08), transparent 30rem),
        #edf2f6;
}

.staff-page-header {
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:20px;
    margin-bottom:24px;
}

.staff-page-header h1 {
    margin:5px 0 2px;
    font-family:Georgia,"Times New Roman",serif;
    font-size:clamp(2.1rem,4vw,3.6rem);
    line-height:1.05;
}

.staff-page-header p {
    margin:0;
    color:var(--muted);
}

.staff-ui-grid {
    display:grid;
    grid-template-columns:minmax(0,1.45fr) minmax(340px,.75fr);
    align-items:start;
    gap:20px;
}

.staff-form-card,
.staff-list-card {
    overflow:hidden;
    border:1px solid var(--border);
    border-radius:18px;
    background:#fff;
    box-shadow:0 15px 42px rgba(18,41,64,.07);
}

.staff-card-header,
.staff-list-header {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    padding:24px 26px;
    border-bottom:1px solid var(--border);
}

.staff-card-title {
    display:flex;
    align-items:center;
    gap:14px;
}

.staff-card-icon {
    display:grid;
    place-items:center;
    width:42px;
    height:42px;
    border-radius:12px;
    color:#fff;
    background:linear-gradient(145deg,#2c82c3,#145486);
    font-size:1.1rem;
    font-weight:900;
}

.staff-card-header h2,
.staff-list-header h2 {
    margin:4px 0 0;
    font-family:Georgia,"Times New Roman",serif;
    font-size:1.42rem;
}

.staff-status-badge,
.staff-total-badge {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:40px;
    min-height:28px;
    padding:5px 10px;
    border-radius:999px;
    color:#24557b;
    background:#e8f3fb;
    font-size:.69rem;
    font-weight:850;
}

.staff-status-badge.is-admin {
    color:#856316;
    background:#fff0be;
}

.staff-modern-form {
    margin:0;
}

.staff-form-section {
    padding:25px 26px;
    border-bottom:1px solid var(--border);
}

.staff-section-heading {
    display:flex;
    align-items:center;
    gap:12px;
    margin-bottom:20px;
}

.staff-section-heading > span {
    display:grid;
    place-items:center;
    width:33px;
    height:33px;
    flex:0 0 auto;
    border-radius:50%;
    color:#fff;
    background:#143b5e;
    font-size:.68rem;
    font-weight:900;
}

.staff-section-heading strong,
.staff-section-heading small {
    display:block;
}

.staff-section-heading small {
    color:var(--muted);
    font-size:.72rem;
}

.staff-field-grid {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:16px;
}

.staff-field-grid label {
    display:block;
}

.staff-field-grid label > span,
.staff-password-row label > span {
    display:block;
    margin-bottom:6px;
    color:#33485a;
    font-size:.76rem;
    font-weight:800;
}

.staff-field-grid input,
.staff-field-grid select,
.staff-password-row input {
    margin:0;
    min-height:46px;
    border:1px solid #ccd8e1;
    background:#fff;
}

.staff-field-grid label > small {
    display:block;
    margin-top:6px;
    color:var(--muted);
    font-size:.68rem;
}

.staff-field-full {
    grid-column:1/-1;
}

.permission-card-grid {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
}

.permission-switch-card {
    display:grid !important;
    grid-template-columns:auto 1fr !important;
    align-items:center !important;
    gap:13px !important;
    min-height:92px;
    padding:16px !important;
    border:1px solid #dce5ec !important;
    border-radius:13px !important;
    background:#f9fbfc !important;
    cursor:pointer;
    transition:.18s ease;
}

.permission-switch-card:hover {
    border-color:#a9c9df !important;
    background:#f3f9fd !important;
    transform:translateY(-1px);
}

.permission-switch-card input {
    position:absolute;
    opacity:0;
    pointer-events:none;
}

.permission-switch-ui {
    position:relative;
    display:block;
    width:44px;
    height:24px;
    border-radius:999px;
    background:#c8d3dc;
    box-shadow:inset 0 1px 2px rgba(0,0,0,.08);
    transition:.2s ease;
}

.permission-switch-ui > span {
    position:absolute;
    top:3px;
    left:3px;
    width:18px;
    height:18px;
    border-radius:50%;
    background:#fff;
    box-shadow:0 2px 5px rgba(0,0,0,.18);
    transition:.2s ease;
}

.permission-switch-card input:checked + .permission-switch-ui {
    background:var(--blue);
}

.permission-switch-card input:checked + .permission-switch-ui > span {
    transform:translateX(20px);
}

.permission-switch-card input:checked ~ .permission-switch-content strong {
    color:#155b91;
}

.permission-switch-content strong,
.permission-switch-content small {
    display:block;
}

.permission-switch-content strong {
    color:#273b4d;
    font-size:.84rem;
}

.permission-switch-content small {
    margin-top:4px;
    color:var(--muted);
    font-size:.68rem;
    line-height:1.45;
}

.staff-form-actions {
    display:flex;
    justify-content:flex-end;
    padding:20px 26px;
    background:#f7f9fb;
}

.staff-form-actions .button {
    min-width:210px;
}

.staff-security-card {
    padding:24px 26px;
    border-top:1px solid #edd6d8;
    background:#fff8f8;
}

.staff-security-card h3 {
    margin:4px 0 18px;
    color:#733038;
    font-family:Georgia,"Times New Roman",serif;
    font-size:1.25rem;
}

.staff-password-row {
    display:grid;
    grid-template-columns:1fr auto;
    align-items:end;
    gap:12px;
    margin-bottom:16px;
}

.staff-delete-row {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    padding:15px;
    border:1px solid #edc7ca;
    border-radius:11px;
    background:#fff;
}

.staff-delete-row strong,
.staff-delete-row small {
    display:block;
}

.staff-delete-row small {
    color:#8d666a;
    font-size:.7rem;
}

.staff-list-card {
    position:sticky;
    top:100px;
}

.staff-search-wrap {
    padding:16px 18px;
    border-bottom:1px solid var(--border);
    background:#f8fafc;
}

.staff-search-wrap input {
    margin:0;
    min-height:43px;
    padding-left:14px;
}

.staff-card-list {
    display:grid;
    max-height:710px;
    overflow-y:auto;
}

.staff-account-card {
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
    gap:12px;
    padding:15px 18px;
    border-bottom:1px solid #e8edf1;
    transition:.16s ease;
}

.staff-account-card:hover,
.staff-account-card.selected {
    background:#f0f7fc;
}

.staff-account-card.selected {
    box-shadow:inset 4px 0 var(--blue);
}

.staff-account-avatar {
    display:grid;
    place-items:center;
    width:42px;
    height:42px;
    border-radius:12px;
    color:#fff;
    background:linear-gradient(145deg,#2f83bf,#16598d);
    font-size:.88rem;
    font-weight:900;
}

.staff-account-main strong,
.staff-account-main small,
.staff-account-side small {
    display:block;
}

.staff-account-main strong {
    color:#24384a;
    font-size:.84rem;
}

.staff-account-main small {
    color:var(--muted);
    font-size:.68rem;
}

.staff-account-side {
    display:grid;
    justify-items:end;
    gap:5px;
}

.staff-role-pill {
    padding:4px 8px;
    border-radius:999px;
    color:#246089;
    background:#e7f2f9;
    font-size:.62rem;
    font-weight:850;
}

.staff-role-pill.is-admin {
    color:#856316;
    background:#fff0be;
}

.staff-password-pending {
    color:#ad6e12 !important;
    font-size:.6rem !important;
}

@media (max-width:1100px) {
    .staff-ui-grid {
        grid-template-columns:1fr;
    }

    .staff-list-card {
        position:static;
    }
}

@media (max-width:720px) {
    .staff-page-header,
    .staff-delete-row {
        align-items:stretch;
        flex-direction:column;
    }

    .staff-field-grid,
    .permission-card-grid,
    .staff-password-row {
        grid-template-columns:1fr;
    }

    .staff-field-full {
        grid-column:auto;
    }

    .staff-form-actions .button,
    .staff-delete-row .button {
        width:100%;
    }
}


/* Mitarbeiterliste */
.roster-page {
    background:
        radial-gradient(circle at 100% 0%, rgba(30,105,168,.08), transparent 28rem),
        #edf2f6;
}

.roster-header {
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:20px;
    margin-bottom:24px;
}

.roster-header h1 {
    margin:5px 0 2px;
    font-family:Georgia,"Times New Roman",serif;
    font-size:clamp(2.1rem,4vw,3.6rem);
    line-height:1.05;
}

.roster-header p {
    margin:0;
    color:var(--muted);
}

.roster-stat-grid {
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:14px;
    margin-bottom:18px;
}

.roster-stat-grid article {
    padding:20px;
    border:1px solid var(--border);
    border-radius:14px;
    background:#fff;
    box-shadow:0 10px 28px rgba(18,41,64,.05);
}

.roster-stat-grid span,
.roster-stat-grid small {
    display:block;
    color:var(--muted);
}

.roster-stat-grid strong {
    display:block;
    margin:5px 0;
    font-size:1.9rem;
}

.roster-filter {
    display:grid;
    grid-template-columns:minmax(260px,1fr) 220px 190px auto;
    gap:10px;
    margin-bottom:18px;
    padding:15px;
    border:1px solid var(--border);
    border-radius:14px;
    background:#fff;
}

.roster-filter input,
.roster-filter select {
    margin:0;
}

.roster-table-card {
    overflow:hidden;
    border:1px solid var(--border);
    border-radius:16px;
    background:#fff;
    box-shadow:0 14px 38px rgba(18,41,64,.06);
}

.roster-table-wrap {
    overflow-x:auto;
}

.roster-table {
    min-width:1050px;
}

.roster-table th {
    padding:15px 18px;
    background:#f6f8fa;
}

.roster-table td {
    padding:16px 18px;
    vertical-align:middle;
}

.service-number {
    display:inline-flex;
    min-width:54px;
    justify-content:center;
    padding:6px 9px;
    border-radius:8px;
    color:#214e70;
    background:#e9f3fa;
    font-weight:900;
    letter-spacing:.05em;
}

.roster-person {
    display:flex;
    align-items:center;
    gap:11px;
}

.roster-avatar {
    display:grid;
    place-items:center;
    width:39px;
    height:39px;
    flex:0 0 auto;
    border-radius:11px;
    color:#fff;
    background:linear-gradient(145deg,#2d82c1,#155586);
    font-size:.82rem;
    font-weight:900;
}

.roster-person strong,
.roster-person small {
    display:block;
}

.roster-person small {
    color:var(--muted);
    font-size:.68rem;
}

.callsign-chip,
.duty-chip,
.employment-chip {
    display:inline-flex;
    align-items:center;
    padding:5px 9px;
    border-radius:999px;
    font-size:.66rem;
    font-weight:850;
    white-space:nowrap;
}

.callsign-chip {
    color:#704f0d;
    background:#fff0bd;
}

.duty-chip {
    color:#65717d;
    background:#e8edf1;
}

.duty-chip.is-on {
    color:#0d744e;
    background:#dcf5ea;
}

.employment-active {
    color:#0d744e;
    background:#dcf5ea;
}

.employment-leave {
    color:#805d14;
    background:#fff0bd;
}

.employment-suspended {
    color:#9b3038;
    background:#fce4e6;
}

.employment-inactive {
    color:#65717d;
    background:#e8edf1;
}

@media(max-width:1100px){
    .roster-stat-grid{grid-template-columns:repeat(2,1fr)}
    .roster-filter{grid-template-columns:1fr 1fr}
}

@media(max-width:700px){
    .roster-header{align-items:stretch;flex-direction:column}
    .roster-stat-grid,.roster-filter{grid-template-columns:1fr}
}


/* Direkte Mitarbeiterbearbeitung */
.roster-edit-button,
.personnel-edit-button {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:34px;
    padding:6px 11px;
    border:1px solid #b9d3e6;
    border-radius:8px;
    color:#175f94;
    background:#eef7fd;
    font-size:.7rem;
    font-weight:850;
    white-space:nowrap;
    transition:.16s ease;
}

.roster-edit-button:hover,
.personnel-edit-button:hover {
    color:#fff;
    border-color:var(--blue);
    background:var(--blue);
    transform:translateY(-1px);
}

.personnel-edit-button {
    width:100%;
    margin-top:16px;
}

.staff-header-actions {
    display:flex;
    flex-wrap:wrap;
    justify-content:flex-end;
    gap:10px;
}

@media(max-width:700px){
    .staff-header-actions {
        justify-content:flex-start;
    }
}


/* Abteilungsverwaltung */
.departments-page {
    background:
        radial-gradient(circle at 100% 0%, rgba(30,105,168,.08), transparent 28rem),
        #edf2f6;
}

.departments-header {
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:20px;
    margin-bottom:24px;
}

.departments-header h1 {
    margin:5px 0 2px;
    font-family:Georgia,"Times New Roman",serif;
    font-size:clamp(2.1rem,4vw,3.6rem);
    line-height:1.05;
}

.departments-header p {
    margin:0;
    color:var(--muted);
}

.department-overview-grid {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:18px;
    margin-bottom:24px;
}

.department-card {
    position:relative;
    overflow:hidden;
    padding:22px;
    border:1px solid var(--border);
    border-radius:17px;
    background:#fff;
    box-shadow:0 14px 38px rgba(18,41,64,.06);
}

.department-card-accent {
    position:absolute;
    inset:0 0 auto;
    height:5px;
    background:var(--department-color);
}

.department-card header {
    display:flex;
    align-items:center;
    gap:13px;
    margin-top:5px;
}

.department-logo {
    display:grid;
    place-items:center;
    width:48px;
    height:48px;
    flex:0 0 auto;
    color:#fff;
    border-radius:13px;
    background:var(--department-color);
    font-size:.72rem;
    font-weight:900;
    letter-spacing:.04em;
}

.department-card header span,
.department-card header h2 {
    display:block;
}

.department-card header span {
    color:var(--department-color);
    font-size:.65rem;
    font-weight:850;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.department-card header h2 {
    margin:2px 0 0;
    font-family:Georgia,"Times New Roman",serif;
    font-size:1.28rem;
}

.department-description {
    min-height:72px;
    margin:18px 0;
    color:var(--muted);
    font-size:.82rem;
}

.department-stats {
    margin:0;
    border-top:1px solid var(--border);
}

.department-stats > div {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    padding:11px 0;
    border-bottom:1px solid var(--border);
}

.department-stats dt {
    color:var(--muted);
    font-size:.72rem;
}

.department-stats dd {
    margin:0;
    font-size:.78rem;
    font-weight:800;
    text-align:right;
}

.department-card footer {
    display:flex;
    justify-content:space-between;
    gap:10px;
    margin-top:17px;
}

.department-card footer a {
    color:var(--blue);
    font-size:.72rem;
    font-weight:850;
}

.department-empty {
    grid-column:1/-1;
    padding:55px 25px;
    border:1px dashed #b9c8d4;
    border-radius:16px;
    background:#fff;
    text-align:center;
}

.department-empty > span {
    display:block;
    font-size:2.2rem;
}

.department-empty h2 {
    margin:12px 0 4px;
}

.department-empty p {
    margin:0;
    color:var(--muted);
}

.department-form-card {
    overflow:hidden;
    border:1px solid var(--border);
    border-radius:17px;
    background:#fff;
    box-shadow:0 14px 38px rgba(18,41,64,.06);
}

.department-form-card > header {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    padding:22px 25px;
    border-bottom:1px solid var(--border);
}

.department-form-card h2 {
    margin:4px 0 0;
    font-family:Georgia,"Times New Roman",serif;
    font-size:1.45rem;
}

.department-form {
    padding:24px 25px;
}

.department-form input[type="color"] {
    min-height:48px;
    padding:5px;
}

.department-form-actions {
    display:flex;
    justify-content:flex-end;
    margin-top:18px;
}

.department-delete-form {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    padding:18px 25px;
    border-top:1px solid #ebd4d6;
    background:#fff8f8;
}

.department-delete-form strong,
.department-delete-form small {
    display:block;
}

.department-delete-form small {
    color:#8d676b;
    font-size:.72rem;
}

@media(max-width:1100px){
    .department-overview-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:700px){
    .departments-header,
    .department-delete-form {
        align-items:stretch;
        flex-direction:column;
    }

    .department-overview-grid {
        grid-template-columns:1fr;
    }

    .department-form-card > header {
        align-items:stretch;
        flex-direction:column;
    }
}


/* Öffentlich sichtbare Abteilungen */
.department-logo img,
.public-department-logo img,
.current-logo-preview img {
    width:100%;
    height:100%;
    object-fit:contain;
}

.department-logo {
    overflow:hidden;
}

.department-logo-upload input[type="file"] {
    padding:11px;
}

.current-logo-preview {
    display:flex;
    align-items:center;
    gap:10px;
    margin-top:10px;
    padding:10px;
    border:1px solid var(--border);
    border-radius:9px;
    background:#f8fafc;
}

.current-logo-preview img {
    width:42px;
    height:42px;
}

.current-logo-preview span {
    color:var(--muted);
    font-size:.75rem;
}

.public-departments-hero {
    padding:80px clamp(22px,7vw,110px);
    color:#fff;
    background:
        linear-gradient(115deg,rgba(5,20,34,.97),rgba(12,49,78,.94)),
        radial-gradient(circle at 82% 20%,rgba(72,164,232,.24),transparent 24rem);
}

.public-departments-hero h1 {
    margin:8px 0 10px;
    font-family:Georgia,"Times New Roman",serif;
    font-size:clamp(2.5rem,5vw,4.8rem);
}

.public-departments-hero p {
    max-width:650px;
    margin:0;
    color:#b9cad8;
    font-size:1.05rem;
}

.public-departments-section {
    padding:70px clamp(22px,7vw,110px);
}

.public-departments-grid {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:22px;
}

.public-department-card {
    overflow:hidden;
    border:1px solid var(--border);
    border-top:5px solid var(--department-color);
    border-radius:18px;
    background:#fff;
    box-shadow:0 16px 42px rgba(18,41,64,.07);
}

.public-department-logo {
    display:grid;
    place-items:center;
    width:100%;
    height:180px;
    padding:28px;
    color:#fff;
    background:
        linear-gradient(145deg,color-mix(in srgb,var(--department-color) 80%,#071727),#071727);
}

.public-department-logo span {
    display:grid;
    place-items:center;
    width:96px;
    height:96px;
    border:2px solid rgba(255,255,255,.45);
    border-radius:24px;
    font-size:1.4rem;
    font-weight:900;
    letter-spacing:.08em;
}

.public-department-body {
    padding:24px;
}

.public-department-short {
    color:var(--department-color);
    font-size:.68rem;
    font-weight:900;
    letter-spacing:.12em;
    text-transform:uppercase;
}

.public-department-body h2 {
    margin:5px 0 10px;
    font-family:Georgia,"Times New Roman",serif;
    font-size:1.5rem;
}

.public-department-body > p {
    min-height:86px;
    color:var(--muted);
    font-size:.84rem;
}

.public-department-body dl {
    margin:18px 0 0;
    border-top:1px solid var(--border);
}

.public-department-body dl > div {
    display:flex;
    justify-content:space-between;
    gap:14px;
    padding:12px 0;
    border-bottom:1px solid var(--border);
}

.public-department-body dt {
    color:var(--muted);
    font-size:.72rem;
}

.public-department-body dd {
    margin:0;
    font-size:.76rem;
    font-weight:800;
    text-align:right;
}

.public-departments-empty {
    grid-column:1/-1;
    padding:60px;
    border:1px dashed #b8c8d4;
    border-radius:16px;
    background:#fff;
    text-align:center;
}

@media(max-width:1050px){
    .public-departments-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:700px){
    .public-departments-grid{grid-template-columns:1fr}
}


/* Zwei-Faktor-Authentifizierung */
.two-factor-card input[name="code"] {
    text-align:center;
    font-size:1.35rem;
    font-weight:850;
    letter-spacing:.2em;
}

.two-factor-page {
    background:
        radial-gradient(circle at 100% 0%, rgba(30,105,168,.08), transparent 28rem),
        #edf2f6;
}

.two-factor-status {
    padding:7px 11px;
    border-radius:999px;
    color:#6b7782;
    background:#e7ecef;
    font-size:.72rem;
    font-weight:850;
}

.two-factor-status.enabled {
    color:#0d744e;
    background:#dcf5ea;
}

.two-factor-main-card,
.two-factor-setup-card,
.two-factor-action-card,
.two-factor-recovery-card {
    padding:25px;
    border:1px solid var(--border);
    border-radius:17px;
    background:#fff;
    box-shadow:0 14px 38px rgba(18,41,64,.06);
}

.two-factor-main-card {
    display:grid;
    grid-template-columns:auto 1fr auto;
    align-items:center;
    gap:18px;
}

.two-factor-main-card.compact {
    grid-template-columns:auto 1fr;
}

.two-factor-main-card h2,
.two-factor-setup-card h2,
.two-factor-action-card h2,
.two-factor-recovery-card h2 {
    margin:4px 0 7px;
    font-family:Georgia,"Times New Roman",serif;
    font-size:1.45rem;
}

.two-factor-main-card p,
.two-factor-action-card p,
.two-factor-recovery-card p {
    margin:0;
    color:var(--muted);
    font-size:.83rem;
}

.two-factor-icon {
    display:grid;
    place-items:center;
    width:52px;
    height:52px;
    border-radius:14px;
    color:#fff;
    background:linear-gradient(145deg,#2c82c3,#145486);
    font-size:1.35rem;
    font-weight:900;
}

.two-factor-setup-card {
    padding:0;
    overflow:hidden;
}

.two-factor-setup-card > header {
    padding:23px 25px;
    border-bottom:1px solid var(--border);
}

.two-factor-setup-grid {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:24px;
    padding:25px;
}

.two-factor-setup-grid h3 {
    margin:0 0 8px;
    font-size:1rem;
}

.two-factor-setup-grid p {
    color:var(--muted);
    font-size:.82rem;
}

.secret-box {
    margin:18px 0;
    padding:16px;
    border:1px solid #cfe0ec;
    border-radius:11px;
    background:#f1f8fc;
}

.secret-box span,
.secret-box code {
    display:block;
}

.secret-box span {
    color:var(--muted);
    font-size:.68rem;
    font-weight:800;
    text-transform:uppercase;
}

.secret-box code {
    margin-top:6px;
    overflow-wrap:anywhere;
    color:#154d75;
    font-size:1rem;
    font-weight:850;
    letter-spacing:.08em;
}

.otpauth-details {
    color:var(--muted);
    font-size:.75rem;
}

.otpauth-details code {
    display:block;
    margin-top:8px;
    overflow-wrap:anywhere;
}

.two-factor-management-grid {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:18px;
}

.two-factor-management-grid .two-factor-main-card {
    grid-column:1/-1;
}

.two-factor-action-card.danger {
    border-color:#ebced1;
    background:#fffafa;
}

.two-factor-recovery-card {
    margin-bottom:18px;
    border-color:#e6d497;
    background:#fff9e8;
}

.recovery-code-grid {
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:10px;
    margin-top:18px;
}

.recovery-code-grid code {
    padding:10px;
    border-radius:8px;
    color:#5e4811;
    background:#fff;
    text-align:center;
    font-weight:850;
    letter-spacing:.08em;
}

.staff-two-factor-reset-row {
    margin-bottom:12px;
    border-color:#cddfec;
    background:#f7fbfe;
}

@media(max-width:800px){
    .two-factor-main-card,
    .two-factor-setup-grid,
    .two-factor-management-grid {
        grid-template-columns:1fr;
    }

    .recovery-code-grid {
        grid-template-columns:1fr 1fr;
    }
}


/* Dokumentenverwaltung */
.documents-page{background:radial-gradient(circle at 100% 0%,rgba(30,105,168,.08),transparent 28rem),#edf2f6}
.documents-header{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:24px}
.documents-header h1{margin:5px 0 2px;font-family:Georgia,"Times New Roman",serif;font-size:clamp(2.1rem,4vw,3.6rem);line-height:1.05}
.documents-header p{margin:0;color:var(--muted)}
.document-empty-card{padding:60px 28px;border:1px dashed #b8c8d4;border-radius:17px;background:#fff;text-align:center}
.document-empty-card.embedded{border:0;border-radius:0;box-shadow:none}
.document-empty-card>span{display:block;font-size:2.5rem}.document-empty-card h2{margin:13px 0 5px}.document-empty-card p{margin:0;color:var(--muted)}
.contract-overview-card,.document-list-card,.document-editor-card,.warrant-list-card{overflow:hidden;border:1px solid var(--border);border-radius:17px;background:#fff;box-shadow:0 14px 38px rgba(18,41,64,.06)}
.contract-overview-head{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:16px;padding:25px;border-bottom:1px solid var(--border)}
.document-icon{display:grid;place-items:center;width:54px;height:54px;border-radius:15px;background:#eaf4fb;font-size:1.5rem}
.contract-overview-head h2{margin:4px 0;font-family:Georgia,serif;font-size:1.5rem}.contract-overview-head p{margin:0;color:var(--muted);font-size:.8rem}
.document-status{padding:6px 10px;border-radius:999px;background:#e8edf1;color:#65717d;font-size:.68rem;font-weight:850}.document-status-active{background:#dcf5ea;color:#0d744e}.document-status-terminated{background:#fce4e6;color:#9b3038}
.contract-summary-grid{display:grid;grid-template-columns:repeat(3,1fr);margin:0;padding:10px 25px 20px}
.contract-summary-grid>div{padding:14px 10px;border-bottom:1px solid var(--border)}.contract-summary-grid dt{color:var(--muted);font-size:.68rem;text-transform:uppercase}.contract-summary-grid dd{margin:3px 0 0;font-weight:800}
.document-download-row{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 25px;background:#f7f9fb}.document-download-row strong,.document-download-row small{display:block}.document-download-row small{color:var(--muted);font-size:.72rem}
.documents-admin-grid{display:grid;grid-template-columns:360px minmax(0,1fr);align-items:start;gap:20px}.document-list-card{position:sticky;top:100px}.document-list-card>header,.document-editor-card>header{padding:22px 24px;border-bottom:1px solid var(--border)}.document-list-card h2,.document-editor-card h2{margin:4px 0 0;font-family:Georgia,serif;font-size:1.4rem}
.document-list{display:grid;max-height:720px;overflow-y:auto}.document-list>a{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:11px;padding:14px 18px;border-bottom:1px solid var(--border)}.document-list>a:hover,.document-list>a.selected{background:#f0f7fc}.document-list>a.selected{box-shadow:inset 4px 0 var(--blue)}
.document-person-avatar{display:grid;place-items:center;width:38px;height:38px;border-radius:11px;background:#1e69a8;color:#fff;font-weight:900}.document-list strong,.document-list small{display:block}.document-list small{color:var(--muted);font-size:.67rem}
.contract-presence{padding:4px 7px;border-radius:999px;background:#e8edf1;color:#697682;font-size:.58rem;font-weight:850}.contract-presence.exists{background:#dcf5ea;color:#0d744e}
.document-editor-card>header{display:flex;align-items:center;justify-content:space-between;gap:15px}.document-form{padding:24px}.document-form-actions{display:flex;justify-content:flex-end;margin-top:18px}
.warrant-list-card{margin-bottom:20px}.warrant-status{padding:5px 8px;border-radius:999px;background:#e8edf1;font-size:.62rem;font-weight:850}.warrant-status-issued{background:#dcf5ea;color:#0d744e}.warrant-status-draft{background:#fff0bd;color:#805d14}.warrant-status-revoked{background:#fce4e6;color:#9b3038}
.warrant-actions{display:flex;gap:10px}.warrant-actions a{color:var(--blue);font-weight:800;font-size:.72rem}.warrant-editor{margin-bottom:30px}.document-header-actions{display:flex;gap:8px}
@media(max-width:1050px){.documents-admin-grid{grid-template-columns:1fr}.document-list-card{position:static}.contract-summary-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.documents-header,.document-download-row,.document-editor-card>header{align-items:stretch;flex-direction:column}.contract-overview-head{grid-template-columns:auto 1fr}.contract-overview-head .document-status{grid-column:1/-1;justify-self:start}.contract-summary-grid{grid-template-columns:1fr}}

.personnel-action-chip{display:inline-flex;padding:5px 9px;border-radius:999px;font-size:.63rem;font-weight:850}
.action-promotion{background:#fff0bd;color:#805d14}.action-probation{background:#dcf5ea;color:#0d744e}
.action-termination{background:#fce4e6;color:#9b3038}.action-suspension{background:#eee8fb;color:#67439b}
[data-action-field][hidden]{display:none!important}
.personnel-action-history{margin-top:20px;padding:22px}.personnel-action-history>div{display:grid;grid-template-columns:1fr auto auto;gap:15px;padding:12px 0;border-bottom:1px solid var(--border)}
.personnel-action-history span{color:var(--muted);font-size:.75rem}.personnel-action-history a{color:var(--blue);font-weight:800}


/* =========================================================
   LSPD Scrollbar Design
   ========================================================= */

/* Firefox */
html,
body {
    scrollbar-width: thin;
    scrollbar-color: #315f82 #dfe7ed;
}

.admin-sidebar,
.document-list,
.staff-card-list,
.staff-management-list,
.roster-table-wrap,
.table-wrap,
.chat-messages {
    scrollbar-width: thin;
    scrollbar-color: #315f82 #071727;
}

/* Gesamte Webseite: Chrome, Edge und Safari */
html::-webkit-scrollbar,
body::-webkit-scrollbar {
    width: 11px;
    height: 11px;
}

html::-webkit-scrollbar-track,
body::-webkit-scrollbar-track {
    background: #dfe7ed;
}

html::-webkit-scrollbar-thumb,
body::-webkit-scrollbar-thumb {
    min-height: 45px;
    border: 3px solid #dfe7ed;
    border-radius: 999px;
    background: linear-gradient(180deg, #376b91, #173e5e);
}

html::-webkit-scrollbar-thumb:hover,
body::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(180deg, #dfbd65, #a17a28);
}

/* Interne dunkle Sidebar */
.admin-sidebar {
    scrollbar-gutter: stable;
    overscroll-behavior: contain;
}

.admin-sidebar::-webkit-scrollbar {
    width: 8px;
}

.admin-sidebar::-webkit-scrollbar-track {
    margin: 7px 0;
    border-radius: 999px;
    background: rgba(3, 13, 22, .78);
}

.admin-sidebar::-webkit-scrollbar-thumb {
    min-height: 48px;
    border: 2px solid rgba(3, 13, 22, .78);
    border-radius: 999px;
    background: linear-gradient(180deg, #3e7398, #173b58);
}

.admin-sidebar::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(180deg, #e0bd64, #9e7625);
}

/* Listen im Adminbereich */
.document-list::-webkit-scrollbar,
.staff-card-list::-webkit-scrollbar,
.staff-management-list::-webkit-scrollbar,
.chat-messages::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

.document-list::-webkit-scrollbar-track,
.staff-card-list::-webkit-scrollbar-track,
.staff-management-list::-webkit-scrollbar-track,
.chat-messages::-webkit-scrollbar-track {
    border-radius: 999px;
    background: #e5ebf0;
}

.document-list::-webkit-scrollbar-thumb,
.staff-card-list::-webkit-scrollbar-thumb,
.staff-management-list::-webkit-scrollbar-thumb,
.chat-messages::-webkit-scrollbar-thumb {
    min-height: 42px;
    border: 2px solid #e5ebf0;
    border-radius: 999px;
    background: #315f82;
}

.document-list::-webkit-scrollbar-thumb:hover,
.staff-card-list::-webkit-scrollbar-thumb:hover,
.staff-management-list::-webkit-scrollbar-thumb:hover,
.chat-messages::-webkit-scrollbar-thumb:hover {
    background: #d8b45b;
}

/* Horizontale Tabellen */
.roster-table-wrap::-webkit-scrollbar,
.table-wrap::-webkit-scrollbar {
    width: 8px;
    height: 9px;
}

.roster-table-wrap::-webkit-scrollbar-track,
.table-wrap::-webkit-scrollbar-track {
    border-radius: 999px;
    background: #e5ebf0;
}

.roster-table-wrap::-webkit-scrollbar-thumb,
.table-wrap::-webkit-scrollbar-thumb {
    border: 2px solid #e5ebf0;
    border-radius: 999px;
    background: linear-gradient(90deg, #315f82, #1c4768);
}

.roster-table-wrap::-webkit-scrollbar-thumb:hover,
.table-wrap::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(90deg, #d8b45b, #a17a28);
}

/* Alte weiße Scrollbar-Pfeile und störende Ecken vermeiden */
::-webkit-scrollbar-button {
    display: none;
    width: 0;
    height: 0;
}

::-webkit-scrollbar-corner {
    background: #071727;
}


/* Downloadcenter, Asservatenkammer und Waffenkammer */
.module-page{background:radial-gradient(circle at 100% 0%,rgba(30,105,168,.08),transparent 28rem),#edf2f6}
.module-header{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:22px}
.module-header h1{margin:5px 0 2px;font-family:Georgia,"Times New Roman",serif;font-size:clamp(2.1rem,4vw,3.6rem);line-height:1.05}.module-header p{margin:0;color:var(--muted)}
.download-category-tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px}.download-category-tabs a{padding:8px 12px;border:1px solid var(--border);border-radius:999px;background:#fff;color:#566979;font-size:.72rem;font-weight:800}.download-category-tabs a.active,.download-category-tabs a:hover{color:#fff;border-color:var(--blue);background:var(--blue)}
.download-layout{display:grid;grid-template-columns:minmax(0,1fr) 340px;align-items:start;gap:18px}.download-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}.download-card,.module-form-card,.module-table-card{overflow:hidden;border:1px solid var(--border);border-radius:16px;background:#fff;box-shadow:0 12px 34px rgba(18,41,64,.055)}
.download-card{display:grid;grid-template-columns:auto 1fr;align-items:start;padding:20px}.download-file-icon{display:grid;place-items:center;width:52px;height:58px;border-radius:11px;color:#fff;background:linear-gradient(145deg,#1e69a8,#103b5d);font-size:.67rem;font-weight:900}.download-card-body{padding-left:14px}.download-category{color:var(--blue);font-size:.62rem;font-weight:900;text-transform:uppercase}.download-card h2{margin:4px 0 7px;font-family:Georgia,serif;font-size:1.2rem}.download-card p{min-height:48px;margin:0;color:var(--muted);font-size:.76rem}.download-meta{display:flex;flex-wrap:wrap;gap:6px 12px;margin-top:12px;color:#788896;font-size:.65rem}.download-card footer{grid-column:1/-1;display:flex;gap:8px;margin-top:17px;padding-top:15px;border-top:1px solid var(--border)}.download-card footer form{margin:0}
.module-form-card{position:sticky;top:100px}.module-form-card>header{padding:20px 22px;border-bottom:1px solid var(--border)}.module-form-card h2{margin:4px 0 0;font-family:Georgia,serif}.module-form-card form{padding:20px}
.module-empty{grid-column:1/-1;padding:55px;border:1px dashed #b8c8d4;border-radius:16px;background:#fff;text-align:center}.module-empty>span{font-size:2.3rem}.module-empty h2{margin:10px 0 4px}.module-empty p{margin:0;color:var(--muted)}
.module-search{display:grid;grid-template-columns:1fr auto;gap:10px;margin-bottom:16px;padding:14px;border:1px solid var(--border);border-radius:13px;background:#fff}.module-search input{margin:0}
.module-table-card{margin-bottom:20px}.module-table-card small{display:block;color:var(--muted);font-size:.66rem}
.evidence-status,.weapon-status{display:inline-flex;padding:5px 8px;border-radius:999px;font-size:.62rem;font-weight:850}.evidence-stored,.weapon-available{background:#dcf5ea;color:#0d744e}.evidence-analysis,.weapon-maintenance{background:#fff0bd;color:#805d14}.evidence-released,.weapon-retired{background:#e8edf1;color:#65717d}.evidence-destroyed,.weapon-lost{background:#fce4e6;color:#9b3038}.evidence-transferred,.weapon-issued{background:#e8f3fb;color:#245f88}
.evidence-detail-grid,.armory-action-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;padding:22px;border-top:1px solid var(--border);background:#f8fafc}.evidence-detail-grid h3,.armory-action-card h3,.module-history h3{margin:0 0 14px;font-family:Georgia,serif}.evidence-photo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.evidence-photo-grid article{overflow:hidden;border:1px solid var(--border);border-radius:10px;background:#fff}.evidence-photo-grid img{display:block;width:100%;height:120px;object-fit:cover}.evidence-photo-grid form{padding:7px}.evidence-photo-grid button{width:100%;padding:5px;border:0;border-radius:6px;color:#9b3038;background:#fce8ea;font-size:.65rem}
.evidence-history,.module-history{display:grid}.evidence-history>div,.module-history>div{padding:11px 0;border-bottom:1px solid var(--border)}.evidence-history strong,.evidence-history span,.module-history strong,.module-history span{display:block}.evidence-history span,.module-history span{color:var(--muted);font-size:.68rem}.module-history{padding:22px;border-top:1px solid var(--border)}.module-history p{margin:4px 0 0;color:#586979;font-size:.75rem}
.evidence-label-page{min-height:calc(100vh - 80px);padding:50px 20px;background:#e8eef3}.evidence-label-card{max-width:900px;margin:auto;overflow:hidden;border:1px solid #b7c6d1;border-radius:15px;background:#fff;box-shadow:0 18px 50px rgba(18,41,64,.12)}.evidence-label-brand{display:flex;align-items:center;gap:13px;padding:18px 24px;color:#fff;background:#071727}.evidence-label-brand img{width:48px;height:48px}.evidence-label-brand strong,.evidence-label-brand span{display:block}.evidence-label-brand span{color:#d8b45b;font-size:.65rem;letter-spacing:.12em}.evidence-label-content{display:grid;grid-template-columns:1fr 300px;gap:25px;padding:28px}.evidence-label-content>div>span{color:var(--muted);font-size:.7rem;text-transform:uppercase}.evidence-label-content h1{margin:4px 0 20px;font-family:Georgia,serif;font-size:2.2rem}.evidence-label-content dl>div{display:flex;justify-content:space-between;gap:15px;padding:10px 0;border-bottom:1px solid var(--border)}.evidence-label-content dt{color:var(--muted)}.evidence-label-content dd{margin:0;font-weight:800;text-align:right}.evidence-qr{text-align:center}.evidence-qr img{max-width:260px;width:100%;border:8px solid #fff;box-shadow:0 8px 22px rgba(0,0,0,.08)}.evidence-qr small{display:block;margin-top:8px;color:var(--muted)}.evidence-label-card footer{display:flex;justify-content:flex-end;gap:8px;padding:17px 24px;background:#f4f7f9}
.armory-action-card{padding:19px;border:1px solid var(--border);border-radius:12px;background:#fff}
@media(max-width:1100px){.download-layout{grid-template-columns:1fr}.module-form-card{position:static}.download-grid{grid-template-columns:1fr}.evidence-detail-grid,.armory-action-grid{grid-template-columns:1fr}}
@media(max-width:700px){.module-header{align-items:stretch;flex-direction:column}.module-search{grid-template-columns:1fr}.evidence-label-content{grid-template-columns:1fr}.evidence-photo-grid{grid-template-columns:1fr 1fr}}
@media print{.site-header,.site-footer,.evidence-label-card footer{display:none!important}.evidence-label-page{padding:0;background:#fff}.evidence-label-card{max-width:none;border:0;box-shadow:none}}


/* Sichere Löschbereiche */
.module-danger-zone {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    padding:18px 22px;
    border-top:1px solid #edcfd2;
    background:#fff8f8;
}

.module-danger-zone strong,
.module-danger-zone small {
    display:block;
}

.module-danger-zone strong {
    color:#812f36;
}

.module-danger-zone small {
    margin-top:3px;
    color:#8d676b;
    font-size:.72rem;
    line-height:1.45;
}

.module-danger-zone form {
    flex:0 0 auto;
    margin:0;
}

@media(max-width:700px) {
    .module-danger-zone {
        align-items:stretch;
        flex-direction:column;
    }

    .module-danger-zone .button {
        width:100%;
    }
}


/* Sichtbarer Asservaten-Löschbereich */
.evidence-delete-zone {
    border-top: 1px solid #efc9cd;
    border-bottom: 1px solid #efc9cd;
    background:
        linear-gradient(90deg, rgba(159, 45, 55, .06), rgba(159, 45, 55, .015)),
        #fffafa;
}

.evidence-delete-zone .button-danger {
    min-width: 210px;
}

.evidence-delete-permission-note {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 14px 22px;
    border-top: 1px solid #e7d79d;
    border-bottom: 1px solid #e7d79d;
    background: #fff9e8;
}

.evidence-delete-permission-note strong {
    color: #765a16;
}

.evidence-delete-permission-note span {
    color: #7e704a;
    font-size: .75rem;
}

.evidence-delete-permission-note code {
    padding: 2px 5px;
    border-radius: 5px;
    background: rgba(255, 255, 255, .72);
}

@media (max-width: 700px) {
    .evidence-delete-permission-note {
        align-items: flex-start;
        flex-direction: column;
        gap: 5px;
    }
}


/* Öffentlicher Strafenkatalog */
.penalty-public-hero {
    padding:80px clamp(22px,7vw,110px);
    color:#fff;
    background:
        linear-gradient(115deg,rgba(5,20,34,.98),rgba(12,49,78,.94)),
        radial-gradient(circle at 82% 20%,rgba(72,164,232,.22),transparent 24rem);
}

.penalty-public-hero h1 {
    margin:8px 0 10px;
    font-family:Georgia,"Times New Roman",serif;
    font-size:clamp(2.5rem,5vw,4.8rem);
}

.penalty-public-hero p {
    max-width:720px;
    margin:0;
    color:#b9cad8;
    font-size:1.05rem;
}

.penalty-public-section {
    padding:55px clamp(22px,7vw,110px) 75px;
    background:#edf2f6;
}

.penalty-public-notice {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    margin-bottom:17px;
    padding:15px 18px;
    border:1px solid #e7d79d;
    border-radius:12px;
    background:#fff9e8;
}

.penalty-public-notice strong {
    color:#765a16;
}

.penalty-public-notice span {
    color:#7e704a;
    font-size:.78rem;
}

.penalty-public-filter {
    display:grid;
    grid-template-columns:minmax(280px,1fr) 250px auto;
    gap:10px;
    margin-bottom:20px;
    padding:15px;
    border:1px solid var(--border);
    border-radius:14px;
    background:#fff;
}

.penalty-public-filter input,
.penalty-public-filter select {
    margin:0;
}

.penalty-public-grid {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:17px;
}

.penalty-public-card {
    overflow:hidden;
    padding:21px;
    border:1px solid var(--border);
    border-top:4px solid var(--blue);
    border-radius:15px;
    background:#fff;
    box-shadow:0 13px 34px rgba(18,41,64,.06);
}

.penalty-public-card header {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
}

.penalty-public-card header span {
    color:var(--muted);
    font-size:.65rem;
    font-weight:800;
    text-transform:uppercase;
}

.penalty-public-card header strong {
    color:#9c7725;
}

.penalty-public-card h2 {
    margin:13px 0 8px;
    font-family:Georgia,"Times New Roman",serif;
    font-size:1.32rem;
}

.penalty-public-card > p {
    min-height:75px;
    margin:0;
    color:var(--muted);
    font-size:.79rem;
}

.penalty-public-card dl {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:7px;
    margin:17px 0 0;
}

.penalty-public-card dl > div {
    padding:10px 7px;
    border-radius:9px;
    background:#f2f6f9;
    text-align:center;
}

.penalty-public-card dt,
.penalty-public-card dd {
    display:block;
}

.penalty-public-card dt {
    color:var(--muted);
    font-size:.57rem;
    text-transform:uppercase;
}

.penalty-public-card dd {
    margin:4px 0 0;
    font-size:.75rem;
    font-weight:850;
}

/* Strafenkatalog-Verwaltung */
.penalty-active-chip {
    display:inline-flex;
    padding:5px 8px;
    border-radius:999px;
    color:#687581;
    background:#e8edf1;
    font-size:.62rem;
    font-weight:850;
}

.penalty-active-chip.is-active {
    color:#0d744e;
    background:#dcf5ea;
}

/* Strafrechner */
.penalty-calculator-page {
    background:
        radial-gradient(circle at 100% 0%,rgba(30,105,168,.08),transparent 28rem),
        #edf2f6;
}

.penalty-calculator-layout {
    display:grid;
    grid-template-columns:minmax(0,1.4fr) minmax(340px,.6fr);
    align-items:start;
    gap:18px;
}

.penalty-selector-card,
.penalty-summary-card {
    overflow:hidden;
    border:1px solid var(--border);
    border-radius:17px;
    background:#fff;
    box-shadow:0 14px 38px rgba(18,41,64,.06);
}

.penalty-selector-toolbar {
    display:grid;
    grid-template-columns:1fr 230px;
    gap:10px;
    padding:16px;
    border-bottom:1px solid var(--border);
    background:#f7f9fb;
}

.penalty-selector-toolbar input,
.penalty-selector-toolbar select {
    margin:0;
}

.penalty-select-list {
    display:grid;
    max-height:720px;
    overflow-y:auto;
}

.penalty-select-row {
    display:grid;
    grid-template-columns:auto 64px 1fr auto;
    align-items:center;
    gap:12px;
    padding:14px 17px;
    border-bottom:1px solid var(--border);
    cursor:pointer;
    transition:.14s ease;
}

.penalty-select-row:hover {
    background:#f3f8fc;
}

.penalty-select-row:has(input:checked) {
    background:#eaf5fc;
    box-shadow:inset 4px 0 var(--blue);
}

.penalty-select-row input {
    width:17px;
    height:17px;
    margin:0;
}

.penalty-select-code {
    color:#9b7523;
    font-size:.75rem;
    font-weight:900;
}

.penalty-select-main strong,
.penalty-select-main small,
.penalty-select-values b,
.penalty-select-values small {
    display:block;
}

.penalty-select-main small,
.penalty-select-values small {
    color:var(--muted);
    font-size:.65rem;
}

.penalty-select-values {
    text-align:right;
}

.penalty-select-values b {
    color:#174e75;
    font-size:.75rem;
}

.penalty-summary-card {
    position:sticky;
    top:95px;
}

.penalty-summary-card > header {
    padding:21px 22px;
    color:#fff;
    background:linear-gradient(145deg,#0a2135,#154b72);
}

.penalty-summary-card h2 {
    margin:5px 0 0;
    font-family:Georgia,"Times New Roman",serif;
    font-size:1.6rem;
}

.penalty-total-grid {
    display:grid;
    grid-template-columns:1fr;
    gap:8px;
    padding:15px 17px;
    border-bottom:1px solid var(--border);
}

.penalty-total-grid article {
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:13px;
    border-radius:10px;
    background:#f2f6f9;
}

.penalty-total-grid span {
    color:var(--muted);
    font-size:.7rem;
}

.penalty-total-grid strong {
    color:#0b314e;
    font-size:1.06rem;
}

.penalty-selected-list {
    max-height:220px;
    overflow-y:auto;
    padding:7px 17px;
    border-bottom:1px solid var(--border);
}

.penalty-selected-list > div {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:9px 0;
    border-bottom:1px solid var(--border);
    font-size:.72rem;
}

.penalty-selected-list small {
    color:var(--muted);
    white-space:nowrap;
}

.penalty-summary-card form {
    padding:17px;
}

@media(max-width:1050px) {
    .penalty-public-grid {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .penalty-calculator-layout {
        grid-template-columns:1fr;
    }

    .penalty-summary-card {
        position:static;
    }
}

@media(max-width:700px) {
    .penalty-public-grid,
    .penalty-public-filter,
    .penalty-selector-toolbar {
        grid-template-columns:1fr;
    }

    .penalty-public-notice {
        align-items:flex-start;
        flex-direction:column;
    }

    .penalty-select-row {
        grid-template-columns:auto 55px 1fr;
    }

    .penalty-select-values {
        grid-column:2/-1;
        text-align:left;
    }
}


/* Benachrichtigungscenter */
.notification-nav-link{position:relative;display:inline-flex!important;align-items:center;justify-content:center;min-width:38px;font-size:1rem!important}.notification-nav-link span{position:absolute;top:-5px;right:-4px;display:grid;place-items:center;min-width:18px;height:18px;padding:0 4px;border:2px solid #071727;border-radius:999px;background:#b63b45;color:#fff;font-size:.55rem;font-weight:900}
.notification-page{background:radial-gradient(circle at 100% 0%,rgba(30,105,168,.08),transparent 28rem),#edf2f6}.notification-list{display:grid;gap:12px}.notification-card{display:grid;grid-template-columns:auto 1fr;gap:15px;padding:19px 21px;border:1px solid var(--border);border-left:4px solid var(--blue);border-radius:14px;background:#fff;box-shadow:0 10px 30px rgba(18,41,64,.05)}.notification-symbol{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:#eaf4fb;font-size:1.15rem}.notification-card span{color:var(--muted);font-size:.66rem}.notification-card h2{margin:4px 0 5px;font-family:Georgia,serif;font-size:1.15rem}.notification-card p{margin:0;color:#536676;font-size:.8rem;line-height:1.55}.notification-card a{display:inline-block;margin-top:9px;color:var(--blue);font-size:.72rem;font-weight:850}.notification-type-password,.notification-type-2fa,.notification-type-security{border-left-color:#9b7422}.notification-type-promotion{border-left-color:#16734f}.notification-type-demotion,.notification-type-suspension,.notification-type-termination{border-left-color:#a52f3a}


/* =========================================================
   Auszahlungsanträge
   ========================================================= */
.payout-layout {
    display:grid;
    grid-template-columns:350px minmax(0,1fr);
    align-items:start;
    gap:18px;
}

.payout-create-card {
    position:sticky;
    top:96px;
}

.payout-money-input {
    display:grid;
    grid-template-columns:44px 1fr;
    overflow:hidden;
    border:1px solid var(--border);
    border-radius:9px;
    background:#fff;
}

.payout-money-input span {
    display:grid;
    place-items:center;
    color:#fff;
    background:#123f60;
    font-weight:900;
}

.payout-money-input input {
    margin:0;
    border:0;
    border-radius:0;
}

.payout-account-note {
    display:grid;
    padding:13px;
    border:1px solid #cbd9e3;
    border-radius:10px;
    background:#eef6fb;
}

.payout-account-note strong {
    color:#174f76;
    font-size:.68rem;
    text-transform:uppercase;
}

.payout-account-note span {
    margin-top:4px;
    font-weight:850;
}

.payout-account-note small {
    margin-top:2px;
    color:var(--muted);
}

.payout-own-list {
    display:grid;
    gap:14px;
}

.payout-request-card {
    overflow:hidden;
    padding:20px;
    border:1px solid var(--border);
    border-left:5px solid #2f6f98;
    border-radius:15px;
    background:#fff;
    box-shadow:0 12px 32px rgba(18,41,64,.055);
}

.payout-request-card > header {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.payout-number {
    color:#94701f;
    font-size:.66rem;
    font-weight:900;
    letter-spacing:.04em;
}

.payout-request-card h2 {
    margin:4px 0 0;
    font-family:Georgia,"Times New Roman",serif;
    font-size:1.25rem;
}

.payout-card-amount {
    margin:15px 0 9px;
    color:#0f4b70;
    font-family:Georgia,"Times New Roman",serif;
    font-size:2rem;
    font-weight:900;
}

.payout-request-card > p {
    color:#536575;
    font-size:.8rem;
    line-height:1.65;
}

.payout-request-card dl,
.payout-review-content dl {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    margin:16px 0 0;
}

.payout-request-card dl > div,
.payout-review-content dl > div {
    padding:10px;
    border-radius:9px;
    background:#f3f6f8;
}

.payout-request-card dt,
.payout-review-content dt {
    color:var(--muted);
    font-size:.58rem;
    text-transform:uppercase;
}

.payout-request-card dd,
.payout-review-content dd {
    margin:4px 0 0;
    font-size:.74rem;
    font-weight:800;
}

.payout-status {
    display:inline-flex;
    align-items:center;
    padding:6px 9px;
    border-radius:999px;
    font-size:.62rem;
    font-weight:900;
    white-space:nowrap;
}

.payout-submitted {
    color:#815d13;
    background:#fff0bd;
}

.payout-approved {
    color:#1c5e88;
    background:#e1f1fb;
}

.payout-paid {
    color:#0d744e;
    background:#dcf5ea;
}

.payout-rejected {
    color:#96313a;
    background:#fbe5e7;
}

.payout-review-note {
    margin-top:14px;
    padding:13px;
    border-left:4px solid #d2ab4d;
    border-radius:8px;
    background:#fff9e9;
}

.payout-review-note strong {
    color:#765a16;
    font-size:.7rem;
}

.payout-review-note p {
    margin:5px 0 0;
    color:#6e6247;
    font-size:.75rem;
}

.payout-delete-form {
    margin-top:15px;
    padding-top:13px;
    border-top:1px solid var(--border);
}

.payout-stat-grid {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr)) minmax(220px,1.4fr);
    gap:10px;
    margin-bottom:17px;
}

.payout-stat-grid article {
    padding:16px;
    border:1px solid var(--border);
    border-radius:13px;
    background:#fff;
    box-shadow:0 9px 24px rgba(18,41,64,.04);
}

.payout-stat-grid span,
.payout-stat-grid strong {
    display:block;
}

.payout-stat-grid span {
    color:var(--muted);
    font-size:.64rem;
    font-weight:800;
    text-transform:uppercase;
}

.payout-stat-grid strong {
    margin-top:6px;
    color:#113f60;
    font-family:Georgia,"Times New Roman",serif;
    font-size:1.55rem;
}

.payout-stat-money {
    color:#fff;
    border-color:#123f60 !important;
    background:linear-gradient(145deg,#0a2135,#154b72) !important;
}

.payout-stat-money span {
    color:#b9ccda;
}

.payout-stat-money strong {
    color:#e4c36f;
}

.payout-management-layout {
    display:grid;
    grid-template-columns:minmax(0,1fr) 380px;
    align-items:start;
    gap:18px;
}

.payout-management-layout tr.is-selected {
    background:#edf7fd;
    box-shadow:inset 4px 0 #2d79a7;
}

.payout-review-card {
    position:sticky;
    top:94px;
    overflow:hidden;
    border:1px solid var(--border);
    border-radius:16px;
    background:#fff;
    box-shadow:0 14px 38px rgba(18,41,64,.065);
}

.payout-review-card > header {
    padding:20px;
    color:#fff;
    background:linear-gradient(145deg,#0a2135,#164d74);
}

.payout-review-card > header h2 {
    margin:4px 0 10px;
    font-family:Georgia,"Times New Roman",serif;
}

.payout-review-content {
    padding:19px;
}

.payout-review-amount {
    margin-bottom:14px;
    color:#0f4b70;
    font-family:Georgia,"Times New Roman",serif;
    font-size:2.15rem;
    font-weight:900;
}

.payout-review-content > section {
    margin-top:15px;
    padding-top:14px;
    border-top:1px solid var(--border);
}

.payout-review-content > section > strong {
    font-size:.74rem;
}

.payout-review-content > section > p {
    margin:6px 0 0;
    color:#526676;
    font-size:.78rem;
    line-height:1.6;
}

.payout-action-buttons {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:8px;
}

.payout-approved-notice,
.payout-finished-notice {
    margin:16px 0;
    padding:14px;
    border-radius:10px;
}

.payout-approved-notice {
    color:#285d80;
    background:#eaf5fb;
}

.payout-finished-notice {
    color:#526674;
    background:#f1f4f6;
}

.payout-approved-notice strong,
.payout-finished-notice strong {
    display:block;
}

.payout-approved-notice p,
.payout-finished-notice p {
    margin:5px 0 0;
    font-size:.75rem;
}

@media(max-width:1150px) {
    .payout-layout,
    .payout-management-layout {
        grid-template-columns:1fr;
    }

    .payout-create-card,
    .payout-review-card {
        position:static;
    }

    .payout-stat-grid {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media(max-width:650px) {
    .payout-stat-grid,
    .payout-request-card dl,
    .payout-review-content dl,
    .payout-action-buttons {
        grid-template-columns:1fr;
    }

    .payout-request-card > header {
        flex-direction:column;
    }
}


/* =========================================================
   Abmeldungs- und Abwesenheitssystem
   ========================================================= */
.absence-layout {
    display:grid;
    grid-template-columns:360px minmax(0,1fr);
    align-items:start;
    gap:18px;
}

.absence-create-card {
    position:sticky;
    top:96px;
}

.absence-date-grid {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
}

.absence-account-note {
    display:grid;
    padding:13px;
    border:1px solid #cbd9e3;
    border-radius:10px;
    background:#eef6fb;
}

.absence-account-note strong {
    color:#174f76;
    font-size:.68rem;
    text-transform:uppercase;
}

.absence-account-note span {
    margin-top:4px;
    font-weight:850;
}

.absence-account-note small {
    margin-top:2px;
    color:var(--muted);
}

.absence-own-list {
    display:grid;
    gap:14px;
}

.absence-request-card {
    overflow:hidden;
    padding:20px;
    border:1px solid var(--border);
    border-left:5px solid #386f98;
    border-radius:15px;
    background:#fff;
    box-shadow:0 12px 32px rgba(18,41,64,.055);
}

.absence-request-card > header {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.absence-number {
    color:#94701f;
    font-size:.66rem;
    font-weight:900;
    letter-spacing:.04em;
}

.absence-request-card h2 {
    margin:4px 0 0;
    font-family:Georgia,"Times New Roman",serif;
    font-size:1.25rem;
}

.absence-period {
    margin:15px 0 9px;
    color:#0f4b70;
    font-family:Georgia,"Times New Roman",serif;
    font-size:1.5rem;
    font-weight:900;
}

.absence-request-card > p {
    color:#536575;
    font-size:.8rem;
    line-height:1.65;
}

.absence-request-card dl,
.absence-review-content dl {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    margin:16px 0 0;
}

.absence-request-card dl > div,
.absence-review-content dl > div {
    padding:10px;
    border-radius:9px;
    background:#f3f6f8;
}

.absence-request-card dt,
.absence-review-content dt {
    color:var(--muted);
    font-size:.58rem;
    text-transform:uppercase;
}

.absence-request-card dd,
.absence-review-content dd {
    margin:4px 0 0;
    font-size:.74rem;
    font-weight:800;
}

.absence-status {
    display:inline-flex;
    align-items:center;
    padding:6px 9px;
    border-radius:999px;
    font-size:.62rem;
    font-weight:900;
    white-space:nowrap;
}

.absence-submitted {
    color:#815d13;
    background:#fff0bd;
}

.absence-approved {
    color:#1c5e88;
    background:#e1f1fb;
}

.absence-rejected {
    color:#96313a;
    background:#fbe5e7;
}

.absence-ended {
    color:#596977;
    background:#e8edf1;
}

.absence-review-note {
    margin-top:14px;
    padding:13px;
    border-left:4px solid #d2ab4d;
    border-radius:8px;
    background:#fff9e9;
}

.absence-review-note strong {
    color:#765a16;
    font-size:.7rem;
}

.absence-review-note p {
    margin:5px 0 0;
    color:#6e6247;
    font-size:.75rem;
}

.absence-delete-form {
    margin-top:15px;
    padding-top:13px;
    border-top:1px solid var(--border);
}

.absence-stat-grid {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:10px;
    margin-bottom:17px;
}

.absence-stat-grid article {
    padding:16px;
    border:1px solid var(--border);
    border-radius:13px;
    background:#fff;
    box-shadow:0 9px 24px rgba(18,41,64,.04);
}

.absence-stat-grid span,
.absence-stat-grid strong {
    display:block;
}

.absence-stat-grid span {
    color:var(--muted);
    font-size:.64rem;
    font-weight:800;
    text-transform:uppercase;
}

.absence-stat-grid strong {
    margin-top:6px;
    color:#113f60;
    font-family:Georgia,"Times New Roman",serif;
    font-size:1.55rem;
}

.absence-management-layout {
    display:grid;
    grid-template-columns:minmax(0,1fr) 390px;
    align-items:start;
    gap:18px;
}

.absence-management-layout tr.is-selected {
    background:#edf7fd;
    box-shadow:inset 4px 0 #2d79a7;
}

.absence-review-card {
    position:sticky;
    top:94px;
    overflow:hidden;
    border:1px solid var(--border);
    border-radius:16px;
    background:#fff;
    box-shadow:0 14px 38px rgba(18,41,64,.065);
}

.absence-review-card > header {
    padding:20px;
    color:#fff;
    background:linear-gradient(145deg,#0a2135,#164d74);
}

.absence-review-card > header h2 {
    margin:4px 0 10px;
    font-family:Georgia,"Times New Roman",serif;
}

.absence-review-content {
    padding:19px;
}

.absence-review-period {
    margin-bottom:14px;
    color:#0f4b70;
    font-family:Georgia,"Times New Roman",serif;
    font-size:1.55rem;
    font-weight:900;
}

.absence-review-content > section {
    margin-top:15px;
    padding-top:14px;
    border-top:1px solid var(--border);
}

.absence-review-content > section > strong {
    font-size:.74rem;
}

.absence-review-content > section > p {
    margin:6px 0 0;
    color:#526676;
    font-size:.78rem;
    line-height:1.6;
}

.absence-period-form {
    margin-top:16px;
    padding-top:16px;
    border-top:1px solid var(--border);
}

.absence-action-buttons {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:8px;
}

.absence-approved-notice,
.absence-finished-notice {
    margin:16px 0;
    padding:14px;
    border-radius:10px;
}

.absence-approved-notice {
    color:#285d80;
    background:#eaf5fb;
}

.absence-finished-notice {
    color:#526674;
    background:#f1f4f6;
}

.absence-approved-notice strong,
.absence-finished-notice strong {
    display:block;
}

.absence-approved-notice p,
.absence-finished-notice p {
    margin:5px 0 0;
    font-size:.75rem;
}

.current-absence-list {
    display:grid;
}

.current-absence-row {
    display:grid;
    grid-template-columns:auto 1fr auto;
    align-items:center;
    gap:11px;
    padding:12px 0;
    border-bottom:1px solid var(--border);
}

.current-absence-row strong,
.current-absence-row small {
    display:block;
}

.current-absence-row small {
    color:var(--muted);
    font-size:.67rem;
}

.current-absence-row > span:last-child {
    color:#2b668c;
    font-size:.68rem;
    font-weight:800;
}

@media(max-width:1150px) {
    .absence-layout,
    .absence-management-layout {
        grid-template-columns:1fr;
    }

    .absence-create-card,
    .absence-review-card {
        position:static;
    }

    .absence-stat-grid {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media(max-width:650px) {
    .absence-date-grid,
    .absence-stat-grid,
    .absence-request-card dl,
    .absence-review-content dl,
    .absence-action-buttons {
        grid-template-columns:1fr;
    }

    .absence-request-card > header {
        flex-direction:column;
    }

    .current-absence-row {
        grid-template-columns:auto 1fr;
    }

    .current-absence-row > span:last-child {
        grid-column:2;
    }
}


/* Mitarbeiter-E-Mail und Benachrichtigungsstatus */
.staff-email-field {
    padding:14px;
    border:1px solid #c7d8e4;
    border-radius:11px;
    background:#f1f8fc;
}

.staff-email-field > span {
    color:#164f75;
    font-weight:850;
}

.staff-email-field small {
    color:#5e7484;
    line-height:1.5;
}


/* =========================================================
   Legal Center and cookie information
   ========================================================= */
.footer { gap:22px; flex-wrap:wrap; }
.footer-legal { display:flex; flex-wrap:wrap; justify-content:center; gap:7px 14px; }
.footer-legal a { color:#cbd8e2; font-size:.7rem; text-decoration:none; }
.footer-legal a:hover { color:#fff; text-decoration:underline; }
.legal-page main { background:#eef2f5; }
.legal-shell { width:min(1180px,calc(100% - 36px)); margin:0 auto; }
.legal-hero { padding:62px 0 48px; color:#fff; background:linear-gradient(135deg,#071827 0%,#103d5e 68%,#1b5d86 100%); border-bottom:4px solid #c7a44f; }
.legal-hero h1 { margin:7px 0 8px; font:900 clamp(2rem,5vw,3.65rem)/1 Georgia,"Times New Roman",serif; }
.legal-hero p { max-width:710px; margin:0; color:#d7e3eb; }
.legal-layout { display:grid; grid-template-columns:minmax(0,1fr) 290px; align-items:start; gap:22px; padding:30px 0 55px; }
.legal-document { padding:clamp(23px,4vw,46px); border:1px solid #d5dee5; border-radius:17px; background:#fff; box-shadow:0 18px 45px rgba(12,37,58,.07); }
.legal-document h2 { margin:31px 0 10px; color:#113e5e; font:850 1.25rem/1.25 Georgia,"Times New Roman",serif; }
.legal-document h2:first-of-type { margin-top:18px; }
.legal-document p,.legal-document li,.legal-document address { color:#4c6070; font-size:.84rem; line-height:1.75; }
.legal-document a { color:#166792; font-weight:750; }
.legal-document code { padding:2px 5px; border-radius:4px; background:#edf2f5; }
.legal-document ul { padding-left:21px; }
.legal-address { padding:15px 17px; border-left:4px solid #2a779f; border-radius:8px; background:#f2f8fb; font-style:normal; }
.legal-facts { display:grid; gap:8px; }
.legal-facts div { display:grid; grid-template-columns:110px 1fr; gap:10px; padding:11px 13px; border-radius:8px; background:#f3f6f8; }
.legal-facts dt { color:#6b7c89; font-size:.68rem; text-transform:uppercase; }
.legal-facts dd { margin:0; font-size:.8rem; font-weight:800; }
.legal-alert { padding:15px 17px; border:1px solid; border-radius:10px; }
.legal-alert strong { display:block; margin-bottom:4px; }
.legal-alert p { margin:0; }
.legal-alert-warning { border-color:#e7cf89; background:#fff9e8; }
.legal-alert-info { border-color:#bdd9e9; background:#edf8fd; }
.legal-alert-success { border-color:#b9ddce; background:#edf9f4; }
.legal-updated { margin-top:36px!important; padding-top:15px; border-top:1px solid #dde4e9; color:#778896!important; font-size:.72rem!important; }
.legal-side-nav { position:sticky; top:92px; display:grid; gap:6px; padding:20px; border:1px solid #d5dee5; border-radius:14px; background:#fff; box-shadow:0 13px 35px rgba(12,37,58,.055); }
.legal-side-nav h2 { margin:2px 0 10px; color:#123f5f; font-family:Georgia,"Times New Roman",serif; }
.legal-side-nav > a { display:flex; justify-content:space-between; gap:10px; padding:11px 12px; border-radius:8px; color:#334f62; background:#f3f6f8; font-size:.75rem; font-weight:850; text-decoration:none; }
.legal-side-nav > a:hover { color:#fff; background:#164f75; }
.legal-side-note { margin-top:10px; padding:13px; border-radius:9px; color:#725a1f; background:#fff7df; }
.legal-side-note p { margin:4px 0 0; font-size:.69rem; line-height:1.5; }
.legal-cookie-table { display:grid; gap:9px; }
.legal-cookie-table > div { display:grid; gap:4px; padding:14px; border:1px solid #dce4e9; border-radius:9px; }
.legal-cookie-table strong { color:#143f5c; }
.legal-cookie-table span { color:#647786; font-size:.75rem; }
.cookie-notice[hidden] { display:none!important; }
.cookie-notice { position:fixed; z-index:9999; right:18px; bottom:18px; left:18px; display:flex; align-items:center; justify-content:space-between; gap:20px; width:min(860px,calc(100% - 36px)); margin:auto; padding:17px 19px; border:1px solid rgba(216,180,91,.65); border-radius:13px; color:#fff; background:rgba(7,24,39,.97); box-shadow:0 18px 60px rgba(0,0,0,.32); backdrop-filter:blur(8px); }
.cookie-notice strong { display:block; margin-bottom:3px; }
.cookie-notice p { margin:0; color:#d5e0e8; font-size:.72rem; line-height:1.5; }
.cookie-notice a { color:#f2d78d; }
.cookie-notice button { flex:0 0 auto; }
@media(max-width:900px){.legal-layout{grid-template-columns:1fr}.legal-side-nav{position:static;order:-1}.cookie-notice{align-items:stretch;flex-direction:column}.cookie-notice button{width:100%}}
@media(max-width:620px){.legal-shell{width:min(100% - 22px,1180px)}.legal-hero{padding:45px 0 36px}.legal-document{padding:20px}.legal-facts div{grid-template-columns:1fr}.footer-legal{width:100%}}


/* ===== Theme system: Light / Dark / System ===== */
:root { color-scheme: light; --overlay: rgba(255,255,255,.72); --field:#fff; --panel:#fff; --panel-2:#f7f9fb; }
:root[data-theme="dark"] {
    color-scheme: dark;
    --navy:#050e17;
    --navy-2:#0b2135;
    --blue:#398fd0;
    --blue-light:#69b8ee;
    --gold:#e0bf67;
    --surface:#101a24;
    --surface-soft:#08111a;
    --text:#e8f0f6;
    --muted:#9aabba;
    --border:#263644;
    --success:#35b884;
    --danger:#e05d66;
    --warning:#dca640;
    --shadow:0 18px 50px rgba(0,0,0,.38);
    --overlay:rgba(11,22,32,.82);
    --field:#0b1620;
    --panel:#101a24;
    --panel-2:#0c151e;
}

.topbar-actions{display:flex;align-items:center;margin-left:auto;margin-right:18px}.theme-switcher{position:relative}.theme-toggle{display:inline-flex;align-items:center;gap:7px;min-height:38px;padding:0 12px;border:1px solid rgba(255,255,255,.16);border-radius:9px;color:#e8f2f9;background:rgba(255,255,255,.07);cursor:pointer;font-weight:700;font-size:.8rem}.theme-toggle:hover{background:rgba(255,255,255,.13)}.theme-menu{position:absolute;right:0;top:46px;z-index:80;width:168px;padding:7px;border:1px solid var(--border);border-radius:12px;background:var(--surface);box-shadow:var(--shadow)}.theme-menu button{display:flex;align-items:center;gap:9px;width:100%;padding:10px;border:0;border-radius:8px;color:var(--text);background:transparent;text-align:left;cursor:pointer}.theme-menu button:hover,.theme-menu button.active{background:var(--surface-soft);color:var(--blue-light)}

:root[data-theme="dark"] body{background:var(--surface-soft);color:var(--text)}
:root[data-theme="dark"] .topbar{background:rgba(5,14,23,.96)}
:root[data-theme="dark"] .service-card,
:root[data-theme="dark"] .ticket-form,
:root[data-theme="dark"] .success-page,
:root[data-theme="dark"] .auth-card,
:root[data-theme="dark"] .card,
:root[data-theme="dark"] .panel,
:root[data-theme="dark"] .stat-card,
:root[data-theme="dark"] .details-card,
:root[data-theme="dark"] .action-card,
:root[data-theme="dark"] .legal-card,
:root[data-theme="dark"] .cookie-notice{background:var(--surface)!important;color:var(--text);border-color:var(--border)}
:root[data-theme="dark"] .split-section,
:root[data-theme="dark"] .form-submit,
:root[data-theme="dark"] .reply-form,
:root[data-theme="dark"] .staff-message,
:root[data-theme="dark"] .reference-box,
:root[data-theme="dark"] .table-wrap,
:root[data-theme="dark"] .integration-list,
:root[data-theme="dark"] .dashboard-content{background:var(--surface-soft)!important}
:root[data-theme="dark"] input,
:root[data-theme="dark"] textarea,
:root[data-theme="dark"] select{color:var(--text);background:var(--field);border-color:var(--border)}
:root[data-theme="dark"] input::placeholder,
:root[data-theme="dark"] textarea::placeholder{color:#718392}
:root[data-theme="dark"] .form-grid label,
:root[data-theme="dark"] .stack-form label{color:#c5d1da}
:root[data-theme="dark"] .button-ghost{color:var(--text);background:var(--surface);border-color:var(--border)}
:root[data-theme="dark"] .category-option.selected{background:#10283a}
:root[data-theme="dark"] .service-icon{background:#102b3e}
:root[data-theme="dark"] table,
:root[data-theme="dark"] th,
:root[data-theme="dark"] td{border-color:var(--border)}
:root[data-theme="dark"] th{background:#0b1620;color:#cbd7e0}
:root[data-theme="dark"] tr:hover td{background:#101f2b}
:root[data-theme="dark"] .status-open{color:#63d9ac;background:#12372b}
:root[data-theme="dark"] .status-claimed{color:#f0c66a;background:#3c2d10}
:root[data-theme="dark"] .status-closed{color:#b2c0cb;background:#25313b}
:root[data-theme="dark"] .flash-success{background:#12372b;color:#8be2c0;border-color:#245d49}
:root[data-theme="dark"] .flash-error{background:#3a191d;color:#ffafb5;border-color:#713138}
:root[data-theme="dark"] .footer{background:#050e17;color:#c6d3dc}
:root[data-theme="dark"] a.card-link,
:root[data-theme="dark"] .back-link{color:var(--blue-light)}

@media(max-width:980px){.topbar-actions{margin-left:auto;margin-right:8px}.theme-toggle [data-theme-label]{display:none}.theme-menu{right:0}.nav.open{z-index:70}}

/* ===== Dark Mode Complete Fix: all portal modules ===== */
:root[data-theme="dark"] .dashboard-content,
:root[data-theme="dark"] .notification-page,
:root[data-theme="dark"] .departments-page,
:root[data-theme="dark"] .documents-page,
:root[data-theme="dark"] .module-page,
:root[data-theme="dark"] .payout-page,
:root[data-theme="dark"] .payout-management-page,
:root[data-theme="dark"] .absence-page,
:root[data-theme="dark"] .absence-management-page {
    background: radial-gradient(circle at 100% 0%,rgba(57,143,208,.08),transparent 30rem),var(--surface-soft)!important;
    color:var(--text);
}

:root[data-theme="dark"] .personnel-card,
:root[data-theme="dark"] .department-card,
:root[data-theme="dark"] .department-form-card,
:root[data-theme="dark"] .contract-overview-card,
:root[data-theme="dark"] .document-list-card,
:root[data-theme="dark"] .document-editor-card,
:root[data-theme="dark"] .document-empty-card,
:root[data-theme="dark"] .notification-card,
:root[data-theme="dark"] .module-form-card,
:root[data-theme="dark"] .module-table-card,
:root[data-theme="dark"] .download-card,
:root[data-theme="dark"] .payout-request-card,
:root[data-theme="dark"] .payout-review-card,
:root[data-theme="dark"] .absence-request-card,
:root[data-theme="dark"] .absence-review-card,
:root[data-theme="dark"] .module-empty,
:root[data-theme="dark"] .empty-state,
:root[data-theme="dark"] .department-empty,
:root[data-theme="dark"] .empty {
    color:var(--text)!important;
    background:var(--surface)!important;
    border-color:var(--border)!important;
    box-shadow:0 14px 38px rgba(0,0,0,.28)!important;
}

:root[data-theme="dark"] .department-card footer,
:root[data-theme="dark"] .department-form-card > header,
:root[data-theme="dark"] .contract-overview-head,
:root[data-theme="dark"] .document-download-row,
:root[data-theme="dark"] .module-form-card > header,
:root[data-theme="dark"] .payout-request-card > header,
:root[data-theme="dark"] .payout-review-card > header,
:root[data-theme="dark"] .absence-request-card > header,
:root[data-theme="dark"] .absence-review-card > header {
    color:var(--text)!important;
    background:var(--panel-2)!important;
    border-color:var(--border)!important;
}

:root[data-theme="dark"] .dashboard-heading h1,
:root[data-theme="dark"] .departments-header h1,
:root[data-theme="dark"] .documents-header h1,
:root[data-theme="dark"] .module-header h1,
:root[data-theme="dark"] .personnel-card h2,
:root[data-theme="dark"] .department-card h2,
:root[data-theme="dark"] .department-form-card h2,
:root[data-theme="dark"] .contract-overview-card h2,
:root[data-theme="dark"] .notification-card h2,
:root[data-theme="dark"] .module-form-card h2,
:root[data-theme="dark"] .payout-request-card h2,
:root[data-theme="dark"] .payout-review-card h2,
:root[data-theme="dark"] .absence-request-card h2,
:root[data-theme="dark"] .absence-review-card h2 {
    color:var(--text)!important;
}

:root[data-theme="dark"] .dashboard-heading p,
:root[data-theme="dark"] .departments-header p,
:root[data-theme="dark"] .documents-header p,
:root[data-theme="dark"] .module-header p,
:root[data-theme="dark"] .department-description,
:root[data-theme="dark"] .notification-card p,
:root[data-theme="dark"] .payout-request-card > p,
:root[data-theme="dark"] .payout-review-note,
:root[data-theme="dark"] .absence-request-card > p,
:root[data-theme="dark"] .absence-review-note,
:root[data-theme="dark"] .payout-review-content > section > p,
:root[data-theme="dark"] .absence-review-content > section > p {
    color:var(--muted)!important;
}

:root[data-theme="dark"] .notification-symbol,
:root[data-theme="dark"] .document-icon,
:root[data-theme="dark"] .department-logo,
:root[data-theme="dark"] .current-logo-preview {
    color:var(--blue-light)!important;
    background:#102b3e!important;
    border-color:var(--border)!important;
}

:root[data-theme="dark"] .document-download-row:nth-child(even),
:root[data-theme="dark"] .payout-request-card dl > div,
:root[data-theme="dark"] .absence-request-card dl > div,
:root[data-theme="dark"] .payout-review-content dl > div,
:root[data-theme="dark"] .absence-review-content dl > div,
:root[data-theme="dark"] .contract-summary-grid > div,
:root[data-theme="dark"] .department-stats > div,
:root[data-theme="dark"] .payout-stat-grid > div,
:root[data-theme="dark"] .absence-stat-grid > div {
    background:var(--panel-2)!important;
    border-color:var(--border)!important;
    color:var(--text)!important;
}

:root[data-theme="dark"] .payout-account-note,
:root[data-theme="dark"] .absence-account-note,
:root[data-theme="dark"] .staff-email-field {
    color:#b9d9ed!important;
    background:#0e293a!important;
    border-color:#28506a!important;
}
:root[data-theme="dark"] .payout-account-note span,
:root[data-theme="dark"] .payout-account-note small,
:root[data-theme="dark"] .absence-account-note span,
:root[data-theme="dark"] .absence-account-note small,
:root[data-theme="dark"] .staff-email-field small { color:#9eb4c3!important; }
:root[data-theme="dark"] .staff-email-field > span { color:#71bce9!important; }

:root[data-theme="dark"] .payout-approved-notice,
:root[data-theme="dark"] .absence-approved-notice {
    color:#8cd8f2!important;
    background:#103044!important;
    border:1px solid #285b76!important;
}
:root[data-theme="dark"] .payout-finished-notice,
:root[data-theme="dark"] .absence-finished-notice {
    color:#b2c2ce!important;
    background:#202c36!important;
    border:1px solid #394957!important;
}

:root[data-theme="dark"] .download-category-tabs a {
    color:#b7c7d3!important;
    background:var(--surface)!important;
    border-color:var(--border)!important;
}
:root[data-theme="dark"] .download-category-tabs a.active,
:root[data-theme="dark"] .download-category-tabs a:hover {
    color:#fff!important;
    background:var(--blue)!important;
    border-color:var(--blue)!important;
}

:root[data-theme="dark"] .roster-edit-button,
:root[data-theme="dark"] .department-delete-form,
:root[data-theme="dark"] .payout-delete-form,
:root[data-theme="dark"] .absence-delete-form {
    border-color:var(--border)!important;
}

:root[data-theme="dark"] .table-wrap,
:root[data-theme="dark"] .module-table-card table { background:var(--surface)!important; }
:root[data-theme="dark"] tbody td { color:#d6e0e7!important; background:var(--surface)!important; }
:root[data-theme="dark"] tbody tr:nth-child(even) td { background:var(--panel-2)!important; }
:root[data-theme="dark"] tbody tr:hover td { background:#132534!important; }

:root[data-theme="dark"] hr,
:root[data-theme="dark"] dl > div,
:root[data-theme="dark"] .payout-period-form,
:root[data-theme="dark"] .absence-period-form { border-color:var(--border)!important; }

:root[data-theme="dark"] .payout-status,
:root[data-theme="dark"] .absence-status,
:root[data-theme="dark"] .document-status { border-color:rgba(255,255,255,.1)!important; }
:root[data-theme="dark"] .payout-submitted,
:root[data-theme="dark"] .absence-submitted { color:#f0c66a!important;background:#3c2d10!important; }
:root[data-theme="dark"] .payout-approved,
:root[data-theme="dark"] .absence-approved { color:#63d9ac!important;background:#12372b!important; }
:root[data-theme="dark"] .payout-paid,
:root[data-theme="dark"] .absence-ended { color:#8ccff5!important;background:#123049!important; }
:root[data-theme="dark"] .payout-rejected,
:root[data-theme="dark"] .absence-rejected { color:#ffabb2!important;background:#3a191d!important; }

:root[data-theme="dark"] .button:not(.button-primary):not(.button-danger),
:root[data-theme="dark"] button:not(.theme-toggle):not(.button-primary):not(.button-danger) {
    border-color:var(--border);
}

/* =====================================================================
   DARK MODE V3 – vollständiger Modul- und Mitarbeiterlisten-Fix
   ===================================================================== */
:root[data-theme="dark"] .roster-page {
    background:
        radial-gradient(circle at 85% 0%, rgba(36,113,178,.12), transparent 34rem),
        #07111b !important;
    color:#eaf2f8 !important;
}

:root[data-theme="dark"] .roster-header h1,
:root[data-theme="dark"] .roster-stat-grid strong,
:root[data-theme="dark"] .roster-person strong {
    color:#f4f8fb !important;
}

:root[data-theme="dark"] .roster-header p,
:root[data-theme="dark"] .roster-stat-grid span,
:root[data-theme="dark"] .roster-stat-grid small,
:root[data-theme="dark"] .roster-person small {
    color:#91a7b8 !important;
}

:root[data-theme="dark"] .roster-stat-grid article {
    position:relative;
    overflow:hidden;
    background:linear-gradient(145deg,#111e2b,#0c1722) !important;
    border:1px solid #273949 !important;
    box-shadow:0 15px 36px rgba(0,0,0,.24) !important;
}

:root[data-theme="dark"] .roster-stat-grid article::after {
    content:"";
    position:absolute;
    inset:auto -35px -55px auto;
    width:120px;
    height:120px;
    border-radius:50%;
    background:rgba(55,151,220,.08);
    pointer-events:none;
}

:root[data-theme="dark"] .roster-filter {
    background:linear-gradient(145deg,#101c28,#0c1721) !important;
    border:1px solid #293b4b !important;
    box-shadow:0 15px 36px rgba(0,0,0,.22) !important;
}

:root[data-theme="dark"] .roster-filter input,
:root[data-theme="dark"] .roster-filter select {
    color:#eef5fa !important;
    background:#07131e !important;
    border:1px solid #2c4051 !important;
    box-shadow:none !important;
}

:root[data-theme="dark"] .roster-filter input:focus,
:root[data-theme="dark"] .roster-filter select:focus {
    border-color:#3d94d0 !important;
    box-shadow:0 0 0 3px rgba(61,148,208,.14) !important;
}

:root[data-theme="dark"] .roster-filter input::placeholder {
    color:#6f8799 !important;
}

:root[data-theme="dark"] .roster-filter select option {
    color:#edf5fa;
    background:#0a1722;
}

:root[data-theme="dark"] .roster-table-card {
    background:#0c1722 !important;
    border:1px solid #293b4b !important;
    box-shadow:0 18px 44px rgba(0,0,0,.28) !important;
}

:root[data-theme="dark"] .roster-table {
    color:#dce7ee !important;
    background:#0c1722 !important;
}

:root[data-theme="dark"] .roster-table thead,
:root[data-theme="dark"] .roster-table th {
    color:#9fb3c1 !important;
    background:#101e2a !important;
    border-color:#293b4b !important;
}

:root[data-theme="dark"] .roster-table td {
    color:#dce7ee !important;
    background:#0c1722 !important;
    border-color:#223443 !important;
}

:root[data-theme="dark"] .roster-table tbody tr:nth-child(even) td {
    background:#0f1b27 !important;
}

:root[data-theme="dark"] .roster-table tbody tr:hover td {
    background:#132536 !important;
}

:root[data-theme="dark"] .service-number,
:root[data-theme="dark"] .callsign-chip,
:root[data-theme="dark"] .duty-chip,
:root[data-theme="dark"] .employment-chip {
    border-color:rgba(255,255,255,.1) !important;
}

:root[data-theme="dark"] .service-number,
:root[data-theme="dark"] .callsign-chip {
    color:#b9d8ec !important;
    background:#102a3d !important;
}

:root[data-theme="dark"] .duty-chip {
    color:#a9bac6 !important;
    background:#202d38 !important;
}

:root[data-theme="dark"] .duty-chip.is-on {
    color:#76e1b4 !important;
    background:#103628 !important;
}

:root[data-theme="dark"] .employment-active {
    color:#70dfae !important;
    background:#103628 !important;
}

:root[data-theme="dark"] .employment-leave {
    color:#f0ca76 !important;
    background:#3b2d11 !important;
}

:root[data-theme="dark"] .employment-suspended {
    color:#ff9fa8 !important;
    background:#3a191f !important;
}

:root[data-theme="dark"] .employment-inactive {
    color:#b5c3cd !important;
    background:#26323d !important;
}

:root[data-theme="dark"] .roster-avatar {
    color:#d8efff !important;
    background:linear-gradient(145deg,#1a5d8d,#10334d) !important;
    border-color:#377ba8 !important;
}

:root[data-theme="dark"] .roster-edit-button {
    color:#eef7fd !important;
    background:#155f99 !important;
    border-color:#287db7 !important;
}

:root[data-theme="dark"] .roster-edit-button:hover {
    background:#1f78b7 !important;
}

/* Generischer Schutz gegen fest codierte helle Modul-Flächen */
:root[data-theme="dark"] .dashboard-content > section,
:root[data-theme="dark"] .dashboard-content > article,
:root[data-theme="dark"] .dashboard-content > form:not(.roster-filter),
:root[data-theme="dark"] .content-card,
:root[data-theme="dark"] .list-card,
:root[data-theme="dark"] .summary-card,
:root[data-theme="dark"] .filter-card,
:root[data-theme="dark"] .management-card,
:root[data-theme="dark"] .contract-card,
:root[data-theme="dark"] .absence-card,
:root[data-theme="dark"] .payout-card {
    border-color:var(--border) !important;
}

:root[data-theme="dark"] .dashboard-content table {
    color:#dce7ee !important;
    background:#0c1722 !important;
}

:root[data-theme="dark"] .dashboard-content table thead th {
    color:#a9bbc8 !important;
    background:#101e2a !important;
}

:root[data-theme="dark"] .dashboard-content table tbody td {
    color:#dce7ee !important;
    background:#0c1722 !important;
}

:root[data-theme="dark"] .dashboard-content table tbody tr:nth-child(even) td {
    background:#0f1b27 !important;
}

:root[data-theme="dark"] .dashboard-content table tbody tr:hover td {
    background:#132536 !important;
}

:root[data-theme="dark"] .dashboard-content input,
:root[data-theme="dark"] .dashboard-content select,
:root[data-theme="dark"] .dashboard-content textarea {
    color:#edf5fa !important;
    background:#07131e !important;
    border-color:#2c4051 !important;
}

:root[data-theme="dark"] .dashboard-content input::placeholder,
:root[data-theme="dark"] .dashboard-content textarea::placeholder {
    color:#6f8799 !important;
}

:root[data-theme="dark"] .dashboard-content select option {
    color:#edf5fa !important;
    background:#0a1722 !important;
}

/* Helle Inline- oder Spezialkarten zuverlässig überschreiben */
:root[data-theme="dark"] .roster-page [style*="background:#fff"],
:root[data-theme="dark"] .roster-page [style*="background: #fff"],
:root[data-theme="dark"] .roster-page [style*="background:white"],
:root[data-theme="dark"] .roster-page [style*="background: white"] {
    background:#0f1b27 !important;
    color:#e8f0f6 !important;
    border-color:#293b4b !important;
}

/* =========================================================
   DARK MODE V4 – Mitarbeiterverwaltung kompletter Full Fix
   ========================================================= */
:root[data-theme="dark"] .staff-page {
    background:
        radial-gradient(circle at 100% 0%, rgba(36,129,199,.12), transparent 32rem),
        var(--page-bg, #07131f) !important;
    color:#e8f1f7 !important;
}

:root[data-theme="dark"] .staff-page-header h1,
:root[data-theme="dark"] .staff-card-header h2,
:root[data-theme="dark"] .staff-list-header h2,
:root[data-theme="dark"] .staff-security-card h3 {
    color:#eef6fb !important;
}

:root[data-theme="dark"] .staff-page-header p,
:root[data-theme="dark"] .staff-section-heading small,
:root[data-theme="dark"] .staff-field-grid label > small,
:root[data-theme="dark"] .staff-account-main small,
:root[data-theme="dark"] .staff-account-side small,
:root[data-theme="dark"] .permission-switch-content small {
    color:#8fa9bb !important;
}

:root[data-theme="dark"] .staff-form-card,
:root[data-theme="dark"] .staff-list-card {
    border-color:#263b4b !important;
    background:linear-gradient(145deg,#0e1d2a,#0a1722) !important;
    box-shadow:0 18px 50px rgba(0,0,0,.30) !important;
}

:root[data-theme="dark"] .staff-card-header,
:root[data-theme="dark"] .staff-list-header,
:root[data-theme="dark"] .staff-form-section,
:root[data-theme="dark"] .staff-search-wrap,
:root[data-theme="dark"] .staff-account-card {
    border-color:#263b4b !important;
}

:root[data-theme="dark"] .staff-card-header,
:root[data-theme="dark"] .staff-list-header {
    background:linear-gradient(180deg,#102131,#0d1b28) !important;
}

:root[data-theme="dark"] .staff-form-section {
    background:transparent !important;
}

:root[data-theme="dark"] .staff-section-heading > span {
    color:#eaf5fc !important;
    background:linear-gradient(145deg,#1677c8,#0b4c82) !important;
    box-shadow:0 5px 14px rgba(15,112,190,.25) !important;
}

:root[data-theme="dark"] .staff-field-grid label > span,
:root[data-theme="dark"] .staff-password-row label > span,
:root[data-theme="dark"] .permission-switch-content strong,
:root[data-theme="dark"] .staff-account-main strong,
:root[data-theme="dark"] .staff-delete-row strong {
    color:#dceaf3 !important;
}

:root[data-theme="dark"] .staff-field-grid input,
:root[data-theme="dark"] .staff-field-grid select,
:root[data-theme="dark"] .staff-password-row input,
:root[data-theme="dark"] .staff-search-wrap input,
:root[data-theme="dark"] .staff-modern-form input,
:root[data-theme="dark"] .staff-modern-form select,
:root[data-theme="dark"] .staff-modern-form textarea {
    color:#e7f1f7 !important;
    caret-color:#56b5f3 !important;
    border-color:#314b5e !important;
    background:#071622 !important;
    box-shadow:inset 0 1px 2px rgba(0,0,0,.22) !important;
}

:root[data-theme="dark"] .staff-field-grid input:focus,
:root[data-theme="dark"] .staff-field-grid select:focus,
:root[data-theme="dark"] .staff-password-row input:focus,
:root[data-theme="dark"] .staff-search-wrap input:focus,
:root[data-theme="dark"] .staff-modern-form textarea:focus {
    border-color:#278dd3 !important;
    box-shadow:0 0 0 3px rgba(39,141,211,.14) !important;
    outline:none !important;
}

:root[data-theme="dark"] .staff-field-grid input::placeholder,
:root[data-theme="dark"] .staff-password-row input::placeholder,
:root[data-theme="dark"] .staff-search-wrap input::placeholder,
:root[data-theme="dark"] .staff-modern-form textarea::placeholder {
    color:#6f8ca0 !important;
    opacity:1 !important;
}

:root[data-theme="dark"] .staff-field-grid select option,
:root[data-theme="dark"] .staff-modern-form select option {
    color:#e7f1f7 !important;
    background:#0a1925 !important;
}

:root[data-theme="dark"] .permission-switch-card {
    color:#dceaf3 !important;
    border-color:#2a4051 !important;
    background:linear-gradient(145deg,#102130,#0c1a26) !important;
    box-shadow:none !important;
}

:root[data-theme="dark"] .permission-switch-card:hover {
    border-color:#3379aa !important;
    background:linear-gradient(145deg,#13293b,#0e2030) !important;
}

:root[data-theme="dark"] .permission-switch-card input:checked ~ .permission-switch-content strong {
    color:#70c7ff !important;
}

:root[data-theme="dark"] .permission-switch-ui {
    background:#3a5060 !important;
}

:root[data-theme="dark"] .permission-switch-ui > span {
    background:#dceaf3 !important;
}

:root[data-theme="dark"] .permission-switch-card input:checked + .permission-switch-ui {
    background:linear-gradient(135deg,#1684d5,#0d5f9d) !important;
}

:root[data-theme="dark"] .staff-form-actions {
    border-top:1px solid #263b4b !important;
    background:#0b1925 !important;
}

:root[data-theme="dark"] .staff-security-card {
    color:#e8f1f7 !important;
    border-color:#573039 !important;
    background:linear-gradient(145deg,#24151a,#171116) !important;
}

:root[data-theme="dark"] .staff-security-card h3 {
    color:#ffb2ba !important;
}

:root[data-theme="dark"] .staff-delete-row {
    color:#e8f1f7 !important;
    border-color:#603941 !important;
    background:#1c1317 !important;
}

:root[data-theme="dark"] .staff-delete-row small {
    color:#c8969c !important;
}

:root[data-theme="dark"] .staff-search-wrap {
    background:#0b1925 !important;
}

:root[data-theme="dark"] .staff-card-list {
    background:#0a1722 !important;
    scrollbar-color:#315a78 #0a1722;
}

:root[data-theme="dark"] .staff-account-card {
    color:#e8f1f7 !important;
    background:#0a1722 !important;
}

:root[data-theme="dark"] .staff-account-card:nth-child(even) {
    background:#0c1a26 !important;
}

:root[data-theme="dark"] .staff-account-card:hover,
:root[data-theme="dark"] .staff-account-card.selected {
    background:#102a3c !important;
}

:root[data-theme="dark"] .staff-account-card.selected {
    box-shadow:inset 4px 0 #278dd3 !important;
}

:root[data-theme="dark"] .staff-account-avatar,
:root[data-theme="dark"] .staff-card-icon {
    color:#fff !important;
    background:linear-gradient(145deg,#1c87d4,#0a5794) !important;
    box-shadow:0 8px 20px rgba(13,102,168,.22) !important;
}

:root[data-theme="dark"] .staff-status-badge,
:root[data-theme="dark"] .staff-total-badge,
:root[data-theme="dark"] .staff-role-pill {
    color:#70c7ff !important;
    background:#102e45 !important;
    border:1px solid #1d4968 !important;
}

:root[data-theme="dark"] .staff-status-badge.is-admin,
:root[data-theme="dark"] .staff-role-pill.is-admin {
    color:#f5d37b !important;
    background:#382c11 !important;
    border-color:#604b19 !important;
}

:root[data-theme="dark"] .staff-password-pending {
    color:#f0bd60 !important;
}

/* Browser-Autofill darf keine hellen Felder erzeugen. */
:root[data-theme="dark"] .staff-page input:-webkit-autofill,
:root[data-theme="dark"] .staff-page input:-webkit-autofill:hover,
:root[data-theme="dark"] .staff-page input:-webkit-autofill:focus {
    -webkit-text-fill-color:#e7f1f7 !important;
    -webkit-box-shadow:0 0 0 1000px #071622 inset !important;
    transition:background-color 9999s ease-out 0s;
}

/* Überschreibt fest eingetragene helle Hintergründe innerhalb des Staff-Moduls. */
:root[data-theme="dark"] .staff-page [style*="background:#fff"],
:root[data-theme="dark"] .staff-page [style*="background: #fff"],
:root[data-theme="dark"] .staff-page [style*="background:white"],
:root[data-theme="dark"] .staff-page [style*="background: white"],
:root[data-theme="dark"] .staff-page [style*="background:#f"],
:root[data-theme="dark"] .staff-page [style*="background: #f"] {
    background:#0d1c29 !important;
}

:root[data-theme="dark"] .staff-page hr {
    border-color:#263b4b !important;
}

/* =========================================================
   DARK MODE V5 – FINANZEN & ABMELDUNGEN FULL FIX
   Behebt helle Statistik-Karten, weil die Komponenten
   <article>-Elemente statt <div>-Elemente verwenden.
   ========================================================= */

:root[data-theme="dark"] .payout-stat-grid article,
:root[data-theme="dark"] .absence-stat-grid article {
    color: var(--text) !important;
    background: linear-gradient(145deg, #101f2c, #0c1924) !important;
    border-color: rgba(131, 166, 190, .22) !important;
    box-shadow: 0 12px 30px rgba(0, 0, 0, .22) !important;
}

:root[data-theme="dark"] .payout-stat-grid article:hover,
:root[data-theme="dark"] .absence-stat-grid article:hover {
    background: linear-gradient(145deg, #132738, #0e1e2b) !important;
    border-color: rgba(63, 153, 220, .42) !important;
}

:root[data-theme="dark"] .payout-stat-grid article span,
:root[data-theme="dark"] .absence-stat-grid article span {
    color: #91a8ba !important;
}

:root[data-theme="dark"] .payout-stat-grid article strong,
:root[data-theme="dark"] .absence-stat-grid article strong {
    color: #f3f8fb !important;
}

:root[data-theme="dark"] .payout-stat-grid .payout-stat-money {
    color: #fff !important;
    background: linear-gradient(145deg, #0c3150, #12527d) !important;
    border-color: rgba(71, 169, 232, .5) !important;
}

:root[data-theme="dark"] .payout-stat-grid .payout-stat-money span {
    color: #bcd8e9 !important;
}

:root[data-theme="dark"] .payout-stat-grid .payout-stat-money strong {
    color: #fff !important;
}

/* Tabellen und Detailkarten der Finanz- und Abmeldungsverwaltung */
:root[data-theme="dark"] .payout-management-page .module-table-card,
:root[data-theme="dark"] .absence-management-page .module-table-card,
:root[data-theme="dark"] .payout-review-card,
:root[data-theme="dark"] .absence-review-card {
    background: var(--panel) !important;
    border-color: var(--border) !important;
    color: var(--text) !important;
}

:root[data-theme="dark"] .payout-management-page table,
:root[data-theme="dark"] .absence-management-page table,
:root[data-theme="dark"] .payout-management-page thead,
:root[data-theme="dark"] .absence-management-page thead,
:root[data-theme="dark"] .payout-management-page tbody,
:root[data-theme="dark"] .absence-management-page tbody,
:root[data-theme="dark"] .payout-management-page tr,
:root[data-theme="dark"] .absence-management-page tr,
:root[data-theme="dark"] .payout-management-page td,
:root[data-theme="dark"] .absence-management-page td,
:root[data-theme="dark"] .payout-management-page th,
:root[data-theme="dark"] .absence-management-page th {
    border-color: var(--border) !important;
}

:root[data-theme="dark"] .payout-management-page tbody tr:hover,
:root[data-theme="dark"] .absence-management-page tbody tr:hover,
:root[data-theme="dark"] .payout-management-layout tr.is-selected,
:root[data-theme="dark"] .absence-management-layout tr.is-selected {
    background: rgba(38, 125, 184, .12) !important;
}

:root[data-theme="dark"] .payout-filter-tabs,
:root[data-theme="dark"] .absence-filter-tabs {
    background: var(--panel) !important;
    border-color: var(--border) !important;
}

:root[data-theme="dark"] .payout-filter-tabs a,
:root[data-theme="dark"] .absence-filter-tabs a {
    color: var(--muted) !important;
    background: transparent !important;
    border-color: transparent !important;
}

:root[data-theme="dark"] .payout-filter-tabs a:hover,
:root[data-theme="dark"] .absence-filter-tabs a:hover {
    color: var(--text) !important;
    background: rgba(42, 139, 205, .11) !important;
}

:root[data-theme="dark"] .payout-filter-tabs a.active,
:root[data-theme="dark"] .absence-filter-tabs a.active {
    color: #fff !important;
    background: linear-gradient(135deg, #1674bd, #245ec7) !important;
    border-color: rgba(76, 162, 225, .45) !important;
}

/* =========================================================
   DARK MODE V6 – 2FA / KONTOSICHERHEIT FULL FIX
   Behebt helle 2FA-Karten, Recovery-Codes, Setup-Bereiche,
   Passwortfelder, Warnkarten, Status-Badges und Autofill.
   ========================================================= */

:root[data-theme="dark"] .two-factor-page {
    color:var(--text) !important;
    background:
        radial-gradient(circle at 100% 0%, rgba(25,112,176,.12), transparent 30rem),
        var(--background) !important;
}

:root[data-theme="dark"] .two-factor-main-card,
:root[data-theme="dark"] .two-factor-setup-card,
:root[data-theme="dark"] .two-factor-action-card,
:root[data-theme="dark"] .two-factor-recovery-card {
    color:#e8f1f7 !important;
    border-color:#2a4051 !important;
    background:linear-gradient(145deg,#101f2c,#0b1823) !important;
    box-shadow:0 16px 42px rgba(0,0,0,.24) !important;
}

:root[data-theme="dark"] .two-factor-main-card:hover,
:root[data-theme="dark"] .two-factor-action-card:hover,
:root[data-theme="dark"] .two-factor-recovery-card:hover {
    border-color:#35617e !important;
}

:root[data-theme="dark"] .two-factor-main-card h2,
:root[data-theme="dark"] .two-factor-setup-card h2,
:root[data-theme="dark"] .two-factor-action-card h2,
:root[data-theme="dark"] .two-factor-recovery-card h2,
:root[data-theme="dark"] .two-factor-setup-grid h3,
:root[data-theme="dark"] .two-factor-page label {
    color:#eef6fb !important;
}

:root[data-theme="dark"] .two-factor-main-card p,
:root[data-theme="dark"] .two-factor-action-card p,
:root[data-theme="dark"] .two-factor-recovery-card p,
:root[data-theme="dark"] .two-factor-setup-grid p,
:root[data-theme="dark"] .two-factor-page .muted,
:root[data-theme="dark"] .two-factor-page small {
    color:#91a8ba !important;
}

:root[data-theme="dark"] .two-factor-page .eyebrow {
    color:#5fb9f4 !important;
}

:root[data-theme="dark"] .two-factor-status {
    color:#b8c9d5 !important;
    border:1px solid #344c5d !important;
    background:#142431 !important;
}

:root[data-theme="dark"] .two-factor-status.enabled {
    color:#6ee0aa !important;
    border-color:#1c5b42 !important;
    background:#103225 !important;
}

:root[data-theme="dark"] .two-factor-icon {
    color:#fff !important;
    background:linear-gradient(145deg,#278bd0,#125782) !important;
    box-shadow:0 10px 26px rgba(12,104,169,.25) !important;
}

:root[data-theme="dark"] .two-factor-setup-card > header {
    border-bottom-color:#2a4051 !important;
    background:#0e1c28 !important;
}

:root[data-theme="dark"] .two-factor-action-card.danger {
    color:#f5e7e9 !important;
    border-color:#63353e !important;
    background:linear-gradient(145deg,#25171c,#191216) !important;
}

:root[data-theme="dark"] .two-factor-action-card.danger h2 {
    color:#ffb8c0 !important;
}

:root[data-theme="dark"] .two-factor-action-card.danger p,
:root[data-theme="dark"] .two-factor-action-card.danger label {
    color:#d7a8ae !important;
}

:root[data-theme="dark"] .two-factor-recovery-card {
    border-color:#685523 !important;
    background:linear-gradient(145deg,#282313,#1a180f) !important;
}

:root[data-theme="dark"] .two-factor-recovery-card h2 {
    color:#f5dc93 !important;
}

:root[data-theme="dark"] .two-factor-recovery-card p {
    color:#c9b878 !important;
}

:root[data-theme="dark"] .recovery-code-grid code {
    color:#ffe7a3 !important;
    border:1px solid #665526 !important;
    background:#17150e !important;
    box-shadow:none !important;
}

:root[data-theme="dark"] .secret-box {
    border-color:#315976 !important;
    background:#0b2232 !important;
}

:root[data-theme="dark"] .secret-box span {
    color:#8fb5cc !important;
}

:root[data-theme="dark"] .secret-box code,
:root[data-theme="dark"] .otpauth-details code {
    color:#72c7fb !important;
}

:root[data-theme="dark"] .otpauth-details,
:root[data-theme="dark"] .otpauth-details summary {
    color:#91a8ba !important;
}

:root[data-theme="dark"] .two-factor-page input,
:root[data-theme="dark"] .two-factor-page select,
:root[data-theme="dark"] .two-factor-page textarea {
    color:#e9f2f8 !important;
    caret-color:#58b9f5 !important;
    border-color:#314b5e !important;
    background:#071622 !important;
    box-shadow:inset 0 1px 2px rgba(0,0,0,.24) !important;
}

:root[data-theme="dark"] .two-factor-page input::placeholder,
:root[data-theme="dark"] .two-factor-page textarea::placeholder {
    color:#6e899c !important;
    opacity:1 !important;
}

:root[data-theme="dark"] .two-factor-page input:focus,
:root[data-theme="dark"] .two-factor-page select:focus,
:root[data-theme="dark"] .two-factor-page textarea:focus {
    border-color:#2e94d8 !important;
    outline:none !important;
    box-shadow:0 0 0 3px rgba(46,148,216,.15) !important;
}

:root[data-theme="dark"] .two-factor-page input:-webkit-autofill,
:root[data-theme="dark"] .two-factor-page input:-webkit-autofill:hover,
:root[data-theme="dark"] .two-factor-page input:-webkit-autofill:focus {
    -webkit-text-fill-color:#e9f2f8 !important;
    -webkit-box-shadow:0 0 0 1000px #071622 inset !important;
    transition:background-color 9999s ease-out 0s;
}

:root[data-theme="dark"] .two-factor-page .button-ghost {
    color:#eaf4fa !important;
    border-color:#355268 !important;
    background:#0d1d29 !important;
}

:root[data-theme="dark"] .two-factor-page .button-ghost:hover {
    color:#fff !important;
    border-color:#3d83b4 !important;
    background:#133047 !important;
}

:root[data-theme="dark"] .two-factor-page .button-danger {
    color:#fff !important;
    border-color:#b44250 !important;
    background:linear-gradient(135deg,#c84a58,#a83240) !important;
}

:root[data-theme="dark"] .two-factor-page .button-danger:hover {
    background:linear-gradient(135deg,#dd5866,#b83846) !important;
}

:root[data-theme="dark"] .two-factor-page [style*="background:#fff"],
:root[data-theme="dark"] .two-factor-page [style*="background: #fff"],
:root[data-theme="dark"] .two-factor-page [style*="background:white"],
:root[data-theme="dark"] .two-factor-page [style*="background: white"] {
    background:#0d1c29 !important;
}

/* =========================================================
   DARK MODE V7 – STRAFKATALOG / STRAFRECHNER FULL FIX
   Deckt Strafrechner, Ergebnisbox, Deliktliste, Formulare,
   gespeicherte Berechnungen und Strafkatalog-Verwaltung ab.
   ========================================================= */

:root[data-theme="dark"] .penalty-calculator-page {
    color:var(--text) !important;
    background:
        radial-gradient(circle at 100% 0%, rgba(25,112,176,.13), transparent 30rem),
        var(--background) !important;
}

:root[data-theme="dark"] .penalty-selector-card,
:root[data-theme="dark"] .penalty-summary-card {
    color:#e8f1f7 !important;
    border-color:#2a4051 !important;
    background:linear-gradient(145deg,#101f2c,#0b1823) !important;
    box-shadow:0 16px 42px rgba(0,0,0,.25) !important;
}

:root[data-theme="dark"] .penalty-selector-toolbar {
    border-bottom-color:#2a4051 !important;
    background:#0e1c28 !important;
}

:root[data-theme="dark"] .penalty-selector-toolbar input,
:root[data-theme="dark"] .penalty-selector-toolbar select,
:root[data-theme="dark"] .penalty-summary-card input,
:root[data-theme="dark"] .penalty-summary-card select,
:root[data-theme="dark"] .penalty-summary-card textarea {
    color:#e9f2f8 !important;
    caret-color:#58b9f5 !important;
    border-color:#314b5e !important;
    background:#071622 !important;
    box-shadow:inset 0 1px 2px rgba(0,0,0,.25) !important;
}

:root[data-theme="dark"] .penalty-selector-toolbar input::placeholder,
:root[data-theme="dark"] .penalty-summary-card input::placeholder,
:root[data-theme="dark"] .penalty-summary-card textarea::placeholder {
    color:#718b9e !important;
    opacity:1 !important;
}

:root[data-theme="dark"] .penalty-selector-toolbar input:focus,
:root[data-theme="dark"] .penalty-selector-toolbar select:focus,
:root[data-theme="dark"] .penalty-summary-card input:focus,
:root[data-theme="dark"] .penalty-summary-card select:focus,
:root[data-theme="dark"] .penalty-summary-card textarea:focus {
    outline:none !important;
    border-color:#2e94d8 !important;
    box-shadow:0 0 0 3px rgba(46,148,216,.15) !important;
}

:root[data-theme="dark"] .penalty-selector-toolbar select,
:root[data-theme="dark"] .penalty-summary-card select {
    color-scheme:dark;
}

:root[data-theme="dark"] .penalty-select-list {
    background:#0b1823 !important;
    scrollbar-color:#31536a #09151f;
}

:root[data-theme="dark"] .penalty-select-row {
    color:#e9f2f8 !important;
    border-bottom-color:#223746 !important;
    background:transparent !important;
}

:root[data-theme="dark"] .penalty-select-row:hover {
    background:#10283a !important;
}

:root[data-theme="dark"] .penalty-select-row:has(input:checked) {
    color:#fff !important;
    background:linear-gradient(90deg,rgba(26,119,181,.26),rgba(15,43,62,.78)) !important;
    box-shadow:inset 4px 0 #2f9be0 !important;
}

:root[data-theme="dark"] .penalty-select-row input[type="checkbox"] {
    accent-color:#2e94d8 !important;
}

:root[data-theme="dark"] .penalty-select-code {
    color:#efc967 !important;
}

:root[data-theme="dark"] .penalty-select-main strong {
    color:#eef6fb !important;
}

:root[data-theme="dark"] .penalty-select-main small,
:root[data-theme="dark"] .penalty-select-values small {
    color:#8ea6b7 !important;
}

:root[data-theme="dark"] .penalty-select-values b {
    color:#65c6ff !important;
}

:root[data-theme="dark"] .penalty-summary-card > header {
    color:#fff !important;
    border-bottom:1px solid #31516a !important;
    background:linear-gradient(145deg,#0a2a43,#15577f) !important;
}

:root[data-theme="dark"] .penalty-summary-card > header .eyebrow {
    color:#79cbff !important;
}

:root[data-theme="dark"] .penalty-summary-card h2 {
    color:#fff !important;
}

:root[data-theme="dark"] .penalty-total-grid {
    border-bottom-color:#2a4051 !important;
    background:#0d1b27 !important;
}

:root[data-theme="dark"] .penalty-total-grid article {
    color:#eaf3f8 !important;
    border:1px solid #284255 !important;
    background:linear-gradient(145deg,#132634,#0f202d) !important;
    box-shadow:none !important;
}

:root[data-theme="dark"] .penalty-total-grid article:hover {
    border-color:#35617e !important;
    background:linear-gradient(145deg,#173044,#102432) !important;
}

:root[data-theme="dark"] .penalty-total-grid span {
    color:#8ea7b8 !important;
}

:root[data-theme="dark"] .penalty-total-grid strong {
    color:#f4f9fc !important;
}

:root[data-theme="dark"] .penalty-selected-list {
    color:#dfeaf1 !important;
    border-bottom-color:#2a4051 !important;
    background:#0b1823 !important;
}

:root[data-theme="dark"] .penalty-selected-list > div {
    border-bottom-color:#243a49 !important;
}

:root[data-theme="dark"] .penalty-selected-list strong {
    color:#edf5fa !important;
}

:root[data-theme="dark"] .penalty-selected-list small,
:root[data-theme="dark"] .penalty-selected-list .empty {
    color:#91a7b7 !important;
}

:root[data-theme="dark"] .penalty-summary-card form {
    color:#e8f1f7 !important;
    background:#0d1b27 !important;
}

:root[data-theme="dark"] .penalty-summary-card form label {
    color:#c9d7e1 !important;
}

:root[data-theme="dark"] .penalty-summary-card .button-primary:disabled {
    color:#7890a0 !important;
    border-color:#253b4a !important;
    background:#142532 !important;
    opacity:.75 !important;
}

:root[data-theme="dark"] .penalty-summary-card .button-ghost {
    color:#e8f2f8 !important;
    border-color:#355268 !important;
    background:#0e202d !important;
}

:root[data-theme="dark"] .penalty-summary-card .button-ghost:hover {
    color:#fff !important;
    border-color:#3b83b5 !important;
    background:#153249 !important;
}

:root[data-theme="dark"] .penalty-calculator-page input:-webkit-autofill,
:root[data-theme="dark"] .penalty-calculator-page input:-webkit-autofill:hover,
:root[data-theme="dark"] .penalty-calculator-page input:-webkit-autofill:focus {
    -webkit-text-fill-color:#e9f2f8 !important;
    -webkit-box-shadow:0 0 0 1000px #071622 inset !important;
    transition:background-color 9999s ease-out 0s;
}

/* Gespeicherte Strafberechnungen */
:root[data-theme="dark"] .module-page .module-table-card,
:root[data-theme="dark"] .module-page .table-wrap {
    border-color:var(--border) !important;
    background:var(--panel) !important;
}

:root[data-theme="dark"] .module-page .module-table-card table,
:root[data-theme="dark"] .module-page .module-table-card thead,
:root[data-theme="dark"] .module-page .module-table-card tbody,
:root[data-theme="dark"] .module-page .module-table-card tr,
:root[data-theme="dark"] .module-page .module-table-card th,
:root[data-theme="dark"] .module-page .module-table-card td {
    border-color:var(--border) !important;
}

:root[data-theme="dark"] .module-page .module-table-card tbody tr:hover {
    background:rgba(39,132,194,.11) !important;
}

/* Strafkatalog-Verwaltung */
:root[data-theme="dark"] .document-editor-card.warrant-editor,
:root[data-theme="dark"] .module-danger-zone {
    color:var(--text) !important;
    border-color:var(--border) !important;
    background:linear-gradient(145deg,#101f2c,#0b1823) !important;
}

:root[data-theme="dark"] .document-editor-card.warrant-editor input,
:root[data-theme="dark"] .document-editor-card.warrant-editor select,
:root[data-theme="dark"] .document-editor-card.warrant-editor textarea {
    color:#e9f2f8 !important;
    border-color:#314b5e !important;
    background:#071622 !important;
}

:root[data-theme="dark"] .document-editor-card.warrant-editor label,
:root[data-theme="dark"] .document-editor-card.warrant-editor h2,
:root[data-theme="dark"] .document-editor-card.warrant-editor h3 {
    color:#edf5fa !important;
}

:root[data-theme="dark"] .permission-switch {
    color:#dce8ef !important;
    border-color:#2a4253 !important;
    background:#0d1d29 !important;
}

:root[data-theme="dark"] .penalty-active-chip {
    color:#f1bfbd !important;
    border-color:#63363d !important;
    background:#2a171b !important;
}

:root[data-theme="dark"] .penalty-active-chip.is-active {
    color:#65dda3 !important;
    border-color:#245d45 !important;
    background:#102f23 !important;
}

/* Öffentlicher Strafkatalog */
:root[data-theme="dark"] .penalty-public-section {
    color:var(--text) !important;
    background:var(--background) !important;
}

:root[data-theme="dark"] .penalty-public-filter,
:root[data-theme="dark"] .penalty-public-card,
:root[data-theme="dark"] .penalty-public-notice {
    color:var(--text) !important;
    border-color:var(--border) !important;
    background:linear-gradient(145deg,#101f2c,#0b1823) !important;
}

:root[data-theme="dark"] .penalty-public-filter input,
:root[data-theme="dark"] .penalty-public-filter select {
    color:#e9f2f8 !important;
    border-color:#314b5e !important;
    background:#071622 !important;
}

:root[data-theme="dark"] .penalty-public-card h2,
:root[data-theme="dark"] .penalty-public-card dd,
:root[data-theme="dark"] .penalty-public-notice strong {
    color:#edf5fa !important;
}

:root[data-theme="dark"] .penalty-public-card p,
:root[data-theme="dark"] .penalty-public-card dt,
:root[data-theme="dark"] .penalty-public-notice span {
    color:#91a8ba !important;
}

:root[data-theme="dark"] .penalty-public-card dl > div {
    border-color:#2a4051 !important;
    background:#0d1c28 !important;
}

/* Notfall-Fallback für fest eingetragene helle Flächen im Strafbereich */
:root[data-theme="dark"] .penalty-calculator-page [style*="background:#fff"],
:root[data-theme="dark"] .penalty-calculator-page [style*="background: #fff"],
:root[data-theme="dark"] .penalty-calculator-page [style*="background:white"],
:root[data-theme="dark"] .penalty-calculator-page [style*="background: white"] {
    background:#0d1c29 !important;
}

/* =========================================================
   DARK MODE V8 – TICKETSYSTEM FULL FIX
   Bürgerportal, Mitarbeiteransicht, Status, Chat, Formulare
   ========================================================= */

:root[data-theme="dark"] .citizen-portal,
:root[data-theme="dark"] .citizen-ticket-grid,
:root[data-theme="dark"] .ticket-layout {
    color:var(--text) !important;
}

/* Ticket-Kopf und Fortschritt */
:root[data-theme="dark"] .citizen-ticket-hero,
:root[data-theme="dark"] .ticket-progress-card,
:root[data-theme="dark"] .ticket-chat-card,
:root[data-theme="dark"] .ticket-info-card,
:root[data-theme="dark"] .ticket-security-card,
:root[data-theme="dark"] .new-ticket-link-card,
:root[data-theme="dark"] .ticket-layout .panel,
:root[data-theme="dark"] .ticket-sidebar .panel {
    color:#e8f1f7 !important;
    border-color:#294050 !important;
    background:linear-gradient(145deg,#101f2c,#0b1823) !important;
    box-shadow:0 18px 45px rgba(0,0,0,.22) !important;
}

:root[data-theme="dark"] .citizen-ticket-hero,
:root[data-theme="dark"] .ticket-chat-header,
:root[data-theme="dark"] .ticket-info-card > header,
:root[data-theme="dark"] .ticket-security-card > header {
    border-color:#2b4354 !important;
}

:root[data-theme="dark"] .citizen-ticket-hero h1,
:root[data-theme="dark"] .ticket-chat-header h2,
:root[data-theme="dark"] .ticket-info-card h2,
:root[data-theme="dark"] .ticket-security-card h2,
:root[data-theme="dark"] .ticket-heading h1,
:root[data-theme="dark"] .ticket-layout h2,
:root[data-theme="dark"] .ticket-layout h3 {
    color:#f1f7fb !important;
}

:root[data-theme="dark"] .citizen-ticket-hero p,
:root[data-theme="dark"] .ticket-hero-meta,
:root[data-theme="dark"] .ticket-chat-card p,
:root[data-theme="dark"] .ticket-security-card p,
:root[data-theme="dark"] .form-hint,
:root[data-theme="dark"] .composer-heading p,
:root[data-theme="dark"] .ticket-layout small {
    color:#91a8b9 !important;
}

:root[data-theme="dark"] .ticket-progress-card {
    background:#0d1b27 !important;
}

:root[data-theme="dark"] .progress-step {
    color:#70899b !important;
}

:root[data-theme="dark"] .progress-step strong,
:root[data-theme="dark"] .progress-step span {
    color:#8097a8 !important;
}

:root[data-theme="dark"] .progress-step.active strong,
:root[data-theme="dark"] .progress-step.active span {
    color:#eaf4fa !important;
}

:root[data-theme="dark"] .progress-step > b,
:root[data-theme="dark"] .progress-step > i,
:root[data-theme="dark"] .progress-step .step-number {
    color:#9cb1bf !important;
    border-color:#40596a !important;
    background:#102230 !important;
}

:root[data-theme="dark"] .progress-step.active > b,
:root[data-theme="dark"] .progress-step.active > i,
:root[data-theme="dark"] .progress-step.active .step-number {
    color:#fff !important;
    border-color:#3197d7 !important;
    background:#257fb8 !important;
    box-shadow:0 0 0 5px rgba(47,151,215,.16) !important;
}

:root[data-theme="dark"] .progress-line {
    background:#2b414f !important;
}

:root[data-theme="dark"] .progress-line.active {
    background:linear-gradient(90deg,#2589c9,#43a8e8) !important;
}

/* Nachrichtenverlauf */
:root[data-theme="dark"] .privacy-notice {
    color:#b8d8ed !important;
    border-color:#295573 !important;
    background:#0e2a3d !important;
}

:root[data-theme="dark"] .chat-messages,
:root[data-theme="dark"] .conversation {
    background:#0b1823 !important;
}

:root[data-theme="dark"] .chat-message,
:root[data-theme="dark"] .message {
    border-color:#263e4f !important;
}

:root[data-theme="dark"] .chat-message-content strong,
:root[data-theme="dark"] .message strong,
:root[data-theme="dark"] .message-author {
    color:#edf5fa !important;
}

:root[data-theme="dark"] .chat-message-content time,
:root[data-theme="dark"] .message time,
:root[data-theme="dark"] .message-meta {
    color:#8097a7 !important;
}

:root[data-theme="dark"] .chat-bubble,
:root[data-theme="dark"] .message-body {
    color:#e4edf3 !important;
    border-color:#294353 !important;
    background:#112532 !important;
}

:root[data-theme="dark"] .chat-message-staff .chat-bubble,
:root[data-theme="dark"] .staff-message .message-body {
    color:#e9f6ff !important;
    border-color:#235d82 !important;
    background:linear-gradient(145deg,#0d3048,#10283a) !important;
}

:root[data-theme="dark"] .internal-message,
:root[data-theme="dark"] .internal-message .message-body {
    color:#f3dfad !important;
    border-color:#6b5727 !important;
    background:#2b2413 !important;
}

:root[data-theme="dark"] .chat-avatar,
:root[data-theme="dark"] .message-avatar {
    color:#fff !important;
    border-color:#397ba5 !important;
    background:linear-gradient(145deg,#2c91cb,#155f91) !important;
}

:root[data-theme="dark"] .sender-badge,
:root[data-theme="dark"] .message-count {
    color:#7dcaff !important;
    border-color:#28526d !important;
    background:#102c40 !important;
}

/* Antwort- und Notizformulare */
:root[data-theme="dark"] .citizen-composer,
:root[data-theme="dark"] .reply-form,
:root[data-theme="dark"] .ticket-closed-card,
:root[data-theme="dark"] .fresh-code-box {
    color:#e7f0f6 !important;
    border-color:#294354 !important;
    background:#0e1e2a !important;
}

:root[data-theme="dark"] .citizen-composer label,
:root[data-theme="dark"] .reply-form label,
:root[data-theme="dark"] .ticket-layout label {
    color:#cbd9e2 !important;
}

:root[data-theme="dark"] .citizen-composer textarea,
:root[data-theme="dark"] .citizen-composer input,
:root[data-theme="dark"] .reply-form textarea,
:root[data-theme="dark"] .reply-form input,
:root[data-theme="dark"] .ticket-layout textarea,
:root[data-theme="dark"] .ticket-layout input,
:root[data-theme="dark"] .ticket-layout select,
:root[data-theme="dark"] .ticket-sidebar input,
:root[data-theme="dark"] .ticket-sidebar select {
    color:#e8f2f8 !important;
    border-color:#304b5e !important;
    background:#071622 !important;
    caret-color:#74c9ff !important;
}

:root[data-theme="dark"] .citizen-composer textarea::placeholder,
:root[data-theme="dark"] .citizen-composer input::placeholder,
:root[data-theme="dark"] .reply-form textarea::placeholder,
:root[data-theme="dark"] .reply-form input::placeholder,
:root[data-theme="dark"] .ticket-layout textarea::placeholder,
:root[data-theme="dark"] .ticket-layout input::placeholder {
    color:#718b9e !important;
    opacity:1 !important;
}

:root[data-theme="dark"] .citizen-composer textarea:focus,
:root[data-theme="dark"] .citizen-composer input:focus,
:root[data-theme="dark"] .reply-form textarea:focus,
:root[data-theme="dark"] .reply-form input:focus,
:root[data-theme="dark"] .ticket-layout textarea:focus,
:root[data-theme="dark"] .ticket-layout input:focus,
:root[data-theme="dark"] .ticket-layout select:focus {
    outline:none !important;
    border-color:#2f98d9 !important;
    box-shadow:0 0 0 3px rgba(47,152,217,.15) !important;
}

:root[data-theme="dark"] .composer-footer {
    border-color:#263d4d !important;
}

/* Ticketseitenleiste */
:root[data-theme="dark"] .ticket-info-list,
:root[data-theme="dark"] .ticket-info-list > div,
:root[data-theme="dark"] .details-card dl,
:root[data-theme="dark"] .details-card dl > div {
    border-color:#2a4050 !important;
}

:root[data-theme="dark"] .ticket-info-list dt,
:root[data-theme="dark"] .details-card dt {
    color:#8299aa !important;
}

:root[data-theme="dark"] .ticket-info-list dd,
:root[data-theme="dark"] .details-card dd {
    color:#e4edf3 !important;
}

:root[data-theme="dark"] .security-card-icon,
:root[data-theme="dark"] .ticket-category-icon {
    color:#8bd2ff !important;
    border-color:#2e536b !important;
    background:#102b3d !important;
}

:root[data-theme="dark"] .new-ticket-link-card:hover {
    color:#fff !important;
    border-color:#338bc4 !important;
    background:linear-gradient(145deg,#15334a,#0d2332) !important;
}

/* Mitarbeiter-Ticketliste und Verwaltung */
:root[data-theme="dark"] .tickets-page .panel,
:root[data-theme="dark"] .ticket-table-card,
:root[data-theme="dark"] .ticket-filter-card,
:root[data-theme="dark"] .ticket-stats article,
:root[data-theme="dark"] .ticket-list article {
    color:var(--text) !important;
    border-color:var(--border) !important;
    background:linear-gradient(145deg,#101f2c,#0b1823) !important;
}

:root[data-theme="dark"] .tickets-page table,
:root[data-theme="dark"] .tickets-page thead,
:root[data-theme="dark"] .tickets-page tbody,
:root[data-theme="dark"] .tickets-page tr,
:root[data-theme="dark"] .tickets-page th,
:root[data-theme="dark"] .tickets-page td {
    color:#dfeaf1 !important;
    border-color:#263c4b !important;
    background:transparent !important;
}

:root[data-theme="dark"] .tickets-page thead,
:root[data-theme="dark"] .tickets-page th {
    color:#9db2c1 !important;
    background:#10222f !important;
}

:root[data-theme="dark"] .tickets-page tbody tr:hover {
    background:rgba(45,137,196,.1) !important;
}

/* Status-Badges */
:root[data-theme="dark"] .status-open,
:root[data-theme="dark"] .status-new,
:root[data-theme="dark"] .status-submitted {
    color:#7dd0ff !important;
    border-color:#245a7a !important;
    background:#0e2b3e !important;
}

:root[data-theme="dark"] .status-in_progress,
:root[data-theme="dark"] .status-processing,
:root[data-theme="dark"] .status-claimed {
    color:#f0cf74 !important;
    border-color:#665526 !important;
    background:#2b2412 !important;
}

:root[data-theme="dark"] .status-closed,
:root[data-theme="dark"] .status-completed,
:root[data-theme="dark"] .status-resolved {
    color:#6ee0a8 !important;
    border-color:#245f46 !important;
    background:#102f23 !important;
}

/* Autofill und harte helle Fallbacks */
:root[data-theme="dark"] .citizen-portal input:-webkit-autofill,
:root[data-theme="dark"] .citizen-portal input:-webkit-autofill:hover,
:root[data-theme="dark"] .citizen-portal input:-webkit-autofill:focus,
:root[data-theme="dark"] .ticket-layout input:-webkit-autofill,
:root[data-theme="dark"] .ticket-layout input:-webkit-autofill:hover,
:root[data-theme="dark"] .ticket-layout input:-webkit-autofill:focus {
    -webkit-text-fill-color:#e9f2f8 !important;
    -webkit-box-shadow:0 0 0 1000px #071622 inset !important;
    transition:background-color 9999s ease-out 0s;
}

:root[data-theme="dark"] .citizen-portal [style*="background:#fff"],
:root[data-theme="dark"] .citizen-portal [style*="background: #fff"],
:root[data-theme="dark"] .citizen-portal [style*="background:white"],
:root[data-theme="dark"] .citizen-portal [style*="background: white"],
:root[data-theme="dark"] .ticket-layout [style*="background:#fff"],
:root[data-theme="dark"] .ticket-layout [style*="background: #fff"],
:root[data-theme="dark"] .ticket-layout [style*="background:white"],
:root[data-theme="dark"] .ticket-layout [style*="background: white"] {
    background:#0d1c29 !important;
}

:root[data-theme="dark"] .citizen-portal hr,
:root[data-theme="dark"] .ticket-layout hr {
    border-color:#2b4252 !important;
}

/* =========================================================
   DARK MODE V9 – ABTEILUNGSLOGO FULL FIX
   Verhindert übergroße Logos und Überlagerungen.
   ========================================================= */

/* Interne Abteilungskarten */
.department-logo {
    flex:0 0 76px;
    width:76px;
    height:76px;
    min-width:76px;
    max-width:76px;
    max-height:76px;
    padding:8px;
    overflow:hidden;
    border-radius:16px;
}

.department-logo img {
    display:block;
    width:100% !important;
    height:100% !important;
    max-width:60px !important;
    max-height:60px !important;
    margin:auto;
    object-fit:contain !important;
    object-position:center;
}

/* Öffentliche Abteilungskarten */
.public-department-logo {
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    height:180px;
    min-height:180px;
    max-height:180px;
    padding:22px;
    overflow:hidden;
}

.public-department-logo img {
    display:block;
    width:auto !important;
    height:auto !important;
    max-width:132px !important;
    max-height:132px !important;
    margin:auto;
    object-fit:contain !important;
    object-position:center;
}

/* Vorschau beim Upload */
.current-logo-preview {
    overflow:hidden;
}

.current-logo-preview img {
    flex:0 0 48px;
    width:48px !important;
    height:48px !important;
    max-width:48px !important;
    max-height:48px !important;
    object-fit:contain !important;
}

/* Text bleibt stets über/außerhalb des Logos */
.public-department-body,
.department-card header > div:not(.department-logo) {
    position:relative;
    z-index:2;
    min-width:0;
}

.public-department-logo img,
.department-logo img {
    position:relative;
    z-index:1;
}

/* Dark Mode: heller Bildhintergrund wird sauber eingefasst */
:root[data-theme="dark"] .public-department-logo img,
:root[data-theme="dark"] .department-logo img,
:root[data-theme="dark"] .current-logo-preview img {
    border-radius:12px;
    background:rgba(255,255,255,.96);
    box-shadow:0 8px 24px rgba(0,0,0,.24);
}

@media (max-width:700px) {
    .public-department-logo {
        height:150px;
        min-height:150px;
        max-height:150px;
        padding:18px;
    }

    .public-department-logo img {
        max-width:108px !important;
        max-height:108px !important;
    }

    .department-logo {
        flex-basis:64px;
        width:64px;
        height:64px;
        min-width:64px;
        max-width:64px;
        max-height:64px;
    }

    .department-logo img {
        max-width:50px !important;
        max-height:50px !important;
    }
}


/* =========================================================
   Fahrzeugraster Full Module
   ========================================================= */
.vehicle-roster-page .dashboard-heading p,
.vehicle-management-page .dashboard-heading p{margin:.35rem 0 0;color:var(--muted,#64748b)}
.vehicle-stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem;margin-bottom:1.25rem}
.vehicle-stat-grid article{padding:1.2rem;border:1px solid var(--border,#d9e2ea);border-radius:16px;background:var(--panel,#fff);box-shadow:var(--shadow-sm,0 8px 24px rgba(7,23,39,.06))}
.vehicle-stat-grid span,.vehicle-stat-grid small{display:block;color:var(--muted,#64748b)}
.vehicle-stat-grid strong{display:block;margin:.35rem 0;font-size:2rem;color:var(--text,#0f2438)}
.vehicle-roster-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.1rem}
.vehicle-card{position:relative;overflow:hidden;padding:1.25rem;border:1px solid var(--border,#d9e2ea);border-left:4px solid #2f80c5;border-radius:18px;background:var(--panel,#fff);box-shadow:var(--shadow-sm,0 10px 30px rgba(7,23,39,.07))}
.vehicle-card.status-border-available{border-left-color:#22a06b}.vehicle-card.status-border-operation{border-left-color:#dc3545}.vehicle-card.status-border-pause{border-left-color:#e5a72b}.vehicle-card.status-border-out_of_service{border-left-color:#64748b;opacity:.82}
.vehicle-card>header{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;padding-bottom:1rem;border-bottom:1px solid var(--border,#e2e8f0)}
.vehicle-card h2{margin:.2rem 0 0;font-size:1.45rem}.vehicle-card header p{margin:.2rem 0 0;color:var(--muted,#64748b)}
.vehicle-type{font-size:.72rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#3184c8}
.vehicle-status{display:inline-flex;align-items:center;padding:.34rem .65rem;border-radius:999px;font-size:.73rem;font-weight:800;white-space:nowrap}
.vehicle-status.status-available{color:#127348;background:rgba(34,160,107,.14)}
.vehicle-status.status-patrol{color:#176ca7;background:rgba(47,128,197,.15)}
.vehicle-status.status-operation{color:#b4232f;background:rgba(220,53,69,.14)}
.vehicle-status.status-pause{color:#946400;background:rgba(229,167,43,.18)}
.vehicle-status.status-out_of_service{color:#526170;background:rgba(100,116,139,.16)}
.vehicle-meta{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;margin:1rem 0}
.vehicle-meta span{padding:.75rem;border-radius:12px;background:var(--soft,#f4f7fa)}
.vehicle-meta small,.vehicle-meta strong{display:block}.vehicle-meta small{margin-bottom:.22rem;color:var(--muted,#64748b);font-size:.7rem;text-transform:uppercase;letter-spacing:.08em}
.vehicle-crew{display:grid;gap:.65rem}.crew-row{display:flex;align-items:center;gap:.75rem;padding:.8rem;border:1px solid var(--border,#e1e8ee);border-radius:13px}
.crew-icon{display:grid;place-items:center;flex:0 0 36px;height:36px;border-radius:10px;color:#fff;background:#174f78;font-size:.78rem;font-weight:900}
.crew-row div{min-width:0}.crew-row small,.crew-row strong,.crew-row span{display:block}.crew-row small{color:var(--muted,#64748b);font-size:.69rem;text-transform:uppercase}.crew-row span{margin-top:.15rem;color:var(--muted,#64748b);font-size:.78rem}.vacant{color:#7c8b98!important;font-weight:600!important}
.vehicle-notes{margin:.9rem 0 0;padding:.75rem;border-radius:10px;color:var(--muted,#64748b);background:var(--soft,#f5f7f9);font-size:.82rem}
.vehicle-join-form{margin-top:1rem;padding-top:1rem;border-top:1px solid var(--border,#e2e8f0)}.vehicle-join-form input{width:100%;margin-bottom:.7rem}.vehicle-join-form>div{display:flex;gap:.55rem;flex-wrap:wrap}
.vehicle-self-marker{margin-top:1rem;padding:.75rem;border:1px solid rgba(34,160,107,.25);border-radius:10px;color:#168153;background:rgba(34,160,107,.1);font-weight:700;text-align:center}
.vehicle-current-panel{margin-bottom:1.2rem}.vehicle-current-form{display:grid;grid-template-columns:1fr 2fr auto;align-items:end;gap:.8rem;margin-bottom:.85rem}.vehicle-current-form label{margin:0}
.vehicle-management-grid{display:grid;grid-template-columns:minmax(320px,.8fr) minmax(0,1.4fr);gap:1.1rem;align-items:start}
.form-span{grid-column:1/-1}.checkbox-row{display:flex!important;align-items:center;gap:.6rem}.checkbox-row input{width:auto!important}
.vehicle-admin-list{display:grid;gap:.8rem}.vehicle-admin-row{padding:1rem;border:1px solid var(--border,#e0e7ed);border-radius:14px;background:var(--soft,#f8fafb)}
.vehicle-admin-title{display:flex;align-items:flex-start;justify-content:space-between;gap:.8rem}.vehicle-admin-title strong,.vehicle-admin-title span{display:block}.vehicle-admin-title>div>span{margin-top:.18rem;color:var(--muted,#64748b);font-size:.8rem}
.vehicle-admin-crew{display:flex;gap:.5rem;flex-wrap:wrap;margin:.75rem 0}.vehicle-admin-crew form{display:flex;align-items:center;gap:.45rem;padding:.35rem .55rem;border-radius:9px;background:var(--panel,#fff);font-size:.78rem}.vehicle-admin-crew button{border:0;color:#c33;background:transparent;font-size:1rem;cursor:pointer}
.vehicle-admin-actions{display:flex;gap:.5rem;flex-wrap:wrap}.vehicle-admin-actions form{margin:0}
.button-small{padding:.48rem .7rem!important;font-size:.76rem!important}

html[data-theme="dark"] .vehicle-stat-grid article,
html[data-theme="dark"] .vehicle-card{background:#0c2031;border-color:#294257;color:#e9f2f8;box-shadow:0 12px 34px rgba(0,0,0,.22)}
html[data-theme="dark"] .vehicle-stat-grid strong,
html[data-theme="dark"] .vehicle-card h2{color:#f2f7fa}
html[data-theme="dark"] .vehicle-meta span,
html[data-theme="dark"] .vehicle-notes,
html[data-theme="dark"] .vehicle-admin-row{background:#10283b;border-color:#2a4357}
html[data-theme="dark"] .crew-row{border-color:#29465c;background:#0f273a}
html[data-theme="dark"] .vehicle-admin-crew form{background:#0b1f30;border:1px solid #284157}
html[data-theme="dark"] .vehicle-status.status-available{color:#63dda2}
html[data-theme="dark"] .vehicle-status.status-patrol{color:#71c8ff}
html[data-theme="dark"] .vehicle-status.status-operation{color:#ff8d99}
html[data-theme="dark"] .vehicle-status.status-pause{color:#ffd36c}
html[data-theme="dark"] .vehicle-status.status-out_of_service{color:#b8c3cd}

@media(max-width:1050px){.vehicle-management-grid{grid-template-columns:1fr}.vehicle-roster-grid{grid-template-columns:1fr}}
@media(max-width:700px){.vehicle-stat-grid{grid-template-columns:repeat(2,1fr)}.vehicle-current-form{grid-template-columns:1fr}.vehicle-meta{grid-template-columns:1fr}.vehicle-card>header{flex-direction:column}.vehicle-admin-title{flex-direction:column}}


/* =========================================================
   Fahrzeugraster V2 – freie Tabellenansicht
   ========================================================= */
.vehicle-page-heading{align-items:center}
.vehicle-heading-actions{display:flex;gap:.65rem;flex-wrap:wrap}
.vehicle-stat-grid.compact article{position:relative;overflow:hidden}
.vehicle-stat-grid.compact article:after{content:"";position:absolute;right:-18px;bottom:-18px;width:72px;height:72px;border-radius:50%;background:rgba(47,128,197,.08)}
.vehicle-table-panel{padding:0!important;overflow:hidden}
.vehicle-table-toolbar{display:flex;align-items:center;gap:.8rem;padding:1rem;border-bottom:1px solid var(--border,#dde5ec);background:var(--panel,#fff)}
.vehicle-search{display:flex;align-items:center;gap:.55rem;flex:1;min-width:220px;padding:.1rem .7rem;border:1px solid var(--border,#d8e1e8);border-radius:11px;background:var(--soft,#f6f8fa)}
.vehicle-search span{font-size:1.3rem;color:var(--muted,#64748b)}
.vehicle-search input{width:100%;padding:.65rem 0;border:0!important;outline:0;background:transparent!important;box-shadow:none!important}
.vehicle-filter-group{display:flex;gap:.3rem;padding:.25rem;border-radius:10px;background:var(--soft,#f1f5f8)}
.vehicle-filter-group button{padding:.48rem .7rem;border:0;border-radius:8px;color:var(--muted,#64748b);background:transparent;font-size:.75rem;font-weight:800;cursor:pointer}
.vehicle-filter-group button.is-active{color:#fff;background:#1e6fa9;box-shadow:0 4px 12px rgba(30,111,169,.22)}
.vehicle-live-indicator{display:flex;align-items:center;gap:.4rem;color:var(--muted,#64748b);font-size:.75rem;white-space:nowrap}
.vehicle-live-indicator i{width:8px;height:8px;border-radius:50%;background:#22a06b;box-shadow:0 0 0 4px rgba(34,160,107,.13);animation:rosterPulse 1.8s infinite}
@keyframes rosterPulse{50%{box-shadow:0 0 0 8px rgba(34,160,107,0)}}
.vehicle-table-wrap{overflow-x:auto}
.vehicle-roster-table{width:100%;min-width:1120px;border-collapse:collapse}
.vehicle-roster-table th{padding:.78rem .9rem;color:var(--muted,#607282);background:var(--soft,#f6f8fa);font-size:.68rem;letter-spacing:.08em;text-align:left;text-transform:uppercase;white-space:nowrap}
.vehicle-roster-table td{padding:.9rem;border-top:1px solid var(--border,#e3e9ee);vertical-align:middle;font-size:.83rem}
.vehicle-roster-table tbody tr{position:relative;transition:background .16s ease}
.vehicle-roster-table tbody tr:hover{background:rgba(47,128,197,.045)}
.vehicle-roster-table tbody tr.roster-row-status-operation{background:rgba(220,53,69,.035)}
.vehicle-roster-table tbody tr.roster-row-status-operation:hover{background:rgba(220,53,69,.075)}
.callsign-badge{display:inline-flex;min-width:88px;justify-content:center;padding:.43rem .62rem;border-radius:9px;color:#fff;font-weight:900;letter-spacing:.04em;box-shadow:0 5px 12px rgba(0,0,0,.1)}
.callsign-adam{background:linear-gradient(135deg,#1d6ca4,#3192d3)}
.callsign-lincoln{background:linear-gradient(135deg,#6046a6,#8a68d0)}
.plate-badge{display:inline-block;padding:.32rem .52rem;border:1px solid #adb9c4;border-radius:6px;color:#142b3e;background:#f7fafc;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-weight:900;letter-spacing:.06em}
.officer-cell{display:flex;align-items:center;gap:.6rem;min-width:190px}
.officer-avatar{display:grid;place-items:center;flex:0 0 34px;height:34px;border-radius:9px;color:#fff;background:linear-gradient(135deg,#173e5b,#2f7dad);font-weight:900}
.officer-cell strong,.officer-cell small{display:block}.officer-cell small,.duration-label{margin-top:.14rem;color:var(--muted,#6b7b89);font-size:.7rem}
.no-partner{color:var(--muted,#7a8995);font-style:italic}
.vehicle-status.status-ready{color:#176ca7;background:rgba(47,128,197,.15)}
.vehicle-status.status-defect{color:#4e5b67;background:rgba(61,72,82,.14)}
.table-actions-column{width:84px;text-align:center!important}
.table-action-buttons{display:flex;align-items:center;justify-content:center;gap:.35rem}
.table-action-buttons a,.table-action-buttons button{display:grid;place-items:center;width:31px;height:31px;padding:0;border:1px solid var(--border,#dce4ea);border-radius:8px;color:inherit;background:var(--panel,#fff);text-decoration:none;cursor:pointer}
.table-action-buttons form{margin:0}.table-action-buttons button:hover,.table-action-buttons a:hover{border-color:#3187c5;background:rgba(49,135,197,.08)}
.locked-action{display:block;text-align:center;opacity:.45}
.vehicle-empty-state{display:grid;place-items:center;padding:3rem;text-align:center}.vehicle-empty-state>span{font-size:2rem}.vehicle-empty-state strong{margin-top:.65rem;font-size:1rem}.vehicle-empty-state p{margin:.3rem 0;color:var(--muted,#64748b)}
.vehicle-no-results{padding:2rem;color:var(--muted,#64748b);text-align:center}

.roster-modal{position:fixed;inset:0;z-index:1000;display:none;align-items:flex-start;justify-content:center;padding:4vh 1rem;overflow-y:auto}
.roster-modal.is-open{display:flex}
.roster-modal-backdrop{position:fixed;inset:0;background:rgba(2,12,21,.72);backdrop-filter:blur(7px)}
.roster-modal-dialog{position:relative;width:min(780px,100%);margin:auto;border:1px solid rgba(255,255,255,.14);border-radius:20px;background:var(--panel,#fff);box-shadow:0 28px 90px rgba(0,0,0,.36);animation:rosterModalIn .2s ease}
@keyframes rosterModalIn{from{opacity:0;transform:translateY(14px) scale(.985)}}
.roster-modal-dialog>header{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;padding:1.4rem 1.5rem;border-bottom:1px solid var(--border,#dfe7ed)}
.roster-modal-dialog h2{margin:.2rem 0}.roster-modal-dialog header p{margin:.25rem 0 0;color:var(--muted,#64748b)}
.roster-modal-close{display:grid;place-items:center;flex:0 0 38px;height:38px;border:1px solid var(--border,#dce5eb);border-radius:10px;color:var(--text,#173149);background:var(--soft,#f3f6f8);font-size:1.5rem;cursor:pointer}
.roster-entry-form{padding:1.35rem 1.5rem}.roster-form-section{padding:1rem 0;border-bottom:1px solid var(--border,#e2e8ed)}
.roster-form-section:first-child{padding-top:0}.roster-form-section-title{display:flex;align-items:center;gap:.7rem;margin-bottom:.85rem}
.roster-form-section-title>span{display:grid;place-items:center;width:30px;height:30px;border-radius:8px;color:#fff;background:#1d6fa8;font-size:.72rem;font-weight:900}
.roster-form-section-title strong,.roster-form-section-title small{display:block}.roster-form-section-title small{margin-top:.12rem;color:var(--muted,#657685);font-size:.72rem}
.roster-two-columns{display:grid;grid-template-columns:1fr 1fr;gap:.85rem}.roster-form-full{grid-column:1/-1}
.field-help{display:block;margin-top:.35rem;color:var(--muted,#657685)}
.roster-entry-form footer{display:flex;justify-content:flex-end;gap:.65rem;padding-top:1.2rem}
body.modal-open{overflow:hidden}

.vehicle-history-list{display:grid;gap:.65rem}
.vehicle-history-list article{display:grid;grid-template-columns:minmax(180px,1.3fr) minmax(140px,1fr) minmax(140px,1fr) auto;align-items:center;gap:1rem;padding:.85rem;border:1px solid var(--border,#dfe6ec);border-radius:12px;background:var(--soft,#f7f9fa)}
.vehicle-history-list article>div>strong,.vehicle-history-list article>div>span,.vehicle-history-list article>div>small{display:block}
.vehicle-history-list article>div>span,.vehicle-history-list article>div>small{color:var(--muted,#64748b);font-size:.72rem}
.vehicle-history-list.is-archive article{opacity:.85}
.vehicle-history-actions{display:flex;gap:.4rem}.vehicle-history-actions form{margin:0}

html[data-theme="dark"] .vehicle-table-toolbar,
html[data-theme="dark"] .roster-modal-dialog{background:#0c2031;border-color:#294357;color:#eaf3f8}
html[data-theme="dark"] .vehicle-search,
html[data-theme="dark"] .vehicle-filter-group,
html[data-theme="dark"] .vehicle-roster-table th,
html[data-theme="dark"] .roster-modal-close,
html[data-theme="dark"] .vehicle-history-list article{background:#10283b;border-color:#29465a;color:#e8f1f6}
html[data-theme="dark"] .vehicle-roster-table td,
html[data-theme="dark"] .roster-modal-dialog>header,
html[data-theme="dark"] .roster-form-section{border-color:#294357}
html[data-theme="dark"] .vehicle-roster-table tbody tr:hover{background:rgba(85,171,229,.075)}
html[data-theme="dark"] .plate-badge{color:#dce9f1;background:#142d40;border-color:#476075}
html[data-theme="dark"] .table-action-buttons a,
html[data-theme="dark"] .table-action-buttons button{color:#e8f2f7;background:#10283b;border-color:#345167}
html[data-theme="dark"] .vehicle-status.status-ready{color:#75caff}
html[data-theme="dark"] .vehicle-status.status-defect{color:#bcc7cf}

@media(max-width:1050px){
  .vehicle-table-toolbar{align-items:stretch;flex-wrap:wrap}
  .vehicle-search{flex-basis:100%}
  .vehicle-live-indicator{margin-left:auto}
}
@media(max-width:700px){
  .vehicle-heading-actions{width:100%}.vehicle-heading-actions .button{flex:1;text-align:center}
  .roster-two-columns{grid-template-columns:1fr}.roster-form-full{grid-column:auto}
  .roster-modal{padding:0}.roster-modal-dialog{min-height:100%;border-radius:0}
  .roster-entry-form footer{flex-direction:column-reverse}.roster-entry-form footer .button{width:100%}
  .vehicle-history-list article{grid-template-columns:1fr}.vehicle-history-actions{flex-wrap:wrap}
}

.vehicle-refresh-button{border:0;background:transparent;cursor:pointer;font:inherit;padding:.4rem .25rem}
.vehicle-refresh-button:hover{color:var(--text,#173149)}