/* Entrada compartilhada entre senha e autenticador. Fotos do site institucional. */
body.auth-page {
  --auth-photo-ink: #fff;
  --auth-photo-base: #071628;
  --auth-action: #1559d4;
  --auth-action-hover: #1047aa;
  background: var(--surface);
  font-family: system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 1rem;
  letter-spacing: normal;
}
.auth-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(0, 1fr);
  min-height: 100svh;
}
.auth-scene {
  position: relative;
  isolation: isolate;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: clamp(2rem, 5vw, 5rem);
  color: var(--auth-photo-ink);
  background: var(--auth-photo-base);
  overflow: hidden;
}
.auth-scene-image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 57% center;
  z-index: -2;
}
.auth-scene::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(180deg, rgb(7 22 40 / 12%) 10%, rgb(7 22 40 / 72%) 60%, rgb(7 22 40 / 96%) 100%);
}
.auth-scene-copy { max-width: 32rem; }
.auth-eyebrow, .auth-step {
  font-size: .75rem;
  font-weight: 650;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.auth-eyebrow { margin-bottom: 1.25rem; }
.auth-scene h2, .auth-heading h1 {
  font-family: 'Space Grotesk', system-ui, sans-serif;
  font-weight: 600;
  letter-spacing: -.045em;
}
.auth-scene h2 { font-size: clamp(2rem, 3.7vw, 3.75rem); line-height: 1.08; margin-bottom: 1.5rem; }
.auth-scene-lead { font-size: 1.0625rem; line-height: 1.65; margin: 0; }
.auth-scene-footer { margin: 3.5rem 0 0; padding-top: 1.25rem; border-top: 1px solid rgb(255 255 255 / 28%); font-size: .8125rem; }
.auth-panel {
  display: flex;
  flex-direction: column;
  gap: 3rem;
  padding: 2.5rem clamp(2rem, 5vw, 5rem) 1.75rem;
  background: var(--surface);
  min-width: 0;
}
.auth-panel-top { display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
.auth-brand { display: inline-flex; flex-direction: column; gap: .625rem; color: var(--muted); text-decoration: none; }
.auth-brand .adm-brand-logo { width: 156px; height: auto; }
.auth-brand span { font-size: .6875rem; letter-spacing: .13em; text-transform: uppercase; }
.auth-theme { color: var(--text); border: 1px solid var(--card-border); border-radius: 50%; width: 44px; height: 44px; flex-shrink: 0; }
.auth-theme:hover { background: var(--surface-2); border-color: var(--muted); }
.auth-content { width: 100%; max-width: 400px; margin: auto; }
.auth-heading { margin-bottom: 2rem; }
.auth-step { color: var(--muted); margin-bottom: .75rem; }
.auth-heading h1 { font-size: clamp(1.875rem, 2.7vw, 2.5rem); line-height: 1.15; margin-bottom: .75rem; }
.auth-heading > p:last-child { color: var(--muted); line-height: 1.6; margin: 0; font-size: .9375rem; }
.auth-form .form-label { font-size: .875rem; font-weight: 600; margin-bottom: .5rem; }
.auth-field { position: relative; }
.auth-field > i { position: absolute; top: 50%; left: 1rem; transform: translateY(-50%); color: var(--muted); pointer-events: none; }
.auth-field .form-control {
  min-height: 52px;
  padding: .75rem 1rem .75rem 2.875rem;
  border-radius: 8px;
  border-color: var(--bs-border-color);
  background: var(--surface-2);
  color: var(--text);
  font-size: 1rem;
}
.auth-field .form-control::placeholder { color: var(--muted); opacity: .85; }
.auth-field .form-control:focus { background: var(--surface); border-color: var(--accent); }
.auth-password .form-control { padding-right: 3rem; }
.auth-password-toggle {
  position: absolute;
  right: 4px;
  top: 4px;
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--muted);
}
.auth-password-toggle:hover { color: var(--text); background: var(--card-border); }
.auth-remember { display: flex; align-items: center; gap: .625rem; min-height: 44px; font-size: .8125rem; }
.auth-remember .form-check-input { margin-top: 0; width: 1.125rem; height: 1.125rem; flex-shrink: 0; }
.auth-remember label { padding-block: .75rem; cursor: pointer; }
.auth-submit {
  --bs-btn-bg: var(--auth-action);
  --bs-btn-border-color: var(--auth-action);
  --bs-btn-hover-bg: var(--auth-action-hover);
  --bs-btn-hover-border-color: var(--auth-action-hover);
  --bs-btn-active-bg: var(--auth-action-hover);
  --bs-btn-disabled-bg: var(--auth-action);
  --bs-btn-disabled-border-color: var(--auth-action);
  display: flex;
  justify-content: center;
  align-items: center;
  gap: .875rem;
  min-height: 52px;
  border-radius: 8px;
  font-weight: 600;
}
.auth-form .btn-link { color: var(--text); min-height: 44px; text-decoration: underline !important; text-underline-offset: 4px; }
.auth-support { display: grid; gap: .5rem; margin-top: 2rem; padding-top: 1.5rem; border-top: 1px solid var(--card-border); font-size: .8125rem; color: var(--muted); }
.auth-support a { display: inline-flex; align-items: center; gap: .5rem; min-height: 44px; width: fit-content; color: var(--text); text-underline-offset: 4px; font-weight: 600; }
.auth-panel-footer { margin: 0; text-align: center; font-size: .75rem; color: var(--muted); line-height: 1.6; }
.auth-panel-footer i { margin-right: .375rem; }
.auth-error { font-size: .875rem; }
.auth-error:focus { outline: 2px solid var(--bs-danger); outline-offset: 2px; }
.auth-field .auth-otp { letter-spacing: .4em; font-size: 1.375rem; }
.auth-enrollment { padding: 1rem; margin-bottom: 1.5rem; border: 1px solid var(--card-border); border-radius: 8px; background: var(--surface-2); }
.auth-enrollment .btn {
  --bs-btn-color: var(--text);
  --bs-btn-border-color: var(--muted);
  --bs-btn-hover-bg: var(--text);
  --bs-btn-hover-color: var(--surface);
  --bs-btn-hover-border-color: var(--text);
  min-height: 44px;
}
.auth-page :focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; }
.auth-page [hidden] { display: none !important; }

