/*
 * Despot Militari: stranica pojedinačnog proizvoda.
 * Sadržaj: 1 tokeni, 2 strana i raspored, 3 galerija, 4 sažetak (kategorija,
 * naslov, cena, zalihe, kratak opis), 5 forma za kupovinu i varijacije,
 * 6 blok poverenja i meta, 7 tabovi, 8 povezani proizvodi, 9 mobilna traka,
 * 10 pristupačnost.
 *
 * Specifičnost: Astra/Woo pravila za galeriju i sažetak imaju id i četiri
 * klase (npr. `.woocommerce #content .ast-woocommerce-container div.product
 * div.images`). Zato je koren naših pravila `body.dm-product` (klasu dodaje
 * product.php), a za širine i miniature uz njega ide `.woocommerce #content`.
 * Bez !important, osim gde Woo JS upisuje inline stil (označeno).
 */

/* ==========================================================================
   1. Tokeni
   ========================================================================== */
:root {
	--dm-pdp-gap: var(--dm-space-5);
	--dm-pdp-top: calc(var(--dm-header-h, 72px) + var(--wp-admin--admin-bar--height, 0px) + var(--dm-space-4));
	--dm-pdp-thumb: 64px;
	--dm-pdp-buybar-h: 68px;
}

@media (min-width: 600px) {
	:root { --dm-pdp-thumb: 72px; }
}

@media (min-width: 922px) {
	:root { --dm-pdp-gap: var(--dm-space-6); }
}

/* ==========================================================================
   2. Strana i raspored
   ========================================================================== */
/* Astra ovde pravi belu kutiju sa velikim uvlačenjem; proizvod stoji na svetloj podlozi. */
body.dm-product.woocommerce.ast-separate-container .ast-woocommerce-container {
	padding: 0;
	background: none;
}

body.dm-product.woocommerce #content > .ast-container {
	box-sizing: border-box;
	display: block;
	max-width: 1240px;
	padding: 0 clamp(16px, 4vw, 40px);
}

body.dm-product.woocommerce #primary.content-area {
	/* Više vazduha ispod headera i iznad footera. */
	margin: clamp(24px, 3vw, 40px) 0 clamp(48px, 6vw, 88px);
	padding: 0;
	border: 0;
}

body.dm-product .woocommerce-breadcrumb {
	margin: 0 0 var(--dm-space-4);
	font-family: var(--dm-font-mono);
	font-size: 0.6875rem;
	line-height: 1.5;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--dm-text-muted);
}

body.dm-product .woocommerce-breadcrumb a {
	color: var(--dm-text-muted);
	text-decoration: none;
}

body.dm-product .woocommerce-breadcrumb a:hover {
	color: var(--dm-gold-ink);
	text-decoration: underline;
}

/* Proizvod je jedna kolona: gornji deo (galerija i sažetak), tabovi i povezani
   proizvodi. Astra mu daje belu podlogu bez unutrašnjeg razmaka, pa je tekst
   stajao uz samu ivicu; podloga se uklanja i sadržaj leži na boji stranice. */
body.dm-product.woocommerce #content div.product {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	align-items: start;
	row-gap: clamp(40px, 5vw, 72px);
	width: 100%;
	margin: 0;
	padding: 0;
	background: transparent;
}

/* Gornji deo: galerija, sažetak i opis u sopstvenom omotaču (inc/product.php).
   Omotač je potreban zbog lepljenja sažetka: bez njega se sažetak lepi do
   kraja celog proizvoda i prelazi preko povezanih proizvoda. */
body.dm-product .dm-pdp-top {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	align-items: start;
	gap: var(--dm-pdp-gap);
	min-width: 0;
}

/* Astra/Woo ::before i ::after (display: table) bi u rešetki zauzeli ćelije. */
body.dm-product.woocommerce #content div.product::before,
body.dm-product.woocommerce #content div.product::after {
	content: none;
	display: none;
}

body.dm-product.woocommerce #content div.product div.images,
body.dm-product.woocommerce #content div.product div.summary {
	float: none;
	box-sizing: border-box;
	width: auto;
	min-width: 0;
	margin: 0;
}

body.dm-product.woocommerce #content div.product > .woocommerce-tabs,
body.dm-product.woocommerce #content div.product > section {
	grid-column: 1 / -1;
}

@media (min-width: 922px) {
	body.dm-product .dm-pdp-top {
		grid-template-columns: minmax(0, 11fr) minmax(0, 9fr); /* 55 / 45 */
		row-gap: clamp(40px, 5vw, 72px);
	}

	/* Leva kolona: galerija pa opis. Desna: sažetak kroz oba reda, pa se lepi
	   dok se skroluju i galerija i opis, a staje gde se omotač završava. */
	body.dm-product .dm-pdp-top > .woocommerce-product-gallery {
		grid-column: 1;
		grid-row: 1;
	}

	body.dm-product .dm-pdp-top > .woocommerce-tabs {
		grid-column: 1;
		grid-row: 2;
	}

	body.dm-product .dm-pdp-top > .summary {
		grid-column: 2;
		grid-row: 1 / span 2;
	}

	/* Sažetak se lepi ispod headera dok se galerija skroluje. product.js dodaje
	   klasu samo kad sažetak stane u ekran; viši bi inače bio nedostupan. */
	body.dm-product.woocommerce #content div.product.dm-summary-sticky div.summary {
		position: sticky;
		top: var(--dm-pdp-top);
	}
}

