/* Shared ANNPHAR portal login; only active while the sign-in form is visible. */
.portal-brand { display: none; }
body:has(#login:not([hidden])) { min-height: 100vh; background: #fff; }
body:has(#login:not([hidden])) > header { display: none; }
body:has(#login:not([hidden])) .portal-brand { display: flex; flex-direction: column; justify-content: center; padding: 8vw; color: #fff; background: radial-gradient(ellipse at 72% 18%, #1d5989 0%, #103c64 42%, #092441 100%); }
.portal-brand .brand-name { font-size: 23px; font-weight: 750; letter-spacing: .09em; }
.portal-brand .brand-copy { margin-top: clamp(52px, 12vh, 130px); }
.portal-brand h1 { font-size: clamp(34px, 4.2vw, 58px); line-height: 1.25; letter-spacing: .03em; margin: 0 0 22px; font-weight: 600; }
.portal-brand p { color: #c6dbec; font-size: 15px; letter-spacing: .05em; }
body:has(#login:not([hidden])) > main { margin: 0; max-width: none; width: 100%; display: flex; flex-direction: column; justify-content: center; padding: 40px clamp(30px, 8vw, 120px); }
body:has(#login:not([hidden])) #message, body:has(#login:not([hidden])) #login { width: 100%; max-width: 390px; margin-left: auto; margin-right: auto; }
body:has(#login:not([hidden])) #login { border: 0; box-shadow: none; padding: 0; border-radius: 0; }
#login h2 { font-size: 27px; color: #173251; margin-bottom: 12px; }
#login p { color: #738398; font-size: 14px; margin-bottom: 34px; }
#login label { font-size: 14px; color: #3b536d; margin: 20px 0; }
#login input { min-height: 50px; border-color: #ccd7e3; background: #fff; }
#login .primary { min-height: 50px; background: #1d69d7; border-color: #1d69d7; margin-top: 10px; }
#login input:focus-visible, #login button:focus-visible { outline: 3px solid #83afe8; outline-offset: 2px; }
@media (min-width: 800px) {
 body:has(#login:not([hidden])) { display: grid; grid-template-columns: minmax(0, 1fr) minmax(440px, 1fr); }
 body:has(#login:not([hidden])) .portal-brand { min-height: 100vh; }
}
@media (max-width: 799px) {
 body:has(#login:not([hidden])) .portal-brand { min-height: 235px; padding: 34px 25px 30px; }
 .portal-brand .brand-name { font-size: 19px; }
 .portal-brand .brand-copy { margin-top: 38px; }
 .portal-brand h1 { font-size: 30px; margin-bottom: 10px; }
 .portal-brand p { font-size: 13px; margin-bottom: 0; }
 body:has(#login:not([hidden])) > main { padding: 36px 24px; }
 #login h2 { font-size: 24px; }
 #login p { margin-bottom: 24px; }
}
/* The language switcher is injected as the first body child, so place it outside the desktop grid. */
body:has(#login:not([hidden])) > .language-bar { background: transparent; }
body:has(#login:not([hidden])) > .language-bar #languagePreview { display: none; }
@media (min-width: 800px) {
 body:has(#login:not([hidden])) { position: relative; grid-template-rows: minmax(100vh, auto); }
 body:has(#login:not([hidden])) > .portal-brand { grid-column: 1; grid-row: 1; }
 body:has(#login:not([hidden])) > main { grid-column: 2; grid-row: 1; }
 body:has(#login:not([hidden])) > .language-bar { position: absolute; top: 22px; right: 26px; }
}
@media (max-width: 799px) {
 body:has(#login:not([hidden])) > .language-bar { justify-content: flex-end; background: #fff; }
}
