/* LOGIN GUEST THEME FINAL - loaded after theme-system and inline brand styles */

html:has(body .guest-shell),
html:has(body .guest-shell) body {
    width: 100% !important;
    min-width: 100% !important;
    min-height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: hidden !important;
}

body:has(.guest-shell) {
    display: block !important;
}

.guest-shell {
    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    min-width: 100vw !important;
    max-width: none !important;
    height: 100dvh !important;
    min-height: 100dvh !important;
    margin: 0 !important;
    padding: 18px !important;
    overflow: auto !important;
    display: grid !important;
    place-items: center !important;
    box-sizing: border-box !important;
}

.guest-shell::before,
.guest-shell::after {
    display: none !important;
    content: none !important;
    background: transparent !important;
}

/* LIGHT */
html[data-theme="light"] body:has(.guest-shell),
html[data-theme="light"] .guest-shell,
body[data-theme="light"]:has(.guest-shell) {
    background:
        radial-gradient(circle at 18% 18%, rgba(157, 173, 131, .20), transparent 30%),
        radial-gradient(circle at 84% 18%, rgba(65, 191, 229, .12), transparent 32%),
        radial-gradient(circle at 50% 78%, rgba(157, 173, 131, .10), transparent 34%),
        linear-gradient(135deg, #f7f8f3 0%, #eef3e4 48%, #eaf6f2 100%) !important;
    color-scheme: light !important;
}

/* DARK - no var(--bg), because brand/theme CSS may keep it light */
html[data-theme="dark"] body:has(.guest-shell),
html[data-theme="dark"] .guest-shell,
body[data-theme="dark"]:has(.guest-shell) {
    background:
        radial-gradient(circle at 18% 18%, rgba(167, 184, 141, .10), transparent 30%),
        radial-gradient(circle at 84% 18%, rgba(65, 191, 229, .08), transparent 32%),
        radial-gradient(circle at 50% 78%, rgba(157, 173, 131, .06), transparent 34%),
        linear-gradient(135deg, #070b14 0%, #0b1020 46%, #111827 100%) !important;
    color-scheme: dark !important;
}

html[data-theme="dark"] .milaro-login-page,
html[data-theme="dark"] .login-card,
html[data-theme="dark"] .auth-card,
html[data-theme="dark"] .login-box,
html[data-theme="dark"] .auth-box {
    background: rgba(23, 32, 51, .97) !important;
    color: #f8fafc !important;
    border-color: rgba(255, 255, 255, .12) !important;
    box-shadow: 0 30px 90px rgba(0, 0, 0, .34) !important;
}

html[data-theme="light"] .milaro-login-page,
html[data-theme="light"] .login-card,
html[data-theme="light"] .auth-card,
html[data-theme="light"] .login-box,
html[data-theme="light"] .auth-box {
    background: rgba(255, 255, 255, .96) !important;
    color: #172033 !important;
    border-color: rgba(157, 173, 131, .30) !important;
    box-shadow: 0 26px 70px rgba(15, 23, 42, .14) !important;
}

.guest-shell > .milaro-login-page,
.guest-shell > .login-card,
.guest-shell > .auth-card,
.guest-shell > .login-box,
.guest-shell > .auth-box {
    margin: 0 auto !important;
    position: relative !important;
    z-index: 2 !important;
}