/* ══════════════════════════════════════════════════════════════════
   Vstupní stránky portálu: přihlášení (index.html), registrace, ukázka.
   DESIGN r2 (14. 10. 2026, rozhodnutí Romana: otázka 1 = A) – stejný svět jako web
   a vnitřek portálu: jen tokeny packages/ui, světlý režim + neutrálně šedý tmavý,
   výhody vlevo (pás jako hero webu), formulář vpravo v kartě. Bez nextivo.css a compat.css.
   Žádné barvy natvrdo, jen var(--nx-*).
   ══════════════════════════════════════════════════════════════════ */

.vstup{min-height:100vh;min-height:100dvh;display:grid;grid-template-columns:minmax(0,1fr)}
@media (min-width:960px){
  .vstup{grid-template-columns:minmax(0,1fr) minmax(0,560px)}
}

/* ── levý pás: značka, nadpis, výhody (jako .w-hero na webu) ── */
.vstup-info{order:2;padding:var(--nx-space-10) var(--nx-space-4) var(--nx-space-12);
  background:linear-gradient(180deg,var(--nx-color-brand-soft) 0%,var(--nx-color-bg) 100%);
  border-top:1px solid var(--nx-color-border)}
.vstup-info-obsah{max-width:520px;margin:0 auto}
@media (min-width:960px){
  .vstup-info{order:0;display:flex;flex-direction:column;justify-content:center;padding:var(--nx-space-16) var(--nx-space-12);
    border-top:0;border-right:1px solid var(--nx-color-border)}
  .vstup-info-obsah{margin:0 0 0 auto;width:100%}
}
.vstup-logo{display:inline-flex;align-items:center;gap:var(--nx-space-2);color:var(--nx-color-text);text-decoration:none;
  font-weight:var(--nx-fw-bold);font-size:var(--nx-fs-lg);letter-spacing:var(--nx-tracking-tight);margin-bottom:var(--nx-space-8);
  min-height:44px;border-radius:var(--nx-radius-sm)}
.vstup-logo img{width:32px;height:32px;display:block}
/* na telefonu je formulář nahoře → značka nad kartou, v pásu výhod se neopakuje */
.vstup-forma>.vstup-logo{align-self:center;margin-bottom:var(--nx-space-4)}
.vstup-jen-desktop{display:none}
@media (min-width:960px){ .vstup-jen-desktop{display:inline-flex} .vstup-jen-mobil{display:none} }
/* P2-1: krátký úvod nad kartou jen na telefonu (na desktopu ho skryje .vstup-jen-mobil) */
.vstup-uvod{width:100%;max-width:440px;margin:0 auto var(--nx-space-4);text-align:center}
.vstup-uvod-nadpis{font-size:var(--nx-fs-xl);font-weight:var(--nx-fw-bold);line-height:1.2;margin-bottom:var(--nx-space-1-5);text-wrap:balance}
.vstup-uvod-text{font-size:var(--nx-fs-md);line-height:var(--nx-lh-base);color:var(--nx-color-text-2);text-wrap:pretty}
.vstup-kicker{font-size:var(--nx-fs-sm);font-weight:var(--nx-fw-semibold);color:var(--nx-color-brand-text);margin-bottom:var(--nx-space-2)}
.vstup-h1{font-size:clamp(1.75rem,1.2rem + 2vw,2.375rem);font-weight:var(--nx-fw-bold);line-height:1.15;margin-bottom:var(--nx-space-4);text-wrap:balance}
.vstup-lead{font-size:var(--nx-fs-lg);line-height:var(--nx-lh-base);color:var(--nx-color-text-2);max-width:46ch;margin-bottom:var(--nx-space-6)}
.vstup-list{list-style:none;margin:0;padding:0;display:grid;gap:var(--nx-space-3)}
.vstup-list li{position:relative;padding-left:30px;color:var(--nx-color-text-2);line-height:var(--nx-lh-base)}
.vstup-list li::before{content:"";position:absolute;left:0;top:.15em;width:20px;height:20px;border-radius:50%;background:var(--nx-color-success-soft);
  border:1px solid var(--nx-color-success-border)}
.vstup-list li::after{content:"";position:absolute;left:7px;top:calc(.15em + 4px);width:5px;height:10px;border:solid var(--nx-color-success-text);
  border-width:0 2px 2px 0;transform:rotate(45deg)}
.vstup-dalsi{margin-top:var(--nx-space-8);font-size:var(--nx-fs-md);color:var(--nx-color-text-2)}
.vstup-dalsi a{font-weight:var(--nx-fw-semibold)}

