/* The pharmacist portrait fills the desktop sign-in surface and becomes a banner on smaller screens. */
.auth-page .topbar{height:72px;padding:0 max(32px,calc((100vw - 1160px)/2));background:var(--canvas)}
.auth-page .guest-brand{font-size:1.125rem;font-weight:650;letter-spacing:-.025em;color:var(--ink)}
.auth-page .guest-cross{width:34px;height:34px;border-radius:9px;font-size:1.35rem}
.auth-page main{max-width:1224px;min-height:calc(100dvh - 136px);margin:0 auto;padding:20px 32px 32px;display:flex;align-items:center}
.login-shell{display:grid;grid-template-columns:minmax(0,500px) minmax(0,1fr);grid-template-rows:auto 1fr;width:100%;min-height:660px;overflow:hidden;border:1px solid var(--line);border-radius:16px;background:linear-gradient(90deg,#f8fbf8fa 0%,#f8fbf8ec 30%,#f8fbf88a 48%,#f8fbf800 68%),url('/images/login-pharmacist.png') center center/cover no-repeat;box-shadow:0 18px 55px #19344813}
.login-story{grid-column:1;grid-row:1;min-width:0;padding:30px 0 0 48px;color:#173d35}
.login-story-kicker{display:inline-flex;align-items:center;gap:9px;color:#326c56;font-size:.7rem;font-weight:750;letter-spacing:.095em}
.login-kicker-mark{width:8px;height:8px;border:2px solid currentColor;border-radius:2px;transform:rotate(45deg)}
.login-story h1{max-width:410px;margin:14px 0 8px;color:#173d35;font-size:clamp(1.8rem,2.4vw,2.1rem);font-weight:650;line-height:1.18;letter-spacing:-.04em}
.login-story-main>p{max-width:410px;margin:0;color:#45675d;font-size:.86rem;line-height:1.6}
.login-panel{grid-column:1;grid-row:2;align-self:start;display:flex;flex-direction:column;min-width:0;width:calc(100% - 70px);margin:17px 0 25px 48px;padding:22px 28px 20px;border:1px solid #d6e5dd;border-radius:12px;background:#ffffffed;box-shadow:0 16px 40px #173c3224;backdrop-filter:blur(10px)}
:root[data-theme=midnight] .login-panel{border-color:var(--line);background:var(--surface)}
.login-panel-heading{display:flex;align-items:center;gap:12px}
.login-panel-icon{display:grid;place-items:center;flex:none;width:39px;height:39px;border:1px solid var(--line);border-radius:9px;background:var(--accent-soft);color:var(--primary)}
.login-panel-icon .icon{width:19px;height:19px}
.login-panel-kicker{display:block;margin-bottom:3px;color:var(--primary);font-size:.65rem;font-weight:750;letter-spacing:.085em}
.login-panel h2{margin:0;color:var(--ink);font-size:1.22rem;font-weight:650;line-height:1.25;letter-spacing:-.03em}
.login-panel-intro{max-width:380px;margin:8px 0 0;color:var(--muted);font-size:.78rem;line-height:1.55}
.login-form{display:grid;gap:13px;margin-top:18px}
.login-field label{display:block;margin:0 0 6px;color:var(--ink);font-size:.75rem;font-weight:650}
.login-input-wrap{display:flex;align-items:center;min-height:46px;border:1px solid var(--line);border-radius:8px;background:var(--surface);transition:border-color .15s,box-shadow .15s}
.login-input-wrap:focus-within{border-color:var(--primary);box-shadow:0 0 0 3px var(--accent-soft)}
.login-input-wrap>.icon{flex:none;width:16px;height:16px;margin-left:13px;color:var(--muted)}
.login-input-wrap input{flex:1;min-width:0;width:100%;height:44px;margin:0;padding:0 10px;border:0;border-radius:8px;background:transparent;color:var(--ink);box-shadow:none;font-size:.86rem}
.login-input-wrap input:focus{outline:0;box-shadow:none}
.login-input-wrap input::placeholder{color:var(--muted);opacity:.75}
.login-password-toggle{display:grid;place-items:center;flex:none;width:38px;height:38px;margin-right:4px;padding:0;border:0;border-radius:6px;background:transparent;color:var(--muted)}
.login-password-toggle:hover,.login-password-toggle[aria-pressed=true]{background:var(--soft);color:var(--primary)}
.login-password-toggle .icon{width:18px;height:18px}
.login-submit{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:47px;margin-top:2px;padding:0 15px 0 18px;border:1px solid var(--primary);border-radius:8px;background:var(--primary);color:var(--on-primary);font-size:.84rem;font-weight:650;transition:background .15s,transform .15s}
.login-submit:hover{background:var(--hover);border-color:var(--hover)}
.login-submit:active{transform:translateY(1px)}
.login-submit .icon{width:18px;height:18px}
.login-guide-cover{display:flex;gap:13px;margin-top:17px;padding:16px;border:1px solid #315d70;border-radius:11px;background:linear-gradient(135deg,#173550,#0b625f);color:#fff;box-shadow:0 10px 22px #123d4b25}
.login-guide-cover-mark{display:grid;place-items:center;flex:none;width:37px;height:37px;border-radius:9px;background:#ffffff1f;color:#a4eee0;font-size:1.3rem;line-height:1}
.login-guide-cover-copy{min-width:0}
.login-guide-cover-kicker{color:#a4eee0;font-size:.62rem;font-weight:750;letter-spacing:.11em}
.login-guide-cover h3{margin:3px 0 5px;color:#fff;font-size:.95rem;line-height:1.25}
.login-guide-cover p{margin:0;color:#e1f1f0;font-size:.72rem;line-height:1.45}
.login-guide-cover-links{display:flex;gap:14px;flex-wrap:wrap;margin-top:11px}
.login-guide-cover-links a{color:#fff;font-size:.73rem;font-weight:700;text-decoration:underline;text-underline-offset:3px}
.login-guide-cover-links a:hover{color:#b3f0e5}
.login-demo{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:18px;padding:12px 0 0;border-top:1px solid var(--line)}
.login-demo-tag{display:inline-block;color:var(--primary);font-size:.64rem;font-weight:750;letter-spacing:.075em}
.login-demo p{margin:3px 0 0;color:var(--muted);font-size:.71rem;line-height:1.4}
.login-demo-link{display:inline-flex;align-items:center;gap:5px;flex:none;min-height:36px;padding:6px 0 6px 8px;color:var(--primary);font-size:.72rem;font-weight:650;text-align:right}
.login-demo-link:hover{text-decoration:underline;text-underline-offset:3px}
.login-demo-link .icon{width:14px;height:14px}
.login-mfa-note{display:flex;align-items:flex-start;gap:7px;margin:18px 0 0;color:var(--muted);font-size:.73rem;line-height:1.55}
.login-mfa-note .icon{flex:none;width:15px;height:15px;margin-top:1px;color:var(--primary)}
.auth-page footer{padding:16px max(32px,calc((100vw - 1160px)/2));background:var(--canvas)}
@media(max-width:900px){.auth-page main{max-width:700px;min-height:0;padding:14px 24px 32px}.login-shell{display:block;min-height:0;background:var(--surface)}.login-story{min-height:225px;padding:28px 36px;background:linear-gradient(90deg,#f8fbf8f5 0%,#f8fbf8df 35%,#f8fbf854 61%,#f8fbf800 78%),url('/images/login-pharmacist.png') center 42%/cover no-repeat}.login-story h1{max-width:350px;margin:16px 0 9px;font-size:1.7rem}.login-story-main>p{max-width:340px;font-size:.8rem}.login-panel{width:auto;margin:0;padding:33px 36px 37px;border:0;border-radius:0;box-shadow:none;backdrop-filter:none}.login-form{margin-top:24px}}
@media(max-width:520px){.auth-page .topbar{height:66px;padding:0 17px}.auth-page .guest-brand{font-size:1rem}.auth-page .guest-cross{width:30px;height:30px}.auth-page main{padding:8px 14px 25px}.login-shell{border-radius:12px}.login-story{min-height:205px;padding:23px 22px;background-position:58% center}.login-story h1{max-width:178px;margin:14px 0 0;font-size:1.37rem;line-height:1.2}.login-story-main>p{display:none}.login-panel{padding:27px 22px 31px}.login-panel h2{font-size:1.17rem}.login-panel-intro{font-size:.8rem}.login-form{gap:16px;margin-top:23px}.login-input-wrap input{font-size:1rem}.login-demo{align-items:flex-start;flex-direction:column;gap:5px;margin-top:24px}.login-demo p{font-size:.77rem}.login-demo-link{padding:3px 0;font-size:.8rem}.auth-page footer{padding:15px 17px}}
@media(max-width:350px){.login-panel-heading{gap:10px}.login-panel-icon{width:36px;height:36px}.login-panel h2{font-size:1.05rem}.login-story h1{max-width:154px;font-size:1.2rem}}
