/* Editor tabúľ – rozhranie pre prevádzkovateľa aj pre hotel.
   Zámerne málo prvkov: hotel má dostať pár zrozumiteľných obrazoviek, nie CMS. */

*{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#eef2f6; --panel:#fff; --line:#dae2ea; --ink:#12212e; --dim:#5d7488;
  --akcent:#2f9e6b; --akcentInk:#04180f; --zvyraz:#c8873c;
  --zle:#c9403c; --zleBg:#fdeeed;
  --hover:#f6f9fb; --panel2:#fbfdfe; --vstup:#fff;
}
:root[data-theme=dark]{
  --bg:#0b131c; --panel:#132030; --line:#27394d; --ink:#e7eef4; --dim:#94a8bb;
  --akcent:#38b27c; --akcentInk:#04180f; --zvyraz:#e0a44a;
  --zle:#e5615c; --zleBg:#3a1e1d;
  --hover:#1a2836; --panel2:#16232f; --vstup:#0f1a26;
}
body{background:var(--bg);color:var(--ink);font:15px/1.55 "Segoe UI",system-ui,sans-serif;height:100vh;overflow:hidden}
button,input,select,textarea{font:inherit;color:inherit}

/* ---------- prihlásenie ---------- */
.login{height:100vh;display:grid;place-items:center;background:#12212e}
.login .box{background:var(--panel);border-radius:16px;padding:34px 36px;width:360px;
  box-shadow:0 24px 60px rgba(0,0,0,.35)}
.login h1{font-size:21px;margin-bottom:4px}
.login p{color:var(--dim);font-size:13.5px;margin-bottom:22px}
.login label{display:block;font-size:13px;color:var(--dim);margin:12px 0 5px}
.login input{width:100%;padding:11px 13px;border:1px solid var(--line);border-radius:9px;background:var(--vstup);color:var(--ink)}
.login input:focus{outline:2px solid var(--akcent);outline-offset:-1px}
.login button{width:100%;margin-top:20px;padding:12px;background:var(--akcent);color:#fff;
  border:0;border-radius:9px;font-weight:600;cursor:pointer}
.login .chyba{margin-top:14px;background:var(--zleBg);color:var(--zle);border-radius:8px;
  padding:9px 12px;font-size:13.5px;display:none}

/* ---------- rámec ---------- */
.app{display:none;height:100vh;grid-template-rows:auto 1fr}
.app.on{display:grid}
.top{display:flex;align-items:center;flex-wrap:wrap;gap:10px 12px;background:var(--topbar,#12212e);color:#fff;padding:8px 16px;min-height:54px}
.top .n{font-weight:600}
.top .kto{margin-left:auto;font-size:13px;color:#9fb4c7}
.top button{background:#243849;color:#cfe0ee;border:1px solid #33506a;border-radius:8px;
  padding:6px 12px;font-size:13px;cursor:pointer}
.top button:hover{background:#2d4459}
.top button.hlavne{background:var(--akcent);border-color:var(--akcent);color:#fff;font-weight:600}
/* Disabled tlačidlá NEschovávame priehľadnosťou (text sa strácal na tmavej
   lište) – dáme im tlmené, ale čitateľné farby. */
.top button:disabled{opacity:1;background:#1c2b3a;color:#8397ab;border-color:#26384a;cursor:default}
.top button.hlavne:disabled{background:#2b4b3d;border-color:#2b4b3d;color:#bfe0d0}
.top .draft{background:var(--zvyraz);color:#241403;border-radius:99px;padding:3px 11px;
  font-size:12px;font-weight:700;display:none}
.top .draft.on{display:inline-block}

.telo{display:grid;grid-template-columns:400px 1fr;min-height:0}
.panel{background:var(--panel);border-right:1px solid var(--line);overflow:auto;padding:16px}
.nahlad{background:#0a1017;display:flex;flex-direction:column;min-width:0}
.nahladLista{display:flex;align-items:center;gap:8px;padding:9px 14px;background:#0f1a24;
  border-bottom:1px solid #1d2c3a;color:#9fb4c7;font-size:13px;flex-wrap:wrap}
.nahladLista select{background:#1a2634;color:#cfe0ee;border:1px solid #2b3a4b;
  border-radius:7px;padding:5px 9px;font-size:13px}
.nahladLista .medzera{flex:1}
.ramik{flex:1;display:grid;place-items:center;padding:16px;min-height:0}
.ramik iframe{border:0;background:#000;box-shadow:0 18px 50px rgba(0,0,0,.5);border-radius:4px}

/* ---------- panel ---------- */
.sekcia{border:1px solid var(--line);border-radius:12px;margin-bottom:12px;overflow:hidden}
.sekcia>h2{font-size:14px;padding:11px 14px;background:var(--hover);border-bottom:1px solid var(--line);
  cursor:pointer;display:flex;align-items:center;gap:8px}
.sekcia>h2 .sip{margin-left:auto;color:var(--dim);font-size:12px}
.sekcia .obsah{padding:14px}
.sekcia.zavreta .obsah{display:none}

.pole{margin-bottom:12px}
.pole label{display:block;font-size:12.5px;color:var(--dim);margin-bottom:4px}
.pole input[type=text],.pole input[type=number],.pole select,.pole textarea{
  width:100%;padding:8px 10px;border:1px solid var(--line);border-radius:8px;background:var(--vstup);color:var(--ink)}
.pole textarea{min-height:66px;resize:vertical}
.pole input:focus,.pole select:focus,.pole textarea:focus{outline:2px solid var(--akcent);outline-offset:-1px}
.riadok{display:flex;gap:8px}
.riadok>*{flex:1}

.volby{display:flex;gap:6px;flex-wrap:wrap}
.volby button{padding:7px 12px;border:1px solid var(--line);background:var(--vstup);color:var(--ink);border-radius:8px;cursor:pointer;font-size:13.5px}
.volby button.on{background:var(--akcent);border-color:var(--akcent);color:#fff;font-weight:600}
.farby{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.farby button{width:30px;height:30px;border-radius:50%;border:2px solid var(--line);cursor:pointer;padding:0}
.farby button.on{border-color:#12212e;box-shadow:0 0 0 2px #fff,0 0 0 4px #12212e}

/* zoznam obrazoviek */
.zalozky{display:flex;gap:6px;margin-bottom:12px;flex-wrap:wrap}
.zalozky button{padding:6px 11px;border:1px solid var(--line);background:var(--vstup);color:var(--ink);border-radius:8px;
  cursor:pointer;font-size:13px}
.zalozky button.on{background:#12212e;border-color:#12212e;color:#fff}
.zalozky button.pridaj{border-style:dashed;color:var(--dim)}

/* zoznam blokov */
.blok{border:1px solid var(--line);border-radius:10px;margin-bottom:9px;background:var(--panel2)}
.blok .hlava{display:flex;align-items:center;gap:8px;padding:9px 11px;cursor:pointer}
.blok .hlava b{font-size:13.5px}
.blok .hlava .sirka{margin-left:auto;font-size:12px;color:var(--dim)}
.blok .hlava .x{color:var(--dim);border:0;background:none;cursor:pointer;font-size:15px;padding:0 3px}
.blok .hlava .x:hover{color:var(--zle)}
.blok .telo2{padding:0 11px 11px;border-top:1px solid var(--line);display:none}
.blok.otvoreny .telo2{display:block}
.blok .telo2>.pole:first-child{margin-top:11px}

.dvojice .par{display:flex;gap:6px;margin-bottom:6px}
.dvojice .par input{flex:1;padding:7px 9px;border:1px solid var(--line);border-radius:7px;background:var(--vstup);color:var(--ink)}
.dvojice .par button{border:1px solid var(--line);background:var(--vstup);color:var(--dim);border-radius:7px;
  width:32px;cursor:pointer;color:var(--dim)}
.pridajRiadok{border:1px dashed var(--line);background:var(--vstup);border-radius:8px;padding:7px 12px;
  cursor:pointer;color:var(--dim);font-size:13px;width:100%}

.tip{font-size:12.5px;color:var(--dim);background:var(--hover);border-left:3px solid var(--line);
  padding:8px 11px;border-radius:0 8px 8px 0;margin-bottom:12px}
.zoznamTabuli{padding:24px;overflow-y:auto;min-height:0}
.zoznamTabuli .karta{background:var(--panel);border:1px solid var(--line);border-radius:12px;
  padding:16px 18px;margin-bottom:10px;display:flex;align-items:center;gap:14px;cursor:pointer;max-width:640px}
.zoznamTabuli .karta:hover{border-color:var(--akcent)}
.zoznamTabuli .karta b{font-size:16px}
.zoznamTabuli .karta .m{color:var(--dim);font-size:13px}
.zoznamTabuli .karta .st{margin-left:auto;font-size:12.5px;color:var(--dim);text-align:right}

/* nahrávanie fotiek */
.foto-pole{display:flex;flex-direction:column;gap:8px}
.foto-nahlad{position:relative;width:100%;aspect-ratio:16/9;border-radius:8px;overflow:hidden;
  background:#0d1622;display:flex;align-items:center;justify-content:center}
.foto-nahlad img{width:100%;height:100%;object-fit:cover;display:block}
.foto-prazdne{color:#6b7f95;font-size:13px}
.foto-x{position:absolute;top:6px;right:6px;width:28px;height:28px;border-radius:50%;
  border:0;background:rgba(0,0,0,.6);color:#fff;cursor:pointer;font-size:14px}
.foto-akcie{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.polozka-foto-riadok{display:flex;gap:10px;align-items:flex-start;margin-bottom:10px;
  padding-bottom:10px;border-bottom:1px solid var(--line)}
.polozka-foto-riadok .foto-pole{width:140px;flex:none}
.polozka-foto-riadok .foto-nahlad{aspect-ratio:1}
.polozka-foto-texty{flex:1;display:flex;flex-direction:column;gap:6px;min-width:0}
.polozka-foto-texty input{padding:7px 9px;border:1px solid var(--line);border-radius:7px;
  background:var(--vstup);color:var(--ink)}
.foto-galeria{flex:1;min-width:0}

/* správa účtov */
.ucty-hlava{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.ucty-hlava h3{margin:0}
.upravUcet,.zmazUcet{font-size:12px;padding:4px 10px}

/* modálne okno (pripomienka) */
.modal-prekr{position:fixed;inset:0;background:rgba(0,0,0,.55);display:flex;
  align-items:center;justify-content:center;z-index:100;padding:20px}
.modal{background:#1a2433;border:1px solid #2b3a4d;border-radius:12px;padding:22px;
  width:100%;max-width:520px;box-shadow:0 20px 60px rgba(0,0,0,.5)}
.modal h3{margin:0 0 6px}
.modal-tip{color:#8fa3b8;font-size:13px;margin:0 0 12px}
.modal textarea{width:100%;box-sizing:border-box;background:#0f1826;color:#e6edf3;
  border:1px solid #2b3a4d;border-radius:8px;padding:10px;font:inherit;resize:vertical}
.pr-foto{display:flex;align-items:center;gap:10px;margin:10px 0}
.pr-foto #prFotoStav{color:#2f9e6b;font-size:13px}
.modal-akcie{display:flex;justify-content:flex-end;gap:10px;margin-top:14px}

/* sprievodca Nová firma */
.modal.wiz{max-width:520px}
.modal.wiz .wf-l{display:block;margin:10px 0;font-size:13px;color:#8fa3b8}
.modal.wiz .wf-l input{display:block;width:100%;box-sizing:border-box;margin-top:5px;
  padding:9px 11px;border:1px solid #2b3a4d;border-radius:9px;background:#0f1826;color:#e6edf3;font-size:15px}
.modal.wiz .wf-chk{display:flex;align-items:center;gap:8px;margin:12px 0;font-size:14px;color:#c7d3df}
.modal.wiz .wf-stav{margin-top:14px;font-size:14px;line-height:1.55;color:#c7d3df}
.modal.wiz .wf-stav code{background:#0f1826;border:1px solid #2b3a4d;padding:2px 7px;border-radius:6px;font-size:13px}

/* zoznam pripomienok */
.karta.pripom{align-items:flex-start}
.karta.pripom.hotova{opacity:.6}
.pr-text{margin:4px 0;white-space:normal;line-height:1.4}
.pr-nahlad{display:inline-block;margin-top:6px}
.pr-nahlad img{max-width:180px;max-height:120px;border-radius:6px;border:1px solid #2b3a4d;display:block}
.prToggle,.prZmaz{font-size:12px;padding:4px 10px}

/* dvojjazyčné pole (SK + EN) v editore */
.dvojjazyk{display:flex;flex-direction:column;gap:6px}
.jaz-riadok{display:flex;align-items:flex-start;gap:8px}
.jaz-znacka{flex:none;width:26px;padding-top:9px;font-size:11px;font-weight:700;
  color:#7d93a8;letter-spacing:.04em}
.jaz-riadok input,.jaz-riadok textarea{flex:1;min-width:0}

/* úpravy tipov okolia (per-hotel override) */
.tipy-uprava{margin-top:14px;border-top:1px solid var(--line);padding-top:14px}
.tipy-uprava h4{margin:0 0 10px;font-size:14px}
.tu-nadpis{font-size:12px;font-weight:700;color:#7d93a8;margin:14px 0 8px;text-transform:uppercase;letter-spacing:.04em}
.tip-uprava-karta{display:flex;align-items:center;gap:10px;padding:8px;border:1px solid var(--line);
  border-radius:8px;margin-bottom:8px;background:rgba(255,255,255,.02)}
.tip-uprava-karta.vlastna{flex-direction:column;align-items:stretch;border-color:#3d7ea6}
.tip-uprava-karta.skryta{opacity:.7}
.tu-foto{width:64px;height:44px;object-fit:cover;border-radius:5px;flex:none}
.tu-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.tu-info b{font-size:13px}
.tu-info span{font-size:11px;color:#8fa3b8;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tu-akcie{display:flex;gap:6px;flex:none}
.tu-akcie button{font-size:11px;padding:5px 9px;white-space:nowrap}
.tu-hlava{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}
.tu-znacka{font-size:10px;background:#3d7ea6;color:#fff;padding:2px 8px;border-radius:99px}
.tip-uprava-karta.skryta{justify-content:space-between}
.tip-uprava-karta.skryta button{font-size:11px;padding:5px 10px}

/* neaktívna obrazovka v záložkách */
.zalozky button.neaktivna{opacity:.55;text-decoration:line-through}
.zalozky button.neaktivna.on{opacity:1;text-decoration:none;outline:2px dashed #7d93a8}

/* prepínač jazyka v hornej lište */
.jazyky-lista{display:inline-flex;gap:5px;align-items:center;margin-left:6px}
.jaz-pill{font-size:12px;font-weight:700;padding:4px 10px;border-radius:99px;
  border:1px solid var(--line,#2b3a4d);background:transparent;color:#8fa3b8;cursor:pointer;
  display:inline-flex;align-items:center;gap:5px}
.jaz-pill.on{background:#3d7ea6;color:#fff;border-color:#3d7ea6}
.jaz-pill.jaz-pridaj{color:#7d93a8;border-style:dashed}
.jaz-x{opacity:.7;font-weight:400}
.jaz-x:hover{opacity:1;color:#ff6b6b}

/* prepínač stavu obrazovky – zelená zapnuté, červená vypnuté */
.volby.stav button{transition:background .15s,color .15s}
.volby.stav .stav-on.on{background:#2f9e6b;color:#fff;border-color:#2f9e6b}
.volby.stav .stav-off.on{background:#c9403c;color:#fff;border-color:#c9403c}

/* farebný semafor stavu tabule v zozname */
.stav-bod{display:inline-block;width:11px;height:11px;border-radius:50%;vertical-align:middle;margin-right:4px}
.stav-bod.zel{background:#2f9e6b;box-shadow:0 0 8px rgba(47,158,107,.6)}
.stav-bod.zlt{background:#c8873c;box-shadow:0 0 8px rgba(200,135,60,.6)}
.stav-bod.cerv{background:#c9403c}

/* prepnutie tabule v dohľade */
.prepni-box{margin-top:8px;font-size:11px;color:#8fa3b8}
.prepni-tabulu{margin-top:3px;font-size:12px;width:100%}

/* dohľad – väčší, čitateľnejší text na monitore */
/* Zlúčený dohľad + zoznam: jeden rozbaliteľný zoznam. Jeden riadok = jedno
   zariadenie (podľa ID) alebo tabuľa bez zariadenia. */
#dohlad{max-width:1100px}
.tz-zoznam{display:flex;flex-direction:column;gap:12px}
.tz-riadok{border:1px solid var(--line);border-radius:12px;background:var(--panel);overflow:hidden;box-shadow:0 1px 2px rgba(0,0,0,.04)}
.tz-hlava{display:flex;align-items:center;gap:12px;padding:15px 18px;cursor:pointer}
.tz-hlava:hover{background:var(--hover)}
.tz-hl-text{flex:1;min-width:0}
.tz-titul{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.tz-titul b{font-size:16.5px;font-weight:600;color:var(--ink)}
.tz-pod{font-size:13.5px;color:var(--dim);margin-top:4px;font-weight:500}
.tz-pod .hra{color:var(--ink);font-weight:600}
.tz-id{font-size:12.5px;color:var(--dim)}
.tz-slucka{font-size:12px;background:rgba(53,138,221,.14);color:#185fa5;padding:2px 9px;border-radius:6px;
  display:inline-flex;align-items:center;gap:4px}
.tz-slucka .ti{font-size:13px}
.tz-odz{font-size:13px;color:var(--dim);white-space:nowrap;font-weight:600}
.tz-odz.zlt{color:var(--zvyraz)}
.tz-odz.cerv{color:var(--zle)}
.tz-odz.akt{color:var(--akcent)}
.tz-chev{font-size:19px;color:var(--dim);transition:transform .15s;flex:none}
.tz-riadok[data-open="1"] .tz-chev{transform:rotate(180deg)}
.tz-chev.tz-edit{transform:none !important;font-size:16px}
.tz-telo{display:none;padding:0 18px 18px 44px}
.tz-riadok[data-open="1"] .tz-telo{display:block}
.tz-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;align-items:start}
.tz-grid .st{min-width:0;background:var(--hover);border-radius:10px;padding:13px 15px;font-size:13.5px;line-height:1.75}
.tz-info{font-size:13.5px}
.tz-info .m{color:var(--dim);margin:5px 0;font-weight:500}
.tz-info .m[style*="color"]{font-weight:600}
.tz-akcie{display:flex;flex-direction:column;gap:8px;align-items:stretch}
.tz-akcia{font-size:13px;padding:9px 12px;background:var(--vstup);color:var(--ink);border:1px solid var(--line);border-radius:8px;
  cursor:pointer;text-align:left;display:flex;align-items:center;gap:9px}
.tz-akcia:hover{border-color:var(--akcent)}
.tz-akcia-r{font-size:13px;color:var(--dim)}
.tz-akcia-r select{margin-top:5px;width:100%;padding:7px 9px;border:1px solid var(--line);border-radius:8px}
.tz-bezzar{font-size:12px;color:var(--dim)}
.tz-bez .tz-titul b{color:var(--dim)}
.tz-bez .stav-bod{background:#c3ccd6}
.zid-mono{font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace;font-weight:700;
  font-size:13.5px;color:#0c447c;background:rgba(53,138,221,.16);padding:2px 8px;border-radius:6px;
  letter-spacing:.5px;white-space:nowrap}
@media(max-width:640px){
  .tz-telo{padding-left:16px}
  .tz-grid{grid-template-columns:1fr}
}


/* Prepínač témy + ikony v top bare/dohľade */
.top .ikonbtn{padding:6px 9px;display:inline-flex;align-items:center;justify-content:center}
.top .ikonbtn .ti{font-size:17px;line-height:1}
.tz-chev{font-size:20px}
.tz-akcia .ti{font-size:17px;color:var(--dim);flex:none}
.tz-akcia:hover .ti{color:var(--akcent)}


/* Stav „aktualizuje sa" + točiaca sa ikona */
.tz-stav-akt{color:var(--akcent);font-weight:600;justify-content:center;cursor:default}
.spin{display:inline-block;animation:tzspin 1s linear infinite}
@keyframes tzspin{to{transform:rotate(360deg)}}


/* Responzívne – mobil/tablet: stackovanie, skrolovanie celej stránky */
@media(max-width:860px){
  body{overflow:auto}
  .app{height:auto;min-height:100vh}
  .telo{grid-template-columns:1fr}
  .nahlad{min-height:320px}
  .zoznamTabuli{padding:16px}
  #dohlad{max-width:100%}
  .tz-akcie{gap:10px}
}
@media(max-width:560px){
  .nahlad{display:none}
  .top .n{width:100%;order:-1}
}
/* --- Katalóg-picker tipov (cfg.vyber) --- */
.tipy-vyber{margin:.4rem 0 .8rem}
.tipy-vyber .tu-prep{display:flex;align-items:center;gap:.5rem;cursor:pointer;padding:.35rem 0}
.tu-katalog{max-height:320px;overflow:auto;border:1px solid var(--ciara,#2a2f3a);border-radius:8px;padding:.35rem}
.tu-katalog .tip-uprava-karta{cursor:pointer}
.tip-uprava-karta.vybrana{outline:2px solid var(--akcent,#3d7ea6);outline-offset:-2px}
.tu-katalog .tip-uprava-karta input{margin-right:.4rem}
.tu-znacka.koncept{background:#8a5a00;color:#fff}

/* Tlačidlá v modáloch (Nastavenia menu, wizardy) – bez tohto brali svetlé
   browser-default pozadie + zdedený svetlý text = neviditeľné. */
.modal button{background:#243849;color:#cfe0ee;border:1px solid #33506a;border-radius:8px;padding:9px 14px;cursor:pointer;font:inherit}
.modal button:hover{background:#2d4459}
.modal button.hlavne{background:var(--akcent);border-color:var(--akcent);color:#fff;font-weight:600}
.ns-menu button:hover{background:#2d4459}