/* ── pravý sloupec: karta s formulářem ── */
.vstup-forma{order:1;display:flex;flex-direction:column;justify-content:center;padding:var(--nx-space-6) var(--nx-space-4) var(--nx-space-8)}
@media (min-width:960px){ .vstup-forma{order:0;padding:var(--nx-space-12) var(--nx-space-10)} }
.vstup-karta{width:100%;max-width:440px;margin:0 auto;padding:var(--nx-space-6) var(--nx-space-5)}
@media (min-width:480px){ .vstup-karta{padding:var(--nx-space-8)} }
.vstup-karta:focus{outline:none}
.vstup-h2{font-size:var(--nx-fs-xl);font-weight:var(--nx-fw-bold);margin-bottom:var(--nx-space-1-5)}
.vstup-pod{color:var(--nx-color-text-2);font-size:var(--nx-fs-md);margin-bottom:var(--nx-space-6)}
.vstup-pod a,.vstup-mala a{font-weight:var(--nx-fw-semibold)}
.vstup-form{display:flex;flex-direction:column;gap:var(--nx-space-4)}
.vstup-mala{font-size:var(--nx-fs-sm);color:var(--nx-color-text-3);line-height:var(--nx-lh-base);text-align:center}
.vstup-zvyrazneni{font-size:var(--nx-fs-md);font-weight:var(--nx-fw-semibold);color:var(--nx-color-text);text-align:center}
.vstup-input-velky{letter-spacing:.4em;text-align:center;font-size:var(--nx-fs-xl)}
/* spinner v primárním tlačítku: bílý na indigu (výchozí je indigo na ploše) */
.nx-btn-primary .nx-spinner{border-color:color-mix(in srgb,var(--nx-color-on-brand) 40%,transparent);border-top-color:var(--nx-color-on-brand);width:16px;height:16px}

/* přepínač Přihlášení / Registrace a výběr appky v ukázce (nx-segmented přes celou šířku) */
.vstup-segmented{display:flex;width:100%;margin-bottom:var(--nx-space-6)}
.vstup-segmented .nx-tab{flex:1 1 0;justify-content:center;min-height:40px;font-size:var(--nx-fs-md)}
.vstup-segmented .nx-tab[aria-selected="true"],.vstup-segmented .nx-tab[aria-pressed="true"]{background:var(--nx-color-surface);
  color:var(--nx-color-brand-text);box-shadow:var(--nx-shadow-sm),inset 0 0 0 1px var(--nx-color-brand-border);font-weight:var(--nx-fw-semibold)}
.vstup-volba{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px}
@media (min-width:400px){ .vstup-volba{grid-template-columns:repeat(3,minmax(0,1fr))} }
.vstup-volba .nx-tab{padding:0 var(--nx-space-2);overflow:hidden;text-overflow:ellipsis;font-size:var(--nx-fs-sm)}
@media (pointer:coarse){ .vstup-segmented .nx-tab{min-height:44px} }

/* zapomenuté heslo: dost vysoký cíl (D9: dřív 23 px) */
.vstup-odkaz{display:inline-flex;align-items:center;justify-content:center;min-height:32px;padding:0 var(--nx-space-2);
  font-size:var(--nx-fs-md);color:var(--nx-color-text-2);border-radius:var(--nx-radius-sm)}
.vstup-odkaz:hover{color:var(--nx-color-brand-text)}
@media (pointer:coarse){ .vstup-odkaz{min-height:44px} }

/* oddělovač „nebo“ a tlačítka přihlášení přes Google / Microsoft / Apple */
.vstup-nebo{display:flex;align-items:center;gap:var(--nx-space-3);margin:var(--nx-space-5) 0 var(--nx-space-3);color:var(--nx-color-text-3);font-size:var(--nx-fs-sm)}
.vstup-nebo::before,.vstup-nebo::after{content:"";flex:1;height:1px;background:var(--nx-color-border)}
.vstup-oauth{display:flex;flex-direction:column;gap:var(--nx-space-2)}
.vstup-oauth svg{width:18px;height:18px;flex:none}

/* zaškrtávátko souhlasu: nx-check (24 px, na dotyku 44 px), menší písmo */
.vstup-souhlas{font-size:var(--nx-fs-md);color:var(--nx-color-text-2);line-height:var(--nx-lh-base)}
.vstup-souhlas a{font-weight:var(--nx-fw-semibold)}

/* Cloudflare Turnstile: widget je iframe, jeho vnitřní fokus neumíme obarvit → prstenec na obalu (D9) */
.vstup-captcha{min-height:65px;border-radius:var(--nx-radius-md)}
.vstup-captcha:focus-within{outline:2px solid var(--nx-color-focus);outline-offset:3px}

/* hlášky (#msg v přihlášení a ukázce; registrace používá nx-alert) */
.msg{font-size:var(--nx-fs-md);line-height:var(--nx-lh-base);border-radius:var(--nx-radius-md);margin-top:var(--nx-space-4)}
.msg:empty{display:none}
.msg.ok,.msg.err{padding:var(--nx-space-3) var(--nx-space-4);border:1px solid}
.msg.ok{background:var(--nx-color-success-soft);border-color:var(--nx-color-success-border);color:var(--nx-color-success-soft-text)}
.msg.err{background:var(--nx-color-danger-soft);border-color:var(--nx-color-danger-border);color:var(--nx-color-danger-soft-text)}
#stav:empty{display:none}

