/* OTP layout, typography and controls are shared with Web Customer through
   kod.css and auth-system.css. Only the Provider input needs an adapter. */
#codeStep[hidden] { display: none; }
body.auth-page > .container { display: contents; }
#codeStep .provider-code-input-wrap { position: relative; margin-bottom: 14px; }
#codeStep .provider-code-input {
  position: absolute;
  z-index: 2;
  inset: 0;
  width: 100%;
  height: 100%;
  padding: 0;
  border: 0;
  color: transparent;
  caret-color: transparent;
  background: transparent;
  outline: none;
}
#codeStep .provider-code-digits { margin: 0; pointer-events: none; }
#codeStep .provider-code-digits span { display: grid; place-items: center; font: inherit; }
/* Match the Customer input element's native metrics and paragraph spacing. */
#providerCodeExpiry { margin: 1em 0; }
@media (min-width: 1024px) {
  #codeStep .code-box { box-sizing: content-box; }
}
#providerCodeError:empty { display: none; }
.provider-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}