/* Prevádzky v Senici — štýly navyše k assets/podstranka.css.
   Stránka je analýza dát: potrebuje stĺpcové grafy, schematickú mapu,
   filtre a dlhý zoznam — nič z toho profil ani program nemajú, preto
   samostatný súbor a nie ďalších dvesto riadkov v spoločnej šablóne.
   Paleta ostáva jedna: oranžový akcent, čierna, tóny papiera. */

/* ---- hlavička bez fotografie ----
   Namiesto portrétu nesie hlavička štyri čísla, z ktorých stránka vychádza. */
.hlavicka--cisla { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: clamp(32px, 5vw, 96px); align-items: end; }
.hlavicka--cisla .cisla-uvod { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(18px, 2vw, 32px); }
.hlavicka--cisla .cisla-uvod div { border-top: 2px solid var(--ink); padding-top: 14px; }
.hlavicka--cisla .cisla-uvod .hodnota { font-size: clamp(34px, 3.4vw, 60px); font-weight: 700; line-height: 1; letter-spacing: -.026em; }
.hlavicka--cisla .cisla-uvod .popis { margin-top: 10px; font-size: clamp(15.5px, 1.05vw, 17.5px); line-height: 1.5; color: var(--body-soft); }
@media (max-width: 900px) {
  .hlavicka--cisla { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 520px) {
  .hlavicka--cisla .cisla-uvod { grid-template-columns: 1fr; }
}

/* ---- jeden stĺpec na celú šírku: podiel kategórií ---- */
.podiel { margin-top: 40px; }
.podiel-pas { display: flex; height: 44px; border-radius: 12px; overflow: hidden; }
.podiel-pas span { display: block; height: 100%; min-width: 2px; }
.podiel-legenda { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr)); gap: 10px 22px; margin-top: 22px; list-style: none; padding: 0; }
.podiel-legenda li { display: grid; grid-template-columns: 14px 1fr auto; gap: 12px; align-items: baseline; font-size: clamp(15.5px, 1.05vw, 17.5px); line-height: 1.45; color: var(--body-soft); }
.podiel-legenda i { display: block; width: 14px; height: 14px; border-radius: 4px; align-self: center; }
.podiel-legenda b { font-weight: 700; color: var(--ink); font-variant-numeric: tabular-nums; white-space: nowrap; }
.podiel-legenda small { color: var(--muted); font-size: .9em; }

/* Farby kategórií — jediné miesto, kde má stránka viac než jednu farbu.
   Sú to tóny akcentu, čiernej a papiera, nie dúha; vedľa seba sa líšia,
   v legende ich drží názov. Poradie sedí s poradím podľa počtu. */
