/* =========================================================
   WAS Fixes
   Finale Korrekturen für Chancenrechner
========================================================= */

/* =========================================================
   Chancenrechner Schultyp Direktauswahl
========================================================= */

.schultyp-direkt-button {
    display: grid !important;
    grid-template-columns: 110px 1fr auto !important;
    align-items: center !important;
    gap: 20px !important;
    width: 100% !important;
    background: white !important;
    border: 2px solid #d4dde8 !important;
    border-radius: 14px !important;
    padding: 20px 24px !important;
    min-height: 88px !important;
    transition: all 0.18s ease !important;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04) !important;
    text-decoration: none !important;
    color: inherit !important;
    margin-bottom: 14px !important;
}

    .schultyp-direkt-button:hover {
        border-color: #2563eb !important;
        background: #f0f6ff !important;
        transform: translateY(-1px) !important;
        box-shadow: 0 8px 18px rgba(37, 99, 235, 0.12) !important;
        color: inherit !important;
        text-decoration: none !important;
    }

.schultyp-kuerzel {
    font-size: 34px !important;
    color: #111827 !important;
    line-height: 1 !important;
    font-weight: 800 !important;
}

.schultyp-beschreibung {
    color: #4b5563 !important;
    font-size: 17px !important;
    line-height: 1.4 !important;
}

.schultyp-anzahl {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 130px !important;
    padding: 9px 14px !important;
    border-radius: 999px !important;
    background: #eef2ff !important;
    color: #1d4ed8 !important;
    font-style: normal !important;
    font-weight: 800 !important;
    font-size: 15px !important;
    white-space: nowrap !important;
}

/* =========================================================
   Button "Chance berechnen"
========================================================= */

