:root {
    --farbe-orange: #EE7203;
    --farbe-grau: #c0c0c0;
    --farbe-dunkelblau: #1F2A44;
    --farbe-dunkelblau-hell: #2c3b5d;
    --farbe-text: #1d2433;
    --farbe-text-gedaempft: #42526f;
    --farbe-text-gedaempft-2: #53617b;
    --farbe-text-hell: #718096;
    --farbe-text-link: #1f3f72;
    --farbe-text-orange: #9a5000;
    --farbe-hintergrund: #f4f6f8;
    --textfarbe: var(--farbe-text);
    --farbe-rand: var(--karte-rand);
    --farbe-rahmen: var(--karte-rand);
    --rahmenfarbe: var(--karte-rand);
    --farbe-gruen: var(--farbe-button-erfolg);
    --schriftart: "Open Sans", Arial, Helvetica, sans-serif;
    --schrift-standard: var(--schrift-normal);
    --schrift-klein: var(--schrift-hinweis);
    --farbe-weiss: #ffffff;
    --farbe-fehler: #b42318;
    --farbe-button-primaer: #EE7203;
    --farbe-button-primaer-hover: #d96500;
    --farbe-button-primaer-fokus: rgba(238, 114, 3, 0.22);
    --farbe-button-sekundaer: #e2e9f1;
    --farbe-button-sekundaer-text: #1F2A44;
    --farbe-button-sekundaer-rand: #c6d1df;
    --farbe-button-sekundaer-hover: rgba(238, 114, 3, 0.14);
    --farbe-button-erfolg: #2f7d55;
    --farbe-button-erfolg-hover: #286b49;
    --farbe-button-erfolg-fokus: rgba(47, 125, 85, 0.16);
    --farbe-button-gefahr: #a8463f;
    --farbe-button-gefahr-hover: #913b35;
    --farbe-button-gefahr-fokus: rgba(31, 42, 68, 0.10);
    --schrift-normal: 0.9rem;
    --schrift-feld: var(--schrift-normal);
    --schrift-feldgewicht: 400;
    --schrift-label: var(--schrift-normal);
    --schrift-labelgewicht: 500;
    --schrift-register: var(--schrift-normal);
    --schrift-registergewicht: 500;
    --schrift-kartenkopf: 0.96rem;
    --schrift-kartenkopfgewicht: 560;
    --schrift-karteninnenkopf: 0.92rem;
    --schrift-karteninnenkopfgewicht: 540;
    --schrift-dashboard-kennzahl: 4.4rem;
    --schrift-dashboard-kennzahlgewicht: 800;
    --schrift-hinweis: 0.84rem;
    --schrift-hinweisgewicht: 400;
    --button-hoehe: 28px;
    --button-symbol-hoehe: var(--button-hoehe);
    --button-radius: 6px;
    --button-padding-x: 14px;
    --button-font-size: 0.84rem;
    --button-font-weight: 400;
    --button-deaktiviert-hintergrund: #e8eef5;
    --button-deaktiviert-rand: #c8d4e2;
    --button-deaktiviert-text: #6f7f95;
    --button-symbol-hintergrund: #f5f8fb;
    --button-symbol-rand: #d5dee9;
    --button-symbol-hover: #fff4e9;
    --button-symbol-deaktiviert-hintergrund: var(--button-deaktiviert-hintergrund);
    --button-symbol-deaktiviert-rand: var(--button-deaktiviert-rand);
    --button-symbol-deaktiviert-opacity: 1;
    --button-symbol-icon-groesse: 17px;
    --registerkarte-hoehe: 38px;
    --registerkarte-padding-x: 11px;
    --registerkarte-radius: 6px 6px 0 0;
    --registerkarte-gap: 6px;
    --registerkarte-font-size: calc(var(--schrift-register) - 1px);
    --registerkarte-font-weight: var(--schrift-registergewicht);
    --layout-aussen-innenabstand: 20px;
    --layout-innenabstand: 18px;
    --layout-register-oben: 14px;
    --layout-kartenabstand: 24px;
    --formular-label-font-weight: var(--schrift-labelgewicht);
    --formular-element-hoehe: var(--button-hoehe);
    --tabellen-hauptzeile-hoehe: 56px;
    --zahlenbadge-groesse: 18px;
    --zahlenbadge-radius: 4px;
    --zahlenbadge-hintergrund: rgba(238, 114, 3, 0.82);
    --zahlenbadge-rand: rgba(154, 80, 0, 0.18);
    --zahlenbadge-schriftgroesse: 0.68rem;
    --infobadge-hoehe: 24px;
    --infobadge-radius: 5px;
    --infobadge-hintergrund: rgba(238, 114, 3, 0.12);
    --infobadge-text: var(--farbe-dunkelblau);
    --infobadge-schriftgroesse: 12px;
    --statusbadge-hoehe: 24px;
    --statusbadge-radius: 5px;
    --statusbadge-padding-y: 3px;
    --statusbadge-padding-x: 9px;
    --statusbadge-schriftgroesse: 12px;
    --statusbadge-font-weight: 600;
    --statusbadge-erfolg-hintergrund: #e8f5ee;
    --statusbadge-erfolg-text: #23613d;
    --statusbadge-erfolg-rand: rgba(35, 97, 61, 0.16);
    --statusbadge-warnung-hintergrund: #fff6e8;
    --statusbadge-warnung-text: #8a4b00;
    --statusbadge-warnung-rand: rgba(138, 75, 0, 0.16);
    --statusbadge-fehler-hintergrund: #fff1f0;
    --statusbadge-fehler-text: var(--farbe-fehler);
    --statusbadge-fehler-rand: rgba(180, 35, 24, 0.16);
    --statusbadge-neutral-hintergrund: #e8edf5;
    --statusbadge-neutral-text: #40506c;
    --statusbadge-neutral-rand: rgba(64, 80, 108, 0.18);
    --statusbadge-info-hintergrund: #e8eefb;
    --statusbadge-info-text: var(--farbe-dunkelblau);
    --statusbadge-info-rand: rgba(31, 42, 68, 0.14);
    --farbe-tabellen-hover: #fef7f0;
    --farbe-orange-flaeche: #fff7ef;
    --farbe-orange-flaeche-stark: #fff3e8;
    --farbe-orange-flaeche-zart: #fffaf5;
    --farbe-orange-rand: #f0b46f;
    --farbe-orange-rand-hell: #f0d6bf;
    --farbe-orange-akzent: #f28c28;
    --karte-hintergrund: #f8fafc;
    --karte-inhalt-hintergrund: #ffffff;
    --karte-kopf-hintergrund: #f7f9fc;
    --karte-kopf-ebene-1: #eaf0f7;
    --karte-kopf-ebene-2: #f1f6fb;
    --karte-kopf-ebene-3: var(--karte-kopf-hintergrund);
    --karte-kopf-kalender: #e9f0f8;
    --karte-rand: #d6e1f0;
    --karte-trennlinie: #dfe6f0;
    --karte-flaeche-abgesetzt: #f6f9fd;
    --karte-flaeche-grau: #f4f7fb;
    --karte-flaeche-hell: #eef4fb;
    --karte-feld-hintergrund: #f8fbff;
    --karte-feld-rand: #bfd1e8;
    --kalender-status-aktuell: #f4a261;
    --kalender-blockiert-stark-hintergrund: #f7c9c2;
    --kalender-blockiert-stark-rand: #dc8a7f;
    --planung-status-erfolg-hintergrund: #c9e8d1;
    --planung-status-warnung-hintergrund: #fff1bf;
    --planung-status-fehler-hintergrund: #f6d2cc;
    --planung-status-hinweis-hintergrund: #fff7ed;
    --planung-status-fehler-zart: #fff1f0;
    --planung-status-gruen-akzent: #5ab572;
    --planung-status-neutral-akzent: #6d7b92;
    --farbe-orange-flaeche-intensiv: #ffe8d2;
    --farbe-leerzustand: var(--farbe-tabellen-hover);
    --farbe-tabellen-zeile-ungerade: rgba(255, 255, 255, 0);
    --farbe-tabellen-zeile-gerade: rgba(31, 42, 68, 0.026);
    --menue-breite: 292px;
    --menue-schmal: 78px;
    --leiste-hoehe: 68px;
}

* {
    box-sizing: border-box;
}

[hidden] {
    display: none !important;
}

html,
body {
    min-height: 100%;
    margin: 0;
}

body {
    font-family: "Open Sans", Arial, Helvetica, sans-serif;
    font-size: var(--schrift-normal);
    color: var(--farbe-text);
    background: var(--farbe-hintergrund);
}

a {
    color: inherit;
}

.oeffentliche-startseite {
    min-height: 100vh;
    background:
        url("../bilder/euraka_background_1080p.jpg") center center / cover no-repeat,
        var(--farbe-hintergrund);
}

.startseite-rahmen .anmeldung-kopf {
    margin-bottom: 0;
}

.anmeldeseite {
    min-height: 100vh;
    background:
        url("../bilder/euraka_background_1080p.jpg") center center / cover no-repeat,
        var(--farbe-hintergrund);
}

.hub-externe-seite {
    min-height: 100vh;
    padding: 24px;
    background:
        url("../bilder/euraka_background_1080p.jpg") center center / cover no-repeat,
        var(--farbe-hintergrund);
}

.hub-externe-rahmen {
    margin: 0 auto;
    max-width: 1500px;
}

.anmeldung-rahmen {
    display: flex;
    min-height: 100vh;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 48px 24px;
}

.anmeldung-kopf {
    width: min(380px, 92vw);
    margin-bottom: 34px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
    text-shadow: 0 2px 10px rgba(255, 255, 255, 0.55);
}

.anmeldung-markenzeile {
    width: min(380px, 92vw);
    max-width: 100%;
    display: flex;
    align-items: baseline;
    gap: 0;
    white-space: nowrap;
    font-size: clamp(30px, 9vw, 37px);
}

.anmeldung-marke {
    display: inline-block;
    color: var(--farbe-orange);
    font-size: 1em;
    font-weight: 500;
    line-height: 1.1;
    white-space: nowrap;
}

.anmeldung-hub {
    color: var(--farbe-orange);
    font-size: 0.5em;
    font-weight: 200;
    line-height: 1.1;
}

.anmeldung-titel {
    margin-top: 6px;
    margin-left: 3px;
    color: var(--farbe-dunkelblau);
    font-size: 22px;
    font-weight: 200;
    line-height: 1.1;
}

.anmeldung-formular {
    width: min(380px, 92vw);
    padding: 28px;
    border: 1px solid rgba(31, 42, 68, 0.14);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.94);
    box-shadow: 0 18px 42px rgba(31, 42, 68, 0.22);
}

.turnstile-feld {
    min-height: 65px;
    margin: 4px 0 22px;
    width: 100%;
}

.turnstile-feld .cf-turnstile {
    width: 100%;
}

.turnstile-hinweis {
    display: none;
    margin: 6px 0 0;
    color: var(--farbe-text-gedaempft);
    font-size: var(--schrift-hinweis);
}

.turnstile-feld-wartet .turnstile-hinweis,
.turnstile-feld-fehler .turnstile-hinweis {
    display: block;
}

.turnstile-feld-fehler .turnstile-hinweis {
    color: var(--farbe-fehler);
}

.formular-feld {
    display: block;
    margin-bottom: 16px;
    font-size: var(--schrift-normal);
    font-weight: var(--formular-label-font-weight);
    color: var(--farbe-dunkelblau);
}

.formular-feld span {
    display: block;
    margin-bottom: 7px;
}

.formular-feld input {
    width: 100%;
    height: var(--formular-element-hoehe);
    min-height: var(--formular-element-hoehe);
    border: 1px solid #a9b3c6;
    border-radius: 6px;
    padding: 0 11px;
    font: inherit;
    font-weight: 400;
    color: var(--farbe-text);
}

.formular-feld input[type="file"] {
    box-sizing: border-box;
    padding: 5px 11px 5px 6px;
    line-height: calc(var(--formular-element-hoehe) - 12px);
}

.formular-feld input[type="file"]::file-selector-button {
    height: calc(var(--formular-element-hoehe) - 12px);
    margin: 0 8px 0 0;
    padding: 0 10px;
    vertical-align: middle;
}

.formular-feld select {
    width: 100%;
    height: var(--formular-element-hoehe);
    min-height: var(--formular-element-hoehe);
    border: 1px solid #a9b3c6;
    border-radius: 6px;
    padding: 0 11px;
    background: var(--farbe-weiss);
    font: inherit;
    font-weight: 400;
    color: var(--farbe-text);
}

.formular-feld textarea {
    width: 100%;
    min-height: 110px;
    resize: vertical;
    border: 1px solid #a9b3c6;
    border-radius: 6px;
    padding: 9px 11px;
    font: inherit;
    font-weight: 400;
    color: var(--farbe-text);
}

.formular-feld input:focus {
    border-color: var(--farbe-orange);
    outline: 3px solid rgba(238, 114, 3, 0.18);
}

.formular-feld select:focus {
    border-color: var(--farbe-orange);
    outline: 3px solid rgba(238, 114, 3, 0.18);
}

.formularbereich-inhalt {
    padding: 18px 20px;
}

.formularbereich-inhalt .hinweistext {
    margin: 0 0 16px;
    line-height: 1.45;
}

.formularbereich-inhalt form {
    margin: 0;
}

.formular-feld textarea:focus {
    border-color: var(--farbe-orange);
    outline: 3px solid rgba(238, 114, 3, 0.18);
}

/* Globaler Eingabefeldstandard: einzeilige Felder und Buttons haben projektweit dieselbe Hoehe. */
.admin-seite :where(input:not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="hidden"]):not([type="file"]):not([type="range"]), select) {
    box-sizing: border-box;
    width: 100%;
    height: var(--formular-element-hoehe);
    min-height: var(--formular-element-hoehe);
    border: 1px solid #a9b3c6;
    border-radius: 6px;
    padding: 0 11px;
    background: var(--farbe-weiss);
    font: inherit;
    font-weight: 400;
    color: var(--farbe-text);
}

.admin-seite :where(input:not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="hidden"]):not([type="file"]):not([type="range"]), select, textarea):focus {
    border-color: var(--farbe-orange);
    outline: 3px solid rgba(238, 114, 3, 0.18);
}

.admin-seite :where(textarea) {
    box-sizing: border-box;
    width: 100%;
    min-height: 110px;
    border: 1px solid #a9b3c6;
    border-radius: 6px;
    padding: 9px 11px;
    background: var(--farbe-weiss);
    font: inherit;
    font-weight: 400;
    color: var(--farbe-text);
    resize: vertical;
}

.hub-datumfeld {
    position: relative;
    display: block;
    width: 100%;
}

.admin-seite input.hub-datumfeld-original {
    appearance: none;
    clip-path: inset(50%);
    position: absolute;
    right: 0;
    bottom: 0;
    z-index: 1;
    width: 1px;
    min-height: 1px;
    height: 1px;
    padding: 0;
    border: 0;
    opacity: 0;
    pointer-events: none;
}

.admin-seite input.hub-datumfeld-anzeige {
    box-sizing: border-box;
    display: block;
    padding-right: 42px;
    text-transform: uppercase;
    width: 100%;
}

.hub-datumfeld-schalter {
    position: absolute;
    right: 10px;
    top: 0;
    bottom: 0;
    z-index: 2;
    width: 24px;
    height: 24px;
    min-height: 24px;
    margin: auto 0;
    padding: 0;
    border: 0;
    border-radius: 4px;
    background: transparent;
    color: #5f6b7d;
    cursor: pointer;
    transform: translateY(-3px);
}

.hub-datumfeld-schalter::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    box-sizing: border-box;
    width: 16px;
    height: 16px;
    border: 1.8px solid currentColor;
    border-radius: 2px;
    transform: translate(-50%, -50%);
}

.hub-datumfeld-schalter::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 14px;
    height: 1.8px;
    background: currentColor;
    box-shadow: 3px -5px 0 -1px currentColor, 10px -5px 0 -1px currentColor;
    transform: translate(-50%, 0);
}

.hub-datumfeld-schalter:hover,
.hub-datumfeld-schalter:focus {
    color: var(--farbe-orange);
    outline: 2px solid rgba(238, 114, 3, 0.18);
}

.hub-datum-picker {
    position: absolute;
    z-index: 1000;
    width: 360px;
    max-width: calc(100vw - 24px);
    padding: 14px;
    border: 1px solid rgba(31, 42, 68, 0.16);
    border-radius: 8px;
    background: var(--karte-inhalt-hintergrund);
    box-shadow: 0 18px 42px rgba(31, 42, 68, 0.18);
}

.hub-datum-picker-kopf {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) 38px;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
}

.hub-datum-picker-titel {
    color: var(--farbe-dunkelblau);
    font-size: var(--schrift-normal);
    font-weight: 500;
    text-align: center;
}

.hub-datum-picker-nav {
    display: inline-flex;
    width: 38px;
    height: 38px;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(31, 42, 68, 0.16);
    border-radius: 6px;
    background: #f6f8fb;
    color: var(--farbe-dunkelblau);
    cursor: pointer;
    font: inherit;
    font-size: 26px;
    line-height: 1;
}

.hub-datum-picker-nav:hover,
.hub-datum-picker-nav:focus {
    border-color: rgba(238, 114, 3, 0.42);
    background: #fff4e8;
    color: var(--farbe-orange);
    outline: none;
}

.hub-datum-picker-wochentage,
.hub-datum-picker-tage {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 6px;
}

.hub-datum-picker-wochentage {
    margin-bottom: 6px;
    color: #485879;
    font-size: 12px;
    font-weight: 700;
    text-align: center;
}

.hub-datum-picker-tag {
    display: inline-flex;
    min-height: 38px;
    align-items: center;
    justify-content: center;
    border: 1px solid #d8e0eb;
    border-radius: 6px;
    background: #f6f8fb;
    color: var(--farbe-dunkelblau);
    cursor: pointer;
    font: inherit;
    font-size: 14px;
}

.hub-datum-picker-tag.ist-andere-monat {
    color: #7f8da3;
    background: #ffffff;
}

.hub-datum-picker-tag.ist-heute {
    border-color: var(--farbe-orange);
    background: var(--farbe-orange);
    color: var(--karte-inhalt-hintergrund);
}

.hub-datum-picker-tag.ist-ausgewaehlt {
    border-color: var(--farbe-dunkelblau);
    box-shadow: inset 0 0 0 2px var(--farbe-dunkelblau);
}

.hub-datum-picker-tag:hover,
.hub-datum-picker-tag:focus {
    border-color: var(--farbe-orange);
    outline: 3px solid rgba(238, 114, 3, 0.18);
}

.hub-datum-picker-fuss {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin-top: 12px;
}

.hub-datum-picker-link {
    border: 0;
    padding: 0;
    background: transparent;
    color: var(--farbe-orange);
    cursor: pointer;
    font: inherit;
    font-size: 13px;
    font-weight: 700;
}

.hub-datum-picker-link:hover,
.hub-datum-picker-link:focus {
    text-decoration: underline;
    outline: none;
}
.statusmeldungen-layer {
    position: fixed;
    top: var(--leiste-hoehe);
    right: 0;
    left: var(--menue-breite);
    z-index: 60;
    display: grid;
    gap: 0;
    pointer-events: none;
    overflow: hidden;
}

.statusmeldung {
    justify-self: stretch;
    width: 100%;
    min-height: 54px;
    border: 1px solid transparent;
    border-left-width: 5px;
    border-left-style: solid;
    border-radius: 0;
    padding: 16px 18px;
    box-shadow: 0 14px 34px rgba(31, 42, 68, 0.12);
    font-size: 15px;
    font-weight: 700;
    line-height: 1.35;
    opacity: 0;
    transform: translateY(-100%);
    transition: opacity 360ms ease, transform 360ms ease;
    pointer-events: auto;
}

.statusmeldung.statusmeldung-ist-sichtbar {
    opacity: 1;
    transform: translateY(0);
}

.statusmeldung-erfolg {
    border-color: rgba(47, 133, 90, 0.22);
    border-left-color: #2f855a;
    background: #e8f6ee;
    color: #23613d;
}

.statusmeldung-fehler {
    border-color: rgba(180, 35, 24, 0.22);
    border-left-color: var(--farbe-fehler);
    background: #fff0ef;
    color: var(--farbe-fehler);
}
.statusmeldung-hinweis {
    border-color: rgba(170, 112, 0, 0.24);
    border-left-color: #d28a00;
    background: #fff7df;
    color: #7a4b00;
}

.statusmeldung-wird-ausgeblendet {
    opacity: 0;
    transform: translateY(-100%);
}

.livefilter-debug {
    width: 98%;
    margin: 0 0 18px;
    padding: 14px 18px;
    border: 1px solid rgba(170, 112, 0, 0.24);
    border-left: 5px solid #d28a00;
    border-radius: 6px;
    background: #fff7df;
    color: #7a4b00;
}

.livefilter-debug h2 {
    margin: 0 0 10px;
    color: #7a4b00;
    font-size: 16px;
}

.livefilter-debug pre {
    max-height: 240px;
    margin: 0;
    overflow: auto;
    white-space: pre-wrap;
    font: 13px/1.45 Consolas, "Liberation Mono", monospace;
}

.hub-dialog-overlay {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 28px;
    background: rgba(17, 24, 39, 0.34);
    opacity: 0;
    transition: opacity 180ms ease;
}

.hub-dialog-overlay.hub-dialog-ist-sichtbar {
    opacity: 1;
}

.hub-dialog {
    width: min(760px, calc(100vw - 56px));
    border: 1px solid rgba(238, 114, 3, 0.24);
    border-left: 5px solid var(--farbe-orange);
    border-radius: 8px;
    padding: 20px 22px;
    background: var(--karte-inhalt-hintergrund);
    box-shadow: 0 24px 62px rgba(31, 42, 68, 0.28);
    transform: translateY(10px) scale(0.985);
    transition: transform 180ms ease;
}

.hub-dialog-overlay.hub-dialog-ist-sichtbar .hub-dialog {
    transform: translateY(0) scale(1);
}

.hub-dialog h2 {
    margin: 0 0 16px;
    color: var(--farbe-dunkelblau);
    font-size: 20px;
    line-height: 1.25;
}

.hub-dialog .hub-dialog-untertitel {
    border-bottom: 1px solid var(--karte-trennlinie);
    color: #40506c;
    font-size: 14px;
    line-height: 1.35;
    margin: -8px 0 16px;
    padding-bottom: 14px;
}

.hub-dialog p {
    margin: 0;
    color: var(--farbe-text);
    font-size: 15px;
    line-height: 1.45;
    white-space: pre-line;
}

.hub-dialog-checkbox {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-top: 14px;
    color: var(--farbe-text);
    font-size: 15px;
    line-height: 1.35;
}

.hub-dialog-checkbox[hidden] {
    display: none;
}

.hub-dialog-eingabe-felder {
    display: grid;
    gap: 10px;
    margin-top: 10px;
}

.hub-dialog-einsatzabbruch .formular-feld {
    margin-top: 14px;
}

.hub-dialog .primaer-button,
.hub-dialog .sekundaer-button {
    min-width: 154px;
    width: auto;
}

body:not(.admin-seite) .statusmeldungen-layer {
    top: 18px;
    left: 18px;
}
body.menue-eingeklappt .statusmeldungen-layer {
    left: var(--menue-schmal);
}
.formular-popup-meldung {
    display: none;
}

.formular-fehler,
.formular-erfolg {
    width: 98%;
    margin-bottom: 24px;
    border: 1px solid rgba(31, 42, 68, 0.10);
    border-left-width: 5px;
    border-left-style: solid;
    border-radius: 8px;
    padding: 14px 18px;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 12px 28px rgba(31, 42, 68, 0.10);
    font-weight: 700;
}

.formular-fehler {
    border-color: rgba(180, 35, 24, 0.22);
    border-left-color: var(--farbe-fehler);
    color: var(--farbe-fehler);
}

.formular-erfolg {
    border-color: rgba(47, 133, 90, 0.22);
    border-left-color: #2f855a;
    color: #23613d;
}

