/**
 * Aurora auth — Brandbook 1.1.0-aurora
 *
 * Token copy so Sprint 2 works without Sprint 1 / d4b-horizon.css.
 * Do not invent hex. Brand teal is identity; voltage is the primary CTA.
 * Hairlines before shadows. Mesh lives only on the split-layout hero panel.
 */

:root {
    /* brand */
    --aurora-brand: #0F4C5C;
    --aurora-brand-deep: #0A3642;
    --aurora-brand-mid: #1A6B7D;

    /* voltage */
    --aurora-voltage: #4F46E5;
    --aurora-voltage-deep: #3730A3;
    --aurora-voltage-soft: #818CF8;
    --aurora-voltage-wash: #EEF2FF;

    /* ink */
    --aurora-ink: #0D1B24;
    --aurora-ink-mid: #243542;
    --aurora-ink-muted: #64748B;

    /* canvas */
    --aurora-canvas: #F0F5FA;
    --aurora-canvas-warm: #F7F8F5;
    --aurora-canvas-white: #FFFFFF;

    /* hairline + radius */
    --aurora-hairline: #E3E8EE;
    --aurora-radius-sm: 8px;
    --aurora-radius-md: 12px;
    --aurora-radius-lg: 16px;
    --aurora-radius-pill: 999px;

    --aurora-font: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

    /* keep existing d4b-* consumers (2FA views) on Aurora tokens */
    --d4b-navy: #0F4C5C;
    --d4b-teal: #1A6B7D;
    --d4b-cyan: #1A6B7D;
    --d4b-muted: #64748B;
    --d4b-ink: #0D1B24;
    --d4b-canvas: #F0F5FA;
    --d4b-card: #FFFFFF;
}

/* -------------------------------------------------------------------------- */
/* Page                                                                      */
/* -------------------------------------------------------------------------- */

body.aurora-auth-page,
body.d4b-auth-page {
    min-height: 100vh;
    margin: 0;
    background: var(--aurora-canvas) !important;
    color: var(--aurora-ink);
    font-family: var(--aurora-font);
}

.aurora-auth-page h1,
.aurora-auth-page h2,
.aurora-auth-page .d4b-title,
.aurora-auth-page .d4b-wordmark,
.aurora-auth-page .aurora-wordmark,
.d4b-auth-page h1,
.d4b-auth-page .d4b-title,
.d4b-auth-page .d4b-wordmark {
    font-family: var(--aurora-font);
}

/* -------------------------------------------------------------------------- */
/* Split: Marketing Light hero + Cabinet form                                */
/* -------------------------------------------------------------------------- */

.aurora-auth-split,
.d4b-auth-split {
    position: relative;
    display: flex;
    min-height: 100vh;
    width: 100%;
    background: var(--aurora-canvas);
}

.aurora-auth-split.rtl,
.d4b-auth-split.rtl {
    direction: rtl;
}

.aurora-auth-stage,
.d4b-auth-stage {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    width: 100%;
    padding: 24px 20px 16px;
}

@media (min-width: 992px) {
    .aurora-auth-stage,
    .d4b-auth-stage {
        width: 52%;
        padding: 32px 40px 24px 56px;
    }

    .aurora-auth-split.rtl .aurora-auth-stage,
    .d4b-auth-split.rtl .d4b-auth-stage {
        padding: 32px 56px 24px 40px;
    }
}

/* -------------------------------------------------------------------------- */
/* Hero — mesh ONLY here                                                     */
/* -------------------------------------------------------------------------- */

.aurora-auth-hero,
.d4b-auth-hero {
    display: none;
}

@media (min-width: 992px) {
    .aurora-auth-hero,
    .d4b-auth-hero {
        display: block;
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        z-index: 1;
        width: 48vw;
        min-height: 100%;
        padding: 20px 20px 20px 0;
    }

    .aurora-auth-split.rtl .aurora-auth-hero,
    .d4b-auth-split.rtl .d4b-auth-hero {
        right: auto;
        left: 0;
        padding: 20px 0 20px 20px;
    }
}

