/* ══════════════════════════════════════════════════════════════════
   OTTEVA REALITY — VSTUPNÍ SEKCE „KOUPIT · PRONAJMOUT · PRODAT" (16. 9. 2026)

   ⛔ VLASTNÍ SOUBOR. Do `styl.css` (barvy stránky) ani do `_spolecne/zaklad.css`
      se nesahá — na těch pracuje souběžná session a dva zápisy do jednoho
      souboru se navzájem přepíšou.
   ⛔ Žádná nová barva. Všechno jede z tokenů `zaklad.css`
      (--krem --list --inkoust --zlato --linka --tlumene --slabe) — světlý
      minimal luxus, teplá bílá → béžová, zlatý akcent, nikde černá.
   ══════════════════════════════════════════════════════════════════ */

/* ══ NÁLEZ 16. 9.: „VÍC MOŽNOSTÍ" BYLO OTEVŘENÉ VŽDYCKY ══════════
   `zaklad.css` dává `.hledani-vic-obal{display:flex}` — a vlastní `display`
   přebije výchozí `display:none` atributu `hidden`. Drawer tedy šel zavřít
   jen v kódu, na obrazovce zůstal otevřený od 24. 8. Se čtyřmi filtry to
   nebylo vidět; s dvanácti je z toho zeď polí hned pod herem a padá pravidlo
   „nejvýš tři možnosti na obrazovku".
   ⛔ Opravuje se TADY, ne v `zaklad.css` — na tom pracuje souběžná session.
      `sekce.css` se načítá později, takže stačí stejná síla selektoru. */
.hledani-vic-obal[hidden]{display:none !important}
/* Stejná past u všeho, co si tu sám dávám `display` a schovávám atributem. */
.vstup-mesta[hidden],.vstup-stav[hidden],.prazdno[hidden],
.vstup-karta[hidden]{display:none !important}

/* ══ CESTA ZPĚT DO OTTEVY (16. 9.) ═══════════════════════════════
   Tichá pilulka vlevo od loga — stejný tvar jako ostatní pilulky v liště,
   jen bez výplně, aby nepřebila „Vložit nemovitost". Je v lepivé liště,
   takže je vidět bez scrollu na každé obrazovce.
   ⛔ Bez JavaScriptu funguje stejně: je to obyčejný odkaz. */
.zpet-otteva{
  display:inline-flex;align-items:center;gap:.4rem;flex:0 0 auto;
  font-family:Outfit,Inter,sans-serif;font-size:.7rem;
  letter-spacing:.16em;text-indent:.16em;text-transform:uppercase;
  text-decoration:none;color:var(--tlumene);
  padding:.45rem .85rem;border-radius:2rem;
  border:1px solid var(--linka);background:rgba(255,253,250,.6);
  transition:border-color .4s var(--tah),color .4s var(--tah),
             background .4s var(--tah);
}
.zpet-otteva:hover{border-color:var(--zlato);color:var(--inkoust);
  background:var(--list)}
.zpet-otteva .zpet-sipka{text-indent:0;font-size:.85rem;line-height:1}
/* `jen-velke`/`jen-male` ze `zaklad.css` jsou `display:block`; uvnitř
   ohebného odkazu je to v pořádku (jsou to ohebné položky). */
.zpet-otteva .jen-velke,.zpet-otteva .jen-male{line-height:1}

/* Poslední, tichá položka levého panelu — cesta ven, ne čtvrtá nabídka. */
.vstup-zpet{
  display:inline-block;justify-self:start;margin-top:.25rem;
  font-size:.82rem;color:var(--slabe);text-decoration:none;
  border-bottom:1px solid transparent;padding-bottom:.1rem;
  transition:color .3s var(--tah),border-color .3s var(--tah);
}
.vstup-zpet:hover{color:var(--inkoust);border-bottom-color:var(--zlato)}

/* ⚠ ZMĚŘENO 16. 9. na živém webu, 390 px: s odkazem zpět se lišta přestala
   vejít — zlatá pilulka „VLOŽIT NEMOVITOST" končila na 448 px při okně 390 px
   a text se uřízl na „VLOŽIT NEMO". Nebylo to vidět v součtu šířek, protože
   `body{overflow-x:hidden}` přetečení schová. Odkaz zpět tedy na telefonu
   zůstává jako **ikona domů se šipkou** (význam nese `aria-label` v 8 jazycích)
   a mezera v liště se stáhne. ⛔ Opravuje se tady, ne v `styl.css`. */
@media (max-width:760px){
  .nav-in{gap:.5rem}
  .zpet-otteva{font-size:.62rem;padding:.4rem .55rem;gap:.15rem;
    letter-spacing:0;text-indent:0}
  /* Na telefonu jen ikona — text by pilulku vytlačil z obrazovky. */
  .zpet-otteva .jen-male{display:none!important}
  .zpet-otteva .zpet-domu{display:block;font-size:.95rem;line-height:1}
  .nav-akce .tlac{padding:.55rem .75rem}
}
@media (min-width:761px){
  .zpet-otteva .zpet-domu{display:none}
}
@media (max-width:420px){
  /* Nejužší telefony: logo se smí stáhnout, aby na pilulku zbylo místo. */
  .nav-in .logo{letter-spacing:.14em;text-indent:.14em}
}
@media (max-width:900px){
  /* V panelu se ze tří karet stanou záložky — odkaz zpět jde pod ně
     přes celou šířku, ne do čtvrtého sloupce. */
  .vstup-zpet{grid-column:1/-1;margin-top:.1rem}
}

