/* Shared visual treatment for login, verification and password screens. */
body.mo-auth {
    --primary: #c7051b;
    --primary-dark: #a80417;
    --card-bg: #fff;
    --border: #dce4ef;
    --text-primary: #172b46;
    --text-secondary: #62748b;
    --text-muted: #728399;
    background: #f3f6fb;
    color: #172b46;
    font-family: 'Inter', 'Segoe UI', system-ui, sans-serif;
    min-height: 100vh;
    min-height: 100dvh;
    height: auto;
    overflow-y: auto;
    -webkit-font-smoothing: antialiased;
}
.mo-auth :is(input,button) { font-family: inherit; }
.mo-auth .left-panel { background: linear-gradient(155deg, #102746, #173e61); min-height: 100vh; }
.mo-auth .left-panel::before, .mo-auth .left-panel::after { opacity: .5; }
.mo-auth .left-brand { padding: 12px 16px; border: 1px solid #ffffff30; border-radius: 12px; background: #fff; }
.mo-auth .left-brand .mediocean-brand { color: #172b46 !important; }
.mo-auth .left-title { letter-spacing: -.035em; line-height: 1.2; }
.mo-auth .left-tagline span { color: #ff9eaa; }
.mo-auth .feature-icon { color: #ff9eaa; background: #c7051b26; }
.mo-auth .feature-chip { border-radius: 12px; background: #ffffff08; border-color: #ffffff1c; box-shadow: none; }
.mo-auth .right-panel { background: #f3f6fb; min-height: 100vh; padding: 40px 30px; }
.mo-auth .login-box { max-width: 450px; background: #fff; padding: 36px; border: 1px solid #dfe7f1; border-radius: 20px; box-shadow: 0 16px 60px #17334e09; }
.mo-auth .login-logo { margin-bottom: 24px; }
.mo-auth .login-welcome { font-size: 27px; font-weight: 650; letter-spacing: -.035em; color: #172b46; }
.mo-auth .login-hint { color: #728399; font-size: 13px; margin-top: 8px; margin-bottom: 30px; }
.mo-auth .form-label { font-size: 12px; color: #405774; font-weight: 600; }
.mo-auth .form-control { background: #fff; color: #243c59; border: 1px solid #d8e1ee; border-radius: 9px; min-height: 46px; font-size: 14px; box-shadow: 0 1px 2px #17334e04; }
.mo-auth .form-control:focus { background: #fff; color: #243c59; border-color: #db7d89; box-shadow: 0 0 0 3px #c7051b12; }
.mo-auth .form-control::placeholder { color: #8797ac; }
.mo-auth .btn-login { background: #c7051b; border-radius: 9px; min-height: 46px; font-size: 14px; box-shadow: 0 3px 7px #c7051b15; }
.mo-auth .btn-login:hover:not(:disabled) { background: #a80417; box-shadow: 0 4px 10px #c7051b18; transform: none; }
.mo-auth .forgot-link a { color: #c7051b; }
.mo-auth .login-container { width: 100%; background: #f3f6fb; padding: 32px 16px; }
.mo-auth .login-container::before { background: radial-gradient(ellipse at top, #fbe4e7, transparent 65%); animation: none; }
.mo-auth .login-card { background: #fff; border: 1px solid #dfe7f1; border-radius: 20px; box-shadow: 0 16px 60px #17334e09; }
.mo-auth .login-title { color: #172b46; background: none; -webkit-text-fill-color: #172b46; letter-spacing: -.025em; }
.mo-auth .login-subtitle { color: #62748b; }
.mo-auth :focus-visible { outline: 3px solid #d96a78; outline-offset: 3px; }
@media (max-width: 575.98px) {
    .mo-auth .right-panel { padding: 32px 24px; background: #fff; }
    .mo-auth .login-box { border: 0; box-shadow: none; border-radius: 0; padding: 0; }
    .mo-auth .login-card { padding: 28px 20px; }
    .mo-auth .form-control { font-size: 16px; }
}
@media (max-width: 359.98px) { .mo-auth .recaptcha-wrap .g-recaptcha { transform: scale(.85); } }
@media (max-width: 359.98px) { .mo-auth .login-card .g-recaptcha { transform: scale(.8); transform-origin: center top; } }
@media (prefers-reduced-motion: reduce) {
    .mo-auth *, .mo-auth *::before, .mo-auth *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}