/* Shared by the startup shell and JavaScript-owned media inside Blazor. */
.login-design { position: relative; overflow: hidden; isolation: isolate; }
.login-design::before, .login-design::after { display: none; }
.login-video-host, .login-background-video { position: absolute; inset: 0; width: 100%; height: 100%; }
.login-video-host { z-index: 0; }
.login-background-video { object-fit: cover; }
.login-color-layer { position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.login-image-layer { position: absolute; inset: 0; display: flex; padding: 2rem; z-index: 2; pointer-events: none; }
.login-image-layer img { max-width: 85%; max-height: 85%; width: auto; height: auto; object-fit: contain; }
.login-startup .loading-progress { margin: 0 auto; }
.login-startup .loading-progress-text { position: relative; top: auto; }
.login-video-action { position: absolute; bottom: 1.5rem; left: 50%; transform: translateX(-50%); z-index: 3; color: #fff; text-align: center; }
button.login-video-action { color: #122227; }
.auth-login-fullscreen { position: relative; min-height: 100dvh; background: #000; padding: 32px 24px; isolation: isolate; }
.auth-login-fullscreen > .auth-form-side { background: transparent; width: 100%; padding: 0; min-height: 0; z-index: 2; }
.auth-login-fullscreen .auth-container { margin: auto; }
.auth-login-fullscreen .auth-card {
    color-scheme: light;
    --default-color: #000;
    --heading-color: #000;
    --muted-color: #000;
    --light-color: #000;
    --input-bg: #fff;
    --surface-color: #fff;
    --background-color: #fff;
    color: #000;
}
.auth-login-fullscreen .auth-card .form-control { color: #000; background-color: #fff; }
.auth-login-fullscreen .auth-card .auth-link { color: #000; }
.auth-login-fullscreen .auth-card .btn-outline-secondary {
    --bs-btn-color: #000;
    --bs-btn-hover-color: #000;
    --bs-btn-active-color: #000;
    --bs-btn-disabled-color: #000;
}
.auth-tenant-logo { display: flex; justify-content: center; width: 100%; margin-bottom: 16px; }
.auth-tenant-logo img { width: var(--tenant-logo-width, 120px); height: auto; max-width: 100%; max-height: var(--tenant-logo-max-height, 64px); object-fit: contain; }
.auth-login-fullscreen > .login-fullscreen-background { position: fixed; inset: 0; display: block; width: 100%; height: 100%; padding: 0; background: #000; z-index: -1; }
.auth-corner-logo { position: fixed; top: 24px; left: 24px; max-width: calc(100% - 100px); z-index: 3; }
.auth-corner-logo img { width: 100%; height: auto; object-fit: contain; object-position: left top; }
.auth-login-fullscreen .footer-copyright { color: #fff; }
.auth-login-fullscreen .footer-centered { position: absolute; left: 0; right: 0; bottom: 8px; margin: 0; padding: 0; }
.auth-login-fullscreen .otp-card { padding: 0; }
.auth-otp-screen .auth-container { max-width: 400px; }
.auth-otp-screen .auth-card { padding: 20px 24px; }
.auth-otp-screen .footer-centered { position: static; margin-top: 12px; }
@media (max-width: 575px) {
    .auth-otp-screen .auth-card { padding: 16px; }
}
.auth-login-fullscreen .otp-card .btn-primary:disabled { color: var(--heading-color, #172a31); background: var(--surface-color, #fff); opacity: .65; }
@media (max-width: 575px) {
    .auth-login-fullscreen { padding: 110px 16px 24px; }
    .auth-corner-logo { top: 16px; left: 16px; max-width: min(45vw, calc(100% - 100px)); }
}
