/* SDB — Admin Experience | Login v1.2.15
   Login-only institutional layer aligned with DS 4.8.3. Consumes login/admin/foundation tokens with local fallbacks. */

:root {
    --sdb-ae-login-bg: var(--sdb-login-bg, var(--sdb-admin-bg, var(--sdb-color-surface-high, var(--sdb-color-background, #F5F8FB))));
    --sdb-ae-login-card-bg: var(--sdb-login-card-bg, var(--sdb-admin-surface, var(--sdb-color-surface-lowest, var(--sdb-color-surface, #FFFFFF))));
    --sdb-ae-login-card-border: var(--sdb-login-card-border, var(--sdb-admin-border, var(--sdb-color-outline-variant, var(--sdb-color-border, #EEF3F8))));
    --sdb-ae-login-card-radius: var(--sdb-login-card-radius, var(--sdb-admin-card-radius, var(--sdb-shape-lg, var(--sdb-radius-lg, 16px))));
    --sdb-ae-login-card-shadow: var(--sdb-login-card-shadow, var(--sdb-elevation-2, var(--sdb-shadow-card, 0 10px 24px rgba(31, 42, 54, .08))));
    --sdb-ae-login-logo-width: var(--sdb-login-logo-width, 280px);
    --sdb-ae-login-text: var(--sdb-login-text, var(--sdb-admin-text, var(--sdb-color-on-surface-muted, var(--sdb-color-text, #6B7785))));
    --sdb-ae-login-heading: var(--sdb-admin-heading, var(--sdb-color-on-surface, var(--sdb-color-title, #364048)));
    --sdb-ae-login-muted: var(--sdb-login-muted, var(--sdb-admin-muted, var(--sdb-color-muted, #8E9AA7)));
    --sdb-ae-login-link: var(--sdb-login-link, var(--sdb-admin-primary, var(--sdb-color-primary, #0058B7)));
    --sdb-ae-login-link-hover: var(--sdb-login-link-hover, var(--sdb-color-secondary, #009BD8));
    --sdb-ae-login-link-soft: var(--sdb-state-selected-bg, rgba(0, 88, 183, .085));
    --sdb-ae-login-link-hover-soft: var(--sdb-state-hover-bg, rgba(0, 155, 216, .10));
    --sdb-ae-login-brand-gradient: var(--sdb-login-brand-gradient, linear-gradient(135deg, var(--sdb-admin-primary, var(--sdb-color-primary, #0058B7)), var(--sdb-color-secondary, #009BD8)));
    --sdb-ae-login-button-bg: var(--sdb-login-button-bg, var(--sdb-admin-primary, var(--sdb-color-primary, #0058B7)));
    --sdb-ae-login-button-hover-bg: var(--sdb-login-button-hover-bg, var(--sdb-color-secondary, #009BD8));
    --sdb-ae-login-button-text: var(--sdb-color-on-primary, #FFFFFF);
    --sdb-ae-login-focus: var(--sdb-login-focus, var(--sdb-focus-ring, var(--sdb-state-focus-ring, 0 0 0 3px rgba(0, 155, 216, .22))));
    --sdb-ae-login-radius: var(--sdb-shape-md, var(--sdb-radius-md, 10px));
    --sdb-ae-login-radius-pill: var(--sdb-shape-pill, var(--sdb-radius-pill, 999px));
    --sdb-ae-login-space-sm: var(--sdb-responsive-gap-sm, var(--sdb-space-sm, .75rem));
    --sdb-ae-login-space-md: var(--sdb-responsive-gap-md, var(--sdb-space-md, 1.25rem));
    --sdb-ae-login-form-padding: var(--sdb-modal-padding, clamp(16px, 2.4vw, 24px));
    --sdb-ae-login-touch-target: var(--sdb-touch-target-min, 44px);
    --sdb-ae-login-transition: var(--sdb-interactive-transition, var(--sdb-motion-safe-transition, background-color 180ms ease, color 180ms ease, border-color 180ms ease, box-shadow 180ms ease));
    --sdb-ae-login-font-body: var(--sdb-font-body, Archivo, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif);
    --sdb-ae-login-font-heading: var(--sdb-font-heading, "Neo Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif);
}

body.login {
    min-height: 100%;
    background:
        radial-gradient(circle at 18% 12%, var(--sdb-ae-login-link-hover-soft), transparent 22rem),
        radial-gradient(circle at 88% 0%, var(--sdb-ae-login-link-soft), transparent 26rem),
        linear-gradient(180deg, var(--sdb-ae-login-card-bg) 0%, var(--sdb-ae-login-bg) 78%);
    color: var(--sdb-ae-login-text);
    font-family: var(--sdb-ae-login-font-body);
}

.login h1 {
    margin-bottom: var(--sdb-ae-login-space-md);
}

.login h1 a {
    width: var(--sdb-ae-login-logo-width);
    height: calc(var(--sdb-ae-login-touch-target) * 2);
    min-height: calc(var(--sdb-ae-login-touch-target) * 2);
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    margin: 0 auto var(--sdb-ae-login-space-md);
}

.login form:not(#language-switcher) {
    position: relative;
    overflow: hidden;
    border: 1px solid var(--sdb-ae-login-card-border);
    border-radius: var(--sdb-ae-login-card-radius);
    box-shadow: var(--sdb-ae-login-card-shadow);
    background: var(--sdb-ae-login-card-bg);
    padding: var(--sdb-ae-login-form-padding);
}

.login form:not(#language-switcher)::before {
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: var(--sdb-admin-dashboard-accent-width, 4px);
    background: var(--sdb-ae-login-brand-gradient);
}

.login label,
.login .forgetmenot label {
    color: var(--sdb-ae-login-text);
    font-size: var(--sdb-type-body-sm-size, .925rem);
}

.login input[type="text"],
.login input[type="password"],
.login input[type="email"],
.login select {
    min-height: var(--sdb-ae-login-touch-target);
    border-radius: var(--sdb-ae-login-radius);
    border-color: var(--sdb-ae-login-card-border);
    color: var(--sdb-ae-login-heading);
    background: var(--sdb-ae-login-card-bg);
    box-shadow: none;
    transition: var(--sdb-ae-login-transition);
}

.login input[type="text"]:focus,
.login input[type="password"]:focus,
.login input[type="email"]:focus,
.login select:focus {
    border-color: var(--sdb-ae-login-link);
    box-shadow: var(--sdb-ae-login-focus);
    outline: 2px solid transparent;
}

.login .button.wp-hide-pw {
    color: var(--sdb-ae-login-link);
}

.login input[type="checkbox"] {
    border-color: var(--sdb-ae-login-muted);
    box-shadow: none;
}

.login input[type="checkbox"]:checked::before {
    filter: hue-rotate(175deg) saturate(1.4);
}

body.login .wp-core-ui .button,
body.login .wp-core-ui .button-secondary,
body.login .language-switcher .button {
    min-height: var(--sdb-ae-login-touch-target);
    border-radius: var(--sdb-ae-login-radius-pill);
    border-color: var(--sdb-ae-login-card-border);
    color: var(--sdb-ae-login-link);
    background: var(--sdb-ae-login-card-bg);
    box-shadow: none;
    transition: var(--sdb-ae-login-transition);
}

body.login .wp-core-ui .button:hover,
body.login .wp-core-ui .button-secondary:hover,
body.login .language-switcher .button:hover {
    border-color: var(--sdb-ae-login-link);
    background: var(--sdb-ae-login-bg);
    color: var(--sdb-ae-login-link);
}

body.login .wp-core-ui .button-primary,
body.login .wp-core-ui .button-primary.focus,
body.login .wp-core-ui .button-primary:focus {
    background: var(--sdb-ae-login-brand-gradient);
    border-color: var(--sdb-ae-login-button-bg);
    color: var(--sdb-ae-login-button-text);
    border-radius: var(--sdb-ae-login-radius-pill);
    box-shadow: var(--sdb-ae-login-card-shadow);
}

body.login .wp-core-ui .button-primary:hover,
body.login .wp-core-ui .button-primary:active {
    background: var(--sdb-ae-login-button-hover-bg);
    border-color: var(--sdb-ae-login-button-hover-bg);
    color: var(--sdb-ae-login-button-text);
}

.login #nav,
.login #backtoblog,
.privacy-policy-page-link {
    color: var(--sdb-ae-login-muted);
}

.login #nav a,
.login #backtoblog a,
.privacy-policy-page-link a,
.login a {
    color: var(--sdb-ae-login-link);
    text-decoration: none;
}

.login #nav a:hover,
.login #backtoblog a:hover,
.privacy-policy-page-link a:hover,
.login a:hover {
    color: var(--sdb-ae-login-link-hover);
}

.language-switcher {
    width: auto;
    max-width: 100%;
    margin: var(--sdb-ae-login-space-md) auto 0;
    padding: 0;
    background: transparent;
    border: 0;
    box-shadow: none;
    text-align: center;
}

.login form#language-switcher {
    width: fit-content;
    max-width: calc(100vw - var(--sdb-ae-login-space-md));
    margin: 0 auto;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--sdb-ae-login-space-sm);
}

.login form#language-switcher select,
.login form#language-switcher .button {
    height: var(--sdb-ae-login-touch-target);
    margin: 0;
}

.login form#language-switcher select {
    min-width: min(100%, 220px);
    max-width: 100%;
}

.login form#language-switcher .button {
    padding: 0 var(--sdb-ae-login-space-md);
}

.language-switcher label .dashicons {
    color: var(--sdb-ae-login-text);
}

@media (max-width: 480px) {
    .login form:not(#language-switcher) {
        margin-left: var(--sdb-ae-login-space-sm);
        margin-right: var(--sdb-ae-login-space-sm);
    }

    .login h1 a {
        width: min(240px, var(--sdb-ae-login-logo-width));
    }

    .login form#language-switcher {
        display: flex;
        flex-wrap: wrap;
    }
}