/**
 * WooCommerce overrides — product cards, shop layout, single product, cart & checkout.
 */

/* ==========================================================================
   Product grid
   ========================================================================== */
.woocommerce ul.products,
ul.products {
	display: grid;
	gap: 24px;
	margin: 0 0 40px;
	padding: 0;
	list-style: none;
}
/* WooCommerce clears its old float layout with ::before/::after set to
   display:table. Inside a CSS grid those become real grid items: they occupy the
   first and last cells, shunting every card one slot along and leaving phantom
   columns (very visible on a related-products row with one product). WooCommerce
   declares them with two classes, so match that specificity and remove them. */
.woocommerce ul.products::before,
.woocommerce ul.products::after,
.woocommerce-page ul.products::before,
.woocommerce-page ul.products::after,
ul.products::before,
ul.products::after { content: none; display: none; }

ul.products.columns-2 { grid-template-columns: repeat(2, 1fr); }
ul.products.columns-3 { grid-template-columns: repeat(3, 1fr); }
ul.products.columns-4 { grid-template-columns: repeat(4, 1fr); }
ul.products.columns-5 { grid-template-columns: repeat(5, 1fr); }

/* A row with fewer cards than columns (a related-products list with one match,
   a thin category) would otherwise stretch empty tracks across the width. Cap
   the tracks to the number of cards and keep them near their usual size. */
ul.products:has(> li.product:last-child:nth-child(1)) {
	grid-template-columns: minmax(min(100%, 240px), 340px);
}
ul.products:has(> li.product:last-child:nth-child(2)) {
	grid-template-columns: repeat(2, minmax(min(100%, 240px), 340px));
}
ul.products:has(> li.product:last-child:nth-child(3)) {
	grid-template-columns: repeat(3, minmax(min(100%, 240px), 340px));
}
/* Below the 3-column breakpoint the normal responsive rules take over again. */
@media (max-width: 768px) {
	ul.products:has(> li.product:last-child:nth-child(-n + 3)) {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}
@media (max-width: 420px) {
	ul.products:has(> li.product:last-child:nth-child(-n + 3)) {
		grid-template-columns: minmax(0, 1fr);
	}
}

.woocommerce ul.products li.product,
ul.products li.product {
	width: 100% !important;
	float: none !important;
	margin: 0 !important;
	padding: 0;
	display: flex;
	flex-direction: column;
	background: #fff;
	border: 1px solid var(--pv-border);
	border-radius: var(--pv-radius);
	overflow: hidden;
	text-align: left;
	transition: transform .25s var(--pv-ease), box-shadow .25s var(--pv-ease), border-color .25s var(--pv-ease);
}
.woocommerce ul.products li.product:hover,
ul.products li.product:hover {
	transform: translateY(-5px);
	box-shadow: var(--pv-shadow);
	border-color: transparent;
}

.pv-card__media-link { display: block; color: inherit; }
.pv-card__link {
	display: flex;
	flex-direction: column;
	gap: 8px;
	color: inherit;
}

.pv-card__media {
	position: relative;
	aspect-ratio: 1 / 1;
	background: var(--pv-cream-soft);
	overflow: hidden;
}
.pv-card__media img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	padding: 12px;
	margin: 0 !important;
	transition: transform .45s var(--pv-ease);
}
ul.products li.product:hover .pv-card__media img { transform: scale(1.05); }