.hub-zahlenbadge,
.registerkarte > span {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    min-width: var(--zahlenbadge-groesse);
    height: var(--zahlenbadge-groesse);
    padding: 0 6px;
    border: 1px solid var(--zahlenbadge-rand);
    border-radius: var(--zahlenbadge-radius);
    background: var(--zahlenbadge-hintergrund);
    color: var(--karte-inhalt-hintergrund);
    font-size: var(--zahlenbadge-schriftgroesse);
    font-weight: 400;
    line-height: 1;
    vertical-align: middle;
    white-space: nowrap;
}

.registerkarte > span {
    margin-left: 8px;
}

.hub-infobadge {
    display: inline-flex;
    min-height: var(--infobadge-hoehe);
    align-items: center;
    justify-content: center;
    border-radius: var(--infobadge-radius);
    padding: 0 8px;
    background: var(--infobadge-hintergrund);
    color: var(--infobadge-text);
    font-size: var(--infobadge-schriftgroesse);
    font-weight: 700;
    line-height: 1.2;
    white-space: nowrap;
}

a.hub-infobadge {
    text-decoration: none;
}

a.hub-infobadge:hover,
a.hub-infobadge:focus {
    background: var(--farbe-orange);
    color: #fff;
}

.status,
.status-badge,
.statusmarke {
    display: inline-flex;
    min-height: var(--statusbadge-hoehe);
    align-items: center;
    border: 1px solid transparent;
    border-radius: var(--statusbadge-radius);
    padding: var(--statusbadge-padding-y) var(--statusbadge-padding-x);
    font-size: var(--statusbadge-schriftgroesse);
    font-weight: var(--statusbadge-font-weight);
    line-height: 1.2;
    vertical-align: middle;
    white-space: nowrap;
}

.datentabelle td:has(> .status),
.datentabelle td:has(> .status-badge),
.datentabelle td:has(> .statusmarke) {
    text-align: left;
}

.datentabelle td:has(> .status) .status,
.datentabelle td:has(> .status-badge) .status-badge,
.datentabelle td:has(> .statusmarke) .statusmarke {
    justify-content: flex-start;
}

.statusliste {
    align-items: flex-start;
    display: grid;
    gap: 6px;
    justify-items: start;
    --statusliste-badge-breite: 176px;
}

.statusliste .status,
.statusliste .status-badge,
.statusliste .statusmarke {
    box-sizing: border-box;
    justify-content: flex-start;
    white-space: nowrap;
    width: var(--statusliste-badge-breite);
}

.praxiseinsatz-statusliste {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.praxiseinsatz-statusliste .status-badge {
    justify-content: flex-start;
    white-space: nowrap;
}

.praxiseinsatz-status-dashboard .unternehmen-dashboard-schuelerliste {
    border: 1px solid var(--karte-rand);
    border-radius: 6px;
    display: grid;
    overflow: hidden;
    padding: 0;
}

.praxiseinsatz-status-dashboard .unternehmen-dashboard-schuelerliste-kopf,
.praxiseinsatz-status-dashboard .unternehmen-dashboard-schuelerkarte {
    align-items: center;
    color: var(--farbe-text);
    display: grid;
    gap: 14px;
    grid-template-columns: minmax(280px, 360px) 120px minmax(0, 1fr);
    min-height: 48px;
    padding: 10px 14px;
}

.praxiseinsatz-status-dashboard .unternehmen-dashboard-schuelerliste-kopf {
    background: #f3f6fa;
    border-bottom: 1px solid var(--karte-trennlinie);
    color: var(--farbe-dunkelblau);
    font-weight: 600;
    min-height: 40px;
}

.praxiseinsatz-status-dashboard .unternehmen-dashboard-schuelerkarte {
    border-top: 1px solid var(--karte-trennlinie);
}

.praxiseinsatz-status-dashboard .unternehmen-dashboard-schuelerlink,
.praxiseinsatz-status-dashboard .unternehmen-dashboard-klassenlink,
.praxiseinsatz-status-dashboard .unternehmen-dashboard-statusliste .status-badge {
    text-decoration: none;
}

.praxiseinsatz-status-dashboard .unternehmen-dashboard-schuelerkarte:nth-child(odd) {
    background: var(--farbe-tabellen-zeile-ungerade);
}

.praxiseinsatz-status-dashboard .unternehmen-dashboard-schuelerkarte:nth-child(even) {
    background: var(--farbe-tabellen-zeile-gerade);
}

.praxiseinsatz-status-dashboard .unternehmen-dashboard-schuelerkarte:hover,
.praxiseinsatz-status-dashboard .unternehmen-dashboard-schuelerkarte:focus {
    background: var(--farbe-tabellen-hover);
    outline: 0;
}

.praxiseinsatz-status-dashboard .unternehmen-dashboard-schuelerkarte strong {
    color: var(--farbe-dunkelblau);
    min-width: 0;
}

.praxiseinsatz-status-dashboard .unternehmen-dashboard-klassenlink {
    color: var(--farbe-text-muted);
    font-size: 0.86rem;
    min-width: 0;
    white-space: nowrap;
}

.praxiseinsatz-status-dashboard .unternehmen-dashboard-statusliste {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    min-width: 0;
}

.praxiseinsatz-status-dashboard .unternehmen-dashboard-statusliste .status-badge {
    font-size: 0.72rem;
    font-weight: 400;
    min-height: 20px;
    padding: 2px 6px;
}

.status-bestaetigt,
.status-verbucht,
.status-aktiv,
.status-frei {
    border-color: var(--statusbadge-erfolg-rand);
    background: var(--statusbadge-erfolg-hintergrund);
    color: var(--statusbadge-erfolg-text);
}

.status-offen,
.status-pruefung,
.status-hinweis,
.status-warnung {
    border-color: var(--statusbadge-warnung-rand);
    background: var(--statusbadge-warnung-hintergrund);
    color: var(--statusbadge-warnung-text);
}

.status-abgelehnt,
.status-fehler,
.status-gesperrt {
    border-color: var(--statusbadge-fehler-rand);
    background: var(--statusbadge-fehler-hintergrund);
    color: var(--statusbadge-fehler-text);
}

.status-neutral,
.status-abgelaufen {
    border-color: var(--statusbadge-neutral-rand);
    background: var(--statusbadge-neutral-hintergrund);
    color: var(--statusbadge-neutral-text);
}

.status-geplant {
    border-color: var(--statusbadge-info-rand);
    background: var(--statusbadge-info-hintergrund);
    color: var(--statusbadge-info-text);
}
.admin-seite {
    min-height: 100vh;
    overscroll-behavior-y: none;
    background:
        linear-gradient(rgba(244, 246, 248, 0.40), rgba(244, 246, 248, 0.40)),
        url("../bilder/euraka_background_1080p.jpg") center / cover fixed no-repeat;
}

.admin-layout {
    min-height: 100vh;
}

.seitenmenue {
    display: flex;
    flex-direction: column;
    position: fixed;
    inset: 0 auto 0 0;
    z-index: 20;
    width: var(--menue-breite);
    overflow: hidden;
    background: var(--farbe-dunkelblau);
    color: var(--farbe-weiss);
    transition: width 160ms ease;
}

.menue-marke {
    display: flex;
    min-height: var(--leiste-hoehe);
    flex-direction: column;
    justify-content: center;
    padding: 12px 22px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.menue-marke-klein {
    margin-top: 2px;
    font-size: 14px;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.88);
}

.menue-marke-gross {
    font-size: 15px;
    font-weight: 700;
    color: var(--farbe-orange);
    line-height: 1.1;
}

.hauptmenue {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding: 8px 10px 12px;
    scrollbar-color: rgba(255, 255, 255, 0.32) transparent;
    scrollbar-width: thin;
}

.seitenmenue-externe {
    border-top: 1px solid rgba(255, 255, 255, 0.22);
    flex: 0 0 auto;
    margin: 0 18px 12px;
    padding-top: 12px;
}

.seitenmenue-externe h2 {
    color: var(--farbe-orange);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.04em;
    margin: 0 0 6px;
    text-transform: uppercase;
}

.seitenmenue-externe a {
    align-items: center;
    background: rgba(255, 255, 255, 0.08);
    border-radius: 6px;
    color: rgba(255, 255, 255, 0.92);
    display: flex;
    font-size: 13px;
    gap: 8px;
    justify-content: space-between;
    min-height: 32px;
    padding: 6px 9px;
    text-decoration: none;
}

.seitenmenue-externe a:hover,
.seitenmenue-externe a:focus {
    background: rgba(238, 114, 3, 0.18);
    color: var(--farbe-weiss);
    outline: 0;
}

.seitenmenue-externe-pfeil {
    color: var(--farbe-orange);
    flex: 0 0 auto;
    font-size: 15px;
}

.seitenmenue-footer {
    align-items: flex-start;
    border-top: 1px solid rgba(255, 255, 255, 0.22);
    color: #fff;
    display: grid;
    flex: 0 0 auto;
    gap: 12px;
    grid-template-columns: 54px minmax(0, 1fr);
    margin: 0 18px 20px;
    padding-top: 16px;
}

.seitenmenue-footer img {
    display: block;
    height: auto;
    max-width: 54px;
}

.seitenmenue-footer address {
    color: #fff;
    display: grid;
    font-style: normal;
    gap: 2px;
    line-height: 1.25;
    min-width: 0;
}

.seitenmenue-footer strong {
    color: #fff;
    font-size: 12px;
    line-height: 1.2;
}

.seitenmenue-footer span {
    color: rgba(255, 255, 255, 0.86);
    font-size: 11px;
    overflow-wrap: anywhere;
}

.menuepunkt,
.menuegruppe-titel {
    display: flex;
    min-height: 34px;
    align-items: center;
    gap: 11px;
    border-radius: 6px;
    padding: 4px 12px;
    text-decoration: none;
    color: rgba(255, 255, 255, 0.90);
    font-family: var(--schriftart);
    font-size: 15px;
    font-weight: 400;
    line-height: 1.35;
}

.menuegruppe-titel {
    width: 100%;
    border: 0;
    background: transparent;
    cursor: pointer;
}

.menuepunkt img,
.menuegruppe-titel img {
    width: 20px;
    height: 20px;
    flex: 0 0 auto;
}

.hauptmenue > .menuepunkt > img + span {
    margin-left: 18px;
}

.menuepunkt:not(.menuepunkt-deaktiviert):hover,
.menuepunkt:not(.menuepunkt-deaktiviert):focus,
.menuegruppe-titel:not(:disabled):hover,
.menuegruppe-titel:not(:disabled):focus,
.menuepunkt.ist-aktiv {
    background: rgba(238, 114, 3, 0.18);
    color: var(--farbe-weiss);
    outline: 0;
}

.menuepunkt-deaktiviert {
    cursor: default;
}

.menuepunkt.ist-aktiv {
    box-shadow: inset 4px 0 0 var(--farbe-orange);
}

.menuegruppe {
    margin: 2px 0;
}

.menuegruppe-titel {
    color: rgba(255, 255, 255, 0.90);
}

body.kennwortpflicht-aktiv .menue-schalter,
body.menuegruppen-gesperrt .menuegruppe-titel:disabled {
    cursor: default;
}

.menuegruppe-dreieck {
    width: 0;
    height: 0;
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-left: 7px solid var(--farbe-orange);
    transform: rotate(90deg);
    transition: transform 0.16s ease;
}

.menuegruppe-titel > span:last-child {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    align-items: center;
    text-align: left;
}

.menuegruppe.ist-geschlossen .menuegruppe-dreieck {
    transform: rotate(0deg);
}

.menuegruppe.ist-geschlossen .menuegruppe-inhalt {
    display: none;
}

.standort-ast {
    margin: 3px 0 7px 53px;
}

.standort-name {
    padding: 7px 8px 5px;
    color: var(--farbe-orange);
    font-size: 13px;
    font-weight: 700;
}

.menue-hinweis {
    margin: 6px 8px 12px 31px;
    color: rgba(255, 255, 255, 0.62);
    font-size: 13px;
}

.menuepunkt-kind {
    min-height: 30px;
    margin-left: 53px;
    padding: 4px 8px;
    font-size: 14px;
}

.standort-ast .menuepunkt-kind {
    margin-left: 0;
}

.arbeitsbereich {
    min-height: 100vh;
    margin-left: var(--menue-breite);
    padding-top: var(--leiste-hoehe);
    transition: margin-left 160ms ease;
}

.obere-leiste {
    position: fixed;
    top: 0;
    right: 0;
    left: var(--menue-breite);
    z-index: 10;
    display: flex;
    min-height: var(--leiste-hoehe);
    align-items: center;
    gap: 18px;
    padding: 0 28px;
    background: var(--farbe-dunkelblau);
    color: var(--farbe-weiss);
    box-shadow: 0 8px 22px rgba(31, 42, 68, 0.18);
    transition: left 160ms ease;
}

.menue-schalter {
    display: inline-flex;
    width: 42px;
    height: 42px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 6px;
    background: transparent;
    cursor: pointer;
}

.menue-schalter:disabled span {
    background: var(--button-deaktiviert-text);
}

.menue-schalter span {
    display: block;
    width: 18px;
    height: 2px;
    background: var(--farbe-weiss);
}

.menue-schalter:not(:disabled):hover,
.menue-schalter:not(:disabled):focus {
    border-color: var(--farbe-orange);
    outline: 3px solid rgba(238, 114, 3, 0.22);
}

.obere-leiste-titel {
    font-size: 18px;
    font-weight: 700;
}

.benutzerbereich {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-left: auto;
    font-size: 14px;
}

.benutzerdaten {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    line-height: 1.15;
}

.benutzername {
    color: var(--farbe-grau);
}

.benutzer-email {
    margin-top: 3px;
    color: rgba(255, 255, 255, 0.62);
    font-size: 11px;
    font-weight: 400;
}

.abmelden-link {
    border-radius: 5px;
    padding: 7px 10px;
    background: rgba(255, 255, 255, 0.08);
    color: var(--farbe-weiss);
    text-decoration: none;
}

.abmelden-link:hover,
.abmelden-link:focus {
    background: var(--farbe-orange);
    outline: 0;
}

.auto-logoff-timer {
    --auto-logoff-fuellung: 100%;
    align-items: center;
    align-self: stretch;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(238, 114, 3, 0.72);
    border-radius: 5px;
    color: #fff;
    display: inline-flex;
    font-variant-numeric: tabular-nums;
    font-weight: 700;
    justify-content: center;
    min-height: 32px;
    min-width: 86px;
    overflow: hidden;
    padding: 0 10px;
    position: relative;
}

.auto-logoff-timer::before {
    background: var(--farbe-orange);
    content: "";
    inset: 0 auto 0 0;
    position: absolute;
    width: var(--auto-logoff-fuellung);
    z-index: 0;
}

.auto-logoff-timer span {
    line-height: 1;
    position: relative;
    text-align: center;
    z-index: 1;
}

.inhalt {
    padding: 32px;
}

.seitenkopf-block {
    max-width: none;
    margin-bottom: 24px;
}

.seitenkopf-block h1 {
    margin: 0 0 8px;
    color: var(--farbe-dunkelblau);
    font-size: 30px;
}

.seitenkopf-block p {
    margin: 0;
    max-width: none;
    color: #40506c;
    line-height: 1.55;
}

.hinweisraster {
    display: grid;
    max-width: 980px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.hinweiskarte,
.platzhalter-box {
    border: 1px solid rgba(31, 42, 68, 0.12);
    border-radius: 8px;
    padding: 22px;
    background: rgba(255, 255, 255, 0.94);
    box-shadow: 0 12px 28px rgba(31, 42, 68, 0.10);
}

.hinweiskarte h2,
.platzhalter-box h2 {
    margin: 0 0 8px;
    color: var(--farbe-dunkelblau);
    font-size: 20px;
}

.hinweiskarte p,
.platzhalter-box p {
    margin: 0;
    line-height: 1.55;
}

.platzhalter-box {
    max-width: 760px;
    border-left: 5px solid var(--farbe-orange);
}

.datenbereich {
    width: 98%;
    max-width: none;
    margin-bottom: 24px;
    border: 1px solid rgba(31, 42, 68, 0.12);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.95);
    box-shadow: 0 12px 28px rgba(31, 42, 68, 0.10);
    overflow: hidden;
}

.einstellungen-block {
    margin-bottom: 24px;
}

.einstellungen-bewegungsdaten-reset form,
.einstellungen-bewegungsdaten-reset > .datenbereich-hinweis {
    margin-left: 16px;
    margin-right: 16px;
}

.einstellungen-bewegungsdaten-reset > .datenbereich-hinweis {
    padding-left: 0;
    padding-right: 0;
}

.formularbereich {
    width: 98%;
    max-width: none;
    margin-bottom: 24px;
    border: 1px solid rgba(31, 42, 68, 0.12);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.95);
    box-shadow: 0 12px 28px rgba(31, 42, 68, 0.10);
    overflow: hidden;
}

.verwaltungsformular {
    padding: 20px;
}