.aurora-auth-hero-inner,
.d4b-auth-hero-inner {
    position: absolute;
    inset: 20px 20px 20px 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-end;
    overflow: hidden;
    padding: 40px 44px;
    background-color: var(--aurora-canvas-warm);
    border: 1px solid var(--aurora-hairline);
    border-radius: var(--aurora-radius-lg);
}

.aurora-auth-split.rtl .aurora-auth-hero-inner,
.d4b-auth-split.rtl .d4b-auth-hero-inner {
    inset: 20px 0 20px 20px;
}

/*
 * Marketing Light mesh — brandbook hex only.
 * #0F4C5C = rgb(15, 76, 92)
 * #1A6B7D = rgb(26, 107, 125)
 * #4F46E5 = rgb(79, 70, 229)
 * #818CF8 = rgb(129, 140, 248)
 */
.aurora-auth-hero-inner::before,
.d4b-auth-hero-inner::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background-image:
        radial-gradient(ellipse 70% 55% at 12% 18%, rgba(15, 76, 92, 0.16), transparent 58%),
        radial-gradient(ellipse 55% 45% at 88% 22%, rgba(79, 70, 229, 0.14), transparent 56%),
        radial-gradient(ellipse 60% 50% at 78% 82%, rgba(26, 107, 125, 0.18), transparent 60%),
        radial-gradient(ellipse 40% 35% at 28% 78%, #EEF2FF, transparent 70%),
        radial-gradient(ellipse 30% 25% at 52% 42%, rgba(129, 140, 248, 0.22), transparent 62%);
    z-index: 0;
}

.aurora-auth-hero-inner[style*="--d4b-hero-image"]::after,
.d4b-auth-hero-inner[style*="--d4b-hero-image"]::after,
.aurora-auth-hero-inner[style*="--aurora-hero-image"]::after {
    content: "";
    position: absolute;
    inset: 0;
    background-image: var(--d4b-hero-image, var(--aurora-hero-image));
    background-size: cover;
    background-position: center;
    opacity: 0.18;
    z-index: 0;
}

.aurora-auth-hero-mark,
.d4b-auth-hero-mark {
    position: relative;
    z-index: 1;
    color: var(--aurora-brand);
    font-size: 56px;
    font-weight: 800;
    letter-spacing: 0.06em;
    line-height: 1;
}

.aurora-auth-hero-mark span,
.d4b-auth-hero-mark span {
    color: var(--aurora-voltage);
}

.aurora-auth-hero-kicker {
    position: relative;
    z-index: 1;
    margin-bottom: 12px;
    color: var(--aurora-brand-mid);
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

/* -------------------------------------------------------------------------- */
/* Centered cabinet (theme 2)                                                */
/* -------------------------------------------------------------------------- */

.aurora-auth-centered,
.d4b-auth-centered {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    padding: 24px 16px 16px;
    background: var(--aurora-canvas);
}

.aurora-auth-centered .aurora-auth-content,
.d4b-auth-centered .d4b-auth-content {
    justify-content: center;
    padding: 8px 0 32px;
}

/* -------------------------------------------------------------------------- */
/* Toolbar + wordmark                                                        */
/* -------------------------------------------------------------------------- */

.aurora-auth-toolbar,
.d4b-auth-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 24px;
    position: relative;
    z-index: 9;
}

.aurora-wordmark,
.d4b-wordmark {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--aurora-brand);
    font-size: 28px;
    font-weight: 800;
    letter-spacing: 0.06em;
    line-height: 1;
    text-decoration: none !important;
}

.aurora-wordmark .d4b-wordmark__mark,
.d4b-wordmark .d4b-wordmark__mark {
    display: block;
    width: 28px;
    height: 28px;
    flex-shrink: 0;
}

.aurora-wordmark .d4b-wordmark__accent,
.d4b-wordmark .d4b-wordmark__accent {
    color: var(--aurora-voltage);
}