/* ==========================================================================
   3. Galerija
   Okvir je bela površina sa tankom ivicom; slika je uvek cela (contain), u
   kvadratu, pa visina ne zavisi od slike i sadržaj ispod ne skače. Woo sakriva
   galeriju (opacity 0) dok slajder ne krene; to ostaje, bez naše animacije.
   ========================================================================== */
body.dm-product div.product .woocommerce-product-gallery {
	position: relative;
}

/* Okvir: pre pokretanja slajdera (ili bez njega) je omotač direktno u galeriji,
   a posle toga je to .flex-viewport u kome klizi omotač. */
body.dm-product div.product .woocommerce-product-gallery > .woocommerce-product-gallery__wrapper,
body.dm-product div.product .woocommerce-product-gallery .flex-viewport {
	box-sizing: border-box;
	overflow: hidden;
	background: var(--dm-surface-light);
	border: 1px solid var(--dm-line);
	border-radius: var(--dm-radius);
}

/* Pre slajdera su sve slike naslagane; samo prva je vidljiva, da strana ne skoči. */
body.dm-product div.product .woocommerce-product-gallery > .woocommerce-product-gallery__wrapper {
	aspect-ratio: 1;
}

body.dm-product div.product .woocommerce-product-gallery > .woocommerce-product-gallery__wrapper > .woocommerce-product-gallery__image:not(:first-child) {
	display: none;
}

/* Visinu okvira Woo JS upisuje inline (jednom, pri učitavanju), pa se pri
   okretanju telefona ne bi uskladila sa širinom. Zato !important. */
body.dm-product div.product .woocommerce-product-gallery .flex-viewport {
	height: auto !important;
	aspect-ratio: 1;
	margin-bottom: var(--dm-space-3);
}

body.dm-product div.product .woocommerce-product-gallery__image img {
	display: block;
	box-sizing: border-box;
	width: 100%;
	height: auto;
	aspect-ratio: 1;
	margin: 0;
	object-fit: contain; /* nijedna slika se ne seče */
}

body.dm-product div.product .woocommerce-product-gallery__image a {
	display: block;
}

body.dm-product div.product .woocommerce-product-gallery__image a:focus-visible {
	outline-offset: -4px; /* okvir seče spoljni obris */
}

/* Rezerva za red miniatura dok slajder nije pokrenut (samo kad ima više slika). */
body.dm-product div.product .woocommerce-product-gallery:not(:has(.flex-viewport)):has(.woocommerce-product-gallery__image + .woocommerce-product-gallery__image)::after {
	content: "";
	display: block;
	height: calc(var(--dm-pdp-thumb) + var(--dm-space-3) + 8px);
}

/* Miniature: jedan red sa horizontalnim skrolom, fiksne visine. */
body.dm-product.woocommerce #content div.product .flex-control-thumbs {
	display: flex;
	gap: 8px;
	margin: 0;
	padding: 4px; /* mesta za obris fokusa i izabrane */
	overflow-x: auto;
	list-style: none;
	scroll-snap-type: x proximity;
	scrollbar-width: thin;
	scrollbar-color: var(--dm-line) transparent;
}

body.dm-product.woocommerce #content div.product .flex-control-thumbs li {
	flex: 0 0 var(--dm-pdp-thumb);
	float: none;
	clear: none;
	width: var(--dm-pdp-thumb);
	margin: 0;
	scroll-snap-align: start;
}

body.dm-product.woocommerce #content div.product .flex-control-thumbs li img {
	display: block;
	box-sizing: border-box;
	width: 100%;
	height: auto;
	aspect-ratio: 1;
	object-fit: contain;
	background: var(--dm-surface-light);
	border: 1px solid var(--dm-line);
	border-radius: var(--dm-radius-sm);
	opacity: 0.6;
	cursor: pointer;
	transition: opacity var(--dm-dur-color) var(--dm-ease), border-color var(--dm-dur-color) var(--dm-ease), box-shadow var(--dm-dur-color) var(--dm-ease);
}

body.dm-product.woocommerce #content div.product .flex-control-thumbs li img:hover {
	opacity: 1;
	border-color: var(--dm-border-strong);
}

/* Izabrana: pun prikaz i zlatna dvostruka ivica. */
body.dm-product.woocommerce #content div.product .flex-control-thumbs li img.flex-active {
	opacity: 1;
	border-color: var(--dm-gold-ink);
	box-shadow: 0 0 0 1px var(--dm-gold-ink);
}