.formular-karten-zweispaltig {
    align-items: start;
    display: grid;
    gap: 22px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.formular-karte {
    background: #ffffff;
    border: 1px solid var(--karte-rand);
    border-radius: 6px;
    min-width: 0;
    overflow: hidden;
}

.formular-spalte {
    align-content: start;
    display: grid;
    gap: 22px;
    min-width: 0;
}

.formular-karte > h3 {
    align-items: center;
    background: var(--karte-kopf-hintergrund);
    border-bottom: 1px solid #dfe6f0;
    color: var(--farbe-dunkelblau);
    display: flex;
    font-size: var(--schrift-kartenkopf);
    font-weight: var(--schrift-kartenkopfgewicht);
    line-height: 1.25;
    margin: 0;
    min-height: 46px;
    padding: 6px 12px;
}

.formular-detailraster {
    display: grid;
    gap: 0;
    grid-template-columns: minmax(0, 1fr);
    padding: 0;
}

.formular-detailraster > label,
.formular-detailraster > .formular-detailzeile {
    align-items: stretch;
    display: grid;
    gap: 0;
    grid-template-columns: 190px minmax(0, 1fr);
    margin: 0;
    min-height: 46px;
}

.formular-detailraster > label + label,
.formular-detailraster > label + .formular-detailzeile,
.formular-detailraster > .formular-detailzeile + label,
.formular-detailraster > .formular-detailzeile + .formular-detailzeile {
    border-top: 1px solid #e4ebf4;
}

.formular-detailraster > label > span:first-child,
.formular-detailraster > .formular-detailzeile > span:first-child {
    align-items: center;
    background: var(--karte-inhalt-hintergrund);
    color: var(--farbe-dunkelblau);
    display: flex;
    font-size: var(--schrift-label);
    font-weight: var(--schrift-labelgewicht);
    margin: 0;
    padding: 7px 12px;
}

.formular-detailwert {
    align-items: center;
    color: var(--farbe-dunkelblau);
    display: flex;
    font-size: var(--schrift-standard);
    font-weight: var(--schrift-feldgewicht);
    min-width: 0;
    padding: 7px 12px;
}

.formular-detailwert-mehrzeilig {
    align-items: flex-start;
    flex-direction: column;
    gap: 3px;
}

.formular-detailzusatz {
    color: var(--farbe-text-gedaempft);
    margin-left: 20px;
}

.formular-detailzusatz-zeile {
    margin-left: 0;
}

.formular-detailraster > label > input:not([type="hidden"]),
.formular-detailraster > label > select,
.formular-detailraster > label > textarea,
.formular-detailraster > label > .hub-datumfeld {
    margin: 6px 12px;
    min-width: 0;
    width: calc(100% - 24px);
}

.formular-detailraster > label > textarea {
    resize: vertical;
}

.formular-checkboxwert {
    align-items: center;
    color: var(--farbe-dunkelblau);
    display: inline-flex;
    gap: 8px;
    margin: 6px 12px;
    min-width: 0;
}

.formular-checkboxwert > input[type="checkbox"] {
    height: 16px;
    min-height: 16px;
    min-width: 16px;
    width: 16px;
}

.formularraster {
    display: grid;
    grid-template-columns: repeat(5, minmax(150px, 1fr));
    gap: 16px;
}

.formularraster-standort {
    grid-template-columns: 2fr 1.4fr 0.8fr 1fr 1.2fr;
}

.formularraster-raum {
    grid-template-columns: 2fr 0.7fr 0.7fr 2fr 0.8fr;
}

.formularraster-feiertag {
    grid-template-columns: 0.9fr 2fr 1fr 0.9fr;
}

.formularraster-ferientag {
    grid-template-columns: 0.8fr 0.8fr 1.5fr 0.8fr 1.4fr 0.9fr;
}

.formularraster-raumsperrung {
    grid-template-columns: 1.4fr 0.9fr 0.9fr 1.6fr 1.6fr;
}

.formularraster-schliesstag {
    grid-template-columns: 0.9fr 0.9fr 1.8fr 2fr;
}

.formularraster-beweglicher-ferientag {
    grid-template-columns: 0.8fr 0.8fr 1.7fr 1.7fr 0.9fr;
}

.formularraster-sperruebersicht {
    grid-template-columns: 0.8fr 0.8fr 1.1fr 1.2fr 1.4fr;
    max-width: 1280px;
}

.formularraster-planung {
    grid-template-columns: 0.9fr 1.1fr 1.2fr 1.5fr 1.5fr 2fr;
}

.formularraster-sondermeldung {
    grid-template-columns: 0.9fr 0.9fr 2fr 0.7fr;
}

.formularraster-klasse,
.formularraster-kurs {
    grid-template-columns: minmax(150px, 1.25fr) minmax(120px, 0.8fr) minmax(126px, 0.62fr) minmax(126px, 0.62fr) minmax(88px, 0.4fr);
    gap: 14px;
}

.formularraster-klasse .formular-feld-leitung,
.formularraster-kurs .formular-feld-leitung {
    grid-column: 1 / span 1;
}

.formularraster-klasse .formular-feld-vertretung {
    grid-column: 2 / span 1;
}

.formularraster-klasse .formular-feld-curriculum {
    grid-column: 3 / span 1;
}

.formularraster-kurs .formular-feld-curriculum {
    grid-column: 2 / span 1;
}

.formularraster-klasse .formular-feld-hinweis {
    grid-column: 4 / span 2;
}

.formularraster-kurs .formular-feld-hinweis {
    grid-column: 3 / span 3;
}

.formularraster-klasse .checkbox-einzel,
.formularraster-kurs .checkbox-einzel {
    grid-column: 1 / -1;
    align-self: start;
    min-height: 38px;
    margin-top: 2px;
    margin-bottom: 0;
}

.formularraster-lehrkraft {
    grid-template-columns: 1fr 1fr 0.6fr 1.5fr 1.4fr 0.8fr;
}

.unternehmen-form-layout {
    display: grid;
    grid-template-columns: minmax(420px, 1fr) minmax(420px, 1fr);
    gap: 22px;
    align-items: start;
}

.unternehmen-form-spalte {
    background: #fff;
    border: 1px solid var(--karte-rand);
    border-radius: 6px;
    overflow: hidden;
    min-width: 0;
}

.unternehmen-form-spalte > h3 {
    align-items: center;
    background: var(--karte-kopf-hintergrund);
    border-bottom: 1px solid #dfe6f0;
    display: flex;
    min-height: 46px;
    padding: 6px 12px;
    margin: 0;
    color: var(--farbe-dunkelblau);
    font-size: var(--schrift-normal);
    font-weight: 500;
    line-height: 1.25;
}

.unternehmen-form-spalte-breit {
    background: #fff;
}

.unternehmen-form-spaltenkopf {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 0;
}

.unternehmen-form-spaltenkopf h3 {
    margin-bottom: 0;
}

.unternehmen-formularaktionen {
    margin-top: 18px;
    padding-top: 2px;
}

.unternehmen-form-spaltenkopf {
    min-height: 28px;
    margin-bottom: 14px;
}

.formularraster-unternehmen {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
    padding: 0;
}

.formularraster-unternehmen .formular-feld-breit {
    grid-column: auto;
}

.formularraster-unternehmen > .formular-feld {
    display: grid;
    grid-template-columns: 180px minmax(0, 1fr);
    gap: 0;
    align-items: stretch;
    margin-bottom: 0;
    min-height: 46px;
}

.formularraster-unternehmen > .formular-feld + .formular-feld {
    border-top: 1px solid #e4ebf4;
}

.formularraster-unternehmen > .formular-feld > span {
    align-items: center;
    background: var(--karte-inhalt-hintergrund);
    display: flex;
    margin-bottom: 0;
    color: var(--farbe-dunkelblau);
    font-size: 14px;
    font-weight: var(--formular-label-font-weight);
    padding: 7px 12px;
}

.formularraster-unternehmen > .formular-feld > input:not([type="hidden"]),
.formularraster-unternehmen > .formular-feld > select {
    margin: 6px 12px;
    width: calc(100% - 24px);
}

.formularraster-unternehmen > .formular-feld > .unternehmen-adresspruefung-status {
    margin: 6px 12px;
}

.unternehmen-manuelle-liste {
    display: grid;
    gap: 18px;
    padding: 16px 20px 0;
}

.unternehmen-manuell-karte {
    background: #fff;
    border: 1px solid var(--karte-rand);
    border-radius: 6px;
    padding: 14px;
}

.unternehmen-manuell-karte:target {
    border-color: var(--farbe-orange);
    box-shadow: 0 0 0 2px rgba(238, 116, 0, 0.18);
}

.unternehmen-manuell-daten > .formular-feld > strong {
    align-items: center;
    color: var(--farbe-dunkelblau);
    display: flex;
    font-size: var(--schrift-normal);
    font-weight: 400;
    line-height: 1.35;
    min-width: 0;
    padding: 7px 12px;
    word-break: break-word;
}

.unternehmen-manuell-kontakte {
    display: grid;
    gap: 10px;
    padding: 14px 12px;
}

.unternehmen-manuell-fuss {
    align-items: end;
    border-top: 1px solid #e4ebf4;
    display: grid;
    gap: 16px;
    grid-template-columns: minmax(0, 1fr) max-content;
    margin-top: 14px;
    padding-top: 14px;
}

.unternehmen-manuell-verwendungen {
    color: #42526f;
    display: grid;
    gap: 4px;
    font-size: 0.92rem;
}

.unternehmen-manuell-verwendungen strong {
    color: var(--farbe-dunkelblau);
}

.unternehmen-manuell-verwendungslink {
    color: var(--farbe-dunkelblau);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.unternehmen-manuell-verwendungslink:hover,
.unternehmen-manuell-verwendungslink:focus {
    color: var(--farbe-orange);
}

.unternehmen-manuell-aktionen {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: flex-end;
}

.unternehmen-manuell-aktionen form {
    margin: 0;
}

@media (max-width: 900px) {
    .unternehmen-manuell-fuss {
        grid-template-columns: 1fr;
    }

    .unternehmen-manuell-aktionen {
        justify-content: flex-start;
    }
}

.schuelerakte-geo-auswahl {
    background: var(--karte-flaeche-abgesetzt);
    border: 1px solid var(--karte-rand);
    border-radius: 6px;
    display: grid;
    gap: 0;
    margin-top: -6px;
    padding: 6px 8px;
}

.schuelerakte-geo-auswahl[hidden] {
    display: none;
}

.schuelerakte-geo-auswahl-titel {
    color: #42526f;
    font-size: 0.78rem;
    font-weight: 700;
    line-height: 1.25;
    padding: 2px 2px 6px;
}

.schuelerakte-geo-auswahl button {
    background: transparent;
    border: 0;
    border-radius: 4px;
    color: var(--farbe-dunkelblau);
    cursor: pointer;
    font: inherit;
    min-height: 32px;
    padding: 7px 8px;
    text-align: left;
}

.schuelerakte-geo-auswahl button + button {
    border-top: 1px solid #d6e1f0;
}

.schuelerakte-geo-auswahl button:hover {
    background: #fff7ef;
    color: var(--farbe-dunkelblau);
}

.unternehmen-adresspruefung-status {
    align-items: center;
    display: grid;
    gap: 10px;
    grid-template-columns: 170px max-content;
    font-weight: 400;
    min-height: 24px;
    margin: 0;
}

.formularraster-unternehmen > .unternehmen-adresspruefung-zeile {
    align-items: center;
    margin-top: 0;
    min-height: 24px;
}

.formularraster-unternehmen > .unternehmen-adresspruefung-zeile > span {
    align-self: stretch;
}

.unternehmen-adresspruefung-statusanzeige {
    align-items: center;
    display: inline-flex;
    gap: 8px;
}

.formular-feld .unternehmen-adresspruefung-status span {
    display: inline-flex;
    margin-bottom: 0;
}

.unternehmen-adresspruefung-zeile .checkboxzeile {
    align-items: center;
    color: var(--farbe-text);
    display: inline-flex;
    font-weight: 400;
    gap: 8px;
    min-height: 24px;
}

.unternehmen-adresspruefung-zeile .checkboxzeile span {
    display: inline-flex;
    margin-bottom: 0;
}

.unternehmen-adresspruefung-zeile .checkboxzeile input[type="checkbox"] {
    flex: 0 0 auto;
    height: 16px;
    margin: 0;
    width: 16px;
}

.unternehmen-adresspruefung-haken {
    align-items: center;
    background: #fff;
    border: 1px solid #c8d5e6;
    border-radius: 3px;
    color: transparent;
    display: inline-flex;
    font-size: 12px;
    font-weight: 700;
    height: 16px;
    justify-content: center;
    line-height: 1;
    width: 16px;
}

.unternehmen-adresspruefung-statusanzeige.ist-geprueft .unternehmen-adresspruefung-haken {
    background: #14884d;
    border-color: #14884d;
    color: #fff;
}

.unternehmen-adresspruefung-status .sekundaer-button {
    min-height: 32px;
    width: auto;
}

@media (max-width: 700px) {
    .unternehmen-adresspruefung-status {
        grid-template-columns: 1fr;
    }
}

.formular-unterabschnitt {
    margin: 0;
    padding: 0;
}

.formular-unterabschnitt h3 {
    color: var(--farbe-dunkelblau);
    font-size: var(--schrift-normal);
    font-weight: 500;
    margin: 0 0 14px;
}

.formular-unterabschnitt .unternehmen-form-spaltenkopf h3 {
    margin: 0;
}

.kontakte-tabelle {
    display: grid;
    gap: 16px;
}

.unternehmen-form-spalte > .kontakt-live-suche {
    margin: 14px 12px 16px;
}

.unternehmen-form-spalte > .kontakte-tabelle {
    margin: 0 12px;
}

.kontakt-live-suche {
    background: rgba(248, 250, 252, 0.72);
    border: 1px solid var(--karte-rand);
    border-radius: 8px;
    margin-bottom: 16px;
    padding: 14px;
}

.kontakt-live-suche .formular-feld {
    margin-bottom: 10px;
}

.kontakt-live-suche-ergebnisse {
    display: grid;
    gap: 8px;
    max-height: 260px;
    overflow: auto;
}

.kontakt-live-suche-hinweis {
    color: #52627f;
    font-size: 0.9rem;
    margin: 0;
    padding: 8px 2px 2px;
}

.kontakt-live-suche-treffer {
    display: grid;
    gap: 3px;
    width: 100%;
    border: 1px solid #cbd9eb;
    border-radius: 6px;
    background: rgba(255, 255, 255, 0.9);
    color: var(--farbe-text);
    cursor: pointer;
    font: inherit;
    line-height: 1.3;
    padding: 10px 12px;
    text-align: left;
}

.kontakt-live-suche-treffer:hover,
.kontakt-live-suche-treffer:focus-visible {
    background: var(--farbe-tabellen-hover);
    border-color: rgba(238, 114, 3, 0.38);
    outline: none;
}

.kontakt-live-suche-treffer strong {
    color: var(--farbe-dunkelblau);
    font-size: 0.92rem;
    font-weight: 700;
    line-height: 1.28;
}

.kontakt-live-suche-treffer span {
    color: #33415e;
    font-size: 0.86rem;
    overflow-wrap: anywhere;
}

.kontakt-live-suche-treffer .kontakt-live-suche-typ {
    border-bottom: 1px solid #c9dcf4;
    color: #42526f;
    font-size: 0.82rem;
    font-weight: 400;
    line-height: 1.25;
    margin-bottom: 5px;
    padding-bottom: 5px;
}

.kontakt-live-suche-treffer .kontakt-live-suche-unternehmen {
    color: var(--farbe-dunkelblau);
}

.kontakt-live-suche-treffer .kontakt-live-suche-adresse {
    color: var(--farbe-text);
    white-space: pre-line;
}

.kontakt-live-suche-treffer .kontakt-live-suche-detail {
    display: grid;
    grid-template-columns: 62px minmax(0, 1fr);
    column-gap: 8px;
}

.kontakt-live-suche-treffer .kontakt-live-suche-detail-label {
    color: #42526f;
}

.kontakt-live-suche-treffer .kontakt-live-suche-detail-wert {
    color: var(--farbe-text);
}

.kontakt-live-suche-treffer .kontakt-live-suche-aktion {
    color: #31527b;
    font-size: 0.84rem;
    margin-top: 4px;
}

.kontakte-kopf {
    display: none;
    background: rgba(31, 42, 68, 0.07);
    color: var(--farbe-dunkelblau);
    font-size: 14px;
    font-weight: 700;
    min-height: 38px;
    border-radius: 6px;
    padding: 0 12px;
}

.kontakte-zeile {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas:
        "kontaktart"
        "anrede"
        "nachname"
        "vorname"
        "telefon-festnetz"
        "telefon-mobil"
        "email"
        "aktion";
    gap: 0;
    align-items: start;
    border: 1px solid var(--karte-rand);
    border-radius: 8px;
    padding: 0;
    background: #fff;
    overflow: hidden;
}

.kontakte-kopf + .kontakte-zeile {
    margin-top: 0;
}

.kontakte-zeile .formular-feld {
    display: grid;
    grid-template-columns: 180px minmax(0, 1fr);
    gap: 0;
    align-items: stretch;
    margin-bottom: 0;
    min-height: 38px;
}

.kontakte-zeile .formular-feld + .formular-feld {
    border-top: 1px solid #e4ebf4;
}

.kontakte-zeile .formular-feld span {
    align-items: center;
    background: var(--karte-inhalt-hintergrund);
    display: flex;
    margin-bottom: 0;
    color: var(--farbe-dunkelblau);
    font-size: 14px;
    font-weight: var(--formular-label-font-weight);
    padding: 7px 12px;
}

.kontakte-zeile .formular-feld input,
.kontakte-zeile .formular-feld select {
    margin: 6px 12px;
    width: calc(100% - 24px);
}

.kontakte-zeile .formular-feld:nth-of-type(1) {
    grid-area: kontaktart;
}

.kontakte-zeile .formular-feld:nth-of-type(2) {
    grid-area: anrede;
}

.kontakte-zeile .formular-feld:nth-of-type(3) {
    grid-area: nachname;
}

.kontakte-zeile .formular-feld:nth-of-type(4) {
    grid-area: vorname;
}

.kontakte-zeile .formular-feld:nth-of-type(5) {
    grid-area: telefon-festnetz;
}

.kontakte-zeile .formular-feld:nth-of-type(6) {
    grid-area: telefon-mobil;
}

.kontakte-zeile .formular-feld:nth-of-type(7) {
    grid-area: email;
}

.kontakte-zeile > .icon-aktion {
    grid-area: aktion;
    justify-self: end;
    margin: 8px 12px 12px;
}

.sekundaer-button-kompakt {
    min-height: 34px;
    padding-inline: 12px;
}

.kontakte-aktionen {
    display: flex;
    justify-content: flex-end;
    margin: 12px 12px 14px;
}

@media (max-width: 1280px) {
    .unternehmen-form-layout {
        grid-template-columns: minmax(360px, 1fr) minmax(360px, 1fr);
    }
}

@media (max-width: 1080px) {
    .unternehmen-form-layout {
        grid-template-columns: 1fr;
    }
}

.formularraster-unternehmen-filter {
    align-items: end;
    grid-template-columns: minmax(220px, 0.8fr) minmax(220px, 0.8fr) minmax(320px, 1.4fr) auto;
    max-width: none;
}

.formularraster-unternehmen-filter .unternehmen-filteraktion {
    align-self: end;
}

.formularraster-unternehmen-filter .unternehmen-filteraktion .sekundaer-button {
    width: auto;
}

.unternehmen-register + .datenbereich-unterkopf {
    background: #fff;
    border-top: 0;
}

.datentabelle.unternehmen-tabelle {
    border-collapse: separate;
    border-spacing: 0 12px;
    padding-left: 10px;
    padding-right: 10px;
    table-layout: fixed;
}

.datentabelle.unternehmen-tabelle td {
    border-bottom: 1px solid #dbe5f1;
    border-top: 1px solid #dbe5f1;
    padding-top: 18px;
    padding-bottom: 18px;
    line-height: 1.46;
    vertical-align: top;
}

.datentabelle.unternehmen-tabelle > tbody:not(.datentabelle-eintragsgruppe) > tr:nth-child(odd):not(.tabellenstandard-ohne-zebra) > td,
.datentabelle.unternehmen-tabelle > tbody:not(.datentabelle-eintragsgruppe) > tr:nth-child(even):not(.tabellenstandard-ohne-zebra) > td,
.datentabelle.unternehmen-tabelle > tbody > tr > td {
    background: rgba(255, 255, 255, 0.96);
}

.datentabelle.unternehmen-tabelle > tbody > tr > td:first-child {
    border-left: 1px solid #dbe5f1;
    border-radius: 8px 0 0 8px;
}

.datentabelle.unternehmen-tabelle > tbody > tr > td:last-child {
    border-radius: 0 8px 8px 0;
    border-right: 1px solid #dbe5f1;
}

.datentabelle.unternehmen-tabelle > tbody > tr:hover {
    background: var(--farbe-tabellen-hover);
}

.datentabelle.unternehmen-tabelle > tbody:not(.datentabelle-eintragsgruppe) > tr:hover > td,
.datentabelle.unternehmen-tabelle > tbody > tr:hover > td {
    background: var(--farbe-tabellen-hover) !important;
    border-bottom-color: rgba(238, 114, 3, 0.24);
    border-top-color: rgba(238, 114, 3, 0.24);
}

.datentabelle.unternehmen-tabelle > tbody > tr:hover > td:first-child {
    border-left-color: rgba(238, 114, 3, 0.24);
}

.datentabelle.unternehmen-tabelle > tbody > tr:hover > td:last-child {
    border-right-color: rgba(238, 114, 3, 0.24);
}

.unternehmen-tabelle col.unternehmen-name-spalte {
    width: 35%;
}

.unternehmen-tabelle col.unternehmen-geprueft-spalte,
.unternehmen-tabelle col.unternehmen-status-spalte {
    width: 210px;
}

.unternehmen-tabelle col.unternehmen-kontakt-spalte {
    width: 260px;
}

.unternehmen-tabelle col.unternehmen-kontakte-spalte {
    width: 360px;
}

.unternehmen-tabelle col.unternehmen-aktionen-spalte {
    width: 112px;
}

.unternehmen-tabelle .aktionen-zelle {
    display: table-cell;
    padding-top: 14px;
    white-space: nowrap;
}

.unternehmen-tabelle .aktionen-zelle .icon-aktion + .icon-aktion {
    margin-left: 8px;
}

.unternehmen-tabellentyp,
.unternehmen-tabellenname,
.unternehmen-tabellenzusatz,
.unternehmen-tabellenadresse,
.tabellen-zusatzzeile {
    display: block;
}

.unternehmen-tabellentyp {
    border-bottom: 1px solid #c9dcf4;
    color: #42526f;
    font-size: 0.82rem;
    font-weight: 400;
    line-height: 1.25;
    margin-bottom: 7px;
    padding-bottom: 5px;
}

.unternehmen-tabellenname {
    color: var(--farbe-dunkelblau);
    line-height: 1.34;
}

.unternehmen-tabellenzusatz {
    color: var(--farbe-dunkelblau);
    font-size: inherit;
    line-height: 1.34;
}

.tabellen-zusatzzeile {
    color: #52627f;
    font-size: 0.92rem;
    line-height: 1.34;
}

.unternehmen-tabellenadresse {
    color: var(--farbe-text);
    line-height: 1.4;
    margin-top: 9px;
}

.unternehmen-kontakte-liste {
    display: grid;
    gap: 8px;
}

.unternehmen-kontakte-eintrag {
    display: grid;
    gap: 2px;
    padding: 8px 10px;
    border: 1px solid var(--karte-rand);
    border-radius: 6px;
    background: rgba(248, 250, 252, 0.88);
}

.unternehmen-kontakte-eintrag[draggable="true"] {
    cursor: grab;
}

.unternehmen-kontakte-eintrag[draggable="true"]:active {
    cursor: grabbing;
}

.unternehmen-kontakte-eintrag.ist-dragging {
    opacity: 0.62;
}

.unternehmen-tabelle tr.ist-kontakt-dropziel td[data-unternehmen-kontakte-zelle] {
    background: rgba(238, 114, 3, 0.08);
    box-shadow: inset 0 0 0 2px rgba(238, 114, 3, 0.62);
}

.unternehmen-kontakte-eintrag strong {
    color: var(--farbe-dunkelblau);
    font-size: 0.88rem;
    font-weight: 700;
    line-height: 1.25;
}

.unternehmen-kontakte-eintrag span {
    color: #33415e;
    font-size: 0.82rem;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.kontakt-detailzeile {
    align-items: baseline;
    column-gap: 6px;
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr);
}

.kontakt-detail-label {
    white-space: nowrap;
}

.kontakt-detail-wert {
    min-width: 0;
    overflow-wrap: anywhere;
}

.formularraster-kennwort {
    grid-template-columns: 1fr 1fr;
}

.formularraster-protokollfilter {
    grid-template-columns: 1fr 1fr 2fr;
}

.formularraster-statusfilter {
    grid-template-columns: minmax(220px, 360px);
}

.formularraster-anwesenheit-filter {
    grid-template-columns: 1.4fr 0.7fr 0.9fr;
    max-width: 920px;
}
.formularraster-anwesenheit-anlage {
    grid-template-columns: minmax(220px, 1fr) minmax(170px, 0.6fr) minmax(280px, 1.2fr);
    max-width: 980px;
}

.formularraster-curriculum-filter {
    grid-template-columns: repeat(5, minmax(180px, 1fr));
}

.formularraster-curriculum-filter .formular-feld-breit {
    grid-column: 1 / -1;
}

.curriculum-tabelle th:nth-child(3),
.curriculum-tabelle td:nth-child(3) {
    white-space: nowrap;
}

.curriculum-tabelle {
    min-width: 1540px;
    table-layout: fixed;
}

.datentabelle.curriculum-tabelle th,
.datentabelle.curriculum-tabelle td {
    line-height: 1.45;
    vertical-align: top;
}

.curriculum-tabelle-admin th:nth-child(1),
.curriculum-tabelle-admin td:nth-child(1),
.curriculum-tabelle-lesend th:nth-child(1),
.curriculum-tabelle-lesend td:nth-child(1) {
    width: 70px;
}

.curriculum-tabelle-admin th:nth-child(2),
.curriculum-tabelle-admin td:nth-child(2),
.curriculum-tabelle-lesend th:nth-child(2),
.curriculum-tabelle-lesend td:nth-child(2) {
    width: 220px;
}

.curriculum-tabelle-admin th:nth-child(3),
.curriculum-tabelle-admin td:nth-child(3),
.curriculum-tabelle-lesend th:nth-child(3),
.curriculum-tabelle-lesend td:nth-child(3) {
    width: 64px;
}

.curriculum-tabelle-admin th:nth-child(4),
.curriculum-tabelle-admin td:nth-child(4),
.curriculum-tabelle-lesend th:nth-child(4),
.curriculum-tabelle-lesend td:nth-child(4) {
    width: 170px;
}

.curriculum-tabelle-admin th:nth-child(5),
.curriculum-tabelle-admin td:nth-child(5),
.curriculum-tabelle-lesend th:nth-child(5),
.curriculum-tabelle-lesend td:nth-child(5) {
    width: 220px;
}

.curriculum-tabelle-admin th:nth-child(6),
.curriculum-tabelle-admin td:nth-child(6),
.curriculum-tabelle-lesend th:nth-child(6),
.curriculum-tabelle-lesend td:nth-child(6) {
    width: 132px;
}

.curriculum-tabelle-admin th:nth-child(8),
.curriculum-tabelle-admin td:nth-child(8),
.curriculum-tabelle-lesend th:nth-child(8),
.curriculum-tabelle-lesend td:nth-child(8) {
    width: 132px;
}

.curriculum-tabelle-admin th:nth-child(9),
.curriculum-tabelle-admin td:nth-child(9),
.curriculum-tabelle-lesend th:nth-child(9),
.curriculum-tabelle-lesend td:nth-child(9) {
    width: 210px;
}

.curriculum-tabelle-admin th:nth-child(10),
.curriculum-tabelle-admin td:nth-child(10) {
    width: 86px;
}

.curriculum-tabelle .curriculum-aktionen-zelle {
    display: table-cell;
    padding-top: 12px;
    text-align: center;
}

.curriculum-tabelle .aktionen-inhalt {
    display: flex;
    justify-content: center;
}

.curriculum-inhalte-liste {
    margin: 0;
    padding-left: 18px;
}

.curriculum-inhalte-liste li + li {
    margin-top: 4px;
}

.curriculum-kartenliste {
    display: grid;
    gap: 16px;
    padding: 16px;
}

.curriculum-einheit-karte {
    overflow: hidden;
    border: 1px solid #c7d3e4;
    border-radius: 8px;
    background: var(--karte-hintergrund);
}

.curriculum-einheit-karte-kopf {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: baseline;
    gap: 18px;
    padding: 16px 18px;
    border-left: 6px solid var(--farbe-dunkelblau);
    background: #f3f7fc;
}

.curriculum-einheit-karte-kopf strong {
    color: var(--farbe-dunkelblau);
    font-size: 22px;
    line-height: 1.35;
}

.curriculum-einheit-karte-kopf p {
    margin: 0;
    color: var(--farbe-dunkelblau);
    font-size: 16px;
    font-weight: 700;
    line-height: 1.35;
}

.curriculum-einheit-karte-kopf em {
    font-style: normal;
    font-weight: 800;
    color: var(--farbe-dunkelblau);
}

.curriculum-themeninhalt-liste {
    display: grid;
    gap: 12px;
    padding: 14px;
}

.curriculum-themeninhalt {
    border: 1px solid #d8e1ee;
    border-radius: 8px;
    background: #fbfcfe;
}

.curriculum-themeninhalt-kopf {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(360px, auto) auto;
    gap: 22px;
    align-items: start;
    padding: 14px;
    border-bottom: 1px solid #e2e8f2;
}

.curriculum-themeninhalt-kopf h3 {
    margin: 2px 0 0;
    color: var(--farbe-dunkelblau);
    font-size: 17px;
    line-height: 1.35;
}

.curriculum-oberthemen-liste {
    display: grid;
    gap: 3px;
}

.curriculum-themeninhalt-kopf > div > span {
    color: var(--farbe-text);
    font-size: 12px;
    font-weight: 700;
}

.curriculum-themeninhalt-kopf dl {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 12px 26px;
    margin: 0;
}

.curriculum-themeninhalt-kopf dt {
    color: var(--farbe-text);
    font-size: 12px;
    font-weight: 700;
}

.curriculum-themeninhalt-kopf dd {
    margin: 2px 0 0;
    color: var(--farbe-dunkelblau);
    font-weight: 700;
    line-height: 1.35;
}

.curriculum-themeninhalt-lehrkraefte dd {
    min-width: 180px;
}

.curriculum-themeninhalt-aktionen {
    display: flex;
    gap: 8px;
    align-items: center;
}

.curriculum-karten-unterthemen {
    display: grid;
    gap: 9px;
    margin: 0;
    padding: 14px 18px 16px;
    list-style: none;
}

.curriculum-karten-unterthemen .curriculum-karten-unterthemen {
    border-left: 2px solid #d8e2f0;
    margin: 8px 0 0 18px;
    padding: 0 0 0 18px;
}

.curriculum-karten-unterthema {
    line-height: 1.45;
    margin: 0;
}

.curriculum-karten-unterthema::before {
    content: none;
}

.curriculum-karten-ebene-1 {
    color: var(--farbe-text);
}

.curriculum-karten-ebene-0 > .curriculum-karten-themenzeile,
.curriculum-karten-ebene-1 > .curriculum-karten-themenzeile,
.curriculum-karten-ebene-2 > .curriculum-karten-themenzeile {
    color: var(--farbe-text);
    font-weight: 400;
}

.curriculum-karten-themenzeile {
    align-items: start;
    color: #1f2a44;
    display: grid;
    gap: 8px;
    grid-template-columns: 14px minmax(0, 1fr);
    line-height: 1.35;
}

.curriculum-karten-themenzeile input {
    height: 13px;
    margin: 3px 0 0;
    width: 13px;
}

.hub-themenstruktur {
    color: var(--farbe-text);
    display: grid;
    gap: 12px;
    font-size: 0.9rem;
    line-height: 1.42;
}

.hub-themenstruktur-hinweis {
    color: #42526f;
    display: block;
    font-size: 0.78rem;
    font-weight: 700;
    margin: 0 0 4px;
}

.hub-themenstruktur-einheit {
    display: grid;
    gap: 8px;
}

.hub-themenstruktur-code {
    color: var(--farbe-dunkelblau);
    font-weight: 700;
    margin: 0;
}

.hub-themenstruktur-oberthema-block {
    display: grid;
    gap: 8px;
}

.hub-themenstruktur-oberthema {
    border-bottom: 1px solid #d9e0ea;
    color: #1f2a44;
    font-weight: 400;
    padding-bottom: 6px;
}

.hub-themenstruktur-liste {
    border-left: 2px solid #d8e2f0;
    display: grid;
    gap: 7px;
    margin: 0 0 0 18px;
    padding: 0 0 0 18px;
}

.hub-themenstruktur-liste .hub-themenstruktur-liste {
    margin-top: 6px;
}

.hub-themenstruktur-knoten {
    margin: 0;
}

.hub-themenstruktur-zeile {
    align-items: start;
    color: #1f2a44;
    display: grid;
    font-weight: 400;
    gap: 8px;
    grid-template-columns: 14px minmax(0, 1fr);
    line-height: 1.35;
    min-width: 0;
}

.hub-themenstruktur-zeile input {
    height: 13px;
    margin: 3px 0 0;
    width: 13px;
}

.hub-themenstruktur-checkboxplatz {
    display: inline-block;
    height: 13px;
    margin-top: 3px;
    width: 13px;
}

.curriculum-karten-ebene-liste-0.hub-themenstruktur-liste {
    border-left: 0;
    margin: 0;
    padding: 14px 18px 16px;
}

.curriculum-karten-leer,
.curriculum-themeninhalt-bemerkung {
    margin: 14px 18px 16px;
    color: var(--farbe-text);
}

.curriculum-eintragsstruktur {
    display: grid;
    gap: 8px;
}

.curriculum-formularbereich {
    display: grid;
    gap: 12px;
    padding: 16px;
    border: 1px solid var(--rahmenfarbe);
    border-radius: 8px;
    background: rgba(255, 255, 255, .74);
}

.curriculum-arbeitskontext {
    display: flex;
    flex-direction: column;
    gap: 2px;
    align-items: flex-start;
    width: 98%;
    box-sizing: border-box;
    margin: 14px 0 24px;
    padding: 14px 16px;
    border: 1px solid var(--farbe-orange);
    border-radius: 8px;
    background: var(--farbe-orange);
    color: #fff;
    font-size: 16px;
    line-height: 1.35;
}

.curriculum-arbeitskontext span {
    font-size: inherit;
    font-weight: 600;
}

.curriculum-arbeitskontext strong {
    font-size: inherit;
    font-weight: inherit;
    line-height: inherit;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.curriculum-formularbereich-kopf {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--rahmenfarbe);
}

.curriculum-formularbereich-kopf h3 {
    margin: 0;
    color: var(--farbe-dunkelblau);
    font-size: 17px;
    line-height: 1.3;
}

.curriculum-formularbereich-kopf span {
    color: var(--farbe-text);
    font-size: 13px;
}

.curriculum-formularraster {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
}

.curriculum-formularraster-kompakt {
    grid-template-columns: minmax(90px, .5fr) minmax(150px, .9fr) minmax(130px, .7fr);
    align-items: end;
}

.curriculum-formularraster-code {
    grid-template-columns: minmax(110px, .35fr) minmax(280px, 1fr) minmax(130px, .35fr);
    align-items: end;
}

.curriculum-formularraster-einheit {
    grid-template-columns: 200px 150px minmax(300px, 1fr) 220px 104px;
    gap: 0;
    align-items: end;
}

.curriculum-einheit-formular {
    padding: 0;
}

.curriculum-einheiten-bereich,
.curriculum-einheiten-bereich .tabellenrahmen {
    overflow: visible;
}

.curriculum-einheit-formular .formularaktionen {
    padding: 0 16px 18px;
}

.curriculum-formularraster-einheit .formular-feld {
    margin-bottom: 16px;
    padding: 20px 16px 0;
}

.curriculum-einheiten-tabelle {
    table-layout: fixed;
}

.curriculum-einheiten-tabelle,
.curriculum-einheiten-tabelle tbody,
.curriculum-einheiten-tabelle tr,
.curriculum-einheiten-tabelle td {
    overflow: visible;
}

.curriculum-einheiten-tabelle td {
    position: relative;
}

.curricula-uebersicht-tabelle {
    table-layout: fixed;
}

.curricula-uebersicht-tabelle th:nth-child(1),
.curricula-uebersicht-tabelle td:nth-child(1) {
    width: 48%;
}

.curricula-uebersicht-tabelle th:nth-child(2),
.curricula-uebersicht-tabelle td:nth-child(2) {
    width: 22%;
}

.curricula-uebersicht-tabelle th:nth-child(3),
.curricula-uebersicht-tabelle td:nth-child(3),
.curricula-uebersicht-tabelle th:nth-child(4),
.curricula-uebersicht-tabelle td:nth-child(4) {
    width: 7%;
}

.curricula-uebersicht-tabelle th:nth-child(5),
.curricula-uebersicht-tabelle td:nth-child(5) {
    width: 16%;
    text-align: right;
}

.curricula-uebersicht-tabelle .curricula-aktionen-zelle {
    text-align: right;
    padding-right: 12px;
}

.curricula-uebersicht-tabelle .curricula-aktionen-inhalt {
    justify-content: flex-end;
}

.curriculum-einheiten-tabelle th:nth-child(1),
.curriculum-einheiten-tabelle td:nth-child(1) {
    width: 200px;
}

.curriculum-einheiten-tabelle th:nth-child(2),
.curriculum-einheiten-tabelle td:nth-child(2) {
    width: 150px;
}

.curriculum-einheiten-tabelle th:nth-child(4),
.curriculum-einheiten-tabelle td:nth-child(4) {
    width: 220px;
    text-align: left;
}

.curriculum-einheiten-tabelle th:nth-child(5),
.curriculum-einheiten-tabelle td:nth-child(5),
.aktionen-spalte-klein {
    width: 104px;
}

.aktionen-zelle-klein {
    gap: 6px;
}

.aktionen-zelle-klein .icon-aktion {
    width: 34px;
    height: 34px;
    flex-basis: 34px;
}

.curriculum-sollstunden-zelle {
    display: grid;
    grid-template-columns: 56px 20px;
    align-items: center;
    justify-content: start;
    column-gap: 5px;
    width: 81px;
}

.curriculum-sollstunden-wert {
    display: block;
    text-align: left;
    white-space: nowrap;
}

.curriculum-stundenhinweis {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    margin-left: 0;
    border: 0;
    border-radius: 999px;
    color: #fff;
    background: var(--farbe-orange);
    font-size: 13px;
    font-weight: 700;
    line-height: 1;
    font-family: inherit;
    font-style: normal;
    cursor: help;
    box-shadow: 0 0 0 1px #aeb9ca;
    transition: background-color .15s ease, box-shadow .15s ease;
}

.curriculum-stundenhinweis:hover,
.curriculum-stundenhinweis:focus {
    background: #d96700;
    color: #fff;
    box-shadow: 0 0 0 1px #98a7bb;
    outline: 0;
}

.curriculum-stundenhinweis:hover::after,
.curriculum-stundenhinweis:focus::after {
    content: attr(data-hinweis-text) "\A\A" attr(data-hinweis-differenz);
    position: absolute;
    right: -8px;
    bottom: calc(100% + 8px);
    z-index: 200;
    width: max-content;
    max-width: 320px;
    box-sizing: border-box;
    padding: 9px 11px;
    border: 1px solid #cbd6e6;
    border-radius: 6px;
    background: #fff;
    color: var(--farbe-dunkelblau);
    box-shadow: 0 10px 24px rgba(31, 42, 68, .16);
    font-family: inherit;
    font-style: normal;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.55;
    white-space: pre-line;
}

.curriculum-strukturfeld {
    display: grid;
    gap: 12px;
}

.curriculum-strukturfeld > span {
    margin-bottom: 0;
}

.curriculum-strukturgruppen {
    display: grid;
    gap: 12px;
}

.curriculum-strukturgruppe {
    display: grid;
    gap: 12px;
    padding: 14px;
    border: 1px solid #cbd6e6;
    border-left: 5px solid var(--farbe-dunkelblau);
    border-radius: 8px;
    background: var(--karte-hintergrund);
}

.curriculum-strukturgruppe-kopf {
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr);
    align-items: end;
    gap: 16px;
}

.curriculum-strukturgruppe-nummer {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    min-height: 64px;
    border: 0;
    background: transparent;
    color: #d8dee8;
    font-size: 60px;
    font-weight: 700;
    line-height: 1;
    box-shadow: none;
}

.curriculum-strukturgruppe-kinder {
    margin-left: 80px;
    padding-left: 16px;
    border-left: 2px solid #d7e0ed;
}

.curriculum-strukturgruppe-kinder-titel {
    display: block;
    margin: 0 0 10px;
    color: var(--farbe-dunkelblau);
    font-size: 14px;
    font-weight: 700;
}

.curriculum-unterthemen-zeilen {
    display: grid;
    gap: 10px;
}

.curriculum-unterthema-zeile {
    display: grid;
    grid-template-columns: minmax(260px, .7fr) minmax(320px, 1fr);
    gap: 14px;
    align-items: start;
    padding: 12px;
    border: 1px solid rgba(31, 42, 68, 0.10);
    border-radius: 6px;
    background: rgba(246, 248, 251, 0.72);
}

.curriculum-unterthema-zeile .formular-feld {
    margin-bottom: 0;
}

.curriculum-unterthema-zeile textarea {
    min-height: 70px;
}

.curriculum-unterthemen-aktionen {
    display: flex;
    justify-content: flex-end;
    margin-top: 10px;
}

.curriculum-unterthema-hinzufuegen {
    width: 34px;
    height: 34px;
    flex-basis: 34px;
    font-size: 22px;
    font-weight: 700;
    color: var(--farbe-dunkelblau);
}

.curriculum-lehrkraefte-auswahl {
    margin: 0 0 16px;
    border: 0;
    padding: 0;
}

.curriculum-lehrkraefte-auswahl legend {
    margin: 0 0 7px;
    color: var(--farbe-dunkelblau);
    font-size: 14px;
    font-weight: var(--formular-label-font-weight);
}

.curriculum-lehrkraefte-kacheln {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(190px, 190px));
    gap: 8px;
}

