@import url('./sign-in-input.css');

/* The native access gate is drawn by the site's theme and approved Brand Profile. */
/* A content-sized access screen: it fits a normal viewport and can grow for
   zoom, a keyboard, validation or a provider challenge without clipping. */
body:has(.site-access_main) { display: flex; flex-direction: column; min-height: 100svh; min-height: 100dvh; }
body:has(.site-access_main) > [data-site-content], [data-site-content] > .site-access { flex: 1; display: grid; }
body:has(.site-access_main) .global-site-chrome { flex: none; min-height: 0; background: var(--surface); }
body:has(.site-access_main) .topbar[data-site-header] { position: static; width: min(100%, var(--container-content, 1200px)); height: auto; min-height: 76px; margin-inline: auto; padding: max(var(--space-4), env(safe-area-inset-top)) max(var(--space-4), env(safe-area-inset-left), env(safe-area-inset-right)); border: 0; border-radius: 0; box-shadow: none; gap: var(--space-4); }
body:has(.site-access_main) .brand.brand-lockup { width: clamp(120px, 35vw, 168px); }
body:has(.site-access_main) .page-symbol { display: none; }
body:has(.site-access_main) main.site-access_main { flex: 1; width: 100%; max-width: none; min-height: 0; margin: 0; display: grid; align-content: center; justify-items: center; padding: var(--space-4) max(var(--space-4), env(safe-area-inset-left), env(safe-area-inset-right)) max(var(--space-4), env(safe-area-inset-bottom)); }
.site-access .sign-in { box-sizing: border-box; width: min(100%, 420px); padding: clamp(var(--space-4), 4vw, var(--space-6)); border: var(--stroke-regular) solid var(--border); border-radius: var(--radius-surface); background: var(--surface); color: var(--text); }
.site-access .sign-in h1 { text-align: center; margin: 0 0 var(--space-5); font-size: var(--font-size-heading-3); font-weight: var(--font-weight-heading-3); line-height: 1.5; }
.site-access form { display: grid; gap: var(--space-4); }
.site-access_intro { text-align: center; }
.site-access label, .site-access .hint { text-align: center; }
.site-access input:not([type="radio"]) { width: 100%; min-height: calc(var(--size-control) * 1.25); padding: var(--space-3); background: var(--surface-soft); color: var(--text); border: var(--stroke-regular) solid var(--border); border-radius: calc(var(--radius-input) * 12 / 14); font: inherit; text-align: center; }
.site-access .sign-in button { min-height: calc(var(--size-control) * 1.25); padding: var(--space-3) var(--space-4); border: var(--stroke-regular) solid var(--border); border-radius: calc(var(--radius-control) * 12 / 14); font: inherit; cursor: pointer; }
.site-access .primary { background: var(--action); color: var(--on-action); }
.site-access fieldset { display: flex; margin: 0; padding: var(--space-1); gap: var(--space-1); min-width: 0; border: var(--stroke-regular) solid var(--border); border-radius: var(--radius-control); background: var(--surface-soft); }
.site-access fieldset legend { position: absolute; clip-path: inset(50%); width: 1px; height: 1px; overflow: hidden; }
.site-access .sign-in fieldset .choice { position: relative; display: flex; flex: 1; min-width: 0; margin: 0; padding: 0; border: var(--stroke-regular) solid transparent; border-radius: var(--radius-control); cursor: pointer; }
.site-access .sign-in fieldset .choice span { display: grid; place-items: center; width: 100%; min-height: 44px; padding: var(--space-2); border: 0; background: transparent; font-size: var(--font-size-label); line-height: 1.5; }
.site-access .choice input { position: absolute; opacity: 0; }
.site-access .sign-in fieldset .choice:has(input:checked) { border-color: var(--border); background: var(--surface); }
.site-access .choice:has(input:focus-visible), .site-access :is(button,input):focus-visible { outline: var(--stroke-focus) solid var(--focus); outline-offset: var(--space-1); }
.site-access .secondary { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.site-access .secondary button { flex: 1; background: var(--surface-soft); color: var(--text); }
.site-access .error { color: var(--color-danger); }
.site-access :is(.status,.error):empty { display: none; }
.site-access :disabled { opacity: .6; cursor: default; }
.site-access [hidden] { display: none !important; }
.site-navigation-status { position: fixed; z-index: var(--layer-overlay); inset-block-start: calc(var(--size-control) * 2); inset-inline-start: 50%; transform: translateX(-50%); max-width: 90%; padding: var(--space-2) var(--space-4); background: var(--surface-soft); color: var(--text); border: var(--stroke-regular) solid var(--border); border-radius: var(--radius-control); }
.site-navigation-status button { text-decoration: underline; }
@media (prefers-reduced-motion: reduce) { [data-site-content] { scroll-behavior: auto; } }