.aurora-wordmark:hover,
.d4b-wordmark:hover {
    color: var(--aurora-brand-deep);
}

/* -------------------------------------------------------------------------- */
/* Language switcher — compact dropdown, hide list until open                */
/* Live bug: if this CSS 404s, every language dumps as a visible list.       */
/* -------------------------------------------------------------------------- */

.aurora-lang,
.d4b-lang {
    position: relative;
    display: inline-flex;
    flex-shrink: 0;
}

.aurora-lang .dropdown-toggle,
.d4b-lang .dropdown-toggle {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--aurora-canvas-white) !important;
    border: 1px solid var(--aurora-hairline) !important;
    border-radius: var(--aurora-radius-pill) !important;
    box-shadow: none !important;
    color: var(--aurora-ink) !important;
    font-size: 13px;
    font-weight: 600;
    line-height: 1;
    min-height: 36px;
    padding: 8px 14px !important;
}

.aurora-lang .dropdown-toggle::after,
.d4b-lang .dropdown-toggle::after {
    margin-left: 6px;
}

.aurora-lang.rtl .dropdown-toggle::after,
.d4b-lang.rtl .dropdown-toggle::after {
    margin-left: 0;
    margin-right: 6px;
}

/* Closed: never paint the language list. */
.aurora-lang .dropdown-menu,
.d4b-lang .dropdown-menu,
.aurora-lang > ul,
.d4b-lang > ul {
    display: none !important;
    visibility: hidden !important;
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    left: auto;
    z-index: 20;
    min-width: 180px;
    max-height: 320px;
    margin: 0;
    padding: 6px;
    overflow: auto;
    list-style: none;
    background: var(--aurora-canvas-white);
    border: 1px solid var(--aurora-hairline);
    border-radius: var(--aurora-radius-md);
    box-shadow: none;
}

.aurora-auth-split.rtl .aurora-lang .dropdown-menu,
.d4b-auth-split.rtl .d4b-lang .dropdown-menu,
.aurora-auth-page.rtl .aurora-lang .dropdown-menu,
.d4b-auth-page.rtl .d4b-lang .dropdown-menu {
    right: auto;
    left: 0;
}

/* Open: Bootstrap adds .show on the menu and/or the .dropdown parent. */
.aurora-lang.show > .dropdown-menu,
.d4b-lang.show > .dropdown-menu,
.aurora-lang .dropdown-menu.show,
.d4b-lang .dropdown-menu.show,
.aurora-lang.show > ul,
.d4b-lang.show > ul {
    display: block !important;
    visibility: visible !important;
}

.aurora-lang .dropdown-item,
.d4b-lang .dropdown-item,
.aurora-lang .languageSelection,
.d4b-lang .languageSelection {
    display: flex;
    align-items: center;
    border-radius: var(--aurora-radius-sm);
    color: var(--aurora-ink);
    font-size: 13px;
    padding: 8px 10px;
}

.aurora-lang .dropdown-item.active,
.d4b-lang .dropdown-item.active,
.aurora-lang .dropdown-item:active,
.d4b-lang .dropdown-item:active,
.aurora-lang .dropdown-item:hover,
.d4b-lang .dropdown-item:hover,
.aurora-lang .languageSelection.active,
.d4b-lang .languageSelection.active {
    background: var(--aurora-voltage-wash);
    color: var(--aurora-voltage-deep);
}

.aurora-lang .dropdown-item img,
.d4b-lang .dropdown-item img {
    width: 20px;
    height: 18px;
    object-fit: cover;
    border-radius: 2px;
}

/* -------------------------------------------------------------------------- */
/* Cabinet form                                                              */
/* -------------------------------------------------------------------------- */

.aurora-auth-content,
.d4b-auth-content {
    display: flex;
    flex: 1 1 auto;
    align-items: center;
    width: 100%;
}

