/* Vzhled aplikace – stejné barvy jako kalkulace (kraftový karton). */
:root {
  --kraft: #8a5a2b;
  --kraft-svetla: #f6efe6;
  --text: #1f1c19;
  --text-2: #6b625a;
  --linka: #e2d9cf;
  --pozadi: #faf8f5;
  --karta: #ffffff;
  --chyba: #b3261e;
  --chyba-pozadi: #fbe9e7;
  --polomer: 8px;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--pozadi); color: var(--text);
  font: 15px/1.45 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
[hidden] { display: none !important; }

.hlavicka {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  padding: 12px 24px; background: var(--karta); border-bottom: 3px solid var(--kraft);
}
.hlavicka .domu { display: flex; align-items: center; gap: 12px; text-decoration: none; }
.hlavicka .logo { height: 32px; }
.hlavicka .znacka { font-weight: 700; color: var(--kraft); letter-spacing: .02em; }
.hlavicka .znacka small { font-weight: 500; color: var(--text-2, #6b5f53); margin-left: 4px; letter-spacing: 0; }
.hlavicka .kdo { margin-left: auto; display: flex; gap: 12px; align-items: baseline; color: var(--text-2); }

.obsah { max-width: 960px; margin: 0 auto; padding: 32px 16px; }
.nacitani { color: var(--text-2); }
h1 { font-size: 22px; font-weight: 600; margin: 0 0 16px; }

.karta { background: var(--karta); border: 1px solid var(--linka); border-radius: var(--polomer); padding: 24px; }
.formular { max-width: 420px; margin: 0 auto; display: flex; flex-direction: column; gap: 14px; }
.formular .popis { margin: 0; color: var(--text-2); }
.formular label { display: flex; flex-direction: column; gap: 4px; font-weight: 500; }
.formular input {
  font: inherit; font-weight: 400; color: inherit; background: #fff;
  border: 1px solid #cfc5ba; border-radius: 6px; padding: 9px 10px;
}
.formular input:focus { outline: 2px solid var(--kraft); outline-offset: 0; border-color: var(--kraft); }
.chyba { margin: 0; padding: 8px 10px; border-radius: 6px; background: var(--chyba-pozadi); color: var(--chyba); }

.tlacitko {
  font: inherit; font-weight: 600; color: #fff; background: var(--kraft);
  border: 0; border-radius: 6px; padding: 10px 16px; cursor: pointer;
}
.tlacitko:disabled { opacity: .6; cursor: default; }
.odkaz { font: inherit; color: var(--kraft); background: none; border: 0; padding: 0; cursor: pointer; text-decoration: underline; }

/* okno „Vyrobit do“ z úkolu (Jan, 29. 10. 2026) */
.okno-terminu { border: none; border-radius: 12px; padding: 20px 24px; box-shadow: 0 10px 40px rgba(0,0,0,.25); min-width: 300px; }
.okno-terminu::backdrop { background: rgba(0,0,0,.35); }
.okno-terminu h2 { margin: 0 0 4px; }
.okno-terminu input[type=date] { font: inherit; font-size: 18px; padding: 8px 10px; border: 1px solid #cfc5ba; border-radius: 6px; width: 100%; box-sizing: border-box; margin: 8px 0; }
.okno-terminu .akce { display: flex; gap: 10px; margin-top: 8px; }
.okno-paletizace { width: min(720px, 94vw); }
.okno-paletizace label { display: flex; flex-direction: column; gap: 3px; margin: 6px 0; font-size: 13px; color: var(--text-2); }
.okno-paletizace input, .okno-paletizace textarea { font: inherit; font-size: 14px; padding: 6px 8px; border: 1px solid #cfc5ba; border-radius: 6px; }
/* „Čeká na vás“ – úkoly pro lidi (Jan, 29. 10. 2026) */
.ukoly { margin: 0 0 20px; padding: 12px 16px; border: 1px solid #e0b84a; background: #fff8e6; border-radius: 8px; }
.ukoly h2 { margin: 0 0 6px; font-size: 17px; }
.ukoly ul { margin: 0; padding-left: 18px; display: grid; gap: 4px; }
.ukoly a { color: var(--text, #1f1c19); }
.poznamka-ukolu { margin: 0 0 12px; padding: 8px 12px; border-left: 4px solid #e0b84a; background: #fff8e6; border-radius: 4px; }
.ukoly .ukol-nesoulad a { color: var(--chyba, #b42318); font-weight: 600; }
.dlazdice { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 12px; }
.dlazdice a, .dlazdice div {
  display: block; padding: 18px; border-radius: var(--polomer); border: 1px solid var(--linka);
  background: var(--karta); color: var(--text); text-decoration: none;
}
.dlazdice a { border-color: var(--kraft); }
.dlazdice a:hover { background: var(--kraft-svetla); }
.dlazdice strong { display: block; font-size: 17px; margin-bottom: 4px; }
.dlazdice span { color: var(--text-2); font-size: 13px; }
.dlazdice div { opacity: .55; }

.radek-nadpis { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.radek-nadpis h1 { margin: 0; }
.radek-nadpis .tlacitko { margin-left: auto; text-decoration: none; }
.filtr { display: flex; gap: 16px; align-items: center; margin-bottom: 12px; flex-wrap: wrap; }
.filtr input[type=search] {
  flex: 1; min-width: 220px; font: inherit; border: 1px solid #cfc5ba; border-radius: 6px; padding: 9px 10px; background: #fff;
}
.filtr label { display: flex; gap: 6px; align-items: center; color: var(--text-2); }
.tabulka-obal { overflow-x: auto; }
.tabulka { width: 100%; border-collapse: collapse; background: var(--karta); border: 1px solid var(--linka); border-radius: var(--polomer); }
.tabulka th, .tabulka td { text-align: left; padding: 8px 10px; border-bottom: 1px solid var(--linka); vertical-align: top; }
.tabulka th { font-size: 13px; color: var(--text-2); font-weight: 600; background: var(--kraft-svetla); }
.tabulka tbody tr { cursor: pointer; }
.tabulka tbody tr:hover { background: var(--kraft-svetla); }
.tabulka td.cislo { white-space: nowrap; font-weight: 600; }
.tabulka td small { color: var(--text-2); }
.tabulka td.ceny { white-space: nowrap; font-variant-numeric: tabular-nums; }
.obsah:has(#seznam:not([hidden])) { max-width: 1200px; }

/* zákazníci */
.tlacitko.druhe { background: #fff; color: var(--kraft); border: 1px solid var(--kraft); }
.radek-nadpis .tlacitko + .tlacitko { margin-left: 0; }
.radek-nadpis { flex-wrap: wrap; }
.filtr input.rozmer { flex: 0 1 280px; min-width: 200px; }
.drobecky { margin: 0 0 8px; }
.drobecky a { color: var(--kraft); }
h2 { font-size: 17px; font-weight: 600; margin: 24px 0 8px; }
h2 small { font-weight: 400; color: var(--text-2); font-size: 13px; }
.udaje { display: grid; grid-template-columns: max-content 1fr; gap: 4px 16px; margin: 0 0 16px; padding: 14px 16px;
  background: var(--karta); border: 1px solid var(--linka); border-radius: var(--polomer); }
.udaje dt { color: var(--text-2); }
.udaje dd { margin: 0; }
.hlaska-kontrola { margin: 0 0 12px; padding: 8px 10px; border-radius: 6px; background: #fff3c4; color: #8a5d00; }
.stitek { display: inline-block; font-size: 11px; padding: 1px 6px; border-radius: 10px; background: #fff3c4; color: #8a5d00; white-space: nowrap; }
.tabulka tr.neaktivni td { color: var(--text-2); }
.volba { display: flex; gap: 6px; align-items: center; color: var(--text-2); margin-top: 8px; }
.napoveda { color: var(--text-2); font-size: 13px; margin: 0; }
.obsah:has(#zakaznici:not([hidden])), .obsah:has(#zakaznik:not([hidden])), .obsah:has(#karta:not([hidden])) { max-width: 1200px; }

/* karta zákazníka */
.karta-formular fieldset {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px 16px;
  border: 1px solid var(--linka); border-radius: var(--polomer); background: var(--karta); padding: 16px; margin: 0 0 16px;
}
.karta-formular legend { font-weight: 600; padding: 0 6px; }
.karta-formular label { display: flex; flex-direction: column; gap: 4px; font-weight: 500; font-size: 14px; }
.karta-formular label small { font-weight: 400; color: var(--text-2); }
.karta-formular .siroke { grid-column: 1 / -1; }
.karta-formular .zaskrtavatko { flex-direction: row; align-items: center; gap: 8px; align-self: end; padding-bottom: 8px; }
.karta-formular input:not([type=checkbox]), .karta-formular select, .karta-formular textarea {
  font: inherit; font-weight: 400; color: inherit; background: #fff; border: 1px solid #cfc5ba; border-radius: 6px; padding: 8px 9px; width: 100%;
}
.karta-formular textarea { resize: vertical; }
.karta-formular :is(input, select, textarea):focus { outline: 2px solid var(--kraft); outline-offset: 0; border-color: var(--kraft); }
.karta-formular > .chyba { margin-bottom: 16px; }
.seznam-radku { display: flex; flex-direction: column; gap: 8px; }
.seznam-radku .radek { display: flex; gap: 8px; align-items: center; }
.seznam-radku .radek input { flex: 1; min-width: 0; font: inherit; border: 1px solid #cfc5ba; border-radius: 6px; padding: 7px 8px; }
.seznam-radku .radek button { font-size: 20px; text-decoration: none; padding: 0 6px; }
.karta-formular fieldset > .odkaz { justify-self: start; }
.tlacitka-dole { display: flex; gap: 12px; position: sticky; bottom: 0; padding: 12px 0; background: var(--pozadi); }
.tlacitka-dole .tlacitko { text-decoration: none; }
@media (max-width: 700px) { .seznam-radku .radek { flex-wrap: wrap; } .seznam-radku .radek input { flex: 1 1 40%; } }

/* historie faktur */
.tabulka.historie tbody tr { cursor: default; }
.tabulka td.vpravo { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.tabulka.historie td { font-size: 14px; }

/* místa vykládky */
.seznam-radku .radek.adresa { align-items: flex-start; padding: 10px; border: 1px solid var(--linka); border-radius: 6px; background: var(--pozadi); }
.pole-adresy { flex: 1; display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 8px 12px; }
.pole-adresy label { font-size: 13px; }
.pole-adresy input:not([type=checkbox]) { width: 100%; }
.pole-adresy .zaskrtavatko { flex-direction: row; align-items: center; gap: 6px; align-self: end; padding-bottom: 8px; }
.seznam-radku .radek.adresa input { flex: none; }
.pole-adresy input[type=checkbox] { width: auto; }

.tabulka.historie tr.souhrn { cursor: pointer; }
.tabulka.historie tr.souhrn.otevreny { background: var(--kraft-svetla); font-weight: 600; }
.tabulka.historie tr.dodavka td { font-size: 13px; color: var(--text-2); background: #fdfbf8; padding-top: 4px; padding-bottom: 4px; }
.tabulka.historie tr.dodavka td:first-child { padding-left: 28px; }

/* artikly */
.tabulka td.chybi { color: #8a5d00; }
.tabulka tr.detail { cursor: default; }
.tabulka tr.detail:hover { background: none; }
.tabulka tr.detail > td { background: #fdfbf8; padding: 12px 14px; }
.artikl-detail .udaje { margin-bottom: 10px; }
.artikl-uprava { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 8px 12px; }
.artikl-uprava label { display: flex; flex-direction: column; gap: 3px; font-size: 13px; font-weight: 500; }
.artikl-uprava .siroke { grid-column: 1 / -1; }
.artikl-uprava input { font: inherit; border: 1px solid #cfc5ba; border-radius: 6px; padding: 7px 8px; background: #fff; }
#tForm input { flex: 0 1 280px; font: inherit; border: 1px solid #cfc5ba; border-radius: 6px; padding: 9px 10px; background: #fff; }

.dva-sloupce { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
@media (max-width: 800px) { .dva-sloupce { grid-template-columns: 1fr; } }
.obsah:has(#vyhodnoceni:not([hidden])), .obsah:has(#zakazky:not([hidden])), .obsah:has(#uzivatele:not([hidden])) { max-width: 1300px; }
.filtr input[type=month] { font: inherit; border: 1px solid #cfc5ba; border-radius: 6px; padding: 7px 8px; background: #fff; }

/* IČO + tlačítko ARES (karta zákazníka) */
.ico-radek { display: flex; gap: 6px; align-items: center; }
.ico-radek input { flex: 1; min-width: 0; }
.tlacitko.male { padding: 6px 10px; font-size: 13px; white-space: nowrap; }

/* seznam kalkulací ve složkách zákazníků */
#tabulka tr.slozka { cursor: pointer; background: #faf7f3; }
#tabulka tr.slozka:hover, #tabulka tr.slozka.otevreny { background: var(--kraft-svetla); }
#tabulka tr.slozka small { color: var(--text-2, #6b625a); font-weight: 400; }
#tabulka tr.vslozce td:first-child { padding-left: 34px; }
.kalk-seznam .odkaz-upravit { margin-left: auto; font-size: 13px; padding-left: 8px; }
.kalk-seznam .posun { border: 1px solid var(--linka, #ddd); background: #fff; border-radius: 4px; padding: 0 5px; font-size: 12px; line-height: 18px; cursor: pointer; color: var(--text-2, #666); flex: none; }
.kalk-seznam .posun:hover { border-color: var(--kraft, #8b5a2b); color: var(--kraft, #8b5a2b); }
.kalk-seznam .uchyt { cursor: grab; color: var(--text-2, #888); letter-spacing: -2px; padding-right: 4px; flex: none; user-select: none; }
.kalk-seznam > label { cursor: grab; touch-action: none; }
.kalk-seznam > label.zvednuty { cursor: grabbing; background: #fff; border-radius: 6px; box-shadow: 0 6px 18px rgba(0,0,0,.18); }
.kalk-seznam .kalk-mezera { border: 2px dashed var(--kraft, #8b5a2b); border-radius: 6px; background: var(--kraft-svetla, #f3ebe1); box-sizing: border-box; }
.objednavka-volba { display: flex; flex-direction: column; gap: 4px; }
.objednavka-volba > span { font-weight: 600; font-size: 14px; }
.objednavka-volba .radek-volby { display: flex; flex-direction: row; align-items: center; gap: 6px; font-weight: 400; }
.objednavka-volba .radek-volby input { width: auto; margin: 0; flex: none; }
.objednavka-volba .radek-volby small { color: var(--text-2, #6b625a); }
.objednavka-volba input[readonly] { background: #f3efe9; font-weight: 600; }

/* PPWR jako ve Finderu: vlevo složky zákazníků, vpravo jejich dokumenty (Jan, 25. 10. 2026) */
.ppwr { display: grid; grid-template-columns: 320px 1fr; background: var(--karta); border: 1px solid var(--linka); border-radius: var(--polomer); overflow: hidden; min-height: 520px; }
.ppwr-slozky { border-right: 1px solid var(--linka); background: #faf7f3; max-height: calc(100vh - 260px); overflow: auto; padding: 6px; }
.ppwr-slozky button { all: unset; box-sizing: border-box; width: 100%; display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 8px; cursor: pointer; font-size: 14px; }
.ppwr-slozky button:hover { background: #f1e8dc; }
.ppwr-slozky button.vybrano { background: var(--kraft, #8a5d2b); color: #fff; }
.ppwr-slozky button .jmeno { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ppwr-slozky button .jmeno b { font-weight: 600; margin-right: 6px; font-variant-numeric: tabular-nums; opacity: .7; }
.ppwr-slozky button .pocet { font-size: 12px; background: rgba(0,0,0,.07); border-radius: 10px; padding: 1px 8px; }
.ppwr-slozky button.vybrano .pocet { background: rgba(255,255,255,.25); }
.ppwr-obsah { padding: 20px 24px; overflow: auto; }
.ppwr-obsah h2 { margin: 0 0 4px; font-size: 20px; }
.ppwr-obsah .pod { color: var(--text-2); margin: 0 0 16px; font-size: 14px; }
.ppwr-akce { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-bottom: 20px; }
.ppwr-akce a { text-decoration: none; }
.ppwr-dlazdice { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 12px; }
.ppwr-dlazdice a, .ppwr-dlazdice div { display: flex; gap: 12px; align-items: flex-start; padding: 12px; border: 1px solid var(--linka); border-radius: 10px; text-decoration: none; color: var(--text); background: #fff; }
.ppwr-dlazdice a:hover { border-color: var(--kraft, #8a5d2b); box-shadow: 0 2px 8px rgba(0,0,0,.06); }
.ppwr-dlazdice .chybi { opacity: .6; border-style: dashed; }
.ppwr-dlazdice strong { display: block; font-variant-numeric: tabular-nums; }
.ppwr-dlazdice span.r { display: block; font-size: 14px; }
.ppwr-dlazdice small { display: block; color: var(--text-2); font-size: 12px; margin-top: 2px; }
.ppwr-prazdne { color: var(--text-2); padding: 40px 0; text-align: center; }
.ppwr-akce .skupina-tl { display: inline-flex; }
.ppwr-akce .skupina-tl .tlacitko:first-child { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.ppwr-akce .skupina-tl .stahnout { border-top-left-radius: 0; border-bottom-left-radius: 0; padding-left: 12px; padding-right: 12px; display: inline-flex; align-items: center; border-left: 1px solid rgba(255,255,255,.35); }
.ppwr-akce .skupina-tl .stahnout.druhe { border-left: none; }
.ppwr-dlazdice .dlazdice-obal { position: relative; display: block; padding: 0; border: none; background: none; }
.ppwr-dlazdice .dlazdice-obal > a:first-child { padding-right: 44px; height: 100%; box-sizing: border-box; }
.ppwr-dlazdice .stahnout-mini { position: absolute; top: 8px; right: 8px; width: 30px; height: 30px; padding: 0; border: 1px solid var(--linka); border-radius: 8px; display: flex; align-items: center; justify-content: center; color: var(--kraft, #8a5d2b); background: #fff; }
.ppwr-dlazdice .stahnout-mini:hover { background: var(--kraft, #8a5d2b); color: #fff; border-color: var(--kraft, #8a5d2b); box-shadow: none; }
@media (max-width: 800px) { .ppwr { grid-template-columns: 1fr; } .ppwr-slozky { max-height: 240px; border-right: none; border-bottom: 1px solid var(--linka); } }

td.radky, small.radky { white-space: pre-line; }
.tabulka-obal.zvyraznit { outline: 3px solid #e0b84a; outline-offset: 2px; border-radius: 6px; }