.pv-card__badges {
	position: absolute;
	top: 12px;
	left: 12px;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 6px;
}
.pv-badge {
	display: inline-flex;
	align-items: center;
	padding: 5px 12px;
	border-radius: var(--pv-radius-pill);
	font-size: .74rem;
	font-weight: 800;
	letter-spacing: .04em;
	text-transform: uppercase;
	line-height: 1.3;
	background: var(--pv-navy);
	color: #fff;
}
.pv-badge--sale { background: var(--pv-red); }
.pv-badge--top { background: var(--pv-blue); }
.pv-badge--out { background: #7b868e; }
.pv-badge--single {
	position: static;
	margin-bottom: 14px;
	font-size: .82rem;
	padding: 7px 16px;
}

/* Woo's default flash is replaced but keep any stragglers tidy */
.woocommerce span.onsale {
	position: absolute;
	top: 12px;
	left: 12px;
	min-height: 0;
	min-width: 0;
	line-height: 1.3;
	padding: 5px 12px;
	border-radius: var(--pv-radius-pill);
	background: var(--pv-red);
	font-size: .74rem;
	font-weight: 800;
	margin: 0;
}

.pv-card__body {
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 18px 20px 20px;
	flex: 1;
}
.pv-card__cat {
	font-size: .72rem;
	font-weight: 800;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--pv-blue);
}
.woocommerce ul.products li.product .woocommerce-loop-product__title,
ul.products li.product .woocommerce-loop-product__title {
	padding: 0;
	margin: 0;
	font-size: 1.02rem;
	font-weight: 700;
	line-height: 1.35;
	color: var(--pv-navy);
}
ul.products li.product:hover .woocommerce-loop-product__title { color: var(--pv-blue-dark); }

.pv-card__rating { display: flex; align-items: center; gap: 8px; }
.pv-stars { display: inline-flex; gap: 2px; }
.pv-stars span { color: #d7dde2; display: inline-flex; }
.pv-stars span.is-on { color: #f0a828; }
.pv-stars svg { width: 15px; height: 15px; }
.pv-card__reviews { font-size: .82rem; color: var(--pv-muted); }

/* Price is a direct flex child of .pv-card__body, so the auto top margin sweeps
   it — and the button that follows — to the bottom of every card in the row,
   regardless of how many lines the title wraps to. */
.woocommerce ul.products li.product .price,
ul.products li.product .price {
	margin: auto 0 0;
	color: var(--pv-navy);
	font-size: 1.22rem;
	font-weight: 800;
	letter-spacing: -.02em;
	display: flex;
	align-items: baseline;
	gap: 8px;
	flex-wrap: wrap;
	padding-top: 4px;
}
.woocommerce ul.products li.product .price del,
.woocommerce div.product p.price del,
.price del {
	color: var(--pv-muted);
	font-size: .92rem;
	font-weight: 600;
	opacity: 1;
	text-decoration: line-through;
}
.woocommerce ul.products li.product .price ins,
.woocommerce div.product p.price ins,
.price ins {
	background: none;
	color: var(--pv-red);
	text-decoration: none;
	font-weight: 800;
}

/* Add to cart in the grid */
.woocommerce ul.products li.product .button,
ul.products li.product .button {
	margin: 10px 0 0;
	display: flex;
	justify-content: center;
	width: 100%;
}
.woocommerce ul.products li.product .added_to_cart {
	display: block;
	margin: 8px 0 0;
	font-size: .86rem;
	font-weight: 700;
	text-align: center;
}
.woocommerce a.button.loading::after,
.woocommerce button.button.loading::after { top: .55em; }

/* ==========================================================================
   Buttons
   ========================================================================== */
.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce #respond input#submit.alt {
	background: var(--pv-blue);
	color: #fff;
	border: 2px solid transparent;
	border-radius: var(--pv-radius-pill);
	padding: 12px 26px;
	font-weight: 700;
	font-size: .96rem;
	line-height: 1.2;
	transition: background .2s var(--pv-ease), transform .18s var(--pv-ease), box-shadow .18s var(--pv-ease);
	box-shadow: 0 4px 12px rgba(0, 117, 199, .22);
}
.woocommerce #respond input#submit:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover {
	background: var(--pv-blue-dark);
	color: #fff;
	transform: translateY(-2px);
	box-shadow: 0 8px 20px rgba(0, 117, 199, .3);
}
.woocommerce a.button.wc-backward,
.woocommerce .cart .button[name="update_cart"] {
	background: transparent;
	color: var(--pv-navy);
	border-color: currentColor;
	box-shadow: none;
}
.woocommerce a.button.wc-backward:hover,
.woocommerce .cart .button[name="update_cart"]:hover {
	background: var(--pv-navy);
	color: #fff;
}