.aurora-auth-form,
.d4b-auth-form,
.aurora-auth-card,
.d4b-auth-card {
    width: 100%;
    max-width: 440px;
    margin: 0 auto 24px;
    padding: 28px 24px;
    background: var(--aurora-canvas-white);
    border: 1px solid var(--aurora-hairline);
    border-radius: var(--aurora-radius-lg);
    box-shadow: none;
}

@media (min-width: 576px) {
    .aurora-auth-form,
    .d4b-auth-form,
    .aurora-auth-card,
    .d4b-auth-card {
        padding: 36px 32px;
    }
}

@media (min-width: 992px) {
    .aurora-auth-split:not(.rtl) .aurora-auth-form,
    .d4b-auth-split:not(.rtl) .d4b-auth-form {
        margin-left: 0;
        margin-right: auto;
    }

    .aurora-auth-split.rtl .aurora-auth-form,
    .d4b-auth-split.rtl .d4b-auth-form {
        margin-left: auto;
        margin-right: 0;
    }
}

.aurora-auth-centered .aurora-auth-card,
.d4b-auth-centered .d4b-auth-card {
    max-width: 480px;
}

.d4b-title,
.aurora-title {
    margin: 0 0 24px;
    color: var(--aurora-ink);
    font-size: 32px;
    font-weight: 700;
    line-height: 1.2;
}

@media (max-width: 575px) {
    .d4b-title,
    .aurora-title {
        font-size: 26px;
    }
}

.d4b-subtitle,
.aurora-subtitle {
    margin: -12px 0 20px;
    color: var(--aurora-ink-muted);
    font-size: 15px;
    font-weight: 500;
    line-height: 1.55;
}

/* -------------------------------------------------------------------------- */
/* Fields                                                                    */
/* -------------------------------------------------------------------------- */

.aurora-auth-page .form-label,
.d4b-auth-page .form-label,
.d4b-label,
.aurora-label {
    margin-bottom: 8px;
    color: var(--aurora-ink-mid);
    font-size: 14px;
    font-weight: 500;
}

.aurora-auth-page .form-control,
.d4b-auth-page .form-control,
.aurora-auth-page .iti input.form-control,
.d4b-auth-page .iti input.form-control {
    height: 48px;
    padding: 12px 16px;
    background: var(--aurora-canvas-white) !important;
    border: 1px solid var(--aurora-hairline) !important;
    border-radius: var(--aurora-radius-md) !important;
    box-shadow: none !important;
    color: var(--aurora-ink);
    font-size: 14px;
}

.aurora-auth-page .form-control:focus,
.d4b-auth-page .form-control:focus {
    border-color: var(--aurora-voltage) !important;
    box-shadow: none !important;
    outline: 2px solid var(--aurora-voltage-wash);
    outline-offset: 1px;
}

.aurora-auth-page .iti,
.d4b-auth-page .iti {
    width: 100%;
}

.aurora-auth-page .position-relative .form-control,
.d4b-auth-page .position-relative .form-control {
    padding-right: 48px;
}

.aurora-auth-page.rtl .position-relative .form-control,
.d4b-auth-page.rtl .position-relative .form-control,
.aurora-auth-page [dir="rtl"] .position-relative .form-control,
.d4b-auth-page [dir="rtl"] .position-relative .form-control {
    padding-right: 16px;
    padding-left: 48px;
}

.aurora-auth-page .input-icon,
.d4b-auth-page .input-icon {
    color: var(--aurora-ink-muted);
}

.aurora-auth-page .input-icon:hover,
.d4b-auth-page .input-icon:hover {
    color: var(--aurora-voltage);
}

.aurora-auth-page .form-check-input,
.d4b-auth-page .form-check-input {
    width: 18px;
    height: 18px;
    margin-top: 2px;
    border: 1px solid var(--aurora-hairline);
    border-radius: var(--aurora-radius-sm);
    box-shadow: none !important;
}

.aurora-auth-page .form-check-input:checked,
.d4b-auth-page .form-check-input:checked {
    background-color: var(--aurora-voltage);
    border-color: var(--aurora-voltage);
}

