:root {
    --farbe-orange: #EE7203;
    --farbe-grau: #c0c0c0;
    --farbe-dunkelblau: #1F2A44;
    --farbe-dunkelblau-hell: #2c3b5d;
    --farbe-text: #1d2433;
    --farbe-hintergrund: #f4f6f8;
    --farbe-weiss: #ffffff;
    --farbe-fehler: #b42318;
    --menue-breite: 292px;
    --menue-schmal: 78px;
    --leiste-hoehe: 68px;
}

* {
    box-sizing: border-box;
}

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

body {
    font-family: Arial, Helvetica, sans-serif;
    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::after {
    display: block;
    width: min(380px, 92vw);
    height: 264px;
    content: "";
}

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

.startseite-root::after {
    display: block;
    width: min(380px, 92vw);
    height: 264px;
    content: "";
}

.startseite-marke,
.startseite-titel {
    width: min(380px, 92vw);
    text-align: left;
    text-shadow: 0 2px 10px rgba(255, 255, 255, 0.55);
}

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

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

.startseite-titel::before {
    content: "Raumplanung";
    font-size: 22px;
}

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

.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;
    text-align: left;
    text-shadow: 0 2px 10px rgba(255, 255, 255, 0.55);
}

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

.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);
}

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

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

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

.formular-feld select {
    width: 100%;
    min-height: 42px;
    border: 1px solid #a9b3c6;
    border-radius: 6px;
    padding: 9px 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);
}

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

.formular-fehler {
    margin-bottom: 16px;
    border-left: 4px solid var(--farbe-fehler);
    padding: 10px 12px;
    background: #fff1f0;
    color: var(--farbe-fehler);
    font-weight: 700;
}

.formular-erfolg {
    max-width: 1180px;
    margin-bottom: 16px;
    border-left: 4px solid #2f855a;
    padding: 10px 12px;
    background: #e8f5ee;
    color: #23613d;
    font-weight: 700;
}

.primaer-button {
    width: 100%;
    min-height: 44px;
    border: 0;
    border-radius: 6px;
    padding: 0 18px;
    background: var(--farbe-orange);
    color: var(--farbe-weiss);
    cursor: pointer;
    font: inherit;
    font-weight: 700;
}

.primaer-button:hover,
.primaer-button:focus {
    background: #d96500;
    outline: 3px solid rgba(238, 114, 3, 0.22);
}

.admin-seite {
    min-height: 100vh;
    background:
        linear-gradient(rgba(244, 246, 248, 0.90), rgba(244, 246, 248, 0.90)),
        url("../bilder/euraka_background_1080p.jpg") center / cover fixed no-repeat;
}

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

.seitenmenue {
    position: fixed;
    inset: 0 auto 0 0;
    z-index: 20;
    width: var(--menue-breite);
    overflow-y: auto;
    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 {
    padding: 14px 10px 26px;
}

.menuepunkt,
.menuegruppe-titel {
    display: flex;
    min-height: 42px;
    align-items: center;
    gap: 11px;
    border-radius: 6px;
    padding: 8px 12px;
    text-decoration: none;
    color: rgba(255, 255, 255, 0.90);
}

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

.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: 8px 0;
}

.menuegruppe-titel {
    color: rgba(255, 255, 255, 0.90);
    font-weight: 400;
    font-size: 16px;
    line-height: normal;
}

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;
    text-align: left;
}

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

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

.standort-ast {
    margin: 4px 0 10px 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: 34px;
    padding: 6px 8px;
    font-size: 14px;
}

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

.obere-leiste {
    position: sticky;
    top: 0;
    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);
}

.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 span {
    display: block;
    width: 18px;
    height: 2px;
    background: var(--farbe-weiss);
}

.menue-schalter:hover,
.menue-schalter: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;
}

.inhalt {
    padding: 32px;
}

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

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

.seitenkopf-block p {
    margin: 0;
    max-width: 760px;
    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;
}

.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;
}

.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 2fr 0.8fr;
}

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

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

.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.9fr 0.9fr 1.8fr 2fr;
}

.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 {
    grid-template-columns: 1fr 2fr 0.7fr;
}

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

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

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

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

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

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

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

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

.formular-hinweis-mit-abstand {
    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;
}