/* Dugme za uvećanje: kvadrat sa tankom ivicom i našom ikonicom (maska, kao u kartici). */
body.dm-product.woocommerce div.product div.images .woocommerce-product-gallery__trigger {
	top: var(--dm-space-2);
	right: var(--dm-space-2);
	box-sizing: border-box;
	width: 2.75rem;
	height: 2.75rem;
	color: var(--dm-text-on-light);
	background: var(--dm-surface-light);
	border: 1px solid var(--dm-line);
	border-radius: var(--dm-radius);
	transition: border-color var(--dm-dur-color) var(--dm-ease), transform var(--dm-dur-press) var(--dm-ease);
}

body.dm-product.woocommerce div.product div.images .woocommerce-product-gallery__trigger:hover {
	border-color: var(--dm-border-strong);
}

body.dm-product.woocommerce div.product div.images .woocommerce-product-gallery__trigger:active {
	transform: scale(var(--dm-press-scale));
}

body.dm-product.woocommerce div.product div.images .woocommerce-product-gallery__trigger::before {
	content: "";
	position: absolute;
	inset: 0;
	display: block;
	width: 1.25rem;
	height: 1.25rem;
	margin: auto;
	background: currentColor;
	border: 0;
	border-radius: 0;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round'%3E%3Ccircle cx='10.5' cy='10.5' r='6'/%3E%3Cpath d='m15 15 5 5M10.5 8v5M8 10.5h5'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round'%3E%3Ccircle cx='10.5' cy='10.5' r='6'/%3E%3Cpath d='m15 15 5 5M10.5 8v5M8 10.5h5'/%3E%3C/svg%3E") center / contain no-repeat;
}

body.dm-product.woocommerce div.product div.images .woocommerce-product-gallery__trigger::after {
	content: none;
}

/* WooCommerce u dugme upisuje znak lupe (emoji), koji WordPress zameni
   sličicom. Ona je stajala preko naše ikonice, pa je lupa izgledala
   polomljeno. Sadržaj dugmeta se sakriva; ikonicu crta ::before iznad. */
body.dm-product.woocommerce div.product div.images .woocommerce-product-gallery__trigger {
	font-size: 0;
	text-indent: 0;
	overflow: hidden;
}

body.dm-product.woocommerce div.product div.images .woocommerce-product-gallery__trigger > * {
	display: none;
}

/* Okvir fokusa samo pri kretanju tastaturom, ne posle klika mišem. */
body.dm-product.woocommerce div.product div.images .woocommerce-product-gallery__trigger:focus {
	outline: none;
}

body.dm-product.woocommerce div.product div.images .woocommerce-product-gallery__trigger:focus-visible {
	outline: 2px solid var(--dm-gold);
	outline-offset: 2px;
}

/* ==========================================================================
   4. Sažetak
   ========================================================================== */
body.dm-product div.product div.summary .single-product-category {
	display: block;
	margin: 0 0 var(--dm-space-2);
	font-family: var(--dm-font-mono);
	font-size: 0.6875rem;
	line-height: 1.4;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--dm-text-muted);
}

body.dm-product div.product div.summary .single-product-category a {
	color: var(--dm-text-muted);
	text-decoration: none;
}

body.dm-product div.product div.summary .single-product-category a:hover {
	color: var(--dm-gold-ink);
	text-decoration: underline;
}

body.dm-product div.product .product_title {
	margin: 0 0 var(--dm-space-3);
	padding: 0;
	font-size: clamp(1.875rem, 3.4vw, 2.75rem);
	line-height: 1.02;
	letter-spacing: -0.01em;
	color: var(--dm-text-on-light);
	text-wrap: balance;
	overflow-wrap: break-word;
}

/* Ocena: samo kad postoji (Woo bez recenzija ne ispisuje ništa). */
body.dm-product div.product .woocommerce-product-rating {
	display: flex;
	align-items: center;
	gap: var(--dm-space-2);
	margin: 0 0 var(--dm-space-3);
}

body.dm-product div.product .woocommerce-product-rating .star-rating {
	float: none;
	margin: 0;
	font-size: 0.9375rem;
	color: var(--dm-gold-ink);
}

body.dm-product div.product .woocommerce-review-link {
	font-size: 0.875rem;
	color: var(--dm-text-muted);
}

/* Cena i bedž popusta u istom redu. */
body.dm-product div.product .dm-price-row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--dm-space-2) var(--dm-space-3);
	margin: 0 0 var(--dm-space-3);
}

body.dm-product div.product p.price {
	margin: 0;
	font-family: var(--dm-font-display);
	font-size: clamp(1.875rem, 3.2vw, 2.375rem);
	font-weight: 700;
	line-height: 1.1;
	color: var(--dm-text-on-light);
}

/* Bez cene (npr. varijabilan proizvod bez zaliha) ne ostaje prazan red. */
body.dm-product div.product p.price:empty {
	display: none;
}

body.dm-product div.product p.price del {
	display: inline-block;
	margin-right: 0.4em;
	font-size: 0.6em;
	font-weight: 400;
	color: var(--dm-text-muted);
	opacity: 1;
}