.curriculum-lehrkraft-kachel {
    display: block;
    width: 190px;
    cursor: pointer;
}

.curriculum-lehrkraft-kachel input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.curriculum-lehrkraft-kachel span {
    display: flex;
    min-height: 34px;
    align-items: center;
    justify-content: flex-start;
    border: 1px solid rgba(31, 42, 68, 0.12);
    border-radius: 6px;
    padding: 6px 10px;
    background: #f2f4f7;
    color: var(--farbe-dunkelblau);
    font-size: 13px;
    font-weight: 700;
    line-height: 1.2;
    text-align: left;
}

.curriculum-lehrkraft-kachel input:checked + span {
    border-color: var(--farbe-orange);
    background: var(--farbe-orange);
    color: #fff;
}

.curriculum-lehrkraft-kachel input:focus-visible + span {
    outline: 3px solid rgba(238, 114, 3, 0.20);
}

.curriculum-strukturaktionen {
    display: flex;
    justify-content: flex-end;
}

.curriculum-strukturgruppe-hinzufuegen {
    width: var(--button-hoehe);
    height: var(--button-hoehe);
    flex-basis: var(--button-hoehe);
    font-size: 26px;
    font-weight: 700;
    color: var(--farbe-dunkelblau);
}

.checkboxgruppe {
    display: flex;
    flex-wrap: wrap;
    gap: 14px 22px;
    margin: 4px 0 16px;
    border: 0;
    padding: 0;
}

.formular-feld-checkboxgruppe {
    border: 0;
    padding: 0;
}

.formular-feld-standorte {
    margin-top: 18px;
    margin-bottom: 14px;
}

.formular-feld-standorte .checkboxgruppe {
    margin-bottom: 0;
}

.formular-feld-checkboxgruppe legend,
.checkboxgruppe legend {
    width: 100%;
    margin-bottom: 2px;
    color: var(--farbe-dunkelblau);
    font-size: 14px;
    font-weight: var(--formular-label-font-weight);
}

.checkboxgruppe label,
.checkboxzeile {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--farbe-text);
    font-size: 14px;
}

.rechte-gruppen {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 14px;
    width: 100%;
}

.rechte-gruppe {
    border: 1px solid var(--karte-rand);
    border-radius: 6px;
    background: var(--karte-hintergrund);
    padding: 10px 12px 12px;
}

.rechte-gruppe h3 {
    margin: 0 0 9px;
    border-bottom: 1px solid #c7d7ea;
    padding-bottom: 6px;
    color: #31446a;
    font-size: 14px;
    font-weight: 700;
}

.checkboxgruppe .rechte-zeile {
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    align-items: start;
    gap: 8px;
    width: 100%;
    margin-top: 8px;
}

.rechte-zeile strong,
.rechte-zeile small {
    display: block;
}

.rechte-zeile strong {
    color: var(--farbe-dunkelblau);
    font-size: 14px;
    line-height: 1.25;
}

.rechte-zeile small {
    margin-top: 2px;
    color: #5f6f89;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.3;
}

.formular-hinweis {
    width: 100%;
    margin: 0;
    color: #5f6f89;
    font-size: 13px;
}

.formular-hinweis-vor-feld {
    margin-bottom: 14px;
}

.formular-hinweis-mit-abstand {
    margin-top: 8px;
    margin-bottom: 14px;
}

.datenbereich-hinweis {
    margin: 0;
    padding: 14px 20px;
    border-bottom: 1px solid rgba(31, 42, 68, 0.09);
    color: #40506c;
    font-size: 13px;
}

.hub-hinweisbox,
.formular-hinweisbox {
    align-items: flex-start;
    background: var(--farbe-orange-flaeche-zart);
    box-sizing: border-box;
    color: #5f6f89;
    display: grid;
    gap: 10px;
    grid-template-columns: 18px minmax(0, 1fr);
    font-size: var(--schrift-hinweis);
    font-weight: var(--schrift-hinweisgewicht);
    line-height: 1.4;
    margin: 0;
    padding: 12px 18px;
}

.hub-hinweisbox-icon,
.formular-hinweisbox::before {
    align-items: center;
    border: 1px solid currentColor;
    border-radius: 50%;
    box-sizing: border-box;
    content: "i";
    display: inline-flex;
    flex: 0 0 18px;
    font-size: 12px;
    font-weight: 700;
    height: 18px;
    justify-content: center;
    line-height: 1;
    margin-top: 1px;
    width: 18px;
}

.hub-hinweisbox p,
.formular-hinweisbox p {
    margin: 0;
}

.sondermeldungs-vorschau {
    display: grid;
    gap: 12px;
    padding: 16px 20px 20px;
}

.sondermeldung-box {
    border-left: 5px solid var(--farbe-orange);
    border-radius: 6px;
    padding: 14px 16px;
    background: #fff6e8;
}

.sondermeldung-box-kopf {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 2px;
    margin-bottom: 8px;
}

.sondermeldung-box h3 {
    margin: 0;
    color: var(--farbe-dunkelblau);
    font-size: 16px;
}

.sondermeldung-box p {
    margin: 0;
    color: #263650;
    font-size: 14px;
    line-height: 1.45;
}

.css-editor {
    width: 100%;
    min-height: 460px;
    resize: vertical;
    border: 0;
    border-radius: 0;
    padding: 14px;
    background: #101827;
    color: #f8fafc;
    font-family: Consolas, "Courier New", monospace;
    font-size: 13px;
    line-height: 1.45;
    tab-size: 4;
}

.formular-feld textarea.css-editor {
    background: #101827;
    color: #e5eefc;
    -webkit-text-fill-color: #e5eefc;
    font-family: Consolas, "Courier New", monospace;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.45;
}

.css-editor:focus {
    outline: 0;
}

.css-editor-rahmen {
    display: grid;
    grid-template-columns: 56px minmax(0, 1fr);
    min-height: 460px;
    border: 1px solid #a9b3c6;
    border-radius: 6px;
    overflow: hidden;
    background: #101827;
}

.css-editor-rahmen:focus-within {
    border-color: var(--farbe-orange);
    outline: 3px solid rgba(238, 114, 3, 0.18);
}

.css-editor-zeilennummern {
    min-height: 460px;
    padding: 14px 10px;
    overflow: hidden;
    border-right: 1px solid rgba(248, 250, 252, 0.14);
    background: #0b1220;
    color: #7f8da3;
    font-family: Consolas, "Courier New", monospace;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.45;
    text-align: right;
    user-select: none;
    white-space: pre;
}

.formular-kompakt {
    padding-top: 0;
}

.admin-seite input[type="checkbox"] {
    -webkit-appearance: none;
    appearance: none;
    background: #fff;
    border: 1px solid #b8c5d8;
    border-radius: 3px;
    cursor: pointer;
    display: inline-block;
    flex: 0 0 auto;
    height: 16px;
    margin: 0;
    min-height: 16px;
    min-width: 16px;
    vertical-align: middle;
    width: 16px;
}

.admin-seite input[type="checkbox"]:checked {
    background-color: var(--farbe-orange);
    background-image: url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 12 12' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2.2 6.1 4.8 8.6 9.8 3.4' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 75% 75%;
    border-color: var(--farbe-orange);
}

.admin-seite input[type="checkbox"]:focus-visible {
    outline: 3px solid rgba(238, 114, 3, 0.22);
    outline-offset: 2px;
}

.admin-seite input[type="checkbox"]:disabled {
    cursor: not-allowed;
    opacity: 0.62;
}