/* formuláře přihlášení: přepíná se třídou .on (skript) */
.vstup-prepinany{display:none}
.vstup-prepinany.on{display:flex}

.vstup-hotovo-ikona{width:56px;height:56px;border-radius:var(--nx-radius-lg);background:var(--nx-color-success-soft);color:var(--nx-color-success-text);
  display:grid;place-items:center;margin-bottom:var(--nx-space-5)}
.vstup-hotovo-ikona .nx-icon{width:28px;height:28px}

.vstup-paticka{text-align:center;font-size:var(--nx-fs-sm);color:var(--nx-color-text-3);margin-top:var(--nx-space-6)}
.vstup-paticka a{font-weight:var(--nx-fw-semibold)}

/* ══════════════════════════════════════════════════════════════════
   DESIGN r3 (14. 10. 2026): zbylé vstupní stránky bez nextivo.css –
   otevrit.html, vstoupit.html, reset.html (jedna karta uprostřed)
   a smazani-uctu.html (čitelná stránka s textem). Jen tokeny.
   ══════════════════════════════════════════════════════════════════ */
.vstup-stred{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:var(--nx-space-8) var(--nx-space-4);background:linear-gradient(180deg,var(--nx-color-brand-soft) 0%,var(--nx-color-bg) 60%)}
.vstup-stred>.vstup-logo{margin-bottom:var(--nx-space-5)}
.vstup-stred .vstup-karta{max-width:440px}
.vstup-radek{display:flex;align-items:center;gap:var(--nx-space-4)}
.vstup-radek .nx-spinner{flex:none;width:24px;height:24px;border-width:3px}
.vstup-h3{font-size:var(--nx-fs-lg);font-weight:var(--nx-fw-bold);line-height:var(--nx-lh-tight);margin-bottom:var(--nx-space-1)}
.vstup-text{color:var(--nx-color-text-2);line-height:var(--nx-lh-base);margin-bottom:var(--nx-space-4)}
.vstup-text code{font-family:var(--nx-font-mono);font-size:.92em;background:var(--nx-color-surface-2);padding:1px 5px;border-radius:var(--nx-radius-sm)}
.vstup-karta .msg{text-align:center}
.vstup-blok{margin:var(--nx-space-3) 0 var(--nx-space-4)}

/* smazani-uctu.html: stránka s textem (veřejná pro Google Play / App Store i pro přihlášené) */
.vstup-dokument{max-width:760px;margin:0 auto;padding:var(--nx-space-8) var(--nx-space-4) var(--nx-space-16)}
.vstup-dokument>.vstup-logo{margin-bottom:var(--nx-space-6)}
.vstup-dokument h1{font-size:clamp(1.6rem,1.2rem + 1.5vw,2.1rem);font-weight:var(--nx-fw-bold);line-height:1.2;margin-bottom:var(--nx-space-2)}
.vstup-dokument .vstup-lead{margin-bottom:var(--nx-space-4)}
.vstup-dokument .nx-card{margin-top:var(--nx-space-5);padding:var(--nx-space-5)}
@media (min-width:480px){ .vstup-dokument .nx-card{padding:var(--nx-space-6) var(--nx-space-8)} }
.vstup-dokument .vstup-h3{margin-bottom:var(--nx-space-3)}
#nx-obsah:focus{outline:none}
.vstup-dokument .nx-card p{color:var(--nx-color-text-2);line-height:var(--nx-lh-base);margin:0 0 var(--nx-space-3)}
.vstup-dokument .nx-card p:last-child{margin-bottom:0}
.vstup-dokument .nx-card b{color:var(--nx-color-text)}
.vstup-dokument ul{margin:0 0 var(--nx-space-3);padding-left:var(--nx-space-5);color:var(--nx-color-text-2);line-height:var(--nx-lh-base)}
.vstup-dokument li{margin-bottom:var(--nx-space-1-5)}
.vstup-dokument .nx-alert{margin-top:var(--nx-space-4)}
.vstup-dokument .nx-alert+p{margin-top:var(--nx-space-3)}
.vstup-dokument .nx-field{max-width:320px;margin-bottom:var(--nx-space-3)}
.vstup-zpet{display:inline-flex;align-items:center;gap:var(--nx-space-1-5);min-height:32px;font-weight:var(--nx-fw-semibold)}
@media (pointer:coarse){ .vstup-zpet{min-height:44px} }
.vstup-varovani{border-color:var(--nx-color-warning-border)}
.vstup-hotovo{text-align:center;max-width:640px;margin:var(--nx-space-10) auto 0}
.vstup-hotovo .vstup-hotovo-ikona{margin:0 auto var(--nx-space-5)}