body.dm-product div.product p.price ins {
	font-weight: 700;
	text-decoration: none;
	color: var(--dm-gold-ink);
	background: none;
}

body.dm-product div.product .woocommerce-Price-amount {
	white-space: nowrap;
}

body.dm-product div.product .woocommerce-Price-currencySymbol {
	font-size: 0.6em;
	letter-spacing: 0.06em;
}

/* Isti bedž kao na kartici (shop.css ga veže za rešetku, pa je ovde ponovljen). */
body.dm-product div.product .dm-price-row .dm-badge {
	padding: 0.35em 0.65em;
	font-family: var(--dm-font-mono);
	font-size: 0.75rem;
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--dm-text-on-light);
	background: var(--dm-gold);
	border: 1px solid var(--dm-gold);
	border-radius: var(--dm-radius-sm);
}

/* Zalihe: tiha oznaka sa tačkom; bez zaliha miran blok umesto crvene rečenice. */
body.dm-product div.product .dm-stock {
	display: flex;
	align-items: center;
	gap: var(--dm-space-2);
	margin: 0 0 var(--dm-space-4);
	font-family: var(--dm-font-mono);
	font-size: 0.75rem;
	line-height: 1.4;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--dm-text-on-light);
}

body.dm-product div.product .dm-stock__dot {
	flex: none;
	width: 8px;
	height: 8px;
	background: var(--dm-olive);
	border-radius: 50%;
}

body.dm-product div.product .dm-stock--low {
	color: var(--dm-gold-ink);
}

body.dm-product div.product .dm-stock--low .dm-stock__dot {
	background: var(--dm-gold-ink);
}

body.dm-product div.product .dm-stock--backorder {
	color: var(--dm-text-muted);
}

body.dm-product div.product .dm-stock--out {
	display: block;
	box-sizing: border-box;
	padding: var(--dm-space-4);
	font-family: var(--dm-font-body);
	letter-spacing: 0;
	text-transform: none;
	background: var(--dm-surface-light);
	border: 1px solid var(--dm-line);
	border-radius: var(--dm-radius);
}

body.dm-product div.product .dm-stock--out .dm-stock__state {
	display: flex;
	align-items: center;
	gap: var(--dm-space-2);
	margin: 0 0 var(--dm-space-2);
	font-family: var(--dm-font-display);
	font-size: 1.25rem;
	font-weight: 700;
	line-height: 1.1;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--dm-text-on-light);
}

body.dm-product div.product .dm-stock--out .dm-stock__dot {
	background: var(--dm-border-strong);
}

body.dm-product div.product .dm-stock__ask {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--dm-space-2) var(--dm-space-3);
	margin: 0;
	font-size: 0.9375rem;
	line-height: 1.4;
	color: var(--dm-text-muted);
}

body.dm-product div.product .woocommerce-product-details__short-description {
	margin: 0 0 var(--dm-space-5);
	color: var(--dm-text-on-light);
}

body.dm-product div.product .woocommerce-product-details__short-description > :last-child {
	margin-bottom: 0;
}

/* Kontakt (telefon i Viber): dve tanke dugmadi-linkova, i u bloku zaliha i u poverenju. */
body.dm-product div.product .dm-contact {
	display: inline-flex;
	flex-wrap: wrap;
	gap: var(--dm-space-2);
}

body.dm-product div.product .dm-contact__link {
	display: inline-flex;
	align-items: center;
	box-sizing: border-box;
	min-height: 2.25rem;
	padding: 0 var(--dm-space-3);
	font-size: 0.9375rem;
	font-weight: 600;
	line-height: 1;
	color: var(--dm-text-on-light);
	text-decoration: none;
	white-space: nowrap;
	background: var(--dm-surface-light);
	border: 1px solid var(--dm-border-strong);
	border-radius: var(--dm-radius);
	transition:
		background-color var(--dm-dur-color) var(--dm-ease),
		border-color var(--dm-dur-color) var(--dm-ease),
		transform var(--dm-dur-press) var(--dm-ease);
}

body.dm-product div.product .dm-contact__link:hover {
	background: var(--dm-gold);
	border-color: var(--dm-gold);
}

body.dm-product div.product .dm-contact__link:active {
	transform: scale(var(--dm-press-scale));
}

@media (pointer: coarse) {
	body.dm-product div.product .dm-contact__link {
		min-height: 2.75rem;
	}
}

/* ==========================================================================
   5. Forma za kupovinu i varijacije
   Količina (.quantity / .qty) se ovde samo postavlja u red; njen izgled je
   zajednički deo sajta i ne dira se.
   ========================================================================== */
body.dm-product div.product form.cart::before,
body.dm-product div.product form.cart::after {
	content: none;
	display: none;
}

/* Običan proizvod: količina i dugme u istom redu. */
body.dm-product div.product form.cart:not(.variations_form),
body.dm-product div.product form.cart .woocommerce-variation-add-to-cart {
	display: flex;
	align-items: center;
	gap: var(--dm-space-3);
	margin: 0;
}

