/*
 * innovaLIS — app zóna közös stílus.
 * Kapu-képernyők (gate/onboarding/select): középre zárt kártya, az auth-minta szerint.
 * A dash-váz (wa-page) oldal-specifikus stílusa a dash/index.html-ben él.
 */

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

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

/* Teljes képernyős középre zárás: a wa-stack-et itt szándékosan CSS-ből igazítjuk
   (a viewport-magasságú centering nem companion-utility hatókör) — az auth zóna
   .auth-screen mintájával azonosan. */
.gate-screen {
  min-height: 100vh;
  align-items: stretch;
  padding: 0;
  gap: 0;
  /* background-color (NEM background rövidítés!) — a shorthand nullázná a
     .brand-backdrop background-image-ét; a szín a minta alatti fallback. */
  background-color: var(--wa-color-surface-lowered);
  color: var(--wa-color-text-normal);
}

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

.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);
}

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

/* A kapu-tartalom a fejléc és a lábléc közt középen (az auth zóna .auth-main párja). */
.gate-main {
  flex: 1 1 auto;
  align-items: center;
  justify-content: center;
  padding: var(--wa-space-l);
  gap: var(--wa-space-l);
}

/* Teljes szélességű fejléc- és lábléc-sáv. */
.gate-top { align-items: center; padding: var(--wa-space-2xs) var(--wa-space-l); }
.gate-bottom { padding: var(--wa-space-2xs) var(--wa-space-l); }

/* Középre zárt tartalom — flex-konténerként (wa-stack) az elemeket is középre igazítja. */
.gate-center { text-align: center; align-items: center; }

.w-full { width: 100%; }

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

/* Kártya-státusz ikonok közös színei. */
.brand-icon { color: var(--wa-color-brand-fill-loud); }
.warn-icon  { color: var(--wa-color-warning-fill-loud); }

/* ── Belépési opció gomb (módválasztó) ────────────────────────────────────────
   Balra zárt, KÉT SOROS tartalom: felül a szerep neve, alatta a szkóp és a mód.
   MIÉRT kell CSS: a gomb címkéje alapból egy sorban, tördelés nélkül fut, így a
   hosszabb szövegek (pl. „Intézmény-adminisztrátor / Központi Labor · adminisztráció
   mód") kilógtak a gombból és a kártyából is. A tördelést a dokumentált `label`
   parton engedjük meg, 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; }
.entry-sub   { font-weight: var(--wa-font-weight-normal); }

/* ── Bérlő-jelző (a fejlécbe az appboot.js szúrja be, minden app-oldalon) ──────
   A wa-badge alapból NAGYBETŰSÍT — státusz-címkénél (AKTÍV, ULTRA) ez kívánatos,
   itt viszont NEM: a badge tartalma a bérlő SAJÁT neve (pl. „innovaLAB",
   „TritonLife"), amiben a kis- és nagybetűk a védjegy részei. A kisbetűs kezdetű
   innovaLIS-t sem írnánk át INNOVALIS-ra. A dokumentált `base` parton kapcsoljuk ki.

   A jelző mostantól a bérlő SAJÁT jelével kezdődik (`.tenant-brand`, a megosztott
   /_shared/theme.css-ből) — ezért a `base` part sorrá rendezi a jelet és a nevet. */
#tenant-badge::part(base) {
  text-transform: none;
  display: inline-flex;
  align-items: center;
  gap: var(--wa-space-2xs);
}

/* A jel a badge SAJÁT sorához igazodik, nem a globális skálához: a jelző
   `wa-font-size-xs`, a jel alapmérete viszont `xl` lenne — az megnövelné a fejlécet.
   Az `1lh` pontosan a badge sormagassága; ahol a böngésző nem ismeri, a fölötte álló
   token-érték marad érvényben. (A jel a fény-DOM-ban ül — slotolt tartalom —, ezért
   közönséges leszármazott-szabállyal elérhető.) */
#tenant-badge .tenant-brand {
  --tb-meret: var(--wa-font-size-m);
  --tb-meret: 1lh;
}