/*
 * Login page CSS (pouze pro /user/login).
 *
 * Poznámka:
 * - Tento soubor má být připojený pouze na login stránce (attach_library),
 *   aby se styly nepropsaly do dalších formulářů na webu.
 */

/* Základní vycentrování obsahu stránky. */
.login-page {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px 16px;
  box-sizing: border-box;
  /* font-size:1.5em; */
  text-align: left; 
}

/* Kontejner (karta) kolem login obsahu. */
.login-main {
  width: 100%;
  max-width: 520px;
}

/*
 * Drupal obvykle renderuje login formulář jako:
 * form.user-login-form
 * + okolo mohou být messages, title apod.
 */
.login-main form.user-login-form {
  padding: 0;
}

/* Rozestupy mezi prvky formuláře. */
.login-main .form-item {
  margin-bottom: 16px;
}

/* Popisky čitelně a s mezerou. */
.login-main label {
  display: inline-block;
  margin-bottom: 6px;
}

/* Inputy přes celou šířku (konzervativně). */
.login-main input[type="text"],
.login-main input[type="email"],
.login-main input[type="password"],
.login-main input[type="submit"] {
  /* width: 100%; */
  box-sizing: border-box;
  padding: 10px 12px;
  /* border: 1px solid #999; */
  border-radius: 30px;
  font-size:1em;
  text-align: left; 
}

/* Soustředění: decentní outline pro přístupnost. */
.login-main input[type="text"]:focus,
.login-main input[type="email"]:focus,
.login-main input[type="password"]:focus {
  outline: 0 solid red;
  outline-offset: 0px;
  box-sizing: border-box;
}

/* Checkbox řádky (např. "Remember me"). */
.login-main .form-type-checkbox {
  display: flex;
  align-items: center;
  gap: 10px;
}
.login-main .form-type-checkbox input {
  width: auto;
}


/* .login-main input[type="submit"]:hover{background:#000;color:#fff} */

/* Pomocné odkazy pod formulářem (zapomenuté heslo apod.). */
.login-main nav,
.login-main .item-list,
.login-main .description {
  margin-top: 16px;
}

/* Systémové hlášky (status/warning/error) – jen drobné odsazení. */
.login-main .messages {
  margin-bottom: 16px;
}


/* terms page */

.button.form-disabled{opacity:.2}
.ai-agent-terms-gate-form a{color:#666}
.ai-agent-terms-gate-form a:hover{color:#00FF00}
.ai-agent-terms__hint{color:#666;font-size:.8em}
/* ==========================================================================
   Hezké checkboxy pro AI terms gate form (Drupal 11)
   - Konzervativně scope-nuté pouze na .ai-agent-terms-gate-form
   - Bez JS, bez zásahů do šablon
   - Přístupnost: focus-visible, zachované label klikání
   - Fix: checkbox se nesmí ve flexu smrsknout + zarovnání nahoře
   ========================================================================== */

/* Wrapper: input + label nahoře (ne na střed) */
.ai-agent-terms-gate-form .form-item {
  display: flex;
  align-items: flex-start; /* zarovnání checkboxu k horní hraně textu */
  gap: 12px;
}

/* Checkbox: vlastní vzhled, fixní rozměry, zákaz smrsknutí ve flexu */
.ai-agent-terms-gate-form input[type="checkbox"] {
  /* 1) Vypneme nativní vzhled */
  -webkit-appearance: none;
  appearance: none;

  /* 2) Fixní rozměry + flex pojistky proti smrsknutí */
  width: 22px;
  height: 22px;
  flex: 0 0 22px;      /* kritické: ve flexu se checkbox nesmí smrsknout */
  min-width: 22px;     /* pojistka pro různé prohlížeče */
  min-height: 22px;    /* pojistka pro různé prohlížeče */

  /* 3) Zarovnání vůči prvnímu řádku textu labelu */
  margin: 0;           /* reset - řeší konzistenci mezi browsery */
  margin-top: 4px;     /* jemné dorovnání (dle fontu můžeš doladit 2–6px) */

  /* 4) Základní box */
  border: 2px solid rgba(255, 255, 255, 0.28);
  border-radius: 20px;
  background: rgba(0, 0, 0, 0.12);

  /* 5) Jemný “UI” efekt */
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.06) inset;
  cursor: pointer;

  /* 6) Pro pseudo-element fajfky */
  position: relative;

  /* 7) Plynulé přechody */
  transition: border-color 120ms ease, background-color 120ms ease, box-shadow 120ms ease;
}

.ai-agent-terms-gate-form input[type="checkbox"]:hover {
  border-color: rgba(255, 255, 255, 0.45);
}

.ai-agent-terms-gate-form input[type="checkbox"]:focus-visible {
  /* Přístupnost: viditelný focus ring */
  outline: 3px solid rgba(0, 255, 0, 0.35);
  outline-offset: 2px;
}

.ai-agent-terms-gate-form input[type="checkbox"]:checked {
  /* Jemné zvýraznění boxu po zaškrtnutí */
  border-color: rgba(0, 255, 0, 0.85);
  background: rgba(0, 255, 0, 0.10);
  box-shadow: 0 0 0 3px rgba(0, 255, 0, 0.12);
}

.ai-agent-terms-gate-form input[type="checkbox"]:checked::after {
  /* Bold fajfka */
  content: "✓";
  position: absolute;
  left: 50%;
  top: 50%;

  /* Vycentrování */
  transform: translate(-50%, -55%);

  /* Styl fajfky */
  color: #00FF00;
  font-weight: 900;
  font-size: 18px;
  line-height: 1;

  /* Konzistentní vykreslení */
  text-rendering: geometricPrecision;
  -webkit-font-smoothing: antialiased;
}

/* Label: klikatelnost, správné zalamování ve flexu */
.ai-agent-terms-gate-form label.option {
  cursor: pointer;
  user-select: none;

  /* Dovolíme labelu zabrat zbytek šířky a správně se zalamovat */
  flex: 1 1 auto;
  min-width: 0; /* důležité pro zalamování textu ve flexboxu */
}

/* Disabled stav (kdyby se někdy použil) */
.ai-agent-terms-gate-form input[type="checkbox"]:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

.ai-agent-terms-gate-form input[type="checkbox"]:disabled + label,
.ai-agent-terms-gate-form input[type="checkbox"]:disabled ~ label {
  opacity: 0.65;
  cursor: not-allowed;
}
.ai-agent-terms-greeting-text {font-size:1.5em;margin-bottom:20px}