body.dm-product div.product form.cart div.quantity {
	flex: none;
	float: none;
	margin: 0;
}

/* Glavno dugme: zlatno, veliko, preko ostatka reda (boje daje main.css). */
body.dm-product div.product form.cart .button.single_add_to_cart_button {
	flex: 1 1 auto;
	float: none;
	box-sizing: border-box;
	width: auto;
	min-width: 0;
	min-height: 3.25rem; /* 52px */
	margin: 0;
	padding: 0.7em 1.4em;
	font-size: 1.125rem;
}

/* Astra uvlači dugme kad je količina skrivena (jedan komad po porudžbini). */
body.dm-product div.product .sold-individually .button.single_add_to_cart_button {
	margin-left: 0;
}

/* Varijacije: tabela postaje složeni redovi (labela iznad, izbor ispod). */
body.dm-product div.product form.cart table.variations,
body.dm-product div.product form.cart table.variations tbody,
body.dm-product div.product form.cart table.variations tr,
body.dm-product div.product form.cart table.variations th,
body.dm-product div.product form.cart table.variations td {
	display: block;
	box-sizing: border-box;
	width: 100%;
	margin: 0;
	padding: 0;
	border: 0;
}

body.dm-product div.product form.cart table.variations {
	margin-bottom: var(--dm-space-3);
}

body.dm-product div.product form.cart table.variations tr {
	margin-bottom: var(--dm-space-3);
}

body.dm-product div.product form.cart table.variations label {
	display: block;
	margin: 0 0 var(--dm-space-1);
	font-family: var(--dm-font-display);
	font-size: 1rem;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--dm-text-on-light);
}

body.dm-product div.product form.cart table.variations select {
	display: block;
	box-sizing: border-box;
	width: 100%;
	max-width: 100%;
	min-width: 0;
	min-height: 3rem;
	padding: 0 2.5rem 0 var(--dm-space-3);
	font-size: 1rem;
	background: var(--dm-surface-light) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231A1C16' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") right 0.75rem center / 1.25rem no-repeat;
	-webkit-appearance: none;
	appearance: none;
	cursor: pointer;
}

/* „Ukloni": Astra ga resetuje sa all: initial i sakriva (visibility) dok nema izbora.
   Visibility čuva mesto, pa se ništa ne pomera kad se pojavi. */
body.dm-product div.product form.cart .reset_variations {
	display: inline-block;
	min-height: 1.5rem;
	margin-top: var(--dm-space-1);
	font-family: var(--dm-font-body);
	font-size: 0.8125rem;
	line-height: 1.5rem;
	color: var(--dm-text-muted);
	text-decoration: underline;
	text-underline-offset: 0.2em;
	text-transform: none;
	opacity: 1;
	cursor: pointer;
}

body.dm-product div.product form.cart .reset_variations:hover {
	color: var(--dm-gold-ink);
}

/* Cena i dostupnost izabrane varijacije: mesto je rezervisano, pa raspored
   ne skače kad Woo upiše (ili sakrije) sadržaj. */
body.dm-product div.product form.cart .single_variation_wrap .single_variation {
	min-height: 3rem;
	margin: 0 0 var(--dm-space-3);
	padding: 0;
	border: 0;
}

body.dm-product div.product form.cart .single_variation_wrap p {
	margin-bottom: var(--dm-space-2);
}

body.dm-product div.product .woocommerce-variation-price .price {
	font-family: var(--dm-font-display);
	font-size: 1.5rem;
	font-weight: 700;
	line-height: 1.2;
	color: var(--dm-text-on-light);
}

body.dm-product div.product .woocommerce-variation-price .price del {
	font-size: 0.7em;
	font-weight: 400;
	color: var(--dm-text-muted);
	opacity: 1;
}

body.dm-product div.product .woocommerce-variation-price .price ins {
	text-decoration: none;
	color: var(--dm-gold-ink);
	background: none;
}

body.dm-product div.product .woocommerce-variation-description {
	font-size: 0.9375rem;
	color: var(--dm-text-muted);
}

/* Woo „na stanju / nema na stanju" za varijaciju: tiho, bez crvene i zelene. */
body.dm-product div.product p.stock {
	margin: 0 0 var(--dm-space-2);
	font-family: var(--dm-font-mono);
	font-size: 0.75rem;
	line-height: 1.4;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--dm-text-on-light);
}

body.dm-product div.product p.stock.out-of-stock {
	color: var(--dm-text-muted);
}

body.dm-product div.product p.stock:empty {
	display: none;
}

/* ==========================================================================
   6. Blok poverenja i meta
   ========================================================================== */
body.dm-product div.product .dm-pdp-trust {
	margin: var(--dm-space-4) 0 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid var(--dm-line);
}

body.dm-product div.product .dm-pdp-trust__row {
	display: flex;
	align-items: flex-start;
	gap: var(--dm-space-3);
	margin: 0;
	padding: var(--dm-space-3) 0;
	font-size: 0.9375rem;
	line-height: 1.45;
	color: var(--dm-text-on-light);
	border-bottom: 1px solid var(--dm-line);
}

