.account-page { background:#f5f8fb; }
.login-language-options { display:flex; align-items:center; justify-content:flex-end; gap:6px; margin-bottom:26px; }
.login-language-options>svg { width:16px; height:16px; color:#718b9d; margin-inline-end:4px; }
.login-language-options a { display:inline-flex; align-items:center; min-height:40px; padding:8px 12px; border-radius:7px; color:#637d90; font-size:13px; font-weight:500; }
.login-language-options a:hover,.login-language-options a[aria-current=true] { background:#e7f1f5; color:#195c75; }
.portal-login { min-height:100vh; min-height:100svh; display:grid; grid-template-columns:1fr 1fr; color:#193c51; font-weight:500; }
.portal-login * { box-sizing:border-box; }
.portal-login h1,.portal-login h2,.portal-login p { margin:0; }
.portal-login svg { width:19px; height:19px; stroke-width:1.7; flex-shrink:0; }
.login-brand { position:relative; overflow:hidden; display:flex; flex-direction:column; padding:40px clamp(32px,6vw,100px); background:radial-gradient(ellipse at 15% 95%,#257b92 0,transparent 65%),#164e65; color:#fff; }
.login-brand-logo { display:inline-block; align-self:flex-start; margin-bottom:55px; }
.login-brand-logo img { width:auto; max-width:155px; max-height:65px; filter:brightness(0) invert(1); }
.portal-login .login-eyebrow { display:block; font-size:11px; letter-spacing:1.5px; font-weight:600; text-transform:uppercase; line-height:1.8; }
.login-brand-copy { position:relative; z-index:1; max-width:470px; animation:login-enter 420ms ease backwards; }
.login-brand .login-eyebrow { color:#bad9e4; }
.login-brand h1 { color:#fff; font-size:clamp(32px,3vw,47px); font-weight:700; line-height:1.3; margin:15px 0 20px; letter-spacing:-1px; }
.login-brand-copy p { font-size:16px; font-weight:400; line-height:1.9; color:#d4e7ef; max-width:390px; }
.login-billboard { position:relative; width:min(100%,360px); margin:40px auto 20px; padding:0 15px; direction:ltr; animation:login-enter 500ms 80ms ease backwards; }
.billboard-frame { position:relative; min-height:180px; background:#f0f7fb; border:7px solid #8cb3c3; border-radius:6px; transform:rotate(-5deg); padding:22px 27px; box-shadow:14px 18px 0 #0b364a30; display:flex; justify-content:space-between; align-items:flex-end; }
.billboard-title { color:#195c75; font-size:43px; font-weight:800; letter-spacing:-2px; line-height:.8; }
.billboard-title span { display:block; font-size:12px; letter-spacing:2px; margin-top:13px; font-weight:600; }
.billboard-dot { position:absolute; top:13px; right:13px; width:8px; height:8px; background:#e6b46c; border-radius:50%; }
.billboard-lines { display:flex; gap:5px; align-items:flex-end; }
.billboard-lines i { display:block; height:37px; width:8px; border-radius:3px; background:#c0dbe7; }
.billboard-lines i:nth-child(2) { height:59px; background:#92bdcf; }
.billboard-lines i:nth-child(3) { height:82px; background:#4b8fa8; }
.billboard-legs { display:flex; justify-content:space-around; height:46px; }
.billboard-legs i { display:block; background:#95bac8; width:9px; height:46px; }
.billboard-floor { height:1px; background:#c2dfe83b; }
.billboard-caption { display:block; text-align:center; margin-top:18px; font-size:10px; letter-spacing:3px; color:#afd2df; }
.login-brand-features { margin-top:auto; padding-top:26px; display:flex; gap:20px; flex-wrap:wrap; position:relative; }
.login-brand-features span { display:flex; align-items:center; gap:7px; font-size:12px; color:#d3e5ec; font-weight:400; }
.login-brand-features svg { width:15px; height:15px; }
.login-form-side { display:flex; align-items:center; justify-content:center; padding:48px 36px; background:#f8fafc; }
.login-form-card { width:100%; max-width:395px; animation:login-enter 400ms ease backwards; }
.login-mobile-logo { display:none; }
.login-welcome-icon { display:grid; place-items:center; width:54px; height:54px; background:#e7f1f5; color:#19677f; border:1px solid #d9e8ef; border-radius:15px; margin-bottom:25px; }
.login-welcome-icon svg { width:24px; height:24px; }
.login-form-card>.login-eyebrow { color:#658496; margin-bottom:9px; }
.login-form-card h2 { font-size:34px; color:#18394d; font-weight:700; line-height:1.3; letter-spacing:-.6px; }
.login-form-card .login-intro { font-size:15px; font-weight:400; color:#6c8294; margin-top:12px; line-height:1.8; }
#portal-login-form { margin-top:32px; }
.login-field { margin-bottom:22px; animation:login-enter 350ms ease backwards; }
.login-field:nth-of-type(2) { animation-delay:60ms; }
.login-field label { display:block; font-size:14px; font-weight:600; color:#37546a; margin-bottom:8px; }
.login-input-wrap { position:relative; }
.login-input-wrap>svg { position:absolute; inset-inline-start:15px; top:16px; color:#8aa0b0; width:18px; height:18px; pointer-events:none; }
.login-input-wrap input { width:100%; height:51px; border:1px solid #cfdee8; border-radius:9px; padding:12px 45px; background:#fff; color:#233f54; font-size:15px; font-weight:500; outline:none; transition:border-color 150ms,box-shadow 150ms; }
.login-input-wrap input::placeholder { color:#9aabb8; font-weight:400; }
.login-input-wrap input:focus { border-color:#4b90a9; box-shadow:0 0 0 3px #19677f0c; }
.login-input-wrap input[aria-invalid=true] { border-color:#d58d8d; }
.login-password-toggle { position:absolute; inset-inline-end:7px; top:7px; width:37px; height:37px; display:grid; place-items:center; background:transparent; color:#718b9d; border:0; border-radius:6px; cursor:pointer; }
.login-password-toggle:hover { background:#edf4f7; color:#195c75; }
.login-password-toggle span { display:flex; }
.portal-login [hidden] { display:none!important; }
.login-submit { display:flex; align-items:center; justify-content:center; gap:12px; width:100%; border:0; border-radius:9px; min-height:50px; background:#19677f; color:#fff; font-size:16px; font-weight:600; cursor:pointer; transition:transform 140ms,background 140ms; animation:login-enter 350ms 100ms ease backwards; }
.login-submit:hover { background:#14566b; transform:translateY(-1px); }
.login-submit:active { transform:scale(.99); }
.login-security { display:flex; align-items:center; justify-content:center; gap:7px; color:#7a91a1; font-size:12px; font-weight:400; margin-top:18px!important; }
.login-security svg { width:14px; height:14px; }
.login-footer { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:5px; font-size:12px; font-weight:400; color:#8195a4; margin-top:48px; text-align:center; }
.login-footer a { color:#385e76; font-weight:600; }
.login-footer span { width:100%; margin-top:5px; }
.login-error { display:flex; align-items:flex-start; gap:9px; background:#fff0ef; border:1px solid #f0d5d2; color:#a4463f; padding:12px 14px; border-radius:9px; font-size:14px; line-height:1.7; margin-top:20px; }
.portal-login a:focus-visible,.portal-login button:focus-visible { outline:2px solid #5c9db5; outline-offset:3px; }
html[dir=rtl] .login-eyebrow { letter-spacing:0; }
html[dir=rtl] .login-brand h1 { letter-spacing:0; line-height:1.5; }
html[dir=rtl] .login-submit>svg { transform:rotate(180deg); }
@keyframes login-enter { from { opacity:.4; transform:translateY(9px); } to { opacity:1; transform:translateY(0); } }
@media(min-width:1600px) { .login-brand { padding-top:60px; padding-bottom:48px; }.login-brand-logo { margin-bottom:70px; }.login-billboard { margin-top:65px; margin-bottom:45px; } }
@media(max-width:991px) { .login-brand { padding:35px; }.login-brand h1 { font-size:33px; }.login-brand-logo { margin-bottom:40px; }.login-brand-features { gap:12px; }.login-form-side { padding:35px; }.login-billboard { padding:0; }.billboard-frame { padding:20px; }.billboard-title { font-size:36px; } }
@media(max-width:767px) { .portal-login { grid-template-columns:1fr; }.login-brand { display:none; }.login-form-side { min-height:100vh; min-height:100svh; padding:35px 24px; }.login-mobile-logo { display:block; max-height:68px; width:auto; max-width:155px; margin-bottom:35px; }.login-welcome-icon { display:none; }.login-form-card h2 { font-size:30px; }.login-footer { margin-top:35px; } }
@media(prefers-reduced-motion:reduce) { .portal-login *, .portal-login *::before,.portal-login *::after { animation:none!important; transition:none!important; }.login-submit:hover,.login-submit:active { transform:none; } }