/* ==========================================================================
   Shop layout
   ========================================================================== */
.pv-shop { padding-block: 48px 72px; }
.pv-layout--shop { grid-template-columns: 300px minmax(0, 1fr); }
.pv-shop-sidebar { align-self: start; position: sticky; top: 100px; }
@media (max-width: 992px) {
	.pv-layout--shop { grid-template-columns: minmax(0, 1fr); }
	.pv-shop-sidebar { position: static; }
}

.pv-shop-toolbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	flex-wrap: wrap;
	padding: 14px 20px;
	margin-bottom: 28px;
	background: var(--pv-cream-soft);
	border: 1px solid var(--pv-border);
	border-radius: var(--pv-radius);
}
.woocommerce .woocommerce-result-count {
	margin: 0;
	color: var(--pv-muted);
	font-size: .94rem;
}
.woocommerce .woocommerce-ordering { margin: 0; }
.woocommerce .woocommerce-ordering select {
	padding: 9px 16px;
	border: 1px solid var(--pv-border);
	border-radius: var(--pv-radius-pill);
	background: #fff;
	font-weight: 600;
}

.woocommerce nav.woocommerce-pagination ul {
	border: 0;
	display: flex;
	gap: 8px;
	justify-content: center;
	flex-wrap: wrap;
}
.woocommerce nav.woocommerce-pagination ul li { border: 0; margin: 0; overflow: visible; }
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
	min-width: 42px;
	height: 42px;
	padding: 0 14px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: 1px solid var(--pv-border);
	border-radius: var(--pv-radius-pill);
	font-weight: 700;
	color: var(--pv-navy);
	background: #fff;
}
.woocommerce nav.woocommerce-pagination ul li span.current,
.woocommerce nav.woocommerce-pagination ul li a:hover {
	background: var(--pv-navy);
	border-color: var(--pv-navy);
	color: #fff;
}

/* Breadcrumb */
.pv-breadcrumb__sep { margin-inline: 8px; opacity: .5; }

/* Shop sidebar widgets */
.pv-shop-sidebar .product-categories,
.pv-shop-sidebar ul.product_list_widget {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 4px;
}
/* The widget prints "<a>Name</a> <span class="count">(3)</span>" plus an
   optional nested <ul>, so grid keeps the count on the same row as the link
   while the children list still spans the full width. */
.pv-shop-sidebar .product-categories li {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: center;
	column-gap: 6px;
}
.pv-shop-sidebar .product-categories li .children { grid-column: 1 / -1; }
.pv-shop-sidebar .product-categories li .count {
	font-size: .82rem;
	color: var(--pv-muted);
	padding-right: 6px;
}
.pv-shop-sidebar .product-categories li a {
	display: block;
	padding: 7px 12px;
	border-radius: var(--pv-radius-sm);
	color: var(--pv-text);
	font-weight: 600;
	font-size: .95rem;
}
.pv-shop-sidebar .product-categories li a:hover,
.pv-shop-sidebar .product-categories li.current-cat > a {
	background: var(--pv-blue-soft);
	color: var(--pv-blue-dark);
}
.pv-shop-sidebar .product-categories .children {
	list-style: none;
	margin: 2px 0 6px;
	padding-left: 12px;
	border-left: 2px solid var(--pv-border);
}
.pv-shop-sidebar .product-categories .children a { font-weight: 500; color: var(--pv-muted); font-size: .92rem; }

/* Markup is <li><a><img><span.product-title></a><div.star-rating><span.amount>.
   The image sits inside the link, so grid the link — not the li — and let the
   rating and price stack underneath. WooCommerce styles these with
   `.woocommerce ul.product_list_widget li a`, so match that specificity
   (two classes, three elements) or the overrides silently lose. */