body.dm-product div.product .dm-pdp-trust__icon {
	flex: none;
	margin-top: 1px;
	color: var(--dm-olive);
}

body.dm-product div.product .dm-pdp-trust__row .dm-contact {
	display: flex;
	margin-top: var(--dm-space-2);
}

body.dm-product div.product .product_meta {
	display: grid;
	gap: var(--dm-space-1);
	margin: var(--dm-space-5) 0 0;
	padding: 0;
	font-family: var(--dm-font-mono);
	font-size: 0.6875rem;
	line-height: 1.5;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--dm-text-muted);
	border: 0;
}

body.dm-product div.product .product_meta > span {
	display: block;
	margin: 0;
	font-weight: 400;
}

body.dm-product div.product .product_meta a {
	color: var(--dm-text-muted);
	text-decoration: none;
}

body.dm-product div.product .product_meta a:hover {
	color: var(--dm-gold-ink);
	text-decoration: underline;
}

/* ==========================================================================
   7. Tabovi (Opis / Dodatne informacije / Recenzije)
   Astra crta gornju traku aktivnog taba i liniju preko cele širine; zamenjuje
   se podvučenim tabom.
   ========================================================================== */
body.dm-product div.product .woocommerce-tabs {
	width: 100%;
	margin: 0;
	padding: 0;
}

body.dm-product div.product .woocommerce-tabs ul.tabs {
	display: flex;
	gap: var(--dm-space-5);
	margin: 0 0 var(--dm-space-5);
	padding: 0;
	overflow-x: auto;
	overflow-y: hidden;
	list-style: none;
	border-bottom: 1px solid var(--dm-line);
	scrollbar-width: none;
}

body.dm-product div.product .woocommerce-tabs ul.tabs::before,
body.dm-product div.product .woocommerce-tabs ul.tabs::after {
	content: none;
	display: none;
}

body.dm-product div.product .woocommerce-tabs ul.tabs li {
	position: relative;
	flex: none;
	display: block;
	margin: 0;
	padding: 0;
	background: none;
	border: 0;
	border-radius: 0;
}

body.dm-product div.product .woocommerce-tabs ul.tabs li::after {
	content: none;
	display: none;
}

body.dm-product div.product .woocommerce-tabs ul.tabs li a {
	display: block;
	padding: var(--dm-space-3) 0;
	font-size: 1.125rem;
	line-height: 1.2;
	color: var(--dm-text-muted);
	text-decoration: none;
	white-space: nowrap;
	transition: color var(--dm-dur-color) var(--dm-ease);
}

body.dm-product div.product .woocommerce-tabs ul.tabs li a:hover,
body.dm-product div.product .woocommerce-tabs ul.tabs li.active a {
	color: var(--dm-text-on-light);
}

body.dm-product div.product .woocommerce-tabs ul.tabs li a:focus-visible {
	outline-offset: -2px; /* traka tabova seče spoljni obris */
}

/* Podvlaka aktivnog taba: zlatna ispuna preko tanke linije trake. */
body.dm-product div.product .woocommerce-tabs ul.tabs li::before {
	content: "";
	position: absolute;
	top: auto;
	right: 0;
	bottom: -1px;
	left: 0;
	width: auto;
	height: 3px;
	background: transparent;
	border: 0;
	transition: background-color var(--dm-dur-color) var(--dm-ease);
}

body.dm-product div.product .woocommerce-tabs ul.tabs li.active::before {
	background: var(--dm-gold);
}

body.dm-product div.product .woocommerce-tabs .panel {
	margin: 0;
	padding: 0;
}

/* Opis: oko 70 znakova po redu; slike i tabele mogu do pune širine. */
body.dm-product div.product .woocommerce-Tabs-panel--description > :where(p, ul, ol, h2, h3, h4, blockquote) {
	max-width: 70ch;
}

body.dm-product div.product .woocommerce-Tabs-panel--description img {
	max-width: 100%;
	height: auto;
}

/* Atributi: tanke linije između redova. */
body.dm-product div.product table.woocommerce-product-attributes {
	width: 100%;
	max-width: 70ch;
	margin: 0;
	border: 0;
	border-collapse: collapse;
}

body.dm-product div.product table.woocommerce-product-attributes th,
body.dm-product div.product table.woocommerce-product-attributes td {
	padding: var(--dm-space-3) 0;
	text-align: left;
	vertical-align: top;
	background: none;
	border: 0;
	border-bottom: 1px solid var(--dm-line);
}

body.dm-product div.product table.woocommerce-product-attributes th {
	width: 34%;
	padding-right: var(--dm-space-4);
	font-weight: 600;
	color: var(--dm-text-muted);
}

body.dm-product div.product table.woocommerce-product-attributes td p {
	margin: 0;
	padding: 0;
}