/* ══ „KÓD NEPŘIŠEL" NA STRÁNCE VKLÁDÁNÍ (16. 9.) ══════════════════
   Tichý blok pod polem na kód: kam se kód poslal, co dělat, když nedorazil,
   a „Poslat znovu" s odpočtem. Stejný jazyk tvarů jako zbytek stránky. */
/* 🔴 NÁLEZ 16. 9. (stejná past jako u „Víc možností"): `vlozit.css` má
   `.pole-radek{display:flex}` a vlastní `display` **přebije** výchozí
   `display:none` atributu `hidden` — řádek „Kód z e-mailu" + „Přihlásit se"
   byl na stránce vidět OD ZAČÁTKU, dřív než si o kód kdokoli řekl, a
   „Změnit e-mail" ho neuměl schovat. Chycené strojem, ne okem.
   ⛔ Opravuje se tady, ne v `vlozit.css`. */
#radek-kodu[hidden],.kod-pomoc[hidden]{display:none!important}

.kod-pomoc{
  margin-top:.9rem;padding:1rem 1.15rem;
  background:var(--list);border:1px solid var(--linka);border-radius:1.1rem;
  display:grid;gap:.5rem;
}
.kod-komu{font-size:.92rem;color:var(--tlumene);margin:0}
/* Maskovaná adresa musí být to, co oko najde první — kvůli ní se sem člověk
   dívá (překlep v doméně). */
.kod-komu b{display:block;margin-top:.15rem;color:var(--inkoust);
  font-weight:600;font-size:1rem;word-break:break-all}
.kod-akce{display:flex;flex-wrap:wrap;align-items:center;gap:.7rem;margin-top:.15rem}
/* Vypnuté „Poslat znovu" musí VYPADAT vypnutě, jinak do něj člověk tluče. */
.kod-akce .tlac[disabled]{opacity:.45;cursor:default;transform:none;
  box-shadow:none;pointer-events:none}

/* ── celá sekce ─────────────────────────────────────────────────── */
.vstup{
  padding:clamp(2.4rem,5vw,4rem) 0 clamp(1.6rem,3vw,2.4rem);
  background:linear-gradient(180deg,var(--list) 0%,var(--krem) 100%);
  border-bottom:1px solid var(--linka);
}
/* Levý sloupec (karty) + pravý (země, hledání). Levý je na PC užší a lepivý,
   takže tři cesty dál zůstanou na očích, i když člověk projíždí filtry. */
.vstup-mriz{
  display:grid;grid-template-columns:minmax(17rem,22rem) 1fr;
  gap:clamp(1.4rem,3vw,2.6rem);align-items:start;
}

/* ── levý panel se třemi kartami ────────────────────────────────── */
.vstup-panel{position:sticky;top:calc(var(--nav-v) + 1rem);display:grid;gap:.8rem}
.vstup-panel .cislo{margin-bottom:.2rem}

.vstup-karta{
  display:grid;gap:.28rem;text-decoration:none;
  background:var(--list);border:1px solid var(--linka);border-radius:1.1rem;
  padding:1.05rem 1.2rem 1.1rem;
  transition:border-color .4s var(--tah),transform .4s var(--tah),
             box-shadow .4s var(--tah),background .4s var(--tah);
}
.vstup-karta:hover{
  transform:translateY(-2px);border-color:var(--zlato);
  box-shadow:0 .7rem 1.8rem rgba(197,160,89,.16);
}
.vstup-karta b{
  font-family:Outfit,Inter,sans-serif;font-weight:400;
  font-size:clamp(1.12rem,1.7vw,1.32rem);letter-spacing:.02em;line-height:1.2;
}
.vstup-pod{font-size:.9rem;color:var(--tlumene);line-height:1.45}
/* Cenová věta — „kdo co platí" musí být vidět hned, ne až po kliknutí. */
.vstup-cena{
  margin-top:.45rem;font-size:.82rem;line-height:1.5;color:var(--zlato);
  border-top:1px solid var(--linka);padding-top:.5rem;
}
.vstup-cena-druha{margin-top:.1rem;border-top:0;padding-top:0;color:var(--slabe)}

/* Vybraná karta: zlatý rám a tenký pruh vlevo — barva se nemění, jen se
   zvýrazní. (Stav drží `aria-pressed`, aby ho slyšela i čtečka.) */
.vstup-karta.je-vybrano{
  border-color:var(--zlato);background:var(--list);
  box-shadow:inset .22rem 0 0 var(--zlato),0 .5rem 1.4rem rgba(197,160,89,.12);
}
.vstup-karta-prodat{background:var(--krem)}

