/* Hallmark component guidance: existing Bethlehem portal tokens and restrained states. */
html:is([data-session-gate="locked"], [data-session-gate="unavailable"]) { background: #f2f7fc; }
html:is([data-session-gate="locked"], [data-session-gate="unavailable"]) body { overflow: hidden; }
html[data-session-gate] body > :where(:not(#bethlehem-session-lock):not(script):not(style)),
html[data-session-gate] body > :where(:not(#bethlehem-session-lock):not(script):not(style)) * {
  visibility: hidden !important;
  pointer-events: none !important;
}
html[data-session-gate="checking"] :is([data-session-surface], [data-session-public], [data-session-public] *) {
  visibility: visible !important;
}
/* Only static customer chrome is visible while authorization is pending. */
html[data-session-gate="checking"] :is([data-customer-session-shell], [data-customer-session-shell] *) {
  visibility: visible !important;
}
html[data-session-gate="checking"] :is([data-session-private], [data-session-private] *) {
  visibility: hidden !important;
}
.session-lock[hidden], .session-lock [hidden] { display: none; }
.session-lock {
  position: fixed;
  inset: 0;
  z-index: 2147483647;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: auto;
  padding: 24px 16px;
  background: var(--portal-canvas);
  color: var(--portal-text);
  font: inherit;
}
.session-lock__card {
  width: 100%;
  max-width: 420px;
  margin: auto;
  padding: 36px 28px 24px;
  border: 1px solid var(--portal-border);
  border-radius: 24px;
  background: var(--portal-surface);
  box-shadow: var(--portal-shadow);
  text-align: center;
}
.session-lock__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  height: 60px;
  margin: 0 auto 20px;
  border-radius: 50%;
  background: var(--portal-icon-surface);
  color: var(--portal-primary);
}
.session-lock h1 { margin: 0; font-size: 24px; font-weight: 700; line-height: 1.3; }
.session-lock #session-lock-description {
  margin: 12px 0 28px;
  color: var(--portal-muted);
  font-size: 14px;
  line-height: 1.6;
}
.session-lock form { text-align: left; }
.session-lock label { display: block; margin-bottom: 8px; font-size: 14px; font-weight: 600; }
.session-lock__password { position: relative; }
.session-lock input {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  min-height: 52px;
  border: 1px solid var(--portal-border);
  border-radius: 16px;
  padding: 12px 68px 12px 16px;
  background: var(--portal-surface);
  color: var(--portal-text);
  font: inherit;
  font-size: 16px;
}
.session-lock input:focus { border-color: var(--portal-primary); }
.session-lock input[aria-invalid="true"] { border-color: var(--portal-danger); }
.session-lock button { font: inherit; font-size: 14px; cursor: pointer; white-space: nowrap; }
#session-password-toggle {
  position: absolute;
  right: 4px;
  top: 4px;
  bottom: 4px;
  min-width: 56px;
  border: 0;
  border-radius: 12px;
  background: transparent;
  color: var(--portal-muted);
}
#session-password-toggle:hover { color: var(--portal-primary); background: var(--portal-surface-soft); }
.session-lock #session-error { margin: 12px 0 0; color: var(--portal-danger); font-size: 14px; line-height: 1.5; }
.session-lock__primary {
  width: 100%;
  min-height: 48px;
  margin-top: 20px;
  border: 0;
  border-radius: 16px;
  padding: 12px 16px;
  background: var(--portal-primary);
  color: var(--portal-surface);
  font-weight: 600 !important;
}
.session-lock__primary:hover { background: var(--portal-primary-hover); }
.session-lock__primary:active { background: var(--portal-primary-hover); }
.session-lock button:disabled { cursor: wait; opacity: .65; }
.session-lock__secondary {
  min-height: 44px;
  margin-top: 12px;
  border: 0;
  border-radius: 12px;
  padding: 8px;
  background: transparent;
  color: var(--portal-muted);
}
.session-lock__secondary:hover { color: var(--portal-primary); text-decoration: underline; }
.session-lock :is(button, input):focus-visible { outline: 2px solid var(--portal-primary); outline-offset: 3px; }
@media (max-width: 375px) { .session-lock__card { padding: 28px 20px 20px; } }