.aurora-auth-page .form-check-label,
.d4b-auth-page .form-check-label {
    color: var(--aurora-ink-mid);
    font-size: 14px;
    font-weight: 500;
}

.d4b-row-between,
.aurora-row-between {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.d4b-link,
.aurora-link,
.aurora-auth-page a.link-info,
.d4b-auth-page a.link-info,
.aurora-auth-page a.d4b-link,
.d4b-auth-page a.d4b-link {
    color: var(--aurora-brand) !important;
    font-weight: 600;
    text-decoration: none !important;
}

.d4b-link:hover,
.aurora-link:hover,
.aurora-auth-page a.link-info:hover,
.d4b-auth-page a.link-info:hover {
    color: var(--aurora-brand-deep) !important;
}

.aurora-auth-page .required::after,
.d4b-auth-page .required::after {
    color: var(--aurora-voltage);
}

/* -------------------------------------------------------------------------- */
/* Buttons — voltage is the primary CTA                                      */
/* -------------------------------------------------------------------------- */

.aurora-btn-voltage,
.d4b-btn-teal,
.aurora-auth-page .d4b-btn-teal,
.d4b-auth-page .d4b-btn-teal,
.aurora-auth-page .login-btn,
.d4b-auth-page .login-btn,
.aurora-auth-page .register-btn,
.d4b-auth-page .register-btn,
.aurora-auth-page .reset-link,
.d4b-auth-page .reset-link,
.aurora-auth-page .modern-login-btn,
.d4b-auth-page .modern-login-btn,
.aurora-auth-page .modern-register-btn,
.d4b-auth-page .modern-register-btn,
.aurora-auth-page .modern-reset-btn,
.d4b-auth-page .modern-reset-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 48px;
    padding: 12px 18px;
    background: var(--aurora-voltage) !important;
    border: 0 !important;
    border-radius: var(--aurora-radius-md) !important;
    box-shadow: none !important;
    color: var(--aurora-canvas-white) !important;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.2;
    text-decoration: none !important;
}

.aurora-btn-voltage:hover,
.d4b-btn-teal:hover,
.aurora-auth-page .d4b-btn-teal:hover,
.d4b-auth-page .d4b-btn-teal:hover,
.aurora-auth-page .login-btn:hover,
.d4b-auth-page .login-btn:hover,
.aurora-auth-page .register-btn:hover,
.d4b-auth-page .register-btn:hover,
.aurora-auth-page .reset-link:hover,
.d4b-auth-page .reset-link:hover,
.aurora-auth-page .modern-login-btn:hover,
.d4b-auth-page .modern-login-btn:hover,
.aurora-auth-page .modern-register-btn:hover,
.d4b-auth-page .modern-register-btn:hover,
.aurora-auth-page .modern-reset-btn:hover,
.d4b-auth-page .modern-reset-btn:hover {
    background: var(--aurora-voltage-deep) !important;
    color: var(--aurora-canvas-white) !important;
}

.aurora-btn-ghost,
.d4b-btn-ghost,
.aurora-auth-page .d4b-btn-ghost,
.d4b-auth-page .d4b-btn-ghost,
.aurora-auth-page .modern-cancel-btn,
.d4b-auth-page .modern-cancel-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 48px;
    padding: 12px 18px;
    background: var(--aurora-canvas-white) !important;
    border: 1px solid var(--aurora-hairline) !important;
    border-radius: var(--aurora-radius-md) !important;
    box-shadow: none !important;
    color: var(--aurora-ink) !important;
    font-size: 16px;
    font-weight: 600;
    text-decoration: none !important;
}

.aurora-btn-ghost:hover,
.d4b-btn-ghost:hover,
.aurora-auth-page .d4b-btn-ghost:hover,
.d4b-auth-page .d4b-btn-ghost:hover {
    background: var(--aurora-voltage-wash) !important;
    border-color: var(--aurora-voltage-soft) !important;
    color: var(--aurora-voltage-deep) !important;
}

