/* Login-only presentation. Portal themes and authentication are unchanged. */
.crm-login-page.crm-login-cinematic{margin:0;min-height:100vh;min-height:100svh;display:flex;align-items:center;justify-content:flex-end;padding:40px clamp(28px,6vw,100px);background:#040811;color:#edf3ff;position:relative;isolation:isolate;font-family:Inter,"Segoe UI",Arial,sans-serif;color-scheme:dark;overflow-x:hidden}
.crm-login-cinematic .login-art{position:fixed;inset:0;z-index:-3;display:block;pointer-events:none}
.crm-login-cinematic .login-art img{display:block;width:100%;height:100%;object-fit:cover;object-position:center center}
@media(min-width:768px){.crm-login-page.crm-login-cinematic{background:linear-gradient(90deg,#010204 0%,#040811 48%,#081126 100%)}.crm-login-cinematic .login-art{inset:0;padding:0;background:transparent}.crm-login-cinematic .login-art img{position:absolute;left:0;top:50%;width:min(840px,65.625vw);height:min(560px,43.75vw,100svh);transform:translateY(-50%);object-fit:contain;object-position:left center;-webkit-mask-image:linear-gradient(90deg,#000 72%,transparent 100%),linear-gradient(180deg,transparent 0%,#000 5%,#000 93%,transparent 100%);mask-image:linear-gradient(90deg,#000 72%,transparent 100%),linear-gradient(180deg,transparent 0%,#000 5%,#000 93%,transparent 100%);-webkit-mask-composite:source-in;mask-composite:intersect}}
.crm-login-cinematic .login-ambient{position:fixed;inset:0;z-index:-2;pointer-events:none;background:linear-gradient(90deg,transparent 40%,#02071115 70%,#02071130)}
.crm-login-cinematic .crm-login-shell{position:relative;width:min(400px,100%);flex-shrink:0;border:1px solid #d3e3ff30;border-radius:24px;background:#08101e26;box-shadow:0 24px 65px #0003,inset 0 1px 0 #ffffff08;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
.crm-login-cinematic .crm-login-form-wrap{padding:34px;background:transparent;color:#edf3ff}
.crm-login-cinematic .crm-login-form-brand{display:flex;align-items:center;justify-content:center;margin-bottom:32px;min-height:64px}
.crm-login-cinematic .login-png-logo{display:block;width:64px;height:49px;overflow:hidden;background:transparent}
.crm-login-cinematic .login-png-logo img{display:block;width:300px;max-width:none;height:auto}
.crm-login-cinematic .form-label{font-size:12px;font-weight:500;color:#d4def0;margin-bottom:8px}
.crm-login-cinematic form>.mb-3{margin-bottom:20px!important}
.crm-login-cinematic .login-input-wrap{position:relative;border:1px solid #d0e1ff38;border-radius:12px;background:#07102030;transition:border-color .18s,background .18s,box-shadow .18s}
.crm-login-cinematic .login-input-wrap:hover{border-color:#d0e1ff66}
.crm-login-cinematic .login-input-wrap:focus-within{border-color:#88b1ff;background:#1b365828;box-shadow:0 0 0 3px #5687e31a}
.crm-login-cinematic .login-field-icon{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:#afc5e8;font-size:15px;pointer-events:none}
.crm-login-cinematic .form-control{min-height:48px;padding:12px 44px;border:0;border-radius:11px;background:transparent;color:#f1f5ff;font-size:13px;line-height:1.5;box-shadow:none}
.crm-login-cinematic .form-control::placeholder{color:#9eafcb;opacity:1}
.crm-login-cinematic .form-control:focus{background:transparent;border:0;box-shadow:none;color:#fff}
.crm-login-cinematic .was-validated .form-control:invalid,.crm-login-cinematic .was-validated .form-control:valid{padding-right:44px;background-image:none;box-shadow:none}
.crm-login-cinematic .was-validated .login-input-wrap:has(input:invalid){border-color:#e69a9a}
.crm-login-cinematic input:-webkit-autofill{-webkit-text-fill-color:#edf3ff;box-shadow:0 0 0 1000px #142139 inset;transition:background-color 9999s}
.crm-login-cinematic .crm-password-toggle{position:absolute;right:7px;top:50%;transform:translateY(-50%);display:grid;place-items:center;width:30px;height:30px;padding:0;border:0;border-radius:7px;background:transparent;color:#a8bddf;font-size:15px}
.crm-login-cinematic .crm-password-toggle:hover{color:#fff;background:#8cafff1a}
.crm-login-cinematic .form-check{margin:2px 0 24px!important;min-height:18px;padding-left:23px}
.crm-login-cinematic .form-check-label{display:block;line-height:18px;font-size:11px;color:#c0cee4}
.crm-login-cinematic .form-check-input{width:14px;height:14px;margin-top:2px;margin-left:-23px;border:1px solid #a5c4f366;border-radius:4px;background-color:#09122044;box-shadow:none}
.crm-login-cinematic .form-check-input:checked{background-color:#4e80e5;border-color:#4e80e5}
.crm-login-cinematic .login-submit{display:flex;align-items:center;justify-content:center;gap:8px;min-height:46px;border:1px solid #91b3ff50;border-radius:12px;background:linear-gradient(105deg,#397ee9e6,#645de5e6);color:#fff;font-size:13px;font-weight:600;box-shadow:0 8px 24px #326cdf20;transition:filter .15s,transform .15s}
.crm-login-cinematic .login-submit:hover{background:linear-gradient(105deg,#397ee9,#645de5);color:#fff;filter:brightness(1.08);transform:translateY(-1px)}
.crm-login-cinematic .alert-danger{color:#ffd5d5;background:#6d233366;border:1px solid #ed8da055;font-size:12px;border-radius:10px}
.crm-login-cinematic .invalid-feedback{color:#ffbaba;font-size:11px}
.crm-login-cinematic .was-validated .login-input-wrap:has(input:invalid)+.invalid-feedback{display:block}
.crm-login-cinematic button:focus-visible,.crm-login-cinematic .form-check-input:focus-visible{outline:2px solid #a6c4ff;outline-offset:3px}
@media(min-width:768px) and (max-height:600px){.crm-login-page.crm-login-cinematic{padding-top:20px;padding-bottom:20px}.crm-login-cinematic .crm-login-form-wrap{padding:26px}.crm-login-cinematic .crm-login-form-brand{margin-bottom:20px;min-height:50px}.crm-login-cinematic .login-main-logo{max-height:60px}.crm-login-cinematic form>.mb-3{margin-bottom:14px!important}}
@media(min-width:768px) and (max-width:991px){.crm-login-page.crm-login-cinematic{padding-left:28px;padding-right:28px}.crm-login-cinematic .crm-login-shell{width:360px}}
@media(max-width:767px){.crm-login-page.crm-login-cinematic{align-items:flex-start;justify-content:center;padding:32px 20px;min-height:100svh}.crm-login-cinematic .login-art img{object-position:center bottom}.crm-login-cinematic .login-ambient{background:linear-gradient(180deg,#02071110,#0207110a 55%,transparent)}.crm-login-cinematic .crm-login-shell{width:min(380px,100%);background:#08101e1c;border-radius:20px;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}.crm-login-cinematic .crm-login-form-wrap{padding:26px}.crm-login-cinematic .crm-login-form-brand{margin-bottom:24px;min-height:50px}.crm-login-cinematic .login-main-logo{max-width:200px;max-height:64px}.crm-login-cinematic .form-control{font-size:16px}}
@media(prefers-reduced-motion:reduce){.crm-login-cinematic .login-input-wrap,.crm-login-cinematic .login-submit{transition:none}.crm-login-cinematic .login-submit:hover{transform:none}}
/* Interaction polish is scoped exclusively to this login form. */
.crm-login-cinematic .crm-login-shell{background:linear-gradient(145deg,#9cbdff09,#08101e20);border-color:#b6d0ff38;box-shadow:0 24px 65px #0003,inset 0 1px 0 #ffffff10;animation:login-card-enter .6s cubic-bezier(.2,.7,.2,1) both;transition:border-color .25s,box-shadow .25s}
.crm-login-cinematic .crm-login-shell:focus-within{border-color:#96b9fa55;box-shadow:0 24px 65px #0003,0 0 35px #5288e808,inset 0 1px 0 #ffffff12}
.crm-login-cinematic .login-input-wrap{background:linear-gradient(110deg,#d0e1ff07,#07102020);border-color:#c1d6fa30}
.crm-login-cinematic .login-field-icon{left:10px;display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:#8eafff0b;color:#a9c2e9;transition:color .2s,background .2s}
.crm-login-cinematic .login-input-wrap:focus-within .login-field-icon{color:#c7dcff;background:#73a5ff20}
.crm-login-cinematic .form-control{padding-left:48px}
.crm-login-cinematic .crm-password-toggle{transition:color .2s,background .2s}
.crm-login-cinematic .login-submit{position:relative;overflow:hidden;transition:filter .2s,transform .2s,box-shadow .2s}
.crm-login-cinematic .login-submit:hover{box-shadow:0 10px 28px #477ae535}
.crm-login-cinematic .login-submit:active{transform:scale(.985)}
.crm-login-cinematic .login-submit i{transition:transform .2s}
.crm-login-cinematic .login-submit:hover i{transform:translateX(4px)}
.crm-login-cinematic .form-check-input{transition:background-color .2s,border-color .2s,box-shadow .2s}
.crm-login-cinematic .form-check-input:checked{box-shadow:0 0 0 3px #5687e318}
@keyframes login-card-enter{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.crm-login-cinematic .crm-login-shell{animation:none}.crm-login-cinematic .crm-login-shell,.crm-login-cinematic .login-field-icon,.crm-login-cinematic .crm-password-toggle,.crm-login-cinematic .form-check-input,.crm-login-cinematic .login-submit i{transition:none}.crm-login-cinematic .login-submit:active,.crm-login-cinematic .login-submit:hover i{transform:none}}