.admin-seite input[type="checkbox"]:indeterminate {
    background-color: var(--farbe-orange);
    background-image: linear-gradient(#fff, #fff);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 9px 2px;
    border-color: var(--farbe-orange);
}

.checkboxgruppe input,
.checkboxzeile input {
    width: 16px;
    height: 16px;
}

.checkbox-einzel {
    display: inline-flex;
    align-items: center;
    align-self: start;
    gap: 9px;
    min-height: 38px;
    margin: 21px 0 16px;
    color: var(--farbe-dunkelblau);
    font-weight: 700;
    white-space: nowrap;
}

.checkbox-einzel .checkboxzeile {
    min-height: 38px;
    margin-bottom: 0;
}

.checkbox-einzel input {
    width: 18px;
    height: 18px;
    min-height: 18px;
    min-width: 18px;
}

.formularaktionen,
.formular-aktionen {
    display: flex;
    align-items: center;
    gap: 12px;
    justify-content: flex-start;
    margin-top: 16px;
}

.hub-dialog-aktionen,
.hub-dialog-overlay .warnbereich.hub-bestaetigungsbereich-dialog .formularaktionen {
    align-items: center;
    background: #f4f7fb;
    border: 1px solid var(--karte-rand);
    border-radius: 6px;
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    margin-top: 18px;
    padding: 10px 12px;
}

.formular-aktionen-fuss,
.karten-aktionsfuss {
    align-items: center;
    background: var(--karte-flaeche-abgesetzt);
    border-top: 1px solid var(--karte-trennlinie);
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: flex-end;
    margin-top: 0;
    padding: 14px;
}

.formular-aktionen-fuss .primaer-button,
.formular-aktionen-fuss .sekundaer-button,
.formular-aktionen-fuss .gefahr-button,
.karten-aktionsfuss .primaer-button,
.karten-aktionsfuss .sekundaer-button,
.karten-aktionsfuss .gefahr-button {
    flex: 0 0 auto;
    width: auto;
}

.formularbereich > .formularaktionen:not(.formularaktionen-kompakt):not(.listenfilter-aktionen):not(.kontaktstunden-filteraktionen):not(.protokoll-navigation):not(.firmenzuordnung-filteraktionen):not(.hub-dialog-aktionen):not(.anwesenheit-kalender-dialog-aktionen),
.formularbereich > .formular-aktionen:not(.formularaktionen-kompakt):not(.listenfilter-aktionen):not(.kontaktstunden-filteraktionen):not(.protokoll-navigation):not(.firmenzuordnung-filteraktionen):not(.hub-dialog-aktionen):not(.anwesenheit-kalender-dialog-aktionen),
.verwaltungsformular > .formularaktionen:not(.formularaktionen-kompakt):not(.listenfilter-aktionen):not(.kontaktstunden-filteraktionen):not(.protokoll-navigation):not(.firmenzuordnung-filteraktionen):not(.hub-dialog-aktionen):not(.anwesenheit-kalender-dialog-aktionen),
.verwaltungsformular > .formular-aktionen:not(.formularaktionen-kompakt):not(.listenfilter-aktionen):not(.kontaktstunden-filteraktionen):not(.protokoll-navigation):not(.firmenzuordnung-filteraktionen):not(.hub-dialog-aktionen):not(.anwesenheit-kalender-dialog-aktionen) {
    background: var(--karte-flaeche-abgesetzt);
    border-top: 1px solid var(--karte-trennlinie);
    justify-content: flex-end;
    margin-top: 0;
    padding: 14px;
}

.formularbereich > .formularaktionen:not(.formularaktionen-kompakt):not(.listenfilter-aktionen):not(.kontaktstunden-filteraktionen):not(.protokoll-navigation):not(.firmenzuordnung-filteraktionen):not(.hub-dialog-aktionen):not(.anwesenheit-kalender-dialog-aktionen) .primaer-button,
.formularbereich > .formularaktionen:not(.formularaktionen-kompakt):not(.listenfilter-aktionen):not(.kontaktstunden-filteraktionen):not(.protokoll-navigation):not(.firmenzuordnung-filteraktionen):not(.hub-dialog-aktionen):not(.anwesenheit-kalender-dialog-aktionen) .sekundaer-button,
.formularbereich > .formularaktionen:not(.formularaktionen-kompakt):not(.listenfilter-aktionen):not(.kontaktstunden-filteraktionen):not(.protokoll-navigation):not(.firmenzuordnung-filteraktionen):not(.hub-dialog-aktionen):not(.anwesenheit-kalender-dialog-aktionen) .gefahr-button,
.verwaltungsformular > .formularaktionen:not(.formularaktionen-kompakt):not(.listenfilter-aktionen):not(.kontaktstunden-filteraktionen):not(.protokoll-navigation):not(.firmenzuordnung-filteraktionen):not(.hub-dialog-aktionen):not(.anwesenheit-kalender-dialog-aktionen) .primaer-button,
.verwaltungsformular > .formularaktionen:not(.formularaktionen-kompakt):not(.listenfilter-aktionen):not(.kontaktstunden-filteraktionen):not(.protokoll-navigation):not(.firmenzuordnung-filteraktionen):not(.hub-dialog-aktionen):not(.anwesenheit-kalender-dialog-aktionen) .sekundaer-button,
.verwaltungsformular > .formularaktionen:not(.formularaktionen-kompakt):not(.listenfilter-aktionen):not(.kontaktstunden-filteraktionen):not(.protokoll-navigation):not(.firmenzuordnung-filteraktionen):not(.hub-dialog-aktionen):not(.anwesenheit-kalender-dialog-aktionen) .gefahr-button {
    flex: 0 0 auto;
    width: auto;
}

.primaer-button-schmal {
    width: auto;
    min-width: 150px;
    padding-inline: 14px;
}

.aktionen-zelle {
    display: flex;
    flex-wrap: nowrap;
    gap: 8px;
    align-items: center;
    justify-content: flex-start;
    white-space: nowrap;
}

.inline-aktion {
    margin: 0;
}

.icon-aktion-gefahr {
    background: var(--button-symbol-hintergrund);
}

.icon-aktion.icon-aktion-gefahr:hover,
.icon-aktion.icon-aktion-gefahr:focus,
.icon-aktion-gefahr:hover,
.icon-aktion-gefahr:focus {
    border-color: rgba(180, 35, 24, 0.35);
    background: var(--farbe-button-gefahr);
}

.icon-aktion.icon-aktion-gefahr:hover img,
.icon-aktion.icon-aktion-gefahr:focus img,
.icon-aktion-gefahr:hover img,
.icon-aktion-gefahr:focus img {
    filter: brightness(0) invert(1);
}

.sortiergriff {
    width: var(--button-hoehe);
    min-width: var(--button-hoehe);
    height: var(--button-hoehe);
    min-height: var(--button-hoehe);
    padding: 0;
    border: 1px solid var(--farbe-button-sekundaer-rand);
    border-radius: var(--button-radius);
    background: var(--farbe-button-sekundaer);
    color: var(--farbe-button-sekundaer-text);
    font-size: 22px;
    font-weight: 700;
    line-height: 1;
    cursor: grab;
}

.sortiergriff:active {
    cursor: grabbing;
}

.eintrag-deaktiviert {
    color: #7a8495;
}

.datentabelle tbody tr.eintrag-deaktiviert {
    background: rgba(120, 130, 145, 0.10);
}

.datentabelle tbody tr.eintrag-deaktiviert:hover {
    background: var(--farbe-tabellen-hover);
}

.datentabelle tbody tr.eintrag-deaktiviert:hover td {
    background: var(--farbe-tabellen-hover);
}

.eintrag-deaktiviert .icon-aktion {
    display: inline-flex;
    width: var(--button-symbol-hoehe);
    height: var(--button-symbol-hoehe);
    flex: 0 0 var(--button-symbol-hoehe);
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    border: 1px solid var(--button-symbol-rand);
    border-radius: var(--button-radius);
    padding: 0;
    background: var(--button-symbol-hintergrund);
    cursor: pointer;
    text-decoration: none;
}

.anwesenheit-sammelaktion {
    margin-top: 12px;
    margin-left: 20px;
}

.backup-aktionen {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

.backup-einstellungen-formular {
    max-width: 980px;
}

.backup-einstellungen-raster {
    display: flex;
    flex-wrap: wrap;
    gap: 14px 40px;
    align-items: center;
}

.backup-einstellungen-checkbox {
    min-width: 0;
    min-height: var(--formular-element-hoehe);
    margin: 0;
    white-space: normal;
}

.backup-einstellungen-checkbox .checkboxzeile {
    align-items: center;
    line-height: 1.35;
}

.backup-einstellungen-aufbewahrung {
    display: grid;
    grid-template-columns: auto minmax(120px, 160px);
    gap: 12px;
    align-items: center;
    margin: 0;
}

.backup-einstellungen-formular .backup-einstellungen-aufbewahrung > span:first-child {
    display: block;
    margin: 0;
    white-space: nowrap;
}

.backup-einstellungen-formular .backup-einstellungen-aufbewahrung .backup-einstellungen-eingabegruppe {
    display: grid;
    grid-template-columns: minmax(120px, 1fr) auto;
    gap: 10px;
    align-items: center;
    margin-bottom: 0;
}

.backup-einstellungen-formular .backup-einstellungen-eingabegruppe input {
    min-width: 0;
}

.backup-einstellungen-formular .backup-einstellungen-einheit {
    margin: 0;
    color: #40506c;
    font-size: 14px;
    font-weight: 700;
}

.backup-einstellungen-hinweis {
    max-width: 900px;
    line-height: 1.45;
    overflow-wrap: anywhere;
}

.formular-inline {
    display: inline-flex;
    margin: 0;
}

.warnbereich {
    width: 98%;
    margin-bottom: 24px;
    border: 1px solid rgba(180, 35, 24, 0.22);
    border-left: 5px solid var(--farbe-fehler);
    border-radius: 8px;
    padding: 18px 20px;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 12px 28px rgba(31, 42, 68, 0.10);
}

.warnbereich h2 {
    margin: 0 0 16px;
    color: var(--farbe-fehler);
    font-size: 20px;
}

.warnbereich p {
    margin: 0 0 14px;
}

.warnbereich form:not(.backup-wiederherstellung-formular) {
    display: flex;
    align-items: center;
    gap: 12px;
}

.hub-dialog-overlay .warnbereich.hub-bestaetigungsbereich-dialog {
    width: min(920px, calc(100vw - 56px));
    max-height: calc(100vh - 56px);
    margin: 0;
    overflow-y: auto;
    border-color: rgba(238, 114, 3, 0.24);
    border-left-color: var(--farbe-orange);
    background: var(--karte-inhalt-hintergrund);
    box-shadow: 0 24px 62px rgba(31, 42, 68, 0.28);
    transform: translateY(10px) scale(0.985);
    transition: transform 180ms ease;
}

.hub-dialog-overlay.hub-dialog-ist-sichtbar .warnbereich.hub-bestaetigungsbereich-dialog {
    transform: translateY(0) scale(1);
}

.hub-dialog-overlay .warnbereich.hub-bestaetigungsbereich-dialog form:not(.backup-wiederherstellung-formular) {
    margin-top: 16px;
}

.hub-dialog-overlay .warnbereich.hub-bestaetigungsbereich-dialog .backup-wiederherstellung-formular {
    grid-template-columns: 1fr 1fr auto;
}
.backup-wiederherstellung-formular {
    display: grid;
    grid-template-columns: minmax(280px, 1fr) minmax(280px, 1fr) auto;
    gap: 12px;
    align-items: end;
}

.backup-wiederherstellung-feld {
    margin-bottom: 0;
}

.backup-wiederherstellung-aktion {
    display: flex;
    align-items: center;
    min-height: var(--formular-element-hoehe);
}

.wiederherstellung-ausfuehren-block {
    margin-top: 28px !important;
}

.datenbereich-kopf {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 18px 20px;
    border-bottom: 1px solid var(--karte-trennlinie);
}

.admin-seite .datenbereich-kopf,
.admin-seite .dashboard-bereich-kopf {
    align-items: center;
    background: #f4f7fb;
    border-bottom: 0;
    border-radius: 8px 8px 0 0;
    box-shadow: 0 1px 0 var(--karte-trennlinie);
    display: flex;
    gap: 18px;
    justify-content: space-between;
    padding: 12px 18px;
}

.datenbereich-kopf h2 {
    margin: 0;
    color: var(--farbe-dunkelblau);
    font-size: var(--schrift-kartenkopf);
    font-weight: var(--schrift-kartenkopfgewicht);
}

.admin-seite .dashboard-bereich-kopf h2 {
    margin: 0;
    color: var(--farbe-dunkelblau);
    font-size: var(--schrift-kartenkopf);
    font-weight: var(--schrift-kartenkopfgewicht);
}

.datenbereich-kopf-aktionen {
    align-items: center;
    display: flex;
    gap: 12px;
    margin-left: auto;
}

.datenbereich-inhalt {
    display: grid;
    gap: 14px;
    padding: 18px 20px 20px;
}

.datenbereich-inhalt p {
    color: #42526f;
    line-height: 1.45;
    margin: 0;
}

.zaehler {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    justify-content: center;
    min-height: 24px;
    min-width: 24px;
    border-radius: 5px;
    padding: 0 6px;
    background: rgba(238, 114, 3, 0.12);
    color: var(--farbe-dunkelblau);
    font-size: 12px;
    font-weight: 700;
    line-height: 1.2;
    white-space: nowrap;
}

.tabellenrahmen {
    overflow-x: auto;
}

.datentabelle {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--schrift-normal);
}

.datentabelle th,
.datentabelle td {
    padding: 13px 16px;
    border-bottom: 1px solid rgba(31, 42, 68, 0.09);
    text-align: left;
    vertical-align: middle;
}

.datentabelle tbody tr {
    min-height: 64px;
}

.datentabelle td {
    height: 64px;
}

.datentabelle-parameter {
    table-layout: fixed;
}

.datentabelle-parameter th:first-child,
.datentabelle-parameter td:first-child {
    width: 40%;
}

.datentabelle th {
    background: rgba(31, 42, 68, 0.05);
    color: var(--farbe-dunkelblau);
    font-weight: 500;
}

@media (min-width: 900px) {
    .datenbereich-kopf-fixiert,
    .datenbereich:has(.datentabelle-kopf-fixiert),
    .tabellenrahmen-kopf-fixiert,
    .tabelle-scroll:has(> .datentabelle-kopf-fixiert),
    .tabellenrahmen:has(> .datentabelle-kopf-fixiert) {
        overflow: visible;
    }

    .datentabelle-kopf-fixiert {
        border-collapse: separate;
        border-spacing: 0;
    }

    .datentabelle-kopf-fixiert thead {
        position: sticky;
        top: var(--leiste-hoehe, 56px);
        z-index: 8;
    }

    .datentabelle-kopf-fixiert thead th {
        position: relative;
        z-index: 1;
        background: var(--tabellenkopf-hintergrund, var(--karte-flaeche-abgesetzt));
        box-shadow: 0 1px 0 rgba(31, 42, 68, 0.09);
    }
}
.datentabelle > tbody:not(.datentabelle-eintragsgruppe) > tr:nth-child(odd):not(.tabellenstandard-ohne-zebra) > td {
    background: var(--farbe-tabellen-zeile-ungerade);
}

.datentabelle > tbody:not(.datentabelle-eintragsgruppe) > tr:nth-child(even):not(.tabellenstandard-ohne-zebra) > td {
    background: var(--farbe-tabellen-zeile-gerade);
}

.datentabelle > tbody.datentabelle-eintragsgruppe:nth-of-type(odd) tr,
.datentabelle > tbody.datentabelle-eintragsgruppe:nth-of-type(odd) tr td {
    background: var(--farbe-tabellen-zeile-ungerade);
}

.datentabelle > tbody.datentabelle-eintragsgruppe:nth-of-type(even) tr,
.datentabelle > tbody.datentabelle-eintragsgruppe:nth-of-type(even) tr td {
    background: var(--farbe-tabellen-zeile-gerade);
}

.datentabelle tbody tr.datentabelle-gruppe-gerade td {
    background: var(--farbe-tabellen-zeile-ungerade);
}

.datentabelle tbody tr.datentabelle-gruppe-ungerade td {
    background: var(--farbe-tabellen-zeile-gerade);
}

.datentabelle tbody tr:hover,
.datentabelle > tbody:not(.datentabelle-eintragsgruppe) > tr:hover > td,
.datentabelle tbody.datentabelle-eintragsgruppe:hover tr,
.datentabelle tbody.datentabelle-eintragsgruppe:hover tr td,
.datentabelle tbody tr.datentabelle-gruppe-gerade:hover td,
.datentabelle tbody tr.datentabelle-gruppe-ungerade:hover td {
    background: var(--farbe-tabellen-hover);
}

.datentabelle tbody tr.datentabelle-gruppe-hat-fortsetzung td {
    border-bottom-color: transparent;
}

.tabellenleer {
    color: #5f6f89;
    text-align: center;
}

.leerzustand-standard {
    box-sizing: border-box;
    min-height: 64px;
    padding: 13px 16px;
    color: #5f6f89;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.45;
    text-align: left;
    background: var(--farbe-tabellen-hover);
    width: 100%;
}

.datentabelle tr.leerzustand-zeile td.leerzustand-standard,
.datentabelle tr.leerzustand-zeile:hover td.leerzustand-standard,
.datentabelle > tbody:not(.datentabelle-eintragsgruppe) > tr.leerzustand-zeile > td.leerzustand-standard,
.datentabelle > tbody:not(.datentabelle-eintragsgruppe) > tr.leerzustand-zeile:hover > td.leerzustand-standard {
    background: var(--farbe-leerzustand) !important;
}

.datentabelle tr.leerzustand-zeile,
.datentabelle tr.leerzustand-zeile:hover {
    background: var(--farbe-leerzustand) !important;
}

.leerzustand-standard:hover {
    background: var(--farbe-leerzustand);
}

div.leerzustand-standard {
    display: flex;
    align-items: center;
}

.tabellenspalte-nowrap {
    white-space: nowrap;
}

.protokoll-benutzer {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 2px;
    line-height: 1.32;
    text-align: right;
    white-space: nowrap;
}

.protokoll-zeitpunkt {
    align-items: center;
    color: #425675;
    display: inline-flex;
    gap: 7px;
    line-height: 1.32;
    white-space: nowrap;
}

.protokoll-zeitpunkt-punkt {
    color: #8a98ad;
}

.protokoll-tabelle {
    border-collapse: separate;
    border-spacing: 0;
    table-layout: auto;
    width: 100%;
}

.protokoll-tabelle th,
.protokoll-tabelle td {
    vertical-align: top;
}

.protokoll-spalte-zeitpunkt {
    width: 120px;
}

.protokoll-spalte-ereignis {
    width: 190px;
}

.protokoll-spalte-beschreibung {
    width: 34%;
}

.protokoll-spalte-wert {
    width: 14%;
}

.protokoll-spalte-benutzer {
    width: 150px;
}

.protokoll-spalte-eintrag {
    width: 100%;
}

.protokoll-tabelle thead {
    display: none;
}

.protokoll-tabelle th:nth-child(1),
.protokoll-tabelle td:nth-child(1),
.protokoll-tabelle th:nth-child(2),
.protokoll-tabelle td:nth-child(2),
.protokoll-tabelle th:nth-child(6),
.protokoll-tabelle td:nth-child(6) {
    white-space: nowrap;
}

.protokoll-tabelle th:nth-child(6),
.protokoll-tabelle td:nth-child(6) {
    text-align: right;
}

.protokoll-tabelle .protokoll-ereignis {
    white-space: normal;
}

.protokoll-tabelle td.protokoll-eintrag {
    padding: 18px 24px 18px 36px;
    text-align: left;
    white-space: normal;
}

.protokoll-tabelle .protokoll-fakten tr:hover,
.protokoll-tabelle .protokoll-fakten tr:hover > th,
.protokoll-tabelle .protokoll-fakten tr:hover > td {
    background: transparent;
}

.protokoll-eintrag-kopf {
    align-items: center;
    display: flex;
    gap: 18px;
    justify-content: space-between;
}

.protokoll-eintrag-inhalt {
    --protokoll-label-breite: 185px;
    display: grid;
    gap: 8px;
    margin-top: 14px;
    padding-left: 0;
}

.protokoll-kontext {
    line-height: 1.45;
}

.protokoll-kontext > span {
    font-weight: 600;
}

.protokoll-textzeile {
    align-items: start;
    column-gap: 12px;
    display: grid;
    grid-template-columns: var(--protokoll-label-breite) minmax(0, 1fr);
    line-height: 1.45;
}

.protokoll-textzeile > span:first-child {
    font-weight: 700;
    white-space: nowrap;
}

.protokoll-beschreibung-zeile > .protokoll-beschreibung {
    min-width: 0;
}

.protokoll-ereignis-zeile {
    margin-top: 4px;
}

.protokoll-eintrag-inhalt > .protokoll-ereignis-zeile:first-child {
    margin-top: 0;
}

.protokoll-eintrag-meta {
    align-items: flex-start;
    display: flex;
    flex-wrap: wrap;
    gap: 12px 18px;
    min-width: 0;
}

.protokoll-eintrag-kopf .protokoll-benutzer {
    flex: 0 0 auto;
}

.protokoll-tabelle .protokoll-beschreibung {
    overflow-wrap: anywhere;
    white-space: normal;
}

.protokoll-planungsfakten {
    display: grid;
    gap: 8px;
}

.protokoll-fakten {
    border-collapse: collapse;
    table-layout: fixed;
    width: 100%;
}

.protokoll-fakten .protokoll-fakten-spalte-label {
    width: var(--protokoll-label-breite);
}

.protokoll-fakten.protokoll-fakten-label-breit .protokoll-fakten-spalte-label {
    width: 260px;
}

.protokoll-fakten.protokoll-fakten-label-sehr-breit .protokoll-fakten-spalte-label {
    width: 360px;
}

.protokoll-tabelle .protokoll-fakten th,
.protokoll-tabelle .protokoll-fakten td {
    border-bottom: 1px solid var(--karte-trennlinie);
    box-sizing: border-box;
    height: auto;
    overflow-wrap: anywhere;
    padding: 5px 10px 5px 0;
    text-align: left;
    vertical-align: top;
    white-space: normal;
}

.protokoll-tabelle .protokoll-fakten tr {
    height: auto;
    min-height: 0;
}

.protokoll-fakten tr:last-child > * {
    border-bottom: 0;
}

.protokoll-tabelle .protokoll-fakten th {
    background: transparent;
    font-weight: 400;
    padding-right: 18px;
    white-space: nowrap;
    width: var(--protokoll-label-breite);
}

.protokoll-tabelle .protokoll-fakten td {
    padding-left: 12px;
}

.protokoll-tabelle .protokoll-fakten-kopf th {
    color: #425675;
    font-size: 0.92em;
    font-weight: 600;
    padding-top: 10px;
    width: auto;
}

.protokoll-tabelle .protokoll-fakten-kopf th:not(:first-child) {
    padding-left: 12px;
}

.protokoll-planungsfakten-trenner {
    border-top: 1px solid var(--karte-trennlinie);
    margin: 4px 0;
}

@media (max-width: 640px) {
    .protokoll-fakten.protokoll-fakten-label-breit .protokoll-fakten-spalte-label,
    .protokoll-fakten.protokoll-fakten-label-sehr-breit .protokoll-fakten-spalte-label {
        width: 45%;
    }

    .protokoll-tabelle .protokoll-fakten-label-breit th,
    .protokoll-tabelle .protokoll-fakten-label-sehr-breit th {
        white-space: normal;
    }

    .protokoll-tabelle .protokoll-fakten th,
    .protokoll-tabelle .protokoll-fakten td {
        padding-right: 6px;
    }

}

.protokoll-details {
    margin-top: 12px;
}

.protokoll-details > summary {
    align-items: center;
    color: #425675;
    cursor: pointer;
    display: inline-flex;
    font-weight: 600;
    gap: 8px;
    list-style: none;
}

.protokoll-details > summary::-webkit-details-marker {
    display: none;
}

.protokoll-details > summary:hover {
    color: var(--farbe-orange);
}

.protokoll-details-pfeil {
    border-color: transparent transparent transparent var(--farbe-orange);
    border-style: solid;
    border-width: 6px 0 6px 8px;
    height: 0;
    transition: transform 0.16s ease;
    width: 0;
}

.protokoll-details[open] .protokoll-details-pfeil {
    transform: rotate(90deg);
}

.protokoll-details[open] > summary span:last-child {
    font-size: 0;
}

.protokoll-details[open] > summary span:last-child::after {
    content: 'Details ausblenden';
    font-size: var(--schrift-normal);
}
.protokoll-wertvergleich {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-top: 12px;
}

.protokoll-wertvergleich section {
    background: var(--karte-inhalt-hintergrund);
    border: 1px solid #d9e5f2;
    border-radius: 6px;
    min-width: 0;
    padding: 10px 12px;
}

.protokoll-wertvergleich h4 {
    color: #526487;
    font-size: var(--schrift-klein);
    font-weight: 600;
    margin: 0 0 6px;
}

.protokoll-tabelle .protokoll-wert {
    line-height: 1.42;
    overflow-wrap: anywhere;
    white-space: pre-wrap;
}

@media (max-width: 920px) {
    .protokoll-eintrag-kopf,
    .protokoll-eintrag-meta {
        display: grid;
    }

    .protokoll-eintrag-kopf .protokoll-benutzer {
        align-items: flex-start;
        text-align: left;
    }

    .protokoll-wertvergleich {
        grid-template-columns: 1fr;
    }
}

.protokoll-tabelle .protokoll-leerwert {
    color: #6d7890;
}

.protokoll-tabelle .protokoll-datensatzlink {
    color: #1f3f72;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.protokoll-tabelle .protokoll-datensatzlink:hover {
    color: #ee7203;
}

.raumplan-vorschau-woche {
    margin-top: 20px;
}

.datenbereich-unterkopf {
    padding: 14px 18px;
    border-top: 1px solid rgba(31, 42, 68, 0.09);
    border-bottom: 1px solid rgba(31, 42, 68, 0.09);
    background: rgba(31, 42, 68, 0.06);
}

.datenbereich-unterkopf h3 {
    margin: 0;
    color: var(--farbe-dunkelblau);
    font-size: var(--schrift-kartenkopf);
    font-weight: var(--schrift-kartenkopfgewicht);
}

.raumplan-vorschau-tabelle {
    table-layout: fixed;
    min-width: 1280px;
}

.raumplan-vorschau-tabelle th:first-child,
.raumplan-vorschau-tabelle td:first-child {
    width: 92px;
}

.raumplan-vorschau-tabelle th:nth-child(2),
.raumplan-vorschau-tabelle td:nth-child(2) {
    width: 210px;
}

.raumplan-vorschau-tabelle td {
    height: 44px;
    padding-block: 6px;
    vertical-align: middle;
    font-size: 11px;
    font-weight: 400;
}

.raumplan-vorschau-tabelle th {
    padding-block: 7px;
    font-size: 11px;
    font-weight: 400;
}

.raumplan-vorschau-tabelle td span,
.raumplan-vorschau-tabelle td small {
    display: block;
}

.raumplan-vorschau-tabelle td small {
    margin-top: 2px;
    color: #147533;
    font-size: 9px;
    font-weight: 400;
}

.raumplan-vorschau-geplant {
    background: rgba(232, 238, 251, 0.72);
}

.raumplan-vorschau-gesperrt {
    background: transparent;
}

body.menue-eingeklappt .seitenmenue {
    width: var(--menue-schmal);
}

body.menue-eingeklappt .arbeitsbereich {
    margin-left: var(--menue-schmal);
}

body.menue-eingeklappt .obere-leiste {
    left: var(--menue-schmal);
}

body.menue-eingeklappt .menue-marke {
    align-items: center;
    padding-inline: 10px;
}

body.menue-eingeklappt .menue-marke-gross,
body.menue-eingeklappt .menuepunkt span,
body.menue-eingeklappt .menuegruppe-titel span,
body.menue-eingeklappt .standort-name,
body.menue-eingeklappt .seitenmenue-externe {
    display: none;
}

body.menue-eingeklappt .standort-ast {
    margin-left: 0;
}

body.menue-eingeklappt .menuepunkt,
body.menue-eingeklappt .menuegruppe-titel {
    justify-content: center;
}

@media (max-width: 900px) {
    .statusmeldungen-layer {
        left: 18px;
    }
    .hinweisraster {
        grid-template-columns: 1fr;
    }

    .formularraster {
        grid-template-columns: 1fr;
    }

    .backup-einstellungen-raster {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }

    .backup-einstellungen-aufbewahrung {
        grid-template-columns: 1fr;
        width: 100%;
    }

    .obere-leiste {
        padding-inline: 18px;
    }

    .inhalt {
        padding: 24px;
    }
}

.nur-screenreader {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.anwesenheitskalender {
    margin: 18px 24px 22px;
    border: 1px solid rgba(31, 42, 68, 0.12);
    border-radius: 8px;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.82);
    box-shadow: 0 16px 36px rgba(31, 42, 68, 0.08);
}

.anwesenheitskalender-kopf {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 18px 20px 12px;
    border-bottom: 1px solid rgba(31, 42, 68, 0.08);
}

.anwesenheitskalender-kopf h3 {
    margin: 0;
    color: var(--farbe-dunkelblau);
    font-size: var(--schrift-kartenkopf);
    font-weight: var(--schrift-kartenkopfgewicht);
}

.anwesenheitskalender-kopf p {
    margin: 5px 0 0;
    color: var(--farbe-text-gedaempft);
    font-size: 13px;
}

.anwesenheitskalender-navigation {
    display: flex;
    gap: 8px;
    flex: 0 0 auto;
}

.praxiseinsatz-suchekarte,
.praxiseinsatz-zuordnungskarte,
.praxiseinsatz-timelinekarte {
    margin-bottom: 18px;
}

.praxiseinsatz-timeline-filter {
    background: #fff;
    border-bottom: 1px solid var(--karte-trennlinie);
    padding: 16px 18px;
}

.praxiseinsatz-timeline-filter label {
    display: block;
    margin: 0;
}

.praxiseinsatz-timeline-filter input[type="search"] {
    border-color: #b9c6d8;
    border-radius: 8px;
    box-shadow: 0 8px 18px rgba(31, 42, 68, 0.12);
    font-size: 1rem;
    min-height: 46px;
    padding: 0 16px;
    width: 100%;
}

.praxiseinsatz-timeline-filter-hinweis {
    margin: 0 16px 12px;
}

.praxiseinsatz-suche {
    padding: 14px;
}

.praxiseinsatz-suchergebnisse {
    display: grid;
    gap: 8px;
    margin-top: 12px;
    max-height: 360px;
    overflow: auto;
}

.praxiseinsatz-suchergebnis {
    align-items: center;
    background: var(--karte-inhalt-hintergrund);
    border: 1px solid #cbdff4;
    border-radius: 6px;
    display: flex;
    gap: 14px;
    justify-content: space-between;
    padding: 10px 12px;
}

.praxiseinsatz-suchergebnis strong,
.praxiseinsatz-zuordnungsliste strong {
    display: block;
    font-weight: 560;
}

.praxiseinsatz-suchergebnis span,
.praxiseinsatz-suchergebnis small,
.praxiseinsatz-suchergebnis em,
.praxiseinsatz-zuordnungsliste span {
    color: #33456b;
    display: block;
    font-size: var(--schrift-normal);
    font-style: normal;
    line-height: 1.35;
}

.praxiseinsatz-zuordnungsliste {
    display: grid;
    gap: 8px;
    padding: 14px;
}

.praxiseinsatz-zuordnungsliste article {
    align-items: center;
    background: var(--karte-inhalt-hintergrund);
    border: 1px solid #d8e5f4;
    border-radius: 6px;
    display: flex;
    gap: 12px;
    justify-content: space-between;
    padding: 10px 12px;
}

.praxiseinsatz-zeitleiste {
    --praxiseinsatz-achsen-breite: clamp(12000px, 1500vw, 22000px);
    --praxiseinsatz-label-breite: 300px;
    --praxiseinsatz-heute-farbe: #ee7203;
    --praxiseinsatz-zeile-minhoehe: 230px;
    padding: 16px;
}

.praxiseinsatz-zeitleiste-legende {
    display: none;
}

.praxiseinsatz-zeitleiste-achskopf {
    min-height: 38px;
    position: relative;
}

.praxiseinsatz-zeitleiste-scroll {
    min-width: 0;
    overflow-x: auto;
    overflow-y: visible;
    padding-bottom: 8px;
    position: relative;
    scrollbar-color: #8fa8c7 #edf3fa;
    scrollbar-width: thin;
}

.praxiseinsatz-zeitleiste-kopfscroll {
    padding-bottom: 0;
    scrollbar-width: none;
}

.praxiseinsatz-zeitleiste-kopfscroll::-webkit-scrollbar {
    display: none;
}

.praxiseinsatz-zeitleiste-achse-innen {
    min-width: 100%;
    position: relative;
    width: var(--praxiseinsatz-achsen-breite);
}

.praxiseinsatz-zeitleiste-fenster {
    min-width: 0;
    padding-top: 30px;
    position: relative;
}

.praxiseinsatz-zeitleiste-position {
    background: #fff8f1;
    border: 1px solid #efb47d;
    border-radius: 4px;
    color: var(--praxiseinsatz-heute-farbe);
    display: block;
    font-size: var(--schrift-klein);
    font-weight: 600;
    left: 50%;
    line-height: 1;
    margin: 0;
    padding: 4px 8px;
    pointer-events: none;
    position: absolute;
    top: 0;
    transform: translateX(-50%);
    white-space: nowrap;
    z-index: 7;
}

.praxiseinsatz-zeitleiste-position::after {
    content: none;
}

.praxiseinsatz-zeitleiste-mittenlinie {
    background: var(--praxiseinsatz-heute-farbe);
    display: block;
    height: calc(max(var(--praxiseinsatz-achse-hoehe, 110px), var(--praxiseinsatz-zeile-minhoehe)) + 74px);
    left: 50%;
    pointer-events: none;
    position: absolute;
    top: 0;
    transform: translateX(-1px);
    width: 2px;
    z-index: 4;
}

.praxiseinsatz-zeile-datumsleiste {
    align-items: end;
    color: #526487;
    display: flex;
    font-size: var(--schrift-klein);
    justify-content: space-between;
    min-height: 44px;
    padding: 8px 2px 8px;
    position: relative;
}

.praxiseinsatz-zeitleiste-start {
    bottom: 4px;
    left: 0;
    position: absolute;
}

.praxiseinsatz-heute-marker {
    display: none;
}

.praxiseinsatz-heute-marker::after {
    content: none;
}

.praxiseinsatz-zeitleiste-ende {
    bottom: 4px;
    position: absolute;
    right: 0;
    text-align: right;
}

.praxiseinsatz-zeile {
    display: grid;
    gap: 14px;
    grid-template-columns: var(--praxiseinsatz-label-breite) minmax(0, 1fr);
    min-height: calc(max(var(--praxiseinsatz-achse-hoehe, 110px), var(--praxiseinsatz-zeile-minhoehe)) + 88px);
    padding: 0 0 14px;
}

.praxiseinsatz-zeile + .praxiseinsatz-zeile {
    border-top: 1px solid #dce6f2;
    padding-top: 14px;
}

.praxiseinsatz-schueler {
    align-self: start;
    background: var(--karte-inhalt-hintergrund);
    border: 1px solid #cbdff4;
    border-radius: 6px;
    display: grid;
    gap: 0;
    margin-top: 74px;
    overflow: hidden;
}

.praxiseinsatz-schueler a {
    background: var(--farbe-orange-flaeche-zart);
    color: #152243;
    display: block;
    font-weight: 560;
    padding: 10px 12px 2px;
    text-decoration: none;
}

.praxiseinsatz-schueler a:hover {
    text-decoration: underline;
}

.praxiseinsatz-schueler span,
.praxiseinsatz-schueler small {
    color: #526487;
    display: block;
    font-size: 0.78rem;
    line-height: 1.22;
}

.praxiseinsatz-schueler > span {
    background: var(--farbe-orange-flaeche-zart);
    border-bottom: 1px solid var(--farbe-orange-rand-hell);
    padding: 0 12px 10px;
}

.praxiseinsatz-schueler > span.praxiseinsatz-schueler-meta {
    background: var(--farbe-orange-flaeche-zart);
    border-bottom: 0;
    padding-bottom: 2px;
}

.praxiseinsatz-schueler small.praxiseinsatz-zustaendige-lehrkraft {
    background: var(--farbe-orange-flaeche-zart);
    border-top: 0;
    border-bottom: 1px solid var(--farbe-orange-rand-hell);
    padding: 0 12px 10px;
}

.praxiseinsatz-schueler small.praxiseinsatz-kontakte-ueberschrift {
    border-bottom: 1px solid #dce6f2;
    color: #33466f;
    font-weight: 560;
    padding-bottom: 5px;
}
.praxiseinsatz-schueler small {
    background: var(--karte-flaeche-abgesetzt);
    border-top: 1px solid #e4ebf4;
    padding: 6px 12px;
}

.praxiseinsatz-achse {
    background:
        linear-gradient(to right, rgba(196, 211, 229, 0.8) 1px, transparent 1px) 0 0 / 14.285% 100%,
        #f8fafc;
    border: 1px solid #cbdff4;
    border-radius: 6px;
    min-height: max(var(--praxiseinsatz-achse-hoehe, 110px), var(--praxiseinsatz-zeile-minhoehe));
    overflow: visible;
    position: relative;
}

.praxiseinsatz-achse::before {
    content: none;
}

.praxiseinsatz-zeile-datumsleiste .praxiseinsatz-heute-linienlabel {
    background: #fff8f1;
    border: 1px solid #efb47d;
    border-radius: 4px;
    color: var(--praxiseinsatz-heute-farbe);
    font-size: var(--schrift-klein);
    font-weight: 600;
    left: var(--heute-links);
    padding: 4px 8px;
    pointer-events: none;
    position: absolute;
    bottom: 8px;
    line-height: 1.15;
    transform: translateX(-50%);
    white-space: nowrap;
    z-index: 5;
}

.praxiseinsatz-zeile-datumsleiste .praxiseinsatz-heute-linienlabel::after {
    background: var(--praxiseinsatz-heute-farbe);
    content: "";
    height: calc(max(var(--praxiseinsatz-achse-hoehe, 110px), var(--praxiseinsatz-zeile-minhoehe)) + 8px);
    left: 50%;
    position: absolute;
    top: 100%;
    transform: translateX(-1px);
    width: 2px;
}

.praxiseinsatz-achse > .praxiseinsatz-heute-linienlabel {
    display: none;
}

.praxiseinsatz-keine-planung {
    color: #526487;
    left: 16px;
    position: absolute;
    top: 16px;
}

.praxiseinsatz-block {
    background: #eaf2fb;
    box-sizing: border-box;
    border: 1px solid #b7cde7;
    border-left: 4px solid #6a87ad;
    border-radius: 6px;
    box-shadow: 0 4px 12px rgba(21, 34, 67, 0.08);
    display: grid;
    gap: 6px;
    left: var(--block-links);
    min-width: 0;
    overflow: visible;
    padding: 8px 10px;
    position: absolute;
    text-decoration: none;
    top: calc(10px + (var(--block-spur, 0) * 108px));
    width: var(--block-breite);
    z-index: 2;
}

.praxiseinsatz-block:hover,
.praxiseinsatz-block:focus-visible {
    border-color: #8fb4dc;
    box-shadow: 0 6px 16px rgba(21, 34, 67, 0.14);
    outline: none;
    z-index: 20;
}

.praxiseinsatz-block.ist-aktuell {
    background: #fff3e8;
    border-color: #efb47d;
    border-left-color: #ef7000;
}

.praxiseinsatz-block-kopf {
    display: grid;
    gap: 1px;
}

.praxiseinsatz-block-kopf strong {
    font-size: 0.82rem;
    font-weight: 560;
    min-width: 0;
}

.praxiseinsatz-block-kopf strong > span:first-child {
    min-width: 0;
}

.praxiseinsatz-block-kopf span {
    color: #354563;
    font-size: 0.78rem;
}

.praxiseinsatz-block span {
    font-size: 0.78rem;
    line-height: 1.22;
    min-width: 0;
}

.praxiseinsatz-block-kopf span,
.praxiseinsatz-block-unternehmen-text span,
.praxiseinsatz-block-zusatzlabel {
    overflow: hidden;
    text-overflow: ellipsis;
}

.praxiseinsatz-block-info {
    align-self: start;
    position: relative;
    z-index: 45;
}

.praxiseinsatz-block-info-symbol {
    align-items: center;
    background: #fff;
    border: 1px solid #9fb9d8;
    border-radius: 999px;
    color: #33466f;
    display: inline-flex;
    font-size: 0.72rem;
    font-weight: 700;
    height: 18px;
    justify-content: center;
    line-height: 1;
    width: 18px;
}

.praxiseinsatz-block-tooltip {
    display: none;
}

.praxiseinsatz-tooltip-portal {
    background: #fff;
    border: 1px solid #b7cde7;
    border-radius: 6px;
    box-shadow: 0 8px 22px rgba(21, 34, 67, 0.18);
    color: #1f2a44;
    font-weight: 400;
    min-width: 430px;
    padding: 10px 12px;
    pointer-events: none;
    position: fixed;
    white-space: nowrap;
    z-index: 10000;
}

.praxiseinsatz-block-unternehmen {
    align-items: start;
    display: grid;
    gap: 8px;
    grid-template-columns: 18px minmax(0, 1fr);
}

.praxiseinsatz-block-unternehmen-text {
    display: grid;
    gap: 2px;
    margin-left: 8px;
    min-width: 0;
}

.praxiseinsatz-block-unternehmen > .praxiseinsatz-block-unternehmen-text:first-child {
    grid-column: 1 / -1;
}

.praxiseinsatz-tooltip-portal .praxiseinsatz-block-tooltip-titel {
    border-bottom: 1px solid #dce6f2;
    color: #33466f;
    display: block;
    font-weight: 600;
    padding-bottom: 6px;
}

.praxiseinsatz-tooltip-portal .praxiseinsatz-block-tooltip-kontakt {
    display: block;
    line-height: 1.35;
    margin-top: 9px;
}

.praxiseinsatz-block-gruppe {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.praxiseinsatz-block-details {
    display: grid;
    gap: 7px;
    grid-template-columns: minmax(0, 1fr);
}

.praxiseinsatz-block-gruppe em {
    color: #526487;
    font-size: var(--schrift-klein);
    font-style: normal;
    line-height: 1.2;
    margin-bottom: 2px;
}

.praxiseinsatz-block-zeile {
    display: grid;
    gap: 8px;
    grid-template-columns: 52px minmax(0, 1fr);
}

.praxiseinsatz-block-zeile b {
    color: #526487;
    font-weight: 500;
    white-space: nowrap;
}

.praxiseinsatz-block-zusatzinfo {
    gap: 4px;
}

.praxiseinsatz-block-zusatzzeile {
    align-items: center;
    display: grid;
    gap: 8px;
    grid-template-columns: 18px minmax(0, 1fr);
}

.praxiseinsatz-block-zusatzlabel {
    color: #526487;
    font-size: 0.78rem;
    line-height: 1.22;
    min-width: 0;
}

.kalender-nav-button {
    background: rgba(238, 114, 3, 0.10);
    border-color: rgba(238, 114, 3, 0.35);
    color: var(--farbe-orange);
}

.kalender-nav-button:hover,
.kalender-nav-button:focus {
    background: rgba(238, 114, 3, 0.16);
    border-color: rgba(238, 114, 3, 0.50);
}

.kalender-nav-button {
    display: inline-flex;
    width: var(--button-hoehe);
    height: var(--button-hoehe);
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(238, 114, 3, 0.35);
    border-radius: 8px;
    background: rgba(238, 114, 3, 0.10);
    transition: background 0.15s ease, border-color 0.15s ease, transform 0.15s ease;
}

.kalender-nav-button img {
    width: var(--button-symbol-icon-groesse);
    height: var(--button-symbol-icon-groesse);
}

.kalender-nav-button-text {
    width: auto;
    min-width: 74px;
    padding: 0 var(--button-padding-x);
    gap: 4px;
    color: var(--farbe-orange);
    font-size: var(--button-font-size);
    font-weight: var(--button-font-weight);
    text-decoration: none;
}

.kalender-nav-button:hover,
.kalender-nav-button:focus {
    border-color: rgba(238, 114, 3, 0.45);
    background: rgba(238, 114, 3, 0.12);
    transform: translateY(-1px);
}

.kalender-nav-button-inaktiv {
    opacity: 0.32;
    pointer-events: none;
}

.anwesenheitskalender-legende {
    display: flex;
    flex-wrap: wrap;
    gap: 14px 22px;
    padding: 12px 20px 0;
    color: var(--farbe-text-gedaempft);
    font-size: 13px;
}

.anwesenheitskalender-legende span {
    display: inline-flex;
    align-items: center;
    gap: 7px;
}

.anwesenheitskalender-legende i {
    display: inline-block;
    width: 14px;
    height: 14px;
    border-radius: 4px;
}

.legende-anwesenheit {
    background: var(--farbe-orange);
}

.legende-wochenende {
    border: 1px solid rgba(31, 42, 68, 0.12);
    background: rgba(31, 42, 68, 0.08);
}

.legende-feiertag {
    border: 1px solid rgba(38, 93, 160, 0.14);
    background: rgba(38, 93, 160, 0.28);
}

.legende-ferientag {
    border: 1px solid rgba(126, 86, 176, 0.14);
    background: rgba(126, 86, 176, 0.26);
}

.legende-beweglicher-ferientag {
    border: 1px solid rgba(134, 154, 52, 0.16);
    background: rgba(134, 154, 52, 0.30);
}

.legende-schliesstag {
    border: 1px solid rgba(180, 64, 44, 0.14);
    background: rgba(180, 64, 44, 0.28);
}

.anwesenheitskalender-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    padding: 18px 20px 22px;
}

.anwesenheit-kalender-dialog {
    position: fixed;
    inset: 0;
    z-index: 1100;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 26px;
    background: rgba(17, 24, 39, 0.42);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.16s ease;
}

.anwesenheit-kalender-dialog.ist-offen {
    opacity: 1;
    pointer-events: auto;
}

.anwesenheit-kalender-dialog[hidden] {
    display: none;
}

.anwesenheit-kalender-dialog.anwesenheit-kalender-eingebettet {
    position: static;
    inset: auto;
    z-index: auto;
    display: block;
    padding: 0;
    background: transparent;
    opacity: 1;
    pointer-events: auto;
}

.anwesenheit-kalender-eingebettet .anwesenheitskalender {
    box-sizing: border-box;
    margin: 0;
    max-width: 100%;
}

.anwesenheit-kalender-eingebettet .anwesenheit-kalender-dialog-inhalt {
    box-sizing: border-box;
    width: auto;
    max-width: 100%;
    max-height: none;
    overflow: hidden;
    border: 1px solid var(--karte-rand);
    box-shadow: none;
}

.anwesenheit-kalender-dialog-inhalt {
    width: min(1180px, 100%);
    max-height: calc(100vh - 52px);
    overflow: auto;
    border-radius: 8px;
    background: var(--karte-inhalt-hintergrund);
    box-shadow: 0 28px 70px rgba(17, 24, 39, 0.26);
}

.anwesenheit-kalender-dialog-kopf {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    padding: 20px 22px 14px;
    border-bottom: 1px solid var(--karte-trennlinie);
}

.anwesenheit-kalender-dialog-kopf h3 {
    margin: 0;
    color: var(--farbe-dunkelblau);
    font-size: 22px;
    font-weight: 700;
}

.anwesenheit-kalender-dialog-kopf p {
    margin: 6px 0 0;
    color: var(--farbe-text-gedaempft);
    font-size: 13px;
}

.anwesenheit-kalender-navigation {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--farbe-dunkelblau);
    font-size: 14px;
}