.d4b-btn-row,
.aurora-btn-row {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.d4b-btn-row form,
.aurora-btn-row form {
    flex: 1 1 0;
    width: 100%;
    margin: 0;
}

@media (min-width: 768px) {
    .d4b-btn-row,
    .aurora-btn-row {
        flex-direction: row;
    }

    .d4b-btn-row .d4b-btn-teal,
    .d4b-btn-row .d4b-btn-ghost,
    .d4b-btn-row .reset-link,
    .d4b-btn-row .aurora-btn-voltage,
    .d4b-btn-row .aurora-btn-ghost {
        width: auto;
        flex: 1 1 0;
    }
}

/* -------------------------------------------------------------------------- */
/* Social                                                                    */
/* -------------------------------------------------------------------------- */

.d4b-social,
.aurora-social {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 8px;
}

@media (min-width: 576px) {
    .d4b-social,
    .aurora-social {
        flex-direction: row;
    }
}

.d4b-social-btn,
.aurora-social-btn,
.aurora-auth-page .google-btn,
.d4b-auth-page .google-btn,
.aurora-auth-page .facebook-btn,
.d4b-auth-page .facebook-btn {
    display: flex !important;
    align-items: center;
    justify-content: center;
    flex: 1 1 0;
    min-height: 48px;
    padding: 10px 14px;
    background: var(--aurora-canvas-white) !important;
    border: 1px solid var(--aurora-hairline) !important;
    border-radius: var(--aurora-radius-md) !important;
    box-shadow: none !important;
    color: var(--aurora-ink) !important;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none !important;
}

.d4b-social-btn:hover,
.aurora-social-btn:hover,
.aurora-auth-page .google-btn:hover,
.d4b-auth-page .google-btn:hover,
.aurora-auth-page .facebook-btn:hover,
.d4b-auth-page .facebook-btn:hover {
    background: var(--aurora-voltage-wash) !important;
    border-color: var(--aurora-voltage-soft) !important;
    color: var(--aurora-ink) !important;
}

.d4b-divider,
.aurora-divider {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 20px 0 24px;
    color: var(--aurora-ink-muted);
    font-size: 14px;
}

.d4b-divider::before,
.d4b-divider::after,
.aurora-divider::before,
.aurora-divider::after {
    content: "";
    flex: 1 1 auto;
    height: 1px;
    background: var(--aurora-hairline);
}

/* -------------------------------------------------------------------------- */
/* Footer / alerts / chrome leftovers                                        */
/* -------------------------------------------------------------------------- */

.d4b-footer,
.aurora-footer {
    color: var(--aurora-ink-muted);
    font-size: 13px;
    text-align: center;
    padding: 8px 0 12px;
}

.d4b-footer a,
.aurora-footer a {
    color: var(--aurora-brand);
    font-weight: 600;
    text-decoration: none;
}

.d4b-footer a:hover,
.aurora-footer a:hover {
    color: var(--aurora-brand-deep);
}

.aurora-auth-page .alert,
.d4b-auth-page .alert {
    border: 1px solid var(--aurora-hairline);
    border-radius: var(--aurora-radius-md);
    box-shadow: none;
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 16px;
    padding: 12px 16px;
}

.d4b-muted,
.aurora-muted {
    color: var(--aurora-ink-muted);
    font-size: 14px;
    font-weight: 500;
}

.d4b-switch-line,
.aurora-switch-line {
    margin-top: 18px;
    color: var(--aurora-ink);
    font-size: 14px;
    font-weight: 500;
}

.aurora-auth-page .copy-right,
.d4b-auth-page .copy-right,
.aurora-auth-page .top-vector,
.d4b-auth-page .top-vector,
.aurora-auth-page .bottom-vector,
.d4b-auth-page .bottom-vector {
    display: none !important;
}

.aurora-auth-page .g-recaptcha,
.d4b-auth-page .g-recaptcha {
    margin-bottom: 4px;
}