/* Datový portál obce Nebovidy – styly
 *
 * Písmo a rozměry přebírají styl webu obce, aby portál působil jako jeho
 * součást. Zdroj: https://www.nebovidyubrna.cz/style.php?nid=2486
 * (redakční systém Antee IPO). U každé hodnoty je uvedený řádek ve zdroji.
 *
 * Tři odchylky od webu obce, všechny záměrné:
 *  – Akcentní barva je modrá #1C378C podle zadání obce, ne červená #D5271A
 *    z redakčního systému.
 *  – Základní velikost písma je 16 px, ne 12 px. Portál je plný tabulek
 *    a čísel a 12 px je na čtení málo; proporce nadpisů (1,6 / 1,35 / 1,2 em)
 *    i písmo jsou zachované.
 *  – Grafy mají vlastní paletu, aby se žádná datová řada nepletla s barvou
 *    značky.
 */

:root {
  /* --- přebráno ze stylu obce --- */
  --akcent: #1c378c;          /* RGB 28, 55, 140 – zadáno obcí */
  --akcent-tmava: #142766;    /* dopočtený tmavší odstín pro hover */
  --akcent-svetla: #eaeef8;   /* dopočtený světlý podklad */
  --akcent-linka: #c8d0e6;    /* dopočtená linka v akcentní barvě */
  --hlavicka-tabulky: #ddd;   /* .text th, ř. 701 */
  --blok: #eee;               /* .matrix li > div, ř. 1262 */
  --blok-svetly: #f3f3f3;     /* .article--sticky, ř. 1324 */
  --stin: 1px 1px 12px -5px #888888;   /* ř. 2355 */
  --radius: 6px;              /* boxy, ř. 1606 */
  --radius-tlacitko: 4px;     /* tlačítka, ř. 793 */
  --sirka: 1024px;            /* #ipocontainer, ř. 248 */
  --pismo: "Trebuchet MS", Helvetica, sans-serif;   /* html, body, ř. 11 */

  /* --- doplňkové barvy portálu --- */
  --text: #1b1b1b;
  --text-tiche: #666666;
  --pozadi: #f7f7f7;
  --karta: #ffffff;
  --linka: #dddddd;

  /* --- paleta grafů ---
   * Modrá je světlejší než akcent, aby se datová řada nepletla se značkou.
   * Akcent je modrý, takže červená může znamenat čistě zápornou hodnotu. */
  --graf-modra: #3f7ca8;
  --graf-zelena: #3f7d6a;
  --graf-zluta: #c9a227;
  --graf-fialova: #6b5b95;
  --graf-seda: #9aa5a0;
  --zaporne: #b03a2e;
  --kladne: #2f7d5a;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; scroll-padding-top: 5rem; }

body {
  margin: 0;
  font-family: var(--pismo);
  font-size: 16px;
  line-height: 1.6;
  color: var(--text);
  background: var(--pozadi);
  -webkit-font-smoothing: antialiased;
}

.obal { width: 100%; max-width: var(--sirka); margin: 0 auto; padding: 0 1.25rem; }
.uzky { max-width: 860px; }

a { color: var(--akcent); text-decoration-thickness: 1px; text-underline-offset: 2px; }
a:hover { color: var(--akcent-tmava); }

/* proporce nadpisů podle webu obce, ř. 651–667 */
h1, h2, h3, h4 { line-height: 1.3; margin: 0 0 .5rem; font-family: var(--pismo); }
h1 { font-size: 1.6em; font-weight: normal; }
h2 { font-size: 1.35em; font-weight: bold; }
h3 { font-size: 1.2em; font-weight: bold; }

p { margin: 0 0 .75rem; }

code, pre, .kod {
  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
  font-size: .875em;
}
code { background: var(--blok); padding: .1em .35em; border-radius: 4px; }
pre.kod {
  background: #1b2333; color: #e4e9f2; padding: 1rem 1.1rem;
  border-radius: var(--radius); overflow-x: auto; line-height: 1.7;
}
pre.kod code { background: none; padding: 0; color: inherit; }

.skryty {
  position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap;
}
.preskocit {
  position: absolute; left: -999px; top: 0; background: var(--akcent); color: #fff;
  padding: .6rem 1rem; z-index: 100;
}
.preskocit:focus { left: 0; }

.tiche { color: var(--text-tiche); font-size: .9rem; }

/* ------------------------------------------------------------- hlavička */
.hlavicka {
  background: var(--karta); border-bottom: 1px solid var(--linka);
  position: sticky; top: 0; z-index: 50;
}
.hlavicka-obsah {
  display: flex; align-items: center; justify-content: space-between;
  gap: 1rem; min-height: 4.25rem; flex-wrap: wrap;
}
.znacka { display: flex; align-items: center; gap: .7rem; text-decoration: none; color: var(--text); }
.znacka strong { display: block; font-size: 1rem; }
.znacka small { display: block; color: var(--text-tiche); font-size: .78rem; }
/* Znak obce je na výšku (111 × 139 px). Vážeme výšku a šířku necháme
   dopočítat z poměru stran, aby se nedeformoval, kdyby obec dodala jiný
   soubor. `max-width` je pojistka pro širší variantu. */
.znacka-logo {
  height: 3rem; width: auto; max-width: 6rem;
  flex: 0 0 auto; display: block;
}
@media (max-width: 480px) {
  .znacka-logo { height: 2.4rem; max-width: 4rem; }
}
.hlavni-nav { display: flex; gap: .35rem; flex-wrap: wrap; }
.hlavni-nav a {
  padding: .45rem .8rem; border-radius: 6px; text-decoration: none;
  color: var(--text); font-size: .93rem; font-weight: 500;
}
.hlavni-nav a:hover { background: var(--akcent-svetla); color: var(--akcent-tmava); }
.hlavni-nav .odkaz-obec { color: var(--akcent); }

/* ----------------------------------------------------------------- hero */
.hero {
  background: linear-gradient(160deg, var(--akcent) 0%, var(--akcent-tmava) 100%);
  color: #fff; padding: 3rem 0 2.5rem;
}
.hero h1 { font-size: clamp(1.75rem, 4vw, 2.5rem); max-width: 24ch; }
.hero-podnadpis { max-width: 62ch; font-size: 1.05rem; color: rgba(255,255,255,.9); }
.rychle-odkazy { display: flex; gap: .5rem; flex-wrap: wrap; margin-top: 1.5rem; }
.rychle-odkazy a {
  background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.28);
  color: #fff; text-decoration: none; padding: .45rem .9rem; border-radius: 100px;
  font-size: .92rem;
}
.rychle-odkazy a:hover { background: rgba(255,255,255,.26); color: #fff; }

/* ---------------------------------------------------------------- sekce */
.sekce { padding: 2.5rem 1.25rem; }
.sekce + .sekce { border-top: 1px solid var(--linka); }
.sekce-hlava { max-width: 68ch; margin-bottom: 1.5rem; }
.sekce-hlava p { color: var(--text-tiche); }

.karta {
  background: var(--karta); border: 1px solid var(--linka);
  border-radius: var(--radius); padding: 1.25rem; box-shadow: var(--stin);
  margin-bottom: 1.25rem;
}
.karta > h3:first-child, .karta > h2:first-child { margin-top: 0; }

/* ------------------------------------------------------------- dlaždice */
.dlazdice {
  display: grid; gap: .9rem; margin-bottom: 1.5rem;
  grid-template-columns: repeat(auto-fit, minmax(215px, 1fr));
}
.dlazdice.male { grid-template-columns: repeat(auto-fit, minmax(165px, 1fr)); }
.dlazdice-nacitani { color: var(--text-tiche); grid-column: 1 / -1; }

.dl {
  background: var(--karta); border: 1px solid var(--linka); border-radius: var(--radius);
  padding: 1rem 1.1rem; box-shadow: var(--stin); border-top: 3px solid var(--akcent);
}
.dl-nadpis {
  font-size: .78rem; text-transform: uppercase; letter-spacing: .05em;
  color: var(--text-tiche); font-weight: 600; margin-bottom: .3rem;
}
.dl-hodnota { font-size: 1.75rem; font-weight: 650; line-height: 1.15; }
.dl-hodnota small { font-size: .55em; font-weight: 500; color: var(--text-tiche); }
.dl-popis { font-size: .84rem; color: var(--text-tiche); margin-top: .25rem; }
.dl.modra { border-top-color: var(--graf-modra); }
.dl.hneda { border-top-color: var(--graf-zluta); }
.dl.cervena { border-top-color: var(--zaporne); }
.zmena-plus { color: var(--kladne); font-weight: bold; }
.zmena-minus { color: var(--zaporne); font-weight: bold; }

/* ---------------------------------------------------------------- grafy */
.grafy-mrizka {
  display: grid; gap: 1.25rem; margin-bottom: 1.25rem;
  grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
}
.grafy-mrizka figure { margin: 0; }
.grafy-mrizka figcaption { margin-bottom: .75rem; }
.grafy-mrizka figcaption p { margin: 0; }
.karta.sirsi { grid-column: 1 / -1; }
.graf-obal { position: relative; height: 300px; }
.graf-obal.vysoky { height: 380px; }

/* -------------------------------------------------------------- tabulky */
.tabulka-obal { overflow-x: auto; }
.datova-tabulka { width: 100%; border-collapse: collapse; font-size: .93rem; }
.datova-tabulka th, .datova-tabulka td {
  text-align: left; padding: .55rem .6rem; border-bottom: 1px solid var(--linka);
  vertical-align: top;
}
.datova-tabulka thead th {
  background: var(--hlavicka-tabulky); color: #000;   /* .text th, ř. 701 */
  font-size: .8rem; text-transform: uppercase; letter-spacing: .03em;
  border-bottom: 2px solid #c9c9c9; position: sticky; top: 0;
}
.datova-tabulka .cislo { text-align: right; font-variant-numeric: tabular-nums; }
.datova-tabulka tbody tr:hover { background: #fafbfa; }
.datova-tabulka tfoot td { font-weight: 650; border-top: 2px solid var(--linka); }
.datova-tabulka .radek-soucet { background: var(--akcent-svetla); font-weight: 650; }
.stitek {
  display: inline-block; font-size: .74rem; padding: .1rem .45rem; border-radius: 100px;
  background: var(--blok); color: var(--text-tiche); white-space: nowrap;
}
.stitek.hlavni { background: var(--akcent-svetla); color: var(--akcent-tmava); }
.stitek.hneda { background: #fdf6e3; color: var(--graf-zluta); }

/* Názvy volebních stran bývají dlouhé („NEBOVIDY NEZÁVISLÍ“), takže se
   na rozdíl od ostatních štítků musí umět zalomit a nesmí přetékat. */
.stitek.strana {
  white-space: normal;
  overflow-wrap: break-word;
  hyphens: auto;
  text-align: center;
  max-width: 9.5rem;
  line-height: 1.3;
  padding: .2rem .55rem;
  flex: 0 1 auto;
  align-self: flex-start;
}

/* -------------------------------------------------------------- zasedání */
.filtry {
  display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; margin-bottom: 1rem;
}
.filtry label { font-size: .88rem; font-weight: 600; color: var(--text-tiche); }
.filtry select {
  font: inherit; font-size: .92rem; padding: .35rem .6rem;
  border: 1px solid var(--linka); border-radius: 6px; background: var(--karta);
}

.seznam-zasedani { display: grid; gap: .55rem; }

/* --- dvouúrovňové rozbalování: volební období > rok > zasedání --- */
.obdobi {
  background: var(--karta); border: 1px solid var(--linka);
  border-radius: var(--radius); box-shadow: var(--stin); margin-bottom: .75rem;
  overflow: hidden;
}
.obdobi > summary,
.rok > summary {
  cursor: pointer; list-style: none; display: flex; align-items: center; gap: .75rem;
}
.obdobi > summary::-webkit-details-marker,
.rok > summary::-webkit-details-marker { display: none; }
.obdobi > summary::before,
.rok > summary::before {
  content: "▸"; color: var(--text-tiche); flex: 0 0 auto;
  transition: transform .15s; font-size: .9em;
}
.obdobi[open] > summary::before,
.rok[open] > summary::before { transform: rotate(90deg); }
.obdobi > summary:focus-visible,
.rok > summary:focus-visible { outline: 2px solid var(--akcent); outline-offset: -2px; }

.obdobi > summary {
  padding: .85rem 1.1rem; background: var(--akcent-svetla);
  border-bottom: 1px solid transparent;
}
.obdobi[open] > summary { border-bottom-color: var(--akcent-linka); }
.obdobi > summary:hover { background: #dde4f4; }
.obdobi-nazev { font-weight: 650; color: var(--akcent-tmava); }

.obdobi-telo { padding: .6rem .75rem .75rem; }

.rok { border-top: 1px solid var(--linka); }
.rok:first-child { border-top: none; }
.rok > summary { padding: .6rem .4rem; font-weight: 600; }
.rok > summary:hover { color: var(--akcent-tmava); }
.rok-nazev { font-variant-numeric: tabular-nums; }
.rok > .seznam-zasedani { padding: .2rem 0 .8rem 1.5rem; }

.pocet-znak {
  margin-left: auto; font-size: .8rem; font-weight: 500; color: var(--text-tiche);
  background: var(--karta); border: 1px solid var(--linka);
  padding: .1rem .5rem; border-radius: 100px; white-space: nowrap;
}
.obdobi > summary .pocet-znak { background: rgba(255, 255, 255, .7); }

.tlacitko-mini {
  font: inherit; font-size: .85rem; font-weight: 600; cursor: pointer;
  background: var(--karta); color: var(--akcent-tmava);
  border: 1px solid var(--linka); border-radius: 6px; padding: .3rem .7rem;
}
.tlacitko-mini:hover { border-color: var(--akcent); background: var(--akcent-svetla); }
.zasedani {
  display: flex; align-items: center; gap: 1rem; background: var(--karta);
  border: 1px solid var(--linka); border-radius: var(--radius);
  padding: .7rem 1rem; text-decoration: none; color: var(--text);
  transition: border-color .12s, transform .12s;
}
.zasedani:hover { border-color: var(--akcent); transform: translateX(2px); color: var(--text); }
.zasedani-cislo {
  flex: 0 0 3rem; height: 3rem; border-radius: 8px; background: var(--akcent-svetla);
  color: var(--akcent-tmava); display: grid; place-items: center;
  font-weight: 700; font-size: 1.05rem;
}
.zasedani-telo { flex: 1 1 auto; min-width: 0; }
.zasedani-titulek { font-weight: 600; font-size: .97rem; }
.zasedani-meta { font-size: .84rem; color: var(--text-tiche); }
.zasedani-pdf { flex: 0 0 auto; color: var(--graf-modra); font-size: .88rem; font-weight: 600; }

.clenove { display: grid; gap: .4rem; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.clen {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: .6rem; padding: .4rem 0; border-bottom: 1px dashed var(--linka);
  font-size: .93rem;
}
.clen > span:first-child { min-width: 0; }   /* jméno se smí zkrátit, ne rozšířit box */
.clen-funkce { color: var(--text-tiche); font-size: .85rem; }

/* -------------------------------------------------------------- rozpočet */
.rozpocet-souhrn {
  display: grid; gap: .9rem; margin-bottom: 1.5rem;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}
.pruh-obal { background: var(--blok); border-radius: 100px; height: .5rem; overflow: hidden; margin-top: .4rem; }
.pruh { height: 100%; background: var(--akcent); border-radius: 100px; }

.dok-seznam { display: grid; gap: .35rem; }
.dok {
  display: flex; justify-content: space-between; gap: .75rem; align-items: baseline;
  padding: .45rem .1rem; border-bottom: 1px solid var(--linka); font-size: .93rem;
}
.dok a { font-weight: 500; }

/* --- stránkování --- */
.strankovani {
  display: flex; align-items: center; justify-content: space-between;
  gap: .75rem; flex-wrap: wrap; margin-top: .9rem;
  padding-top: .75rem; border-top: 1px solid var(--linka);
}
.strankovani-info { font-variant-numeric: tabular-nums; }
.strankovani-tlacitka { display: flex; gap: .25rem; flex-wrap: wrap; }
.stranka-tlacitko {
  font: inherit; font-size: .88rem; font-variant-numeric: tabular-nums;
  min-width: 2rem; padding: .3rem .55rem; cursor: pointer;
  background: var(--karta); color: var(--text);
  border: 1px solid var(--linka); border-radius: 6px;
}
.stranka-tlacitko:hover:not(:disabled) {
  border-color: var(--akcent); background: var(--akcent-svetla); color: var(--akcent-tmava);
}
.stranka-tlacitko.aktivni {
  background: var(--akcent); border-color: var(--akcent); color: #fff; font-weight: 650;
}
.stranka-tlacitko:disabled { opacity: .4; cursor: default; }
.stranka-tlacitko:focus-visible { outline: 2px solid var(--akcent); outline-offset: 1px; }
.strankovani-vypustka { color: var(--text-tiche); padding: .3rem .15rem; }

/* ---------------------------------------------------------------- počasí */
.pocasi-mrizka {
  display: grid; gap: 1.25rem; grid-template-columns: minmax(260px, 340px) 1fr;
  margin-bottom: 1.25rem;
}
@media (max-width: 800px) { .pocasi-mrizka { grid-template-columns: 1fr; } }
.pocasi-nyni { background: linear-gradient(160deg, var(--graf-modra), #23506e); color: #fff; border: none; }
.pocasi-teplota { font-size: 3.5rem; font-weight: 650; line-height: 1; }
.pocasi-popis { font-size: 1.05rem; opacity: .95; }
.pocasi-detaily { display: grid; grid-template-columns: 1fr 1fr; gap: .3rem 1rem; margin-top: 1rem; font-size: .9rem; }
.pocasi-detaily span { opacity: .8; }
.pocasi-detaily b { font-weight: 600; }

.dny-pas { display: grid; gap: .5rem; grid-template-columns: repeat(auto-fit, minmax(88px, 1fr)); }
.den {
  text-align: center; padding: .6rem .3rem; border-radius: 8px;
  background: #fafbfa; border: 1px solid var(--linka); font-size: .85rem;
}
.den.dnes { border-color: var(--graf-modra); background: #eef4f9; }
.den.historie { opacity: .65; }
.den-nazev { font-weight: 650; font-size: .8rem; }
.den-teploty { margin: .25rem 0; }
.den-max { font-weight: 650; }
.den-min { color: var(--text-tiche); }
.den-srazky { font-size: .78rem; color: var(--graf-modra); }

/* -------------------------------------------------------------- API panel */
.api-panel {
  background: #fbfcfb; border: 1px dashed #c4d0c8; border-radius: var(--radius);
  margin-top: 1.5rem;
}
.api-panel summary {
  cursor: pointer; padding: .8rem 1.1rem; font-weight: 600; font-size: .95rem;
  display: flex; align-items: center; gap: .6rem; list-style: none;
}
.api-panel summary::-webkit-details-marker { display: none; }
.api-panel summary::after { content: "▾"; margin-left: auto; color: var(--text-tiche); }
.api-panel[open] summary::after { content: "▴"; }
.api-panel summary:hover { color: var(--akcent-tmava); }
.api-znak {
  background: var(--akcent); color: #fff; font-size: .68rem; font-weight: 700;
  padding: .15rem .4rem; border-radius: 4px; letter-spacing: .05em;
}
.api-telo { padding: 0 1.1rem 1.1rem; }
.api-tabulka { width: 100%; border-collapse: collapse; font-size: .88rem; }
.api-tabulka th {
  text-align: left; font-size: .75rem; text-transform: uppercase; letter-spacing: .04em;
  color: var(--text-tiche); border-bottom: 1px solid var(--linka); padding: .35rem .4rem;
}
.api-tabulka td { padding: .4rem; border-bottom: 1px solid var(--linka); vertical-align: top; }
.api-tabulka code { font-size: .82rem; white-space: nowrap; }
.api-akce { white-space: nowrap; text-align: right; }
.api-akce a {
  display: inline-block; margin-left: .3rem; font-size: .78rem; font-weight: 600;
  padding: .12rem .45rem; border: 1px solid var(--linka); border-radius: 4px;
  text-decoration: none; background: var(--karta);
}
.api-akce a:hover { border-color: var(--akcent); background: var(--akcent-svetla); }
.api-odkazy { margin-top: .8rem; display: flex; gap: 1.25rem; flex-wrap: wrap; font-size: .9rem; }

.tag-seznam { padding-left: 1.1rem; }
.tag-seznam li { margin-bottom: .4rem; font-size: .93rem; color: var(--text-tiche); }
.tag-seznam strong { color: var(--text); }

.odrazky { padding-left: 1.1rem; }
.odrazky li { margin-bottom: .6rem; }

.dvojice { display: grid; grid-template-columns: minmax(160px, 30%) 1fr; gap: .35rem 1rem; margin: 0; font-size: .93rem; }
.dvojice dt { font-weight: 600; color: var(--text-tiche); }
.dvojice dd { margin: 0; }

/* -------------------------------------------------------------- tlačítka */
.tlacitka { display: flex; gap: .6rem; flex-wrap: wrap; margin-top: 1rem; }
.tlacitko {
  display: inline-block; background: var(--akcent); color: #fff; text-decoration: none;
  padding: .6rem 1.15rem; border-radius: var(--radius-tlacitko);
  font-weight: bold; font-size: .95rem; border: 1px solid #fff;
}
.tlacitko:hover { background: var(--akcent-tmava); color: #fff; }
.tlacitko.druhotne { background: var(--karta); color: var(--akcent-tmava); border: 1px solid var(--linka); }
.tlacitko.druhotne:hover { border-color: var(--akcent); background: var(--akcent-svetla); }
.vyzva { background: var(--akcent-svetla); border-color: var(--akcent-linka); }
.vyzva h2 { margin-top: 0; }

.nacitani { color: var(--text-tiche); font-style: italic; }
.chyba-bloku {
  background: #fdf3f1; border: 1px solid #f0d5cf; color: #7d2f22;
  padding: .8rem 1rem; border-radius: var(--radius); font-size: .92rem;
}

/* ---------------------------------------------------------------- patička */
.paticka { background: #172a4a; color: #c6cfe2; margin-top: 2rem; padding: 2.5rem 0 1.5rem; }
.paticka a { color: #a8c0e8; }
.paticka-obsah { display: grid; gap: 1.5rem; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); font-size: .9rem; }
.paticka strong { color: #fff; display: block; margin-bottom: .4rem; }
.paticka .tiche { color: #9fadc8; }
.paticka-spodek { border-top: 1px solid #2c4067; margin-top: 1.75rem; padding-top: 1rem; font-size: .84rem; }

/* -------------------------------------------------------------- swagger */
.swagger-ui .topbar { display: none; }
.swagger-ui { font-family: inherit; }
.swagger-ui .info { margin: 1rem 0 2rem; }

@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; animation: none !important; }
  html { scroll-behavior: auto; }
}

@media print {
  .hlavicka, .paticka, .api-panel, .rychle-odkazy, .filtry { display: none; }
  .karta { break-inside: avoid; box-shadow: none; }
}
