/* ============================================================================
   auth.css — Anmeldebereich (Areas/Identity)
   Projekt: MR-Intern Portal V9
   Angelegt: 11.09.2026 mit UK2 Tranche 1

   GELTUNGSBEREICH: ausschliesslich das Layout Areas/Identity/Pages/_Layout.cshtml
   und die 18 Views darunter. Diese Datei wird NUR dort geladen.

   Der Anmeldebereich ist ein bewusst eigener Auftritt: Video-Hintergrund,
   Glaskarte, FESTER Dunkelmodus, eigene Typografie. Er laedt weder
   mrintern-theme.css noch ein themes/*.css und ist von den Dichte-, Farb- und
   Theme-Regeln der Kompakt-Charta ausgenommen (Charta, "Login-Ausnahme").
   Was dort trotzdem gilt: keine Emojis, kein seitenlokales Stil-Element und
   keine Hartfarben ausserhalb des Token-Blocks.

   KEIN [data-bs-theme="dark"]-Gegenstueck: Die Seite ist immer dunkel, ein
   Hell-Modus ist nicht vorgesehen. Der Token-Paar-Waechter nimmt diese Datei
   deshalb ausdruecklich aus.

   Der Inhalt ist mit UK2 T1 aus fuenf <style>-Bloecken hierher verschoben
   (Layout 804, SelectTenant 196, Datenschutz 106, Impressum 90, Login 56
   Zeilen). Verschoben, nicht umgeschrieben: Selektoren, Reihenfolge und Werte
   sind unveraendert; ersetzt wurden nur Farbliterale durch Tokens und
   --mr-primary* durch --mr-accent*.
   ============================================================================ */

:root {
    /* --- Groessen (unveraendert aus dem Layout uebernommen) --- */
    --auth-card-max-width: 420px;
    --auth-card-padding: 2rem;
    --auth-input-height: 3.25rem;
    --auth-font-size-base: 1rem;
    --auth-font-size-h1: 1.75rem;
    --auth-logo-height: 40px;

    /* --- Farben: einziger Ort fuer Hartfarben in dieser Datei --- */
    --mr-accent: #448424; /* MR-Grün (früher --mr-primary) */
    --mr-accent-dark: #2e5a1a; /* gedrückter Zustand */
    --mr-accent-light: #5ca030; /* Link- und Hover-Akzent */
    --auth-bg: #1a1a1a; /* Grundfläche hinter Video/Bild */
    --auth-text-stark: #fff; /* Überschriften, Buttonbeschriftung */
    --auth-text-ueberschrift: rgba(255,255,255,0.92); /* Überschriften in Rechtstexten */
    --auth-text-hervor: rgba(255,255,255,0.82); /* Hervorhebungen im Rechtstext */
    --auth-text: rgba(255,255,255,0.8); /* Beschriftungen und Links */
    --auth-text-kachel: rgba(255,255,255,0.75); /* Text der Landwirte-Kachel */
    --auth-text-sekundaer: rgba(255,255,255,0.7); /* Fußzeilen-Links, Mandantenname */
    --auth-text-fliess: rgba(255,255,255,0.62); /* Fließtext in Rechtstexten */
    --auth-text-leise: rgba(255,255,255,0.6); /* Untertitel */
    --auth-text-muted: rgba(255,255,255,0.5); /* Meta- und Hinweistext */
    --auth-text-zart: rgba(255,255,255,0.4); /* Platzhalter, Icons */
    --auth-glass-bg: rgba(0,0,0,0.65); /* Fläche der Glaskarte */
    --auth-feld-bg-fokus: rgba(0,0,0,0.4); /* Eingabefeld im Fokus */
    --auth-feld-bg: rgba(0,0,0,0.3); /* Eingabefeld */
    --auth-kachel-schatten: rgba(0,0,0,0.25); /* Schatten der Landwirte-Kachel */
    --auth-flaeche-hauch: rgba(255,255,255,0.03); /* kaum sichtbare Fläche */
    --auth-flaeche-zart: rgba(255,255,255,0.04); /* Fläche im Rechtstext */
    --auth-flaeche-leicht: rgba(255,255,255,0.05); /* Fläche zweiter Ebene */
    --auth-flaeche-weich: rgba(255,255,255,0.06); /* Kontaktblock im Rechtstext */
    --auth-linie-zart: rgba(255,255,255,0.08); /* feinste Trennlinie */
    --auth-glass-border: rgba(255,255,255,0.1); /* Rahmen der Glaskarte */
    --auth-kachel-linie: rgba(255,255,255,0.15); /* Rahmen der Landwirte-Kachel */
    --auth-linie: rgba(255,255,255,0.2); /* Trennlinien und Rahmen auf Glas */
    --auth-feld-linie: rgba(255,255,255,0.3); /* Rahmen der Eingabefelder */
    --auth-akzent-flaeche-zart: rgba(68,132,36,0.1); /* Akzentfläche, ruhend */
    --auth-akzent-flaeche: rgba(68,132,36,0.15); /* Akzentfläche, gewählt */
    --auth-focus-ring: rgba(68,132,36,0.25); /* Fokusring in Akzentfarbe */
    --auth-danger-text: #ff8a8a; /* Fehlertext */
    --auth-danger-bg: rgba(220,53,69,0.2); /* Fehlerfläche */
    --auth-invalid-border: #dc3545; /* Rahmen ungültiger Felder */
    --auth-success-text: #75d99c; /* Erfolgstext */
    --auth-success-bg: rgba(25,135,84,0.2); /* Erfolgsfläche */
    --auth-warning-text: #ffd666; /* Warntext */
    --auth-warning-bg: rgba(255,193,7,0.2); /* Warnfläche */
    --auth-info-text: #6edff6; /* Hinweistext */
    --auth-info-bg: rgba(13,202,240,0.2); /* Hinweisfläche */
    --auth-lw-akzent-dunkel: #3B6D11; /* Landwirte-Kachel, dunkler Akzent */
    --auth-lw-akzent: #A6D468; /* Landwirte-Kachel, Akzent */
    --auth-lw-akzent-hell: #C6E79A; /* Landwirte-Kachel, heller Akzent */
}