.k-krasa       { background: #C2521C; }
.k-obchod      { background: #26241F; }
.k-restauracie { background: #E9906A; }
.k-bary        { background: #6B6660; }
.k-moda        { background: #A8420F; }
.k-hazard      { background: #0B0B0B; }
.k-dom         { background: #F0B79A; }
.k-sluzby      { background: #9A948C; }
.k-potraviny   { background: #D9764A; }
.k-zdravie     { background: #4C4741; }
.k-financie    { background: #FBE3D6; }
.k-auto        { background: #B8B2AB; }
.k-volny-cas   { background: #E4DFDA; }

/* ---- prieskumník ---- */
/* `minmax(0, 1fr)` a `min-width: 0` sú tu preto, aby mapa so 720 px na
   telefóne nerozšírila celý prieskumník — grid inak berie min-content. */
.prieskumnik { margin-top: 40px; display: grid; grid-template-columns: minmax(0, 1fr); gap: clamp(28px, 3vw, 48px); }
.prieskumnik > * { min-width: 0; }
.prieskumnik-lista {
  display: flex; flex-wrap: wrap; align-items: center; gap: 14px 22px;
  padding: 18px 22px; border: 1px solid var(--line); border-radius: 18px; background: var(--paper);
}
.prieskumnik-lista label { display: flex; align-items: center; gap: 12px; flex: 1 1 280px; font-size: 15px; font-weight: 600; color: var(--muted); }
.prieskumnik-lista input {
  flex: 1; min-width: 0; padding: 12px 16px; border: 1px solid var(--line); border-radius: 999px;
  font: 500 17px/1.3 'Sen', system-ui, sans-serif; color: var(--ink); background: var(--paper);
}
.prieskumnik-lista input:focus { outline: 2px solid var(--akcent); outline-offset: 2px; border-color: var(--akcent); }
.prieskumnik-stav { display: inline-flex; border: 1px solid var(--line); border-radius: 999px; padding: 3px; background: var(--paper-alt); }
.prieskumnik-stav button {
  padding: 8px 16px; border: 0; border-radius: 999px; background: transparent;
  font: 600 15px/1 'Sen', system-ui, sans-serif; color: var(--body-soft); cursor: pointer;
  transition: background-color .15s ease, color .15s ease;
}
.prieskumnik-stav button:hover { color: var(--ink); }
.prieskumnik-stav button[aria-pressed="true"] { background: var(--ink); color: #FFFFFF; }
.prieskumnik-stav button:focus-visible { outline: 2px solid var(--akcent); outline-offset: 2px; }
.prieskumnik-suhrn { font-size: clamp(16px, 1.1vw, 18px); line-height: 1.5; color: var(--body-soft); flex: 1 1 auto; }
.prieskumnik-suhrn strong { color: var(--ink); font-weight: 700; }
.prieskumnik-reset {
  padding: 10px 18px; border: 1px solid var(--line); border-radius: 999px; background: transparent;
  font: 600 15px/1 'Sen', system-ui, sans-serif; color: var(--akcent); cursor: pointer;
  transition: background-color .2s ease, border-color .2s ease;
}
.prieskumnik-reset:hover { background: var(--akcent-svetly); border-color: var(--akcent); }
.prieskumnik-reset[hidden] { display: none; }

.prieskumnik-grafy { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(28px, 4vw, 72px); align-items: start; }
.graf h3 { font-size: clamp(19px, 1.4vw, 24px); font-weight: 700; letter-spacing: -.012em; }
.graf .popisok { margin-top: 8px; }
.pruhy { display: flex; flex-direction: column; gap: 6px; margin-top: 18px; }
.pruh {
  display: grid; grid-template-columns: minmax(150px, 0.9fr) minmax(0, 1fr) auto; gap: 12px; align-items: center;
  width: 100%; padding: 6px 8px; margin: 0 -8px; border: 0; border-radius: 10px; background: transparent;
  font: 500 clamp(15px, 1.02vw, 17px)/1.3 'Sen', system-ui, sans-serif; color: var(--body); text-align: left; cursor: pointer;
  transition: background-color .15s ease;
}
.pruh:hover { background: var(--paper-alt); }
.sekcia--alt .pruh:hover { background: var(--paper); }
.pruh:focus-visible { outline: 2px solid var(--akcent); outline-offset: 1px; }
.pruh-nazov { line-height: 1.2; text-wrap: balance; }
.pruh-stlpec { display: block; height: 18px; border-radius: 5px; background: rgba(0,0,0,.05); overflow: hidden; }
.pruh-stlpec { display: flex; }
.pruh-stlpec i { display: block; height: 100%; background: var(--akcent); border-radius: 5px; transition: width .35s cubic-bezier(.22,.61,.36,1); }
/* Ukončené sú sivé, nie červené: nie je to hodnotenie, je to stav. */
.pruh-stlpec .pruh-z { background: #B8B2AB; }
.pruh-stlpec .pruh-a + .pruh-z { border-radius: 0 5px 5px 0; margin-left: 1px; }
.pruh-cislo { font-weight: 700; font-variant-numeric: tabular-nums; text-align: right; color: var(--ink); white-space: nowrap; }
.pruh-cislo b { font-weight: 700; color: var(--akcent-tmavy); }
.pruh-cislo small { font-weight: 600; font-size: .82em; color: var(--muted); }
.pruh--aktivny { background: var(--akcent-svetly); }
.pruh--aktivny:hover, .sekcia--alt .pruh--aktivny:hover { background: var(--akcent-svetly); }
.pruh--aktivny .pruh-nazov { font-weight: 700; color: var(--akcent-tmavy); }
.pruh--aktivny .pruh-stlpec .pruh-a { background: var(--akcent-tmavy); }
.pruh--aktivny .pruh-stlpec .pruh-z { background: #8A857F; }
.pruh--nula { color: var(--muted); }
.pruh--nula .pruh-cislo { color: var(--muted); font-weight: 500; }
/* Keď je zapnutý filter, stĺpce mimo výberu zošednú — vidno, čo ostalo. */
.prieskumnik--filter .pruh:not(.pruh--aktivny) .pruh-stlpec .pruh-a { background: #D9A58B; }
.prieskumnik--filter .pruh:not(.pruh--aktivny) .pruh-stlpec .pruh-z { background: #D4CFC9; }

/* ---- mapa (Leaflet) ---- */
.mapa { margin-top: 18px; height: clamp(440px, 46vw, 560px); border: 1px solid var(--line); border-radius: 18px; overflow: hidden; background: var(--paper-alt); font-family: 'Sen', system-ui, sans-serif; }
.mapa .leaflet-container { font-family: inherit; }
.mapa .leaflet-control-attribution { font-size: 11px; color: var(--muted); background: rgba(255,255,255,.8); }
.mapa .leaflet-control-attribution a { color: var(--body-soft); }
.mapa .leaflet-bar a { color: var(--ink); }
.mapa-kruh { cursor: pointer; }
.mapa-popisok {
  background: rgba(255,255,255,.9); border: 0; border-radius: 6px; box-shadow: none;
  padding: 2px 6px; font: 600 13px/1.2 'Sen', system-ui, sans-serif; color: var(--body-soft);
}
.mapa-popisok b { color: var(--ink); }
.mapa-popisok--maly { font-size: 11.5px; font-weight: 500; color: var(--muted); }
.mapa-popisok--aktivny { color: var(--akcent-tmavy); }
.mapa-popisok::before { display: none; }
.mapa .leaflet-popup-content { font: 500 15px/1.5 'Sen', system-ui, sans-serif; color: var(--body); margin: 12px 16px; }
.mapa .leaflet-popup-content small { color: var(--muted); }
.mapa .leaflet-popup-content-wrapper { border-radius: 12px; box-shadow: 0 10px 30px -12px rgba(0,0,0,.35); }
/* Keď je zapnutý filter, kruhy mimo výberu zosvetlejú cez opacity v JS. */

/* ---- zoznam ----
   `.tabulka` je zo spoločnej šablóny; tu nepotrebuje min-width 820 px —
   štyri stĺpce sa zmestia aj do 640 px a na telefóne sa posúvajú. */
/* 188 riadkov by stránku natiahlo o desať obrazoviek — zoznam sa preto
   posúva vo vlastnom ráme s prilepenou hlavičkou. Na papieri celý. */
.zoznam .tabulka { max-height: min(70vh, 720px); overflow: auto; }
.zoznam .tabulka thead th { position: sticky; top: 0; z-index: 1; }
.zoznam .tabulka table { min-width: 760px; }
.zoznam .stav { display: inline-block; padding: 3px 9px; border-radius: 999px; font-size: 12.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; white-space: nowrap; }
.zoznam .stav-a { background: var(--akcent-svetly); color: var(--akcent-tmavy); }
.zoznam .stav-z { background: #ECE9E5; color: var(--muted); }
.zoznam .riadok-z td:first-child { color: var(--body-soft); }
.zoznam .tabulka td:first-child { color: var(--ink); }
.zoznam .tabulka td:nth-child(2) { white-space: nowrap; }
.zoznam .kat {
  padding: 4px 10px; border: 1px solid var(--line); border-radius: 999px; background: transparent;
  font: 500 13.5px/1.3 'Sen', system-ui, sans-serif; color: var(--body-soft); cursor: pointer; text-align: left;
  transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}
.zoznam .kat:hover { background: var(--akcent-svetly); color: var(--akcent-tmavy); border-color: var(--akcent); }
.zoznam .prazdne { text-align: center; color: var(--muted); padding: 32px 18px; }
.zoznam h3 { font-size: clamp(19px, 1.4vw, 24px); font-weight: 700; letter-spacing: -.012em; }
.zoznam h3 span { color: var(--akcent); }

/* Tabuľky v texte (budovy, pestrosť) sú užšie než tabuľka sentimentu. */
.tabulka--uzka table { min-width: 560px; }
.tabulka td.cislo, .tabulka th.cislo { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.tabulka td.cislo { color: var(--ink); font-weight: 700; }

/* Podiel ukončených v tabuľkách — číslo a k nemu tenký pruh. */
.podiel-bunka { display: grid; grid-template-columns: 52px minmax(60px, 1fr); gap: 10px; align-items: center; min-width: 140px; }
.podiel-bunka i { display: block; height: 8px; border-radius: 4px; background: rgba(0,0,0,.06); overflow: hidden; }
.podiel-bunka i::before { content: ""; display: block; height: 100%; width: var(--p, 0%); background: #9A948C; border-radius: 4px; }
.podiel-bunka b { font-variant-numeric: tabular-nums; color: var(--ink); }
.tabulka tr.vysoke .podiel-bunka i::before { background: var(--akcent); }

/* Odkazy v texte, ktoré nastavia filter prieskumníka. */
.text a[data-filter], .cisla a[data-filter], .body a[data-filter] {
  color: var(--akcent); font-weight: 600; text-decoration: none;
  border-bottom: 1px solid var(--line); transition: border-color .2s ease;
}
.text a[data-filter]:hover, .cisla a[data-filter]:hover, .body a[data-filter]:hover { border-color: var(--akcent); }

/* Dva stĺpce záverov — mesto vľavo, podnikateľ vpravo — sú na desktope
   vedľa seba len ako dve sekcie za sebou; každá má vlastný nadpis. */
.zaver-kicker { display: block; margin-top: 44px; font-size: 13px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }

.bez-skriptu { margin-top: 28px; }
.prieskumnik-bezi .bez-skriptu { display: none; }

@media (max-width: 900px) {
  .prieskumnik-grafy { grid-template-columns: minmax(0, 1fr); }
  .pruh { grid-template-columns: minmax(120px, 0.9fr) minmax(0, 1fr) auto; }
}
@media (prefers-reduced-motion: reduce) {
  .pruh-stlpec i { transition: none; }
}
@media print {
  .prieskumnik-lista, .prieskumnik-reset { display: none !important; }
  .zoznam .tabulka { max-height: none; overflow: visible; }
}

/* ---- prehľadná verzia: karty, grafy, zistenia ----
   Rytmus každej sekcie: nadpis + jedna otázka, dve karty s grafom, jeden
   záver v rámčeku. Text je v rámčeku, nie okolo grafov. */
.kpi { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(14px, 1.6vw, 24px); margin-top: 40px; }
.kpi > div { border: 1px solid var(--line); border-radius: 20px; padding: clamp(22px, 2vw, 32px) clamp(18px, 1.8vw, 28px); background: var(--paper); text-align: center; }
.kpi .hodnota { font-size: clamp(36px, 3.6vw, 64px); font-weight: 700; line-height: 1; letter-spacing: -.03em; }
.kpi .popis { margin-top: 12px; font-size: 13px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.kpi .zelena { color: var(--zelena); }
.kpi .akcent { color: var(--akcent); }

.zistenie {
  margin-top: 28px; max-width: none; border-left: 4px solid var(--akcent); border-radius: 0 18px 18px 0;
  background: var(--akcent-svetly); padding: 20px 26px;
  font-size: clamp(17px, 1.15vw, 19.5px); line-height: 1.66; color: var(--body);
}
.zistenie strong { color: var(--ink); font-weight: 700; }
.zistenie b { color: var(--akcent-tmavy); font-weight: 700; }
.sekcia--alt .zistenie { background: #F8E4D8; }

.otazka { margin-top: 14px; max-width: 70ch; font-size: clamp(17px, 1.2vw, 20px); line-height: 1.6; color: var(--body-soft); }

.karty { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(18px, 2vw, 32px); margin-top: 34px; }
.karty--jedna { grid-template-columns: minmax(0, 1fr); }
.karta { border: 1px solid var(--line); border-radius: 20px; padding: clamp(20px, 2vw, 30px); background: var(--paper); min-width: 0; }
.karta h3 { font-size: clamp(17px, 1.2vw, 20px); font-weight: 700; letter-spacing: -.01em; }
.karta .legenda { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-top: 10px; font-size: 13.5px; color: var(--muted); }
.karta .legenda i { display: inline-block; width: 12px; height: 12px; border-radius: 3px; margin-right: 6px; vertical-align: -1px; }
.g-a, .legenda .g-a { background: var(--akcent); }
.g-z, .legenda .g-z { background: #B8B2AB; }
.g-vysoke, .legenda .g-vysoke { background: var(--akcent); }
.g-stredne, .legenda .g-stredne { background: #D9A05B; }
.g-nizke, .legenda .g-nizke { background: var(--zelena); }

.graf-pruhy { display: flex; flex-direction: column; gap: 7px; margin-top: 18px; }
.g-rad { display: grid; grid-template-columns: minmax(130px, 0.75fr) minmax(0, 1fr) auto; gap: 12px; align-items: center; font-size: clamp(14.5px, 1vw, 16px); line-height: 1.25; color: var(--body); }
.g-nazov { text-wrap: balance; }
.g-pruh { display: flex; height: 16px; border-radius: 5px; background: rgba(0,0,0,.05); overflow: hidden; }
.g-pruh i { display: block; height: 100%; }
.g-pruh i:first-child { border-radius: 5px 0 0 5px; }
.g-pruh i:last-child { border-radius: 0 5px 5px 0; }
.g-pruh i:only-child { border-radius: 5px; }
.g-pruh .g-a + .g-z { margin-left: 1px; }
.g-cislo { font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; text-align: right; color: var(--ink); min-width: 56px; }
.g-cislo b { color: var(--akcent-tmavy); }

/* Tabuľka s číslami pod grafom — zbalená, pre detail, tlač a bez skriptu. */
.detail { margin-top: 18px; }
.detail summary { cursor: pointer; font-size: 15px; font-weight: 600; color: var(--akcent); list-style: none; display: inline-flex; align-items: center; gap: 8px; }
.detail summary::-webkit-details-marker { display: none; }
.detail summary::after { content: ""; width: 7px; height: 7px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg) translateY(-2px); }
.detail[open] summary::after { transform: rotate(-135deg) translateY(1px); }
.detail .tabulka { margin-top: 14px; }
.prieskumnik-bezi .detail--skript { display: block; }
/* Bez skriptu sú grafy prázdne — tabuľka sa vtedy ukáže hneď. */
html:not(.prieskumnik-bezi) .detail--skript { display: none; }
html:not(.prieskumnik-bezi) .detail--skript + .tabulka-bez-skriptu { display: block; }
.tabulka-bez-skriptu { display: none; margin-top: 18px; }

/* Dva stĺpce záverov vedľa seba. */
.zavery { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(24px, 3vw, 56px); margin-top: 34px; }
.zavery > div { min-width: 0; }
.zavery h3 { font-size: clamp(21px, 1.7vw, 28px); font-weight: 700; letter-spacing: -.016em; }
.zavery .cisla { margin-top: 22px; gap: 16px; }
.zavery .cisla li { font-size: clamp(16px, 1.08vw, 18px); line-height: 1.6; max-width: none; }

/* Metodika je dôležitá, ale nie na prvé čítanie — zbalená. */
.metodika-detail { margin-top: 26px; }
.metodika-detail summary { cursor: pointer; font-size: clamp(17px, 1.15vw, 19px); font-weight: 700; color: var(--ink); list-style: none; display: inline-flex; align-items: center; gap: 10px; }
.metodika-detail summary::-webkit-details-marker { display: none; }
.metodika-detail summary::after { content: ""; width: 8px; height: 8px; border-right: 2px solid var(--akcent); border-bottom: 2px solid var(--akcent); transform: rotate(45deg) translateY(-2px); }
.metodika-detail[open] summary::after { transform: rotate(-135deg) translateY(1px); }

@media (max-width: 900px) {
  .kpi { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .karty, .zavery { grid-template-columns: minmax(0, 1fr); }
  .g-rad { grid-template-columns: minmax(110px, 0.8fr) minmax(0, 1fr) auto; }
}
@media (max-width: 520px) {
  .kpi { grid-template-columns: minmax(0, 1fr); }
}
@media print {
  .detail[open] summary, .detail summary { display: none; }
  .detail .tabulka { display: block; }
}

/* ---- sľub k dátam ----
   Jeden blok, ktorý má z tejto stránky ostať v pamäti: tmavý ako panel
   na ostatných podstránkach, ale bez tlačidla — je to záväzok, nie výzva. */
.slub {
  margin-top: clamp(40px, 4vw, 64px); background: var(--ink); color: #FFFFFF;
  border-radius: clamp(28px, 2.3vw, 44px); padding: clamp(34px, 3.6vw, 64px) clamp(28px, 4vw, 74px);
}
.slub .stitok { color: #F0A97E; }
.slub h3 { margin-top: 14px; font-size: clamp(28px, 2.7vw, 52px); font-weight: 700; line-height: 1.1; letter-spacing: -.022em; max-width: 20ch; }
.slub p { margin-top: 18px; max-width: 64ch; font-size: clamp(17px, 1.2vw, 20px); line-height: 1.68; color: #B8B2AB; }
.slub .cisla { margin-top: 26px; gap: 18px; }
.slub .cisla li { color: #D8D3CD; max-width: 72ch; }
.slub .cisla li strong { color: #FFFFFF; }
.slub .cisla li::before { background: rgba(240,169,126,.18); color: #F0A97E; }
