/*
 * innovaLIS — auth zóna közös stílus (bejelentkezés/aktiválás/reset/meghívó kártyák).
 * A design-tokenekre épül (--wa-*); a kártya-minta a WebAwesome login-recept szerint.
 */

html, body { min-height: 100%; padding: 0; margin: 0; }

/* Teljes-viewport váz: fejléc fent, lábléc lent, a tartalom (kártya) középen. */
.auth-screen {
  min-height: 100vh;
  align-items: stretch;
  padding: 0;
  gap: 0;
}

.auth-main {
  flex: 1 1 auto;
  align-items: center;
  justify-content: center;
  padding: var(--wa-space-l);
  gap: var(--wa-space-l);
}

/* Kártyaszélesség egy helyen (a WA-nak nincs tartalomszélesség-tokenje). */
.auth-screen { --auth-card-width: 26rem; }

.auth-card {
  width: 100%;
  max-width: var(--auth-card-width);
}

/* Valódi, teljes szélességű fejléc- és lábléc-sáv (nem a kártyához igazítva). */
.auth-top {
  align-items: center;
  padding: var(--wa-space-2xs) var(--wa-space-l);
}

.auth-bottom {
  padding: var(--wa-space-2xs) var(--wa-space-l);
}

.brand-link {
  text-decoration: none;
  color: inherit;
  font-family: var(--wa-font-family-heading);
  font-weight: var(--wa-font-weight-heading);
  font-size: var(--wa-font-size-l);
}

.auth-muted { color: var(--wa-color-text-quiet); }

/* Középre zárt tartalom — flex-konténerként (wa-stack) az elemeket is középre igazítja,
   különben az ikon/spinner flex-itemként balra tapadna. */
.auth-center { text-align: center; align-items: center; }

.w-full { width: 100%; }

/* ── Labor-választó gomb (bérlőválasztó) ──────────────────────────────────────
   SZÁNDÉKOSAN ugyanaz a balra zárt, két soros gomb, mint a módválasztóé
   (app/app.css `.entry-option`): belépéskor előbb labort választasz, utána
   szerepkört — a két lépésnek egyetlen folyamatnak kell látszania. A szabály
   azért ismétlődik, mert a két zóna külön CSS-fájlt szolgál ki.
   A tördelést a dokumentált `label` parton engedjük meg (a gomb címkéje alapból
   egy sorban, tördelés nélkül fut), a `min-width: 0` pedig azért kell, mert a
   flex-elem alapból nem zsugorodik a tartalma alá. */
.entry-option::part(base) {
  justify-content: start;
  text-align: start;
  height: auto;                                                   /* két sor is elférjen */
  padding-block: calc(var(--wa-form-control-padding-block) / 2);   /* a téma gomb-paddingjéből */
}

.entry-option::part(label) {
  flex: 1 1 auto;
  min-width: 0;
  white-space: normal;
}

.entry-label { min-width: 0; }

/* (A labor jelének stílusa átkerült a megosztott témába: `.tenant-brand`
   a /_shared/theme.css-ben — ugyanaz a jel kell a választóban, a váltóban,
   a fejlécben és a saját címen nyíló belépő-oldalon.) */

/* Az OTP-sor középre. */
.otp-center { display: flex; justify-content: center; }

/* A [hidden] attribútum győzzön a wa-stack/wa-* display-szabályai felett is. */
[hidden] { display: none !important; }

/* Oldalháttér + szövegszín tokenből — dark módban is helyes kontraszt a kártyán kívül.
   FIGYELEM: background-color (NEM background rövidítés!) — a shorthand nullázná a
   .brand-backdrop background-image-ét; a szín így a minta alatti fallback marad. */
.auth-screen {
  background-color: var(--wa-color-surface-lowered);
  color: var(--wa-color-text-normal);
}

/* Kártya-státusz ikonok közös színei (korábban oldalankénti <style> blokkok). */
.brand-icon, .status-icon { color: var(--wa-color-brand-fill-loud); }
.warn-icon { color: var(--wa-color-warning-fill-loud); }
