﻿/* Shared public forms follow the homepage identity and retain theme variables. */
html[data-theme] body.public-care{--teal:var(--mc-primary);--teal-dark:var(--mc-hover);background:var(--mc-bg);color:var(--mc-text)}
html[data-theme] .public-care .login-wrap-page{background:radial-gradient(ellipse at 10% 15%,#76c6b51a,transparent 60%),var(--mc-bg)}
html[data-theme] .public-care .top-bar,html[data-theme] .public-care .top{background:var(--mc-surface);border-bottom:1px solid var(--mc-border);padding:22px max(24px,calc((100vw - 1180px)/2));height:auto}
.public-care .top-bar .logo-name,.public-care .top .logo{font-size:20px;font-weight:700;letter-spacing:-.6px;color:var(--mc-text);text-decoration:none}
.public-care .top .in{max-width:1180px;padding:0;height:auto;gap:20px;flex-wrap:wrap}
.public-care .top a.l,.public-care .top-bar a{color:var(--mc-primary);font-size:12px}
.public-care .top-bar-right{display:flex;align-items:center;gap:20px;flex-wrap:wrap;font-size:12px}
.public-care .auth-wrap{padding:48px 24px}
html[data-theme] .public-care .login-layout{border:1px solid var(--mc-border);border-radius:26px;background:var(--mc-card);box-shadow:0 24px 65px #103e4910;max-width:1120px}
html[data-theme] .public-care .login-intro{background:#10323e;border:0;padding:42px 36px;color:#b8d3d7}
html[data-theme] .public-care .login-intro h2{color:#fff;font-size:36px;line-height:1.2;letter-spacing:-1px}
html[data-theme] .public-care .login-intro p{color:#b8d3d7;font-size:14px;line-height:1.85}
.public-care .login-intro .login-eyebrow{color:#9be4d2;letter-spacing:.16em}
.public-care .login-intro>img{display:block;width:100%;margin:26px 0;height:245px;object-fit:cover;border-radius:64px 14px 64px 14px}
.public-care .login-features{display:flex;flex-wrap:wrap;gap:8px}
html[data-theme] .public-care .login-features span{border:1px solid #9be4d233;background:#9be4d20c;color:#c8ebe3;border-radius:20px;font-size:10px;padding:7px 10px}
html[data-theme] .public-care .auth-card{border-color:var(--mc-border);border-radius:24px;background:var(--mc-card);overflow:hidden}
.public-care .login-layout .auth-card{border:0;border-radius:0;box-shadow:none;align-self:center}
html[data-theme] .public-care .auth-card-top{background:transparent;border:0;padding:32px 36px 18px}
.public-care .auth-card-top h1{font-size:28px;letter-spacing:-.8px;line-height:1.25}
.public-care .auth-card-top p{font-size:13px;line-height:1.75;color:var(--mc-secondary)}
.public-care .auth-body{padding:12px 36px 32px}
.public-care .auth-card.wide{width:100%;max-width:820px;padding:0;box-shadow:0 16px 45px #103e490a}
.public-care .form-label{font-size:12px;font-weight:600;margin-bottom:8px}
html[data-theme] .public-care .form-control{min-height:48px;border-radius:10px;border:1px solid var(--mc-strong);background:var(--mc-alt);color:var(--mc-text);font-size:14px}
html[data-theme] .public-care .form-control:focus{border-color:var(--mc-primary);outline:2px solid var(--mc-soft);outline-offset:1px;box-shadow:none}
html[data-theme] .public-care .form-control.invalid{border-color:var(--mc-danger);background:var(--mc-danger-bg)}
html[data-theme] .public-care .form-control.valid{border-color:var(--mc-success)}
html[data-theme] .public-care .submit-btn{min-height:48px;border-radius:26px;background:var(--mc-primary);color:var(--mc-on-primary);font-size:14px;font-weight:600;box-shadow:none}
html[data-theme] .public-care .submit-btn:hover{background:var(--mc-hover)}
.public-care button:disabled{opacity:.5;cursor:not-allowed}
.public-care .reg-section-title{font-size:12px;letter-spacing:.06em;padding-top:4px;color:var(--mc-text)}
.public-care .reg-step-num{background:var(--mc-soft);color:var(--mc-soft-text);width:27px;height:27px}
.public-care .reg-divider{background:var(--mc-border);margin:26px 0}
.public-care .recovery-steps li{border-radius:20px;border-color:var(--mc-border);background:var(--mc-alt);color:var(--mc-secondary)}
html[data-theme] .public-care .recovery-steps [aria-current=step],html[data-theme] .public-care .recovery-note{background:var(--mc-soft);color:var(--mc-soft-text);border-color:var(--mc-border)}
.public-care .recovery-help{color:var(--mc-secondary);line-height:1.8}
.public-care .public-care-banner{display:grid;grid-template-columns:1.2fr 1fr;gap:24px;align-items:center;padding:28px;background:#10323e;color:#c2dbdd;text-align:left;overflow:hidden}
.public-care .public-care-banner span{font-size:9px;color:#9be4d2;letter-spacing:.16em;font-weight:600}
html[data-theme] .public-care .public-care-banner h2{font-size:27px;color:#fff;font-weight:500;line-height:1.22;letter-spacing:-.7px;margin:10px 0}
.public-care .public-care-banner p{font-size:12px;line-height:1.75;margin:0}
.public-care .public-care-banner img{width:100%;height:175px;object-fit:cover;border-radius:45px 12px 45px 12px}
.public-care.hms-public-booking .wrap{max-width:880px;padding-top:36px}
.public-care.hms-public-booking .public-care-banner{border-radius:24px;margin-bottom:30px}
html[data-theme] .public-care.hms-public-booking .card{background:var(--mc-card);border-color:var(--mc-border);border-radius:24px;padding:30px;box-shadow:0 16px 45px #103e490a}
.public-care.hms-public-booking .n{background:var(--mc-soft);color:var(--mc-soft-text)}
.public-care.hms-public-booking .btn{border-radius:26px;min-height:48px}
.public-care .auth-footer{background:transparent;color:var(--mc-secondary);border-color:var(--mc-border)}
@media(max-width:850px){.public-care .login-intro{padding:30px 24px!important}.public-care .login-intro h2{font-size:29px!important}.public-care .login-intro>img{height:200px}.public-care .auth-card-top{padding:28px 24px 16px!important}.public-care .auth-body{padding:12px 24px 28px}}
@media(max-width:650px){.public-care .auth-wrap{padding:24px 16px}.public-care .login-layout{grid-template-columns:1fr}.public-care .login-intro>img{height:170px}.public-care .top-bar,.public-care .top{padding:18px 20px!important}.public-care .public-care-banner{padding:24px;gap:18px}.public-care .public-care-banner h2{font-size:23px!important}.public-care .public-care-banner img{height:160px}.public-care .form-control{font-size:16px!important}.public-care .form-row{display:block}}
@media(max-width:420px){.public-care .public-care-banner{grid-template-columns:1fr}.public-care .public-care-banner img{height:145px}.public-care .auth-body{padding-inline:20px}.public-care.hms-public-booking .card{padding:22px}.public-care .top-bar-right{gap:12px}}
/* Fit sign-in and recovery to a typical desktop viewport without clipping forms. */
body.auth-fit{margin:0}
.auth-fit .login-wrap-page{min-height:100dvh;display:flex;flex-direction:column}
html[data-theme] .auth-fit .top-bar{min-height:64px;padding-block:14px}
.auth-fit .auth-wrap{display:flex;align-items:center;justify-content:center;flex:1;padding:20px 24px;min-height:0}
.auth-fit .login-layout{max-width:1040px}
html[data-theme] .auth-fit .login-intro{padding:28px!important}
html[data-theme] .auth-fit .login-intro h2{font-size:30px!important;margin-bottom:12px}
html[data-theme] .auth-fit .login-intro p{font-size:13px;line-height:1.65;margin-bottom:0}
.auth-fit .login-intro>img{height:180px;margin:20px 0}
html[data-theme] .auth-fit .auth-card-top{padding:24px 30px 12px!important}
.auth-fit .auth-card-top h1{font-size:25px;margin-bottom:8px}
.auth-fit .auth-body{padding:8px 30px 24px}
.auth-fit .form-group{margin-bottom:14px}
.auth-fit .auth-footer{padding:10px 80px 10px 24px;font-size:10px;flex-shrink:0}
.auth-fit .recovery-steps{margin-bottom:14px;gap:6px}
.auth-fit .recovery-help{margin:8px 0 12px;font-size:10px;line-height:1.6}
.auth-fit .register-link{margin-top:12px}
@media(min-width:651px) and (max-height:740px){
 .auth-fit .auth-wrap{padding-block:12px}
 html[data-theme] .auth-fit .login-intro{padding:22px!important}
 .auth-fit .login-intro>img{height:140px;margin:14px 0}
 html[data-theme] .auth-fit .auth-card-top{padding:18px 26px 8px!important}
 .auth-fit .auth-body{padding:6px 26px 18px}
 .auth-fit .form-group{margin-bottom:10px}
 html[data-theme] .auth-fit .form-control{min-height:42px;padding-block:9px}
 html[data-theme] .auth-fit .submit-btn{min-height:42px;padding-block:10px}
 .auth-fit .recovery-steps li{padding:5px 8px}
 .auth-fit .recovery-steps{margin-bottom:10px}
 .auth-fit .recovery-help{margin:6px 0 8px}
}
@media(max-width:650px){
 .auth-fit .auth-wrap{padding:16px}
 .auth-fit .login-layout{max-width:480px}
 .auth-fit .login-intro{display:none}
 html[data-theme] .auth-fit .auth-card-top{padding:24px 22px 12px!important}
 .auth-fit .auth-body{padding:8px 22px 24px}
 .auth-fit .top-bar-right{font-size:11px;gap:10px}
 .auth-fit .auth-footer{line-height:1.6}
}
@media(min-width:651px) and (max-height:580px){
 .auth-fit .login-intro>img{height:100px;margin-block:10px}
 html[data-theme] .auth-fit .login-intro h2{font-size:25px!important}
 .auth-fit .login-features{display:none}
}
/* Keep the complete care photo visible within compact auth layouts. */
html[data-theme] .auth-fit .login-intro>img{object-fit:contain;object-position:center;width:100%;height:auto;max-height:220px;aspect-ratio:3 / 2;border-radius:18px;background:transparent;margin:16px 0}
@media(min-width:651px) and (max-height:740px){html[data-theme] .auth-fit .login-intro>img{max-height:170px;margin:12px 0}}
@media(min-width:651px) and (max-height:580px){html[data-theme] .auth-fit .login-intro>img{max-height:120px;margin:8px 0}}
/* Wide curved photo treatment, framed from the top to retain all faces. */
html[data-theme] .auth-fit .login-intro>img{display:block;width:100%;height:200px;max-height:none;aspect-ratio:auto;object-fit:cover;object-position:center 15%;border-radius:64px 14px 64px 14px;margin:18px 0}
@media(min-width:651px) and (max-height:740px){html[data-theme] .auth-fit .login-intro>img{height:180px;max-height:none;margin:12px 0}}
@media(min-width:651px) and (max-height:580px){html[data-theme] .auth-fit .login-intro>img{height:150px;max-height:none;margin:8px 0;border-radius:44px 12px 44px 12px}}
/* Taller care image within the existing auth panel. */
html[data-theme] .auth-fit .login-intro>img{height:270px}
@media(min-width:651px) and (max-height:740px){html[data-theme] .auth-fit .login-intro>img{height:230px}}
@media(min-width:651px) and (max-height:580px){html[data-theme] .auth-fit .login-intro>img{height:170px}}
html[data-theme] .auth-fit .login-intro>img{height:330px}
@media(min-width:651px) and (max-height:740px){html[data-theme] .auth-fit .login-intro>img{height:280px}}
@media(min-width:651px) and (max-height:580px){html[data-theme] .auth-fit .login-intro>img{height:200px}}
html[data-theme] .auth-fit .login-intro>img{height:390px}
@media(min-width:651px) and (max-height:740px){html[data-theme] .auth-fit .login-intro>img{height:320px}}
@media(min-width:651px) and (max-height:580px){html[data-theme] .auth-fit .login-intro>img{height:220px}}
/* Keep auth content compact as the desktop viewport height changes. */
@media screen and (min-width:651px){
html[data-theme] body.auth-fit .login-wrap-page{min-height:100dvh;display:flex;flex-direction:column}
html[data-theme] body.auth-fit .auth-wrap{padding:14px 24px;flex:1;display:flex;align-items:center;justify-content:center;min-height:0}
html[data-theme] body.auth-fit .login-layout{width:100%;max-width:1040px;align-items:stretch}
html[data-theme] body.auth-fit .login-intro{padding:24px!important}
html[data-theme] body.auth-fit .login-intro h2{font-size:clamp(23px,3.8vh,30px)!important;line-height:1.2;margin-bottom:10px}
html[data-theme] body.auth-fit .login-intro p{font-size:12px;line-height:1.6;margin:0}
html[data-theme] body.auth-fit .login-intro>img{height:clamp(260px,55dvh,520px);max-height:520px;object-fit:cover;object-position:center 15%;margin:14px 0}
html[data-theme] body.auth-fit .auth-card-top{padding:20px 28px 10px!important}
html[data-theme] body.auth-fit .auth-body{padding:6px 28px 20px}
html[data-theme] body.auth-fit .auth-card-top h1{font-size:24px;margin-bottom:8px}
html[data-theme] body.auth-fit .form-group{margin-bottom:12px}
html[data-theme] body.auth-fit .recovery-help{font-size:11px;line-height:1.5;margin:7px 0}
html[data-theme] body.auth-fit .recovery-steps{margin-bottom:12px}
html[data-theme] body.auth-fit .auth-footer{padding:8px 70px 8px 20px;line-height:1.5;flex-shrink:0}
}
@media screen and (min-width:651px) and (max-height:680px){
html[data-theme] body.auth-fit .top-bar{min-height:54px;padding-block:10px}
html[data-theme] body.auth-fit .auth-wrap{padding-block:8px}
html[data-theme] body.auth-fit .login-intro{padding:20px!important}
html[data-theme] body.auth-fit .login-intro>img{height:240px;margin:10px 0}
html[data-theme] body.auth-fit .auth-card-top{padding:16px 24px 8px!important}
html[data-theme] body.auth-fit .auth-body{padding:4px 24px 16px}
html[data-theme] body.auth-fit .form-control{min-height:40px;padding-block:8px}
html[data-theme] body.auth-fit .submit-btn{min-height:40px;padding-block:9px}
html[data-theme] body.auth-fit .form-group{margin-bottom:9px}
html[data-theme] body.auth-fit .login-eyebrow{margin-bottom:8px}
html[data-theme] body.auth-fit .register-link{margin-top:8px}
html[data-theme] body.auth-fit .recovery-note{padding:8px 10px;margin-bottom:10px;font-size:11px}
}
@media screen and (max-width:650px){
html[data-theme] body.auth-fit .top-bar{padding:12px 18px!important;gap:8px}
html[data-theme] body.auth-fit .auth-wrap{padding:12px 16px}
html[data-theme] body.auth-fit .login-intro{display:none}
html[data-theme] body.auth-fit .auth-card-top{padding:20px 22px 10px!important}
html[data-theme] body.auth-fit .auth-body{padding:6px 22px 20px}
}
/* Public header links stay grouped rather than spreading across the viewport. */
html[data-theme] body.public-care .top .in{display:flex;align-items:center;justify-content:space-between;gap:20px;max-width:1180px;width:100%;margin-inline:auto}
.public-care .public-header-links{display:flex;align-items:center;gap:24px;margin-left:auto;flex-wrap:wrap}
html[data-theme] body.public-care .top-bar{display:flex;align-items:center;justify-content:space-between;gap:20px}
.public-care .top-bar-right{margin-left:auto;gap:24px}
html[data-theme] body.public-care .top,html[data-theme] body.public-care .top-bar{padding-top:16px;padding-bottom:16px}
@media(max-width:640px){.public-care .public-header-links,.public-care .top-bar-right{gap:14px;margin-left:0}html[data-theme] body.public-care .top .in{gap:12px}html[data-theme] body.public-care .top-bar{gap:12px}}

/* The shared login layout supplies the single outer card frame. */
html[data-theme] body.public-care.auth-fit .login-layout > .auth-card{
  border:0;
  border-radius:0;
  box-shadow:none;
  outline:0;
}