@media (min-width: 768px) and (max-width: 991px) {
  .auth-panel { padding-inline: 1.5rem; }
  .auth-scene { padding: 2rem; }
  .auth-scene h2 { font-size: 2rem; }
}
@media (max-width: 767px) {
  .auth-layout { grid-template-columns: minmax(0, 1fr); }
  .auth-scene { min-height: 220px; padding: 2rem 1.5rem 2.75rem; justify-content: flex-end; }
  .auth-scene-image { object-position: center 55%; }
  .auth-scene::after { background: linear-gradient(180deg, rgb(7 22 40 / 25%), rgb(7 22 40 / 88%)); }
  .auth-eyebrow, .auth-scene-lead, .auth-scene-footer { display: none; }
  .auth-scene h2 { font-size: clamp(1.75rem, 5vw, 2.5rem); margin: 0; }
  .auth-panel { position: relative; margin-top: -12px; border-radius: 12px 12px 0 0; padding: 1.5rem; gap: 2rem; }
  .auth-panel-top { width: 100%; max-width: 400px; margin-inline: auto; }
  .auth-content { margin-block: 0; }
  .auth-heading { margin-bottom: 1.5rem; }
  .auth-heading h1 { font-size: 1.875rem; }
  .auth-support { margin-top: 1.5rem; padding-top: 1rem; gap: .25rem; }
}
@media (max-width: 400px) {
  .auth-scene { min-height: 180px; }
  .auth-panel { padding-inline: 1.25rem; gap: 1.5rem; }
  .auth-brand .adm-brand-logo { width: 138px; }
}