/* Recenzije. */
body.dm-product div.product #reviews #comments ol.commentlist {
	max-width: 70ch;
	margin: 0 0 var(--dm-space-5);
	padding: 0;
	list-style: none;
}

body.dm-product div.product #reviews #comments ol.commentlist li {
	margin: 0 0 var(--dm-space-4);
	padding: var(--dm-space-4);
	background: var(--dm-surface-light);
	border: 1px solid var(--dm-line);
	border-radius: var(--dm-radius);
}

body.dm-product div.product #reviews #comments ol.commentlist li .comment-text {
	margin: 0;
	padding: 0;
}

body.dm-product div.product #reviews .star-rating {
	color: var(--dm-gold-ink);
}

body.dm-product div.product #reviews .woocommerce-noreviews {
	margin: 0 0 var(--dm-space-5);
	color: var(--dm-text-muted);
}

/* Forma: polja i dugme dolaze iz main.css; ovde samo raspored. */
body.dm-product div.product #reviews #respond {
	max-width: 40rem;
	margin: 0;
	padding: 0;
	background: none;
	border: 0;
}

body.dm-product div.product #reviews .comment-reply-title {
	display: block;
	margin: 0 0 var(--dm-space-3);
	font-family: var(--dm-font-display);
	font-size: 1.375rem;
	font-weight: 700;
	line-height: 1.15;
	text-transform: uppercase;
}

body.dm-product div.product #reviews .comment-form > p,
body.dm-product div.product #reviews .comment-form > div {
	margin: 0 0 var(--dm-space-4);
}

body.dm-product div.product #reviews .comment-form .comment-form-author,
body.dm-product div.product #reviews .comment-form .comment-form-email {
	float: none;
	display: block;
	width: auto;
}

body.dm-product div.product #reviews .comment-form label {
	display: block;
	margin: 0 0 var(--dm-space-1);
	padding: 0;
	font-size: 0.9375rem;
	font-weight: 600;
}

body.dm-product div.product #reviews .comment-form .comment-form-cookies-consent label {
	display: inline;
	font-weight: 400;
}

body.dm-product div.product #reviews .comment-form input[type="text"],
body.dm-product div.product #reviews .comment-form input[type="email"],
body.dm-product div.product #reviews .comment-form textarea,
body.dm-product div.product #reviews .comment-form select {
	box-sizing: border-box;
	width: 100%;
}

body.dm-product div.product #reviews .comment-form textarea {
	min-height: 8rem;
	padding: var(--dm-space-3);
}

/* ==========================================================================
   8. Povezani proizvodi i up-sell (kartice su u shop.css)
   ========================================================================== */
body.dm-product div.product section.products {
	margin: 0;
	padding: 0;
}

body.dm-product div.product section.products > h2 {
	margin: 0 0 var(--dm-space-5);
	font-size: clamp(1.75rem, 4vw, 2.5rem);
	line-height: 1;
	letter-spacing: -0.01em;
	color: var(--dm-text-on-light);
}

