/* Kupovina licence (Figma 292:2, 292:58, 292:121, 292:170, 296:2, 296:56). Širina okvira kao na naslovnoj (1309). */
body.woocommerce-checkout { background: #F9F9FA; }
.skriveno { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); border: 0; }
.kupovina { padding: 57px 0 80px; background: #F9F9FA; color: #0E0E0E; }
.kupovina fieldset { margin: 0; padding: 0; border: 0; min-width: 0; }
.kupovina [hidden] { display: none !important; }

/* ---------- Koraci ---------- */
.koraci-kupovine { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.koraci-kupovine li { position: relative; display: flex; flex-direction: column; align-items: center; gap: 12px; }
.koraci-kupovine li:not(:last-child)::after {
  content: ""; position: absolute; top: 17px; left: calc(50% + 22px); width: calc(100% - 43.5px); height: 2px; background: #E6E6EA;
}
.koraci-kupovine li.gotov::after { background: #6731C6; }
.koraci-kupovine__krug {
  position: relative; z-index: 1; display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%;
  background: #fff; box-shadow: inset 0 0 0 1px #E6E6EA; font: 600 15px/20px var(--inter); color: #6B6D7A;
  transition: background-color .2s, color .2s;
}
.koraci-kupovine__naziv { font: 400 14.5px/20px var(--inter); color: #6B6D7A; }
.koraci-kupovine li.tren .koraci-kupovine__krug, .koraci-kupovine li.gotov .koraci-kupovine__krug { background: #6731C6; box-shadow: none; color: #fff; }
.koraci-kupovine li.tren .koraci-kupovine__naziv, .koraci-kupovine li.gotov .koraci-kupovine__naziv { font-weight: 600; color: #0E0E0E; }

/* ---------- Naslovi ---------- */
.kupovina__glave { margin-top: 44px; }
.kupovina__naslov { font: 700 40px/48px var(--dm); letter-spacing: 0; color: #0E0E0E; }
/* naslov koraka dobija fokus iz skripte (čitači ekrana); bez vidljivog okvira */
.kupovina__naslov:focus { outline: none; }
.kupovina__uvod { margin-top: 12px; max-width: 860px; font: 300 17px/26px var(--inter); color: #3C3C3C; }
.kupovina__uvod--ishod { margin-top: 24px; }
.kupovina[data-korak] .kupovina__glava:not([data-glava="1"]) { display: none; }
.kupovina[data-korak="2"] .kupovina__glava[data-glava="1"], .kupovina[data-korak="3"] .kupovina__glava[data-glava="1"] { display: none; }
.kupovina[data-korak="2"] .kupovina__glava[data-glava="2"], .kupovina[data-korak="3"] .kupovina__glava[data-glava="3"] { display: block; }

/* ---------- Dve kolone ---------- */
.kupovina__red { display: grid; grid-template-columns: minmax(0, 1fr) 420px; column-gap: 30px; align-items: start; margin-top: 34px; }
.kupovina[data-korak="2"] .kupovina__red { margin-top: 28px; }
.kupovina__red--ishod { margin-top: 36px; }
.kupovina__levo { min-width: 0; }
.kupovina__desno { position: sticky; top: calc(var(--glava, 0px) + 24px); } /* ispod lepljivog menija */
.kupovina[data-korak] .k-panel:not([data-panel="1"]) { display: none; }
.kupovina[data-korak="2"] .k-panel[data-panel="1"], .kupovina[data-korak="3"] .k-panel[data-panel="1"] { display: none; }
.kupovina[data-korak="2"] .k-panel[data-panel="2"], .kupovina[data-korak="3"] .k-panel[data-panel="3"] { display: block; }

/* ---------- Opcije (radio kartice) ---------- */
.izbor { display: flex; flex-direction: column; gap: 16px; }
.kupovina .izbor--paket, .kupovina .izbor--sajtovi { margin-top: 40px; }
.izbor__naslov { float: left; width: 100%; margin-bottom: -4px; font: 600 13px/18px var(--inter); color: #4A4A52; }
.opcija {
  position: relative; display: flex; align-items: center; min-height: 72px; padding: 0 30px; border-radius: 10px;
  background: #fff; box-shadow: inset 0 0 0 1px #E6E6EA; cursor: pointer; transition: box-shadow .15s;
}
.opcija:hover { box-shadow: inset 0 0 0 1px #C9C9D3; }
.opcija input { position: absolute; opacity: 0; pointer-events: none; }
.opcija__krug {
  flex: none; width: 24px; height: 24px; border-radius: 50%; background: #fff; box-shadow: inset 0 0 0 1px #C4C4CE;
  transition: box-shadow .15s;
}
.opcija:has(input:checked) { box-shadow: inset 0 0 0 2px #6731C6; }
.opcija input:checked + .opcija__krug { box-shadow: inset 0 0 0 7px #6731C6; }
.opcija input:focus-visible + .opcija__krug { outline: 2px solid #6731C6; outline-offset: 3px; }
.opcija--sluzba .znak { margin-left: 20px; }
.opcija__naziv { margin-left: 14px; font: 500 18px/24px var(--inter); color: #0E0E0E; }
.opcija--paket { min-height: 76px; }
.opcija--placanje { min-height: 84px; }
.opcija__tekst { display: flex; flex-direction: column; gap: 2px; margin-left: 20px; }
.opcija__tekst b { font: 600 18px/24px var(--inter); color: #0E0E0E; }
.opcija__tekst small { font: 300 14px/20px var(--inter); color: #6E6E76; }
.opcija__cena { margin-left: auto; padding-left: 16px; font: 700 20px/26px var(--dm); color: #0E0E0E; white-space: nowrap; }

/* Znak službe (slovo u obojenom kvadratu) */
/* Znak službe: pečat (svg iz kha_lic_pecat) */
.znak { display: block; flex: none; width: 28px; height: 28px; }
.znak--20 { width: 20px; height: 20px; }
.znak--24 { width: 24px; height: 24px; }

/* ---------- Kartica „Tvoja porudžbina“ ---------- */
.porudzbina { padding: 28px 32px 30px; border-radius: 12px; background: #fff; box-shadow: inset 0 0 0 1px #E6E6EA; }
.porudzbina__naslov { font: 700 20px/26px var(--dm); color: #0E0E0E; }
.porudzbina__redovi { display: flex; flex-direction: column; gap: 12px; margin: 24px 0 0; }
.porudzbina__redovi > div { display: flex; justify-content: space-between; align-items: center; gap: 16px; }
.porudzbina__redovi dt { font: 300 15px/22px var(--inter); color: #6E6E76; }
.porudzbina__redovi dd { display: flex; align-items: center; gap: 7px; margin: 0; font: 500 15px/22px var(--inter); color: #0E0E0E; text-align: right; }
.porudzbina__ukupno { display: flex; justify-content: space-between; align-items: center; margin-top: 24px; padding-top: 15px; border-top: 1px solid #E6E6EA; }
.porudzbina__ukupno span { font: 600 17px/24px var(--inter); }
.porudzbina__ukupno strong { font: 700 24px/30px var(--dm); }
.porudzbina__napomena { margin-top: 14px; font: 400 13px/18px var(--inter); color: #6B6D7A; }
.porudzbina__napomena--greska { color: #C13438; }
.porudzbina__obnova { margin-top: 10px; font: 400 13px/18px var(--inter); color: #6E6E76; }
.porudzbina__obnova b { font-weight: 600; color: #0E0E0E; letter-spacing: .02em; }

/* ---------- Dugmad ---------- */
.k-dugme {
  display: inline-flex; align-items: center; justify-content: center; height: 56px; padding: 0 28px; border: 0; border-radius: 50px;
  background: #6731C6; color: #fff; font: 600 16px/22px var(--inter); text-decoration: none; cursor: pointer;
  transition: background-color .15s, box-shadow .15s;
}
.k-dugme:hover { background: #5626AE; }
.k-dugme:disabled { opacity: .6; cursor: progress; }
.k-dugme--obrub { background: #fff; color: #0E0E0E; box-shadow: inset 0 0 0 1px #0E0E0E; }
.k-dugme--obrub:hover { background: #F4F4F7; }
.k-dugme--puno { width: 100%; }
.kupovina__desno .k-dugme--puno { margin-top: 34px; }
.kupovina__nazad {
  display: block; margin: 16px auto 0; padding: 4px 8px; border: 0; background: none; cursor: pointer;
  font: 500 14px/20px var(--inter); color: #6E6E76;
}
.kupovina__nazad:hover { color: #0E0E0E; }
.k-dugmad { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-top: 32px; }
.k-koraci + .k-dugmad { margin-top: 26px; }
.k-dugmad .k-dugme { width: 100%; }

/* ---------- Korak 2: podaci ---------- */
.tip { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.tip__opcija { position: relative; cursor: pointer; }
.tip__opcija input { position: absolute; opacity: 0; pointer-events: none; }
.tip__opcija span {
  display: grid; place-items: center; height: 56px; border-radius: 8px; background: #fff; box-shadow: inset 0 0 0 1px #E6E6EA;
  font: 400 15.5px/22px var(--inter); color: #3C3C3C; transition: box-shadow .15s;
}
.tip__opcija input:checked + span { box-shadow: inset 0 0 0 2px #6731C6; font-weight: 600; color: #6731C6; }
.tip__opcija input:focus-visible + span { outline: 2px solid #6731C6; outline-offset: 3px; }
.polja { display: grid; grid-template-columns: 1fr 1fr; column-gap: 24px; row-gap: 20px; margin-top: 32px; }
.polje { display: flex; flex-direction: column; gap: 6px; margin: 0; }
.polje--puno { grid-column: 1 / -1; }
.polje label { font: 600 13px/18px var(--inter); color: #4A4A52; }
.polje input {
  height: 48px; padding: 0 14px; border: 1px solid #E6E6EA; border-radius: 8px; background: #fff;
  font: 300 15.5px/22px var(--inter); color: #0E0E0E; transition: border-color .15s, box-shadow .15s;
}
.polje input::placeholder { color: #A5A5AF; opacity: 1; }
.polje input:focus { outline: none; border-color: #6731C6; box-shadow: 0 0 0 3px rgba(103, 49, 198, .14); }
.polje.greska input { border-color: #C13438; }
.polje__greska { font: 400 13px/18px var(--inter); color: #C13438; }
.polje__greska:empty { display: none; }
.k-greske {
  margin-bottom: 20px; padding: 14px 18px; border-radius: 10px; background: #FDE7E8; box-shadow: inset 0 0 0 1px #F4C4C6;
  font: 400 14.5px/21px var(--inter); color: #8E1F23;
}
.k-greske p + p { margin-top: 4px; }
.k-greske a { color: inherit; font-weight: 600; }

/* ---------- Korak 3: plaćanje ---------- */
.k-info {
  margin-top: 36px; padding: 25px 31px 23px; border-radius: 10px; background: #FFF9E6; border: 1px solid #F0DFA8; color: #6B4E00;
}
.k-info__naslov { font: 600 15px/22px var(--inter); }
.k-info__tekst { margin-top: 4px; font: 300 14.5px/21px var(--inter); }
.k-info__proba { margin-top: 8px; font: 500 13px/18px var(--inter); }
.k-info--ishod { margin-top: 24px; padding: 23px 31px 26px; }
.k-info--ishod .k-info__tekst { margin-top: 2px; }
.saglasnost { display: flex; align-items: center; gap: 16px; margin-top: 30px; cursor: pointer; font: 300 14.5px/20px var(--inter); color: #3C3C3C; }
.saglasnost input { position: absolute; opacity: 0; pointer-events: none; }
.saglasnost__kvadrat {
  position: relative; flex: none; width: 22px; height: 22px; border-radius: 5px; background: #fff; box-shadow: inset 0 0 0 1px #B4B4C0;
}
.saglasnost input:checked + .saglasnost__kvadrat { background: #6731C6; box-shadow: none; }
.saglasnost input:checked + .saglasnost__kvadrat::after {
  content: ""; position: absolute; left: 7px; top: 3px; width: 6px; height: 11px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg);
}
.saglasnost input:focus-visible + .saglasnost__kvadrat { outline: 2px solid #6731C6; outline-offset: 3px; }
.saglasnost a { color: inherit; }
.k-panel[data-panel="3"] > .polje__greska { display: block; margin-top: 8px; }

/* ---------- Ishod (4, 3b, 4b) ---------- */
.ishod { display: flex; align-items: center; gap: 18px; margin-top: 48px; }
.ishod__znak { flex: none; display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; }
.ishod__znak--uspeh { background: #E6F6EF; }
.ishod__znak--greska { background: #FDE7E8; }
.ishod__znak--predracun { background: #EFE9FB; }
.ishod__naslov { font: 700 40px/48px var(--dm); color: #0E0E0E; }
.k-kartica { border-radius: 10px; background: #fff; box-shadow: inset 0 0 0 1px #E6E6EA; }
.k-oznaka { font: 600 11.5px/16px var(--inter); color: #6B6D7A; text-transform: uppercase; }
.k-kartica--kljuc { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; padding: 26px 32px 36px; }
.k-kartica--kljuc + .k-kartica--kljuc { margin-top: 12px; }
.kljuc { margin-top: 8px; font: 700 26px/32px var(--dm); letter-spacing: .01em; color: #0E0E0E; overflow-wrap: anywhere; }
.kopiraj {
  flex: none; margin: 16px 0 -4px; width: 132px; height: 44px; border: 0; border-radius: 50px; background: #F9F9FA; box-shadow: inset 0 0 0 1px #E6E6EA;
  font: 600 14px/20px var(--inter); color: #0E0E0E; cursor: pointer;
}
.kopiraj:hover { background: #F0F0F4; }
.kopiraj.kopirano { background: #E6F6EF; box-shadow: inset 0 0 0 1px #BFE3D0; color: #0B7A50; }
.k-koraci { list-style: none; counter-reset: kk; display: flex; flex-direction: column; gap: 12px; margin: 36px 0 0; padding: 0; }
.k-koraci li {
  counter-increment: kk; display: grid; grid-template-columns: 28px minmax(0, 1fr); column-gap: 18px; align-content: center; align-items: start;
  min-height: 72px; padding: 2px 30px 0; border-radius: 10px; background: #fff; box-shadow: inset 0 0 0 1px #E6E6EA;
}
.k-koraci li::before {
  content: counter(kk); display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: #EFE9FB;
  font: 600 14px/20px var(--inter); color: #6731C6; grid-row: 1 / span 2; align-self: center; margin-top: -2px;
}
.k-koraci b { font: 600 16px/22px var(--inter); color: #0E0E0E; }
.k-koraci small { margin-top: 2px; padding-bottom: 0; font: 300 14px/20px var(--inter); color: #6E6E76; }
.k-kartica--razlozi { padding: 28px 32px 32px; }
.razlozi { list-style: none; display: flex; flex-direction: column; gap: 10px; margin: 16px 0 0; padding: 0; }
.razlozi li { position: relative; padding-left: 20px; font: 300 15.5px/22px var(--inter); color: #3C3C3C; }
.razlozi li::before { content: ""; position: absolute; left: 0; top: 8px; width: 6px; height: 6px; border-radius: 50%; background: #C4C4CE; }
.k-kartica--uplata { padding: 28px 32px 12px; }
.uplata { display: flex; flex-direction: column; gap: 10px; margin: 16px 0 0; }
.uplata > div { display: grid; grid-template-columns: 220px minmax(0, 1fr); }
.uplata dt { font: 300 15px/22px var(--inter); color: #6B6D7A; }
.uplata dd { margin: 0; font: 500 15px/22px var(--inter); color: #0E0E0E; overflow-wrap: anywhere; }
/* Podaci za uplatu + IPS QR (isto kao u Mom nalogu: kha_lic_podaci_za_uplatu, kha_lic_qr_svg) */
.k-kartica--qr { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 24px; align-items: center; padding-bottom: 24px; }
.k-kartica--qr .uplata > div { grid-template-columns: 170px minmax(0, 1fr); gap: 12px; }
.uplata-qr { display: flex; flex-direction: column; align-items: center; gap: 10px; width: 168px; margin: 0; }
.uplata-qr .qr { display: block; width: 152px; height: 152px; }
.uplata-qr figcaption { font: 400 12.5px/17px var(--inter); color: #5B5C66; text-align: center; text-wrap: pretty; }
.uplata-qr figcaption b { display: block; font-weight: 600; color: #0E0E0E; }
.proizvod { padding: 28px 32px 22px; border-radius: 12px; background: #fff; box-shadow: inset 0 0 0 1px #E6E6EA; }
.proizvod__naslov { display: flex; align-items: center; gap: 10px; font: 700 20px/26px var(--dm); color: #0E0E0E; }
.proizvod__tekst { margin-top: 10px; font: 300 15px/23px var(--inter); color: #3C3C3C; }
.proizvod .k-dugme { margin-top: 26px; }
.proizvod__cena { margin-top: 7px; font: 700 26px/32px var(--dm); color: #0E0E0E; }
.proizvod__mala { margin-top: 6px; padding-bottom: 0; font: 300 13px/18px var(--inter); color: #6B6D7A; }
.kupovina--ishod .kupovina__desno .proizvod:has(.proizvod__cena) { padding-bottom: 18px; }

/* ---------- Probna stranica banke ---------- */
.banka {
  max-width: 560px; margin: 48px auto 0; padding: 36px 36px 32px; border-radius: 14px; background: #fff;
  box-shadow: inset 0 0 0 1px #E6E6EA, 0 16px 40px rgba(20, 15, 51, .08);
}
.banka__oznaka { display: inline-block; padding: 4px 10px; border-radius: 50px; background: #FFF4D6; font: 600 11.5px/16px var(--inter); color: #7A5A00; }
.banka__naslov { margin-top: 14px; font: 700 28px/34px var(--dm); }
.banka__tekst { margin-top: 10px; font: 300 15px/23px var(--inter); color: #3C3C3C; }
.banka__podaci { display: flex; flex-direction: column; gap: 8px; margin: 22px 0 0; padding: 16px 18px; border-radius: 10px; background: #F9F9FA; }
.banka__podaci > div { display: flex; justify-content: space-between; gap: 16px; }
.banka__podaci dt { font: 300 14.5px/21px var(--inter); color: #6E6E76; }
.banka__podaci dd { margin: 0; font: 500 14.5px/21px var(--inter); text-align: right; }
.banka__dugmad { display: flex; flex-direction: column; gap: 12px; margin-top: 24px; }

/* ---------- Tablet i telefon ---------- */
@media (max-width: 1023px) {
  .kupovina__red { grid-template-columns: minmax(0, 1fr); row-gap: 28px; }
  .kupovina__desno { position: static; }
  .kupovina__desno .k-dugme--puno { margin-top: 20px; }
}
@media (max-width: 759px) {
  .kupovina { padding: 28px 0 56px; }
  .koraci-kupovine li { gap: 8px; }
  .koraci-kupovine li:not(:last-child)::after { top: 14px; left: calc(50% + 18px); width: calc(100% - 36px); }
  .koraci-kupovine__krug { width: 30px; height: 30px; font-size: 13px; }
  .koraci-kupovine__naziv { font-size: 12px; line-height: 16px; }
  .kupovina__glave, .ishod { margin-top: 28px; }
  .kupovina__naslov, .ishod__naslov { font-size: 28px; line-height: 34px; }
  .ishod { gap: 14px; }
  .ishod__znak { width: 48px; height: 48px; }
  .kupovina__uvod { font-size: 16px; line-height: 24px; }
  .kupovina__red, .kupovina[data-korak="2"] .kupovina__red { margin-top: 24px; }
  .opcija { min-height: 64px; padding: 0 18px; }
  .opcija--paket, .opcija--placanje { min-height: 0; padding-top: 16px; padding-bottom: 16px; }
  .opcija__naziv { font-size: 17px; }
  .opcija__tekst { margin-left: 14px; }
  .opcija--sluzba .znak { margin-left: 14px; }
  .opcija__tekst b { font-size: 17px; }
  .opcija__cena { font-size: 17px; }
  .kupovina .izbor--paket, .kupovina .izbor--sajtovi { margin-top: 28px; }
  .tip { gap: 12px; }
  .polja { grid-template-columns: minmax(0, 1fr); row-gap: 16px; margin-top: 24px; }
  .porudzbina, .proizvod { padding: 22px 20px; }
  .k-info { padding: 18px 20px; }
  .k-dugmad { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .k-kartica--kljuc { flex-direction: column; padding: 20px; }
  .kljuc { font-size: 18px; line-height: 26px; }
  .kopiraj { margin-top: 4px; width: 100%; }
  .k-koraci li { padding: 14px 18px; }
  .k-kartica--razlozi, .k-kartica--uplata { padding: 20px; }
  .uplata > div { grid-template-columns: 120px minmax(0, 1fr); }
  .k-kartica--qr { grid-template-columns: minmax(0, 1fr); gap: 18px; padding-bottom: 20px; }
  .k-kartica--qr .uplata > div { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .uplata-qr { width: auto; flex-direction: row; gap: 14px; padding-top: 16px; border-top: 1px solid #F0F0F4; }
  .uplata-qr .qr { flex: none; width: 128px; height: 128px; }
  .uplata-qr figcaption { text-align: left; }
  .banka { padding: 24px 20px; }
}

/* Za koliko sajtova (više licenci u jednoj kupovini) */

.sajtovi { display: flex; align-items: center; gap: 20px; padding: 16px 20px; border-radius: 12px; background: #fff; box-shadow: inset 0 0 0 1px #E6E6EA; }
.sajtovi__brojac { display: flex; align-items: center; flex: none; border-radius: 10px; box-shadow: inset 0 0 0 1px #D9D9E0; }
.sajtovi__dugme { width: 44px; height: 44px; padding: 0; border: 0; background: none; font: 500 22px/1 var(--inter); color: #15161C; cursor: pointer; }
.sajtovi__dugme:hover { color: #6731C6; }
.sajtovi__dugme:disabled { color: #C9CAD3; cursor: default; }
.sajtovi__brojac input {
  width: 48px; height: 44px; padding: 0; border: 0; background: none; text-align: center;
  font: 600 17px/1 var(--inter); color: #0E0E0E; -moz-appearance: textfield;
}
.sajtovi__brojac input::-webkit-outer-spin-button, .sajtovi__brojac input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.sajtovi__brojac input:focus { outline: none; }
.sajtovi__brojac:focus-within { box-shadow: inset 0 0 0 1.5px #6731C6; }
.sajtovi__tekst { font: 400 14px/20px var(--inter); color: #4A4A52; }
.dodatni-sajtovi { display: grid; grid-template-columns: 1fr 1fr; column-gap: 24px; row-gap: 20px; }
.dodatni-sajtovi[hidden] { display: none; }
.dodatni-sajtovi__napomena { grid-column: 1 / -1; margin-top: -8px; font: 400 13px/18px var(--inter); color: #6E6E76; }
@media (max-width: 759px) {
  .sajtovi { flex-direction: column; align-items: flex-start; gap: 12px; padding: 14px 16px; }
  .dodatni-sajtovi { grid-template-columns: minmax(0, 1fr); row-gap: 16px; }
}

/* Služba nije izabrana (korak 1 bez ?plugin=): poruka ispod liste i siv tekst u kartici */
.izbor--sluzba.greska .opcija--sluzba:not(:has(input:checked)) { box-shadow: inset 0 0 0 1px #E3A9AB; }
.izbor--sluzba > .polje__greska { margin-top: -4px; font-size: 14px; line-height: 20px; }
.porudzbina__prazno { font-weight: 400; color: #6B6D7A; }
.polje__greska a { color: inherit; font-weight: 600; }

/* Korak 2: veza za prijavu */
.kupovina__prijava { margin-top: 10px; max-width: 860px; font: 400 15px/22px var(--inter); color: #3C3C3C; }
.kupovina__prijava a { color: #6731C6; font-weight: 600; text-underline-offset: 3px; }
.kupovina__prijava a:hover { color: #5626AE; }

/* Telefon: lepljiva traka „Ukupno“ + dugme za nastavak (samo do 759 px, vidi je skripta) */
.traka-kupovine { display: none; }
@media (max-width: 759px) {
  .kupovina--traka { padding-bottom: 104px; }
  .traka-kupovine {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 50; display: flex; align-items: center; gap: 16px;
    padding: 12px 16px calc(12px + env(safe-area-inset-bottom)); background: #fff;
    box-shadow: 0 -1px 0 #E6E6EA, 0 -8px 24px rgba(20, 15, 51, .06);
  }
  .traka-kupovine__ukupno { display: flex; flex-direction: column; flex: none; margin: 0; }
  .traka-kupovine__ukupno span { font: 400 12.5px/16px var(--inter); color: #4A4A52; }
  .traka-kupovine__ukupno strong { font: 700 19px/24px var(--dm); color: #0E0E0E; white-space: nowrap; }
  .traka-kupovine__dugme { flex: 1 1 auto; min-width: 0; height: 50px; padding: 0 18px; font-size: 15px; white-space: nowrap; }
}
.bez-preloma { white-space: nowrap; }

/* ---------- Paket sa stavkama: naslov podebljan, objašnjenje sitnije ispod (stavke iz kha_paketi() u temi) ---------- */
.opcija--paket:has(.opcija__stavke) { align-items: flex-start; padding-top: 22px; padding-bottom: 22px; }
.opcija--paket:has(.opcija__stavke) .opcija__tekst { flex: 1 1 auto; min-width: 0; }
.opcija__stavke { display: grid; gap: 10px; margin-top: 10px; }
.opcija__stavka { display: flex; flex-direction: column; gap: 1px; text-wrap: pretty; }
.opcija__tekst .opcija__stavka b { font: 600 14.5px/20px var(--inter); color: #26262C; }
.opcija__tekst .opcija__stavka small { font: 300 13.5px/19px var(--inter); color: #6E6E76; }

/* ---------- Doplata za Business (korak 1, inc/nadogradnja.php) ---------- */
.kupovina .izbor--doplata { margin-bottom: 40px; }
.opcija--doplata { min-height: 92px; padding-top: 14px; padding-bottom: 14px; }
.opcija--nova { min-height: 76px; }
.opcija__tekst small.opcija__licenca { font-weight: 400; color: #4A4A52; }
.izbor__napomena { padding: 14px 18px; border-radius: 10px; background: #F6F3FD; box-shadow: inset 0 0 0 1px #E4DAF8; font: 400 14px/21px var(--inter); color: #3C3C44; text-wrap: pretty; }
.izbor__napomena a { color: #6731C6; font-weight: 600; }
.izbor__veza { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; text-decoration: none; }
.izbor__veza:hover { text-decoration: underline; }
.izbor__veza span { transition: transform .15s; }
.izbor__veza:hover span { transform: translateX(3px); }
.opcija--zakljucana { cursor: default; }
.opcija--zakljucana:hover { box-shadow: inset 0 0 0 1px #E6E6EA; }
.opcija--zakljucana .opcija__krug { background: #F1F1F4; }
.opcija--zakljucana .opcija__tekst b, .opcija--zakljucana .opcija__cena { color: #8A8A94; }
@media (max-width: 759px) {
  .opcija--paket:has(.opcija__stavke) { padding-top: 16px; padding-bottom: 16px; }
  /* cena gore desno, pored naziva paketa, pa stavke dobijaju celu širinu */
  .opcija--paket:has(.opcija__stavke) .opcija__cena { position: absolute; top: 16px; right: 18px; padding-left: 0; }
  .opcija--paket:has(.opcija__stavke) .opcija__tekst > b { padding-right: 96px; }
  .opcija__stavke { gap: 8px; }
  .opcija__tekst .opcija__stavka b { font-size: 14px; line-height: 19px; }
  .opcija__tekst .opcija__stavka small { font-size: 13px; line-height: 18px; }
  .kupovina .izbor--doplata { margin-bottom: 28px; }
  .opcija--doplata { align-items: flex-start; }
  .opcija--doplata .opcija__cena { position: absolute; top: 14px; right: 18px; padding-left: 0; }
  .opcija--doplata .opcija__tekst > b { padding-right: 84px; }
  .izbor__napomena { padding: 12px 14px; font-size: 13.5px; line-height: 20px; }
}