.anwesenheit-kalender-navigation strong {
    align-items: center;
    background: var(--karte-flaeche-abgesetzt);
    border: 1px solid var(--karte-rand);
    border-radius: 8px;
    display: inline-flex;
    justify-content: center;
    min-height: 38px;
    min-width: 220px;
    padding: 0 14px;
    text-align: center;
}

.anwesenheit-kalender-auswahl-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    padding: 18px 22px 20px;
}

.anwesenheit-kalender-tag {
    border: 0;
    cursor: pointer;
}

.anwesenheit-kalender-tag:not(.kalender-tag-anwesenheit):hover,
.anwesenheit-kalender-tag:not(.kalender-tag-anwesenheit):focus {
    outline: none;
    background: rgba(238, 114, 3, 0.14);
}

.anwesenheit-kalender-tag.kalender-tag-anwesenheit:hover,
.anwesenheit-kalender-tag.kalender-tag-anwesenheit:focus {
    outline: 2px solid rgba(238, 114, 3, 0.30);
    outline-offset: 2px;
}

.anwesenheit-kalender-dialog-aktionen {
    justify-content: flex-end;
    align-items: center;
    padding: 0 22px 22px;
}

.anwesenheit-kalender-dialog-aktionen span {
    margin-right: auto;
    color: var(--farbe-text-gedaempft);
    font-size: 13px;
    font-weight: 700;
}

.kalender-monat {
    min-width: 0;
    border: 1px solid var(--karte-rand);
    border-radius: 8px;
    overflow: hidden;
    background: var(--karte-hintergrund);
}

.kalender-monat h4 {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 2px;
    margin: 0;
    padding: 10px 12px;
    background: var(--karte-flaeche-abgesetzt);
    border-bottom: 1px solid var(--karte-rand);
    color: var(--farbe-dunkelblau);
    font-size: 14px;
    font-weight: 700;
}

.kalender-monat h4 small {
    color: var(--farbe-text-gedaempft-2);
    font-size: 12px;
    font-weight: 600;
}

.kalender-monat-wochentage,
.kalender-monat-tage {
    display: grid;
    grid-template-columns: 48px repeat(7, minmax(0, 1fr));
    gap: 4px;
    padding: 8px 10px 0;
}

.kalender-monat-wochentage {
    padding: 8px 10px 8px;
}

.kalender-monat-tage {
    padding: 0 10px 10px;
}

.kalender-monat-wochentage span {
    color: var(--farbe-text-gedaempft-2);
    font-size: 11px;
    font-weight: 700;
    padding: 6px 0;
    text-align: center;
}

.kalender-monat-wochentage span:first-child {
    background: transparent;
}

.kalender-monat-wochentage span:not(:first-child) {
    background: var(--karte-hintergrund);
}

.kalender-woche {
    align-items: center;
    color: var(--farbe-text-hell);
    display: flex;
    font-size: 0.58rem;
    font-weight: 400;
    justify-content: center;
    min-height: 32px;
    padding-right: 4px;
    white-space: nowrap;
}

.kalender-tag {
    display: inline-flex;
    min-width: 0;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--karte-rand);
    border-radius: 6px;
    background: var(--karte-inhalt-hintergrund);
    color: var(--farbe-dunkelblau);
    font-size: 12px;
    min-height: 38px;
    line-height: 1;
}

.kalender-tag:not(.kalender-tag-leer):hover,
.kalender-tag:not(.kalender-tag-leer):focus {
    background: var(--farbe-orange);
    border-color: var(--farbe-orange);
    color: var(--karte-inhalt-hintergrund);
    outline: none;
}

.kalender-tag-leer {
    background: transparent;
    border-color: transparent;
}

.kalender-tag-wochenende {
    border-color: var(--karte-rand);
    background: rgba(31, 42, 68, 0.08);
    color: var(--farbe-text-gedaempft);
}

.kalender-tag-heute {
    border-color: var(--farbe-orange);
}

.kalender-tag-feiertag {
    background: rgba(38, 93, 160, 0.28);
}

.kalender-tag-ferientag {
    background: rgba(126, 86, 176, 0.26);
}

.kalender-tag-beweglicher-ferientag {
    background: rgba(134, 154, 52, 0.30);
}

.kalender-tag-schliesstag {
    background: rgba(180, 64, 44, 0.28);
}

.kalender-tag-anwesenheit {
    border-color: var(--farbe-orange);
    background: var(--farbe-orange);
    color: var(--karte-inhalt-hintergrund);
    font-weight: 700;
    box-shadow: 0 5px 12px rgba(238, 114, 3, 0.22);
}

