/* Patient online access — uses the existing storefront auth design. */
.auth-patient-access {
  margin-bottom: 28px;
  padding: 22px;
  border: 1px solid color-mix(in srgb, var(--ll-brand) 28%, transparent);
  border-radius: var(--ll-r-3);
  background: var(--ll-brand-weak);
}
.auth-patient-access h2 {
  color: var(--ll-brand-2);
  font-family: var(--ll-font-serif);
  font-size: 1.5rem;
  font-weight: 600;
  letter-spacing: -.02em;
  margin: 0 0 12px;
  text-wrap: balance;
}
.auth-access-success h2 {
  color: var(--ll-ink);
  font-size: 1rem;
  font-weight: 600;
  margin: 0 0 6px;
  text-wrap: balance;
}
.auth-patient-access p,
.auth-access-hint,
.auth-access-success p {
  color: var(--ll-muted);
  font-size: .875rem;
  line-height: 1.6;
  text-wrap: pretty;
  margin: 0 0 12px;
}
.auth-patient-access p { color: var(--ll-ink-2); }
.auth-patient-access strong { color: var(--ll-brand-2); font-weight: 600; }
.auth-patient-access .auth-patient-access-help { margin-bottom: 18px; }
.auth-patient-access-button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 48px;
  padding: 10px 16px;
  border: 1px solid var(--ll-brand);
  border-radius: var(--ll-r-2);
  background: var(--ll-surface);
  color: var(--ll-brand);
  font: inherit;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.5;
  cursor: pointer;
  text-align: center;
  white-space: normal;
}
.auth-patient-access-button:hover { background: var(--ll-brand-weak); }
.auth-patient-access-button:active { background: var(--am-ice-2); }
.auth-access-form { max-width: 20rem; margin-inline: auto; }
.auth-access-hint { margin: -4px 0 22px; }
.auth-access-success {
  padding: 20px 0;
  border-top: 1px solid var(--am-line);
  border-bottom: 1px solid var(--am-line);
}
.auth-access-success p:last-of-type { margin-bottom: 16px; }
.auth-access-success .auth-link { padding: 4px 0; color: var(--ll-brand); }
.auth-access-form [hidden] { display: none !important; }
.auth-form [type="submit"]:disabled { cursor: wait; opacity: .65; transform: none; }
.auth-form input[aria-invalid="true"] { border-color: var(--ll-danger); }
.auth-form .auth-h:focus,
.auth-formerr:focus,
.auth-access-success:focus { outline: none; box-shadow: none; }
.auth-card .auth-link:focus-visible,
.auth-patient-access-button:focus-visible,
.auth-card .auth-alt button:focus-visible,
.auth-card .auth-tab:focus-visible,
.auth-card .btn:focus-visible {
  outline: 2px solid var(--ll-brand);
  outline-offset: 3px;
}

.patient-access-page { background: var(--ll-surface); }
.patient-access-page .auth-main { min-height: 100dvh; isolation: isolate; }
.patient-access-page .auth-panel { background: var(--ll-surface); min-width: 0; }
.patient-access-page .auth-card { max-width: 20rem; }
.patient-access-page .auth-h { text-wrap: balance; }
.patient-access-page .auth-sub { text-wrap: pretty; }
.patient-access-page .auth-back { color: var(--ll-brand); }
.patient-access-page .auth-access-email {
  background: var(--ll-surface-2);
  color: var(--ll-ink-2);
}
.patient-access-page .field input { min-width: 0; width: 100%; }
.patient-access-page .field input:focus-visible {
  outline: 2px solid var(--ll-brand);
  outline-offset: -1px;
  box-shadow: none;
}
.patient-access-page .auth-legal { color: var(--ll-muted); }
.patient-access-page .consent { padding: 16px; margin: 6px 0 22px; }
.patient-access-page .consent label { min-width: 0; }
.patient-access-page .consent input { margin-top: 2px; }
.patient-access-page .consent a { color: var(--ll-brand); }
.patient-access-page .auth-consent-error { color: var(--ll-danger); font-size: .875rem; margin: -12px 0 20px; }
.patient-access-page .auth-formerr { overflow-wrap: anywhere; }
.auth-access-mobile-brand { display: none; }
.auth-invalid-link .btn { width: 100%; justify-content: center; white-space: normal; text-align: center; }
.auth-invalid-link .auth-alt a { color: var(--ll-brand); text-decoration: underline; text-underline-offset: 3px; }

@media (max-width: 840px) {
  .patient-access-page .auth-panel { min-height: 100dvh; }
  .auth-access-mobile-brand { display: flex; align-items: center; gap: 10px; margin-bottom: 26px; }
  .auth-access-mobile-brand img { width: 46px; height: auto; flex-shrink: 0; }
  .auth-access-mobile-brand p { margin: 0; font-family: var(--ll-font-serif); font-size: 1.25rem; color: var(--ll-brand); }
}
@media (max-width: 600px) {
  .auth-patient-access { padding: 18px; }
  .auth-access-form .field input,
  .patient-access-page .field input { font-size: 1rem; min-height: 48px; }
  .auth-patient-access p,
  .auth-access-hint,
  .auth-access-success p,
  .auth-access-form .auth-sub,
  .auth-access-form .auth-alt,
  .auth-access-form .auth-alt button,
  .auth-access-form .field label,
  .auth-access-form .field .errmsg,
  .patient-access-page .auth-sub,
  .patient-access-page .field label,
  .patient-access-page .field .hint,
  .patient-access-page .field .errmsg,
  .patient-access-page .consent label,
  .patient-access-page .auth-legal,
  .patient-access-page .auth-formerr,
  .patient-access-page .auth-consent-error { font-size: 1rem; }
  .auth-access-success .auth-link,
  .auth-access-form .auth-alt button,
  .patient-access-page .auth-back { min-height: 48px; display: inline-flex; align-items: center; }
  .patient-access-page .consent input { width: 20px; height: 20px; }
  .patient-access-page .auth-panel { padding: 28px 22px; }
}
@media (prefers-reduced-motion: reduce) {
  .auth-access-form,
  .patient-access-page .auth-form { animation: none; }
}
