/* ZahraPhoto Kalkulačka. Kompaktná verzia z 26. 9. 2026 (návrh 1, schválila Angela): nízke karty balíčkov, hustejšie doplnky,
   box V každom balíčku odsekovým písmom s fajkami. Vzhľad z globálnych štýlov Divi (tokeny gcid-zp-*, gvid-zp-*);
   hodnoty za čiarkou sú len záloha. */
.zp-kalk{
  --zpk-ink:var(--gcid-zp-ink,#241d13);
  --zpk-text:var(--gcid-zp-text,#4f463c);
  --zpk-linka:var(--gcid-zp-hairline,#cfc9bf);
  --zpk-podklad:var(--gcid-zp-cream,#f9f7f3);
  --zpk-box:var(--gcid-zp-beige,#f1eee7);
  --zpk-pismo-nadpisy:var(--gvid-zp-pismo-nadpisy,'IvyPrestoLight'),Georgia,serif;
  --zpk-pismo-text:var(--gvid-zp-pismo-text,'Open Sans'),Arial,sans-serif;
  --zpk-pismo-stitky:var(--gvid-zp-pismo-stitky,'Questrial'),Arial,sans-serif;
  --zpk-h:var(--gvid-zp-h2,38px);
  --zpk-h5:var(--gvid-zp-h5,19px);
  --zpk-cena-balicka:var(--gvid-zp-h3,28px);
  --zpk-cena-spolu:var(--gvid-zp-h2,38px);
  --zpk-eyebrow:var(--gvid-zp-eyebrow,11px);
  --zpk-text-velkost:var(--gvid-zp-text-velikost,13px);
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(48px,7vw,var(--gvid-zp-mezera-velka,100px));align-items:start;
  color:var(--zpk-ink);font-family:var(--zpk-pismo-text);font-size:var(--zpk-text-velkost);line-height:var(--gvid-zp-text-vyska,1.6);text-align:left
}
.zp-kalk *,.zp-kalk *::before,.zp-kalk *::after{box-sizing:border-box}
/* nulovanie tém: :where drží špecificitu nízko, aby ho triedy nižšie prebili; zoznamy téma Divi odsadzuje silnejšie */
.zp-kalk :where(p,h1,h2,h3,ul,li,label){margin:0;padding:0}
.zp-kalk ul{list-style:none!important;padding:0!important;line-height:inherit}
.zp-kalk [hidden]{display:none!important}
.zp-kalk .zp-kalk__sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0;opacity:0}

/* štítky (Questrial, verzálky) */
.zp-kalk__stitok,.zp-kalk__krok-stitok,.zp-kalk__krok-poznamka,.zp-kalk__spolu-stitok,.zp-kalk__balicek-hlava{
  font-family:var(--zpk-pismo-stitky);font-weight:400;font-size:var(--zpk-eyebrow);line-height:1.4;
  letter-spacing:var(--gvid-zp-prostrkani-eyebrow,3px);text-transform:uppercase;color:var(--zpk-text)
}
.zp-kalk__krok-poznamka{text-transform:none;letter-spacing:0;font-family:var(--zpk-pismo-text);font-size:var(--zpk-text-velkost)}

/* ľavý stĺpec: nadpis a súhrn, pri posúvaní ostáva na mieste */
.zp-kalk__lavy{position:sticky;top:var(--zp-kalk-odsadenie,120px);display:flex;flex-direction:column;gap:32px}
.zp-kalk__hlava{display:flex;flex-direction:column;gap:20px}
.zp-kalk .zp-kalk__nadpis{margin:0;padding:0;font-family:var(--zpk-pismo-nadpisy);font-weight:300;font-size:var(--zpk-h);line-height:var(--gvid-zp-vyska-nadpisu,1.12);
  letter-spacing:var(--gvid-zp-prostrkani-nadpisu,.02em);color:var(--zpk-ink);text-wrap:balance}
.zp-kalk .zp-kalk__nadpis--h1{--zpk-h:var(--gvid-zp-h1,40px)}
.zp-kalk .zp-kalk__nadpis--h3{--zpk-h:var(--gvid-zp-h3,28px)}
.zp-kalk__uvod{color:var(--zpk-text);max-width:var(--gvid-zp-text-sirka,48ch)}
.zp-kalk__zaver{display:flex;flex-direction:column;gap:28px}
.zp-kalk__prehlad{border-top:1px solid var(--zpk-ink)}
.zp-kalk__riadok{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--zpk-linka);color:var(--zpk-text)}
.zp-kalk__riadok span:last-child{white-space:nowrap}
.zp-kalk .zp-kalk__spolu{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding-top:20px}
.zp-kalk__spolu-cena{font-family:var(--zpk-pismo-nadpisy);font-weight:300;font-size:var(--zpk-cena-spolu);line-height:1;color:var(--zpk-ink);white-space:nowrap}
.zp-kalk a.zp-kalk__tlacidlo{align-self:flex-start;display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:18px 36px;
  background:var(--zpk-ink);color:var(--zpk-podklad);font-family:var(--zpk-pismo-stitky);font-size:var(--gvid-zp-stitek,11px);line-height:1.2;
  letter-spacing:var(--gvid-zp-prostrkani-stitek,3px);text-transform:uppercase;text-decoration:none;transition:background-color .2s}
.zp-kalk a.zp-kalk__tlacidlo:hover{background:var(--zpk-text);color:var(--zpk-podklad)}

/* pravý stĺpec: výber */
.zp-kalk__volby{display:flex;flex-direction:column;gap:40px;min-width:0}
.zp-kalk__skupina{display:flex;flex-direction:column;gap:14px}
.zp-kalk .zp-kalk__krok-hlava{display:flex;justify-content:space-between;align-items:baseline;gap:16px}

/* balíčky: nízke karty, štítok a odznak hore, názov vľavo (číslo nadpisovým písmom, slová odsekovým) a cena vpravo */
.zp-kalk__balicky{display:flex;flex-direction:column;gap:8px}
.zp-kalk .zp-kalk__balicek{position:relative;display:flex;flex-direction:column;gap:2px;padding:14px 22px 16px;border:1px solid var(--zpk-ink);
  background:transparent;color:var(--zpk-ink);cursor:pointer;transition:background-color .25s,color .25s}
.zp-kalk .zp-kalk__balicek:hover{background:var(--zpk-box)}
.zp-kalk .zp-kalk__balicek.je-vybrany{background:var(--zpk-ink);color:var(--zpk-podklad)}
.zp-kalk__balicek.je-vybrany .zp-kalk__balicek-hlava{color:inherit}
.zp-kalk__balicek:has(input:focus-visible){outline:1px solid var(--zpk-ink);outline-offset:3px}
.zp-kalk .zp-kalk__balicek-hlava{display:flex;justify-content:space-between;gap:16px;font-size:10px;letter-spacing:2.5px}
.zp-kalk__balicek-telo{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:4px 20px}
.zp-kalk__balicek-nazov{font-family:var(--zpk-pismo-text);font-size:var(--zpk-text-velkost);line-height:1.35}
.zp-kalk__balicek-cislo{font-family:var(--zpk-pismo-nadpisy);font-weight:300;font-size:var(--zpk-cena-balicka);line-height:1;margin-right:.08em}
.zp-kalk__balicek-cena{font-family:var(--zpk-pismo-nadpisy);font-weight:300;font-size:var(--zpk-cena-balicka);line-height:1;white-space:nowrap;margin-left:auto}

/* doplnky: hustý zoznam, názov a popis odsekovým písmom, suma nadpisovým */
.zp-kalk__priplatky{border-top:1px solid var(--zpk-ink)}
.zp-kalk .zp-kalk__priplatok,.zp-kalk__navyse{display:grid;grid-template-columns:16px minmax(0,1fr) auto;gap:16px;align-items:center;
  padding:12px 0;border-bottom:1px solid var(--zpk-linka);color:var(--zpk-ink)}
.zp-kalk .zp-kalk__priplatok{cursor:pointer}
.zp-kalk__box{width:16px;height:16px;border:1px solid var(--zpk-ink);display:flex;align-items:center;justify-content:center;transition:background-color .2s}
.zp-kalk__priplatok.je-vybrany .zp-kalk__box{background:var(--zpk-ink)}
.zp-kalk__priplatok.je-vybrany .zp-kalk__box::after{content:"";width:8px;height:4px;margin-top:-2px;border-left:1.5px solid var(--zpk-podklad);border-bottom:1.5px solid var(--zpk-podklad);transform:rotate(-45deg)}
.zp-kalk__priplatok:has(input:focus-visible) .zp-kalk__box{outline:1px solid var(--zpk-ink);outline-offset:3px}
.zp-kalk__polozka-text{display:flex;flex-direction:column;gap:1px;min-width:0}
.zp-kalk__polozka-nazov{font-family:var(--zpk-pismo-text);font-size:var(--zpk-text-velkost);line-height:1.45;color:var(--zpk-ink)}
.zp-kalk__popis{color:var(--zpk-text);line-height:1.45}
.zp-kalk__priplatok-cena{font-family:var(--zpk-pismo-nadpisy);font-weight:300;font-size:var(--zpk-h5);line-height:1.25;white-space:nowrap}
.zp-kalk__navyse{transition:opacity .25s}
/* fotografie navyše tiež na jeden riadok: cena za kus alebo poznámka hneď za názvom */
.zp-kalk__navyse .zp-kalk__polozka-text{flex-direction:row;flex-wrap:wrap;align-items:baseline;gap:0 12px}
.zp-kalk__navyse.je-nedostupne{opacity:.4}
.zp-kalk__pocitadlo{display:flex;align-items:center}
.zp-kalk button.zp-kalk__tlac{width:34px;height:34px;margin:0;padding:0;border:1px solid var(--zpk-ink);border-radius:0;background:transparent;
  color:var(--zpk-ink);font:300 16px/1 var(--zpk-pismo-text);cursor:pointer;transition:background-color .2s,opacity .2s}
.zp-kalk button.zp-kalk__tlac--plus{background:var(--zpk-ink);color:var(--zpk-podklad)}
.zp-kalk button.zp-kalk__tlac:disabled{cursor:default;opacity:.35}
.zp-kalk__navyse.je-nedostupne button.zp-kalk__tlac:disabled{opacity:1}
.zp-kalk button.zp-kalk__tlac:focus-visible{outline:1px solid var(--zpk-ink);outline-offset:3px}
.zp-kalk__pocet{width:40px;height:34px;border-top:1px solid var(--zpk-ink);border-bottom:1px solid var(--zpk-ink);display:flex;align-items:center;
  justify-content:center;font-family:var(--zpk-pismo-nadpisy);font-size:17px;line-height:1}

/* box V každom balíčku: informácia, nie výber. Odsekové písmo, fajky namiesto štvorčekov, béžové pozadie. */
.zp-kalk__info{background:var(--zpk-box);padding:22px 26px 24px;display:flex;flex-direction:column;gap:14px}
.zp-kalk .zp-kalk__info-zoznam{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:8px 28px}
.zp-kalk .zp-kalk__info-zoznam li{position:relative;display:block;padding-left:22px;color:var(--zpk-ink);line-height:1.5}
.zp-kalk .zp-kalk__info-zoznam li::before{content:"";position:absolute;left:2px;top:.42em;width:9px;height:5px;border-left:1px solid var(--zpk-ink);
  border-bottom:1px solid var(--zpk-ink);transform:rotate(-45deg)}
.zp-kalk__info-nazov{font-family:var(--zpk-pismo-text);font-size:var(--zpk-text-velkost);color:var(--zpk-ink)}
.zp-kalk__info-zoznam .zp-kalk__popis{display:inline}
.zp-kalk__info-zoznam .zp-kalk__popis::before{content:", "}

/* builder: skryté položky ostanú viditeľné, prečiarknuté */
.zp-kalk .je-skryte{opacity:.45}
.zp-kalk .je-skryte .zp-kalk__balicek-nazov,.zp-kalk .je-skryte .zp-kalk__polozka-nazov,.zp-kalk .je-skryte .zp-kalk__info-nazov{text-decoration:line-through}
.zp-kalk__vb-skryte{font-family:var(--zpk-pismo-stitky);font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--zpk-text)}
.zp-kalk-hlaska{padding:24px;border:1px dashed var(--gcid-zp-hairline,#cfc9bf);text-align:center}

/* tablet a mobil: nadpis, výber, potom súhrn s cenou a tlačidlom */
@media (max-width:980px){
  .zp-kalk{--zpk-h:var(--gvid-zp-h2-mobil,30px);--zpk-h5:var(--gvid-zp-h5-mobil,17px);--zpk-cena-balicka:var(--gvid-zp-h3-mobil,24px);
    --zpk-cena-spolu:var(--gvid-zp-h2-mobil,30px);--zpk-eyebrow:var(--gvid-zp-eyebrow-mobil,10px);display:flex;flex-direction:column;align-items:stretch;gap:40px}
  .zp-kalk .zp-kalk__nadpis--h1{--zpk-h:var(--gvid-zp-h1-mobil,32px)}
  .zp-kalk .zp-kalk__nadpis--h3{--zpk-h:var(--gvid-zp-h3-mobil,24px)}
  .zp-kalk__lavy{display:contents}
  .zp-kalk__hlava{order:1}
  .zp-kalk__volby{order:2}
  .zp-kalk__zaver{order:3}
}
@media (max-width:767px){
  .zp-kalk .zp-kalk__balicek{padding:12px 16px 14px}
  .zp-kalk__info{padding:20px}
  .zp-kalk .zp-kalk__priplatok,.zp-kalk__navyse{gap:12px}
  .zp-kalk a.zp-kalk__tlacidlo{align-self:stretch}
}