/* ============================================================
   Layout
   ============================================================ */

/* Hero Section mit Video/Bild-Hintergrund */
.auth-hero {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: -1;
    background: var(--auth-bg);
}

.auth-video {
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    transform: translate(-50%, -50%);
    object-fit: cover;
    z-index: 1;
}

.auth-bg-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
}

/* Fallback-Bild - initial versteckt, nur via JS sichtbar */
#fallback-bg {
    display: none;
}

#fallback-bg.visible {
    display: block;
}

/* Main Container */
.auth-container {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    position: relative;
    z-index: 10;
}

/* Navbar */
.auth-navbar {
    padding: 1rem 0;
    background: transparent;
}

.auth-navbar .navbar-brand img {
    height: var(--auth-logo-height);
    width: auto;
}

/* Content Area */
.auth-content {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem 1rem;
}

/* Auth Card */
.auth-card {
    width: 100%;
    max-width: var(--auth-card-max-width);
    background: var(--auth-glass-bg);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-radius: 1rem;
    border: 1px solid var(--auth-glass-border);
    overflow: hidden;
}

.auth-card-wide {
    max-width: calc(var(--auth-card-max-width) + 100px);
}

/* ============================================
   LOGIN PAGE - Zwei-Säulen-Layout
   ============================================ */
.auth-card-login {
    max-width: 1000px;
}

/* "Angemeldet bleiben" oben - gilt für alle Methoden */
.remember-me-global {
    padding: 0.75rem 1rem;
    background: var(--auth-flaeche-leicht);
    border-radius: 0.5rem;
    border: 1px solid var(--auth-glass-border);
}

/* Container für Login-Methoden */
.login-methods {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: 1.5rem;
    align-items: stretch;
}

/* Einzelne Login-Methode */
.login-method {
    display: flex;
    flex-direction: column;
    padding: 1.25rem;
    background: var(--auth-flaeche-hauch);
    border-radius: 0.75rem;
    border: 1px solid var(--auth-linie-zart);
}

.login-method-header {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
}

.login-method-header i {
    font-size: 1.5rem;
    color: var(--mr-accent-light);
    width: 2rem;
    text-align: center;
}

.login-method-header h3 {
    font-size: 1rem;
    font-weight: 600;
    margin: 0;
    color: var(--auth-text-stark);
}

.login-method-description {
    font-size: 0.8125rem;
    color: var(--auth-text-leise);
    margin-bottom: 1rem;
    flex-grow: 1;
    line-height: 1.5;
}

/* Passkey-Methode: Button am Ende */
.login-method-passkey {
    justify-content: space-between;
}

.login-method-passkey .btn {
    margin-top: auto;
}

