/**
 * WooCommerce baseline for the dark theme (Phase 1).
 *
 * Purpose: keep shop, cart, checkout and account pages legible and usable on
 * the dark surface. Product cards, archives and product pages are redesigned
 * in Phase 3. Visual only: no element is hidden or reordered.
 */

/* -------------------------------------------------------------- Prices */

.woocommerce .price,
.woocommerce-Price-amount {
	color: var(--lpz-text);
}

.woocommerce .price del,
.woocommerce .price del .woocommerce-Price-amount {
	color: var(--lpz-text-muted);
}

.woocommerce .price ins {
	text-decoration: none;
}

/* MJDD Sidrena Cijena owns its output and styles. Position only, so its tooltip stays on screen: on the last
   card of a row (shop and related products: 2 on phones, 3 on tablets, 4 on desktop; our homepage grids have
   their own rule in sections.css) it opens to the left, and on a product page it stays inside the summary column. */
@media (max-width: 544px) {
	.woocommerce ul.products:not(.lpz-products ul) li.product:nth-child(2n) .sidrena-cijena__tooltip {
		right: 0;
		left: auto;
	}

	.woocommerce ul.products:not(.lpz-products ul) li.product:nth-child(2n) .sidrena-cijena__tooltip::after {
		right: 1.2em;
		left: auto;
	}
}

@media (min-width: 545px) and (max-width: 921px) {
	.woocommerce ul.products:not(.lpz-products ul) li.product:nth-child(3n) .sidrena-cijena__tooltip {
		right: 0;
		left: auto;
	}

	.woocommerce ul.products:not(.lpz-products ul) li.product:nth-child(3n) .sidrena-cijena__tooltip::after {
		right: 1.2em;
		left: auto;
	}
}

@media (min-width: 922px) {
	.woocommerce ul.products:not(.lpz-products ul) li.product:nth-child(4n) .sidrena-cijena__tooltip {
		right: 0;
		left: auto;
	}

	.woocommerce ul.products:not(.lpz-products ul) li.product:nth-child(4n) .sidrena-cijena__tooltip::after {
		right: 1.2em;
		left: auto;
	}
}

.woocommerce div.product .summary .sidrena-cijena__tooltip {
	max-width: 100%;
}

/* Anchor price ("Bazna cijena (date): amount"; the label is the plugin's Prefix setting): quiet label, clear
   amount, on every card and grid. Colours are tokens, so 3D PrintXpress pages follow their own palette.
   Presentation only; MJDD sets sizes with !important, so these need the same. */
body .sidrena-cijena {
	margin-top: var(--lpz-space-1);
	color: var(--lpz-text-muted);
	letter-spacing: 0.01em;
	line-height: 1.4;
}

body .sidrena-cijena .sidrena-cijena__prefix,
body .sidrena-cijena .sidrena-cijena__sep {
	color: var(--lpz-text-muted);
	font-size: 13px !important;
	font-weight: 400 !important;
}

body .sidrena-cijena .sidrena-cijena__amount,
body .sidrena-cijena .sidrena-cijena__amount .woocommerce-Price-amount,
body .sidrena-cijena .sidrena-cijena__amount bdi,
body .sidrena-cijena .sidrena-cijena__amount .woocommerce-Price-currencySymbol {
	color: var(--lpz-text);
	font-size: 14px !important;
	font-weight: 600 !important;
	white-space: nowrap;
}

@media (max-width: 767px) {
	body .sidrena-cijena .sidrena-cijena__prefix,
	body .sidrena-cijena .sidrena-cijena__sep {
		font-size: 12px !important;
	}

	body .sidrena-cijena .sidrena-cijena__amount,
	body .sidrena-cijena .sidrena-cijena__amount .woocommerce-Price-amount,
	body .sidrena-cijena .sidrena-cijena__amount bdi,
	body .sidrena-cijena .sidrena-cijena__amount .woocommerce-Price-currencySymbol {
		font-size: 13px !important;
	}
}

/* ------------------------------------------------------- Product basics */

.woocommerce div.product .product_title {
	font-size: var(--lpz-text-3xl);
}

.woocommerce span.onsale,
.woocommerce ul.products li.product .onsale {
	background-color: var(--lpz-accent);
	color: var(--lpz-on-accent);
	border-radius: var(--lpz-radius-pill);
	font-weight: 700;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
	color: var(--lpz-text);
}

