/* ANIS — spoločný vzhľad obchodu. Vychádza z farieb webu. */

:root {
  --bg:           #ECF5E5;
  --header-bg:    #E4F0DB;
  --surface:      #FFFFFF;
  --surface-2:    #F4F9F1;
  --border:       #CADABE;
  --text:         #162A1C;
  --text-muted:   #4E6E57;
  --accent:       #3A8A50;
  --accent-hover: #2E7040;
  --accent-light: #DBEDCF;
  --chyba:        #A3251F;
  --chyba-bg:     #FBECEB;
  --header-h:     64px;
}

* { margin: 0; padding: 0; box-sizing: border-box; }

body {
  font-family: 'IBM Plex Sans', system-ui, -apple-system, sans-serif;
  background: var(--bg);
  color: var(--text);
  line-height: 1.6;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }

/* ─── Lišta ─────────────────────────────────────────────── */

.hlavicka {
  height: var(--header-h);
  background: var(--header-bg);
  border-bottom: 1px solid var(--border);
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 0 clamp(16px, 4vw, 48px);
  position: sticky;
  top: 0;
  z-index: 50;
}

.hlavicka .logo img { height: 44px; width: auto; }

.hlavicka nav {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: clamp(8px, 1.6vw, 22px);
  font-size: 16px;
}

.hlavicka nav a { color: var(--text-muted); padding: 8px 10px; border-radius: 8px; }
.hlavicka nav a:hover, .hlavicka nav a.aktivny { color: var(--text); background: var(--accent-light); }

.hlavicka .kto {
  font-size: 14px;
  color: var(--text-muted);
  border-left: 1px solid var(--border);
  padding-left: 16px;
}
.hlavicka .kto.prihlaseny { display: flex; flex-direction: column; align-items: flex-end; line-height: 1.25; }
.hlavicka .kto-meno { font-size: 15px; font-weight: 600; color: var(--text); }
.hlavicka .kto-firma { font-size: 12.5px; color: var(--text-muted); }

/* ─── Obsah ─────────────────────────────────────────────── */

main { flex: 1; padding: clamp(28px, 5vw, 56px) clamp(16px, 4vw, 48px); }

.uzke { max-width: 440px; margin-inline: auto; }
.siroke { max-width: 1100px; margin-inline: auto; }

h1 {
  font-family: 'Barlow Semi Condensed', sans-serif;
  font-size: clamp(26px, 3.4vw, 34px);
  font-weight: 700;
  line-height: 1.15;
  margin-bottom: 8px;
}

h2 {
  font-family: 'Barlow Semi Condensed', sans-serif;
  font-size: 22px;
  font-weight: 700;
  margin-bottom: 12px;
}

p { margin-bottom: 14px; }
.tichy { color: var(--text-muted); font-size: 15px; }

/* ─── Karta ─────────────────────────────────────────────── */

.karta {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: clamp(22px, 3vw, 34px);
}

/* ─── Formulár ──────────────────────────────────────────── */

.pole { margin-bottom: 16px; }

.pole label {
  display: block;
  font-size: 13.5px;
  font-weight: 600;
  color: var(--text-muted);
  margin-bottom: 6px;
}

.pole input {
  width: 100%;
  min-width: 0;
  font: inherit;
  font-size: 15px;
  color: var(--text);
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: 9px;
  padding: 11px 13px;
  transition: border-color .15s, background .15s;
}

.pole input:focus {
  outline: none;
  border-color: var(--accent);
  background: var(--surface);
}

.tlacidlo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  font: inherit;
  font-size: 15.5px;
  font-weight: 600;
  color: #fff;
  background: var(--accent);
  border: none;
  border-radius: 10px;
  padding: 13px 20px;
  cursor: pointer;
  transition: background .15s;
}

.tlacidlo:hover { background: var(--accent-hover); }

.odkaz-spat {
  display: inline-block;
  margin-top: 18px;
  font-size: 14.5px;
  color: var(--text-muted);
}
.odkaz-spat:hover { color: var(--text); text-decoration: underline; }

/* ─── Hlásenia ──────────────────────────────────────────── */

.chyba, .oznam {
  border-radius: 10px;
  padding: 12px 16px;
  margin-bottom: 18px;
  font-size: 14.5px;
}

.chyba { background: var(--chyba-bg); border: 1px solid #E8C4C1; color: var(--chyba); }
.oznam { background: var(--accent-light); border: 1px solid var(--border); color: var(--text); }

/* ─── Päta ──────────────────────────────────────────────── */

.pata {
  background: var(--header-bg);
  border-top: 1px solid var(--border);
  padding: 22px clamp(16px, 4vw, 48px);
  text-align: center;
  font-size: 14px;
  color: var(--text-muted);
}

.pata a:hover { text-decoration: underline; }

/* ─── Mobil ─────────────────────────────────────────────── */

@media (max-width: 700px) { /* len stránky bez bočnej lišty (prihlásenie) */
  body:not(.admin) .hlavicka { gap: 10px; padding: 0 16px; }
  body:not(.admin) .hlavicka .logo img { height: 36px; }
  body:not(.admin) .hlavicka nav { font-size: 14px; gap: 4px; }
  body:not(.admin) .hlavicka .kto { display: none; }
  body:not(.admin) .hlavicka .kto.prihlaseny { display: flex; border-left: none; padding-left: 0; }
  body:not(.admin) .hlavicka .kto-meno { font-size: 13.5px; }
  body:not(.admin) .hlavicka .kto-firma { font-size: 11.5px; }
}

:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

/* ═══════ Administrácia ═══════ */

/* V administrácii je pozadie biele, zelená zostáva len na lište. */
body.admin { background: var(--surface); }
body.admin .pata { background: var(--surface); }
/* V administrácii nič zelené okrem lišt — polia aj karty sú biele,
   zelený zostáva len rámik. Inak by sa obsah zlieval s lištami. */
body.admin .karta { background: var(--surface); }

body.admin .pole input,
body.admin .pole select,
body.admin .pole textarea,
body.admin input[type="search"],
body.admin input[type="text"],
body.admin select,
body.admin textarea { background: var(--surface); }

body.admin .tabulka th { background: var(--surface); }
body.admin .tabulka tr:hover td { background: #FAFCF9; }

/* ─── Kompaktná administrácia ─────────────────────────────
   Formuláre majú byť čo najviac na jednej obrazovke, nie
   roztiahnuté cez dve. */

body.admin main { padding: 24px clamp(16px, 2.4vw, 32px); }

body.admin h1 { font-size: clamp(22px, 2.4vw, 27px); margin-bottom: 4px; }
body.admin h2 { font-size: 17px; margin-bottom: 12px; }
body.admin p  { margin-bottom: 10px; }

body.admin .karta { padding: 18px 20px; border-radius: 11px; }

body.admin .pole { margin-bottom: 11px; }

body.admin .pole label {
  font-size: 12.5px;
  margin-bottom: 4px;
  letter-spacing: .01em;
}

body.admin .pole input,
body.admin .pole select,
body.admin .pole textarea,
body.admin input[type="search"],
body.admin select {
  padding: 8px 11px;
  font-size: 14.5px;
  border-radius: 8px;
}

/* Textové pole na poznámku — rovnaký vzhľad ako ostatné polia. */
body.admin .pole textarea {
  width: 100%;
  font: inherit;
  font-size: 14.5px;
  color: var(--text);
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 8px;
  resize: vertical;
}

body.admin .pole textarea:focus { outline: none; border-color: var(--accent); }

body.admin .mriezka {
  grid-template-columns: repeat(auto-fit, minmax(165px, 1fr));
  gap: 0 14px;
}

body.admin .nastroje { margin-bottom: 14px; gap: 8px; }

/* Karty formulára vedľa seba, kým je na to miesto. */
.karty {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(470px, 100%), 1fr));
  gap: 16px;
  align-items: start;
  max-width: 1500px;
}

.karty .karta.siroka { grid-column: 1 / -1; }
/* Jediná karta zaberie len jeden stĺpec (napr. Môj účet, Firma) */
.karty.jedna { grid-template-columns: repeat(auto-fill, minmax(min(470px, 100%), 1fr)); }
body.admin .tlacidlo.maly { padding: 8px 13px; font-size: 13.5px; }

/* ─── Rozloženie administrácie ───────────────────────────── */

body.admin .hlavicka { gap: 16px; }

.admin-telo {
  flex: 1;
  display: flex;
  align-items: stretch;
  min-height: 0;
}

/* Ľavé menu */
.bocne {
  flex: 0 0 260px;
  width: 260px;
  background: #F2F3F2;            /* svetlo šedá — nebije sa so zelenou horná lištou */
  border-right: 1px solid #DCDFDC;
  padding: 20px 12px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  /* Lišta stojí na mieste, obsah vpravo sa posúva (pod hornou lištou) */
  position: sticky;
  top: var(--header-h);
  align-self: flex-start;
  height: calc(100vh - var(--header-h));
  overflow-y: auto;
}

.bocne a, .bocne .caka {
  display: block;
  padding: 11px 14px;
  border-radius: 9px;
  font-size: 15.5px;
  color: var(--text-muted);
  transition: background .15s, color .15s;
}

.bocne a:hover { background: var(--accent-light); color: var(--text); }

.bocne a.aktivny {
  background: var(--accent);
  color: #fff;
  font-weight: 600;
}

