/* ════════════════════════════════════════════════════════════════════════════
   ALIENTECH "PIT WALL" AUTH (login + register) — effect-rich, interactive.
   Static file → served fresh (no opcache dance). Scoped to .al-login.
   Accent = operator palette var(--ts-primary). Motion-safe + perf-tier gated.
   ════════════════════════════════════════════════════════════════════════════ */
.al-login{
    --al-acc: var(--ts-primary, #f8e800);
    --al-acc-rgb: var(--ts-primary-rgb, 248,232,0);
    --al-ink:#0a0d05; --al-text:#f4f5ee; --al-text-2:#b7bcac; --al-text-3:#7f8574;
    --al-line:rgba(255,255,255,.09); --al-surface:rgba(10,11,7,.6);
    --glare-x:50%; --glare-y:30%;
    position:relative; z-index:2; min-height:100dvh; display:flex; flex-direction:column;
    color:var(--al-text); overflow:hidden;
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}
/* re-show the guest language + light/dark controls, tucked top-right BELOW the dealer chip (no overlap) */
body:has(.al-login) .lang-switcher{display:block !important;top:116px !important;right:106px !important;left:auto !important;bottom:auto !important;z-index:1200 !important;}
body:has(.al-login) .theme-toggle{display:flex !important;top:116px !important;right:44px !important;left:auto !important;bottom:auto !important;z-index:1200 !important;}
@media (max-width:575.98px){
    body:has(.al-login) .lang-switcher{top:16px !important;right:70px !important;}
    body:has(.al-login) .theme-toggle{top:16px !important;right:16px !important;}
}

/* ── ambient FX behind card ── */
/* Background-agnostic scrim — darkens the LEFT (text) + RIGHT (form) so any photo
   (light or dark) stays readable. Lighter than before so the photo breathes
   ("pe negru era prea închis") — the card + text keep their own shadows for legibility. */
.al-login__scrim{position:fixed;inset:0;z-index:-2;pointer-events:none;
    background:
      linear-gradient(90deg, rgba(6,8,4,.7) 0%, rgba(6,8,4,.4) 26%, rgba(6,8,4,.1) 50%, rgba(6,8,4,.32) 74%, rgba(6,8,4,.66) 100%),
      linear-gradient(0deg, rgba(6,8,4,.58) 0%, rgba(6,8,4,.08) 24%, transparent 48%, rgba(6,8,4,.26) 100%);}
.al-login__scrim::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 22vmax rgba(0,0,0,.5);}
.al-fx{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden;}