/* ── pravý sloupec ──────────────────────────────────────────────── */
.vstup-hledani{display:grid;gap:1rem}
.vstup-stitek{
  display:block;font-family:Outfit,Inter,sans-serif;font-size:.72rem;
  letter-spacing:.24em;text-indent:.24em;text-transform:uppercase;
  color:var(--slabe);margin-bottom:.35rem;
}
.vstup-zeme{display:grid;gap:.3rem}
.vstup-zeme-pole select{
  width:100%;max-width:26rem;padding:.8rem 1rem;border-radius:.8rem;
  border:1px solid var(--linka);background:var(--list);color:var(--inkoust);
}
.vstup-zeme-pole select:focus{outline:none;border-color:var(--zlato)}
#zeme-odkud{margin-top:.1rem}

/* ── města jedním klepnutím ─────────────────────────────────────── */
.vstup-mesta{display:flex;flex-wrap:wrap;gap:.45rem}
.vstup-mesto{
  font-size:.86rem;padding:.42rem .95rem;border-radius:2rem;
  border:1px solid var(--linka);background:var(--list);color:var(--tlumene);
  transition:border-color .3s var(--tah),color .3s var(--tah);
}
.vstup-mesto:hover{border-color:var(--zlato);color:var(--inkoust)}
.vstup-mesto.je-vybrano{background:var(--zlato);color:#fff;border-color:var(--zlato)}

/* ⚠ `zaklad.css` stylizuje uvnitř filtrů jen `input[type=number]` a `select`.
   Pole „Dispozice" je `type=text` (má našeptávač `datalist`), takže zůstávalo
   v surovém vzhledu prohlížeče — bílý rámeček mezi béžovými poli, jako by tam
   nepatřilo. Doplněno 16. 9. na stejný tvar jako ostatní. */
.hledani-vic-obal input[type=text],
.hledani-vic-obal input[type=search]{
  flex:1 1 9rem;min-width:0;
  padding:.7rem .9rem;border:1px solid var(--linka);border-radius:.8rem;
  background:var(--krem);color:var(--inkoust);font:inherit;font-size:.88rem;
}
.hledani-vic-obal input[type=text]::placeholder{color:var(--slabe)}
.hledani-vic-obal input[type=text]:focus{outline:none;border-color:var(--zlato)}

/* Seřazení a „jen s fotkami" dědí vzhled ostatních filtrů ze `zaklad.css`. */
.hledani-razeni{display:flex;align-items:center;gap:.5rem}
.hledani-razeni .vstup-stitek{margin-bottom:0}
.hledani-razeni select{
  padding:.7rem .9rem;border-radius:.7rem;border:1px solid var(--linka);
  background:var(--list);color:var(--inkoust);
}
.hledani-razeni select:focus{outline:none;border-color:var(--zlato)}

.vstup-stav{font-size:.92rem;color:var(--tlumene)}
.vstup-stav b{color:var(--inkoust);font-weight:600}

/* ── prázdný stav ───────────────────────────────────────────────── */
/* ⛔ Prázdná mřížka je pro člověka porucha. Tohle je plnohodnotný obsah,
   ne hláška: řekne pravdu a dá dvě cesty dál. */
.prazdno{
  margin:1.6rem 0 0;padding:clamp(1.6rem,3vw,2.4rem);
  background:var(--list);border:1px solid rgba(197,160,89,.4);border-radius:1.2rem;
}
.prazdno h3{margin:0 0 .5rem}
.prazdno .podtext{margin:0;max-width:62ch}
.prazdno-akce{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.3rem}

/* ══ TELEFON ════════════════════════════════════════════════════
   Panel se překlopí do tří záložek nahoře — palec je má hned pod nadpisem
   a nemusí se scrollovat. Lepivost se vypíná: na malé obrazovce by sticky
   sloupec ukradl půlku plochy. */
@media (max-width:900px){
  .vstup-mriz{grid-template-columns:1fr;gap:1.2rem}
  .vstup-panel{position:static;grid-template-columns:repeat(3,1fr);gap:.5rem}
  .vstup-panel .cislo{grid-column:1/-1;margin-bottom:0}
  .vstup-karta{padding:.7rem .7rem .8rem;border-radius:.9rem;text-align:center;
    justify-items:center;align-content:start}
  .vstup-karta b{font-size:.95rem}
  /* Na třech úzkých záložkách zůstane jméno a cena; popis by je rozbil. */
  .vstup-pod{display:none}
  .vstup-cena{font-size:.7rem;padding-top:.4rem;line-height:1.35}
  .vstup-cena-druha{display:none}
  .vstup-karta.je-vybrano{box-shadow:inset 0 .18rem 0 var(--zlato)}
  .vstup-zeme-pole select{max-width:none}
}
@media (max-width:420px){
  .vstup-karta b{font-size:.86rem}
  .vstup-cena{font-size:.66rem}
}

/* Kdo má omezený pohyb, nechce, aby se karty zvedaly. */
@media (prefers-reduced-motion:reduce){
  .vstup-karta,.vstup-mesto{transition:none}
  .vstup-karta:hover{transform:none}
}