.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: 10px;
    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;
}

.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;
}

.checkboxgruppe input,
.checkboxzeile input {
    width: 16px;
    height: 16px;
    accent-color: var(--farbe-orange);
}

.checkbox-einzel {
    display: flex;
    min-height: 42px;
    align-items: center;
    gap: 10px;
    padding-top: 24px;
    color: var(--farbe-dunkelblau);
    font-weight: 700;
}

.checkbox-einzel input {
    width: 18px;
    height: 18px;
    accent-color: var(--farbe-orange);
}

.checkboxzeile {
    margin-bottom: 18px;
}

.formularaktionen {
    display: flex;
    align-items: center;
    gap: 12px;
    justify-content: flex-start;
}

.primaer-button-schmal {
    width: auto;
    min-width: 180px;
    padding-inline: 18px;
}

.sekundaer-button {
    display: inline-flex;
    min-height: 44px;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    padding: 0 18px;
    background: #eef2f6;
    color: var(--farbe-dunkelblau);
    font: inherit;
    font-weight: 700;
    text-decoration: none;
}

.sekundaer-button:hover,
.sekundaer-button:focus {
    background: rgba(238, 114, 3, 0.14);
    outline: 0;
}

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

.inline-aktion {
    margin: 0;
}

.icon-aktion {
    display: inline-flex;
    width: 34px;
    height: 34px;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 6px;
    padding: 0;
    background: #eef2f6;
    cursor: pointer;
    text-decoration: none;
}

.icon-aktion img {
    width: 18px;
    height: 18px;
}

.icon-aktion:hover,
.icon-aktion:focus {
    background: rgba(238, 114, 3, 0.14);
    outline: 0;
}

.icon-aktion-gefahr {
    background: #fff1f0;
}

.eintrag-deaktiviert {
    color: #7a8495;
    filter: grayscale(1);
}

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

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

.eintrag-deaktiviert .status,
.eintrag-deaktiviert .icon-aktion {
    opacity: 0.72;
}

.gefahr-button {
    min-height: 38px;
    border: 0;
    border-radius: 6px;
    padding: 8px 14px;
    background: var(--farbe-fehler);
    color: var(--farbe-weiss);
    cursor: pointer;
    font: inherit;
    font-weight: 700;
}

.gefahr-button:disabled {
    cursor: not-allowed;
    opacity: 0.45;
}

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

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

.aktions-button {
    min-height: 38px;
    font-size: 14px;
    font-weight: 700;
}

.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 8px;
    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;
}

.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: 42px;
}

.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 rgba(31, 42, 68, 0.10);
}

.datenbereich-kopf h2 {
    margin: 0;
    color: var(--farbe-dunkelblau);
    font-size: 20px;
}

.zaehler {
    border-radius: 999px;
    padding: 5px 10px;
    background: rgba(238, 114, 3, 0.12);
    color: var(--farbe-dunkelblau);
    font-size: 13px;
    font-weight: 700;
}

.tabellenrahmen {
    overflow-x: auto;
}

.datentabelle {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}

.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: 700;
}

.datentabelle tbody tr:hover {
    background: rgba(238, 114, 3, 0.06);
}

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

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

.status {
    display: inline-flex;
    min-height: 24px;
    align-items: center;
    border-radius: 999px;
    padding: 3px 9px;
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
}

.status-aktiv {
    background: #e8f5ee;
    color: #23613d;
}

.status-gesperrt {
    background: #fff1f0;
    color: var(--farbe-fehler);
}

.status-hinweis {
    background: #fff6e8;
    color: #8a4b00;
}

.status-neutral {
    background: #eef2f6;
    color: #40506c;
}

.status-abgelaufen {
    background: #eef2f6;
    color: #7a8495;
}

.status-frei {
    background: #e8f5ee;
    color: #23613d;
}

.status-geplant {
    background: #e8eefb;
    color: var(--farbe-dunkelblau);
}

.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: 15px;
    font-weight: 600;
}

.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 .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 {
    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) {
    .hinweisraster {
        grid-template-columns: 1fr;
    }

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

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

    .inhalt {
        padding: 24px;
    }
}

@media (max-width: 440px) {
    .anmeldung-marke {
        font-size: 30px;
    }
}