.rechner-card .button-zeile {
    margin-top: 18px !important;
    display: flex !important;
    justify-content: flex-start !important;
}

    .rechner-card .button-zeile > button.btn-chance,
    .rechner-card button.btn-chance[type="submit"] {
        appearance: none !important;
        -webkit-appearance: none !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 8px !important;
        min-width: 210px !important;
        padding: 14px 24px !important;
        border: none !important;
        border-radius: 14px !important;
        background: linear-gradient(135deg, #2563eb, #1d4ed8) !important;
        color: white !important;
        font-family: Arial, Helvetica, sans-serif !important;
        font-size: 16px !important;
        font-weight: 800 !important;
        line-height: 1.2 !important;
        cursor: pointer !important;
        text-decoration: none !important;
        box-shadow: 0 8px 18px rgba(37, 99, 235, 0.24) !important;
        transition: all 0.18s ease !important;
    }

        .rechner-card .button-zeile > button.btn-chance:hover,
        .rechner-card button.btn-chance[type="submit"]:hover {
            background: linear-gradient(135deg, #1d4ed8, #1e40af) !important;
            color: white !important;
            transform: translateY(-1px) !important;
            box-shadow: 0 10px 22px rgba(37, 99, 235, 0.30) !important;
        }

        .rechner-card .button-zeile > button.btn-chance:active,
        .rechner-card button.btn-chance[type="submit"]:active {
            transform: translateY(0) !important;
            box-shadow: 0 5px 12px rgba(37, 99, 235, 0.24) !important;
        }

        .rechner-card .button-zeile > button.btn-chance:focus,
        .rechner-card button.btn-chance[type="submit"]:focus {
            outline: none !important;
            box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.18), 0 8px 18px rgba(37, 99, 235, 0.24) !important;
        }

        .rechner-card .button-zeile > button.btn-chance::after,
        .rechner-card button.btn-chance[type="submit"]::after {
            content: "→" !important;
            font-size: 17px !important;
            font-weight: 900 !important;
        }

/* =========================================================
   Ergebnisfenster Button nicht verändern
========================================================= */

.ergebnis-modal .btn-chance {
    min-width: auto !important;
    padding: 13px 22px !important;
    border-radius: 10px !important;
    background: #2563eb !important;
    color: white !important;
    box-shadow: none !important;
}

    .ergebnis-modal .btn-chance:hover {
        background: #1d4ed8 !important;
        color: white !important;
        transform: none !important;
    }

    .ergebnis-modal .btn-chance::after {
        content: "" !important;
    }

/* =========================================================
   Responsive
========================================================= */

@media (max-width: 800px) {
    .schultyp-direkt-button {
        grid-template-columns: 1fr !important;
        gap: 8px !important;
    }

    .schultyp-anzahl {
        width: fit-content !important;
    }
}

/* =========================================================
   Zubringerschulen Übersicht
========================================================= */

.zubringer-navigation {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 18px 0;
}

    .zubringer-navigation a {
        display: inline-block;
        background: #f8fafc;
        border: 1px solid #dbe3ee;
        border-radius: 10px;
        padding: 9px 13px;
        color: #1d4ed8;
        text-decoration: none;
        font-weight: 700;
        font-size: 14px;
    }

        .zubringer-navigation a:hover {
            background: #eff6ff;
            border-color: #2563eb;
        }

        .zubringer-navigation a.aktiv {
            background: #2563eb;
            border-color: #2563eb;
            color: white;
        }

.zubringer-hinweisbox {
    background: #eff6ff;
    border-left: 6px solid #2563eb;
    border-radius: 10px;
    padding: 14px 16px;
    margin: 16px 0 22px 0;
    color: #1e3a8a;
}

.zubringer-tabelle {
    width: 100%;
    border-collapse: collapse;
    background: white;
    margin-top: 14px;
}

    .zubringer-tabelle th {
        background: #f1f5f9;
        color: #111827;
        border: 1px solid #cbd5e1;
        padding: 10px;
        text-align: left;
    }

    .zubringer-tabelle td {
        border: 1px solid #dbe3ee;
        padding: 10px;
        vertical-align: top;
    }

    .zubringer-tabelle tr:nth-child(even) {
        background: #f8fafc;
    }

.zubringer-status {
    display: inline-block;
    border-radius: 999px;
    padding: 5px 9px;
    font-size: 13px;
    font-weight: 800;
}

    .zubringer-status.aufgenommen,
    .status-mini.aufgenommen {
        background: #dcfce7;
        color: #15803d;
    }

    .zubringer-status.abgewiesen,
    .status-mini.abgewiesen {
        background: #fee2e2;
        color: #b91c1c;
    }

    .zubringer-status.offen,
    .status-mini.offen {
        background: #fef3c7;
        color: #92400e;
    }

    .zubringer-status.anderer-weg {
        background: #ede9fe;
        color: #6d28d9;
    }

    .zubringer-status.ohne-anmeldung {
        background: #e5e7eb;
        color: #374151;
    }

.zubringer-wunschliste {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.zubringer-wunsch {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
}

    .zubringer-wunsch strong {
        color: #111827;
    }

.status-mini {
    border-radius: 999px;
    padding: 3px 7px;
    font-size: 12px;
    font-style: normal;
    font-weight: 800;
}

/* =========================================================
   Zubringerschulen Ohne Anmeldung
========================================================= */

.zubringer-erfolg {
    background: #ecfdf5;
    border-left: 6px solid #16a34a;
    color: #14532d;
    border-radius: 10px;
    padding: 14px 16px;
    margin: 16px 0;
    font-weight: 800;
}

.zubringer-ohne-tabelle {
    width: 100%;
    border-collapse: collapse;
    background: white;
    margin-top: 14px;
}

    .zubringer-ohne-tabelle th {
        background: #f1f5f9;
        color: #111827;
        border: 1px solid #cbd5e1;
        padding: 10px;
        text-align: left;
    }

    .zubringer-ohne-tabelle td {
        border: 1px solid #dbe3ee;
        padding: 10px;
        vertical-align: middle;
    }

    .zubringer-ohne-tabelle tr:nth-child(even) {
        background: #f8fafc;
    }

.anderer-weg-checkbox {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    font-weight: 700;
    color: #374151;
}

    .anderer-weg-checkbox input {
        width: 18px;
        height: 18px;
        cursor: pointer;
    }

.zubringer-speichern-zeile {
    margin: 16px 0;
}

.btn-zubringer-speichern {
    appearance: none;
    -webkit-appearance: none;
    background: linear-gradient(135deg, #f59e0b, #d97706);
    color: white;
    border: none;
    border-radius: 10px;
    padding: 11px 22px;
    font-weight: 800;
    font-size: 15px;
    cursor: pointer;
    box-shadow: 0 6px 14px rgba(217, 119, 6, 0.22);
}

    .btn-zubringer-speichern:hover {
        background: linear-gradient(135deg, #d97706, #b45309);
    }

/* =========================================================
   Zubringerschulen Buchungen
========================================================= */

.zubringer-statistik-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 12px;
    margin: 18px 0;
}

.zubringer-statistik-card {
    background: #f8fafc;
    border: 1px solid #dbe3ee;
    border-radius: 14px;
    padding: 16px;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04);
}

    .zubringer-statistik-card span {
        display: block;
        color: #64748b;
        font-size: 14px;
        margin-bottom: 6px;
    }

    .zubringer-statistik-card strong {
        display: block;
        color: #111827;
        font-size: 30px;
        line-height: 1;
    }

.btn-zubringer-download {
    appearance: none;
    -webkit-appearance: none;
    background: linear-gradient(135deg, #2563eb, #1d4ed8);
    color: white;
    border: none;
    border-radius: 12px;
    padding: 13px 22px;
    font-weight: 800;
    font-size: 15px;
    cursor: pointer;
    box-shadow: 0 8px 18px rgba(37, 99, 235, 0.22);
    margin: 8px 0 24px 0;
}

    .btn-zubringer-download:hover {
        background: linear-gradient(135deg, #1d4ed8, #1e40af);
    }

/* =========================================================
   Zielschulen Aktionsbereich
========================================================= */

.zielschulen-altbereich {
    max-width: 1200px;
}

.ziel-aktionen-grid {
    margin-top: 28px;
    border-top: 1px solid #111;
    border-bottom: 1px solid #111;
    padding: 26px 0;
}

.ziel-aktionen-zeile {
    display: grid;
    grid-template-columns: 170px repeat(4, minmax(150px, 1fr));
    align-items: center;
    gap: 18px;
    min-height: 54px;
}

.ziel-aktionen-kategorie {
    font-weight: 800;
    color: #000;
}

.ziel-aktion {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #b91c1c;
    text-decoration: none;
    font-size: 15px;
}

    .ziel-aktion:hover {
        color: #7f1d1d;
        text-decoration: underline;
    }

    .ziel-aktion span {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 24px;
        height: 24px;
        border: 1px solid #b91c1c;
        border-radius: 4px;
        color: #b91c1c;
        font-weight: 800;
        font-size: 14px;
    }

@media (max-width: 900px) {
    .ziel-aktionen-zeile {
        grid-template-columns: 1fr;
        gap: 8px;
        padding: 12px 0;
        border-bottom: 1px solid #e5e7eb;
    }

    .ziel-aktionen-kategorie {
        margin-bottom: 4px;
    }
}

/* =========================================================
   Zielschulen Erstwunsch
========================================================= */

.ziel-aktionen-grid.kompakt {
    margin-top: 18px;
    padding: 22px 0;
}

.ziel-hinweisbox {
    background: #eff6ff;
    border-left: 6px solid #2563eb;
    border-radius: 10px;
    padding: 14px 16px;
    margin: 20px 0;
    color: #1e3a8a;
}

.ziel-statistik-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
    gap: 12px;
    margin: 18px 0 24px 0;
}

.ziel-statistik-card {
    background: #f8fafc;
    border: 1px solid #dbe3ee;
    border-radius: 14px;
    padding: 16px;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04);
}

    .ziel-statistik-card span {
        display: block;
        color: #64748b;
        font-size: 14px;
        margin-bottom: 6px;
    }

    .ziel-statistik-card strong {
        display: block;
        color: #111827;
        font-size: 30px;
        line-height: 1;
    }

.ziel-legende {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    border: 1px solid #111;
    margin: 10px 0 26px 0;
    max-width: 960px;
}

    .ziel-legende div {
        border-right: 1px solid #111;
        border-bottom: 1px solid #111;
        padding: 10px;
        background: #fff7ed;
    }

.legende-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border: 1px solid #111;
    border-radius: 4px;
    margin-right: 6px;
    font-weight: 800;
}

    .legende-icon.aufgenommen {
        border-color: #16a34a;
        color: #16a34a;
    }

    .legende-icon.abgewiesen,
    .legende-icon.hinweis {
        border-color: #dc2626;
        color: #dc2626;
    }

.ziel-tabelle {
    width: 100%;
    border-collapse: collapse;
    background: white;
    margin-top: 14px;
}

    .ziel-tabelle th {
        background: #f1f5f9;
        color: #111827;
        border: 1px solid #cbd5e1;
        padding: 10px;
        text-align: left;
    }

    .ziel-tabelle td {
        border: 1px solid #dbe3ee;
        padding: 10px;
        vertical-align: top;
    }

    .ziel-tabelle tr:nth-child(even) {
        background: #f8fafc;
    }

.ziel-status {
    display: inline-block;
    border-radius: 999px;
    padding: 5px 9px;
    font-size: 13px;
    font-weight: 800;
}

    .ziel-status.aufgenommen {
        background: #dcfce7;
        color: #15803d;
    }

    .ziel-status.abgewiesen {
        background: #fee2e2;
        color: #b91c1c;
    }

    .ziel-status.offen {
        background: #fef3c7;
        color: #92400e;
    }

    .ziel-status.unbekannt {
        background: #e5e7eb;
        color: #374151;
    }

.ziel-mini-info {
    margin-top: 4px;
    display: inline-block;
    background: #eef2ff;
    color: #1d4ed8;
    border-radius: 999px;
    padding: 3px 7px;
    font-size: 12px;
    font-weight: 800;
}

    .ziel-mini-info.anderer-weg {
        background: #ede9fe;
        color: #6d28d9;
    }

.ziel-tabellen-aktionen {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}

    .ziel-tabellen-aktionen button {
        appearance: none;
        -webkit-appearance: none;
        border: 1px solid #cbd5e1;
        background: white;
        border-radius: 6px;
        width: 30px;
        height: 30px;
        cursor: pointer;
        font-weight: 800;
    }

        .ziel-tabellen-aktionen button:hover {
            background: #eff6ff;
            border-color: #2563eb;
            color: #1d4ed8;
        }

.ziel-aktion.aktiv {
    font-weight: 900;
    text-decoration: underline;
}

/* =========================================================
   Zielschulen Aufnehmen / Abweisen
========================================================= */

.ziel-erfolg {
    background: #ecfdf5;
    border-left: 6px solid #16a34a;
    color: #14532d;
    border-radius: 10px;
    padding: 14px 16px;
    margin: 16px 0;
    font-weight: 800;
}

.ziel-fehler {
    background: #fef2f2;
    border-left: 6px solid #dc2626;
    color: #991b1b;
    border-radius: 10px;
    padding: 14px 16px;
    margin: 16px 0;
    font-weight: 800;
}

.ziel-entscheidungs-aktionen {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

    .ziel-entscheidungs-aktionen form {
        margin: 0;
    }

.ziel-button-aufnehmen,
.ziel-button-abweisen {
    appearance: none;
    -webkit-appearance: none;
    border: none;
    border-radius: 8px;
    padding: 8px 11px;
    font-weight: 800;
    font-size: 13px;
    cursor: pointer;
    font-family: Arial, Helvetica, sans-serif;
}

.ziel-button-aufnehmen {
    background: #dcfce7;
    color: #15803d;
    border: 1px solid #86efac;
}

    .ziel-button-aufnehmen:hover {
        background: #bbf7d0;
    }

.ziel-button-abweisen {
    background: #fee2e2;
    color: #b91c1c;
    border: 1px solid #fca5a5;
}

    .ziel-button-abweisen:hover {
        background: #fecaca;
    }

/* =========================================================
   Zielschulen Reihung
========================================================= */

.btn-ziel-export {
    appearance: none;
    -webkit-appearance: none;
    background: linear-gradient(135deg, #2563eb, #1d4ed8);
    color: white;
    border: none;
    border-radius: 12px;
    padding: 13px 22px;
    font-weight: 800;
    font-size: 15px;
    cursor: pointer;
    box-shadow: 0 8px 18px rgba(37, 99, 235, 0.22);
    margin: 8px 0 24px 0;
}

    .btn-ziel-export:hover {
        background: linear-gradient(135deg, #1d4ed8, #1e40af);
    }

/* =========================================================
   Zielschulen Buchungen Suche
========================================================= */

.ziel-suchformular {
    background: #f8fafc;
    border: 1px solid #dbe3ee;
    border-radius: 14px;
    padding: 16px;
    margin: 18px 0;
}

    .ziel-suchformular input {
        width: 100%;
        max-width: 620px;
        padding: 10px 12px;
        border: 1px solid #cbd5e1;
        border-radius: 10px;
        font-size: 15px;
    }

.ziel-such-buttons {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    align-items: center;
}

/* =========================================================
   Footer besser lesbar machen
========================================================= */

footer,
.footer,
footer *,
.footer * {
    color: white !important;
}

    footer a,
    .footer a {
        color: white !important;
        text-decoration: underline;
    }

        footer a:hover,
        .footer a:hover {
            color: #dbeafe !important;
        }

/* =========================================================
   Tabellen in Zielschulen und Zubringerschulen lesbar
========================================================= */

.zielschulen-altbereich table,
*zielschulen-altbereich table th,
.zielschulen-altbereich table td,
.zubringer-tabelle,
.zubringer-tabelle th,
.zubringer-tabelle td,
.zubringer-ohne-tabelle,
.zubringer-ohne-tabelle th,
.zubringer-ohne-tabelle td {
    color: #111827 !important;
}

/* =========================================================
   Tag der offenen Tür öffentlich
========================================================= */

.offene-tuer-grid {
    display * grid;
    grid-template-columns: *epeat(auto-fit, minmax(320px, 1fr)*;
    gap: 18px;
    margin-top: 2*px;
}

.offene-tuer-card {
    bac *ground: rgba(255, 255, 255, 0.96);
    *    border: 1px solid #dbe3ee;
    *border-radius: 16px;
    padding: *0px;
    box-shadow: 0 4px 12px rg*a(15, 23, 42, 0.08);
    color: #1*1827;
}

    .offene-tuer-card h2 {
        * margin: 0 0 6px 0;
        color: #11*827;
        font-size: 22px;
    }

.offe*e-tuer-skz {
    color: #64748b;
    *  font-size: 14px;
    margin-bott *m: 14px;
}

.offene-tuer-details p* {
    margin: 8px 0;
    color: #1*2937;
    line-height: 1.45;
}

.o*fene-tuer-details a {
    color: #1d4ed8;
    font-weight: 700;
}

.offene-tuer-details a:hover {
    color: #1e40af;
}

/* =========================================================
   Tag der offenen Tür Auswahl
========================================================= */

.offene-tuer-auswahlbox* {
    background * rgba(255, 255, 255, 0.96*;
    border * 1px solid #dbe3ee;
    border-rad *us: 16px;
    padding: 18px;
    *   margin: 18px 0;
    box *shadow: 0 3px*10px rgba(15, 23, 42, 0.05);
}

.o*fene*tuer-auswahlbox h2* {
    margin: 0 0 12px 0;
    colo *: #111827;
    font-size: 22px;
}

*.offene-tuer-formular {
    displa *: flex;
    flex-direction: column* gap: 10px;
    margin-bottom: *14px;
}

.offene-tuer-formular lab*l {
    color: #111827;
    font-w *ight: 800;
}

.offene-tuer-select *
width: 100%;
max-width: 6*0px;
padding: 10px 12px;
b*rder: 1px solid #cbd5e1;
borde*-radius: 10px;
background: whi*e;
color: #111827;
font-si*e: 15px;
}

.offene-tuer-formular *btn-ziel-export,
.offene-tuer-formular .btn-ziel-zurueck {
    width: fit-content;
}

/* =========================================================
   Bildungsdirektion moderner Aktionsbereich
========================================================= */

.bd-modern-bereich {
    max-wi *th: 1100px !important;
    margin: *0 auto !important;
}

.bd-modern-h*ader {
    background: linear-grad*ent(135deg, #f8fafc, #eef6ff) !imp*rtant;
    border: 1px solid #dbe3*e !important;
    border-radius: 1*px !important;
    padding: 26px !*mportant;
    margin-bottom: 22px *important;
    box-shadow: 0 5px 1*px rgba(15, 23, 42, 0.06) !importa*t;
}

.bd-modern-badge {
    displ *y: inline-block !important;
    ba *kground: #dbeafe !important;
    c *lor: #1d4ed8 !important;
    paddi *g: 6px 12px !important;
    border *radius: 999px !important;
    font *size: 12px !important;
    font-we *ght: 900 !important;
    margin-bo *tom: 12px !important;
}

.bd-moder*-header h1 {
    margin: 0 !import*nt;
    color: #111827 !important;
    *    font-size: 38px !important;
    * line-height: 1.15 !important;
    *font-weight: 800 !important;
}

.b*-modern-header p {
    max-width: *80px !important;
    margin: 12px * 0 0 !important;
    color: #4b556* !important;
    font-size: 15px !*mportant;
    line-height: 1.55 !i*portant;
}

.bd-modern-section {
    *  background: rgba(255, 255, 255, *.96) !important;
    border: 1px s*lid #dbe3ee !important;
    border *radius: 18px !important;
    paddi *g: 22px !important;
    margin-bot *om: 20px !important;
    box-shado *: 0 4px 14px rgba(15, 23, 42, 0.05* !important;
}

.bd-section-title *
display: flex !important;
*align-items: center !important;
* gap: 10px !important;
margin-*ottom: 18px !important;
}

.bd-sec*ion-title span {
    width: 42px !*mportant;
    height: 42px !import*nt;
    background: #eef2ff !impor*ant;
    color: #1d4ed8 !important * border-radius: 12px !importan*;
    display: flex !important;
    * align-items: center !important;
    *  justify-content: center !importa*t;
    font-size: 22px !important;
    *
}

.bd-section-title h2 {
    marg *n: 0 !important;
    color: #11182* !important;
    font-size: 25px !*mportant;
    font-weight: 800 !im*ortant;
}

.bd-action-grid {
    d *splay: grid !important;
    grid-t *mplate-columns: repeat(auto-fit, m*nmax(260px, 1fr)) !important;
    *ap: 14px !important;
}

.bd-action*grid-small {
    grid-template-col *mns: repeat(auto-fit, minmax(260px* 360px)) !important;
}

.bd-action*card {
    display: flex !importan*;
    align-items: center !importa*t;
    gap: 14px !important;
    m *n-height: 92px !important;
    bac *ground: #f8fafc !important;
    bo *der: 1px solid #dbe3ee !important;
    *    border-radius: 15px !important * padding: 16px !important;
    *color: inherit !important;
    tex *-decoration: none !important;
    *ransition: all 0.18s ease !importa*t;
}

.bd-action-card:hover {
    *ackground: #eff6ff !important;
    *border-color: #2563eb !important;
    *   transform: translateY(-1px) !im*ortant;
    box-shadow: 0 8px 20px*rgba(37, 99, 235, 0.12) !important * color: inherit !important;
    * text-decoration: none !important;
    *
}

.bd-action-icon {
    width: 44*x !important;
    height: 44px !im*ortant;
    background: #eef2ff !i*portant;
    color: #1d4ed8 !impor*ant;
    border-radius: 13px !impo*tant;
    display: flex !important * align-items: center !importan*;
    justify-content: center !imp*rtant;
    font-size: 22px !import*nt;
    flex-shrink: 0 !important;
    *
}

.bd-action-card h3 {
    margin * 0 !important;
    color: #111827 *important;
    font-size: 17px !im*ortant;
    font-weight: 800 !important;
}

.bd-action-card p {
    margin: 4px 0 0 0 !important;
    color: #64748b !important;
    font-size: 13px !important;
    line-height: 1.35 !important;
}

.bd-action-card-logout {
    border-color: #fecaca !important;
    background: #fff7f7 !important;
}

    .bd-action-card-logout:hover {
        background: #fef2f2 !important;
        border-color: #dc2626 !important;
    }

    .bd-action-card-logout .bd-action-icon {
        background: #fee2e2 !important;
        color: #b91c1c !important;
    }

/* =========================================================
   Einheitlicher moderner Arbeitsbereich
   Für Zielschulen und weitere Bereiche
========================================================= */

.bereich-modern {
    max-width * 1050px;
    margin: 0 auto;
}

.b*reich-modern-header {
    margin-b *ttom: 18px;
}

.bereich-modern-bad*e {
    display: inline-block;
    *background: #dbeafe;
    color: #1*4ed8;
    padding: 5px 12px;
    b *rder-radius: 999px;
    font-size: *12px;
    font-weight: 800;
    ma *gin-bottom: 10px;
}

.bereich-mode*n-header h1 {
    margin: 0 0 10px*0;
    font-size: 40px;
    line-h *ight: 1.15;
    color: #111827;
    * font-weight: 500;
}

.bereich-mod*rn-header p {
    margin: 0;
    c *lor: #374151;
    font-size: 15px;
    *
}

.bereich-modern h2 {
    margin * 18px 0 12px 0;
    font-size: 30p*;
    color: #111827;
    font-wei *ht: 500;
}

.bereich-modern-liste *
display: flex;
flex-direc*ion: column;
gap: 12px;
}

.be*eich-modern-aktion {
    display: *lex;
    align-items: center;
    *ap: 14px;
    background: #f8fafc;
    *    border-left: 5px solid #2563eb* border-radius: 0;
    padding * 14px 16px;
    text-decoration: n*ne;
    color: inherit;
    transi *ion: all 0.15s ease;
}

.bereich-m*dern-aktion:hover {
    background * #eff6ff;
    border-left-color: #*d4ed8;
    transform: translateX(2*x);
    text-decoration: none;
    *color: inherit;
}

.bereich-modern*icon {
    width: 28px;
    min-wi *th: 28px;
    text-align: center;
    *   font-size: 17px;
}

.bereich-mo*ern-aktion h3 {
    margin: 0;
    *color: #111827;
    font-size: 17p*;
    font-weight: 800;
}

.bereich-modern-aktion p {
    margin: 3px 0 0 0;
    color: #64748b;
    font-size: 13px;
    line-height: 1.35;
}

.bereich-modern-logout {
    border-left-color: #dc2626;
}

    .bereich-modern-logout:hover {
        border-left-color: #b91c1c;
        background: #fef2f2;
    }

@media (max-width: 800px) {
    .bd-modern-header h1,
    .bereich-modern-header h1 {
        font-size: 30px !important;
    }

    .bd-action-grid,
    .bd-action-grid-small {
        grid-template-columns: 1fr !important;
    }

    .bereich-modern h2 {
        font-size: 26px;
    }

    .bereich-modern-aktion {
        align-items: flex-start;
    }
}