.pv-shop-sidebar ul.product_list_widget li {
	display: block;
	padding: 10px 0;
	border-bottom: 1px solid var(--pv-border);
}
.pv-shop-sidebar ul.product_list_widget li:last-child { border-bottom: 0; }
.pv-shop-sidebar ul.product_list_widget li > a {
	display: grid;
	grid-template-columns: 52px minmax(0, 1fr);
	gap: 12px;
	align-items: center;
	margin-bottom: 6px;
}
.pv-shop-sidebar ul.product_list_widget li img {
	width: 52px;
	height: 52px;
	object-fit: contain;
	float: none;
	margin: 0;
	background: #fff;
	border-radius: var(--pv-radius-sm);
	border: 1px solid var(--pv-border);
}
.pv-shop-sidebar ul.product_list_widget li .product-title {
	display: block;
	font-weight: 700;
	font-size: .92rem;
	line-height: 1.3;
	color: var(--pv-navy);
}
.pv-shop-sidebar ul.product_list_widget li .star-rating {
	float: none;
	margin: 0 0 4px;
	font-size: .7em;
}
.pv-shop-sidebar ul.product_list_widget li .amount {
	font-weight: 700;
	font-size: .9rem;
	color: var(--pv-navy);
}
.pv-shop-sidebar ul.product_list_widget li del { opacity: 1; text-decoration: none; }
.pv-shop-sidebar ul.product_list_widget li del .amount {
	color: var(--pv-muted);
	font-weight: 600;
	font-size: .82rem;
	text-decoration: line-through;
}
.pv-shop-sidebar ul.product_list_widget li ins {
	background: none;
	text-decoration: none;
	margin-left: 6px;
}
.pv-shop-sidebar ul.product_list_widget li ins .amount { color: var(--pv-red); }