/* Trennlinie zwischen Methoden */
.login-method-divider {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.login-method-divider::before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    width: 1px;
    background: linear-gradient(
        to bottom,
        transparent,
        var(--auth-linie) 20%,
        var(--auth-linie) 80%,
        transparent
    );
}

.login-method-divider span {
    background: var(--auth-glass-bg);
    padding: 0.5rem 0;
    color: var(--auth-text-zart);
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    position: relative;
    z-index: 1;
}

/* Password-Methode: Form-Elemente kompakter */
.login-method-password .form-label {
    font-size: 0.8125rem;
    margin-bottom: 0.375rem;
}

.login-method-password .form-control {
    min-height: 2.75rem;
    font-size: 0.9375rem;
}

.login-method-password .mb-3 {
    margin-bottom: 0.875rem !important;
}

/* ============================================
   LOGIN PAGE - Mobile (< 768px)
   ============================================ */
@media (max-width: 767.98px) {
    .auth-card-login {
        max-width: var(--auth-card-max-width);
    }

    .login-methods {
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    .login-method-divider {
        padding: 0.5rem 0;
    }

    .login-method-divider::before {
        top: 50%;
        bottom: auto;
        left: 0;
        right: 0;
        width: auto;
        height: 1px;
        background: linear-gradient(
            to right,
            transparent,
            var(--auth-linie) 20%,
            var(--auth-linie) 80%,
            transparent
        );
    }

    .login-method-divider span {
        padding: 0 1rem;
    }

    .login-method {
        padding: 1rem;
    }
}

/* ============================================
   LOGIN PAGE - Large Desktop (1400px+)
   ============================================ */
@media (min-width: 1400px) {
    .auth-card-login {
        max-width: 1100px;
    }

    .login-methods {
        gap: 2rem;
    }

    .login-method {
        padding: 1.5rem;
    }

    .login-method-header i {
        font-size: 1.75rem;
    }

    .login-method-header h3 {
        font-size: 1.125rem;
    }

    .login-method-description {
        font-size: 0.875rem;
    }
}

/* ============================================
   LOGIN PAGE - 4K (2560px+)
   ============================================ */
@media (min-width: 2560px) {
    .auth-card-login {
        max-width: 1200px;
    }

    .login-method {
        padding: 2rem;
        border-radius: 1rem;
    }

    .login-method-header i {
        font-size: 2rem;
    }

    .login-method-header h3 {
        font-size: 1.25rem;
    }

    .login-method-description {
        font-size: 1rem;
    }

    .remember-me-global {
        padding: 1rem 1.25rem;
        border-radius: 0.75rem;
    }
}

.auth-card-header {
    padding: var(--auth-card-padding) var(--auth-card-padding) 1rem;
    text-align: center;
}

.auth-card-header h1 {
    font-size: var(--auth-font-size-h1);
    font-weight: 600;
    margin-bottom: 0.5rem;
    color: var(--auth-text-stark);
}

.auth-card-header p {
    color: var(--auth-text-leise);
    margin-bottom: 0;
    font-size: calc(var(--auth-font-size-base) * 0.9);
}

.auth-card-body {
    padding: 1.5rem var(--auth-card-padding) var(--auth-card-padding);
}

/* Form Styles */
.auth-card .form-label {
    color: var(--auth-text);
    font-weight: 500;
    font-size: calc(var(--auth-font-size-base) * 0.875);
}

.auth-card .form-control {
    background: var(--auth-feld-bg);
    border: 1px solid var(--auth-linie);
    color: var(--auth-text-stark);
    padding: 0.75rem 1rem;
    font-size: var(--auth-font-size-base);
    min-height: var(--auth-input-height);
    border-radius: 0.5rem;
    transition: all 0.2s ease;
}

.auth-card .form-control-lg {
    min-height: calc(var(--auth-input-height) + 0.25rem);
}

.auth-card .form-control:focus {
    background: var(--auth-feld-bg-fokus);
    border-color: var(--mr-accent-light);
    box-shadow: 0 0 0 0.2rem var(--auth-focus-ring);
    color: var(--auth-text-stark);
}

.auth-card .form-control::placeholder {
    color: var(--auth-text-zart);
}

.auth-card .form-control:-webkit-autofill,
.auth-card .form-control:-webkit-autofill:hover,
.auth-card .form-control:-webkit-autofill:focus {
    -webkit-text-fill-color: var(--auth-text-stark);
    -webkit-box-shadow: 0 0 0px 1000px var(--auth-feld-bg-fokus) inset;
    transition: background-color 5000s ease-in-out 0s;
}

.auth-card .form-check-input {
    background-color: var(--auth-feld-bg);
    border-color: var(--auth-feld-linie);
    width: 1.25em;
    height: 1.25em;
}

.auth-card .form-check-input:checked {
    background-color: var(--mr-accent);
    border-color: var(--mr-accent);
}

.auth-card .form-check-label {
    color: var(--auth-text);
    font-size: var(--auth-font-size-base);
    padding-left: 0.35rem;
}

/* Buttons */
.btn-mr-primary {
    background-color: var(--mr-accent);
    border-color: var(--mr-accent);
    color: var(--auth-text-stark);
    padding: 0.75rem 1.5rem;
    font-weight: 500;
    font-size: var(--auth-font-size-base);
    min-height: var(--auth-input-height);
    border-radius: 0.5rem;
    transition: all 0.2s ease;
}

.btn-mr-primary:hover {
    background-color: var(--mr-accent-dark);
    border-color: var(--mr-accent-dark);
    color: var(--auth-text-stark);
    transform: translateY(-1px);
}

.btn-mr-primary:active {
    transform: translateY(0);
}

.btn-mr-outline {
    background: var(--auth-glass-border);
    border: 1px solid var(--auth-feld-linie);
    color: var(--auth-text-stark);
    padding: 0.75rem 1.5rem;
    font-weight: 500;
    font-size: var(--auth-font-size-base);
    min-height: var(--auth-input-height);
    border-radius: 0.5rem;
    transition: all 0.2s ease;
}

.btn-mr-outline:hover {
    background: var(--auth-linie);
    border-color: var(--auth-text-muted);
    color: var(--auth-text-stark);
}

/* Links */
.auth-card a {
    color: var(--auth-text);
    text-decoration: none;
    transition: color 0.2s ease;
}

.auth-card a:hover {
    color: var(--auth-text-stark);
    text-decoration: underline;
}

/* Alerts */
.auth-card .alert {
    border-radius: 0.5rem;
    border: none;
    font-size: calc(var(--auth-font-size-base) * 0.875);
}

.auth-card .alert-danger {
    background: var(--auth-danger-bg);
    color: var(--auth-danger-text);
}

.auth-card .alert-success {
    background: var(--auth-success-bg);
    color: var(--auth-success-text);
}

.auth-card .alert-warning {
    background: var(--auth-warning-bg);
    color: var(--auth-warning-text);
}

.auth-card .alert-info {
    background: var(--auth-info-bg);
    color: var(--auth-info-text);
}

/* Validation */
.auth-card .text-danger {
    color: var(--auth-danger-text) !important;
    font-size: calc(var(--auth-font-size-base) * 0.8);
}

.auth-card .input-validation-error {
    border-color: var(--auth-invalid-border) !important;
}

/* Footer */
.auth-footer {
    padding: 1rem;
    text-align: center;
    color: var(--auth-text-muted);
    font-size: calc(var(--auth-font-size-base) * 0.8);
}

.auth-footer a {
    color: var(--auth-text-sekundaer);
}

/* Card Footer Links */
.auth-card-footer {
    padding: 1rem var(--auth-card-padding);
    border-top: 1px solid var(--auth-glass-border);
    text-align: center;
}

.auth-card-footer a {
    color: var(--auth-text-muted);
    font-size: calc(var(--auth-font-size-base) * 0.8);
    margin: 0 0.75rem;
}

.auth-card-footer a:hover {
    color: var(--auth-text);
}

/* Password Toggle */
.password-toggle {
    position: relative;
}

.password-toggle .form-control {
    padding-right: 3rem;
}

.password-toggle-btn {
    position: absolute;
    right: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    color: var(--auth-text-muted);
    cursor: pointer;
    padding: 0.5rem;
    z-index: 10;
    font-size: var(--auth-font-size-base);
}

.password-toggle-btn:hover {
    color: var(--auth-text);
}

/* MFA Code Input */
.mfa-code-input {
    font-family: 'Courier New', monospace;
    font-size: calc(var(--auth-font-size-base) * 1.5);
    letter-spacing: 0.5rem;
    text-align: center;
    padding: 1rem;
}

/* Icon in Input */
.input-icon {
    position: relative;
}

.input-icon .form-control {
    padding-left: 2.75rem;
}

.input-icon i {
    position: absolute;
    left: 1rem;
    top: 50%;
    transform: translateY(-50%);
    color: var(--auth-text-zart);
    z-index: 10;
    font-size: var(--auth-font-size-base);
}

/* Loading State */
.btn-loading {
    position: relative;
    pointer-events: none;
}

.btn-loading::after {
    content: '';
    position: absolute;
    width: 1.25rem;
    height: 1.25rem;
    top: 50%;
    left: 50%;
    margin-left: -0.625rem;
    margin-top: -0.625rem;
    border: 2px solid transparent;
    border-top-color: var(--auth-text-stark);
    border-radius: 50%;
    animation: spin 0.6s linear infinite;
}

.btn-loading span {
    visibility: hidden;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

/* ============================================
   RESPONSIVE: Mobile (< 576px)
   ============================================ */
@media (max-width: 575.98px) {
    :root {
        --auth-card-padding: 1.5rem;
        --auth-font-size-h1: 1.5rem;
        --auth-logo-height: 32px;
    }

    .auth-card {
        margin: 0 0.5rem;
        border-radius: 0.75rem;
    }

    .auth-card-header {
        padding-bottom: 0.75rem;
    }

    .auth-card-body {
        padding-top: 1rem;
    }

    .auth-card-footer a {
        display: block;
        margin: 0.25rem 0;
    }
}

/* ============================================
   RESPONSIVE: Tablet (768px - 991px)
   ============================================ */
@media (min-width: 768px) and (max-width: 991.98px) {
    :root {
        --auth-card-max-width: 450px;
    }
}

/* ============================================
   RESPONSIVE: Desktop (992px - 1399px)
   ============================================ */
@media (min-width: 992px) and (max-width: 1399.98px) {
    :root {
        --auth-card-max-width: 460px;
        --auth-card-padding: 2.25rem;
    }
}

/* ============================================
   RESPONSIVE: Large Desktop / 1440p (1400px - 2559px)
   ============================================ */
@media (min-width: 1400px) and (max-width: 2559px) {
    :root {
        --auth-card-max-width: 480px;
        --auth-card-padding: 2.5rem;
        --auth-input-height: 3.5rem;
        --auth-font-size-base: 1.0625rem;
        --auth-font-size-h1: 2rem;
        --auth-logo-height: 48px;
    }

    .auth-navbar {
        padding: 1.25rem 0;
    }

    .auth-content {
        padding: 2.5rem 1.5rem;
    }
}

/* ============================================
   RESPONSIVE: 4K / UHD (2560px+)
   ============================================ */
@media (min-width: 2560px) {
    :root {
        --auth-card-max-width: 560px;
        --auth-card-padding: 3rem;
        --auth-input-height: 4rem;
        --auth-logo-height: 56px;
    }

    .auth-navbar {
        padding: 1.5rem 0;
    }

    .auth-content {
        padding: 3rem 2rem;
    }

    .auth-card {
        border-radius: 1.25rem;
        border-width: 2px;
    }

    .auth-card .form-control {
        border-radius: 0.625rem;
    }

    .btn-mr-primary,
    .btn-mr-outline {
        border-radius: 0.625rem;
        padding: 1rem 2rem;
    }

    .auth-footer {
        padding: 1.5rem;
    }

    .password-toggle-btn {
        right: 1rem;
        padding: 0.625rem;
    }

    .input-icon .form-control {
        padding-left: 3.25rem;
    }

    .input-icon i {
        left: 1.25rem;
    }

    .mfa-code-input {
        font-size: 2rem;
        letter-spacing: 0.75rem;
        padding: 1.25rem;
    }

    .auth-card .alert {
        border-radius: 0.625rem;
        padding: 1rem 1.25rem;
    }

    .auth-card .form-check-input {
        width: 1.5em;
        height: 1.5em;
    }
}

/* ============================================
   RESPONSIVE: 5K / Extreme (3840px+)
   ============================================ */
@media (min-width: 3840px) {
    :root {
        --auth-card-max-width: 700px;
        --auth-card-padding: 4rem;
        --auth-input-height: 5rem;
        --auth-font-size-base: 1.5rem;
        --auth-font-size-h1: 3rem;
        --auth-logo-height: 72px;
    }

    .auth-navbar {
        padding: 2rem 0;
    }

    .auth-content {
        padding: 4rem 3rem;
    }

    .auth-card {
        border-radius: 1.5rem;
    }

    .auth-card .form-control {
        border-radius: 0.75rem;
    }

    .btn-mr-primary,
    .btn-mr-outline {
        border-radius: 0.75rem;
        padding: 1.25rem 2.5rem;
    }

    .auth-footer {
        padding: 2rem;
    }

    .mfa-code-input {
        font-size: 2.5rem;
        letter-spacing: 1rem;
        padding: 1.5rem;
    }

    .btn-loading::after {
        width: 1.75rem;
        height: 1.75rem;
        margin-left: -0.875rem;
        margin-top: -0.875rem;
        border-width: 3px;
    }
}

/* ============================================================
   Login
   ============================================================ */

.lw-auth-kopf {
    padding-bottom: 0.5rem;
}

.lw-auth-kachel {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 4rem;
    height: 4rem;
    margin-bottom: 1rem;
    border-radius: 1rem;
    background-color: var(--auth-lw-akzent-dunkel);
    box-shadow: 0 2px 10px var(--auth-kachel-schatten);
}

.lw-auth-kachel img {
    width: 2.5rem;
    height: 2.5rem;
}

.lw-auth-kopf h1 {
    letter-spacing: 0.08em;
    text-transform: uppercase;
    font-size: 1.35rem;
}

.lw-auth-kopf p {
    font-size: 1rem;
    color: var(--auth-text-kachel);
}

.lw-auth-registrierung {
    margin-top: 1.25rem;
    padding-top: 1rem;
    border-top: 1px solid var(--auth-kachel-linie);
    text-align: center;
    font-size: 0.9rem;
    color: var(--auth-text-sekundaer);
}

.lw-auth-registrierung a {
    display: inline-block;
    margin-left: 0.35rem;
    font-weight: 600;
    color: var(--auth-lw-akzent);
    text-decoration: none;
}

.lw-auth-registrierung a:hover,
.lw-auth-registrierung a:focus {
    color: var(--auth-lw-akzent-hell);
    text-decoration: underline;
}

/* ============================================================
   SelectTenant
   ============================================================ */

/* Tenant Selection Styles */
.tenant-list {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.tenant-item {
    display: block;
    cursor: pointer;
    margin: 0;
}

.tenant-radio {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.tenant-content {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.25rem;
    background: var(--auth-flaeche-leicht);
    border: 2px solid var(--auth-glass-border);
    border-radius: 0.75rem;
    transition: all 0.2s ease;
}

.tenant-item:hover .tenant-content {
    background: var(--auth-linie-zart);
    border-color: var(--auth-linie);
}

.tenant-radio:checked ~ .tenant-content {
    background: var(--auth-akzent-flaeche);
    border-color: var(--mr-accent);
}

.tenant-radio:focus ~ .tenant-content {
    box-shadow: 0 0 0 0.2rem var(--auth-focus-ring);
}

.tenant-icon {
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--auth-glass-border);
    border-radius: 0.5rem;
    color: var(--auth-text-sekundaer);
    font-size: 1.25rem;
    flex-shrink: 0;
    transition: all 0.2s ease;
}

.tenant-radio:checked ~ .tenant-content .tenant-icon {
    background: var(--mr-accent);
    color: var(--auth-text-stark);
}

.tenant-info {
    flex-grow: 1;
    min-width: 0;
}

.tenant-name {
    font-weight: 600;
    color: var(--auth-text-stark);
    font-size: 1rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.tenant-code {
    font-size: 0.8125rem;
    color: var(--auth-text-muted);
    margin-top: 0.125rem;
}

.tenant-badge {
    padding: 0.25rem 0.625rem;
    background: var(--mr-accent);
    color: var(--auth-text-stark);
    font-size: 0.6875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-radius: 1rem;
    flex-shrink: 0;
}

.tenant-check {
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid var(--auth-linie);
    border-radius: 50%;
    color: transparent;
    flex-shrink: 0;
    transition: all 0.2s ease;
}

.tenant-radio:checked ~ .tenant-content .tenant-check {
    background: var(--mr-accent);
    border-color: var(--mr-accent);
    color: var(--auth-text-stark);
}

.tenant-check i {
    font-size: 0.75rem;
}

/* Current tenant indicator */
.tenant-item-current .tenant-content {
    background: var(--auth-akzent-flaeche-zart);
}

/* User info section */
.user-info {
    padding-top: 1rem;
    border-top: 1px solid var(--auth-glass-border);
}

/* Responsive adjustments */
@media (max-width: 575.98px) {
    .tenant-content {
        padding: 0.875rem 1rem;
        gap: 0.75rem;
    }

    .tenant-icon {
        width: 40px;
        height: 40px;
        font-size: 1rem;
    }

    .tenant-name {
        font-size: 0.9375rem;
    }

    .tenant-badge {
        font-size: 0.625rem;
        padding: 0.1875rem 0.5rem;
    }
}

@media (min-width: 1400px) {
    .tenant-content {
        padding: 1.25rem 1.5rem;
    }

    .tenant-icon {
        width: 56px;
        height: 56px;
        font-size: 1.5rem;
    }

    .tenant-name {
        font-size: 1.0625rem;
    }
}

@media (min-width: 2560px) {
    .tenant-content {
        padding: 1.5rem 2rem;
        border-radius: 1rem;
    }

    .tenant-icon {
        width: 64px;
        height: 64px;
        font-size: 1.75rem;
        border-radius: 0.75rem;
    }

    .tenant-name {
        font-size: 1.125rem;
    }

    .tenant-code {
        font-size: 0.9375rem;
    }

    .tenant-check {
        width: 28px;
        height: 28px;
    }
}

/* ============================================================
   Rechtstexte (.auth-legal)
   ============================================================ */

/* Legal pages: Scroll statt vertikaler Zentrierung */
.auth-legal .auth-content { align-items: flex-start; padding-top: 1rem; }

.legal-card {
    width: 100%;
    max-width: 860px;
    margin: 0 auto;
    background: var(--auth-glass-bg);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-radius: 1rem;
    border: 1px solid var(--auth-glass-border);
    overflow: hidden;
}
.legal-header {
    padding: 2rem 2.5rem 1.25rem;
    border-bottom: 1px solid var(--auth-linie-zart);
}
.legal-header h1 {
    font-size: 1.6rem;
    font-weight: 700;
    color: var(--auth-text-stark);
    margin: 0 0 0.35rem;
}
.legal-header .legal-meta {
    font-size: 0.8rem;
    color: var(--auth-text-zart);
    margin: 0;
}
.legal-body {
    padding: 1.5rem 2.5rem 2rem;
}
.legal-section {
    margin-bottom: 1.75rem;
}
.legal-section:last-child { margin-bottom: 0; }
.legal-section h2 {
    font-size: 1.05rem;
    font-weight: 600;
    color: var(--auth-text-ueberschrift);
    margin: 0 0 0.6rem;
    padding-left: 0.75rem;
    border-left: 3px solid var(--mr-accent);
}
.legal-section h3 {
    font-size: 0.925rem;
    font-weight: 600;
    color: var(--auth-text-hervor);
    margin: 1rem 0 0.4rem;
}
.legal-section p {
    font-size: 0.875rem;
    line-height: 1.75;
    color: var(--auth-text-fliess);
    margin-bottom: 0.6rem;
}
.legal-section ul {
    padding-left: 1.25rem;
    margin-bottom: 0.6rem;
}
.legal-section li {
    font-size: 0.875rem;
    line-height: 1.65;
    color: var(--auth-text-fliess);
    margin-bottom: 0.25rem;
}
.legal-section strong {
    color: var(--auth-text-hervor);
}
.legal-section a {
    color: var(--mr-accent-light);
    text-decoration: none;
    transition: color 0.2s;
}
.legal-section a:hover {
    color: var(--auth-text-stark);
    text-decoration: underline;
}
.legal-footer {
    padding: 1rem 2.5rem;
    border-top: 1px solid var(--auth-linie-zart);
    text-align: center;
}
.legal-footer a {
    color: var(--auth-text-muted);
    font-size: 0.825rem;
    text-decoration: none;
    transition: color 0.2s;
}
.legal-footer a:hover { color: var(--auth-text-stark); }

.legal-contact-block {
    background: var(--auth-flaeche-zart);
    border: 1px solid var(--auth-flaeche-weich);
    border-radius: 0.5rem;
    padding: 1rem 1.25rem;
    margin: 0.5rem 0;
}

@media (max-width: 575.98px) {
    .legal-header, .legal-body, .legal-footer { padding-left: 1.25rem; padding-right: 1.25rem; }
    .legal-header h1 { font-size: 1.35rem; }
    .legal-card { border-radius: 0.75rem; margin: 0 0.25rem; }
}