/* Shared authentication surfaces. Keep login, registration and recovery together. */
html { --auth-bg: #f5f7fa; --auth-surface: #fff; --auth-text: #1e293b; --auth-muted: #64748b; --auth-border: #dce3ec; --auth-soft: #f1f5f9; --auth-link: #1d4ed8; }
html[data-bs-theme="dark"] { --auth-bg: #111827; --auth-surface: #1e293b; --auth-text: #e2e8f0; --auth-muted: #a8b5c7; --auth-border: #364458; --auth-soft: #172235; --auth-link: #93c5fd; color-scheme: dark; }
body.authentication-bg.authentication-bg-pattern { background: var(--auth-bg) !important; color: var(--auth-text); font-family: var(--cm-font-sans); font-size: 14px; line-height: 20px; }
.auth-toolbar { display: flex; justify-content: flex-end; padding: 20px 24px 0; }
.auth-theme-toggle { display: inline-flex; align-items: center; gap: 8px; min-height: 36px; border: 1px solid var(--auth-border); border-radius: 10px; padding: 0 12px; background: var(--auth-surface); color: var(--auth-text); font: inherit; cursor: pointer; }
.auth-theme-toggle i { font-size: 18px; }
body .auth-page-wrap { min-height: calc(100dvh - 56px) !important; padding: 32px 24px !important; margin: 0; }
body .auth-page-wrap > .container { width: 100%; max-width: 1040px; padding: 0; }
.auth-page-wrap > .container > .row { margin: 0; }
.auth-page-wrap > .container > .row > div { width: 100%; padding: 0; }
body .auth-card { margin: 0; border: 1px solid var(--auth-border) !important; border-radius: 12px !important; background: var(--auth-surface) !important; box-shadow: 0 8px 32px rgb(15 23 42 / 5%) !important; }
body .auth-card .bg-white { background: var(--auth-surface) !important; }
body .auth-card .card-body { padding: 40px !important; background: var(--auth-surface); }
body .auth-card .card-body > .text-center.mb-3 { text-align: left !important; margin-bottom: 24px !important; }
body .auth-card h4 { color: var(--auth-text); font-size: 26px; font-weight: 700 !important; line-height: 34px; letter-spacing: -.5px; }
body .auth-card .text-muted, body .auth-card .form-text { color: var(--auth-muted) !important; }
body .auth-card a { color: var(--auth-link); }
body .auth-card a:hover { text-decoration: underline; }
body .auth-hero-panel { background: var(--auth-hero, #172b46); border: 0; }
body .auth-hero-panel::before, body .auth-hero-panel::after { display: none; }
body .auth-hero-content { padding: 40px; gap: 40px; }
body .auth-hero-title { font-size: 32px; line-height: 40px; letter-spacing: -.6px; color: #f8fafc; }
body .auth-hero-copy { color: #c3d1e2; font-size: 15px; line-height: 24px; }
body .auth-eyebrow { background: #263e5b; border: 1px solid #405673; color: #dbeafe; box-shadow: none; font-weight: 600; }
body .auth-hero-metric { background: #203651; border: 1px solid #405673; border-radius: 10px; box-shadow: none; }
body .auth-hero-metric div, body .auth-hero-metric small { color: #c3d1e2 !important; }
body .auth-hero-metric strong { color: #f8fafc; }
body .auth-card .form-label { color: var(--auth-text) !important; font-size: 13px; font-weight: 600; margin-bottom: 8px; }
body .auth-card .form-control, body .auth-card .input-group-text { min-height: 44px; background: var(--auth-surface) !important; color: var(--auth-text) !important; border: 1px solid var(--auth-border) !important; border-radius: 8px !important; font-size: 14px; box-shadow: none !important; }
body .auth-card .form-control::placeholder { color: var(--auth-muted); opacity: 1; }
body .auth-card .form-control:focus { border-color: var(--auth-acc, #3b82f6) !important; box-shadow: 0 0 0 3px var(--auth-ring, rgb(59 130 246 / 15%)) !important; }
body .auth-card .form-control:-webkit-autofill { -webkit-box-shadow: 0 0 0 1000px var(--auth-soft) inset !important; -webkit-text-fill-color: var(--auth-text) !important; caret-color: var(--auth-text); }
body .auth-card .form-control.is-invalid { border-color: #ef4444 !important; }
body .auth-card .input-group > .form-control { border-radius: 8px 0 0 8px !important; }
body .auth-card .input-group > .input-group-text { border-radius: 0 8px 8px 0 !important; border-left: 0 !important; cursor: pointer; }
body .auth-card .form-check-input:checked { background-color: var(--auth-acc, #1d4ed8); border-color: var(--auth-acc, #1d4ed8); }
body .auth-card .form-check-label { color: var(--auth-text) !important; }
body .auth-info-card { background: var(--auth-soft); border: 1px solid var(--auth-border); border-radius: 10px; padding: 16px; margin-bottom: 20px; box-shadow: none; }
body .auth-info-card .small { font-size: 13px; line-height: 20px; }
body .auth-card .drivers-btn { min-height: 44px !important; height: auto !important; border-radius: 8px; font-size: 14px; font-weight: 600; box-shadow: none; }
body .auth-card .drivers-btn-primary { background: var(--auth-acc, #1d4ed8) !important; border-color: var(--auth-acc, #1d4ed8) !important; color: var(--auth-acc-text, #fff) !important; }
body .auth-card .drivers-btn-primary:hover { background: var(--auth-acc-hover, #1e40af) !important; border-color: var(--auth-acc-hover, #1e40af) !important; color: var(--auth-acc-text, #fff) !important; text-decoration: none; }
body .auth-card .drivers-btn-outline { background: var(--auth-surface) !important; border-color: var(--auth-border) !important; color: var(--auth-text) !important; }
body .auth-card .drivers-btn-outline:hover, .auth-theme-toggle:hover { background: var(--auth-soft) !important; }
body .auth-card :is(a,button,[role="button"]):focus-visible, .auth-theme-toggle:focus-visible { outline: 2px solid var(--auth-acc, #3b82f6); outline-offset: 3px; }
body .register-step-pill { color: var(--auth-muted); }
body .register-step-pill strong { display: inline; }
body .register-step-pill span { background: var(--auth-surface); color: var(--auth-muted); border-color: var(--auth-border); }
body .register-step-pill.is-active { color: var(--auth-link); }
body .register-step-pill.is-complete { color: var(--auth-text); }
body .register-step-pill.is-complete span { background: var(--auth-soft); color: var(--auth-link); }
body .register-step-pill.is-active span { background: var(--auth-acc, #1d4ed8); color: var(--auth-acc-text, #fff); border-color: var(--auth-acc, #1d4ed8); }
body .register-step-line { background: var(--auth-border); }
body .register-file-drop { background: var(--auth-soft); border-color: var(--auth-border); color: var(--auth-text); }
body .register-file-drop:hover { background: var(--auth-surface); border-color: var(--auth-link); }
body .register-file-drop strong { color: var(--auth-text); }
body .register-file-drop small { color: var(--auth-muted) !important; }
body .register-file-logo { background: var(--auth-surface); border-color: var(--auth-border); color: var(--auth-link); }
.auth-recovery-icon { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 10px; background: var(--auth-soft); color: var(--auth-link); font-size: 26px; margin-bottom: 20px; }
.auth-recovery-back { display: block; text-align: center; margin-top: 24px; }
@media (max-width: 991.98px) { body .auth-page-wrap > .container { max-width: 520px; } body .auth-card .card-body { padding: 32px !important; } }
@media (max-width: 575.98px) { .auth-toolbar { padding: 16px 16px 0; } body .auth-page-wrap { padding: 24px 16px !important; align-items: flex-start !important; } body .auth-card .card-body { padding: 24px !important; } body .auth-card h4 { font-size: 24px; line-height: 32px; } }

/* ---------- Login con el tema (21-10-2026): Blue Ocean (por defecto) o Naranja, claro y nocturno ----------
   theme-switcher.js pone data-cm-theme="naranja" en los dos y data-dx-skin="ocean" en Blue Ocean. */
html[data-cm-theme="naranja"] {
    --auth-bg: #F3F4F6; --auth-surface: #FFFFFF; --auth-text: #14161B; --auth-muted: #5B606B; --auth-border: #E3E5EA; --auth-soft: #F6F7F9;
    --auth-acc: #F2571E; --auth-acc-hover: #D9480F; --auth-acc-text: #FFFFFF; --auth-ring: rgba(242, 87, 30, .16); --auth-link: #C2410C;
    --auth-hero: radial-gradient(520px 360px at 100% 0%, rgba(255, 107, 53, .45), rgba(255, 107, 53, 0) 65%), linear-gradient(160deg, #1D1F25 0%, #14161B 100%);
}
html[data-cm-theme="naranja"][data-bs-theme="dark"] {
    --auth-bg: #0F0C0B; --auth-surface: #1F1A17; --auth-text: #F3EAE4; --auth-muted: #B8AAA0; --auth-border: #352C27; --auth-soft: #28211D;
    --auth-acc: #FF6B35; --auth-acc-hover: #FF7A45; --auth-acc-text: #14161B; --auth-ring: rgba(255, 122, 69, .22); --auth-link: #FF9466;
    --auth-hero: radial-gradient(520px 360px at 100% 0%, rgba(255, 107, 53, .38), rgba(255, 107, 53, 0) 65%), linear-gradient(160deg, #16120F 0%, #0F0C0B 100%);
}
html[data-cm-theme="naranja"][data-dx-skin="ocean"] {
    --auth-acc: #00A05A; --auth-acc-hover: #007A45; --auth-acc-text: #FFFFFF; --auth-ring: rgba(0, 160, 90, .16); --auth-link: #0B6E8F;
    --auth-hero: radial-gradient(380px 240px at 100% -10%, rgba(255, 255, 255, .22), transparent 60%), linear-gradient(120deg, #0383BC 0%, #029A7E 55%, #03965A 100%);
}
html[data-cm-theme="naranja"][data-dx-skin="ocean"][data-bs-theme="dark"] {
    --auth-bg: #071118; --auth-surface: #0D1A23; --auth-text: #EAF4F7; --auth-muted: #8FA6B2; --auth-border: #1A3343; --auth-soft: #112330;
    --auth-acc: #1FCB86; --auth-acc-hover: #4BE3A0; --auth-acc-text: #03201A; --auth-ring: rgba(31, 203, 134, .22); --auth-link: #7CF2C2;
    --auth-hero: radial-gradient(360px 240px at 100% -10%, rgba(90, 230, 255, .30), transparent 60%), radial-gradient(300px 220px at 0% 120%, rgba(40, 230, 150, .22), transparent 60%), linear-gradient(135deg, #063E5C 0%, #05424A 55%, #04402E 100%);
}
html[data-cm-theme="naranja"] body.authentication-bg.authentication-bg-pattern { font-family: var(--dx-font-sans, var(--cm-font-sans)); }
html[data-cm-theme="naranja"] body .auth-card .drivers-btn-primary { box-shadow: 0 6px 16px -6px var(--auth-acc) !important; }
html[data-cm-theme="naranja"] body .auth-hero-title { color: #FFFFFF; }
html[data-cm-theme="naranja"] body .auth-hero-copy { color: rgba(255, 255, 255, .82); }
html[data-cm-theme="naranja"] body .auth-eyebrow { background: rgba(255, 255, 255, .12); border-color: rgba(255, 255, 255, .2); color: #FFFFFF; }
html[data-cm-theme="naranja"] body .auth-hero-metric { background: rgba(255, 255, 255, .1); border-color: rgba(255, 255, 255, .16); }
html[data-cm-theme="naranja"] body .auth-hero-metric div, html[data-cm-theme="naranja"] body .auth-hero-metric small { color: rgba(255, 255, 255, .8) !important; }
html[data-cm-theme="naranja"] body .auth-hero-metric strong { color: #FFFFFF; }
/* Logotipo encima del saludo: en claro sin el fondo blanco de la imagen; en nocturno, sobre una placa blanca */
body .auth-card .auth-brand-logo { display: inline-flex; margin: 0 0 20px; max-width: 150px; }
body .auth-card .auth-brand-logo img { max-width: 100%; max-height: 48px; object-fit: contain; mix-blend-mode: multiply; }
html[data-bs-theme="dark"] body .auth-card .auth-brand-logo { padding: 6px 12px; border-radius: 12px; background: #FFFFFF; }