.pv-shop-sidebar .price_slider_wrapper .price_slider { margin-bottom: 18px; }
.pv-shop-sidebar .price_slider_amount { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.pv-shop-sidebar .price_slider_amount .price_label { font-size: .88rem; color: var(--pv-muted); order: 2; }
.pv-shop-sidebar .price_slider_amount .button { order: 1; padding: 8px 20px; font-size: .88rem; }
.woocommerce .widget_price_filter .ui-slider .ui-slider-range,
.woocommerce .widget_price_filter .ui-slider .ui-slider-handle { background: var(--pv-blue); }
.woocommerce .widget_price_filter .price_slider_wrapper .ui-widget-content { background: var(--pv-border); }

.pv-shop-sidebar .wc-layered-nav-rating { list-style: none; margin: 0; padding: 0; }
.pv-shop-sidebar .wc-layered-nav-rating li { padding: 5px 0; }

/* Category cards inside the shop loop */
.woocommerce ul.products li.product-category > a { display: block; }
.woocommerce ul.products li.product-category h2 {
	padding: 18px 20px !important;
	font-size: 1.06rem !important;
	font-weight: 800 !important;
	color: var(--pv-navy);
}
.woocommerce ul.products li.product-category mark {
	background: none;
	color: var(--pv-muted);
	font-weight: 600;
}

/* ==========================================================================
   Single product
   ========================================================================== */
.woocommerce div.product { margin-top: 8px; }
.woocommerce div.product div.images { margin-bottom: 40px; }
.woocommerce div.product div.images img {
	border-radius: var(--pv-radius);
	background: var(--pv-cream-soft);
}
.woocommerce div.product .flex-control-thumbs { margin-top: 14px; gap: 10px; display: flex; }
.woocommerce div.product .flex-control-thumbs li { width: 84px; margin: 0; }
.woocommerce div.product .flex-control-thumbs img { border-radius: var(--pv-radius-sm); border: 1px solid var(--pv-border); }

.woocommerce div.product .product_title {
	font-size: clamp(1.7rem, 3vw, 2.4rem);
	font-weight: 800;
	letter-spacing: -.025em;
	margin-bottom: 12px;
}
.woocommerce div.product p.price,
.woocommerce div.product span.price {
	color: var(--pv-navy);
	font-size: 1.9rem;
	font-weight: 800;
	letter-spacing: -.03em;
	margin-bottom: 18px;
	display: flex;
	align-items: baseline;
	gap: 12px;
	flex-wrap: wrap;
}
.woocommerce div.product .woocommerce-product-details__short-description {
	color: var(--pv-muted);
	font-size: 1.05rem;
	margin-bottom: 24px;
	padding-bottom: 24px;
	border-bottom: 1px solid var(--pv-border);
}
.woocommerce div.product form.cart { margin-bottom: 24px; display: flex; gap: 12px; flex-wrap: wrap; align-items: center; }
.woocommerce div.product form.cart .quantity { margin: 0; }
.woocommerce .quantity input.qty {
	width: 88px;
	height: 50px;
	padding: 0 10px;
	border: 1px solid var(--pv-border);
	border-radius: var(--pv-radius-pill);
	text-align: center;
	font-weight: 700;
}
.woocommerce div.product form.cart .button {
	height: 50px;
	padding-inline: 34px;
	font-size: 1.02rem;
}
.woocommerce div.product .product_meta {
	font-size: .92rem;
	color: var(--pv-muted);
	padding-top: 18px;
	border-top: 1px solid var(--pv-border);
	display: grid;
	gap: 6px;
}
.woocommerce div.product .product_meta a { font-weight: 600; }

.pv-usps {
	list-style: none;
	margin: 0 0 24px;
	padding: 18px 20px;
	display: grid;
	gap: 12px;
	background: var(--pv-cream-soft);
	border: 1px solid var(--pv-border);
	border-radius: var(--pv-radius);
}
.pv-usps li {
	display: flex;
	align-items: center;
	gap: 12px;
	font-weight: 600;
	color: var(--pv-navy);
	margin: 0;
}
.pv-usps svg { width: 20px; height: 20px; color: var(--pv-blue); flex-shrink: 0; }

.woocommerce div.product .woocommerce-tabs ul.tabs {
	padding: 0;
	margin: 0 0 28px;
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
	border-bottom: 1px solid var(--pv-border);
}
.woocommerce div.product .woocommerce-tabs ul.tabs::before { display: none; }
.woocommerce div.product .woocommerce-tabs ul.tabs li {
	background: none;
	border: 0;
	border-radius: 0;
	margin: 0;
	padding: 0;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after { display: none; }
.woocommerce div.product .woocommerce-tabs ul.tabs li a {
	display: block;
	padding: 14px 20px;
	font-weight: 700;
	color: var(--pv-muted);
	border-bottom: 3px solid transparent;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a,
.woocommerce div.product .woocommerce-tabs ul.tabs li a:hover {
	color: var(--pv-navy);
	border-bottom-color: var(--pv-blue);
}
.woocommerce div.product .woocommerce-tabs .panel { margin-bottom: 40px; }
.woocommerce div.product .woocommerce-tabs h2 { font-size: 1.3rem; }
.woocommerce table.shop_attributes th { background: var(--pv-cream); }

.woocommerce .related > h2,
.woocommerce .upsells > h2 {
	font-size: 1.7rem;
	font-weight: 800;
	margin-bottom: 26px;
}

.woocommerce .star-rating span::before { color: #f0a828; }
.woocommerce .woocommerce-product-rating { margin-bottom: 16px; }

/* ==========================================================================
   Cart, checkout, account
   ========================================================================== */
.woocommerce table.shop_table {
	border: 1px solid var(--pv-border);
	border-radius: var(--pv-radius);
	border-collapse: separate;
	overflow: hidden;
}
.woocommerce table.shop_table th {
	background: var(--pv-cream-soft);
	font-weight: 800;
	color: var(--pv-navy);
}
.woocommerce table.shop_table td { border-top: 1px solid var(--pv-border); }
.woocommerce table.cart img { width: 72px; border-radius: var(--pv-radius-sm); }

.woocommerce table.cart td.actions { padding: 16px; }
.woocommerce table.cart td.actions .coupon {
	display: flex;
	gap: 10px;
	align-items: center;
	flex-wrap: wrap;
	float: none;
}
.woocommerce table.cart td.actions .coupon label { display: none; }
.woocommerce table.cart td.actions .coupon .input-text {
	flex: 1 1 220px;
	width: auto !important;
	min-width: 0;
	padding: 12px 18px;
	border: 1px solid var(--pv-border);
	border-radius: var(--pv-radius-pill);
	margin: 0 !important;
}
.woocommerce table.cart td.actions .coupon .button { flex: 0 0 auto; }
.woocommerce table.cart td.actions > .button { float: right; }

.woocommerce .cart-collaterals { display: flex; justify-content: flex-end; }
.woocommerce .cart-collaterals .cart_totals { width: min(460px, 100%); float: none; }
.woocommerce ul#shipping_method { margin: 0; padding: 0; list-style: none; display: grid; gap: 6px; }
.woocommerce ul#shipping_method li { margin: 0; padding: 0; }
.woocommerce ul#shipping_method label { font-weight: 600; }

.woocommerce .cart-collaterals .cart_totals,
.woocommerce-checkout #order_review,
.woocommerce-checkout .woocommerce-checkout-review-order {
	background: var(--pv-cream-soft);
	border: 1px solid var(--pv-border);
	border-radius: var(--pv-radius);
	padding: 24px;
}
.woocommerce .cart-collaterals .cart_totals h2 { font-size: 1.3rem; }

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce-page form .form-row input.input-text,
.select2-container .select2-selection--single {
	padding: 12px 16px;
	height: auto;
	border: 1px solid var(--pv-border);
	border-radius: var(--pv-radius-sm);
	background: #fff;
}
.woocommerce form .form-row label { font-weight: 700; color: var(--pv-navy); margin-bottom: 6px; }
.woocommerce-info,
.woocommerce-message,
.woocommerce-error {
	border-top-color: var(--pv-blue);
	background: var(--pv-blue-soft);
	border-radius: var(--pv-radius-sm);
	color: var(--pv-navy);
}
.woocommerce-error { border-top-color: var(--pv-red); background: var(--pv-red-soft); }
.woocommerce-info::before, .woocommerce-message::before { color: var(--pv-blue); }
.woocommerce-error::before { color: var(--pv-red); }

.woocommerce-MyAccount-navigation ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 6px; }
.woocommerce-MyAccount-navigation ul li a {
	display: block;
	padding: 11px 16px;
	border-radius: var(--pv-radius-sm);
	font-weight: 700;
	color: var(--pv-navy);
}
.woocommerce-MyAccount-navigation ul li.is-active a,
.woocommerce-MyAccount-navigation ul li a:hover { background: var(--pv-blue-soft); color: var(--pv-blue-dark); }

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width: 1200px) {
	ul.products.columns-5 { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 992px) {
	ul.products.columns-4, ul.products.columns-5 { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 768px) {
	ul.products.columns-3, ul.products.columns-4, ul.products.columns-5 { grid-template-columns: repeat(2, 1fr); }
	ul.products { gap: 14px; }
	.pv-card__body { padding: 14px 14px 16px; }
	.woocommerce ul.products li.product .button, ul.products li.product .button {
		margin: 10px 0 0;
		width: 100%;
		padding-inline: 14px;
		font-size: .88rem;
	}
	.woocommerce div.product form.cart { flex-direction: column; align-items: stretch; }
	.woocommerce div.product form.cart .button { width: 100%; }
	.woocommerce .quantity input.qty { width: 100%; }
}
@media (max-width: 420px) {
	ul.products.columns-2, ul.products.columns-3, ul.products.columns-4, ul.products.columns-5 { grid-template-columns: 1fr; }
}
