/* ——— Prodavnica (po maketi „Stranica za elastičnu maramu") ——— */
.prodavnica .woocommerce-breadcrumb{font-size:14px;color:var(--blagi);margin-bottom:18px}
.prodavnica .woocommerce-breadcrumb a{color:var(--blagi);text-decoration:none}

/* spisak proizvoda */
ul.products{list-style:none;margin:0;padding:0;display:grid;gap:22px;grid-template-columns:repeat(3,1fr)}
ul.products li.product{background:var(--bela);border:1px solid var(--linija);border-radius:var(--r);overflow:hidden}
ul.products li.product a{text-decoration:none;color:inherit;display:block}
ul.products li.product img{width:100%;aspect-ratio:4/5;object-fit:cover}
ul.products li.product .woocommerce-loop-product__title{font-family:'Cormorant Garamond',serif;font-size:22px;color:var(--mastilo);padding:14px 16px 0}
ul.products li.product .price{display:block;padding:4px 16px 16px;color:var(--tekst);font-size:16px}
@media(max-width:900px){ul.products{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){ul.products{grid-template-columns:1fr}}

/* strana proizvoda */
.single-product div.product{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(22px,3.4vw,52px);align-items:start}
.single-product .woocommerce-product-gallery{border-radius:var(--r);overflow:hidden}
.single-product .summary h1{font-size:clamp(28px,3.6vw,40px);margin-bottom:10px}
.single-product .summary .price{font-size:22px;color:var(--mastilo);font-family:'Cormorant Garamond',serif;margin-bottom:16px;display:block}
.single-product .woocommerce-product-details__short-description{color:var(--tekst)}
@media(max-width:900px){.single-product div.product{grid-template-columns:1fr}}

/* izbor boje — kružići sa fotografijom, kao na maketi */
.boje{margin-top:22px}
.boje-naslov,.dodaci-naslov{font-family:'Cormorant Garamond',serif;font-size:22px;color:var(--mastilo);margin-bottom:12px}
.boje ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.boje li{text-align:center;font-size:13.5px;color:var(--tekst)}
.boje .krug{width:64px;height:64px;border-radius:50%;margin:0 auto 6px;overflow:hidden;border:2px solid transparent;cursor:pointer}
.boje li[aria-selected="true"] .krug{border-color:var(--zelena)}
@media(max-width:560px){.boje ul{grid-template-columns:repeat(3,1fr)}}

/* dodaci uz maramu */
.dodaci{margin:24px 0 18px;display:grid;gap:10px}
.dodatak{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;
  background:var(--bela);border:1px solid var(--linija);border-radius:12px;padding:12px 16px;cursor:pointer}
.dodatak input{width:20px;height:20px;accent-color:var(--zelena)}
.dodatak-tekst b{font-family:'Cormorant Garamond',serif;font-size:19px;color:var(--mastilo);display:block;font-weight:600}
.dodatak-tekst small{color:var(--blagi);font-size:13.5px}
.dodatak-cena{white-space:nowrap;color:var(--tekst)}
.personalizacija{background:var(--krem-2);border-radius:12px;padding:14px 16px;display:grid;gap:10px}
.personalizacija input[type=text]{width:100%;padding:11px 13px;border:1px solid var(--linija);border-radius:10px;background:#fff;font:inherit}
.personalizacija .pismo{display:flex;gap:18px;font-size:14.5px}
.personalizacija .napomena{font-size:13.5px;color:var(--blagi)}

/* dugme i količina */
.single-product form.cart{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:8px}
.single-product .quantity input{width:84px;padding:12px;border:1px solid var(--linija);border-radius:var(--r-pill);text-align:center;font:inherit;background:#fff}
.single-product button.single_add_to_cart_button,
.woocommerce button.button,.woocommerce a.button,.woocommerce input.button{
  background:var(--zelena);color:#fff;border:0;border-radius:var(--r-pill);padding:14px 30px;font:inherit;cursor:pointer}
.woocommerce button.button:hover,.woocommerce a.button:hover,.single-product button.single_add_to_cart_button:hover{background:var(--zelena-tamna)}

/* traka poverenja ispod dugmeta */
.poverenje-proizvod{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:22px;
  border-top:1px solid var(--linija);padding-top:16px;font-size:13.5px;color:var(--tekst)}
.poverenje-proizvod div{display:flex;gap:9px;align-items:flex-start}
.poverenje-proizvod svg{color:var(--braon);flex:none}

/* padajuće sekcije (Detalji marame, Recenzije) */
.harmonika{margin-top:26px;border:1px solid var(--linija);border-radius:var(--r);background:var(--bela);overflow:hidden}
.harmonika summary{list-style:none;cursor:pointer;padding:16px 20px;display:flex;align-items:center;gap:12px;
  font-family:'Cormorant Garamond',serif;font-size:22px;color:var(--mastilo)}
.harmonika summary::-webkit-details-marker{display:none}
.harmonika[open] summary{border-bottom:1px solid var(--linija)}
.harmonika .telo{padding:16px 20px}
.harmonika table{width:100%;border-collapse:collapse;font-size:15px}
.harmonika td{padding:9px 6px;border-bottom:1px solid var(--linija)}
.harmonika td:first-child{color:var(--blagi);width:46%}

/* korpa i naplata */
.woocommerce table.shop_table{border:1px solid var(--linija);border-radius:var(--r);border-collapse:separate;overflow:hidden;background:#fff}
.woocommerce table.shop_table th{background:var(--krem-2);font-weight:500}
.woocommerce #respond input#submit.alt,.woocommerce a.button.alt,.woocommerce button.button.alt{background:var(--zelena)}
.woocommerce form .form-row input.input-text,.woocommerce form .form-row textarea,.woocommerce form .form-row select{
  padding:12px 13px;border:1px solid var(--linija);border-radius:10px;background:#fff;font:inherit;width:100%}

/* strane sa tekstom */
.strana-vrh{margin-bottom:22px}
/* 16.10.2026 (vlasnik): tekst strana ide punom širinom omota, ne u uskoj traci levo.
   Da red ne bude predug za čitanje, duži tekst se na širokom ekranu lomi u dve kolone. */
.sadrzaj-strane{max-width:none}
.sadrzaj-strane>p{max-width:none}
.sadrzaj-strane{font-size:17px}
.sadrzaj-strane>h2{margin-top:36px}
.sadrzaj-strane .strana-uvod{font-size:19px;color:var(--mastilo);max-width:none}
.sadrzaj-strane h2{margin:28px 0 10px}
.sadrzaj-strane h3{margin:22px 0 8px}
.sadrzaj-strane p+p{margin-top:12px}
.sadrzaj-strane ul,.sadrzaj-strane ol{margin:12px 0 12px 20px}
.sadrzaj-strane li+li{margin-top:6px}

/* padajući spisak boja ostaje u DOM-u (Woo ga koristi), ali se ne vidi kad rade kružići */
.sakriven-spisak{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.boje li{cursor:pointer}
.boje li:focus-visible{outline:3px solid var(--zelena);outline-offset:3px;border-radius:10px}
.boje .krug{background:var(--krem-2)}

/* 🔴 `display:grid` gazi atribut `hidden` — bez ovoga polje za ime stoji otvoreno
   i pre nego što je personalizacija izabrana (izmereno na živoj strani). */
.personalizacija[hidden]{display:none}

/* ——— galerija ——— */
.galerija-glavna{border:1px solid var(--linija);border-radius:var(--r);overflow:hidden;background:var(--bela)}
.galerija-glavna img{width:100%;aspect-ratio:4/5;object-fit:cover}
.galerija-slicice{list-style:none;margin:12px 0 0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
.galerija-slicice button{padding:0;border:2px solid transparent;border-radius:10px;overflow:hidden;background:none;cursor:pointer;display:block;width:100%}
.galerija-slicice button[aria-current]{border-color:var(--zelena)}
.galerija-slicice img{width:100%;aspect-ratio:4/5;object-fit:cover;display:block}
.galerija--prazna{border:1px dashed var(--linija);border-radius:var(--r);padding:28px;text-align:center;color:var(--blagi);background:var(--krem-2)}

/* 🔴 `span` je inline — bez display:block visina i širina kružića se ignorišu
   (izmereno: kružići su bili tanke crtice). */
.boje .krug{display:block}
.boje ul{margin-top:4px}

/* sitnice koje maketa nema */
.single-product .product_meta{display:none}

/* boja bez fotografije — prazan kružić, bez tuđe slike */
.boje .krug--prazan{background:repeating-linear-gradient(45deg,var(--krem-2) 0 8px,var(--krem) 8px 16px);border:1px dashed var(--linija)}

/* ——— vrh kolekcije ——— */
.kolekcija-vrh{padding-bottom:0}
.kolekcija-vrh h1{margin-top:6px}
.kolekcija-uvod{margin-top:12px;max-width:none;color:var(--blagi);font-size:17px}
.prodavnica .woocommerce-result-count,.prodavnica .woocommerce-ordering{display:none}

/* kartica proizvoda u mreži */
ul.products li.product{transition:transform .2s ease,box-shadow .2s ease}
ul.products li.product:hover{transform:translateY(-3px);box-shadow:var(--senka,0 14px 38px rgba(46,42,37,.08))}
ul.products li.product .price{font-family:'Cormorant Garamond',serif;font-size:19px;color:var(--mastilo)}
ul.products li.product .button{margin:0 16px 16px;display:inline-block;font-size:14px;padding:10px 20px}
ul.products li.product .onsale{display:none}

/* blok „Prvi put koristite maramu?" na strani proizvoda */
.uputstvo-proizvod{margin-top:clamp(28px,4vw,48px);background:var(--krem-2);border-radius:var(--r);
  padding:clamp(20px,3vw,34px);display:grid;grid-template-columns:1fr 1fr;gap:clamp(18px,3vw,36px);align-items:center}
.uputstvo-proizvod h3{font-size:clamp(22px,2.6vw,28px);margin-bottom:10px}
.uputstvo-proizvod p{color:var(--tekst)}
.uputstvo-proizvod .velicine{background:var(--bela);border-radius:12px;padding:16px 18px}
.uputstvo-proizvod .velicine b{font-family:'Cormorant Garamond',serif;font-size:19px;color:var(--mastilo);display:block;margin-bottom:4px}
.uputstvo-proizvod .velicine p+b{margin-top:12px}
/* kad marama nema izbor veličine, blok ostaje sam i ide punom širinom */
.uputstvo-proizvod--sam{grid-template-columns:1fr}
@media(max-width:820px){.uputstvo-proizvod{grid-template-columns:1fr}}

/* ——— „Naše boje" na strani kolekcije ——— */
.nase-boje{margin-top:clamp(34px,5vw,60px)}
.nase-boje h2{margin-bottom:8px}
.nase-boje ul{list-style:none;margin:22px 0 0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
.nase-boje a{display:block;text-decoration:none;color:inherit}
.nase-boje img,.nase-boje .bez-slike{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:var(--r);display:block}
.nase-boje .bez-slike{background:repeating-linear-gradient(45deg,var(--krem-2) 0 10px,var(--krem) 10px 20px);border:1px dashed var(--linija)}
.nase-boje .ime{display:block;margin-top:8px;font-size:15px;color:var(--tekst);text-align:center}
.nase-boje a:hover img{filter:brightness(.96)}
@media(max-width:900px){.nase-boje ul{grid-template-columns:repeat(3,1fr)}}
@media(max-width:560px){.nase-boje ul{grid-template-columns:repeat(2,1fr)}}

/* ——— prazna korpa (Woo markup: poruka pa dugme) ——— */
.woocommerce .cart-empty{font-size:17px;color:var(--tekst);margin-bottom:18px}
.woocommerce .return-to-shop{margin-top:6px}
.woocommerce .return-to-shop .button{display:inline-block}

/* ——— korpa ——— */
.woocommerce table.cart img{width:84px;border-radius:10px}
.woocommerce table.cart td,.woocommerce table.cart th{padding:14px 12px;vertical-align:middle}
.woocommerce table.cart .product-name a{color:var(--mastilo);text-decoration:none;font-family:'Cormorant Garamond',serif;font-size:19px}
.woocommerce table.cart dl.variation{margin:6px 0 0;font-size:13.5px;color:var(--blagi)}
.woocommerce table.cart dl.variation dt,.woocommerce table.cart dl.variation dd{display:inline;margin:0}
.woocommerce .cart_totals h2,.woocommerce-checkout h3{font-size:clamp(22px,2.6vw,28px);margin-bottom:12px}
.woocommerce .cart-collaterals{margin-top:28px}
.woocommerce .cart_totals table{width:100%;background:#fff;border:1px solid var(--linija);border-radius:var(--r)}
.woocommerce .actions .button{white-space:nowrap}

/* ——— naplata u dve kolone ——— */
.woocommerce-checkout form.checkout{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(20px,3vw,44px);align-items:start}
.woocommerce-checkout #customer_details{grid-column:1}
.woocommerce-checkout #order_review_heading,.woocommerce-checkout #order_review{grid-column:2}
.woocommerce-checkout .woocommerce-billing-fields,.woocommerce-checkout #order_review{
  background:var(--bela);border:1px solid var(--linija);border-radius:var(--r);padding:clamp(16px,2.4vw,26px)}
.woocommerce-checkout .form-row{margin-bottom:14px}
.woocommerce-checkout label{display:block;font-size:14.5px;color:var(--tekst);margin-bottom:6px}
.woocommerce-checkout .woocommerce-shipping-totals td,.woocommerce-checkout .order-total td{font-weight:500}
.woocommerce-checkout #payment ul.payment_methods{list-style:none;margin:0 0 16px;padding:0;display:grid;gap:10px}
.woocommerce-checkout #payment li{background:var(--krem-2);border-radius:12px;padding:12px 14px}
.woocommerce-checkout #place_order{width:100%;font-size:16px;padding:16px 24px}
@media(max-width:900px){
  .woocommerce-checkout form.checkout{grid-template-columns:1fr}
  .woocommerce-checkout #customer_details,.woocommerce-checkout #order_review_heading,.woocommerce-checkout #order_review{grid-column:1}
  .woocommerce table.cart thead{display:none}
  .woocommerce table.cart tr{display:grid;grid-template-columns:84px 1fr;gap:10px;border-bottom:1px solid var(--linija);padding:12px 0}
  .woocommerce table.cart td{border:0;padding:2px 0}
  .woocommerce table.cart td.product-remove{grid-column:2;justify-self:end}
}

/* razmak ispod zbira korpe (dugme se naslanjalo na red „Ukupno") */
.woocommerce .cart_totals .wc-proceed-to-checkout{margin-top:16px;padding:0}
.woocommerce .cart_totals table{margin-bottom:6px}
.woocommerce .coupon{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.woocommerce .coupon input[type="text"]{padding:12px 14px;border:1px solid var(--linija);border-radius:var(--r-pill);background:#fff;font:inherit;min-width:180px}

/* ——— 16.10.2026: slike na stranama (vlasnik: „stilizuj stranice dodavanjem slika") ——— */
.sadrzaj-strane .slika-strane{margin:26px 0 30px}
.sadrzaj-strane .slika-strane img{width:100%;border-radius:var(--r);box-shadow:0 10px 30px rgb(46 42 37 / .12)}
.sadrzaj-strane .slika-strane figcaption{margin-top:9px;font-size:14.5px;color:var(--blagi)}

/* Predstavljanje osobe: portret sa strane, tekst uz njega. */
.sadrzaj-strane .predstavljanje{display:grid;grid-template-columns:300px 1fr;gap:clamp(18px,3vw,38px);
  align-items:start;margin:30px 0 34px;padding-bottom:30px;border-bottom:1px solid var(--linija)}
.sadrzaj-strane .predstavljanje:last-of-type{border-bottom:0}
.sadrzaj-strane .predstavljanje--nikola{grid-template-columns:1fr 300px}
.sadrzaj-strane .predstavljanje--nikola .portret{order:2}
.sadrzaj-strane .portret{margin:0}
.sadrzaj-strane .portret img{width:100%;border-radius:var(--r);box-shadow:0 10px 26px rgb(46 42 37 / .14)}
.sadrzaj-strane .predstavljanje__tekst>h3{margin-top:0}
.sadrzaj-strane .predstavljanje__tekst p+p{margin-top:12px}
@media(max-width:820px){
  .sadrzaj-strane .predstavljanje,
  .sadrzaj-strane .predstavljanje--nikola{grid-template-columns:1fr}
  .sadrzaj-strane .predstavljanje--nikola .portret{order:0}
  .sadrzaj-strane .portret img{max-width:420px;margin-inline:auto}
}

/* ——— 16.10.2026: strana proizvoda — detalji punom širinom, povezani proizvodi na dnu ——— */
.single-product .harmonika--puna,
.single-product .uputstvo-proizvod,
.single-product .povezani{grid-column:1 / -1}
.single-product .harmonika--puna .telo{max-width:none}
.single-product .harmonika--puna table{max-width:none}
.povezani{margin-top:clamp(30px,5vw,56px)}
.povezani h2{font-size:clamp(23px,3vw,32px);margin-bottom:18px}
.povezani ul.products{grid-template-columns:repeat(3,1fr)}
@media(max-width:900px){.povezani ul.products{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.povezani ul.products{grid-template-columns:1fr}}

/* ——— 16.10.2026: kontakt obrazac ——— */
/* 🔴 Pravilo vlasnika 16.10.2026: sadržaj ide PUNOM širinom omota, bez `max-width`. */
.obrazac-kontakt{margin-top:22px;max-width:none}
.obrazac-kontakt .obrazac-red{display:grid;grid-template-columns:1fr 1fr;gap:18px}
@media(min-width:1100px){.obrazac-kontakt .obrazac-red{grid-template-columns:1fr 1fr 1fr}
  .obrazac-kontakt .obrazac-red .polje:nth-child(3){grid-column:3}}
@media(max-width:620px){.obrazac-kontakt .obrazac-red{grid-template-columns:1fr}}
.obrazac-kontakt .polje{margin:0 0 16px}
.obrazac-kontakt label{display:block;font-size:14.5px;color:var(--blagi);margin-bottom:6px}
.obrazac-kontakt label small{color:var(--blagi);font-size:13px}
.obrazac-kontakt input[type=text],.obrazac-kontakt input[type=email],.obrazac-kontakt input[type=tel],
.obrazac-kontakt select,.obrazac-kontakt textarea{
  width:100%;padding:13px 14px;border:1px solid var(--linija);border-radius:12px;background:#fff;
  font:inherit;color:var(--mastilo);transition:border-color .18s ease,box-shadow .18s ease}
.obrazac-kontakt input:focus,.obrazac-kontakt select:focus,.obrazac-kontakt textarea:focus{
  outline:none;border-color:var(--zelena);box-shadow:0 0 0 3px rgb(125 140 106 / .18)}
.obrazac-kontakt textarea{resize:vertical;min-height:150px}
.obrazac-kontakt .polje--mamac{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.obrazac-kontakt .polje--pristanak label{display:flex;gap:10px;align-items:flex-start;color:var(--tekst);font-size:14.5px}
.obrazac-kontakt .polje--pristanak input{margin-top:3px;accent-color:var(--zelena)}
.obrazac-ishod{padding:13px 16px;border-radius:12px;margin-bottom:18px;font-size:15px}
.obrazac-ishod--ok{background:var(--zelena-svetla);border:1px solid var(--zelena);color:var(--zelena-tamna)}
.obrazac-ishod--greska{background:var(--roze-svetla);border:1px solid var(--roze);color:#8c4a44}

/* ——— 16.10.2026: jasno izabrana boja ——— */
.boje li .krug{transition:border-color .2s ease,transform .2s ease,box-shadow .2s ease}
.boje li:hover .krug{transform:translateY(-2px)}
.boje li[aria-selected="true"] .krug,
.boje li.izabrana .krug{
  border:3px solid var(--roze);
  box-shadow:0 0 0 3px var(--roze-svetla),0 6px 16px -8px rgb(46 42 37 / .5)}
.boje li.izabrana{color:var(--mastilo);font-weight:600}
.boje li.izabrana .krug::after{
  content:"✓";position:absolute;right:-2px;bottom:-2px;width:22px;height:22px;border-radius:50%;
  background:var(--roze);color:#fff;font-size:13px;line-height:22px;text-align:center;
  box-shadow:0 2px 6px rgb(46 42 37 / .35)}
.boje li{position:relative}
.boje li .krug{position:relative;overflow:visible}
.boje li .krug{background-clip:padding-box}
.boje-izabrano{margin-top:12px;font-size:15px;color:var(--mastilo)}
.boje-izabrano:empty{display:none}

/* ——— 16.10.2026: uvećanje fotografije ——— */
.uvecanje{position:fixed;inset:0;z-index:9999;background:rgb(26 22 20 / .92);
  display:none;align-items:center;justify-content:center;padding:28px}
.uvecanje[data-otvoren]{display:flex}
.uvecanje__slika{max-width:min(94vw,1200px);max-height:92vh;object-fit:contain;border-radius:10px;
  box-shadow:0 30px 70px -30px #000;cursor:zoom-out}
.uvecanje__zatvori{position:absolute;top:18px;right:22px;width:46px;height:46px;border-radius:50%;
  border:0;background:rgb(255 255 255 / .14);color:#fff;font-size:30px;line-height:1;cursor:pointer}
.uvecanje__zatvori:hover{background:rgb(255 255 255 / .26)}
.uvecanje__strelica{position:absolute;top:50%;transform:translateY(-50%);width:54px;height:54px;
  border-radius:50%;border:0;background:rgb(255 255 255 / .14);color:#fff;font-size:34px;line-height:1;cursor:pointer}
.uvecanje__strelica:hover{background:rgb(255 255 255 / .26)}
.uvecanje__strelica--nazad{left:20px}
.uvecanje__strelica--napred{right:20px}
@media(max-width:620px){
  .uvecanje__strelica{width:44px;height:44px;font-size:28px}
  .uvecanje__zatvori{top:10px;right:12px}
}
.galerija-glavna img{cursor:zoom-in}
