/* Adverti portál — len to, čo je vlastné portálu.
   Hlavička, šírka tela, účet, dialógy a komponenty sú spoločné
   v /ui/adverti.css, aby boli rovnaké veci na rovnakých miestach. */

/* wordmark portálu má dolný ťah písmena „p", preto je o štvrtinu vyšší —
   písmená potom vyzerajú rovnako veľké ako v dochádzke a sklade */
.top .logo{height:24px}
.brand-lg .logo{height:47px}     /* prihlásenie — rovnako veľké písmená ako inde */

/* ══════════ uvítanie ══════════ */
.vitaj{margin:14px 0 22px}
.vitaj h1{font-size:26px;letter-spacing:-.03em}
.vitaj p{margin:4px 0 0;color:var(--muted);font-size:14px}

/* ══════════ dlaždice modulov ══════════ */
.dlazdice{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px}
.dlazdica{display:flex;flex-direction:column;gap:8px;padding:20px 20px 18px;
  background:var(--surface);border:1px solid var(--line);border-radius:14px;
  text-decoration:none;color:var(--ink);transition:border-color .13s,transform .13s,box-shadow .13s}
.dlazdica:hover{border-color:var(--faint);transform:translateY(-2px);box-shadow:var(--shadow)}
.dl-hlava{display:flex;align-items:center;gap:11px;min-width:0}
.dl-nazov{font:700 21px var(--h);letter-spacing:-.025em;min-width:0;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dl-popis{font-size:13px;color:var(--muted);line-height:1.45;flex:1}
.dl-spodok{display:flex;align-items:center;gap:7px;margin-top:6px;
  font:600 12px var(--b);color:var(--faint)}
.dl-spodok .ico{margin-left:auto;transition:color .13s,transform .13s}
.dlazdica:hover .dl-spodok .ico{color:var(--brand);transform:translateX(2px)}

.login-lead{color:var(--muted);margin:0 0 22px;font-size:14px}

@media(max-width:560px){
  .vitaj h1{font-size:22px}
  .dlazdice{grid-template-columns:1fr}
}

/* Správa skladu v nastaveniach — verne podľa pôvodného okna v sklade */
.sksprava .tabs{display:flex;flex-wrap:wrap;gap:2px 4px;border-bottom:1px solid var(--line);margin-bottom:14px}
.sksprava .tabs button{height:40px;border:none;border-bottom:2px solid transparent;border-radius:0;
  background:transparent;color:var(--ink-2);padding:0 9px;font-weight:500;white-space:nowrap;
  display:inline-flex;align-items:center;justify-content:center;gap:6px;flex:1 1 auto;cursor:pointer;font-size:14px}
.sksprava .tabs button.active{color:var(--ink);border-bottom-color:var(--brand)}
.sksprava .subtabs{display:flex;gap:4px;flex-wrap:wrap;margin-bottom:14px;background:var(--recess);
  border:1px solid var(--line);border-radius:10px;padding:4px}
.sksprava .subtabs button{flex:1 1 auto;height:32px;padding:0 10px;border:none;border-radius:7px;
  background:transparent;color:var(--ink-2);font-size:13px;white-space:nowrap;cursor:pointer}
.sksprava .subtabs button:hover{background:var(--line-2);color:var(--ink)}
.sksprava .subtabs button.active{background:var(--brand);color:#fff}
.sksprava input:not([type="checkbox"]),.sksprava select{height:40px;padding:0 12px;border:1px solid var(--line);
  border-radius:8px;background:var(--surface);color:var(--ink);outline:none;font:inherit;font-size:14px}
.sksprava input:focus,.sksprava select:focus{border-color:var(--brand)}
.sksprava .chip-editor{display:flex;flex-direction:column;gap:8px;margin-bottom:12px}
.sksprava .editor-row{display:flex;align-items:center;gap:8px;background:var(--surface);border-radius:8px}
.sksprava .editor-row.dragging{opacity:.6;transform:scale(1.015);box-shadow:0 8px 22px rgba(0,0,0,.22);position:relative;z-index:3}
.sksprava .er-main{flex:1;min-width:0;display:flex;flex-direction:column}
.sksprava .er-main input{width:100%}
.sksprava .drag-handle{flex:none;width:22px;color:var(--faint);cursor:grab;display:grid;place-items:center}
.sksprava .editor-row .base-input{flex:none;width:88px;text-align:center;background:var(--recess);
  -moz-appearance:textfield;appearance:textfield}
.sksprava .editor-row .base-input::-webkit-outer-spin-button,
.sksprava .editor-row .base-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.sksprava .editor-row .cat-person{flex:none;width:215px;text-align:left}
.sksprava .cat-person.dim{color:var(--muted)}
.sksprava .editor-row .del{width:38px;height:38px;border:1px solid var(--line);border-radius:8px;flex:none;
  background:transparent;color:var(--muted);padding:0;display:grid;place-items:center;cursor:pointer}
.sksprava .editor-row .del:hover{color:var(--brand);border-color:var(--brand)}
.sksprava .add-row{display:flex;gap:8px}
.sksprava .add-row input{flex:1;min-width:0}
.sksprava .add-row button,.sksprava .btn-primary,.sksprava .btn-ghost{height:40px;padding:0 14px;border-radius:8px;
  font:inherit;font-size:14px;font-weight:500;cursor:pointer;white-space:nowrap}
.sksprava .btn-primary{border:1px solid var(--brand);background:var(--brand);color:#fff}
.sksprava .btn-primary:hover{background:var(--brand-dk);border-color:var(--brand-dk)}
.sksprava .btn-ghost{border:1px solid var(--line);background:transparent;color:var(--ink)}
.sksprava .btn-ghost:hover{border-color:var(--faint)}
.sksprava .set-block{padding:16px;margin-bottom:12px;background:var(--recess);border:1px solid var(--line);border-radius:12px}
.sksprava .set-h{margin:0 0 10px;font:600 14px var(--h)}
.sksprava .dni-h{margin:14px 0 8px;font-size:13px}
.sksprava .set-note{display:block;font-size:12px;color:var(--muted);margin-top:8px;font-weight:400}
.sksprava .switch-row{display:flex;align-items:center;justify-content:flex-start;flex-direction:row-reverse;gap:12px;cursor:pointer}
.sksprava .switch-row>span{flex:1}
.sksprava .switch-row .set-h{margin:0}
.sksprava .switch{appearance:none;-webkit-appearance:none;width:44px;height:26px;border-radius:999px;
  background:var(--line);position:relative;cursor:pointer;transition:background .15s;flex:none}
.sksprava .switch::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;
  background:#fff;transition:left .15s}
.sksprava .switch:checked{background:var(--brand)}
.sksprava .switch:checked::after{left:21px}
.sksprava .vis-grid{display:flex;flex-wrap:wrap;gap:10px 18px}
.sksprava .vis-grid label{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--ink-2);cursor:pointer;white-space:nowrap}
.sksprava .form-row{display:grid;gap:12px;margin-top:10px}
.sksprava .form-row.cols-2{grid-template-columns:repeat(2,1fr)}
.sksprava label.field{display:flex;flex-direction:column;gap:6px}
.sksprava label.field>span{font-size:12px;color:var(--ink-2)}
.sksprava .akcie{justify-content:flex-end;margin-top:12px}
@media(max-width:700px){.sksprava .form-row.cols-2{grid-template-columns:1fr}
  .sksprava .editor-row .cat-person{width:140px}}

/* voľby Úhrady a Odovzdania — riadok na možnosť */
.volby{display:flex;flex-direction:column;gap:6px}
.volby-z{display:flex;flex-direction:column;gap:6px}
.volba-r{display:flex;align-items:center;gap:6px}
/* úchyt na presúvanie možností — ťahá sa len zaň, inak by sa v poli
   nedal označiť text */
.volba-uchyt{flex:none;width:22px;color:var(--faint);cursor:grab;
  display:grid;place-items:center}
.volba-uchyt:active{cursor:grabbing}
.volba-r:hover .volba-uchyt{color:var(--muted)}
.volba-r.tiahne{opacity:.6;transform:scale(1.015);
  box-shadow:0 8px 22px rgba(0,0,0,.22);position:relative;z-index:3}
.volba-r input{flex:1;min-width:0}
.volba-x{width:34px;height:34px;flex:none;color:var(--faint)}
.volba-x:hover{color:var(--brand)}
.volba-pridaj{display:inline-flex;align-items:center;gap:6px;align-self:flex-start;
  border:1px dashed var(--line);background:transparent;color:var(--ink-2);
  padding:7px 12px;border-radius:8px;font:600 13px var(--b);cursor:pointer}
.volba-pridaj:hover{border-color:var(--brand);color:var(--brand);border-style:solid}

/* RFID čipy v nastaveniach */
.rfid-scan{margin-bottom:14px}
.rfid-zoznam{display:flex;flex-direction:column;gap:8px}
.rfid-r{display:grid;grid-template-columns:minmax(120px,1.1fr) minmax(150px,1.4fr) 120px 38px;
  gap:8px;align-items:center}
.rfid-h{font:700 10.5px var(--b);text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
.rfid-uid{font:600 13px ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--ink);
  background:var(--recess);border:1px solid var(--line);border-radius:8px;padding:9px 10px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rfid-del{color:var(--faint)}
.rfid-del:hover{color:var(--brand)}
/* vysvetlivka pod zoznamom si nesmie sadnúť na posledný riadok */
.rfid-zoznam+.hint{margin-top:10px}
@media(max-width:700px){.rfid-r{grid-template-columns:1fr 1fr;grid-auto-rows:auto}
  .rfid-h{display:none}}

/* bočný panel: mriežka rolí a widgetov */
/* Riadok = čo povoľujeme, vedľa neho multivýber rolí. */
.panel-mriezka { display: grid; grid-template-columns: minmax(130px, 200px) minmax(200px, 320px);
  justify-content: start; align-items: center; gap: 6px 12px; margin-top: 6px }
.panel-mriezka .panel-nazov { font: 500 13px var(--b); color: var(--ink-2) }
.panel-mriezka .panel-hlavny { font-weight: 700; color: var(--ink) }
@media (max-width: 560px) {
  .panel-mriezka { grid-template-columns: 1fr; gap: 2px 0 }
  .panel-mriezka .panel-nazov { margin-top: 8px }
}

/* vynútená zmena hesla */
.hesla-vyber { display: flex; align-items: flex-end; gap: 12px; flex-wrap: wrap }
.hesla-vyber .field { min-width: 240px; flex: 0 1 320px }
.hesla-vyber .set-test { margin: 0 }
.hesla-stav { display: flex; flex-direction: column; gap: 2px; margin-top: 12px }
.hesla-r { display: flex; align-items: center; gap: 10px; padding: 7px 0;
  border-top: 1px solid var(--line-2) }
.hesla-t { display: flex; flex-direction: column; gap: 1px; flex: 1; min-width: 0 }
.hesla-t strong { font: 600 13px var(--b) }
.hesla-t small { color: var(--muted); font-size: 11.5px }

/* prístup k sekcii nastavení po ľuďoch — riadok hore v sekcii (len developer) */
.nast-pristup { display: flex; align-items: center; gap: 10px; margin: 2px 0 10px;
  padding: 8px 11px; border: 1px dashed var(--line); border-radius: 9px }
.nast-pristup-t { display: inline-flex; align-items: center; gap: 6px; flex: none;
  color: var(--muted); font: 600 12px var(--b) }
.nast-pristup .sel { min-width: 200px; max-width: 340px }

/* záložky v sekcii nastavení (kuriéri: DPD / Packeta) */
.set-taby { margin: 4px 0 12px; border-radius: 10px; overflow: hidden }

/* hľadanie v nastaveniach — nad zoznamom skupín, filtruje skupiny aj polia */
.set-hladanie { display: flex; align-items: center; gap: 8px; margin: 0 0 12px;
  padding: 0 12px; border: 1px solid var(--line); border-radius: 10px;
  background: var(--surface); color: var(--muted) }
.set-hladanie .ico { flex: none }
.set-hladanie input { flex: 1; border: none; background: transparent; padding: 10px 0;
  color: var(--ink); font: inherit }
.set-hladanie input:focus { outline: none }
/* nájdené pole sa jemne zvýrazní a jeho záložka sa odkryje, aj keď nie je
   zapnutá — `.hidden` má !important, takže odkrytie ho musí prebiť */
.field.najdene > span:first-child, .chk.najdene { color: var(--brand) }
.set-tab-str.odkryte { display: block !important }

/* Nastavenia kalendára: kým sa načítavajú kalendáre, zoznam typov je
   rozmazaný a navrchu je krúžok s textom; pruh nad ním hlási, keď sa
   načítať nepodarilo. */
.cal-typy { position: relative }
.cal-typy.nacitava > .cal-row { filter: blur(2px); opacity: .5; pointer-events: none }
.cal-clona { position: absolute; inset: 0; z-index: 2; display: flex; align-items: center;
  justify-content: center; gap: 10px; font-size: 13px; font-weight: 600; color: var(--ink) }
.cal-spin { width: 18px; height: 18px; border-radius: 50%; flex: none;
  border: 2px solid var(--line); border-top-color: var(--brand); animation: cal-toci .8s linear infinite }
@keyframes cal-toci { to { transform: rotate(360deg) } }
@media (prefers-reduced-motion: reduce) { .cal-spin { animation-duration: 2.4s } }
.cal-stav { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 2px 0 10px;
  padding: 9px 12px; border-radius: 10px; background: var(--recess); color: var(--ink-2);
  font-size: 12.5px }
.cal-stav > span { flex: 1; min-width: 180px }