.kalender-tag-feiertag.kalender-tag-anwesenheit {
    box-shadow: inset 0 -4px 0 rgba(38, 93, 160, 0.68), 0 5px 12px rgba(238, 114, 3, 0.22);
}

.kalender-tag-ferientag.kalender-tag-anwesenheit {
    box-shadow: inset 0 -4px 0 rgba(126, 86, 176, 0.64), 0 5px 12px rgba(238, 114, 3, 0.22);
}

.kalender-tag-beweglicher-ferientag.kalender-tag-anwesenheit {
    box-shadow: inset 0 -4px 0 rgba(134, 154, 52, 0.68), 0 5px 12px rgba(238, 114, 3, 0.22);
}

.kalender-tag-schliesstag.kalender-tag-anwesenheit {
    box-shadow: inset 0 -4px 0 rgba(180, 64, 44, 0.66), 0 5px 12px rgba(238, 114, 3, 0.22);
}

.kalender-tag-wochenende.kalender-tag-anwesenheit {
    background: var(--farbe-orange);
    color: var(--karte-inhalt-hintergrund);
}

@media (max-width: 1280px) {
    .anwesenheitskalender-grid,
    .anwesenheit-kalender-auswahl-grid {
        grid-template-columns: repeat(3, minmax(210px, 1fr));
    }
}
.berichtsheft-zustaendigkeit-karte .formular-hinweis {
    margin: 12px;
}

.berichtsheft-zustaendigkeit-suchfeld {
    margin: 6px 12px;
    min-width: 0;
    position: relative;
}

.berichtsheft-zustaendigkeit-suchfeld > input[type="search"] {
    width: 100%;
}

.berichtsheft-zustaendigkeit-treffer {
    background: #ffffff;
    border: 1px solid #c8d4e4;
    box-shadow: 0 12px 24px rgba(28, 48, 74, 0.14);
    display: grid;
    left: 0;
    max-height: 260px;
    overflow: auto;
    position: absolute;
    right: 0;
    top: calc(100% + 4px);
    z-index: 30;
}

.berichtsheft-zustaendigkeit-treffer[hidden] {
    display: none;
}

.berichtsheft-zustaendigkeit-treffer > button {
    background: #ffffff;
    border: 0;
    border-bottom: 1px solid #e4ebf4;
    color: var(--farbe-dunkelblau);
    cursor: pointer;
    display: flex;
    gap: 8px;
    justify-content: space-between;
    padding: 8px 10px;
    text-align: left;
}

.berichtsheft-zustaendigkeit-treffer > button:hover,
.berichtsheft-zustaendigkeit-treffer > button:focus-visible {
    background: #eef4fb;
}

.berichtsheft-zustaendigkeit-treffer span {
    color: var(--farbe-text-gedaempft);
}

@media (max-width: 1100px) {
    .formular-karten-zweispaltig {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 980px) {
    .anwesenheitskalender-grid,
    .anwesenheit-kalender-auswahl-grid {
        grid-template-columns: repeat(2, minmax(210px, 1fr));
    }

    .anwesenheit-kalender-dialog-kopf {
        align-items: flex-start;
        flex-direction: column;
    }
}

@media (max-width: 680px) {
    .formular-detailraster > label,
    .formular-detailraster > .formular-detailzeile {
        grid-template-columns: 1fr;
    }

    .anwesenheitskalender {
        margin: 16px 14px 20px;
    }

    .anwesenheitskalender-kopf {
        align-items: flex-start;
        flex-direction: column;
    }

    .anwesenheitskalender-grid,
    .anwesenheit-kalender-auswahl-grid {
        grid-template-columns: 1fr;
        padding-right: 14px;
        padding-left: 14px;
    }
}

/* Globale Typografie-Standards: Seitencss setzt keine eigenen Schriftwerte. */
.admin-seite {
    font-size: var(--schrift-feld);
    font-weight: var(--schrift-feldgewicht);
}

.admin-seite :where(input:not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="hidden"]):not([type="file"]):not([type="range"]), select, textarea),
.formular-feld :where(input:not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="hidden"]):not([type="file"]):not([type="range"]), select, textarea),
.schuelerakte-detail-wert,
.lehrkraefteakte-detail-wert,
.datentabelle td,
.listenkarte,
.kontaktkarte,
.unternehmen-karte,
.zuordnung-karte {
    font-family: inherit;
    font-size: var(--schrift-feld);
    font-weight: var(--schrift-feldgewicht);
}

.formular-feld,
.formular-feld > span,
.formular-feld-checkboxgruppe legend,
.formular-feld-standorte legend,
.schuelerakte-detail-label,
.schuelerakte-formraster label > span,
.schuelerakte-formraster-einspaltig label > span,
.schuelerakte-formraster-detailoptik label > span,
.lehrkraefteakte-detail-label,
.lehrkraefteakte-formraster label > span,
.lehrkraefteakte-formraster-detailoptik label > span,
.datentabelle th {
    font-size: var(--schrift-label);
    font-weight: var(--schrift-labelgewicht);
}

/* Verbindlicher Innenrahmen fuer vergleichbare weisse Hauptarbeitsbereiche. */
.standard-innenbereich {
    box-sizing: border-box;
    padding: var(--layout-aussen-innenabstand);
}

.akten-profilkopf {
    align-items: center;
    background: var(--karte-inhalt-hintergrund);
    border: 1px solid var(--karte-rand);
    border-radius: 8px;
    display: flex;
    gap: 20px;
    margin-bottom: 18px;
    min-height: 156px;
    padding: 18px 20px;
}

[data-akten-register-bereich] > .akten-profilkopf[data-akten-register-kopf] {
    margin: var(--layout-innenabstand) var(--layout-innenabstand) 0;
}

.akten-profilkopf img {
    border-radius: 50%;
    flex: 0 0 124px;
    height: 124px;
    object-fit: cover;
    width: 124px;
}

.akten-profilkopf > div {
    display: grid;
    gap: 5px;
    min-width: 0;
}

.akten-profilkopf h3 {
    color: var(--farbe-dunkelblau);
    font-size: 22px;
    margin: 0;
}

.akten-profilkopf p {
    color: var(--farbe-text-gedaempft);
    margin: 0;
    overflow-wrap: anywhere;
}

.akten-profiltyp {
    color: var(--farbe-orange);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
}

/* Verbindlicher Standard fuer den Bereich direkt unter dem Aktenkopf. */
.akten-registerinhalt {
    box-sizing: border-box;
    --akten-registerkarten-abstand: var(--layout-kartenabstand);
    display: block;
    min-width: 0;
    padding: var(--layout-innenabstand);
    width: 100%;
}

.akten-registerinhalt[hidden] {
    display: none;
}

.akten-registerinhalt > .unternehmen-formular {
    padding: 0;
}

.akten-inhaltskarte {
    background: var(--karte-inhalt-hintergrund);
    border: 1px solid var(--karte-rand);
    border-radius: 6px;
    min-width: 0;
    overflow: hidden;
}

.akten-registerinhalt > .akten-inhaltskarte + .akten-inhaltskarte {
    margin-top: var(--akten-registerkarten-abstand);
}

.akten-protokollkarte > .tabellenrahmen {
    border: 0;
    border-radius: 0;
}

.akten-protokollkarte > .schuelerakte-leerhinweis {
    margin: var(--layout-innenabstand);
}

.akten-inhaltskarte > header {
    align-items: center;
    background: var(--karte-kopf-hintergrund);
    border-bottom: 1px solid var(--karte-trennlinie);
    display: flex;
    min-height: 46px;
    padding: 8px 12px;
}

.akten-inhaltskarte > header h3 {
    color: var(--farbe-dunkelblau);
    font-size: var(--schrift-kartenkopf);
    font-weight: var(--schrift-kartenkopfgewicht);
    margin: 0;
}

@media (max-width: 760px) {
    .akten-profilkopf {
        align-items: flex-start;
        flex-direction: column;
    }
}

.schuelerakte-register,
.klassenakte-register,
.lehrkraefte-registerkarten,
.unternehmen-register,
.klassen-register {
    align-items: flex-end;
    border-bottom: 1px solid #c5d0df;
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin: 0;
    padding: var(--layout-register-oben) var(--layout-innenabstand) 0;
}

.registerkarten.karten-unterregister {
    align-items: flex-end;
    border-bottom: 1px solid var(--karte-rand);
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin: 0 0 var(--layout-innenabstand);
    padding: var(--layout-register-oben) 0 0;
}

.registerkarten-zusatz {
    align-self: center;
    flex: 0 0 auto;
    margin-left: auto;
}

.unternehmenakte-inhalt {
    display: grid;
    gap: 24px;
    padding: 18px;
}

.registerkarte,
.registerkarten .registerkarte,
.schuelerakte-register .registerkarte,
.benutzerakte-register .registerkarte,
.klassenakte-register .registerkarte,
.unternehmen-register .registerkarte,
.klassen-register .registerkarte,
.datenbank-tools-registerkarten .registerkarte {
    align-items: center;
    --registerkarte-hintergrund: #eaf0f7;
    --registerkarte-hover-hintergrund: #f4f7fb;
    background: var(--registerkarte-hintergrund);
    border: 1px solid #c5d0df;
    border-bottom: 0;
    border-radius: var(--registerkarte-radius);
    color: var(--farbe-dunkelblau);
    cursor: pointer;
    display: inline-flex;
    gap: var(--registerkarte-gap);
    font-size: var(--registerkarte-font-size);
    font-weight: var(--registerkarte-font-weight);
    min-height: var(--registerkarte-hoehe);
    padding: 0 var(--registerkarte-padding-x);
    text-decoration: none;
}

.registerkarte:hover {
    background: var(--registerkarte-hover-hintergrund);
}

.registerkarte.ist-aktiv {
    background: var(--registerkarte-hintergrund);
    border-color: rgba(238, 114, 3, 0.55);
    box-shadow: 0 -3px 10px rgba(31, 42, 68, 0.12);
    color: var(--farbe-dunkelblau);
    position: relative;
    top: 1px;
    z-index: 1;
}

.registerkarte.ist-aktiv::before {
    background: var(--farbe-orange);
    border-radius: 5px 5px 0 0;
    content: "";
    height: 3px;
    left: 1px;
    position: absolute;
    right: 1px;
    top: -1px;
}

.datenbereich-kopf h2,
.datenbereich-unterkopf h3,
.anwesenheitskalender-kopf h3,
.dashboard-bereich-kopf h2,
.hinweiskarte h2,
.platzhalter-box h2,
.warnbereich h2,
.anwesenheit-kalender-dialog-kopf h3 {
    font-size: var(--schrift-kartenkopf);
    font-weight: var(--schrift-kartenkopfgewicht);
}

.formular-unterabschnitt h3,
.unternehmen-form-spalte > h3,
.unternehmen-form-spaltenkopf h3,
.schuelerakte-detailblock h3,
.lehrkraefteakte-detailblock h3,
.klassenakte-detailblock h3,
.rechtebereich h3,
.rechte-gruppe h3,
.kontaktstunden-kartenkopf h3,
.kontaktstunden-kalendermonat h3,
.lehrkraefte-rechte-gruppe h3,
.raumplanung-panel-kopf h3,
.raumplanung-raum h3,
.planungsteil h3,
.planung-kalender-kopf h3,
.planung-kalender-monat h4,
.mailvorlagen-karte h3,
.mailvorlagen-htmlspalte h4,
.dashboard-systemkarte h3,
.firmenzuordnung-karte h3,
.firmenzuordnung-karte h4,
.adresspruefung-karte h3,
.adresspruefung-karte h4,
.adresspruefung-geo-daten-bereich h3,
.raumassistent-regelkopf h3,
.datenbereich-kopf-innen h3,
.curriculum-formularbereich-kopf h3,
.curriculum-themeninhalt-kopf h3,
.sondermeldung-box h3,
.kalender-monat h4,
.schuelerakte-einsatz-kalenderkopf h3,
.schuelerakte-einsatz-kalenderkopf h4,
.schuelerakte-einsatz-monat h4,
.unterrichtsobjekt-karte strong,
.schuelerakte-poolkarte strong,
.lehrkraefte-recht-zeile strong,
.rechte-zeile strong,
.kontaktkarte strong,
.unternehmen-karte strong,
.zuordnung-karte strong,
.kontakt-live-suche-treffer strong,
.unternehmen-kontakte-eintrag strong,
.firmenzuordnung-kontaktkarte strong,
.firmenzuordnung-datenkarte strong,
.firmenzuordnung-poolkarte-titel,
.adresspruefung-aenderungen strong,
.adresspruefung-geo-daten-adresse strong {
    font-size: var(--schrift-karteninnenkopf);
    font-weight: var(--schrift-karteninnenkopfgewicht);
}

.dashboard-kennzahl strong {
    font-size: var(--schrift-dashboard-kennzahl);
    font-weight: var(--schrift-dashboard-kennzahlgewicht);
}

.hinweistext,
.formular-hinweis,
.formular-fehler,
.formular-erfolg,
.leerzustand,
.karten-hinweis,
.status-hinweis {
    font-size: var(--schrift-hinweis);
    font-weight: var(--schrift-hinweisgewicht);
}

.primaer-button,
.sekundaer-button,
.gefahr-button,
.erfolg-button,
.pdf-download-button,
button.primaer-button,
button.sekundaer-button,
button.gefahr-button,
button.erfolg-button,
a.primaer-button,
a.sekundaer-button,
a.gefahr-button,
a.erfolg-button,
a.pdf-download-button {
    align-items: center;
    border-radius: var(--button-radius);
    box-sizing: border-box;
    cursor: pointer;
    display: inline-flex;
    gap: 7px;
    justify-content: center;
    min-height: var(--button-hoehe);
    padding: 0 var(--button-padding-x);
    font-family: inherit;
    font-size: var(--button-font-size);
    font-weight: var(--button-font-weight);
    line-height: 1.2;
    text-decoration: none;
    width: auto;
}

.primaer-button img,
.sekundaer-button img,
.gefahr-button img,
.erfolg-button img,
.primaer-button svg,
.sekundaer-button svg,
.gefahr-button svg,
.erfolg-button svg {
    display: block;
    flex: 0 0 var(--button-symbol-icon-groesse);
    height: var(--button-symbol-icon-groesse);
    width: var(--button-symbol-icon-groesse);
}

.primaer-button,
button.primaer-button,
a.primaer-button {
    border: 1px solid var(--farbe-button-primaer);
    background: var(--farbe-button-primaer);
    color: var(--farbe-weiss);
}

.sekundaer-button,
button.sekundaer-button,
a.sekundaer-button {
    border: 1px solid var(--farbe-button-sekundaer-rand);
    background: var(--farbe-button-sekundaer);
    color: var(--farbe-button-sekundaer-text);
}


.notenbuch-vornotenvorschlag > header {
    align-items: center;
    margin-bottom: 14px;
    display: flex;
    gap: 16px;
    justify-content: space-between;
}

.notenbuch-vornotenvorschlag > header h4 {
    margin: 0;
}

.notenbuch-vornotenvorschlag > header .pdf-download-button {
    flex: 0 0 auto;
}

.vornoten-download-status {
    align-items: center;
    display: flex;
    gap: 12px;
}

.vornoten-download-hinweis {
    color: var(--farbe-text-muted);
    display: flex;
    flex-direction: column;
    font-size: 0.82rem;
    line-height: 1.28;
    min-width: 190px;
}

.vornoten-download-hinweis span {
    display: block;
}

.pdf-download-button::before {
    background: currentColor;
    content: "";
    display: block;
    flex: 0 0 var(--button-symbol-icon-groesse);
    height: var(--button-symbol-icon-groesse);
    width: var(--button-symbol-icon-groesse);
    -webkit-mask: url("../symbole/herunterladen.svg") center / contain no-repeat;
    mask: url("../symbole/herunterladen.svg") center / contain no-repeat;
}

.gefahr-button,
button.gefahr-button,
a.gefahr-button {
    border: 1px solid var(--farbe-button-gefahr);
    background: var(--farbe-button-gefahr);
    color: var(--farbe-weiss);
}

.erfolg-button,
button.erfolg-button,
a.erfolg-button {
    border: 1px solid var(--farbe-button-erfolg);
    background: var(--farbe-button-erfolg);
    color: var(--farbe-weiss);
}

.primaer-button:not(:disabled):not([aria-disabled="true"]):hover,
.primaer-button:not(:disabled):not([aria-disabled="true"]):focus,
button.primaer-button:not(:disabled):not([aria-disabled="true"]):hover,
button.primaer-button:not(:disabled):not([aria-disabled="true"]):focus,
a.primaer-button:not([aria-disabled="true"]):hover,
a.primaer-button:not([aria-disabled="true"]):focus {
    background: var(--farbe-button-primaer-hover);
    outline: 3px solid var(--farbe-button-primaer-fokus);
}

.sekundaer-button:not(:disabled):not([aria-disabled="true"]):hover,
.sekundaer-button:not(:disabled):not([aria-disabled="true"]):focus,
button.sekundaer-button:not(:disabled):not([aria-disabled="true"]):hover,
button.sekundaer-button:not(:disabled):not([aria-disabled="true"]):focus,
a.sekundaer-button:not([aria-disabled="true"]):hover,
a.sekundaer-button:not([aria-disabled="true"]):focus {
    border-color: rgba(238, 114, 3, 0.45);
    background: var(--farbe-button-sekundaer-hover);
    outline: 0;
}

.gefahr-button:not(:disabled):not([aria-disabled="true"]):hover,
.gefahr-button:not(:disabled):not([aria-disabled="true"]):focus,
.gefahr-button:not(:disabled):not([aria-disabled="true"]):focus-visible,
button.gefahr-button:not(:disabled):not([aria-disabled="true"]):hover,
button.gefahr-button:not(:disabled):not([aria-disabled="true"]):focus,
button.gefahr-button:not(:disabled):not([aria-disabled="true"]):focus-visible,
a.gefahr-button:not([aria-disabled="true"]):hover,
a.gefahr-button:not([aria-disabled="true"]):focus,
a.gefahr-button:not([aria-disabled="true"]):focus-visible {
    background: var(--farbe-button-gefahr-hover);
    box-shadow: 0 0 0 3px var(--farbe-button-gefahr-fokus);
    outline: 0;
}

.erfolg-button:not(:disabled):not([aria-disabled="true"]):hover,
.erfolg-button:not(:disabled):not([aria-disabled="true"]):focus,
.erfolg-button:not(:disabled):not([aria-disabled="true"]):focus-visible,
button.erfolg-button:not(:disabled):not([aria-disabled="true"]):hover,
button.erfolg-button:not(:disabled):not([aria-disabled="true"]):focus,
button.erfolg-button:not(:disabled):not([aria-disabled="true"]):focus-visible,
a.erfolg-button:not([aria-disabled="true"]):hover,
a.erfolg-button:not([aria-disabled="true"]):focus,
a.erfolg-button:not([aria-disabled="true"]):focus-visible {
    background: var(--farbe-button-erfolg-hover);
    box-shadow: 0 0 0 3px var(--farbe-button-erfolg-fokus);
    outline: 0;
}
.icon-aktion,
.sortiergriff,
.kontaktstunden-aktionsbutton,
.kontaktstunden-symbolbutton,
.kontaktstunden-plus,
.kalender-nav-button {
    align-items: center;
    background: var(--button-symbol-hintergrund);
    border: 1px solid var(--button-symbol-rand);
    border-radius: var(--button-radius);
    box-sizing: border-box;
    color: var(--farbe-button-sekundaer-text);
    cursor: pointer;
    display: inline-flex;
    flex: 0 0 var(--button-symbol-hoehe);
    height: var(--button-symbol-hoehe);
    justify-content: center;
    min-height: var(--button-symbol-hoehe);
    min-width: var(--button-symbol-hoehe);
    padding: 0;
    text-decoration: none;
    width: var(--button-symbol-hoehe);
    box-shadow: 0 1px 0 rgba(31, 42, 68, 0.04);
}

.icon-aktion:hover,
.icon-aktion:focus,
.sortiergriff:hover,
.sortiergriff:focus,
.kontaktstunden-aktionsbutton:hover,
.kontaktstunden-aktionsbutton:focus,
.kontaktstunden-symbolbutton:hover,
.kontaktstunden-symbolbutton:focus,
.kontaktstunden-plus:hover,
.kontaktstunden-plus:focus,
.kalender-nav-button:hover,
.kalender-nav-button:focus {
    border-color: rgba(238, 114, 3, 0.45);
    background: var(--button-symbol-hover);
    outline: 0;
}

.icon-aktion img,
.kontaktstunden-aktionsbutton svg,
.kontaktstunden-symbolbutton svg,
.kontaktstunden-plus svg,
.kalender-nav-button img,
.kalender-nav-button svg {
    height: var(--button-symbol-icon-groesse);
    width: var(--button-symbol-icon-groesse);
}

.kontaktstunden-aktionsbutton svg,
.kontaktstunden-symbolbutton svg,
.kontaktstunden-plus svg {
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 2.4;
}

.kontaktstunden-aktionsbutton-bestaetigen {
    border-color: var(--farbe-button-erfolg);
    background: var(--farbe-button-erfolg);
    color: var(--farbe-weiss);
}

.kontaktstunden-aktionsbutton-bestaetigen:hover,
.kontaktstunden-aktionsbutton-bestaetigen:focus-visible {
    background: var(--farbe-button-erfolg-hover);
}

.kontaktstunden-aktionsbutton-ablehnen {
    border-color: var(--farbe-button-gefahr);
    background: var(--farbe-button-gefahr);
    color: var(--farbe-weiss);
}

.kontaktstunden-aktionsbutton-ablehnen:hover,
.kontaktstunden-aktionsbutton-ablehnen:focus-visible {
    background: var(--farbe-button-gefahr-hover);
}

.primaer-button:disabled,
.primaer-button[aria-disabled="true"],
.sekundaer-button:disabled,
.sekundaer-button[aria-disabled="true"],
.gefahr-button:disabled,
.gefahr-button[aria-disabled="true"],
.erfolg-button:disabled,
.erfolg-button[aria-disabled="true"],
.icon-aktion:disabled,
.icon-aktion[aria-disabled="true"],
.sortiergriff:disabled,
.sortiergriff[aria-disabled="true"],
.kontaktstunden-aktionsbutton:disabled,
.kontaktstunden-aktionsbutton[aria-disabled="true"],
.kontaktstunden-symbolbutton:disabled,
.kontaktstunden-symbolbutton[aria-disabled="true"],
.kontaktstunden-plus:disabled,
.kontaktstunden-plus[aria-disabled="true"],
.kalender-nav-button:disabled,
.kalender-nav-button[aria-disabled="true"],
.menue-schalter:disabled {
    border-color: var(--button-deaktiviert-rand);
    background: var(--button-deaktiviert-hintergrund);
    color: var(--button-deaktiviert-text);
    cursor: not-allowed;
    opacity: 1;
    pointer-events: none;
    box-shadow: none;
}

button.primaer-button:disabled,
button.sekundaer-button:disabled,
button.gefahr-button:disabled,
button.erfolg-button:disabled,
button.icon-aktion:disabled,
button.sortiergriff:disabled,
button.kontaktstunden-aktionsbutton:disabled,
button.kontaktstunden-symbolbutton:disabled,
button.kontaktstunden-plus:disabled,
button.kalender-nav-button:disabled,
button.menue-schalter:disabled {
    cursor: not-allowed;
    pointer-events: auto;
}
.icon-aktion:disabled img,
.icon-aktion[aria-disabled="true"] img,
.sortiergriff:disabled img,
.sortiergriff[aria-disabled="true"] img,
.kalender-nav-button:disabled img,
.kalender-nav-button[aria-disabled="true"] img {
    filter: grayscale(1);
    opacity: var(--button-symbol-deaktiviert-opacity);
}

.status,
.status-badge,
.statusmarke,
.zahlenbadge,
.infobadge {
    font-family: inherit;
}

.hub-kalender-kopf {
    align-items: flex-start;
    display: flex;
    gap: 18px;
    justify-content: space-between;
}