/* Dve kolone na telefonu i tabletu (četiri proizvoda: 2 x 2), četiri na desktopu. */
@media (max-width: 921px) {
	body.dm-product div.product section.products ul.dm-grid[data-dm-grid] {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

body.dm-product div.product section.products ul.dm-grid[data-dm-grid] {
	margin-bottom: 0;
}

/* ==========================================================================
   9. Mobilna traka za kupovinu (ispod 922px)
   Ulazi i izlazi istim putem (translateY); desno ostaje mesta za Chaty dugme.
   ========================================================================== */
.dm-buybar {
	display: none;
}

@media (max-width: 921px) {
	.dm-buybar {
		position: fixed;
		right: 0;
		bottom: 0;
		left: 0;
		z-index: 90; /* ispod fioke menija (header.css), iznad sadržaja */
		box-sizing: border-box;
		display: flex;
		align-items: center;
		gap: var(--dm-space-3);
		min-height: var(--dm-pdp-buybar-h);
		/* Desno 88px: Chaty dugme (oko 60px) lebdi iznad trake, ne iznad našeg dugmeta. */
		padding: 10px max(88px, calc(16px + env(safe-area-inset-right))) calc(10px + env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));
		background: rgba(255, 255, 255, 0.94);
		border-top: 1px solid var(--dm-line);
		-webkit-backdrop-filter: blur(12px) saturate(1.2);
		backdrop-filter: blur(12px) saturate(1.2);
		transform: translateY(100%);
		opacity: 0;
		visibility: hidden;
		transition:
			transform 280ms var(--dm-ease),
			opacity 280ms var(--dm-ease),
			visibility 0s linear 280ms;
	}

	.dm-buybar.is-visible {
		transform: translateY(0);
		opacity: 1;
		visibility: visible;
		transition-delay: 0s;
	}

	/* Footer dobija razmak da traka ne prekrije poslednji red. */
	body.dm-has-buybar .dm-footer {
		padding-bottom: calc(var(--dm-pdp-buybar-h) + env(safe-area-inset-bottom));
	}
}

.dm-buybar__info {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	min-width: 0;
}

.dm-buybar__name {
	overflow: hidden;
	font-size: 0.875rem;
	font-weight: 600;
	line-height: 1.3;
	text-overflow: ellipsis;
	white-space: nowrap;
	color: var(--dm-text-on-light);
}

.dm-buybar__price {
	overflow: hidden;
	font-family: var(--dm-font-display);
	font-size: 1.1875rem;
	font-weight: 700;
	line-height: 1.2;
	text-overflow: ellipsis;
	white-space: nowrap;
	color: var(--dm-text-on-light);
}

.dm-buybar__price del {
	margin-right: 0.35em;
	font-size: 0.75em;
	font-weight: 400;
	color: var(--dm-text-muted);
	opacity: 1;
}

.dm-buybar__price ins {
	text-decoration: none;
	color: var(--dm-gold-ink);
	background: none;
}

.dm-buybar__price .woocommerce-Price-currencySymbol {
	font-size: 0.72em;
	letter-spacing: 0.06em;
}

.dm-buybar__btn {
	flex: none;
	min-height: 3rem;
	padding: 0 1.1em;
	font-size: 1rem;
	white-space: nowrap;
}

/* ==========================================================================
   10. Pristupačnost
   Fokus: osnovni obris je u main.css; ovde su mesta gde ga okvir seče.
   ========================================================================== */
body.dm-product div.product .flex-control-thumbs li img:focus-visible {
	outline-offset: 1px;
}

@media (prefers-reduced-motion: reduce) {
	/* Slajdovi: nema klizanja ni skrolovanja, samo kratko pojavljivanje. Woo/FlexSlider
	   upisuje trajanje prelaza inline, pa je ovde !important. */
	body.dm-product div.product .woocommerce-product-gallery__wrapper {
		transition: none !important;
	}

	body.dm-product div.product .woocommerce-product-gallery__image.flex-active-slide {
		animation: dm-pdp-fade 120ms linear;
	}

	body.dm-product.woocommerce #content div.product .flex-control-thumbs {
		scroll-behavior: auto;
	}

	.dm-buybar {
		transform: none;
		transition:
			opacity 100ms linear,
			visibility 0s linear 100ms;
	}

	.dm-buybar.is-visible {
		transition-delay: 0s;
	}

	body.dm-product div.product .woocommerce-tabs ul.tabs li::before,
	body.dm-product div.product .woocommerce-tabs ul.tabs li a,
	body.dm-product.woocommerce #content div.product .flex-control-thumbs li img {
		transition-duration: 80ms;
	}
}

@keyframes dm-pdp-fade {
	from { opacity: 0; }
	to { opacity: 1; }
}

/* Providna traka postaje puna, bez zamućenja pozadine. */
@media (prefers-reduced-transparency: reduce) {
	.dm-buybar {
		background: var(--dm-surface-light);
		-webkit-backdrop-filter: none;
		backdrop-filter: none;
	}
}

@media (prefers-contrast: more) {
	body.dm-product div.product .woocommerce-product-gallery > .woocommerce-product-gallery__wrapper,
	body.dm-product div.product .woocommerce-product-gallery .flex-viewport,
	body.dm-product div.product .dm-stock--out,
	body.dm-product div.product #reviews #comments ol.commentlist li {
		border-color: var(--dm-border-strong);
	}

	/* Neizabrane miniature u punoj jačini, izabrana jasno deblja. */
	body.dm-product.woocommerce #content div.product .flex-control-thumbs li img {
		opacity: 1;
		border-color: var(--dm-border-strong);
	}

	body.dm-product.woocommerce #content div.product .flex-control-thumbs li img.flex-active {
		border-width: 2px;
		border-color: var(--dm-text-on-light);
		box-shadow: none;
	}

	body.dm-product div.product .woocommerce-tabs ul.tabs li a {
		color: var(--dm-text-on-light);
	}

	body.dm-product div.product .woocommerce-tabs ul.tabs li.active::before {
		background: var(--dm-text-on-light);
	}

	body.dm-product div.product .dm-contact__link {
		border-width: 2px;
		border-color: var(--dm-text-on-light);
	}

	body.dm-product div.product .dm-price-row .dm-badge {
		border-color: var(--dm-text-on-light);
	}

	.dm-buybar {
		border-top-width: 2px;
		border-top-color: var(--dm-text-on-light);
	}
}

/* Dok je traka za kupovinu vidljiva, plutajuće dugme za kontakt (Chaty) se
   podiže iznad nje. Inače prekriva dugme „Dodaj u korpu" u traci. */
@media (max-width: 921px) {
	.chaty .chaty-widget {
		transition: bottom 200ms var(--dm-ease, ease-out);
	}

	/* !important: dodatak položaj upisuje pravilom sa ID selektorom. */
	html.dm-buybar-visible .chaty .chaty-widget {
		bottom: calc(84px + env(safe-area-inset-bottom, 0px)) !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	.chaty .chaty-widget {
		transition: none;
	}
}