/* NEW ambient layers (subtle, premium — gated by reduced-motion + saver below) */
/* 1. slow-drifting technical mesh (industrial grid, barely there) */
.al-mesh{position:absolute;inset:-2px;opacity:.5;
    background-image:
      linear-gradient(rgba(var(--al-acc-rgb),.05) 1px,transparent 1px),
      linear-gradient(90deg,rgba(var(--al-acc-rgb),.05) 1px,transparent 1px);
    background-size:52px 52px;
    -webkit-mask-image:radial-gradient(120% 90% at 50% 40%,#000 20%,transparent 78%);
    mask-image:radial-gradient(120% 90% at 50% 40%,#000 20%,transparent 78%);
    animation:alMesh 34s linear infinite;}
@keyframes alMesh{from{background-position:0 0,0 0}to{background-position:52px 52px,52px 52px}}
/* 2. slow pit-lane light sweep across the whole scene */
.al-sweep{position:absolute;top:-30%;bottom:-30%;left:-40%;width:38%;
    background:linear-gradient(100deg,transparent,rgba(var(--al-acc-rgb),.06) 44%,rgba(255,255,255,.05) 50%,rgba(var(--al-acc-rgb),.06) 56%,transparent);
    transform:skewX(-14deg);filter:blur(6px);animation:alSweep 13s ease-in-out infinite;}
@keyframes alSweep{0%{left:-40%;opacity:0}12%{opacity:1}60%{opacity:.7}100%{left:130%;opacity:0}}
/* 3. soft aurora glow that breathes bottom-right (adds depth, never harsh) */
.al-aurora{position:absolute;right:-8%;bottom:-14%;width:52vw;height:52vw;border-radius:50%;
    background:radial-gradient(circle,rgba(var(--al-acc-rgb),.14),transparent 62%);
    filter:blur(50px);opacity:.6;animation:alAurora 16s ease-in-out infinite;}
@keyframes alAurora{0%,100%{opacity:.4;transform:scale(1)}50%{opacity:.7;transform:scale(1.12)}}
.al-streak{position:absolute;height:1px;width:36vw;left:-38vw;
    background:linear-gradient(90deg,transparent,rgba(var(--al-acc-rgb),.5),transparent);
    opacity:.3;animation:alStreak 7s linear infinite;}
.al-streak:nth-child(1){top:16%;animation-delay:0s}
.al-streak:nth-child(2){top:44%;animation-delay:2.4s;animation-duration:9s;opacity:.2}
.al-streak:nth-child(3){top:68%;animation-delay:4.6s;animation-duration:8s;opacity:.26}
.al-streak:nth-child(4){top:88%;animation-delay:6s;animation-duration:10s;opacity:.16}
@keyframes alStreak{from{transform:translateX(0)}to{transform:translateX(180vw)}}
.al-ember{position:absolute;bottom:-10px;width:3px;height:3px;border-radius:50%;
    background:rgba(var(--al-acc-rgb),.9);box-shadow:0 0 7px 1px rgba(var(--al-acc-rgb),.6);
    opacity:0;animation:alEmber 9s ease-in infinite;}
.al-ember:nth-child(5){left:8%;animation-delay:.4s}
.al-ember:nth-child(6){left:22%;animation-delay:3.1s;animation-duration:11s}
.al-ember:nth-child(7){left:37%;animation-delay:5.7s}
.al-ember:nth-child(8){left:63%;animation-delay:1.8s;animation-duration:12s}
.al-ember:nth-child(9){left:78%;animation-delay:7.2s}
.al-ember:nth-child(10){left:91%;animation-delay:4.4s;animation-duration:10s}
@keyframes alEmber{0%{opacity:0;transform:translateY(0) scale(.6)}12%{opacity:.9}
    70%{opacity:.5}100%{opacity:0;transform:translateY(-88vh) scale(1.1)}}
/* full-viewport launch flash on submit */
.al-flash{position:fixed;inset:0;z-index:6;pointer-events:none;opacity:0;
    background:radial-gradient(80% 60% at 72% 50%, rgba(var(--al-acc-rgb),.32), transparent 70%);}
.al-flash.go{animation:alFlash 1s ease-out;}
@keyframes alFlash{0%{opacity:0}16%{opacity:1}100%{opacity:0}}

/* ── HUD ── */
.al-login__hud{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;
    padding:clamp(10px,1.6vw,18px) clamp(16px,3vw,44px);
    opacity:0;animation:alUp .6s .05s ease both;}
.al-login__brand{display:inline-flex;align-items:center;gap:12px;text-decoration:none;color:inherit;}
/* MMT brand logo is now a TRANSPARENT auto-cropped PNG (black bg cut out) — show it BIG
   and clean with NO box/frame ("scoate din chenar / scoate fundalul negru"). A soft drop
   shadow gives the white wordmark an edge; stronger in light mode so the white parts stay
   legible on a light page without needing a backing box. */
.al-login__brand img{max-height:clamp(70px,8.5vw,104px);max-width:min(54vw,560px);width:auto;object-fit:contain;display:block;
    filter:drop-shadow(0 2px 7px rgba(0,0,0,.5));}
[data-bs-theme="light"] .al-login__brand img,
body.light-mode .al-login__brand img{filter:drop-shadow(1px 0 0 rgba(18,20,13,.55)) drop-shadow(-1px 0 0 rgba(18,20,13,.55)) drop-shadow(0 1px 0 rgba(18,20,13,.55)) drop-shadow(0 -1px 0 rgba(18,20,13,.55)) drop-shadow(0 3px 10px rgba(0,0,0,.25));}
.al-login__mark{width:44px;height:44px;flex:0 0 auto;display:grid;place-items:center;font-weight:900;font-size:13px;
    letter-spacing:.5px;color:var(--al-ink);background:linear-gradient(145deg,var(--al-acc),#cbb800);
    clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,8px 100%,0 calc(100% - 8px));}
.al-login__brand-txt b{display:block;font-size:14px;letter-spacing:2.4px;font-weight:800;text-transform:uppercase;}
.al-login__brand-txt span{display:block;font-size:9.5px;letter-spacing:2.6px;color:var(--al-text-3);text-transform:uppercase;margin-top:2px;}
/* top-right chip — light glass (see-through, low opacity) */
.al-login__dealer{display:inline-flex;align-items:center;gap:13px;padding:11px 20px;border:1px solid rgba(255,255,255,.14);
    border-radius:999px;background:rgba(14,16,9,.26);backdrop-filter:blur(18px) saturate(150%);-webkit-backdrop-filter:blur(18px) saturate(150%);
    font-size:11.5px;letter-spacing:2.2px;text-transform:uppercase;color:var(--al-text-2);
    box-shadow:0 8px 26px -12px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.08);
    transition:border-color .3s,box-shadow .3s,background .3s;}
.al-login__dealer:hover{border-color:rgba(var(--al-acc-rgb),.4);box-shadow:0 0 18px rgba(var(--al-acc-rgb),.12);}
.al-login__dealer img{height:24px;width:auto;opacity:.98;}

/* ── stage ── */
.al-login__stage{flex:1 1 auto;display:flex;align-items:center;justify-content:space-between;gap:clamp(24px,5vw,80px);
    padding:clamp(4px,1vw,14px) clamp(18px,5vw,72px) clamp(8px,1.5vw,18px);}
.al-login__intro{max-width:470px;flex:1 1 420px;min-width:0;
    opacity:0;animation:alUp .7s .12s ease both;}
.al-login__eyebrow{display:inline-flex;align-items:center;gap:9px;font-size:10px;letter-spacing:3.6px;text-transform:uppercase;
    color:var(--al-acc);font-weight:700;margin-bottom:16px;}
.al-login__eyebrow::before{content:"";width:26px;height:2px;background:var(--al-acc);
    box-shadow:0 0 8px rgba(var(--al-acc-rgb),.5);animation:alPulse 2.6s ease-in-out infinite;}
@keyframes alPulse{0%,100%{opacity:1;width:26px}50%{opacity:.55;width:34px}}
.al-login__title{font-size:clamp(30px,4.4vw,52px);font-weight:800;line-height:1.05;letter-spacing:-.5px;
    text-shadow:0 2px 18px rgba(0,0,0,.7),0 1px 3px rgba(0,0,0,.6);}
.al-login__title span{display:block;color:var(--al-acc);text-shadow:0 0 30px rgba(var(--al-acc-rgb),.3),0 2px 14px rgba(0,0,0,.7);}
.al-login__lead{margin-top:16px;font-size:15px;line-height:1.6;color:#dfe2d6;max-width:420px;text-shadow:0 1px 8px rgba(0,0,0,.7);}
.al-login__eyebrow{text-shadow:0 1px 6px rgba(0,0,0,.6);}
.al-login__chips{list-style:none;margin:26px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:9px;}
.al-login__chips li{display:inline-flex;align-items:center;gap:8px;font-size:11.5px;letter-spacing:.4px;color:var(--al-text-2);
    background:rgba(8,10,5,.5);border:1px solid var(--al-line);padding:9px 14px;border-radius:10px;backdrop-filter:blur(8px);
    transition:transform .25s,border-color .25s,color .25s;}
.al-login__chips li:hover{transform:translateY(-2px);border-color:rgba(var(--al-acc-rgb),.4);color:var(--al-text);}
.al-login__chips li i{color:var(--al-acc);font-size:13px;}
/* left intro band — solid glass, LOGO ON TOP + text stacked BELOW it.
   Fixed width so the very wide (10.45:1) Alientech wordmark can't poke out the side
   ("H iese din element") — the img is capped to the band's inner width. */
.al-login__dealer-band{margin-top:26px;display:flex;flex-direction:column;align-items:flex-start;gap:11px;
    width:min(320px,100%);padding:16px 20px;overflow:hidden;
    border:1px solid rgba(var(--al-acc-rgb),.32);border-radius:14px;
    background:linear-gradient(180deg,rgba(12,14,8,.62),rgba(8,10,5,.58));
    backdrop-filter:blur(16px) saturate(150%);-webkit-backdrop-filter:blur(16px) saturate(150%);
    box-shadow:0 12px 34px -14px rgba(0,0,0,.7),inset 0 1px 0 rgba(255,255,255,.06);
    transition:box-shadow .3s,border-color .3s;}
.al-login__dealer-band:hover{box-shadow:0 0 24px rgba(var(--al-acc-rgb),.14);}
.al-login__dealer-band img{width:100%;max-width:100%;height:auto;flex:0 0 auto;}
.al-login__dealer-band span{font-size:12px;line-height:1.5;color:var(--al-text-2);}
.al-login__dealer-band b{color:var(--al-text);display:block;font-size:12.5px;letter-spacing:.3px;margin-bottom:2px;}

/* ── card ── */
.al-login__card-wrap{flex:0 0 auto;width:min(410px,100%);perspective:1300px;
    opacity:0;animation:alUp .7s .2s ease both;}
.al-login__card{position:relative;background:var(--al-surface);border:1px solid var(--al-line);border-radius:20px;
    padding:clamp(20px,2.4vw,28px);backdrop-filter:blur(24px) saturate(150%);-webkit-backdrop-filter:blur(24px) saturate(150%);
    box-shadow:0 40px 80px -24px rgba(0,0,0,.78),0 0 0 1px rgba(255,255,255,.03) inset,0 1px 0 rgba(255,255,255,.06) inset;
    transform:rotateX(var(--al-rx,0deg)) rotateY(var(--al-ry,0deg));transform-style:preserve-3d;
    transition:transform .18s cubic-bezier(.22,.61,.36,1);overflow:hidden;}
@supports not (backdrop-filter: blur(1px)){.al-login__card{background:rgba(9,11,6,.97);}}
.al-login__card::before{content:"";position:absolute;inset:0;opacity:.25;pointer-events:none;
    background:linear-gradient(45deg,rgba(255,255,255,.02) 25%,transparent 25% 75%,rgba(255,255,255,.02) 75%),
              linear-gradient(-45deg,rgba(255,255,255,.02) 25%,transparent 25% 75%,rgba(255,255,255,.02) 75%);
    background-size:8px 8px;}
.al-login__card::after{content:"";position:absolute;inset:0;pointer-events:none;transition:opacity .3s;
    background:radial-gradient(420px circle at var(--glare-x) var(--glare-y), rgba(255,255,255,.09), transparent 55%);}
.al-login__stripe{position:absolute;top:0;left:0;right:0;height:3px;border-radius:20px 20px 0 0;overflow:hidden;
    background:linear-gradient(90deg,transparent,var(--al-acc) 20%,#fff3a8 50%,var(--al-acc) 80%,transparent);
    filter:drop-shadow(0 0 8px rgba(var(--al-acc-rgb),.5));transform:translateZ(60px);}
.al-login__stripe::after{content:"";position:absolute;top:0;bottom:0;width:40%;left:-40%;
    background:linear-gradient(90deg,transparent,rgba(255,255,255,.85),transparent);animation:alStripe 3.6s ease-in-out infinite;}
@keyframes alStripe{0%,55%{left:-40%}90%,100%{left:110%}}
.al-z1{transform:translateZ(40px)} .al-z2{transform:translateZ(24px)}
.al-login__head{margin-bottom:15px;}
.al-login__ceyebrow{font-size:10px;letter-spacing:3.4px;text-transform:uppercase;color:var(--al-acc);font-weight:700;margin-bottom:9px;}
.al-login__head h2{font-size:24px;font-weight:800;letter-spacing:.2px;}
.al-login__head p{margin-top:6px;font-size:12.5px;color:var(--al-text-2);line-height:1.5;}
.al-login__err{display:none;align-items:flex-start;gap:9px;margin-bottom:16px;padding:11px 14px;border-radius:11px;
    background:rgba(239,68,68,.12);border:1px solid rgba(239,68,68,.34);color:#fca5a5;font-size:12.5px;line-height:1.45;flex-wrap:wrap;}
.al-login__err i{margin-top:1px;flex:0 0 auto;}
.al-login__err small{flex-basis:100%;opacity:.6;font-size:10px;letter-spacing:.5px;}

/* ── fields ── */
.al-field{position:relative;margin-bottom:11px;}
.al-field input{width:100%;font:inherit;font-size:14.5px;color:var(--al-text);background:rgba(255,255,255,.045);
    border:1px solid var(--al-line);border-radius:11px;padding:21px 15px 8px;outline:none;
    transition:border-color .25s,box-shadow .25s,background .25s;}
.al-field input:focus{background:rgba(255,255,255,.07);border-color:rgba(var(--al-acc-rgb),.65);
    box-shadow:0 0 0 3px rgba(var(--al-acc-rgb),.14),0 0 26px rgba(var(--al-acc-rgb),.1);}
.al-field label{position:absolute;left:15px;top:15px;font-size:13.5px;color:var(--al-text-3);pointer-events:none;
    transition:all .18s;letter-spacing:.2px;}
.al-field input:focus + label,.al-field input:not(:placeholder-shown) + label{
    top:7px;font-size:10px;letter-spacing:1.4px;text-transform:uppercase;color:var(--al-acc);}
.al-field__toggle{position:absolute;right:11px;top:23px;background:none;border:0;color:var(--al-text-3);
    cursor:pointer;font-size:10px;letter-spacing:1.4px;font-weight:700;padding:6px;}
.al-field__toggle:hover{color:var(--al-text-2);}
.al-login__aux{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:2px 0 12px;}
.al-remember{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--al-text-2);cursor:pointer;user-select:none;}
.al-remember input{appearance:none;width:34px;height:19px;border-radius:999px;background:rgba(255,255,255,.1);
    border:1px solid var(--al-line);position:relative;cursor:pointer;transition:background .25s;flex:0 0 auto;}
.al-remember input::after{content:"";position:absolute;top:2px;left:2px;width:13px;height:13px;border-radius:50%;background:#8a9080;transition:all .25s;}
.al-remember input:checked{background:rgba(var(--al-acc-rgb),.55);border-color:var(--al-acc);}
.al-remember input:checked::after{left:17px;background:#fff;}
.al-link{font-size:12px;color:var(--al-text-2);text-decoration:none;transition:color .2s;}
.al-link:hover{color:var(--al-acc);}

/* ── tachometer (revs on type) ── */
.al-gauge-row{display:flex;align-items:center;gap:15px;margin-bottom:16px;padding:11px 14px;
    border:1px solid var(--al-line);border-radius:12px;background:rgba(255,255,255,.028);}
.al-gauge{flex:0 0 auto;width:82px;height:52px;position:relative;}
.al-gauge svg{width:100%;height:100%;overflow:visible;}
.al-gauge .arc-bg{stroke:rgba(255,255,255,.1);stroke-width:7;fill:none;stroke-linecap:round;}
.al-gauge .arc-red{stroke:rgba(239,68,68,.55);stroke-width:7;fill:none;stroke-linecap:round;}
.al-gauge .arc-val{stroke:var(--al-acc);stroke-width:7;fill:none;stroke-linecap:round;
    filter:drop-shadow(0 0 5px rgba(var(--al-acc-rgb),.5));transition:stroke-dashoffset .28s cubic-bezier(.22,.61,.36,1);}
.al-gauge .rpm-num{position:absolute;left:0;right:0;bottom:-2px;text-align:center;
    font-family:"SF Mono",Consolas,monospace;font-size:12px;font-weight:700;color:var(--al-text);letter-spacing:.5px;}
.al-gauge-meta .t1{font-size:9.5px;letter-spacing:2.2px;text-transform:uppercase;color:var(--al-text-3);margin-bottom:3px;}
.al-gauge-meta .t2{font-size:12px;color:var(--al-text-2);line-height:1.4;}
.al-gauge-meta .t2 b{color:var(--al-text);}

/* ── ignition button ── */
.al-ignite{position:relative;width:100%;font:inherit;font-size:13.5px;font-weight:800;letter-spacing:2.6px;text-transform:uppercase;
    color:var(--al-ink);cursor:pointer;background:linear-gradient(180deg,#fff08a,var(--al-acc) 55%,#cbb400);
    border:0;border-radius:12px;padding:16px 18px;overflow:hidden;
    box-shadow:0 10px 28px -8px rgba(var(--al-acc-rgb),.5),inset 0 1px 0 rgba(255,255,255,.5),inset 0 -2px 0 rgba(0,0,0,.18);
    transition:transform .15s,box-shadow .25s,filter .2s;}
.al-ignite:hover{filter:brightness(1.05);box-shadow:0 16px 38px -8px rgba(var(--al-acc-rgb),.6),inset 0 1px 0 rgba(255,255,255,.5),inset 0 -2px 0 rgba(0,0,0,.18);}
.al-ignite:active{transform:translateY(1px) scale(.995);}
.al-ignite__sheen{position:absolute;top:0;bottom:0;width:60px;left:-90px;transform:skewX(-20deg);
    background:linear-gradient(100deg,transparent,rgba(255,255,255,.6),transparent);animation:alSheen 4.5s ease-in-out infinite;}
@keyframes alSheen{0%,72%{left:-90px}88%,100%{left:130%}}
.al-ignite__lbl{position:relative;z-index:1;}
.al-ignite.is-busy{pointer-events:none;filter:saturate(.55) brightness(.92);}
.al-status{margin-top:12px;min-height:16px;text-align:center;font-family:"SF Mono",Consolas,monospace;
    font-size:10.5px;letter-spacing:1.5px;color:var(--al-text-3);text-transform:uppercase;}
.al-status.err{color:#fca5a5;} .al-status.accent{color:var(--al-acc);} .al-status.ok{color:#4ade80;}
.al-login__cfoot{margin-top:18px;padding-top:15px;border-top:1px solid var(--al-line);font-size:11.5px;color:var(--al-text-3);}
.al-login__cfoot a{color:var(--al-text-2);text-decoration:none;transition:color .2s;} .al-login__cfoot a:hover{color:var(--al-acc);}

/* ── ticker (rich: vehicle + HP) ── */
.al-ticker-wrap{display:flex;align-items:center;gap:16px;border-top:1px solid var(--al-line);
    padding:11px clamp(18px,5vw,44px);background:rgba(4,5,3,.4);overflow:hidden;
    opacity:0;animation:alUp .7s .3s ease both;}
.al-ticker-label{flex:0 0 auto;font-size:9.5px;letter-spacing:2.4px;text-transform:uppercase;color:var(--al-acc);font-weight:700;
    padding-right:16px;border-right:1px solid var(--al-line);white-space:nowrap;}
.al-ticker{flex:1 1 auto;overflow:hidden;white-space:nowrap;
    -webkit-mask-image:linear-gradient(90deg,transparent,#000 4%,#000 94%,transparent);
    mask-image:linear-gradient(90deg,transparent,#000 4%,#000 94%,transparent);}
.al-ticker-run{display:inline-block;font-family:"SF Mono",Consolas,"Liberation Mono",monospace;
    font-size:11px;letter-spacing:1px;color:var(--al-text-3);animation:alTicker 60s linear infinite;}
.al-ticker-run .v{color:var(--al-text-2);}
.al-ticker-run .hp{color:var(--al-acc);font-weight:700;}
.al-ticker-run .sep{color:var(--al-text-3);margin:0 14px;}
.al-ticker-run .dot{color:var(--al-acc);}
@keyframes alTicker{from{transform:translateX(0)}to{transform:translateX(-50%)}}

@keyframes alUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}

/* ── register extras (2-col rows, select, b2b, scroll) ── */
.al-login__card--reg{max-height:90vh;overflow-y:auto;scrollbar-width:thin;}
.al-login__card--reg::-webkit-scrollbar{width:8px;}
.al-login__card--reg::-webkit-scrollbar-thumb{background:rgba(var(--al-acc-rgb),.3);border-radius:8px;}
.al-row{display:flex;gap:10px;}
.al-row>*{flex:1 1 0;min-width:0;}
.al-row--82>*:first-child{flex:2 1 0;} .al-row--82>*:last-child{flex:1 1 0;}
.al-field select{width:100%;font:inherit;font-size:14px;color:var(--al-text);background:rgba(255,255,255,.045);
    border:1px solid var(--al-line);border-radius:11px;padding:20px 15px 7px;outline:none;appearance:none;color-scheme:dark;
    transition:border-color .25s,box-shadow .25s;}
.al-field select:focus{border-color:rgba(var(--al-acc-rgb),.65);box-shadow:0 0 0 3px rgba(var(--al-acc-rgb),.14);}
.al-field select option{background:#15150e;color:#f2f3e8;}
.al-field select + label{top:6px;font-size:10px;letter-spacing:1.4px;text-transform:uppercase;color:var(--al-acc);}
.al-b2b{display:flex;gap:10px;align-items:flex-start;margin:2px 0 14px;padding:11px 13px;border-radius:11px;
    background:rgba(var(--al-acc-rgb),.05);border:1px solid rgba(var(--al-acc-rgb),.25);font-size:11.5px;color:var(--al-text-2);line-height:1.45;}
.al-b2b input{margin-top:2px;flex:0 0 auto;accent-color:var(--al-acc);}

/* ── centered single-card variant (forgot / reset password) ── */
.al-login--center .al-login__stage{justify-content:center;}
.al-login--center .al-login__card-wrap{width:min(440px,100%);margin:0 auto;}
/* success banner (session status) */
.al-login__ok{display:flex;align-items:flex-start;gap:9px;margin-bottom:16px;padding:11px 14px;border-radius:11px;
    background:rgba(34,197,94,.12);border:1px solid rgba(34,197,94,.34);color:#86efac;font-size:12.5px;line-height:1.45;}
.al-login__ok i{margin-top:1px;flex:0 0 auto;}
[data-bs-theme="light"] .al-login__ok,body.light-mode .al-login__ok{background:rgba(22,163,74,.1);border-color:rgba(22,163,74,.3);color:#15803d;}

/* ── responsive ── */
/* ≤991px: form-focused single screen. The big left showcase is desktop-only;
   the brand + Alientech dealer stay in the HUD so nothing important is lost. */
@media (max-width:991.98px){
    .al-login__stage{flex-direction:column;align-items:center;justify-content:center;padding-top:0;}
    .al-login__intro{display:none;}
    .al-login__card-wrap{order:1;width:100%;max-width:420px;margin:0 auto;}
    .al-login__card{transform:none !important;}
    .al-login__card--reg{max-height:none;}
}
@media (max-width:575.98px){
    .al-login__dealer{display:none;} .al-login__title{font-size:30px;} .al-ticker-label{display:none;}
    .al-login__brand img{max-height:52px;max-width:74vw;}
}
@media (prefers-reduced-motion:reduce){
    .al-streak,.al-ember,.al-ignite__sheen,.al-ticker-run,.al-login__stripe::after,.al-login__eyebrow::before,
    .al-mesh,.al-sweep,.al-aurora{animation:none !important;}
    .al-sweep{opacity:0 !important;}
    .al-login__card{transition:none;transform:none !important;}
    .al-login__hud,.al-login__intro,.al-login__card-wrap,.al-ticker-wrap{animation:none !important;opacity:1;}
}
body[data-perf-tier="saver"] .al-streak,
body[data-perf-tier="saver"] .al-ember,
body[data-perf-tier="saver"] .al-ignite__sheen,
body[data-perf-tier="saver"] .al-ticker-run,
body[data-perf-tier="saver"] .al-mesh,
body[data-perf-tier="saver"] .al-aurora,
body[data-perf-tier="saver"] .al-login__stripe::after{animation:none !important;}
body[data-perf-tier="saver"] .al-sweep{display:none !important;}

/* ════════════════════════════════════════════════════════════════════════════
   LIGHT / WHITE MODE (theme toggle). Dual selector: html[data-bs-theme="light"]
   (the toggle target) + body.light-mode (legacy). Dark text on frosted-white
   surfaces; button + racing stripe stay acid-yellow; accent TEXT uses a darker
   gold for WCAG contrast on white; the Alientech logo tiles stay dark so the
   yellow wordmark keeps its punch.
   ════════════════════════════════════════════════════════════════════════════ */
[data-bs-theme="light"] .al-login,
body.light-mode .al-login{
    --al-text:#17190f; --al-text-2:#454838; --al-text-3:#6f7360;
    --al-line:rgba(0,0,0,.12); --al-surface:rgba(255,255,255,.86); color:#17190f !important;
}
/* WHITE MODE. The CLIENT'S photo stays IN COLOUR — the "black & white" Ionut asked
   for was for the ALIENTECH LOGOS, NOT the client's background photo. The photo lives
   in .ts-login-scene (body-level, BELOW this scrim). Scrim keeps the LEFT text column +
   RIGHT card zone light for readable dark text; the colour photo shows through the centre.
   ZERO ambient colour FX in light mode (aurora/embers/streaks off) for a clean light UI. */
[data-bs-theme="light"] .ts-login-scene__sky,
body.light-mode .ts-login-scene__sky{filter:brightness(1.04) saturate(1.05) !important;}
/* the ALIENTECH dealer logos DO go BLACK & WHITE in light mode (grayscale, lifted so the
   wordmark stays legible on its dark tile). MMT's own brand logo is untouched. */
[data-bs-theme="light"] .al-login__dealer img,[data-bs-theme="light"] .al-login__dealer-band img,
body.light-mode .al-login__dealer img,body.light-mode .al-login__dealer-band img{filter:grayscale(1) brightness(1.2) contrast(1.05) !important;}
[data-bs-theme="light"] .ts-login-scene__overlay,
body.light-mode .ts-login-scene__overlay{background:linear-gradient(180deg,rgba(250,250,252,.03),rgba(248,249,251,.1)) !important;}
[data-bs-theme="light"] .ts-login-scene>div:not([class]),
body.light-mode .ts-login-scene>div:not([class]){box-shadow:inset 0 0 180px 50px rgba(255,255,255,.4) !important;}
[data-bs-theme="light"] .al-login__scrim,
body.light-mode .al-login__scrim{
    background:
      linear-gradient(90deg, rgba(248,249,251,.96) 0%, rgba(248,249,251,.92) 21%, rgba(248,249,251,.52) 34%, rgba(248,249,251,.22) 52%, rgba(248,249,251,.46) 70%, rgba(248,249,251,.92) 100%),
      linear-gradient(180deg, rgba(248,249,251,.5) 0%, rgba(248,249,251,.1) 44%, rgba(248,249,251,.42) 100%);}
[data-bs-theme="light"] .al-login__scrim::after,
body.light-mode .al-login__scrim::after{box-shadow:inset 0 0 22vmax rgba(255,255,255,.22);}
/* B&W means NO colour FX in light mode — kill every ambient layer */
[data-bs-theme="light"] .al-mesh,body.light-mode .al-mesh,
[data-bs-theme="light"] .al-aurora,body.light-mode .al-aurora,
[data-bs-theme="light"] .al-sweep,body.light-mode .al-sweep,
[data-bs-theme="light"] .al-streak,body.light-mode .al-streak,
[data-bs-theme="light"] .al-ember,body.light-mode .al-ember{display:none !important;}
/* intro (left) — crisp dark text with a firm white halo so it reads over the B&W photo */
[data-bs-theme="light"] .al-login__eyebrow,
body.light-mode .al-login__eyebrow{color:#6b5a00;text-shadow:0 1px 3px rgba(255,255,255,.9);}
[data-bs-theme="light"] .al-login__title,
body.light-mode .al-login__title{color:#0e0f0a;text-shadow:0 1px 2px rgba(255,255,255,.95),0 2px 10px rgba(255,255,255,.7);}
/* keep the AUTHENTIC Alientech yellow on "ECU File Service" in light mode too — only add a
   thin dark outline (via layered shadows) so the yellow stays legible on the light surface.
   The colour is NOT changed (Ionut: don't recolour the Alientech yellow). */
[data-bs-theme="light"] .al-login__title span,
body.light-mode .al-login__title span{color:var(--al-acc);
    text-shadow:0 1px 2px rgba(0,0,0,.6),1px 0 1px rgba(0,0,0,.5),-1px 0 1px rgba(0,0,0,.5),0 -1px 1px rgba(0,0,0,.5),0 3px 12px rgba(0,0,0,.35);}
[data-bs-theme="light"] .al-login__lead,
body.light-mode .al-login__lead{color:#26281e;text-shadow:0 1px 3px rgba(255,255,255,.9);}
/* HUD brand */
[data-bs-theme="light"] .al-login__brand-txt b,
body.light-mode .al-login__brand-txt b{color:#17190f;}
/* card */
[data-bs-theme="light"] .al-login__card,
body.light-mode .al-login__card{background:var(--al-surface);border-color:rgba(0,0,0,.1);
    box-shadow:0 30px 70px -24px rgba(0,0,0,.32),0 1px 0 rgba(255,255,255,.7) inset;}
[data-bs-theme="light"] .al-login__ceyebrow,
body.light-mode .al-login__ceyebrow{color:#7a6600;}
[data-bs-theme="light"] .al-login__head h2,
body.light-mode .al-login__head h2{color:#17190f;}
[data-bs-theme="light"] .al-login__head p,
body.light-mode .al-login__head p{color:#454838;}
/* inputs + selects */
[data-bs-theme="light"] .al-field input,[data-bs-theme="light"] .al-field select,
body.light-mode .al-field input,body.light-mode .al-field select{background:rgba(0,0,0,.04);border-color:rgba(0,0,0,.15);color:#17190f;color-scheme:light;}
[data-bs-theme="light"] .al-field input:focus,[data-bs-theme="light"] .al-field select:focus,
body.light-mode .al-field input:focus,body.light-mode .al-field select:focus{background:rgba(0,0,0,.055);border-color:#b89e00;box-shadow:0 0 0 3px rgba(184,158,0,.2);}
[data-bs-theme="light"] .al-field label,
body.light-mode .al-field label{color:#6f7360;}
[data-bs-theme="light"] .al-field input:focus + label,[data-bs-theme="light"] .al-field input:not(:placeholder-shown) + label,[data-bs-theme="light"] .al-field select + label,
body.light-mode .al-field input:focus + label,body.light-mode .al-field input:not(:placeholder-shown) + label,body.light-mode .al-field select + label{color:#7a6600;}
[data-bs-theme="light"] .al-field select option,
body.light-mode .al-field select option{background:#fff;color:#17190f;}
[data-bs-theme="light"] .al-field__toggle,
body.light-mode .al-field__toggle{color:#6f7360;}
/* remember + links + footer */
[data-bs-theme="light"] .al-remember,body.light-mode .al-remember{color:#454838;}
[data-bs-theme="light"] .al-remember input,body.light-mode .al-remember input{background:rgba(0,0,0,.12);border-color:rgba(0,0,0,.15);}
[data-bs-theme="light"] .al-remember input::after,body.light-mode .al-remember input::after{background:#6f7360;}
[data-bs-theme="light"] .al-link,body.light-mode .al-link{color:#454838;}
[data-bs-theme="light"] .al-link:hover,body.light-mode .al-link:hover{color:#7a6600;}
[data-bs-theme="light"] .al-login__cfoot,body.light-mode .al-login__cfoot{color:#6f7360;border-color:rgba(0,0,0,.1);}
[data-bs-theme="light"] .al-login__cfoot a,body.light-mode .al-login__cfoot a{color:#454838;}
[data-bs-theme="light"] .al-login__cfoot a:hover,body.light-mode .al-login__cfoot a:hover{color:#7a6600;}
[data-bs-theme="light"] .al-b2b,body.light-mode .al-b2b{color:#454838;}
/* ticker */
[data-bs-theme="light"] .al-ticker-wrap,body.light-mode .al-ticker-wrap{background:rgba(247,247,242,.78);border-color:rgba(0,0,0,.1);}
[data-bs-theme="light"] .al-ticker-run,body.light-mode .al-ticker-run{color:#6f7360;}
[data-bs-theme="light"] .al-ticker-run .v,body.light-mode .al-ticker-run .v{color:#3c4030;}
[data-bs-theme="light"] .al-ticker-run .hp,body.light-mode .al-ticker-run .hp{color:#7a6600;}
[data-bs-theme="light"] .al-ticker-label,body.light-mode .al-ticker-label{color:#7a6600;border-color:rgba(0,0,0,.1);}
/* Alientech logo tiles stay DARK so the yellow wordmark keeps contrast */
[data-bs-theme="light"] .al-login__dealer,body.light-mode .al-login__dealer{background:rgba(18,20,12,.9);color:#d8dccb;border-color:rgba(0,0,0,.25);}
[data-bs-theme="light"] .al-login__dealer-band,body.light-mode .al-login__dealer-band{background:rgba(18,20,12,.82);border-color:rgba(var(--al-acc-rgb),.4);}
[data-bs-theme="light"] .al-login__dealer-band span,body.light-mode .al-login__dealer-band span{color:#d8dccb;}
[data-bs-theme="light"] .al-login__dealer-band b,body.light-mode .al-login__dealer-band b{color:#fff;}