.bocne .caka { color: #9CB3A3; cursor: default; }

/* Obrys aj pri neaktívnych tlačidlách — menu pôsobí ako sada tlačidiel */
.bocne { gap: 7px; }
.bocne a, .bocne .caka { border: 1px solid var(--border); background: var(--surface); }
.bocne a.aktivny { border-color: var(--accent); }
.bocne a:hover { border-color: #B5CBA8; }
.bocne .caka { border-color: #DDE7D6; }

/* Samostatné tlačidlá rovnako široké ako tie v rámiku skupiny
   (rámik má 1 px okraj + 8 px vnútorný odstup) */
.bocne > a, .bocne > .caka { margin: 0 9px; }

/* Skupina (napr. Tovar): nadpis a pod ním rámik s tlačidlami */
.bocne .skupina { margin-top: 14px; }
.bocne .skupina-nazov {
  font-size: 12px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase;
  color: var(--text-muted); padding: 0 6px 7px;
}
.bocne .skupina-obsah {
  display: flex; flex-direction: column; gap: 7px;
  border: 1px solid #D6DAD6; border-radius: 12px; padding: 8px;
}

body.admin main { flex: 1; min-width: 0; }
/* V administrácii je obsah vždy zarovnaný vľavo (ako Zákazníci, Skladové karty) */
body.admin .siroke { margin-inline: 0; }

/* Meno vpravo hore a ponuka pod ním */
.ucet {
  margin-left: auto;
  position: relative;
}

.ucet summary {
  list-style: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 7px 12px;
  border-radius: 10px;
  color: var(--text-muted);
  transition: background .15s;
}

.ucet summary::-webkit-details-marker { display: none; }
.ucet summary:hover { background: var(--accent-light); }
.ucet[open] summary { background: var(--accent-light); }

.ucet-text { display: flex; flex-direction: column; line-height: 1.25; text-align: right; }
.ucet-meno { font-size: 15px; font-weight: 600; color: var(--text); }
.ucet-rola { font-size: 12px; color: var(--text-muted); }

.ucet-ponuka {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  min-width: 190px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  box-shadow: 0 12px 30px rgba(22, 42, 28, .16);
  padding: 6px;
  z-index: 60;
}

.ucet-ponuka a,
.ucet-ponuka button {
  display: block;
  width: 100%;
  text-align: left;
  font: inherit;
  font-size: 15px;
  color: var(--text);
  background: none;
  border: none;
  border-radius: 8px;
  padding: 10px 12px;
  cursor: pointer;
}

.ucet-ponuka a:hover, .ucet-ponuka button:hover { background: var(--surface-2); }
.ucet-ponuka form { margin: 0; border-top: 1px solid var(--border); margin-top: 4px; padding-top: 4px; }
.ucet-ponuka button { color: var(--chyba); }
/* Položka, ktorá ešte nefunguje (napr. Firma, Nastavenia) */
.ucet-ponuka .caka { display: block; padding: 10px 12px; font-size: 15px; color: #A3ACA5; cursor: default; }

/* Zákazník: firma a označenie hlavného kontaktu */
.ucet-hlavny { color: var(--accent); font-weight: 500; font-size: 12.5px; }
.ucet-info { padding: 8px 12px 10px; font-size: 13.5px; font-weight: 600; color: var(--text); line-height: 1.35; }
.ucet-info span { display: block; font-weight: 500; font-size: 12.5px; color: var(--accent); margin-top: 2px; }
.ucet-info + form { margin-top: 0; }
.ucet-info + a { border-top: 1px solid var(--border); border-radius: 0; margin-top: 2px; padding-top: 12px; }

/* Užšie okná: menu sa preklopí nad obsah */
@media (max-width: 0px) { /* vypnuté: obchod má pevné rozmery, pri úzkom okne sa posúva (pôvodne (max-width: 820px)) */
  .admin-telo { flex-direction: column; }
  .bocne { position: static; height: auto; overflow: visible; align-self: auto; }

  .bocne {
    flex: none;
    width: 100%;
    flex-direction: row;
    overflow-x: auto;
    border-right: none;
    border-bottom: 1px solid var(--border);
    padding: 10px 12px;
  }

  .bocne a, .bocne .caka { white-space: nowrap; padding: 9px 12px; font-size: 15px; }
  .bocne { align-items: center; }
  .bocne > a, .bocne > .caka { margin: 0; }
  .bocne .skupina { margin-top: 0; display: flex; align-items: center; gap: 6px; }
  .bocne .skupina-nazov { padding: 0 2px 0 8px; }
  .bocne .skupina-obsah { flex-direction: row; padding: 4px; }
  .ucet-rola { display: none; }
  .ucet-rola.zakaznik { display: block; font-size: 11.5px; }
}

.nastroje {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-bottom: 18px;
}
.nastroje form { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.nastroje .vpravo { margin-left: auto; }

.tlacidlo.maly { width: auto; padding: 9px 14px; font-size: 14px; }
.tlacidlo.druhy { background: var(--surface); color: var(--text); border: 1px solid var(--border); }
.tlacidlo.druhy:hover { background: var(--surface-2); }
.tlacidlo.cerveny { background: #A3251F; }
.tlacidlo.cerveny:hover { background: #87201A; }

input[type="search"], input[type="text"].maly, select {
  font: inherit;
  font-size: 15px;
  color: var(--text);
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: 9px;
  padding: 10px 12px;
}
input[type="search"]:focus, select:focus { outline: none; border-color: var(--accent); background: var(--surface); }

.tabulka {
  width: 100%;
  border-collapse: collapse;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: hidden;
  font-size: 14.5px;
}
.tabulka th, .tabulka td { padding: 11px 14px; text-align: left; border-bottom: 1px solid var(--border); }
.tabulka th { background: var(--surface-2); font-size: 13px; text-transform: uppercase; letter-spacing: .04em; color: var(--text-muted); }
.tabulka tr:last-child td { border-bottom: none; }
.tabulka tr:hover td { background: var(--surface-2); }
.tabulka .cislo { text-align: right; white-space: nowrap; }
.tabulka a { color: var(--accent); font-weight: 600; }
.tabulka a:hover { text-decoration: underline; }

.napoveda { font-size: 12px; color: var(--text-muted); margin-top: 5px; line-height: 1.4; }

/* Informačný panel (len na čítanie) */
.udaje { display: grid; grid-template-columns: minmax(120px, 34%) 1fr; gap: 9px 16px; margin: 0; font-size: 14px; }
.udaje dt { color: var(--text-muted); font-size: 13px; padding-top: 1px; }
.udaje dd { margin: 0; color: var(--text); font-weight: 500; overflow-wrap: anywhere; }
.udaje .prazdny { color: var(--text-muted); font-weight: 400; }
.udaje dd.udaj-hlavny { font-size: 17px; font-weight: 600; }
/* Nadpis skupiny údajov s čiarou pod ním (napr. Adresa, Informácie) */
.udaje-sekcia {
  margin: 22px 0 12px; padding-bottom: 6px; border-bottom: 1px solid var(--border);
  font-size: 13px; font-weight: 600; color: var(--text-muted);
}
/* Formulár (Firma, Môj účet): mriežka 6 stĺpcov, s1–s6 = šírka poľa */
.formular-6 { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 0 16px; align-items: start; }
.formular-6 .s1 { grid-column: span 1; } .formular-6 .s2 { grid-column: span 2; }
.formular-6 .s3 { grid-column: span 3; } .formular-6 .s4 { grid-column: span 4; }
.formular-6 .s6 { grid-column: 1 / -1; }
.formular-6 textarea { width: 100%; }
.napoveda-dph { align-self: center; margin: 10px 0 0; }
/* Skladová karta: pod „Stanovenie cien" sivý nápis Ceny bez DPH / Ceny s DPH (podľa Firmy) */
/* Doplnok pod názvom stĺpca (napr. „bez DPH" pri cenách) — menší a menej výrazný */
.tabulka th .th-pod { font-size: 10px; font-weight: 500; text-transform: none; letter-spacing: 0; color: #8A9A8F; line-height: 1.1; margin-top: 1px; }
.tabulka th:has(.th-pod) { line-height: 1.25; }
.ceny-dph-poznamka { text-align: left; color: #8A9A8F; font-size: 13px; margin: -10px 0 8px; }
.pole select:disabled { color: #A3ACA5; background: var(--surface-2); cursor: not-allowed; }
/* Rozmery stránok Firma a Môj účet (podľa náčrtu): náhľad širší, údaje v ľavej časti; formulár stredne široký */
.udaje-karta { max-width: 950px; }
.udaje-karta .udaje { grid-template-columns: 165px minmax(0, 1fr); max-width: 460px; }
/* Rámik má na všetkých týchto stránkach (zobrazenie aj úprava) rovnakú šírku — mení sa len obsah */
.uprava-karta { max-width: 950px; }
.uprava-karta .formular-6 { max-width: 680px; }
.potvrdenie-karta { max-width: 950px; margin-top: 16px; }
.potvrdenie-karta > * { max-width: 520px; }
/* Nadpis stránky vľavo, tlačidlo (napr. Upraviť údaje) vpravo nad rámikom — rovnako široké ako rámik */
.hlavicka-stranky { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; max-width: 950px; margin-bottom: 14px; }
.hlavicka-stranky h1 { margin-bottom: 2px; }
.hlavicka-stranky p { margin: 0; }
/* Štítok platca / neplatca DPH na stránke Firma */
.stitok-dph { margin-left: 10px; }
.stitok.oranzovy { background: #FCE6DC; color: #B8461B; border: 1px solid #F2B9A0; }

/* Na úzkej obrazovke sa tabuľka posúva do strany, stránka nie */
.tabulka-obal { overflow-x: auto; border-radius: 12px; }
.tabulka-obal .tabulka td { white-space: nowrap; }

/* Dlhé zoznamy (Zákazníci, Skladové karty): nadpis, tlačidlá, filtre a názvy stĺpcov
   ostanú hore, posúva sa len zoznam riadkov. Stránka (main) má výšku obrazovky,
   tabuľka vyplní zvyšok a posúva sa vo vnútri. */
@media all { /* platí pri každej šírke okna */
  body.admin .main-obsah:has(> .pevna-hlavicka) {
    display: flex; flex-direction: column;
    height: calc(100vh - var(--header-h)); overflow: hidden;
  }
  body.admin .main-obsah:has(> .pevna-hlavicka) > * { flex: none; }
  /* scrollbar-gutter: miesto na posuvník je vyhradené vždy — šírka tabuľky sa nemení,
     či sa posuvník zobrazí (veľa riadkov) alebo nie (filter, málo riadkov) */
  body.admin .main-obsah > .tabulka-obal.pevna-hlavicka { flex: 1 1 auto; min-height: 0; overflow: auto; scrollbar-gutter: stable; }
  /* overflow: hidden na tabuľke by prilepenie hlavičky vypol; clip ponechá zaoblené rohy */
  .pevna-hlavicka .tabulka { overflow: clip; }
  .pevna-hlavicka thead { position: sticky; top: 0; z-index: 3; }
  .pevna-hlavicka thead td { background: var(--surface); }
  .pevna-hlavicka thead th { box-shadow: inset 0 -2px 0 #A9C49A; }
}
/* Zoznamy (Zákazníci, Skladové karty): bez rámika okolo tabuľky, len čiary medzi riadkami
   a hrubšia čiara pod názvami stĺpcov */
.pevna-hlavicka .tabulka { border: none; border-radius: 0; }
.pevna-hlavicka .tabulka thead th { border-bottom: 2px solid #A9C49A; }
/* Rovnaká výška hlavičky tabuľky na všetkých zoznamoch (čiara pod názvami stĺpcov
   je pri preklikávaní medzi stránkami vždy na tom istom mieste) */
.pevna-hlavicka .tabulka thead tr.filtre td { height: 50px; box-sizing: border-box; }
.pevna-hlavicka .tabulka thead tr:last-child th { height: 44px; box-sizing: border-box; white-space: nowrap; vertical-align: bottom; }
/* Tlačidlo triedenia vedľa názvu stĺpca */
.tabulka th .triedenie {
  display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px; margin-left: 4px;
  border: 1px solid var(--border); border-radius: 5px; background: var(--surface);
  color: var(--text-muted); font-size: 11px; font-weight: 400; text-decoration: none; vertical-align: middle;
}
.tabulka th .triedenie:hover { border-color: var(--accent); color: var(--accent); }
.tabulka th .triedenie.aktivne { background: var(--accent); border-color: var(--accent); color: #fff; }
/* Skladové karty: pevná šírka stĺpcov Obrázok a Číslo karty (nemení sa podľa monitora) */
.zoznam-produktov { table-layout: fixed; width: 1570px; }   /* súčet šírok stĺpcov — pri užšom okne sa posúva do strany */
.zoznam-produktov col.st-nazov { width: 620px; }
.zoznam-produktov col.st-obrazok { width: 60px; }
.zoznam-produktov col.st-kod { width: 128px; }
.zoznam-produktov col.st-kategoria { width: 150px; }
.zoznam-produktov col.st-cena { width: 92px; }
.zoznam-produktov col.st-sklad { width: 88px; }
.zoznam-produktov col.st-stav { width: 100px; }
.zoznam-produktov col.st-akcie { width: 56px; }
.zoznam-produktov td { overflow: hidden; text-overflow: ellipsis; }
.zoznam-produktov td:nth-child(3) { white-space: normal; }
.zoznam-produktov tr.riadok-variant-hlava td:nth-child(2) { white-space: nowrap; }
.zoznam-produktov thead th { white-space: nowrap; overflow: visible; }
.zoznam-produktov thead td { overflow: visible; text-overflow: clip; }
body.admin .tabulka.zoznam-produktov .filtre select,
body.admin .tabulka.zoznam-produktov .filtre input[type="search"] { width: 100%; min-width: 0; }
body.admin .tabulka.zoznam-produktov .filtre select { padding-left: 6px; padding-right: 2px; }
.zoznam-produktov th.st-obrazok { width: 52px; min-width: 52px; max-width: 52px; }
.zoznam-produktov th.st-kod { width: 128px; min-width: 128px; max-width: 128px; white-space: nowrap; }
.zoznam-produktov th.st-kategoria { width: 150px; min-width: 150px; max-width: 150px; }
.zoznam-produktov th.st-cena { width: 92px; min-width: 92px; max-width: 92px; }
.zoznam-produktov th.st-sklad { width: 78px; min-width: 78px; max-width: 78px; }
.zoznam-produktov th.st-stav { width: 96px; min-width: 96px; max-width: 96px; }
.zoznam-produktov th.st-akcie { width: 48px; min-width: 48px; max-width: 48px; }
.zoznam-produktov td.zalom { white-space: normal; }

/* Tlačidlo ⋯ a ponuka Upraviť / Kopírovať / Vymazať */
.tlacidlo-akcie {
  width: 32px; height: 30px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface);
  color: var(--text); font-size: 18px; line-height: 1; cursor: pointer; padding: 0 0 4px;
}
.tlacidlo-akcie:hover, .tlacidlo-akcie.otvorene { border-color: var(--accent); background: var(--surface-2); }
.akcie-ponuka {
  position: fixed; z-index: 60; min-width: 150px; background: var(--surface);
  border: 1px solid var(--border); border-radius: 10px; box-shadow: 0 8px 24px rgba(22, 42, 28, .12); padding: 5px;
}
.akcie-ponuka a, .akcie-ponuka button {
  display: block; width: 100%; text-align: left; font: inherit; font-size: 14px; color: var(--text);
  background: none; border: none; border-radius: 7px; padding: 8px 11px; cursor: pointer; text-decoration: none;
}
.akcie-ponuka a:hover, .akcie-ponuka button:hover { background: var(--surface-2); }
.akcie-ponuka button[data-akcia="vymazat"] { color: var(--chyba); border-top: 1px solid var(--border); border-radius: 0 0 7px 7px; margin-top: 3px; }

/* Okno (napr. potvrdenie vymazania) */
dialog.okno { margin: auto; border: 1px solid var(--border); border-radius: 14px; padding: 22px 24px; width: min(440px, calc(100vw - 32px)); box-shadow: 0 16px 48px rgba(22, 42, 28, .2); }
dialog.okno::backdrop { background: rgba(22, 42, 28, .35); }
dialog.okno h2 { margin: 0 0 10px; }
dialog.okno p { margin: 0 0 10px; }
.okno-tlacidla { display: flex; gap: 10px; margin-top: 14px; }
.tlacidlo.cervene { background: var(--chyba); border-color: var(--chyba); color: #fff; }
.tlacidlo.cervene:hover { background: #87201B; }

/* Hustejšia tabuľka — viac stĺpcov na obrazovku (zoznamy v administrácii) */
.tabulka.husta { font-size: 13px; }
.tabulka.husta th, .tabulka.husta td { padding: 7px 10px; vertical-align: middle; }
.tabulka.husta th { font-size: 11.5px; }
.tabulka.husta .pod { font-size: 12px; color: var(--text-muted); margin-top: 1px; }
/* Riadok filtrov nad hlavičkou tabuľky */
.tabulka .filtre td { padding: 8px 6px; border-bottom: none; background: var(--surface); vertical-align: middle; }
.tabulka .filtre td:first-child { padding-left: 10px; }
.tabulka .filtre input[type="search"],
.tabulka .filtre select { width: 100%; min-width: 90px; padding: 6px 9px; font-size: 12.5px; border-radius: 7px; }
body.admin .tabulka .filtre input[type="search"],
body.admin .tabulka .filtre select { padding: 6px 9px; font-size: 12.5px; }
.tabulka .filtre .tlacidlo.maly { white-space: nowrap; }
body.admin .tabulka tr.filtre:hover td { background: var(--surface); }

/* Zoznam firiem: údajové stĺpce zarovnané hore pod čiaru */
.tabulka.zoznam-firiem td:nth-child(-n+4) { vertical-align: top; }
.tabulka.husta .clovek { font-size: 12px; color: var(--text-muted); margin-top: 1px; }
.tabulka.husta .clovek.prvy { font-size: 13px; color: var(--text); margin-top: 0; }
.tabulka.husta .clovek.prvy .meno { font-weight: 600; }
.tabulka.husta .akcia-odstranit { font-size: 12.5px; color: var(--chyba); font-weight: 500; }
.tabulka.husta .stitok { font-size: 11px; padding: 2px 8px; }
body.admin .tabulka.husta .tlacidlo.maly { padding: 5px 10px; font-size: 12.5px; }

.stitok {
  display: inline-block;
  font-size: 12px;
  font-weight: 600;
  padding: 3px 9px;
  border-radius: 20px;
  background: var(--accent-light);
  color: var(--text);
}
.stitok.sedy { background: var(--surface-2); color: var(--text-muted); border: 1px solid var(--border); }
.stitok.cerveny { background: var(--chyba-bg); color: var(--chyba); }

.mriezka { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 0 20px; }

.strankovanie { display: flex; gap: 6px; align-items: center; margin-top: 18px; font-size: 14px; }
.strankovanie a, .strankovanie span {
  padding: 7px 12px; border-radius: 8px; border: 1px solid var(--border); background: var(--surface);
}
.strankovanie .teraz { background: var(--accent); color: #fff; border-color: var(--accent); }

.obrazky { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 10px; }
.obrazok {
  width: 130px; border: 1px solid var(--border); border-radius: 10px;
  overflow: hidden; background: var(--surface-2);
}
.obrazok img { width: 100%; height: 130px; object-fit: cover; }
.obrazok .pod { padding: 7px; display: flex; gap: 6px; align-items: center; justify-content: space-between; font-size: 12px; }
.obrazok button { font: inherit; font-size: 12px; background: none; border: none; color: var(--chyba); cursor: pointer; padding: 2px 4px; }
.obrazok button:hover { text-decoration: underline; }

.prazdne { text-align: center; color: var(--text-muted); padding: 40px 20px; }

/* ═══════ Skladové karty ═══════ */
.nahlad-maly { width: 40px; height: 40px; object-fit: cover; border-radius: 6px; border: 1px solid var(--border); display: block; background: var(--surface-2); }
.nahlad-maly.prazdny { display: block; }
.zoznam-produktov td { vertical-align: middle; }

.obrazok { width: 150px; }
.obrazok img { height: 150px; object-fit: contain; background: #fff; }
.obrazok.hlavny { border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent); }
.obrazok .pod { flex-wrap: wrap; }
.obrazok .pod form { margin: 0; }
.obrazok button.nastavit { color: var(--accent); }

.nahravanie { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--border); }
.nahravanie input[type="file"] { font-size: 13px; }
.nahravanie .napoveda { margin-top: 0; flex-basis: 100%; }

.odkaz-tlacidlo { background: none; border: none; font: inherit; cursor: pointer; padding: 0; }
.odkaz-tlacidlo:hover { text-decoration: underline; }
.akcia-odstranit { color: var(--chyba); font-size: 12.5px; font-weight: 500; }

.ceny-tabulka { border: none; }
.ceny-tabulka th, .ceny-tabulka td { padding: 6px 8px; }
.ceny-tabulka td:first-child { color: var(--text-muted); }

/* ─── Skladová karta — rozloženie podľa návrhu ─── */
.karta-rozlozenie { display: grid; grid-template-columns: minmax(0, 2.2fr) minmax(260px, 1fr); gap: 16px; align-items: start; }
.karta-rozlozenie .karta.siroka { grid-column: 1 / -1; }

.formular-karta { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 14px; align-items: start; }
.formular-karta .s2 { grid-column: span 2; }
.formular-karta .s3 { grid-column: span 3; }
.formular-karta .s4 { grid-column: 1 / -1; }
.formular-karta .pole input, .formular-karta .pole select,
.karta-rozlozenie .pole select { width: 100%; }

.pole-hlavicka { display: flex; align-items: center; gap: 18px; margin-bottom: 4px; }
.pole-hlavicka label:first-child { margin-bottom: 0; }
label.zaskrtnutie { display: inline-flex; align-items: center; gap: 7px; font-size: 13.5px; font-weight: 500; color: var(--text-muted); cursor: pointer; margin: 0; }
body.admin .pole label.zaskrtnutie { font-size: 13.5px; margin: 0; }
label.zaskrtnutie input { width: 16px; height: 16px; accent-color: var(--accent); }
.zaskrtnutie-pole { align-self: end; padding-bottom: 11px; min-height: 64px; display: flex; align-items: flex-end; }

.za-jednotku { font-size: 12.5px; font-style: italic; color: var(--accent); min-height: 17px; margin-top: 3px; }
.napoveda-balenie { align-self: center; }

.oddelovac { display: flex; align-items: center; gap: 12px; margin: 10px 0 14px; color: var(--text-muted); font-size: 12.5px; font-weight: 600; letter-spacing: .03em; }
.oddelovac::before, .oddelovac::after { content: ""; flex: 1; border-top: 1px solid var(--border); }
.oddelovac:empty::before { flex: 1; }
.oddelovac:empty::after { display: none; }

.nadpis-pola { display: block; font-size: 12.5px; font-weight: 600; color: var(--text-muted); margin: 8px 0 6px; }
.strom-obal { border: 1px solid var(--border); border-radius: 9px; padding: 10px 12px; min-height: 220px; max-height: 480px; overflow: auto; }
.prazdny-strom { color: var(--text-muted); font-size: 13.5px; display: flex; align-items: center; justify-content: center; text-align: center; }
.strom { list-style: none; margin: 0; padding: 0; font-size: 14px; }
.strom .strom { padding-left: 20px; border-left: 1px dashed var(--border); margin-left: 7px; }
.strom li { margin: 3px 0; }
.strom label { display: inline-flex; align-items: center; gap: 7px; cursor: pointer; }
.strom input { accent-color: var(--accent); }

@media (max-width: 0px) { /* vypnuté: obchod má pevné rozmery, pri úzkom okne sa posúva (pôvodne (max-width: 1100px)) */
  .karta-rozlozenie { grid-template-columns: 1fr; }
}
@media (max-width: 0px) { /* vypnuté: obchod má pevné rozmery, pri úzkom okne sa posúva (pôvodne (max-width: 700px)) */
  .formular-karta { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .formular-karta .s3, .formular-karta .s2 { grid-column: 1 / -1; }
}
.formular-karta .pole input[type="checkbox"] { width: 16px; flex: none; }
label.zaskrtnutie { white-space: nowrap; display: inline-flex !important; }
.pod-cenou { display: flex; flex-direction: column; gap: 1px; margin-top: 3px; min-height: 17px; font-size: 12.5px; color: var(--text-muted); }
.pod-cenou .za-jednotku { font-style: italic; color: var(--accent); margin: 0; min-height: 0; }
.pod-cenou b { font-weight: 600; color: var(--text); }
/* Údaje pod cenou: popis vpravo zarovnaný, hodnota vedľa */
.pod-cenou { display: grid; grid-template-columns: auto 1fr; column-gap: 6px; row-gap: 1px; align-items: baseline; }
.pod-cenou > span { text-align: right; white-space: nowrap; }
.pod-cenou > b { font-weight: 600; color: var(--text); white-space: nowrap; }
.pod-cenou > b.za-jednotku { color: var(--accent); font-style: normal; }
.ceny-tabulka .min-cena-riadok td { color: var(--text-muted); font-style: italic; }
.pod-cenou { grid-template-columns: minmax(0, 1fr) auto; font-size: 12px; }
.pod-cenou > span { white-space: normal; line-height: 1.25; }
/* Pole so znakom vpravo (€, %) — je jasné, či ide o sumu alebo percentá */
.so-znakom { position: relative; }
.so-znakom input { padding-right: 30px !important; }
.so-znakom::after {
  content: attr(data-znak); position: absolute; right: 12px; top: 50%; transform: translateY(-50%);
  color: var(--text-muted); font-size: 14px; font-weight: 500; pointer-events: none;
}

/* ─── SEO na skladovej karte ─── */
.adresa-pole { display: flex; align-items: stretch; }
.adresa-pole span { display: flex; align-items: center; padding: 0 10px; background: var(--surface-2); border: 1px solid var(--border); border-right: none; border-radius: 8px 0 0 8px; color: var(--text-muted); font-size: 13.5px; white-space: nowrap; }
.adresa-pole input { border-radius: 0 8px 8px 0 !important; flex: 1; min-width: 0; }
.pocitadlo { font-weight: 400; color: var(--text-muted); }
.pocitadlo.vela { color: var(--chyba); }
.google-nahlad { border: 1px dashed var(--border); border-radius: 10px; padding: 12px 14px; margin-top: 6px; font-family: Arial, sans-serif; max-width: 640px; }
.google-nahlad .g-adresa { font-size: 12.5px; color: #4d5156; }
.google-nahlad .g-titulok { font-size: 19px; color: #1a0dab; margin: 2px 0; line-height: 1.3; }
.google-nahlad .g-popis { font-size: 13.5px; color: #4d5156; line-height: 1.5; }

/* ═══════ Stránka produktu (zákazník) ═══════ */
.produkt-stranka { max-width: 1200px; }
.omrvinky { font-size: 13px; color: var(--text-muted); margin-bottom: 14px; }
.omrvinky a { color: var(--accent); }
.produkt-hore { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 32px; align-items: start; }
.galeria-hlavny { border: 1px solid var(--border); border-radius: 12px; background: #fff; aspect-ratio: 1 / 1; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.galeria-hlavny img { width: 100%; height: 100%; object-fit: contain; }
.bez-obrazka { color: var(--text-muted); font-size: 14px; }
.galeria-nahlady { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.galeria-nahlady button { width: 72px; height: 72px; padding: 0; border: 1px solid var(--border); border-radius: 8px; background: #fff; cursor: pointer; overflow: hidden; }
.galeria-nahlady button.vybrany { border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent); }
.galeria-nahlady img { width: 100%; height: 100%; object-fit: contain; }
.produkt-info h1 { margin-bottom: 4px; }
.produkt-kody { font-size: 13px; color: var(--text-muted); margin-bottom: 12px; }
.produkt-kratky { font-size: 15.5px; }
.cena-box { border: 1px solid var(--border); border-radius: 12px; padding: 16px 18px; margin: 16px 0; background: var(--surface-2); }
.cena-popis { font-size: 13px; color: var(--text-muted); }
.cena-hlavna { font-family: 'Barlow Semi Condensed', sans-serif; font-weight: 700; font-size: 32px; color: var(--text); line-height: 1.2; }
.cena-hlavna span { font-family: 'IBM Plex Sans', sans-serif; font-size: 14px; font-weight: 400; color: var(--text-muted); }
.cena-hlavna.dopyt { font-size: 26px; color: var(--accent); }
.cena-dalsie { font-size: 13.5px; color: var(--text-muted); margin-top: 2px; }
.cena-zlava { font-size: 13.5px; color: var(--accent); margin-top: 4px; }
.produkt-fakty { list-style: none; padding: 0; margin: 0 0 16px; display: flex; flex-direction: column; gap: 6px; font-size: 14.5px; }
.objednat { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.objednat .tlacidlo { width: auto; padding-inline: 26px; }
.objednat .tlacidlo:disabled { opacity: .55; cursor: not-allowed; }
.produkt-popis { margin-top: 24px; }
.dokumenty { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 8px; }
.dokumenty a { color: var(--accent); font-weight: 500; }
.dokumenty .pdf { display: inline-block; font-size: 11px; font-weight: 700; color: #fff; background: #B23A2E; border-radius: 4px; padding: 1px 5px; margin-right: 4px; }
@media (max-width: 0px) { /* vypnuté: obchod má pevné rozmery, pri úzkom okne sa posúva (pôvodne (max-width: 900px)) */
  .produkt-hore { grid-template-columns: 1fr; gap: 20px; }
}

/* ═══════ Kategórie — správa (strom s pretiahnutím) ═══════ */
.kat-strom { list-style: none; margin: 0; padding: 0; }
.kat-strom .kat-strom { margin-left: 26px; padding-left: 10px; border-left: 1px dashed var(--border); }
.kat-strom:empty { min-height: 0; }
.kat-riadok { display: flex; align-items: center; gap: 10px; padding: 7px 10px; margin: 4px 0; border: 1px solid var(--border); border-radius: 9px; background: var(--surface); font-size: 14px; cursor: grab; }
.kat-riadok.skryta .kat-nazov { color: var(--text-muted); text-decoration: line-through; }
.kat-uchyt { color: #9CB3A3; font-size: 13px; letter-spacing: -2px; cursor: grab; user-select: none; }
.kat-nazov { font-weight: 600; }
.kat-pocet { font-size: 11.5px; color: var(--text-muted); background: var(--surface-2); border: 1px solid var(--border); border-radius: 20px; padding: 0 7px; }
.kat-akcie { margin-left: auto; display: flex; gap: 12px; align-items: center; font-size: 12.5px; }
.kat-akcie a, .kat-akcie button { color: var(--accent); font-size: 12.5px; }
.kat-akcie form { margin: 0; }
.kat-akcie .akcia-odstranit { color: var(--chyba); }
.tahana > .kat-riadok { opacity: .45; }
.kat-riadok.nad { box-shadow: 0 -3px 0 var(--accent); }
.kat-riadok.pod { box-shadow: 0 3px 0 var(--accent); }
.kat-riadok.dnu { background: var(--accent-light); border-color: var(--accent); }

/* ═══════ Produkty — zákazník ═══════ */
.kat-filter { margin-top: 18px; padding-top: 14px; border-top: 1px solid #D6DAD6; font-size: 14px; }
.kat-filter-nadpis { font-size: 12px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--text-muted); padding: 0 6px 8px; }
.bocne .kat-filter a { display: flex; justify-content: space-between; gap: 6px; border: none; background: none; padding: 5px 8px; border-radius: 7px; font-size: 14px; color: var(--text); margin: 0; }
.bocne .kat-filter a:hover { background: #E4E7E4; }
.bocne .kat-filter a.vybrana { background: var(--accent); color: #fff; font-weight: 600; }
.bocne .kat-filter a span { color: var(--text-muted); font-size: 12px; }
.bocne .kat-filter a.vybrana span { color: #e3f1e8; }
.kat-filter ul { list-style: none; margin: 0; padding: 0; }
.kat-filter ul ul { margin-left: 12px; padding-left: 6px; border-left: 1px solid var(--border); }
.kat-filter li.ma-deti > a::before { content: "▸"; color: var(--text-muted); margin-right: 2px; }
.kat-filter li.ma-deti.otvorena > a::before { content: "▾"; }
.kat-filter li.ma-deti > a { justify-content: flex-start; }
.kat-filter li.ma-deti > a span { margin-left: auto; }

.zoznam-hlavicka { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; flex-wrap: wrap; margin-bottom: 16px; }
.hladat-produkty { display: flex; gap: 8px; }
.hladat-produkty input { min-width: 240px; }
.produkty-mriezka { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 16px; }
.produkt-karta { display: flex; flex-direction: column; border: 1px solid var(--border); border-radius: 12px; overflow: hidden; background: var(--surface); color: var(--text); transition: box-shadow .15s, border-color .15s; }
.produkt-karta:hover { border-color: var(--accent); box-shadow: 0 6px 18px rgba(22, 42, 28, .10); }
.pk-obrazok { aspect-ratio: 1 / 1; background: #fff; display: flex; align-items: center; justify-content: center; border-bottom: 1px solid var(--border); }
.pk-obrazok img { width: 100%; height: 100%; object-fit: contain; }
.pk-obrazok span { font-size: 12.5px; color: var(--text-muted); }
.pk-telo { padding: 12px 14px; display: flex; flex-direction: column; gap: 4px; flex: 1; }
.pk-nazov { font-weight: 600; font-size: 15px; line-height: 1.3; }
.pk-kod { font-size: 12px; color: var(--text-muted); }
.pk-spodok { margin-top: auto; padding-top: 8px; display: flex; justify-content: space-between; align-items: flex-end; gap: 8px; }
.pk-cena { font-family: 'Barlow Semi Condensed', sans-serif; font-weight: 700; font-size: 20px; line-height: 1.1; }
.pk-cena small { font-family: 'IBM Plex Sans', sans-serif; font-weight: 400; font-size: 12px; color: var(--text-muted); }
.pk-cena.dopyt { font-size: 16px; color: var(--accent); }
.pk-jednotkova { font-size: 12px; color: var(--text-muted); }
@media (max-width: 0px) { /* vypnuté: obchod má pevné rozmery, pri úzkom okne sa posúva (pôvodne (max-width: 820px)) */
  .kat-filter { display: none; }   /* na mobile je stromček v menu príliš úzky — doriešime zvlášť */
}
.kat-mobil { display: none; }
@media (max-width: 0px) { /* vypnuté: obchod má pevné rozmery, pri úzkom okne sa posúva (pôvodne (max-width: 820px)) */
  .kat-mobil { display: block; width: 100%; }
  .hladat-produkty { width: 100%; }
  .hladat-produkty input { min-width: 0; flex: 1; }
}

/* Kategórie — rozloženie pod sebou: formulár hore, strom dole */
.kat-stranka { max-width: 950px; }   /* rovnaká šírka rámikov ako Firma a Môj účet */
/* Kategórie: formulár novej hlavnej kategórie nad deliacou čiarou (výška ako filtre + názvy stĺpcov) */
.kat-nova { height: 100%; margin: 0; display: flex; flex-direction: column; justify-content: flex-end; gap: 5px; padding: 4px 0 8px; box-sizing: border-box; }
.kat-nova .pole { margin: 0; max-width: 950px; display: flex; align-items: center; gap: 12px; }
.kat-nova .pole label { margin: 0; white-space: nowrap; }
.kat-nova .pole input { height: 38px; padding-top: 6px; padding-bottom: 6px; }
.kat-nova .zaskrtnutie { margin: 0; }
.kat-nadpis { margin: 0 0 10px; }
/* Úprava priamo v strome */
.kat-inline { display: flex; gap: 8px; align-items: center; flex: 1; min-width: 0; }
.kat-inline input[type=text] { flex: 1; min-width: 0; font: inherit; font-size: 14px; padding: 5px 9px; border: 1px solid var(--accent); border-radius: 7px; }
.kat-inline .tlacidlo.maly { padding: 5px 11px; font-size: 13px; }
li.kat-novy > .kat-riadok { cursor: default; border-style: dashed; border-color: var(--accent); }
.kat-stranka > .karta { margin-top: 14px; }
.kat-stranka > .karta:first-child, .kat-stranka > .chyba:first-child, .kat-stranka > .oznam:first-child { margin-top: 0; }
.h2-dovetok { font-family: 'IBM Plex Sans', sans-serif; font-weight: 400; font-size: 14px; color: var(--text-muted); margin-left: 4px; }
.kat-formular-riadok { display: flex; gap: 14px; align-items: flex-end; }
.kat-formular-riadok .pole { flex: 1; min-width: 0; }
.kat-formular-riadok select { width: 100%; }
.kat-formular-tlacidla { display: flex; gap: 10px; padding-bottom: 11px; flex: 0 0 auto; }
.kat-info { margin: 18px 0 0; }
@media (max-width: 0px) { /* vypnuté: obchod má pevné rozmery, pri úzkom okne sa posúva (pôvodne (max-width: 700px)) */
  .kat-formular-riadok { flex-direction: column; align-items: stretch; }
}

/* ─── Varianty produktov ─────────────────────────────────────── */
[hidden] { display: none !important; }
.variant-pruh {
  background: var(--accent-light); border: 1px solid var(--border); border-radius: 8px;
  padding: 10px 14px; margin: 0 0 16px; font-size: 14px;
}
.variant-pruh a { text-decoration: underline; }
.variant-hlava { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) !important; }
.variant-karty td { vertical-align: middle; }
.variant-karty input[type=text] {
  width: 100%; font: inherit; font-size: 14px; color: var(--text); background: var(--surface-2);
  border: 1px solid var(--border); border-radius: 8px; padding: 7px 10px;
}
.variant-karty input[type=text]:focus { outline: none; border-color: var(--accent); background: var(--surface); }
.variant-karty .presun { cursor: grab; color: var(--text-muted); letter-spacing: -2px; user-select: none; }
.variant-karty tr.tahany td { opacity: .45; }
.variant-karty .odobrat { background: none; border: none; color: var(--chyba); cursor: pointer; font: inherit; font-size: 13px; }
.pridat-kartu { margin: 12px 0 4px; }
.pridat-kartu select { min-width: 360px; }
.prazdne-karty { margin: 10px 0 0; font-size: 14px; }
.zoznam-produktov tr.riadok-variant-hlava td { background: var(--accent-light); border-top: 2px solid var(--border); }
.zoznam-produktov tr.riadok-variant td { background: var(--surface-2); }
.variant-znak { color: var(--text-muted); margin-right: 4px; }
.variant-ikona {
  display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 8px;
  background: var(--accent); color: #fff; font-weight: 700; font-family: 'Barlow Semi Condensed', sans-serif; font-size: 17px;
}

/* Výber variantu na stránke produktu */
.variant-volba { margin: 14px 0 18px; display: flex; flex-direction: column; gap: 12px; }
.vv-nazov { font-size: 13.5px; color: var(--text-muted); margin-bottom: 6px; }
.vv-nazov strong { color: var(--text); }
.vv-tlacidla { display: flex; flex-wrap: wrap; gap: 8px; }
.vv-tlacidla a {
  display: inline-block; padding: 7px 14px; border: 1px solid var(--border); border-radius: 6px;
  background: var(--surface); color: var(--text); text-decoration: none; font-size: 14px; min-width: 52px; text-align: center;
}
.vv-tlacidla a:hover { border-color: var(--accent); }
.vv-tlacidla a.vybrana { border: 2px solid var(--accent); padding: 6px 13px; font-weight: 600; background: var(--accent-light); }
.nastroje .vpravo { display: flex; gap: 10px; }
.nastroje .vlavo { display: flex; flex-wrap: wrap; gap: 10px; }
/* Deliaca čiara na stránkach bez tabuľky (napr. Kategórie) — na tej istej pozícii ako čiara
   pod názvami stĺpcov v zoznamoch: výška = riadok filtrov 50 + riadok názvov 44 px */
/* Čiara v tabuľkách je 4 px (okraj 2 px + vnútorný tieň 2 px) — tu rovnako hrubá a na tom istom mieste */
.ciara-zoznamu { height: 95px; box-sizing: border-box; border-bottom: 4px solid #A9C49A; width: min(1570px, 100%); margin-bottom: 19px; }
/* Hlavička zoznamu: vľavo nadpis a počet, vpravo hore hlásenie; riadok tlačidiel sa nezalamuje,
   aby mala vrchná časť pri každej šírke okna rovnakú výšku */
.zoznam-hlava { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; margin-bottom: 14px; }
.zoznam-hlava h1 { margin-bottom: 2px; white-space: nowrap; }
.zoznam-hlava p { margin: 0; white-space: nowrap; }
.zoznam-hlava-vpravo { flex: none; padding-top: 4px; }
.zoznam-hlava + .nastroje, .zoznam-hlava ~ .nastroje { flex-wrap: nowrap; }
.zoznam-hlava ~ .nastroje .vlavo { flex-wrap: nowrap; }
.zoznam-hlava ~ .nastroje .tlacidlo { white-space: nowrap; height: 38px; box-sizing: border-box; }
.zoznam-hlava ~ .nastroje { height: 38px; }
/* Skladové karty: marža pod cenou a cena nižšia ako nákupná */
.marza-pod { font-size: 11.5px; font-style: italic; color: #8A9A8F; line-height: 1.2; margin-top: 1px; }
.cena-strata { color: var(--chyba); font-weight: 700; }
/* Upozornenie: karty predávané pod nákupnú cenu (klik = filter) */
.upozornenie-strata {
  display: inline-flex; align-items: center; gap: 6px; padding: 7px 14px; border-radius: 9px;
  background: var(--chyba-bg); border: 1px solid #E8C4C1; color: var(--chyba); font-size: 13.5px; font-weight: 600;
  text-decoration: none;
  /* vždy rovnaká veľkosť bez ohľadu na text a šírku okna */
  width: 470px; height: 36px; justify-content: center; white-space: nowrap; overflow: hidden; flex: none;
}
.upozornenie-strata:hover { border-color: var(--chyba); }
.upozornenie-strata.aktivne { background: var(--chyba); border-color: var(--chyba); color: #fff; }
/* Tlačidlo Hľadať (lupa) v riadku filtrov nad stĺpcom obrázkov */
.tlacidlo-hladat {
  display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px;
  border: none; border-radius: 8px; background: var(--accent); color: #fff; cursor: pointer;
}
.tlacidlo-hladat:hover { background: var(--accent-hover); }
/* Zákazníci: pevné šírky stĺpcov (Používatelia dostanú zvyšok) */
.zoznam-firiem { table-layout: fixed; width: 1570px; }   /* súčet šírok stĺpcov — pri užšom okne sa posúva do strany */
.zoznam-firiem col.st-ludia { width: 642px; }
.zoznam-firiem col.st-firma { width: 260px; }
.zoznam-firiem col.st-ico, .zoznam-firiem col.st-dic { width: 140px; }
.zoznam-firiem col.st-skupina, .zoznam-firiem col.st-zlava { width: 116px; }
.zoznam-firiem col.st-stav { width: 100px; }
.zoznam-firiem col.st-akcie { width: 56px; }
.zoznam-firiem td { overflow: hidden; text-overflow: ellipsis; }
.zoznam-firiem td.mensi { font-size: 12px; white-space: normal; }
.zoznam-firiem td:nth-child(4) { white-space: normal; }
.zoznam-firiem thead td { overflow: visible; text-overflow: clip; }
body.admin .tabulka.zoznam-firiem .filtre select,
body.admin .tabulka.zoznam-firiem .filtre input[type="search"] { width: 100%; min-width: 0; }
body.admin .tabulka.zoznam-firiem .filtre select { padding-left: 6px; padding-right: 2px; }
/* Názov stĺpca na dva riadky (Cenová skupina, Globálna zľava) */
.pevna-hlavicka .tabulka thead tr:last-child th.zalom-hlavicka { white-space: normal; line-height: 1.2; }
/* Zákazníci: Cenová skupina, Globálna zľava a Stav zarovnané na stred (nadpis aj údaje) */
.zoznam-firiem thead tr:last-child th:nth-child(5),
.zoznam-firiem thead tr:last-child th:nth-child(6),
.zoznam-firiem thead tr:last-child th:nth-child(7),
.zoznam-firiem tbody td:nth-child(5),
.zoznam-firiem tbody td:nth-child(6),
.zoznam-firiem tbody td:nth-child(7) { text-align: center; }
.zoznam-firiem tbody td.prazdne { text-align: center; }
/* Objednávky: pevné šírky stĺpcov (spolu 1570 px) */
.zoznam-objednavok { table-layout: fixed; width: 1570px; }
.zoznam-objednavok col.st-cislo { width: 120px; }
.zoznam-objednavok col.st-datum { width: 114px; }
.zoznam-objednavok col.st-ico { width: 120px; }
.zoznam-objednavok col.st-zak { width: 160px; }
.zoznam-objednavok col.st-firma { width: 310px; }
.zoznam-objednavok col.st-osoba { width: 250px; }
.zoznam-objednavok col.st-poloziek { width: 90px; }
.zoznam-objednavok col.st-suma { width: 120px; }
.zoznam-objednavok col.st-stav { width: 110px; }
.zoznam-objednavok col.st-akcie { width: 56px; }
/* Každá objednávka na jednom riadku (veľa objednávok) — dlhý text sa skráti „…", celý je v bublinke */
.zoznam-objednavok td { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.zoznam-objednavok tbody td { padding-top: 7px; padding-bottom: 7px; }
.zoznam-objednavok .vedla { font-size: 12px; color: var(--text-muted); }
/* Nová (nespracovaná) objednávka — zvýraznený celý riadok, kým sa nezmení stav */
body.admin .zoznam-objednavok tr.nova-objednavka td { background: #FDF0E9; }
body.admin .zoznam-objednavok tr.nova-objednavka:hover td { background: #FBE6DA; }
body.admin .zoznam-objednavok tr.nova-objednavka td:first-child { box-shadow: inset 4px 0 0 #E08A5E; }
.zoznam-objednavok thead td { overflow: visible; text-overflow: clip; }
body.admin .tabulka.zoznam-objednavok .filtre select,
body.admin .tabulka.zoznam-objednavok .filtre input[type="search"] { width: 100%; min-width: 0; }
body.admin .tabulka.zoznam-objednavok .filtre select { padding-left: 6px; padding-right: 2px; }
.tabulka .stred { text-align: center; }
/* Tlačidlo, ktoré ešte nefunguje (napr. Export objednávok) */
.tlacidlo.caka-tlacidlo { color: #A3ACA5; cursor: default; }
.tlacidlo.caka-tlacidlo:hover { background: var(--surface); }
.akcie-ponuka .caka { display: block; padding: 8px 11px; font-size: 14px; color: #A3ACA5; cursor: default; }
/* Lupa pred prvým filtrom (Zákazníci) */
.filter-s-lupou { display: flex; gap: 8px; align-items: center; }
.filter-s-lupou .tlacidlo-hladat { flex: none; }
body.admin .tabulka .filtre .filter-s-lupou input[type="search"] { min-width: 0; }

/* ─── Vyskakovacie hlásenia (vysunú sa zo spodku obrazovky, po 30 s zmiznú) ─── */
.hlasenia {
  position: fixed; left: 50%; bottom: 24px; transform: translateX(-50%); z-index: 200;
  display: flex; flex-direction: column; gap: 10px; width: min(560px, calc(100vw - 32px)); pointer-events: none;
}
.hlasenia > .oznam, .hlasenia > .chyba {
  margin: 0; position: relative; padding-right: 44px; pointer-events: auto;
  box-shadow: 0 10px 30px rgba(22, 42, 28, .18);
  transform: translateY(calc(100% + 40px)); opacity: 0; transition: transform .35s ease, opacity .35s ease;
}
.hlasenia > .vidno { transform: none; opacity: 1; }
.hlasenie-zavriet {
  position: absolute; top: 50%; right: 10px; transform: translateY(-50%);
  width: 26px; height: 26px; border: none; border-radius: 6px; background: transparent;
  font-size: 19px; line-height: 1; color: inherit; opacity: .6; cursor: pointer;
}
.hlasenie-zavriet:hover { opacity: 1; background: rgba(0, 0, 0, .06); }

/* ─── Pevné rozmery obchodu (administrácia aj zákaznícka časť s bočnou lištou) ───
   Nič sa pri zúžení okna nezmenšuje ani nepresúva — bočná lišta ostáva vľavo s pevnou šírkou,
   pri úzkom okne pribudne posuvník. Šírka = bočná lišta 260 + okraje 64 + tabuľka 1570 + rezerva.
   Verejné stránky (úvod, podlahové krytiny, kontakt, registrácia, zásady) majú vlastné štýly. */
/* Horná lišta (logo, používateľ) sa prispôsobí šírke okna a ostáva celá viditeľná; bočná lišta
   ostáva vľavo s pevnou šírkou; posúva sa len obsah vpravo (main). Obsah má pevnú minimálnu šírku
   (tabuľka 1570 + rezerva na posuvník) — pri užšom okne pribudne posuvník len v obsahovej časti. */
body.admin { height: 100vh; overflow: hidden; }
body.admin .hlavicka { flex: none; }
body.admin .admin-telo { flex: 1 1 auto; min-height: 0; }
body.admin .pata { flex: none; }
body.admin main { overflow: auto; min-width: 0; }
body.admin .main-obsah { min-width: 1570px; }   /* šírka tabuliek — aj s posuvníkom sa zmestí bez vodorovného posúvania */
.bocne { flex: 0 0 260px; position: static; height: auto; align-self: stretch; }
/* Zoznamy s pevnou hlavičkou: obsah má výšku okna, zvisle sa posúva len tabuľka */
body.admin main:has(> .main-obsah > .pevna-hlavicka) { overflow-y: hidden; }
body.admin .main-obsah:has(> .pevna-hlavicka) { height: 100%; }
/* Rozmery, ktoré sa inde menia podľa šírky okna (vw), sú tu pevné — hodnoty ako pri 1920 px */
body.admin .hlavicka { padding: 0 48px; }
body.admin .hlavicka nav { gap: 22px; }
body.admin main { padding: 24px 32px; }
body.admin h1 { font-size: 27px; }

/* Detail firmy zákazníka: zoznam Používatelia firmy — rovnaké vlastnosti ako ostatné tabuľky
   (pevná šírka 1570 px, šírky stĺpcov cez colgroup, hrubá čiara pod názvami stĺpcov) */
.sekcia-zoznamu { width: 1570px; margin-top: 30px; }
.sekcia-zoznamu-hlava { display: flex; justify-content: space-between; align-items: center; height: 38px; margin-bottom: 6px; }
.sekcia-zoznamu-hlava h2 { margin: 0; }
.zoznam-pouzivatelov { table-layout: fixed; width: 1570px; }
.zoznam-pouzivatelov col.st-meno { width: 474px; }
.zoznam-pouzivatelov col.st-email { width: 360px; }
.zoznam-pouzivatelov col.st-telefon { width: 220px; }
.zoznam-pouzivatelov col.st-stav { width: 140px; }
.zoznam-pouzivatelov col.st-prihlaseny { width: 320px; }
.zoznam-pouzivatelov col.st-akcie { width: 56px; }
.zoznam-pouzivatelov td { overflow: hidden; text-overflow: ellipsis; }
.zoznam-pouzivatelov td.prazdny-riadok { white-space: normal; padding: 18px 14px; }
.akcie-ponuka a[data-akcia="odstranit"] { color: var(--chyba); border-top: 1px solid var(--border); border-radius: 0 0 7px 7px; margin-top: 3px; }
.zoznam-pouzivatelov td.slabsi { color: var(--text-muted); }
/* Údaje (Firma, Môj účet, detail firmy): každý riadok rovnako vysoký — štítok (platca DPH,
   Aktívna…) nesmie riadok zväčšiť, inak by sa pri preklikávaní stránky „posúvali" */
.udaje dt, .udaje dd { min-height: 22px; line-height: 22px; }
.udaje dd .stitok { vertical-align: middle; margin-block: -4px; }
.udaje dd.udaj-hlavny { line-height: 27px; }
/* Používatelia firmy: tabuľka má pevnú šírku, posúva sa celá stránka — vlastný posuvník netreba */
.sekcia-zoznamu .tabulka-obal { overflow: visible; }
/* Firma: dve rovnako široké polia vedľa seba (údaje + zatiaľ prázdne) — spolu 1570 px
   ako tabuľky, takže sa zmestia bez vodorovného posúvania */
.dve-karty { display: grid; grid-template-columns: 760px 785px; gap: 24px; align-items: stretch; }
.dve-karty > .karta, .dve-karty > form > .karta { max-width: none; }
.dve-karty > form { margin: 0; }
/* Hlavička nad dvoma poľami: tlačidlá v rovnakej výške, každé pri pravom okraji svojho poľa */
.hlavicka-stranky.dve-stlpce { display: grid; grid-template-columns: 760px 785px; gap: 24px; max-width: none; align-items: end; justify-content: start; }
.hlavicka-stranky .tlacidlo.maly { line-height: 20px; box-sizing: border-box; height: 38px; display: inline-flex; align-items: center; }
.hlavicka-lavy { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; }
.hlavicka-pravy { display: flex; justify-content: flex-end; align-items: flex-end; }
/* Firma (zobrazenie): polia bez rámika, údaje hustejšie (medzery pri deliacich čiarach ostávajú) */
.dve-karty.bez-ramika > .karta { border: none; background: none; padding: 0; border-radius: 0; }
.dve-karty.bez-ramika .udaje { row-gap: 2px; max-width: none; }
.dve-karty.bez-ramika .udaje dd.udaj-hlavny { white-space: nowrap; }
.dve-karty.bez-ramika .udaje dd .stitok-dph { margin-left: 12px; }
/* Prevádzky — tabuľka sa zmestí do poľa (775 px), vlastnosti ako ostatné tabuľky */
/* Pravé pole oddelené zvislou deliacou čiarou; nadpisy sekcií hore bez medzery (rovnaká výška vľavo aj vpravo) */
.dve-karty.bez-ramika > .druha-karta { border-left: 1px solid var(--border); padding-left: 24px; }
.dve-karty.bez-ramika .udaje-karta > div > .udaje-sekcia:first-child,
.dve-karty.bez-ramika > .druha-karta > .udaje-sekcia:first-child { margin-top: 0; }
.druha-karta > .udaje-sekcia + .tabulka-obal { margin-top: -12px; }
.druha-karta .tabulka-obal { overflow: visible; }
.zoznam-prevadzok { table-layout: fixed; width: 760px; }
.zoznam-prevadzok col.st-nazov { width: 215px; }
.zoznam-prevadzok col.st-adresa { width: 320px; }
.zoznam-prevadzok col.st-telefon { width: 169px; }
.zoznam-prevadzok col.st-akcie { width: 56px; }
.zoznam-prevadzok td { overflow: hidden; text-overflow: ellipsis; }
.zoznam-prevadzok td.prazdny-riadok { white-space: normal; padding: 18px 14px; color: var(--text-muted); }
/* Prevádzka (formulár): rámik rovnako široký ako pole na stránke Firma */
.hlavicka-stranky.polovica-760 { max-width: 760px; }
.prevadzka-karta { max-width: 760px; }
.zoznam-prevadzok td .stitok { margin-left: 6px; }
/* Prevádzka: otváracia doba — deň a 4 časy (otvorenie, zatvorenie, obed od, obed do) */
.otvaracia-doba { display: grid; grid-template-columns: 140px repeat(4, minmax(0, 1fr)); gap: 8px 12px; align-items: center; }
.otvaracia-doba .od-hlava { font-size: 11.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--text-muted); }
.otvaracia-doba .od-den { font-size: 14px; font-weight: 500; color: var(--text); }
.otvaracia-doba input[type="time"] {
  width: 100%; min-width: 0; height: 36px; box-sizing: border-box; padding: 5px 8px;
  font: inherit; font-size: 14px; color: var(--text); background: var(--surface);
  border: 1px solid var(--border); border-radius: 8px;
}
.otvaracia-doba input[type="time"]:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px rgba(58,138,80,.15); }
.druha-karta .otvaracia-doba + .napoveda { margin-top: 14px; }
.druha-karta .napoveda .odkaz-tlacidlo { color: var(--accent); font-weight: 600; font-size: 12px; margin-left: 6px; }
/* Nadpis sekcie so zaškrtávacím poľom vedľa (Prevádzka: Otváracia doba) — čiara aj výška ostávajú rovnaké */
.udaje-sekcia.sekcia-so-zaskrtnutim { display: flex; align-items: center; gap: 24px; height: 28px; box-sizing: border-box; }
.udaje-sekcia.sekcia-so-zaskrtnutim label.zaskrtnutie { font-size: 13px; line-height: 21px; }
.udaje-sekcia.sekcia-so-zaskrtnutim input[type="checkbox"] { margin: 0; }
/* Prevádzka: mapa — pole na celú šírku pod oboma poľami (760 + 24 + 785 px), 3 možnosti vedľa seba */
.prevadzka-mapa { width: 1569px; margin-top: 8px; }
.mapa-moznosti { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.mapa-moznost { display: flex; flex-direction: column; gap: 6px; padding: 12px 14px; border: 1px solid var(--border); border-radius: 10px; cursor: pointer; opacity: .55; transition: opacity .15s, border-color .15s, background .15s; }
.mapa-moznost.zvolena { opacity: 1; border-color: var(--accent); background: var(--surface-2); }
.mapa-moznost-hlava { display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 600; color: var(--text); }
.mapa-moznost-hlava input { margin: 0; accent-color: var(--accent); }
.mapa-moznost input[type="text"] { width: 100%; box-sizing: border-box; height: 36px; padding: 6px 10px; font: inherit; font-size: 14px; color: var(--text); background: var(--surface); border: 1px solid var(--border); border-radius: 8px; }
.mapa-moznost .napoveda { margin: 0; }
/* Firma – úprava: v pravom poli formulár začína hneď nadpisom; riadok s heslom na celú šírku (6 stĺpcov po ~250 px) */
.dve-karty.bez-ramika > .druha-karta > .formular-6 > .udaje-sekcia:first-child { margin-top: 0; }
.prevadzka-mapa .formular-6.potvrdenie-riadok { max-width: none; }
/* Detail firmy zákazníka: tabuľka Používatelia firmy v treťom poli (1569 px) */
.prevadzka-mapa .zoznam-pouzivatelov { width: 1569px; }
.prevadzka-mapa .zoznam-pouzivatelov col.st-meno { width: 473px; }
.prevadzka-mapa > .udaje-sekcia + .tabulka-obal { margin-top: -12px; overflow: visible; }
.dve-karty.bez-ramika > .druha-karta > div > .udaje-sekcia:first-child { margin-top: 0; }
.dve-karty.bez-ramika > .druha-karta .udaje { grid-template-columns: 165px minmax(0, 1fr); }   /* rovnaké odsadenie údajov ako v ľavom poli */
/* Detail firmy zákazníka: interná poznámka a nadpis sekcie s tlačidlom (Používatelia firmy) */
.poznamka-text { margin: 0; font-size: 14px; color: var(--text); line-height: 1.5; }
.poznamka-text .prazdny { color: var(--text-muted); }
.udaje-sekcia.sekcia-s-tlacidlom { display: flex; justify-content: space-between; align-items: flex-end; }
.udaje-sekcia.sekcia-s-tlacidlom .tlacidlo { margin-bottom: 2px; }
.prevadzka-mapa > .udaje-sekcia.sekcia-s-tlacidlom + .tabulka-obal { margin-top: -12px; }
/* Skladová karta (produkt.php) v štýle polí: výbery na celú šírku, ceny v treťom poli */
.dve-karty .pole select, .prevadzka-mapa .pole select { width: 100%; }
.prevadzka-mapa .ceny-formular { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.prevadzka-mapa .ceny-tabulka { width: auto; min-width: 760px; }
.prevadzka-mapa .obrazky { margin-top: 0; }
.prevadzka-mapa .nahravanie { border-top: none; padding-top: 0; }
.dve-karty.bez-ramika .formular-karta { margin-top: 0; }
.dve-karty.bez-ramika > .karta > .udaje-sekcia:first-child { margin-top: 0; }
.prevadzka-mapa > .udaje { grid-template-columns: 165px minmax(0, 1fr); }   /* rovnaké odsadenie ako v poliach hore */
.prevadzka-mapa > .tichy { margin: 0; font-size: 14px; }
/* Skladová karta – ceny: vľavo nákupná cena a min. marža (pod nákupnou sadzba DPH), vpravo ceny skupín */
.ceny-riadok { display: flex; justify-content: space-between; align-items: flex-start; gap: 14px; }
.ceny-lave { display: grid; grid-template-columns: 250px 250px; gap: 0 14px; align-items: start; }
.ceny-skupiny { display: flex; justify-content: flex-end; gap: 14px; }
.ceny-skupiny .pole { width: 250px; flex: none; }
/* Hlavná kategória v strome: zaškrtnutá, sivá, nedá sa meniť */
.strom label.hlavna-kat { color: #A3ACA5; cursor: not-allowed; }
/* Doplnok v názve poľa, napr. „(do zoznamu, max. 500 znakov)" — menej výrazný ako samotný názov */
.label-doplnok { font-weight: 400; color: var(--text-muted); }
/* Skladová karta (zobrazenie): ďalšie kategórie ako strom na čítanie */
.strom-citat { font-size: 14px; }
.strom-citat .vybrana { font-weight: 500; color: var(--text); }
.strom-citat .nadradena { font-weight: 400; color: var(--text-muted); }
.udaje dd .strom-citat li { margin: 1px 0; }
/* Strom kategórií na skladovej karte: pevná výška s posúvaním, zbaľovanie šípkou */
.dve-karty .strom-obal { height: 300px; min-height: 0; max-height: none; overflow: auto; }
.dve-karty .strom-obal.strom-obal-citat { height: auto; max-height: 300px; border: none; padding: 0; }
.strom li.zbalene > ul { display: none; }
.strom-sipka { width: 18px; height: 18px; padding: 0; margin-right: 2px; border: none; background: none; color: var(--text-muted); font-size: 11px; line-height: 18px; cursor: pointer; vertical-align: middle; }
.strom-sipka::before { content: "▾"; }
li.zbalene > .strom-sipka::before { content: "▸"; }
.strom-sipka.prazdna { visibility: hidden; cursor: default; }
.strom-sipka:hover { color: var(--accent); }
/* Kategórie: zbaľovanie stromu šípkou ▸/▾ (alebo klikom na názov) */
.kat-strom li.zbalene > ul.kat-strom { display: none; }
.kat-sipka { width: 18px; height: 18px; flex: none; padding: 0; border: none; background: none; color: var(--text-muted); font-size: 12px; line-height: 18px; cursor: pointer; }
.kat-sipka::before { content: "▾"; }
li.zbalene > .kat-riadok > .kat-sipka::before { content: "▸"; }
.kat-sipka.prazdna { visibility: hidden; cursor: default; }
.kat-sipka:hover { color: var(--accent); }
.kat-riadok .kat-nazov { cursor: pointer; }
.kat-zbalit { margin-left: 16px; font-size: 13px; font-weight: 400; font-family: inherit; }
.kat-zbalit .odkaz-tlacidlo { color: var(--accent); font-size: 13px; margin-right: 10px; }
/* Ponuka pod menom zákazníka v obchode — rovnaká ako na verejných stránkach */
.ucet-ponuka .ucet-admin { border-bottom: 1px solid var(--border); border-radius: 8px 8px 0 0; margin-bottom: 4px; font-weight: 600; }
.hlavicka nav .ucet-ponuka a { color: var(--text); padding: 10px 12px; }   /* v obchode rovnako ako na verejných stránkach */
.hlavicka nav .ucet-ponuka a:hover { background: var(--surface-2); }
.hlavicka nav .ucet-ponuka a.ucet-admin { border-radius: 8px 8px 0 0; }
/* Produkty: v ľavej lište sú len kategórie (bez menu) — bez deliacej čiary a hornej medzery */
.bocne > .kat-filter:first-child { margin-top: 0; padding-top: 0; border-top: none; }
/* Produkty (zákazník): bez nadpisu; vyhľadávanie širšie a v strede, cesta kategórií (omrvinky) pod ním vľavo */
.zoznam-hlavicka { display: flex; flex-direction: column; align-items: stretch; gap: 14px; }
.zoznam-hlavicka > .hladat-produkty { order: -1; align-self: center; }
.zoznam-hlavicka > div:first-child:empty, .zoznam-hlavicka > div:first-child:not(:has(*)) { display: none; }
.zoznam-hlavicka .omrvinky { margin: 0; }
.hladat-produkty input { width: 520px; min-width: 0; }
/* Karty produktov (zákazník): 6 v riadku, PEVNÝ rozmer bez ohľadu na obrázok —
   obrázok sa zmenší/zväčší do svojho okna (celý, bez orezania) */
.produkty-mriezka { grid-template-columns: repeat(6, minmax(0, 1fr)); align-items: start; }
.produkt-karta { height: 372px; }
.pk-obrazok { aspect-ratio: auto; height: 246px; flex: none; overflow: hidden; padding: 8px; box-sizing: border-box; }
.pk-obrazok img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; object-fit: contain; display: block; }
.pk-telo { min-height: 0; overflow: hidden; }
.pk-nazov { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.produkt-karta .pk-telo { padding: 10px 14px; gap: 2px; }
.produkt-karta .pk-spodok { padding-top: 4px; }
.produkt-karta .pk-nazov { max-height: 2.6em; }
/* Vyhľadávanie v strede (600 px); cesta kategórií pod ním, zarovnaná vľavo s produktmi */
.zoznam-hlavicka > .hladat-produkty { width: 600px; }
.zoznam-hlavicka > .hladat-produkty input { width: auto; flex: 1; }
.zoznam-hlavicka > div:first-child { align-self: stretch; margin-top: -4px; }
/* Zákaznícka časť: miesto na posuvník je vždy vyhradené — keď pribudne veľa produktov a zobrazí sa
   posuvník, obsah (vyhľadávanie v strede) sa neposunie do strany */
body.admin.zakaznik main { scrollbar-gutter: stable; }
/* Karty produktov: rámik (aj čiara pod obrázkom) sa ukáže až pri prechode myšou */
.produkt-karta { border-color: transparent; }
.produkt-karta .pk-obrazok { border-bottom-color: transparent; }
.produkt-karta:hover { border-color: var(--accent); }
.produkt-karta:hover .pk-obrazok { border-bottom-color: var(--border); }
/* Karty produktov: menší názov; cena vždy v rovnakej výške (riadok pre cenu za liter je vždy) */
.produkt-karta .pk-nazov { font-size: 14px; }
.produkt-karta .pk-cena.dopyt { line-height: 22px; }
/* Karty produktov: ceny v mriežke — sumy vpravo, „/ ks" a „/ lit." pod sebou; štítok v riadku so sumou */
.produkt-karta .pk-spodok { align-items: flex-start; }
.pk-ceny { display: grid; grid-template-columns: auto auto; column-gap: 4px; align-items: baseline; justify-content: start; }
.pk-ceny .pk-cena { text-align: right; white-space: nowrap; }
.pk-ceny .pk-jednotkova { text-align: right; white-space: nowrap; }
.pk-ceny .pk-za { font-size: 12px; color: var(--text-muted); white-space: nowrap; }
.produkt-karta .pk-spodok > .stitok { margin-top: 1px; }
.produkt-karta .pk-nazov, .produkt-karta .pk-kod { text-align: center; }   /* názov produktu v karte na stred */
/* Produkty: vyhľadávanie vo vrchnej lište — v strede nad obsahom (vpravo od šedej lišty) */
.hlavicka .hladat-v-liste { position: absolute; top: 50%; left: calc(260px + (100% - 260px) / 2); transform: translate(-50%, -50%);
  width: 600px; display: flex; gap: 8px; margin: 0; }
.hlavicka .hladat-v-liste input { flex: 1; width: auto; min-width: 0; background: var(--surface); }
.hlavicka .hladat-v-liste .tlacidlo { flex: none; }
/* Produkty: názov kategórie na mieste vyhľadávania (v strede), cesta kategórií pod ním vľavo */
.zoznam-hlavicka > .kategoria-nadpis { order: -1; align-self: center; margin: 0; font-size: 27px; line-height: 40px; text-align: center; }
.prevadzka-mapa > .udaje { row-gap: 2px; }   /* rovnako husté riadky ako v poliach nad ním */
/* Firma zákazníka: tabuľka ostatných používateľov (pole 1569 px) */
.zoznam-ostatnych { table-layout: fixed; width: 1569px; }
.zoznam-ostatnych col.st-meno { width: 560px; }
.zoznam-ostatnych col.st-email { width: 560px; }
.zoznam-ostatnych col.st-telefon { width: 449px; }
.zoznam-ostatnych td { overflow: hidden; text-overflow: ellipsis; }
.zoznam-ostatnych td .stitok { margin-left: 6px; }
.zoznam-ostatnych td.prazdny-riadok { white-space: normal; padding: 18px 14px; color: var(--text-muted); }
/* Prehľad zákazníka: údaje profilu v jednom riadku nad deliacou čiarou (ako filtre nad tabuľkou) */
.profil-riadok { display: grid; grid-template-columns: 420px 300px 200px 220px 160px 1fr; gap: 0 24px; margin: 0; height: 100%; align-content: center; }
.profil-riadok dt { font-size: 11.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--text-muted); margin-bottom: 4px; }
.profil-riadok dd { margin: 0; font-size: 15px; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.profil-riadok dd .prazdny { color: var(--text-muted); }
.profil-riadok .profil-meno { font-weight: 600; font-size: 16px; }
.profil-riadok .profil-meno .stitok { margin-left: 8px; font-weight: 600; vertical-align: middle; }
/* Prehľad zákazníka: údaje profilu pod sebou (popis vľavo, hodnota vpravo) a pod nimi deliaca čiara */
/* Výška = riadok nástrojov (38 + 14) + priestor nad čiarou (95) → čiara presne tam, kde je v administrácii (Zákazníci) */
.profil-blok { width: min(1570px, 100%); height: 147px; box-sizing: border-box; border-bottom: 4px solid #A9C49A; padding: 4px 0 0; margin-bottom: 19px; overflow: hidden; }
.profil-zoznam { display: grid; grid-template-columns: 165px minmax(0, 1fr); gap: 2px 16px; margin: 0; align-items: baseline; }
.profil-zoznam dt, .profil-zoznam dd { line-height: 22px; }
.profil-zoznam dt { font-size: 11.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--text-muted); }
.profil-zoznam dd { margin: 0; font-size: 14px; color: var(--text); }
.profil-zoznam dd a { color: var(--text); font-weight: 600; }
.profil-zoznam dd a:hover { color: var(--accent); text-decoration: underline; }
.profil-zoznam .profil-meno { font-weight: 600; font-size: 15px; }
.profil-zoznam .prazdny { color: var(--text-muted); }

/* ─── Košík ─────────────────────────────────────────────────────── */
/* Odkaz v lište (vľavo od mena) s počtom položiek */
.hlavicka nav .kosik-odkaz { display: flex; align-items: center; gap: 8px; padding: 9px 12px; border-radius: 10px; color: var(--text); font-size: 15px; font-weight: 600; }
.hlavicka nav .kosik-odkaz svg { color: var(--accent); }
.kosik-pocet {
  min-width: 22px; height: 22px; padding: 0 6px; box-sizing: border-box; border-radius: 11px;
  background: var(--accent); color: #fff; font-size: 12.5px; font-weight: 700; line-height: 22px; text-align: center;
}

/* Množstvo: pole + jednotka (stránka produktu aj košík) */
.kosik-mnozstvo { display: inline-flex; align-items: center; gap: 8px; }
.kosik-mnozstvo input { width: 92px; padding: 9px 10px; text-align: right; font: inherit; font-size: 15px; }
.kosik-mnozstvo span { color: var(--text-muted); font-size: 14px; min-width: 24px; text-align: left; }
.objednat .kosik-mnozstvo input { height: 48px; box-sizing: border-box; }
.objednat .v-kosiku { font-size: 13.5px; color: var(--text-muted); flex-basis: 100%; }
.objednat .v-kosiku a { color: var(--accent); text-decoration: underline; }

/* Tabuľka košíka — pevné šírky ako ostatné zoznamy (spolu 1570 px) */
.zoznam-kosika { table-layout: fixed; width: 1570px; }
.zoznam-kosika col.st-obr { width: 72px; }
.zoznam-kosika col.st-produkt { width: 618px; }
.zoznam-kosika col.st-cena { width: 180px; }
.zoznam-kosika col.st-mnozstvo { width: 190px; }
.zoznam-kosika col.st-dph { width: 80px; }
.zoznam-kosika col.st-suma { width: 170px; }
.zoznam-kosika col.st-odobrat { width: 90px; }
.zoznam-kosika td { vertical-align: middle; }
.zoznam-kosika .kosik-obr { padding-top: 6px; padding-bottom: 6px; }
.zoznam-kosika .kosik-obr img { width: 48px; height: 48px; object-fit: contain; display: block; }
.zoznam-kosika .kosik-nazov { color: var(--text); font-weight: 600; white-space: normal; }
.zoznam-kosika .kosik-nazov:hover { color: var(--accent); }
.zoznam-kosika .kosik-kod { font-size: 12.5px; color: var(--text-muted); margin-top: 2px; white-space: normal; }
.zoznam-kosika .kosik-j { color: var(--text-muted); font-size: 12.5px; }
.zoznam-kosika .kosik-mnozstvo input { padding: 6px 8px; font-size: 14px; width: 84px; }
.kosik-odobrat {
  width: 30px; height: 30px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface);
  color: var(--text-muted); font-size: 18px; line-height: 1; cursor: pointer;
}
.kosik-odobrat:hover { border-color: var(--chyba); color: var(--chyba); }

/* Pod tabuľkou: poznámka vľavo, súčet a odoslanie vpravo (rovnaká mriežka ako dve polia) */
.kosik-spodok { display: grid; grid-template-columns: 760px 785px; gap: 24px; width: 1569px; margin-top: 24px; align-items: start; }
.kosik-poznamka label { display: block; font-weight: 600; margin-bottom: 6px; }
.kosik-poznamka textarea { width: 100%; box-sizing: border-box; resize: vertical; font: inherit; padding: 10px 12px; }
.kosik-suhrn { justify-self: end; width: 420px; }
.kosik-suhrn dl { display: grid; grid-template-columns: 1fr auto; gap: 6px 0; margin: 0 0 14px; }
.kosik-suhrn dd { padding-left: 24px; }
.kosik-suhrn dt { color: var(--text-muted); }
.kosik-suhrn dd { margin: 0; text-align: right; font-variant-numeric: tabular-nums; }
.kosik-suhrn .kosik-celkom { border-top: 1px solid var(--border); padding-top: 8px; color: var(--text); font-weight: 700; font-size: 18px; }
.kosik-suhrn .kosik-dopyt { font-size: 13px; color: var(--text-muted); margin: 0 0 14px; }
.kosik-suhrn .tlacidlo { width: 100%; }
.kosik-hotovo { width: min(1570px, 100%); box-sizing: border-box; }
.zoznam-kosika .tichy { font-size: inherit; }

/* Päta v obsahu (zákaznícka časť s bočnou lištou): je na spodku stránky, dosiahne sa posúvaním.
   Pri krátkej stránke ostane dole, obsah nad ňou vyplní zvyšok výšky. */
body.admin main:has(> .pata) { display: flex; flex-direction: column; padding-bottom: 0; }
body.admin main:has(> .pata) > .main-obsah { flex: 1 0 auto; }
body.admin main > .pata { flex: none; margin: 40px -32px 0; }

/* Stránka produktu: „Späť na produkty" v riadku, kde je na stránke Produkty nadpis (rovnaká výška) */
.zoznam-hlavicka > .spat-na-produkty { order: -1; align-self: flex-start; line-height: 40px; font-size: 15px; color: var(--accent); }
.zoznam-hlavicka > .spat-na-produkty:hover { text-decoration: underline; }

/* Objednávky zákazníka — zoznam a položky objednávky (pevné šírky, spolu 1570 px) */
.zoznam-zak { width: 1570px; }
.zoznam-obj-zak, .zoznam-obj-polozky { table-layout: fixed; width: 1570px; }
.zoznam-obj-zak col.st-cislo { width: 200px; }
.zoznam-obj-zak col.st-zak { width: 260px; }
.zoznam-obj-zak col.st-osoba { width: 470px; }
.zoznam-obj-zak col.st-poloziek { width: 110px; }
.zoznam-obj-zak col.st-suma { width: 170px; }
.zoznam-obj-zak col.st-stav { width: 190px; }
.zoznam-obj-zak .moja-obj { margin-left: 10px; }
.zoznam-obj-zak a.cislo-obj { color: var(--text); }
.zoznam-obj-zak a.cislo-obj:hover { color: var(--accent); text-decoration: underline; }
.zoznam-obj-polozky col.st-kod { width: 150px; }
.zoznam-obj-polozky col.st-nazov { width: 600px; }
.zoznam-obj-polozky col.st-mnozstvo { width: 150px; }
.zoznam-obj-polozky col.st-cena { width: 180px; }
.zoznam-obj-polozky col.st-dph { width: 90px; }
.zoznam-obj-polozky col.st-suma { width: 200px; }
.zoznam-obj-polozky .obj-nazov { white-space: normal; }
.zoznam-obj-polozky .tichy, .zoznam-obj-zak .tichy { font-size: inherit; }

/* Zoznam objednávok (administrácia): detail sa otvára len klikom na číslo objednávky */
.zoznam-objednavok a.cislo-obj { color: var(--text); }
.zoznam-objednavok a.cislo-obj:hover { color: var(--accent); text-decoration: underline; }
/* Detail objednávky (administrácia) */
.zmena-stavu { display: flex; align-items: center; gap: 10px; }
.zmena-stavu label { color: var(--text-muted); font-size: 14px; }
.zmena-stavu select { padding: 8px 10px; font: inherit; font-size: 14px; }
.hlavicka-stranky h1 .stitok { font-size: 13px; vertical-align: middle; margin-left: 8px; }
.prevadzka-mapa .zoznam-obj-polozky { width: 100%; }
.zoznam-obj-polozky td a { color: var(--accent); }
.obj-poznamka { white-space: pre-line; margin: 0; }
.obj-suhrn { display: flex; justify-content: flex-end; margin-top: 18px; }

/* Ľavá lišta administrácie: počet nových objednávok pri Objednávkach, kým je nejaká objednávka v stave Nová */
.bocne a:has(.bocne-nove) { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.bocne-nove {
  min-width: 22px; box-sizing: border-box; text-align: center;
  padding: 2px 7px; border-radius: 999px; background: #C62828; color: #fff;
  font-size: 12px; font-weight: 700; line-height: 18px; letter-spacing: .02em;
}
.bocne a.aktivny .bocne-nove { background: #fff; color: #C62828; }

/* Detail objednávky (administrácia): údaje nad deliacou čiarou — dva stĺpce, menšie písmo, pevná výška,
   aby hlavička tabuľky položiek (deliaca čiara) bola na rovnakej výške ako pri ostatných zoznamoch */
.obj-udaje { display: grid; grid-template-columns: 760px 785px; gap: 24px; width: 1569px; height: 100px; box-sizing: border-box; overflow: hidden; }
.obj-udaje .udaje { grid-template-columns: 130px minmax(0, 1fr); gap: 1px 12px; font-size: 13px; align-content: start; }
.obj-udaje .udaje dt, .obj-udaje .udaje dd { min-height: 0; line-height: 18px; font-size: 13px; padding-top: 0; }
.obj-udaje .udaje dd { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.obj-udaje .udaje dd.udaj-hlavny { font-size: 17px; line-height: 20px; }
.obj-udaje .udaje dt:first-child { line-height: 20px; }
.obj-udaje .udaje dd.udaj-hlavny a { color: var(--text); }
.obj-udaje .udaje dd.udaj-hlavny a:hover { color: var(--accent); text-decoration: underline; }
.obj-udaje .udaje + .udaje { border-left: 1px solid var(--border); padding-left: 24px; }

/* Zoznamy objednávok (zákazník aj administrácia): pevná výška riadku — nemení sa podľa stavu
   (štítky s rámikom aj bez neho majú rovnakú výšku) */
.zoznam-obj-zak tbody tr, .zoznam-objednavok tbody tr { height: 46px; }
.zoznam-obj-zak tbody td, .zoznam-objednavok tbody td { padding-top: 0; padding-bottom: 0; height: 46px; box-sizing: border-box; vertical-align: middle; }
.zoznam-obj-zak .stitok, .zoznam-objednavok .stitok { border: 1px solid transparent; line-height: 18px; vertical-align: middle; }
.zoznam-obj-zak .stitok.sedy, .zoznam-objednavok .stitok.sedy { border-color: var(--border); }
.zoznam-objednavok .stitok.oranzovy { border-color: #F2B9A0; }

/* Karta produktu v zozname: odkaz hore (obrázok, názov), varianty, odkaz dole (cena), riadok „rovno do košíka" */
.produkt-karta .pk-odkaz { display: block; color: inherit; }
.produkt-karta .pk-hore .pk-nazov { padding: 10px 14px 0; }
.pk-varianty { padding: 4px 14px 0; text-align: center; flex: none; }
body.admin .pk-varianty select { max-width: 100%; height: 28px; box-sizing: border-box; padding: 0 24px 0 8px; font: inherit; font-size: 12.5px; line-height: 26px; }
.produkt-karta .pk-dole { margin-top: auto; padding: 0 14px 8px; }
.produkty-mriezka .produkt-karta:has(.pk-kosik) { height: 430px; }
/* Obrázok a názov sa nikdy nezmenšujú — názov má vždy miesto na 2 riadky */
.produkt-karta .pk-hore { flex: none; }
.produkt-karta .pk-hore .pk-nazov { height: 2.6em; max-height: none; box-sizing: content-box; }
.pk-kosik { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 0 14px 12px; flex: none; }
.pk-mnozstvo {
  display: flex; align-items: center; height: 30px; box-sizing: border-box; min-width: 0;
  border: 1px solid #9DB8A5; border-radius: 8px; background: #fff; cursor: text; transition: border-color .15s, background .15s;
}
.pk-mnozstvo:focus-within { border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent-light); }
.pk-mnozstvo input { flex: 1; min-width: 0; height: 100%; border: none; background: transparent; padding: 0 4px 0 8px; text-align: right; font: inherit; font-size: 14px; outline: none; -moz-appearance: textfield; }
.pk-mnozstvo input::-webkit-outer-spin-button, .pk-mnozstvo input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.pk-mnozstvo .pk-j { flex: none; padding: 0 9px 0 2px; font-size: 13px; color: var(--text-muted); }
.pk-do-kosika {
  height: 30px; display: inline-flex; align-items: center; justify-content: center;
  border: none; border-radius: 8px; background: var(--accent); color: #fff; cursor: pointer; transition: background .15s, opacity .15s;
}
.pk-do-kosika:hover { background: var(--accent-hover); }
.pk-do-kosika.pridane { background: #1F6E3A; }
/* Kým nie je zadané množstvo: svetlé, akoby neaktívne */
.pk-kosik.prazdne .pk-mnozstvo { border-color: #DCE6DE; background: #F7FAF7; }
.pk-kosik.prazdne .pk-mnozstvo .pk-j { color: #B4C2B8; }
.pk-kosik.prazdne .pk-do-kosika, .pk-do-kosika:disabled { background: #CFE2D4; color: #fff; cursor: default; }

/* Dostupnosť tovaru: Skladom = sivý štítok, Na objednávku = svetlo oranžový */
.stitok.na-objednavku { background: #FFF1E6; color: #B5651D; border: 1px solid #F6D2B3; }

/* Nastavenia (administrácia): sivá lišta s tlačidlami podstránok pod deliacou čiarou */
/* Nastavenia: nadpis a hneď pod ním deliaca čiara (vrchná hrana sivej lišty) */
.nastavenia-nadpis { margin: 0 0 8px; }
.nastavenia-nadpis + .nastavenia-lista { border-top: 4px solid #A9C49A; height: 44px; }
.nastavenia-lista {
  display: flex; gap: 4px; align-items: center; width: 1570px; box-sizing: border-box;
  height: 40px; padding: 0 4px; background: #EFF0EF; border-bottom: 1px solid #DCDEDC;
}
.nastavenia-lista a {
  height: 32px; display: inline-flex; align-items: center; padding: 0 16px; border-radius: 7px;
  font-size: 14px; font-weight: 600; color: var(--text-muted);
}
.nastavenia-lista a:hover { background: #E3E6E3; color: var(--text); }
.nastavenia-lista a.aktivna { background: var(--surface); color: var(--accent); box-shadow: 0 1px 3px rgba(22, 42, 28, .12); }
.nastavenia-obsah { width: 1570px; padding-top: 20px; }

/* Nastavenia → Objednávky: číslovanie */
.nastavenia-sekcia-hlava { display: flex; align-items: center; justify-content: space-between; width: 1569px; margin-bottom: 4px; }
.nastavenia-sekcia-hlava .udaje-sekcia { flex: 1; margin-right: 16px; }
.nastavenia-polia { display: grid; grid-template-columns: 250px 300px; gap: 6px 16px; align-items: center; font-size: 14px; }
.nastavenia-polia > label { color: var(--text-muted); font-size: 13px; }
.nastavenia-polia input[type="text"], .nastavenia-polia input[type="number"], body.admin .nastavenia-polia select {
  width: 100%; box-sizing: border-box; height: 30px; padding: 0 10px; font: inherit; font-size: 14px;
  /* všetky štyri polia (aj rozbaľovacie) rovnakým štýlom */
  border: 1px solid #767676; border-radius: 2px; background-color: #fff; color: #000;
}
.nastavenia-polia input:focus, body.admin .nastavenia-polia select:focus { outline: 2px solid var(--accent-light); border-color: var(--accent); }
.nastavenia-polia .nastavenia-check { display: flex; align-items: center; gap: 8px; color: var(--text); font-size: 14px; }
.cislovanie-nahlad .cislovanie-cislo { font-family: 'Barlow Semi Condensed', sans-serif; font-weight: 700; font-size: 26px; line-height: 1.15; color: var(--accent); margin: 0; letter-spacing: .02em; }
.cislovanie-nahlad .udaje { margin-top: 8px; }
.cislovanie-pozn { font-size: 13px; margin: 6px 0 0; }
.cislovanie-nahlad > .tichy { font-size: 13px; }
.nastavenia-obsah { padding-top: 14px; }

/* ─── Košík: stránka sa neposúva; vľavo pole s položkami (posúva sa samo), vpravo pole so súčtami ─── */
/* Pri užšom okne sa dá posúvať do strany (pravé pole so súčtom), zvisle sa posúva len pole s položkami */
body.kosik-stranka main { overflow-x: auto; overflow-y: hidden; }
body.kosik-stranka main > .main-obsah { flex: 1 1 0; min-height: 0; display: flex; flex-direction: column; }
body.kosik-stranka .main-obsah > * { flex: none; }
body.kosik-stranka #kosik-formular { flex: 1 1 0; min-height: 0; display: flex; flex-direction: column; }
.kosik-telo { flex: 1 1 0; min-height: 0; display: grid; grid-template-columns: 1110px 436px; gap: 24px; width: 1570px; }
.kosik-polozky { min-height: 0; overflow-y: auto; overflow-x: hidden; scrollbar-gutter: stable; }
.kosik-polozky thead { position: sticky; top: 0; z-index: 3; }
.kosik-polozky thead th { background: var(--surface); box-shadow: inset 0 -2px 0 #A9C49A; }
/* Text namiesto tlačidla (ako „← Späť na zoznam objednávok") */
.kosik-spat { color: var(--text-muted); font-size: 15px; }
.kosik-spat:hover { color: var(--accent); text-decoration: underline; }
/* Názvy stĺpcov dole, doplnky (bez DPH) nad nimi */
.zoznam-kosika thead th { vertical-align: bottom; }
.zoznam-kosika thead th .th-pod { margin: 0 0 1px; }
/* Užšia tabuľka položiek (vedľa je pole so súčtami) */
.zoznam-kosika { width: 100%; }
.zoznam-kosika col.st-obr { width: 64px; }
.zoznam-kosika col.st-produkt { width: auto; }
.zoznam-kosika col.st-cena { width: 118px; }
.zoznam-kosika col.st-mnozstvo { width: 150px; }
.zoznam-kosika col.st-dph { width: 62px; }
.zoznam-kosika col.st-suma { width: 104px; }
.zoznam-kosika col.st-odobrat { width: 58px; }
/* Pole so súčtami: samostatné, oddelené zvislou čiarou, odosielanie dole */
.kosik-panel { display: flex; flex-direction: column; gap: 18px; padding-left: 24px; border-left: 1px solid var(--border); min-height: 0; overflow-y: auto; }
.kosik-panel .kosik-suhrn { width: auto; justify-self: auto; }
.kosik-panel .kosik-suhrn dl { margin-bottom: 0; }
.kosik-panel .kosik-dopyt { margin: 10px 0 0; }
.kosik-panel .kosik-poznamka textarea { height: 120px; }
.kosik-panel .tlacidlo { width: 100%; }
/* „Vyprázdniť košík" vpravo nad poľom s položkami */
body.kosik-stranka .nastroje { width: 1110px; box-sizing: border-box; }

/* Košík: vlastné číslo a dátum objednávky zákazníka (nad súčtom) */
.kosik-vasa-obj { display: grid; grid-template-columns: 1fr 150px; gap: 10px; }
.kosik-vasa-obj label { display: block; font-size: 13px; color: var(--text-muted); margin-bottom: 4px; }
.kosik-vasa-obj input { width: 100%; box-sizing: border-box; height: 34px; padding: 0 10px; font: inherit; font-size: 14px;
  border: 1px solid #767676; border-radius: 2px; background: #fff; color: #000; }
.kosik-vasa-obj input:focus { outline: 2px solid var(--accent-light); border-color: var(--accent); }

/* Zoznam objednávok zákazníka: dátum pod číslom (menší, sivý) */
.zoznam-obj-zak .obj-pod { font-size: 12px; color: var(--text-muted); line-height: 1.2; margin-top: 1px; }
.zoznam-obj-zak td { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.zoznam-obj-zak tbody td { line-height: 18px; }
.zoznam-obj-zak .obj-pod { line-height: 16px; }
.zoznam-obj-zak tbody td .stitok { line-height: 16px; padding-top: 2px; padding-bottom: 2px; }
body.admin .tabulka.zoznam-obj-zak tbody td { padding-top: 0; padding-bottom: 0; height: 46px; }

/* ─── Detail objednávky zákazníka: vrchná časť stojí, posúvajú sa len položky ─── */
body.objd-stranka main { overflow-x: auto; overflow-y: hidden; }
body.objd-stranka main > .main-obsah { flex: 1 1 0; min-height: 0; display: flex; flex-direction: column; }
body.objd-stranka .main-obsah > * { flex: none; }
/* Pevná výška vrchnej časti — deliaca čiara (hlavička tabuľky) na rovnakej výške ako pri zoznamoch */
.objd-hlava { display: grid; grid-template-columns: 1fr 420px; gap: 48px; width: 1570px; height: 185px; box-sizing: border-box; }
.objd-lavo h1 { margin: 0 0 2px; white-space: nowrap; }
.objd-lavo h1 .stitok { font-size: 13px; vertical-align: middle; margin-left: 8px; }
.objd-lavo p { margin: 0 0 14px; white-space: nowrap; }
.objd-vasa { margin-top: 12px; }
.objd-vasa .udaje { grid-template-columns: 120px minmax(0, 1fr); gap: 2px 12px; max-width: 520px; }
.objd-vasa .udaje dd { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.objd-suhrn { width: 420px; justify-self: end; align-self: center; }   /* na stred výšky vrchnej časti */
.objd-suhrn dl { margin: 0; }
.objd-suhrn .kosik-dopyt { margin: 6px 0 0; }
body.objd-stranka .main-obsah > .objd-polozky { flex: 1 1 0; min-height: 0; overflow-y: auto; overflow-x: hidden; width: 1570px; scrollbar-gutter: stable; }
.objd-polozky .zoznam-obj-polozky { width: 100%; }
.objd-polozky thead { position: sticky; top: 0; z-index: 3; }
.objd-polozky thead th { background: var(--surface); box-shadow: inset 0 -2px 0 #A9C49A; vertical-align: bottom; }
.objd-polozky thead th .th-pod { margin: 0 0 1px; }
.objd-poznamka { width: 760px; padding: 24px 0 8px; }
.objd-poznamka p { white-space: pre-line; margin: 0; }
body.objd-stranka main:has(> .pata) > .main-obsah, body.kosik-stranka main:has(> .pata) > .main-obsah { flex: 1 1 0; min-height: 0; }

/* Detail objednávky zákazníka: malý obrázok produktu; tabuľka presne na šírku poľa (posuvník nezakryje stĺpec) */
.objd-polozky .zoznam-obj-polozky col.st-obr { width: 56px; }
.objd-polozky .zoznam-obj-polozky col.st-nazov { width: auto; }
body.admin .objd-polozky .tabulka.zoznam-obj-polozky { width: 100%; }
.objd-obr { padding-top: 0 !important; padding-bottom: 0 !important; }
.objd-obr img { width: 36px; height: 36px; object-fit: contain; display: block; }
.objd-polozky .zoznam-obj-polozky tbody td { height: 44px; box-sizing: border-box; padding-top: 0; padding-bottom: 0; vertical-align: middle; }

/* Prázdny košík: tlačidlo v lište svetlé a neaktívne */
.hlavicka nav .kosik-odkaz.prazdny { color: #A3ACA5; pointer-events: none; cursor: default; }
.hlavicka nav .kosik-odkaz.prazdny svg { color: #B9C7BD; }

/* Nastavenia → Dodacie podmienky */
.doprava-test-nadpis { margin-top: 18px; }
.doprava-test { display: flex; gap: 8px; align-items: center; margin-top: 8px; }
.doprava-test input { width: 160px; box-sizing: border-box; height: 30px; padding: 0 10px; font: inherit; font-size: 14px;
  border: 1px solid #767676; border-radius: 2px; background: #fff; color: #000; }
.doprava-vysledok { margin-top: 12px; }
.doprava-zdarma { color: var(--accent); }
/* Košík: koľko chýba do dopravy zdarma */
.doprava-tip { font-size: 13px; color: var(--text-muted); margin: 8px 0 0; }
.doprava-tip strong { color: var(--accent); }
.kosik-suhrn dt .label-doplnok { font-size: 12px; }
.nastavenia-polia:has(#doprava_psc) { grid-template-columns: 330px 260px; }
.objd-suhrn dl { gap: 3px 0; }

/* Nastavenia → Dodacie podmienky: mapa okruhu */
.doprava-mapa { height: 320px; margin-top: 16px; border: 1px solid var(--border); border-radius: 8px; z-index: 0; }