/* Login page: animated sunset highway */
:root{--brand:#29abe2;--brand-dark:#1689bd;--card:rgba(9,18,33,.82)}
*{box-sizing:border-box}
html,body{margin:0;height:100%;font-family:'Source Sans Pro',sans-serif;overflow:hidden;background:#0b1e3a}

.login-scene{position:fixed;inset:0}
.login-scene svg{width:100%;height:100%;display:block}

@keyframes drift{from{transform:translateX(-300px)}to{transform:translateX(1900px)}}
@keyframes drive{from{transform:translateX(-560px)}to{transform:translateX(2100px)}}
@keyframes slide{from{transform:translateX(0)}to{transform:translateX(-1600px)}}
@keyframes dash{to{stroke-dashoffset:-160}}
@keyframes glow{0%,100%{opacity:.55}50%{opacity:.85}}
.cloud{animation:drift linear infinite}
.hills-far{animation:slide 90s linear infinite}
.hills-near{animation:slide 45s linear infinite}
.lane{stroke-dasharray:80 80;animation:dash .9s linear infinite}
.truck-r{animation:drive 18s linear infinite}
.truck-r2{animation:drive 18s linear infinite;animation-delay:-9s}
.truck-l{animation:drive 20s linear infinite;animation-delay:-4s}
.sunglow{animation:glow 5s ease-in-out infinite}
@media (prefers-reduced-motion: reduce){
  .cloud,.hills-far,.hills-near,.lane,.truck-r,.truck-r2,.truck-l,.sunglow,.rt-spin{animation:none!important}
}

.login-tagline{position:absolute;left:7vw;top:12vh;color:#fff;z-index:2;text-shadow:0 2px 12px rgba(0,0,0,.4)}
.login-tagline h1{font-size:44px;margin:0;font-weight:700;letter-spacing:.5px}
.login-tagline p{font-size:18px;margin:6px 0 0;opacity:.9}

.login-wrap{position:relative;z-index:2;height:100%;display:flex;align-items:center;justify-content:flex-end;padding:0 7vw}
.login-card{width:400px;max-width:100%;background:var(--card);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.08);border-radius:18px;padding:30px 34px 26px;color:#e8eef6;box-shadow:0 20px 60px rgba(0,0,0,.45)}
.login-logo{display:block;width:180px;margin:0 auto 6px;filter:drop-shadow(0 4px 14px rgba(41,171,226,.25))}
.login-sub{text-align:center;color:#9fb3c8;font-size:14px;margin-bottom:20px}

.login-field{position:relative;margin-bottom:14px}
.login-field > i{position:absolute;left:14px;top:23px;transform:translateY(-50%);color:#6f8aa6}
.login-field input{width:100%;height:46px;border-radius:10px;border:1px solid #24364f;background:#0e1b2e;color:#fff;padding:0 14px 0 40px;font-size:15px;font-family:inherit;outline:none;transition:border .2s,box-shadow .2s}
.login-field input::placeholder{color:#6f8aa6}
.login-field input:focus{border-color:var(--brand);box-shadow:0 0 0 3px rgba(41,171,226,.2)}
.login-field input.parsley-error{border-color:#e5534b}
.parsley-errors-list{list-style:none;margin:4px 0 0;padding:0;font-size:12px;color:#ff8a80}

.login-row{display:flex;justify-content:space-between;align-items:center;font-size:13px;color:#9fb3c8;margin:4px 0 18px}
.login-row label{cursor:pointer;display:flex;align-items:center;gap:6px;margin:0}
.login-btn{width:100%;height:46px;border:0;border-radius:10px;background:linear-gradient(90deg,var(--brand),var(--brand-dark));color:#fff;font-size:16px;font-weight:600;font-family:inherit;cursor:pointer;box-shadow:0 8px 20px rgba(41,171,226,.35);transition:filter .2s}
.login-btn:hover{filter:brightness(1.08)}
.login-btn:disabled{opacity:.7;cursor:wait}

#dvResponse .alert{position:relative;background:rgba(229,83,75,.15);border:1px solid rgba(229,83,75,.5);color:#ffb4ae;border-radius:10px;padding:10px 34px 10px 12px;font-size:14px;margin-bottom:14px}
#dvResponse .close{position:absolute;right:10px;top:6px;background:none;border:0;color:#ffb4ae;font-size:20px;cursor:pointer;line-height:1}

.login-footer{position:fixed;bottom:0;left:0;right:0;z-index:3;padding:8px 18px;font-size:13px;color:#c5d3e0;text-align:right;background:linear-gradient(transparent,rgba(0,0,0,.5))}
.login-footer a{color:var(--brand);text-decoration:none}

@media (max-width: 900px){
  .login-tagline{display:none}
  .login-wrap{justify-content:center;padding:0 16px 120px}
}
@media (max-height: 640px){
  .login-wrap{align-items:flex-start;padding-top:24px}
  .login-tagline{display:none}
}