.woocommerce ul.products li.product .ast-woo-product-category {
	color: var(--lpz-text-muted);
}

.woocommerce .star-rating,
.woocommerce .star-rating::before {
	color: var(--lpz-accent-hover);
}

.woocommerce div.product .stock {
	color: var(--lpz-text-muted);
}

.woocommerce div.product .stock.out-of-stock {
	color: var(--lpz-danger);
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
	color: var(--lpz-text-muted);
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
	color: var(--lpz-text);
}

.woocommerce .quantity .qty {
	background-color: var(--lpz-surface);
	border-color: var(--lpz-border-strong);
	color: var(--lpz-text);
}

/* -------------------------------------------------------------- Notices */

.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.woocommerce-notices-wrapper .woocommerce-message {
	background-color: var(--lpz-surface);
	border: 1px solid var(--lpz-border);
	border-top: 3px solid var(--lpz-accent);
	border-radius: var(--lpz-radius);
	color: var(--lpz-text);
}

.woocommerce-error {
	border-top-color: var(--lpz-danger);
}

.woocommerce-message::before,
.woocommerce-info::before {
	color: var(--lpz-accent-hover);
}

.woocommerce-error::before {
	color: var(--lpz-danger);
}

/* -------------------------------------------------- Cart / checkout */

.woocommerce table.shop_table {
	background-color: var(--lpz-surface);
	border: 1px solid var(--lpz-border);
	border-radius: var(--lpz-radius);
	color: var(--lpz-text);
}

.woocommerce table.shop_table th,
.woocommerce table.shop_table td {
	border-color: var(--lpz-border);
}

.woocommerce form .form-row label,
.woocommerce-checkout h3,
#order_review_heading {
	color: var(--lpz-text);
}

.woocommerce form .form-row .required {
	color: var(--lpz-danger);
}

.woocommerce form .form-row .input-text,
.woocommerce form .form-row select,
.woocommerce form .form-row textarea {
	background-color: var(--lpz-surface);
	border-color: var(--lpz-border-strong);
	color: var(--lpz-text);
}

.woocommerce form.login,
.woocommerce form.register,
.woocommerce form.checkout_coupon {
	border-color: var(--lpz-border);
	border-radius: var(--lpz-radius);
}

/* Payment box (classic checkout). Gateways render their own fields inside. */
.woocommerce-checkout #payment,
.woocommerce #payment {
	background-color: var(--lpz-surface);
	border: 1px solid var(--lpz-border);
	border-radius: var(--lpz-radius);
	color: var(--lpz-text);
}

.woocommerce #payment ul.payment_methods {
	border-bottom-color: var(--lpz-border);
}

.woocommerce #payment div.payment_box {
	background-color: var(--lpz-surface-raised);
	color: var(--lpz-text);
}

.woocommerce #payment div.payment_box::before {
	border-bottom-color: var(--lpz-surface-raised);
}

.woocommerce-privacy-policy-text,
.woocommerce-terms-and-conditions-wrapper {
	color: var(--lpz-text-muted);
}

/* Select2 (country/state fields). */
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple {
	background-color: var(--lpz-surface);
	border-color: var(--lpz-border-strong);
	border-radius: var(--lpz-radius-sm);
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
	color: var(--lpz-text);
}

.select2-dropdown {
	background-color: var(--lpz-surface);
	border-color: var(--lpz-border-strong);
	color: var(--lpz-text);
}

.select2-container--default .select2-search--dropdown .select2-search__field {
	background-color: var(--lpz-bg);
	border-color: var(--lpz-border-strong);
	color: var(--lpz-text);
}

.select2-container--default .select2-results__option--highlighted[aria-selected],
.select2-container--default .select2-results__option--highlighted[data-selected] {
	background-color: var(--lpz-accent);
	color: var(--lpz-on-accent);
}

/* --------------------------------------------------------- My account */

.woocommerce-MyAccount-navigation ul li a {
	color: var(--lpz-text-muted);
}

.woocommerce-MyAccount-navigation ul li.is-active a,
.woocommerce-MyAccount-navigation ul li a:hover {
	color: var(--lpz-text);
}