/* Prihlásenie /v2/login — Bento/Glass.
   Premenné a pozadie prichádzajú z dashboard.css; tu je len karta a formulár.
   Rail sa nepoužíva, preto `.lg-body` ruší jeho odsadenie. */

.lg-body{display:flex;min-height:100vh;min-height:100svh;align-items:center;justify-content:center;padding:24px 16px}

.lg-wrap{width:100%;max-width:408px}

.lg-card{background:var(--surface-strong);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);
  border:1px solid var(--stroke);border-radius:var(--r-modal);box-shadow:var(--shadow-lift);
  padding:34px 30px 24px;text-align:center;
  animation:lgin .32s cubic-bezier(.33,0,.2,1)}
@keyframes lgin{from{transform:translateY(12px);opacity:0}to{transform:none;opacity:1}}

.lg-logo{width:58px;height:58px;margin:0 auto 16px;border-radius:20px;display:grid;place-items:center;
  color:#fff;background:var(--grad);
  box-shadow:0 12px 26px -8px rgba(79,70,229,.5)}
.lg-logo svg{width:28px;height:28px}

.lg-card h1{font-size:1.5rem;font-weight:800;letter-spacing:-.02em;color:var(--ink)}
.lg-sub{margin-top:5px;font-size:.86rem;font-weight:500;color:var(--ink-2)}

.lg-msgs{display:flex;flex-direction:column;gap:8px;margin-top:18px;text-align:left}
.lg-msg{display:flex;align-items:flex-start;gap:9px;padding:11px 13px;border-radius:14px;
  font-size:.8rem;font-weight:600;line-height:1.45;
  background:var(--fill-2);color:var(--ink-2)}
.lg-msg.bad{background:var(--rose-soft);color:var(--rose)}
.lg-msg svg{width:17px;height:17px;flex:none;margin-top:1px}

.lg-card form{margin-top:20px;text-align:left}

.lg-f{display:block;margin-bottom:13px}
.lg-f>span:first-child{display:block;font-size:.64rem;font-weight:800;letter-spacing:.06em;
  text-transform:uppercase;color:var(--ink-3);margin-bottom:6px}

.lg-input{position:relative;display:block}
.lg-input>svg{position:absolute;left:14px;top:50%;transform:translateY(-50%);
  width:17px;height:17px;color:var(--ink-3);pointer-events:none}
/* Vzhľad poľa (vrátane 16px písma, ktoré bráni priblíženiu na iPhone) je
   v dashboard.css. Prihlásenie je jediná stránka bez lišty, takže polia smú
   byť vyššie a viac zaoblené — to je jediné, čo si tu drží vlastné.
   Odsadenie sa píše po stranách, nie skratkou: skratka `padding` by zmazala
   `padding-right:46px` pri poli s okom na odkrytie hesla. */
.lg-input input{min-height:50px;padding-left:42px;padding-right:14px;border-radius:var(--fld-r)}
.lg-input:has(.lg-eye) input{padding-right:46px}

.lg-eye{position:absolute;right:8px;top:50%;transform:translateY(-50%);
  width:32px;height:32px;display:grid;place-items:center;border:0;border-radius:10px;
  background:transparent;color:var(--ink-3);cursor:pointer;transition:.14s}
.lg-eye:hover{background:var(--fill-2);color:var(--ink-2)}
.lg-eye.on{color:var(--teal)}
.lg-eye svg{width:17px;height:17px}

.lg-err{margin:-7px 0 12px;font-size:.74rem;font-weight:700;color:var(--rose)}

.lg-remember{display:flex;align-items:center;gap:9px;margin:4px 0 18px;cursor:pointer;
  font-size:.82rem;font-weight:600;color:var(--ink-2);user-select:none}

.lg-submit{width:100%;min-height:50px;display:flex;align-items:center;justify-content:center;gap:9px;
  border:0;border-radius:var(--btn-r);cursor:pointer;
  font-family:inherit;font-size:.92rem;font-weight:800;color:#fff;
  background:var(--grad);
  box-shadow:0 12px 26px -10px rgba(79,70,229,.6);transition:transform .14s,box-shadow .14s}
.lg-submit:hover{transform:translateY(-1px);box-shadow:0 16px 32px -10px rgba(79,70,229,.7)}
.lg-submit:active{transform:none}
.lg-submit svg{width:18px;height:18px}

.lg-foot{display:flex;align-items:center;justify-content:center;gap:7px;flex-wrap:wrap;
  margin-top:20px;padding-top:15px;border-top:1px solid var(--line-soft);
  font-size:.66rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-3)}
.lg-foot svg{width:13px;height:13px;color:var(--teal)}

.lg-copy{margin-top:22px;text-align:center;font-size:.72rem;font-weight:500;color:var(--ink-3)}

@media(max-width:640px){
  .lg-card{padding:28px 20px 20px;border-radius:var(--r-modal)}
  .lg-foot{justify-content:center}
}

/* Nízky displej (malý telefón, alebo veľký s vysunutou klávesnicou): karta
   mala 519 px pri 556 px výšky, takže tlačidlo končilo na hrane obrazovky.
   Tu sa všetko zvislé stlačí — vodorovné rozmery ostávajú, aby sa polia
   nezúžili pod pohodlný dotyk. */
@media(max-height:700px){
  .lg-body{padding:14px 16px;align-items:flex-start}
  .lg-card{padding:20px 22px 16px}
  .lg-logo{width:44px;height:44px;margin-bottom:10px;border-radius:var(--card-r)}
  .lg-logo svg{width:22px;height:22px}
  .lg-card h1{font-size:1.25rem}
  .lg-sub{font-size:.8rem}
  .lg-card form{margin-top:14px}
  .lg-f{margin-bottom:10px}
  /* Na nízkej obrazovke klesá VÝŠKA, nie odsadenie: skratka `padding` by
     zmazala `padding-right:46px` a oko na odkrytie hesla by si sadlo na text. */
  .lg-input input{min-height:44px;padding-left:40px}
  .lg-remember{margin:2px 0 12px}
  .lg-submit{min-height:46px}
  .lg-foot{margin-top:14px;padding-top:11px}
  .lg-copy{margin-top:12px}
}
