/*
    Globale Basis-Styles für alle Portale (Barrierefreiheit A2/A4).
    Wird in WebApp_10_00/Components/App.razor NACH dem Telerik-Theme eingebunden.
    CSS-Variablen übernommen aus dem Legacy-Frontend (Frontend/WebApp/wwwroot/css/variabled.css).
*/
:root {
    --footer-height: 3rem;
    --color-input-border: #7b7b7b;
    /* HESSEN DESIGN */
    /* -- Colors -- */
    --main-color: #14006E;
    --main-color-fallback: #16191f;
    --secondary-color: #fff;
    --focus-color: #fff;
    --default-color: #16191f;
    --controls-focus-color: #FFCC44;
    /* -- fonts -- */
    --font-color: var(--main-color);
    --html-fontsize: 16px;
    --html-line-height: 1.5;
    --fontsize-small: 1rem;
    --fontsize: 1.125rem;
    --fontsize-768: 1.0625rem;
    --fontsize-1024: 1.1875rem;
    --fontsize-h1: 1.625rem;
    --fontsize-h1-1024: 1.75rem;
    --fontsize-h1-1680: 2.5rem;
    --fontsize-h2: 1.5rem;
    --fontsize-h2-768: 1.25rem;
    --fontsize-h2-1024: 1.5rem;
    --fontsize-h2-1680: 1.75rem;
    --fontsize-h3: 1.25rem;
    --fontsize-h3-768: 1.15rem;
    --fontsize-h3-1024: 1.25rem;
    --fontsize-h3-1680: 1.5rem;
    --fontsize-h4: 1.25rem;
    --fontsize-h4-768: 1.10rem;
    --fontsize-h4-1024: 1.20rem;
    --fontsize-h4-1680: 1.25rem;
    --line-height-h1: 1.19;
    --line-height-h1-768: 0.95;
    --line-height-h1-1024: 1.2;
    --line-height-h2: 1.85rem;
    --line-height-h2-768: 1.5rem;
    --line-height-h2-1024: 1.75rem;
    /* -- links and buttons -- */
    --link-fontsize: 1rem;
    --link-line-height: 1.75;
    --link-color: #515760;
    --link-focus-color: var(--main-color);
    --link-border-color: var(--main-color);
    --link-background-color-hover: var(--main-color);
    /* -- Footer Links -- */
    --footer-link-font-size: 1.25rem;
    --footer-link-font-size-768: 1.3rem;
    --footer-link-font-size-1024: 1.35rem;
    /* -- container -- */
    --container-border-color: var(--main-color, var(--main-color-fallback));
    --container-border-radius: 0px;
}

/* Nur für Screenreader sichtbar (visually hidden). */
.sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

/* Skip-Link "Zum Inhalt springen": ausgeblendet, bei Tastaturfokus sichtbar. */
.skip-link {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 10000;
    padding: 0.75rem 1.25rem;
    background: var(--main-color);
    color: #fff;
    font-weight: bold;
    text-decoration: underline;
    transform: translateY(-120%);
}

    .skip-link:focus,
    .skip-link:focus-visible {
        transform: translateY(0);
        outline: 3px solid var(--controls-focus-color);
        outline-offset: 0;
    }

.dropdown-list.user-account-navigation {
    border-top: 1px solid black;
    display: flex;
}
/* Sprungziel des Skip-Links: per Skript/Link fokussierbar, aber ohne Fokusrahmen um den gesamten Inhalt. */
main#hauptinhalt:focus {
    outline: none;
}

/* Wartungshinweis (Wartung/WartungsHinweis.razor) */
.wartung-banner {
    padding: .75rem 1rem;
    border-left: .375rem solid;
    margin: 0 0 1rem 0;
}
.wartung-banner--hinweis {
    background: #fff4ce;
    border-color: #8a6100;
    color: #1f1f1f;
}
.wartung-banner--abschaltung {
    background: #fde7e9;
    border-color: #a4262c;
    color: #1f1f1f;
}
.wartung-banner__link {
    margin-left: .5rem;
    color: inherit;
    text-decoration: underline;
}
.wartung-dialog {
    max-width: 40rem;
    padding: 1.5rem;
    border: 1px solid #605e5c;
}
.wartung-dialog::backdrop {
    background: rgba(0, 0, 0, .4);
}

/* Systemstatus (Fach-API/Endsystem nicht erreichbar) - SystemStatusHinweis.razor */
.systemstatus-hinweis {
    margin: 0 0 1rem;
    padding: .75rem 1rem;
    border-left: 4px solid #a4000f;
    background: #fdecee;
    color: #1a1a1a;
}

/* -- Sitzungs-Overlay (js/sitzung.js): Sitzung abgelaufen, Countdown bis zur Abmeldung -- */
.sitzung-overlay {
    position: fixed;
    inset: 0;
    z-index: 20000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    background: rgba(0, 0, 0, .6);
}

.sitzung-overlay[hidden] {
    display: none;
}

.sitzung-dialog {
    max-width: 32rem;
    width: 100%;
    padding: 1.5rem;
    background: var(--secondary-color);
    color: var(--default-color);
    border-top: 6px solid var(--main-color);
    box-shadow: 0 .5rem 1.5rem rgba(0, 0, 0, .35);
}

.sitzung-titel {
    font-size: var(--fontsize-h2);
    color: var(--main-color);
}

.sitzung-restzeit {
    font-size: var(--fontsize);
}

.sitzung-countdown {
    font-size: 1.5em;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: var(--main-color);
}

.sitzung-knopf:focus-visible {
    outline: 3px solid var(--controls-focus-color);
    outline-offset: 2px;
}

/* Adresssuche (AddressValidationComponent): drehende Ladeanzeige rechts im Eingabefeld, solange die Suche läuft */
.adresssuche-ladeanzeige {
    display: inline-flex;
    align-items: center;
    padding-inline: 0.5rem;
}

/* Benutzer Menu Positionierung */
.header-account-navigation {
    grid-column: 2;
    display: flex;
    justify-content: flex-end;
}

.k-wizard-buttons-left {
    display: none;
}