.hub-kalender-kopf ~ * .ist-fremdmonat,
.hub-kalender-standard .ist-fremdmonat,
.berichtsheft-monatskalender .ist-fremdmonat,
.anwesenheitskalender .ist-fremdmonat,
.planung-kalender-monate .ist-fremdmonat,
.kalender .ist-fremdmonat {
    pointer-events: none !important;
    visibility: hidden !important;
}

.hub-kalender-kopf ~ * :is(
    .berichtsheft-kalendertag strong,
    .schuelerbereich-abwesenheit-tag strong,
    .kontaktstunden-kalendertag-nummer,
    .planung-kalendertag strong,
    .hub-kalendertag strong
),
.hub-kalender-standard :is(
    .berichtsheft-kalendertag strong,
    .schuelerbereich-abwesenheit-tag strong,
    .kontaktstunden-kalendertag-nummer,
    .planung-kalendertag strong,
    .hub-kalendertag strong
),
.kalender :is(
    .berichtsheft-kalendertag strong,
    .schuelerbereich-abwesenheit-tag strong,
    .kontaktstunden-kalendertag-nummer,
    .planung-kalendertag strong,
    .hub-kalendertag strong
) {
    font-weight: 400 !important;
}

.hub-kalender-navigation,
.planung-kalender-nav,
.anwesenheitskalender-navigation,
.anwesenheit-kalender-navigation {
    align-items: center;
    display: inline-flex;
    flex: 0 0 auto;
    gap: 8px;
}

.hub-kalender-zeitraum,
.planung-kalender-zeitraum,
.anwesenheit-kalender-navigation strong {
    align-items: center;
    background: var(--karte-flaeche-abgesetzt);
    border: 1px solid var(--karte-rand);
    border-radius: var(--button-radius);
    color: var(--farbe-dunkelblau);
    display: inline-flex;
    justify-content: center;
    min-height: var(--button-hoehe);
    min-width: 220px;
    padding: 0 14px;
    text-align: center;
    white-space: nowrap;
}

.hub-kalender-jahr,
.anwesenheitskalender-jahr,
.kontaktstunden-jahranzeige {
    align-items: center;
    background: var(--karte-flaeche-abgesetzt);
    border: 1px solid var(--karte-rand);
    border-radius: var(--button-radius);
    color: var(--farbe-orange);
    display: inline-flex;
    font-size: 1.08rem;
    font-weight: 700;
    justify-content: center;
    min-height: var(--button-hoehe);
    min-width: 72px;
    padding: 0 14px;
    white-space: nowrap;
}

.hub-kalender-jahrgruppe {
    align-items: center;
    background: var(--karte-flaeche-abgesetzt);
    border: 1px solid var(--karte-rand);
    border-radius: var(--button-radius);
    display: inline-flex;
    min-height: var(--button-hoehe);
    overflow: hidden;
}

.hub-kalender-jahrgruppe .hub-kalender-jahr {
    background: transparent;
    border: 0;
    border-radius: 0;
    min-height: calc(var(--button-hoehe) - 2px);
}

.hub-kalender-jahrgruppe .kalender-nav-button-text {
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    min-height: calc(var(--button-hoehe) - 2px);
}

.hub-kalender-jahrgruppe .kalender-nav-button-text + .hub-kalender-jahr,
.hub-kalender-jahrgruppe .hub-kalender-jahr + .kalender-nav-button-text {
    border-left: 1px solid #c7d7ea;
}

.anwesenheitskalender .kalender-nav-button-text,
.kontaktstunden-jahresnavigation .kalender-nav-button-text {
    min-width: var(--button-symbol-hoehe);
    padding: 0;
    width: var(--button-symbol-hoehe);
}

.planung-kalender-nav .kalender-nav-button-text,
.schuelerakte-einsatz-kalenderkopf .kalender-nav-button-text {
    min-width: 96px;
}

.anwesenheitskalender-navigation .kalender-nav-button-text {
    min-width: 96px;
    padding: 0 14px;
    width: auto;
}

.anwesenheitskalender-navigation .hub-kalender-zeitraum {
    min-width: 96px;
    width: 120px;
}

.kopf-nachrichten-link {
    align-items: center;
    align-self: stretch;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(238, 114, 3, 0.72);
    border-radius: 5px;
    color: var(--karte-inhalt-hintergrund);
    display: inline-flex;
    justify-content: center;
    min-height: 32px;
    min-width: 42px;
    padding: 0 10px;
    position: relative;
    text-decoration: none;
}

.kopf-nachrichten-link svg {
    height: 16px;
    width: 16px;
}

.kopf-nachrichten-link:hover,
.kopf-nachrichten-link:focus {
    background: var(--farbe-orange);
    outline: 0;
}

.kopf-nachrichten-link.hat-ungelesene {
    animation: hub-nachrichten-blinken 1.15s ease-in-out infinite;
    background: var(--farbe-orange);
}

.kopf-nachrichten-anzahl {
    align-items: center;
    background: #ffffff;
    border: 1px solid rgba(238, 114, 3, 0.45);
    border-radius: 999px;
    color: var(--farbe-orange);
    display: inline-flex;
    font-size: 10px;
    font-weight: 700;
    height: 17px;
    justify-content: center;
    min-width: 17px;
    padding: 0 4px;
    position: absolute;
    right: -7px;
    top: -7px;
}

@keyframes hub-nachrichten-blinken {
    0%, 100% {
        background: var(--farbe-orange);
        box-shadow: 0 0 0 0 rgba(238, 114, 3, 0.42);
    }
    50% {
        background: rgba(238, 114, 3, 0.36);
        box-shadow: 0 0 0 4px rgba(238, 114, 3, 0.10);
    }
}

/* Notebook-Layout: typische 13-15"-Displays haben oft nur 1366px Breite. */
@media (max-width: 1600px) {
    :root {
        --menue-breite: 236px;
        --menue-schmal: 66px;
        --leiste-hoehe: 56px;
        --schrift-normal: 0.78rem;
        --schrift-hinweis: 0.72rem;
        --schrift-kartenkopf: 0.86rem;
        --schrift-karteninnenkopf: 0.82rem;
        --schrift-dashboard-kennzahl: 2.05rem;
        --button-hoehe: 28px;
        --button-symbol-hoehe: var(--button-hoehe);
        --button-padding-x: 10px;
        --button-font-size: 0.76rem;
        --button-symbol-icon-groesse: 14px;
        --formular-element-hoehe: var(--button-hoehe);
    }

    .seitenmenue {
        width: var(--menue-breite);
    }

    .arbeitsbereich {
        margin-left: var(--menue-breite);
    }

    .menue-marke {
        padding: 10px 16px;
    }

    .menue-marke-gross {
        font-size: 13px;
    }

    .menue-marke-klein {
        font-size: 12px;
    }

    .hauptmenue {
        padding: 10px 8px 18px;
    }

    .seitenmenue .menuepunkt,
    .seitenmenue .menuegruppe-titel {
        gap: 8px;
        min-height: 34px;
        overflow: hidden;
        padding: 6px 9px;
        white-space: nowrap;
    }

    .seitenmenue .menuepunkt,
    .seitenmenue .menuegruppe-titel,
    .seitenmenue .menuepunkt-kind {
        font-size: 12px;
        line-height: 1.22;
    }

    .seitenmenue .menuepunkt img,
    .seitenmenue .menuegruppe-titel img {
        flex: 0 0 17px;
        height: 17px;
        width: 17px;
    }

    .seitenmenue .menuegruppe-dreieck {
        flex: 0 0 7px;
    }

    .seitenmenue .hauptmenue > .menuepunkt:not(.menuepunkt-kind)::before {
        content: "";
        display: block;
        flex: 0 0 7px;
        order: 2;
        width: 7px;
    }

    .seitenmenue .hauptmenue > .menuepunkt:not(.menuepunkt-kind) > img {
        order: 1;
    }

    .seitenmenue .hauptmenue > .menuepunkt:not(.menuepunkt-kind) > span {
        order: 3;
    }

    .seitenmenue .menuepunkt > span,
    .seitenmenue .menuegruppe-titel > span:last-child {
        flex: 1 1 auto;
        margin-left: 0;
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .hauptmenue > .menuepunkt > img + span {
        margin-left: 0;
    }

    body.menue-eingeklappt .seitenmenue .menue-marke-gross,
    body.menue-eingeklappt .seitenmenue .menuepunkt > span,
    body.menue-eingeklappt .seitenmenue .menuegruppe-titel > span,
    body.menue-eingeklappt .seitenmenue .standort-name,
    body.menue-eingeklappt .seitenmenue .seitenmenue-footer address {
        display: none !important;
    }

    body.menue-eingeklappt .seitenmenue .menuepunkt,
    body.menue-eingeklappt .seitenmenue .menuegruppe-titel {
        gap: 0;
        justify-content: center;
        padding-inline: 8px;
    }

    body.menue-eingeklappt .hauptmenue > .menuepunkt > img + span {
        margin-left: 0;
    }

    .seitenmenue-footer {
        display: flex;
        justify-content: center;
        margin-inline: 12px;
    }

    .obere-leiste {
        gap: 12px;
        padding-inline: 18px;
    }

    .obere-leiste-titel {
        font-size: 16px;
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .benutzerbereich {
        gap: 8px;
    }

    .benutzerdaten {
        display: none;
    }

    .inhalt {
        padding: 16px;
    }

    .seitenkopf-block {
        margin-bottom: 18px;
    }

    .datenbereich,
    .formularbereich,
    .warnbereich,
    .livefilter-debug,
    .formular-fehler,
    .formular-erfolg,
    .curriculum-arbeitskontext {
        width: 100%;
    }

    .seitenkopf-block h1 {
        font-size: 26px;
    }

    .schuelerakte-register,
    .klassenakte-register,
    .lehrkraefte-registerkarten,
    .unternehmen-register,
    .klassen-register,
    .registerkarten,
    .datenbank-tools-registerkarten {
        flex-wrap: wrap;
        overflow-x: visible;
        overflow-y: visible;
        padding-left: 12px;
        padding-right: 12px;
    }

    .registerkarte,
    .registerkarten .registerkarte,
    .schuelerakte-register .registerkarte,
    .benutzerakte-register .registerkarte,
    .klassenakte-register .registerkarte,
    .unternehmen-register .registerkarte,
    .klassen-register .registerkarte,
    .datenbank-tools-registerkarten .registerkarte {
        flex: 0 1 auto;
        min-height: 36px;
        padding-inline: var(--registerkarte-padding-x);
        white-space: nowrap;
    }

    .formularraster,
    .formularraster-standort,
    .formularraster-raum,
    .formularraster-feiertag,
    .formularraster-ferientag,
    .formularraster-raumsperrung,
    .formularraster-schliesstag,
    .formularraster-beweglicher-ferientag,
    .formularraster-sperruebersicht,
    .formularraster-planung,
    .formularraster-sondermeldung {
        grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    }

    .formularraster-klasse,
    .formularraster-kurs {
        grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    }

    .formular-karten-zweispaltig {
        grid-template-columns: minmax(0, 1fr);
    }

    .hub-kalender-kopf,
    .anwesenheitskalender-kopf {
        align-items: flex-start;
        flex-direction: column;
    }

    .hub-kalender-navigation,
    .anwesenheitskalender-navigation,
    .planung-kalender-nav,
    .anwesenheit-kalender-navigation {
        flex-wrap: wrap;
        justify-content: flex-start;
        width: 100%;
    }

    .anwesenheitskalender-grid,
    .anwesenheit-kalender-auswahl-grid,
    .schuelerakte-einsatz-kalender {
        grid-template-columns: repeat(2, minmax(260px, 1fr));
    }
}

@media (max-width: 1180px) {
    .inhalt {
        padding: 16px;
    }

    .seitenkopf-block h1 {
        font-size: 24px;
    }

    .anwesenheitskalender-grid,
    .anwesenheit-kalender-auswahl-grid,
    .schuelerakte-einsatz-kalender {
        grid-template-columns: minmax(0, 1fr);
    }
}

.menuepunkt-unterzeile {
    color: rgba(255, 255, 255, 0.62);
    display: block;
    font-size: 0.76rem;
    line-height: 1.2;
    margin: -8px 14px 8px 48px;
}

.hub-externe-unternehmenlayout .hauptmenue {
    gap: 2px;
}

.praxiseinsatz-block.ist-kurzblock {
    align-content: start;
    gap: 0;
    justify-items: center;
    min-height: 104px;
    padding: 8px 3px;
}

.praxiseinsatz-block.ist-kurzblock .praxiseinsatz-block-kopf {
    gap: 0;
    padding-top: 0;
    text-align: center;
}

.praxiseinsatz-block.ist-kurzblock .praxiseinsatz-block-kopf strong {
    font-size: 0.72rem;
    line-height: 1.1;
}

.praxiseinsatz-block.ist-kurzblock .praxiseinsatz-block-kurzinfo {
    align-self: center;
    justify-self: center;
    margin-top: 5px;
}

.praxiseinsatz-block.ist-kurzblock .praxiseinsatz-block-kopf > span:not(.praxiseinsatz-block-info),
.praxiseinsatz-block.ist-kurzblock .praxiseinsatz-block-details {
    display: none;
}




.kennwort-meter {
    margin: -4px 0 16px;
    padding: 12px;
    border: 1px solid #d6e0ee;
    border-radius: 6px;
    background: #f5f8fc;
}

.kennwort-meter-kopf {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 8px;
    color: var(--farbe-dunkelblau);
    font-size: 14px;
}

.kennwort-meter-kopf strong {
    font-size: 14px;
}

.kennwort-meter-balken {
    width: 100%;
    height: 8px;
    overflow: hidden;
    border-radius: 999px;
    background: #e6ebf3;
}

.kennwort-meter-balken span {
    display: block;
    width: 20%;
    height: 100%;
    border-radius: inherit;
    background: #c21b17;
    transition: width 0.18s ease, background-color 0.18s ease;
}

.kennwort-meter[data-stufe="mittel"] .kennwort-meter-balken span {
    width: 62%;
    background: #e58a00;
}

.kennwort-meter[data-stufe="stark"] .kennwort-meter-balken span {
    width: 100%;
    background: #16803a;
}

.kennwort-regeln {
    display: grid;
    gap: 5px 12px;
    grid-template-columns: 1fr;
    margin: 10px 0 0;
    padding: 0;
    list-style: none;
    color: #53627c;
    font-size: 13px;
    font-weight: 400;
}

.kennwort-regeln li {
    position: relative;
    padding-left: 22px;
}

.kennwort-regeln li::before {
    content: "×";
    position: absolute;
    left: 0;
    top: 0;
    width: 15px;
    height: 15px;
    border: 1px solid #f1a5a5;
    border-radius: 4px;
    background: #fff1f1;
    color: #c21b17;
    font-size: 12px;
    line-height: 13px;
    text-align: center;
}

.kennwort-regeln li.ist-erfuellt {
    color: #1d6b36;
}

.kennwort-regeln li.ist-erfuellt::before {
    content: "✓";
    border-color: #9fd3b3;
    background: #eaf7ef;
    color: #16803a;
}
.aktivierung-seite .aktivierung-rahmen {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 32px 18px;
}

.aktivierung-karte {
    width: min(760px, 94vw);
    overflow: hidden;
    border: 1px solid rgba(31, 42, 68, 0.14);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.97);
    box-shadow: 0 18px 42px rgba(31, 42, 68, 0.20);
}

body.login-anmeldemaske:not(.app_ansicht_login_schueler) .aktivierung-karte {
    width: min(700px, 94vw);
}

.aktivierung-kopf {
    min-height: 126px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 30px 36px;
    background: var(--farbe-dunkelblau);
    color: #fff;
}

.aktivierung-kopf img {
    width: 96px;
    height: auto;
    flex: 0 0 auto;
}

.aktivierung-marke {
    font-size: 22px;
    line-height: 1.1;
    font-weight: 800;
    letter-spacing: 0;
}

.aktivierung-submarke {
    margin-top: 5px;
    font-size: 15px;
    line-height: 1.2;
    font-weight: 400;
}

.aktivierung-inhalt {
    padding: 32px 36px 36px;
}

.aktivierung-inhalt h1 {
    margin: 0 0 12px;
    color: var(--farbe-dunkelblau);
    font-size: 26px;
    line-height: 1.2;
}

.aktivierung-einleitung,
.aktivierung-status p {
    margin: 0 0 14px;
    color: var(--farbe-text);
    font-size: 15px;
    line-height: 1.55;
}

.aktivierung-formular {
    margin-top: 24px;
}

.aktivierung-login-formular {
    max-width: none;
}

.anmeldung-wege {
    display: grid;
    gap: 18px;
}

.anmeldung-wege-mit-qr {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.anmeldung-weg {
    min-width: 0;
    overflow: hidden;
    border: 1px solid #d5ddea;
    border-radius: 6px;
}

.anmeldung-weg h2 {
    margin: 0;
    padding: 12px;
    border-bottom: 1px solid #d5ddea;
    background: #f3f6fa;
    color: var(--farbe-dunkelblau);
    font-size: 13px;
    line-height: 1.3;
    white-space: nowrap;
}

.anmeldung-weg-inhalt {
    padding: 18px;
}

.anmeldung-weg .formular-fehler {
    margin-bottom: 14px;
}

.anmeldung-abschluss {
    grid-column: 1 / -1;
    min-width: 0;
}

.anmeldung-abschluss .turnstile-feld {
    margin-top: 0;
}

.qr-anmeldung {
    display: block;
}

.qr-anmeldung-inhalt {
    display: grid;
    justify-items: center;
    gap: 14px;
}

.qr-anmeldung-code {
    width: 190px;
    height: 190px;
    padding: 8px;
    background: #fff;
}

.qr-anmeldung-code svg {
    display: block;
    width: 100%;
    height: 100%;
}

.qr-anmeldung-status {
    margin: 0;
    color: #465571;
    font-size: .9rem;
    line-height: 1.45;
    text-align: center;
}

.aktivierung-formular-aktionen {
    margin-top: 6px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.aktivierung-status {
    border: 1px solid #d6e0ee;
    border-radius: 8px;
    padding: 22px 24px;
    background: #f5f8fc;
}

.aktivierung-status-erfolg {
    border-left: 5px solid var(--farbe-button-erfolg);
    background: var(--statusbadge-erfolg-hintergrund);
}

.aktivierung-status-hinweis {
    border-left: 5px solid var(--farbe-orange);
}

.aktivierung-status p:last-child {
    margin-bottom: 0;
}

.aktivierung-aktionen {
    margin-top: 22px;
    padding-top: 20px;
    border-top: 1px solid #d6e0ee;
    display: flex;
    justify-content: flex-end;
}

body.app_ansicht_login_schueler {
    min-height: 100dvh;
    background: #f4f7fb;
    overscroll-behavior-y: contain;
    -webkit-tap-highlight-color: transparent;
}

body.app_ansicht_login_schueler::before,
body.app_ansicht_login_schueler::after {
    display: none;
}

body.app_ansicht_login_schueler .aktivierung-rahmen {
    min-height: 100dvh;
    align-items: stretch;
    justify-content: flex-start;
    padding: 0;
}

body.app_ansicht_login_schueler .aktivierung-karte {
    width: 100%;
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
    border: 0;
    border-radius: 0;
    background: #fff;
    box-shadow: none;
}

body.app_ansicht_login_schueler .anmeldung-wege {
    gap: 0;
}

body.app_ansicht_login_schueler .anmeldung-weg {
    padding: 0;
    overflow: visible;
    border: 0;
}

body.app_ansicht_login_schueler .anmeldung-weg h2 {
    display: none;
}

body.app_ansicht_login_schueler .anmeldung-weg-inhalt {
    padding: 0;
}

body.app_ansicht_login_schueler .aktivierung-kopf {
    min-height: 148px;
    padding: max(26px, calc(env(safe-area-inset-top) + 18px)) 22px 26px;
    border-radius: 0;
}

body.app_ansicht_login_schueler .aktivierung-kopf img {
    width: 78px;
}

body.app_ansicht_login_schueler .aktivierung-inhalt {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    padding: 30px 22px 26px;
}

body.app_ansicht_login_schueler .aktivierung-login-formular {
    max-width: none;
}

body.app_ansicht_login_schueler .formular-feld {
    gap: 10px;
    margin-bottom: 22px;
}

body.app_ansicht_login_schueler .formular-feld span {
    font-size: 15px;
    font-weight: 700;
    color: #1f2a44;
}

body.app_ansicht_login_schueler .formular-feld input:not([type="checkbox"]):not([type="radio"]) {
    min-height: 54px;
    padding: 14px 16px;
    border: 0;
    border-radius: 14px;
    background: #f3f6fb;
    box-shadow: inset 0 0 0 1px #d7e0ec;
    color: #1f2a44;
    font-size: 16px;
    appearance: none;
    -webkit-appearance: none;
}

body.app_ansicht_login_schueler .formular-feld input:not([type="checkbox"]):not([type="radio"]):focus {
    outline: 0;
    background: #fff;
    box-shadow: inset 0 0 0 2px var(--farbe-orange), 0 0 0 4px rgba(239, 123, 0, 0.13);
}

body.app_ansicht_login_schueler .app-login-merken {
    margin: -2px 0 22px;
    display: flex;
    align-items: center;
    gap: 12px;
    color: #1f2a44;
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
    user-select: none;
}

body.app_ansicht_login_schueler .app-login-merken input {
    position: absolute;
    inline-size: 1px;
    block-size: 1px;
    opacity: 0;
    pointer-events: none;
}

body.app_ansicht_login_schueler .app-login-merken-schalter {
    position: relative;
    flex: 0 0 auto;
    width: 52px;
    height: 32px;
    border-radius: 999px;
    background: #d8e0ec;
    box-shadow: inset 0 0 0 1px #c4cfdd;
    transition: background 160ms ease, box-shadow 160ms ease;
}

body.app_ansicht_login_schueler .app-login-merken-schalter::after {
    content: "";
    position: absolute;
    top: 3px;
    left: 3px;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 2px 7px rgba(31, 42, 68, 0.22);
    transition: transform 160ms ease;
}

body.app_ansicht_login_schueler .app-login-merken input:checked + .app-login-merken-schalter {
    background: var(--farbe-orange);
    box-shadow: inset 0 0 0 1px rgba(239, 123, 0, 0.55);
}

body.app_ansicht_login_schueler .app-login-merken input:checked + .app-login-merken-schalter::after {
    transform: translateX(20px);
}

body.app_ansicht_login_schueler .app-login-merken input:focus-visible + .app-login-merken-schalter {
    outline: 3px solid rgba(239, 123, 0, 0.25);
    outline-offset: 3px;
}

body.app_ansicht_login_schueler .aktivierung-formular-aktionen .primaer-button {
    width: 100%;
    min-height: 56px;
    border-radius: 14px;
    justify-content: center;
    font-weight: 700;
}

body.app_ansicht_login_schueler input,
body.app_ansicht_login_schueler select,
body.app_ansicht_login_schueler textarea,
body.app_ansicht_login_schueler button {
    font-size: 16px;
}

@media (max-width: 640px) {
    .aktivierung-seite .aktivierung-rahmen {
        align-items: stretch;
        padding: 14px;
    }

    .aktivierung-karte {
        width: 100%;
    }

    .aktivierung-kopf {
        min-height: 102px;
        padding: 22px;
    }

    .aktivierung-kopf img {
        width: 76px;
    }

    .aktivierung-inhalt {
        padding: 24px 20px 26px;
    }

    .aktivierung-inhalt h1 {
        font-size: 23px;
    }

    .anmeldung-wege-mit-qr {
        grid-template-columns: 1fr;
    }

    .anmeldeseite .formular-feld :where(input:not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="hidden"]):not([type="file"]):not([type="range"]), select, textarea) {
        font-size: 16px;
    }

    .aktivierung-aktionen .primaer-button,
    .aktivierung-formular-aktionen .primaer-button {
        width: 100%;
        justify-content: center;
    }
}