/*
 * WooCommerce: only what the new site layer needs.
 * The shop, product, cart and checkout design is the existing prometals-shop module (pmg-shop-*.css),
 * the mini cart and account popup are in style.css. This file does not restyle them.
 */

/* prometals-shop module follows the site fonts and header height */
body.pm-site {
	--pmg-font: var(--pm-font-body);
	--pmg-sticky-top: calc(var(--pm-hh) + 24px);
}

/* ---------------------------------------------------------------- compact page hero (shop, cart, checkout, account, legal pages)
 * Wavo gives .page-header .cont 240px top padding - far too tall.
 */
.pm-site .page-header {
	min-height: 0 !important;
	height: auto !important;
	padding: clamp(36px, 4vw, 56px) 0 clamp(28px, 3vw, 44px) !important;
	background: var(--pm-ink) !important;
	text-align: left !important;
}
.pm-site .page-header .cont, .pm-site .page-header .hero-innner-last-child { padding: 0 !important; margin: 0 !important; }
.pm-site .page-header .container { width: 100%; max-width: calc(var(--pm-max) + 2 * var(--pm-gutter)); padding-inline: calc(var(--pm-gutter) - 15px); }
.pm-site .page-header .text-bg { display: none !important; }
.pm-site .page-header .nt-hero-title, .pm-site .page-header .extra-title, .pm-site .page-header .hero__title {
	margin: 0 !important;
	font: 800 clamp(1.7rem, 1.2rem + 1.6vw, 2.6rem)/1.05 var(--pm-font-display) !important;
	letter-spacing: -.01em !important;
	text-transform: uppercase;
	color: #fff !important;
}
.pm-site .page-header .breadcrumb-trail, .pm-site .page-header .nt-breadcrumbs { margin-top: 10px !important; justify-content: flex-start !important; }
.pm-site .page-header .breadcrumbs, .pm-site .page-header .breadcrumbs a, .pm-site .page-header .breadcrumb_link_seperator,
.pm-site .page-header .nt-breadcrumbs, .pm-site .page-header .nt-breadcrumbs a {
	font: 400 .875rem/1.4 var(--pm-font-body) !important;
	letter-spacing: 0 !important;
	text-transform: none !important;
	color: var(--pm-muted-d) !important;
}
.pm-site .page-header .breadcrumb_active { color: #fff !important; }
.pm-site .page-header .breadcrumbs { display: flex; flex-wrap: wrap; justify-content: flex-start !important; padding: 0 !important; margin: 0 !important; }

/* Select2 double arrow: Wavo paints its own arrow on the original select too */
.pm-site .woocommerce form .form-row select.select2-hidden-accessible + .select2::after { content: none; }

/* ---------------------------------------------------------------- existing account popup + mini cart inside the new header */
.pm-header__icons #robnety-header-actions { display: flex !important; align-items: center; gap: 4px; margin: 0; color: #fff; }
.pm-header__icons .header-account-icon,
.pm-header__icons .header-cart-icon {
	position: relative;
	display: inline-grid !important;
	place-items: center;
	width: 44px; height: 44px;
	color: #fff;
	transition: color var(--pm-hover);
}
.pm-header__icons .header-account-icon:hover,
.pm-header__icons .header-cart-icon:hover,
.pm-header__icons .header-account-wrap.open .header-account-icon,
.pm-header__icons .header-cart-wrap.open .header-cart-icon { color: var(--pm-brand-hi); }
.pm-header__icons .header-cart-icon .cart-count {
	position: absolute; top: 4px; right: 0;
	min-width: 18px; height: 18px; padding: 0 4px;
	border-radius: var(--pm-radius-round);
	background: var(--pm-brand-hi); color: var(--pm-ink);
	font: 600 11px/18px var(--pm-font-body);
	text-align: center;
}
/* account dropdown hangs from the header edge */
.pm-header__icons .header-account-dropdown { top: calc(100% + 22px); }
.pm-header__icons .header-cart-icon .cart-count[hidden] { display: none; }


/* ================================================================ shop v1.5 */

/* ---------------------------------------------------------------- product tile: same hover as every photo tile
 * photo zooms 3% inside its frame, a teal line grows along the bottom, title turns teal */
html body.pm-site ul.products li.product .pm-thumb { position: relative; display: block; overflow: hidden; margin: 0 0 18px; background: var(--pm-surface-2); }
html body.pm-site ul.products li.product .pm-thumb img {
	display: block; width: 100% !important; height: auto !important;
	aspect-ratio: 1; object-fit: cover;
	margin: 0 !important; opacity: 1 !important;
	transform: scale(1.001);
	transition: transform var(--pm-hover) !important;
}
html body.pm-site ul.products li.product .pm-thumb::after {
	content: ""; position: absolute; left: 0; right: 0; bottom: 0; z-index: 1;
	height: 3px; background: var(--pm-brand);
	transform: scaleX(0); transform-origin: left;
	transition: transform var(--pm-hover);
}
html body.pm-site ul.products li.product:hover .pm-thumb img { transform: scale(1.03); }
html body.pm-site ul.products li.product:hover .pm-thumb::after { transform: scaleX(1); }
html body.pm-site ul.products li.product .woocommerce-loop-product__title {
	font: 700 1.0625rem/1.3 var(--pm-font-display) !important;
	letter-spacing: 0 !important; text-transform: none !important;
	color: var(--pm-ink) !important;
	transition: color var(--pm-hover) !important;
}
html body.pm-site ul.products li.product:hover .woocommerce-loop-product__title { color: var(--pm-brand) !important; }
html body.pm-site ul.products li.product .price { font: 600 1.0625rem/1.2 var(--pm-font-body) !important; color: var(--pm-ink) !important; }
html body.pm-site ul.products li.product .price ins { text-decoration: none; color: var(--pm-brand); }
html body.pm-site ul.products li.product .rmv-loop-category { color: var(--pm-text-2) !important; font: 500 .75rem/1 var(--pm-font-body) !important; letter-spacing: .12em !important; }
html body.pm-site ul.products li.product .star-rating { display: none !important; }
html body.pm-site ul.products li.product .product-content-wrap { position: relative !important; }
/* the overlay button sits on the bottom edge of the photo frame */
@media (hover: hover) and (min-width: 992px) {
	html body.pm-site ul.products li.product .product-content-wrap > a.button { top: calc(100cqw - 46px) !important; z-index: 3; }
}

/* ---------------------------------------------------------------- toolbar */
html body.pm-site .woocommerce-result-count { font: 400 .875rem/48px var(--pm-font-body) !important; color: var(--pm-text-2) !important; margin: 0 !important; }
html body.pm-site .woocommerce-ordering select {
	height: 48px; padding: 0 40px 0 16px !important;
	border: 1px solid var(--pm-line) !important; border-radius: 0 !important;
	font: 500 .9375rem var(--pm-font-body) !important; color: var(--pm-ink) !important;
	background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12'%3E%3Cpath d='M2 4l4 4 4-4' fill='none' stroke='%230e1314' stroke-width='1.5'/%3E%3C/svg%3E") no-repeat right 14px center !important;
	-webkit-appearance: none; appearance: none;
	transition: border-color var(--pm-hover);
}
html body.pm-site .woocommerce-ordering select:hover, html body.pm-site .woocommerce-ordering select:focus { border-color: var(--pm-ink) !important; }
html body.pm-site .pmg-view-toggle button { width: 48px; height: 48px; border-radius: 0 !important; border-color: var(--pm-line) !important; transition: background-color var(--pm-hover), color var(--pm-hover); }
html body.pm-site .pmg-view-toggle button[aria-pressed="true"] { background: var(--pm-ink) !important; border-color: var(--pm-ink) !important; color: #fff !important; }

/* ---------------------------------------------------------------- sidebar */
@media (min-width: 992px) {
	html body.pm-site.archive .nt-shop-page .col-lg-3 { position: sticky; top: calc(var(--pm-hh) + 24px); align-self: flex-start; padding-right: 40px !important; }
}
html body.pm-site .nt-sidebar-inner-widget { margin: 0 0 36px !important; padding: 0 0 32px; border-bottom: 1px solid var(--pm-line); }
html body.pm-site .nt-sidebar-inner-widget:last-child { border-bottom: 0; }
html body.pm-site .nt-sidebar-inner-widget-title.widget-title {
	margin: 0 0 18px !important; padding: 0 !important; border: 0 !important;
	font: 700 .8125rem/1.2 var(--pm-font-display) !important;
	letter-spacing: .14em !important; text-transform: uppercase !important;
	color: var(--pm-ink) !important;
	display: flex; align-items: center; gap: 12px;
}
html body.pm-site .nt-sidebar-inner-widget-title.widget-title::before { content: ""; flex: 0 0 24px; height: 2px; background: var(--pm-brand); }
html body.pm-site .nt-sidebar-inner-widget-title.widget-title::after { content: none !important; display: none !important; }

/* search */
html body.pm-site .nt-sidebar-inner-widget .sidebar_search { display: flex; position: relative; }
html body.pm-site .nt-sidebar-inner-widget .sidebar_search_input {
	flex: 1; min-width: 0; height: 52px; padding: 0 14px !important;
	border: 1px solid var(--pm-line) !important; border-right: 0 !important; border-radius: 0 !important;
	font: 400 1rem var(--pm-font-body) !important; color: var(--pm-ink) !important; background: #fff !important;
	transition: border-color var(--pm-hover);
}
html body.pm-site .nt-sidebar-inner-widget .sidebar_search_input:focus { border-color: var(--pm-ink) !important; outline: 0; }
html body.pm-site .nt-sidebar-inner-widget .sidebar_search_button { position: static !important; width: 52px; height: 52px; padding: 0 !important; }

/* price filter: brand colours instead of Wavo purple / mint */
html body.pm-site .widget_price_filter .price_slider_wrapper .ui-widget-content,
html body.pm-site .widget_price_filter .price_slider { height: 2px !important; margin: 18px 7px 26px !important; border: 0 !important; border-radius: 0 !important; background: var(--pm-line) !important; }
html body.pm-site .widget_price_filter .ui-slider .ui-slider-range { height: 2px !important; top: 0 !important; background: var(--pm-brand) !important; border-radius: 0 !important; }
html body.pm-site .widget_price_filter .ui-slider .ui-slider-handle {
	top: -7px !important; width: 16px !important; height: 16px !important; margin-left: -8px !important;
	border: 2px solid var(--pm-brand) !important; border-radius: var(--pm-radius-round) !important;
	background: #fff !important; box-shadow: none !important; cursor: grab;
	transition: background-color var(--pm-hover);
}
html body.pm-site .widget_price_filter .ui-slider .ui-slider-handle:hover,
html body.pm-site .widget_price_filter .ui-slider .ui-slider-handle.ui-state-active { background: var(--pm-brand) !important; }
html body.pm-site .widget_price_filter .price_slider_amount { display: flex !important; flex-direction: row-reverse; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; text-align: left !important; }
html body.pm-site .widget_price_filter .price_slider_amount .price_label { font: 500 .9375rem var(--pm-font-body) !important; color: var(--pm-ink) !important; float: none !important; }
html body.pm-site .widget_price_filter .price_slider_amount .button { float: none !important; margin: 0 !important; }
html body.pm-site .widget_price_filter .price_slider_amount .clear { display: none; }

/* categories */
html body.pm-site .widget_product_categories ul.product-categories { border-top: 1px solid var(--pm-line); }
html body.pm-site .widget_product_categories li { display: flex; flex-wrap: nowrap; align-items: center; margin: 0 !important; padding: 0 !important; border-bottom: 1px solid var(--pm-line) !important; }
html body.pm-site .widget_product_categories li::before { content: none !important; }
html body.pm-site .widget_product_categories li > a {
	position: relative; flex: 1;
	display: flex; justify-content: space-between; align-items: center;
	padding: 13px 0 !important;
	font: 500 .9375rem/1.3 var(--pm-font-body) !important;
	color: var(--pm-ink) !important; text-decoration: none !important; text-transform: none !important;
	transition: color var(--pm-hover) !important;
}
html body.pm-site .widget_product_categories li > a::after {
	content: ""; width: 14px; height: 10px; flex: 0 0 14px;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 10'%3E%3Cpath d='M0 5h12M8 1l4 4-4 4' fill='none' stroke='black' stroke-width='1.5'/%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 14 10'%3E%3Cpath d='M0 5h12M8 1l4 4-4 4' fill='none' stroke='black' stroke-width='1.5'/%3E%3C/svg%3E") center / contain no-repeat;
	opacity: 0; transform: translateX(-6px);
	transition: opacity var(--pm-hover), transform var(--pm-hover);
}
html body.pm-site .widget_product_categories li > a:hover { color: var(--pm-brand) !important; padding-left: 0 !important; }
html body.pm-site .widget_product_categories li > a:hover::after,
html body.pm-site .widget_product_categories li.current-cat > a::after { opacity: 1; transform: none; }
html body.pm-site .widget_product_categories li.current-cat > a { color: var(--pm-brand) !important; font-weight: 600 !important; }
html body.pm-site .widget_product_categories li .count { order: 2; flex: 0 0 auto; margin-left: 12px; padding-left: 8px; font-size: .8125rem; color: var(--pm-text-2); }

/* ---------------------------------------------------------------- single product */
html body.pm-site.single-product div.product .product_title { font: 800 clamp(1.8rem, 1.3rem + 1.6vw, 2.75rem)/1.05 var(--pm-font-display) !important; letter-spacing: -.01em !important; text-transform: none; margin-bottom: 14px !important; }
html body.pm-site.single-product div.product .summary .price { font: 600 1.625rem/1.2 var(--pm-font-body) !important; color: var(--pm-ink) !important; margin: 0 0 20px !important; }
html body.pm-site.single-product div.product .woocommerce-product-details__short-description { margin: 0 0 24px; font-size: 1.0625rem; line-height: 1.6; color: var(--pm-text-2); max-width: 56ch; }
html body.pm-site.single-product div.product form.cart .single_add_to_cart_button { flex: 1 1 auto; min-height: 54px !important; }
html body.pm-site.single-product div.product .woocommerce-product-rating { margin-bottom: 10px; }
html body.pm-site.single-product div.product .woocommerce-product-rating .star-rating span::before,
html body.pm-site.single-product div.product .star-rating span::before { color: var(--pm-brand) !important; }
html body.pm-site.single-product div.product .woocommerce-review-link { font-size: .8125rem; color: var(--pm-text-2); }
html body.pm-site.single-product .pmg-trust { border-color: var(--pm-line) !important; }
html body.pm-site.single-product .pmg-trust svg { color: var(--pm-brand) !important; }

.pm-custom-order {
	display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 16px 24px;
	margin: 28px 0 0; padding: 22px 24px;
	background: var(--pm-surface-2);
	border-left: 0;
}
.pm-custom-order strong { display: block; font: 700 1.0625rem/1.3 var(--pm-font-display); color: var(--pm-ink); }
.pm-custom-order span { display: block; margin-top: 4px; font-size: .9375rem; color: var(--pm-text-2); }
@media (max-width: 599px) { .pm-custom-order { grid-template-columns: 1fr; } .pm-custom-order .pm-btn { width: 100%; } }

/* ================================================================ mini cart
 * Opens only on click (no automatic pop-up). Fixed under the header, never off-screen,
 * one scroll area for the whole panel instead of a cropped inner list. */
html body.pm-site .header-cart-panel {
	position: fixed !important;
	top: calc(var(--pm-hh) + var(--wp-admin--admin-bar--height, 0px) - 1px) !important;
	transform: none !important;
	width: 400px !important; max-width: calc(100vw - 24px) !important;
	max-height: calc(100vh - var(--pm-hh) - var(--wp-admin--admin-bar--height, 0px) - 24px) !important;
	overflow-y: auto !important; overscroll-behavior: contain;
	padding: 0 !important;
	background: #fff !important;
	border-top: 2px solid var(--pm-brand);
	box-shadow: 0 16px 40px rgb(14 19 20 / .2) !important;
	font-family: var(--pm-font-body) !important;
}
html body.pm-site .header-cart-panel .widget_shopping_cart_content { padding: 4px 24px 24px; }
html body.pm-site .header-cart-panel ul.cart_list { margin: 0 !important; max-height: none !important; overflow: visible !important; }
html body.pm-site .header-cart-panel ul.cart_list li {
	display: grid !important; grid-template-columns: 64px minmax(0, 1fr) 24px; column-gap: 14px; row-gap: 4px;
	align-items: start; padding: 16px 0 !important;
	border-bottom: 1px solid var(--pm-line) !important;
}
html body.pm-site .header-cart-panel ul.cart_list li > a:not(.remove) { display: contents !important; }
html body.pm-site .header-cart-panel ul.cart_list li img { grid-column: 1; grid-row: 1 / span 2; width: 64px !important; height: 64px !important; object-fit: cover; margin: 0 !important; background: var(--pm-surface-2); }
html body.pm-site .header-cart-panel ul.cart_list li .pm-mc-name { grid-column: 2; grid-row: 1; font: 600 .9375rem/1.35 var(--pm-font-body); color: var(--pm-ink); transition: color var(--pm-hover); }
html body.pm-site .header-cart-panel ul.cart_list li > a:not(.remove):hover .pm-mc-name { color: var(--pm-brand); }
html body.pm-site .header-cart-panel ul.cart_list li .quantity {
	grid-column: 2; grid-row: 2;
	display: block !important; width: auto !important; height: auto !important;
	margin: 0 !important; padding: 0 !important; border: 0 !important; background: none !important;
	font: 400 .875rem/1.3 var(--pm-font-body) !important; color: var(--pm-text-2) !important;
}
html body.pm-site .header-cart-panel ul.cart_list li .quantity .amount { color: var(--pm-ink); font-weight: 600; }
html body.pm-site .header-cart-panel ul.cart_list li a.remove {
	grid-column: 3; grid-row: 1; position: static !important;
	display: grid !important; place-items: center; width: 24px !important; height: 24px !important;
	border-radius: 0 !important; background: none !important;
	color: var(--pm-text-2) !important; font-size: 20px !important; line-height: 1 !important;
	transition: color var(--pm-hover);
}
html body.pm-site .header-cart-panel ul.cart_list li a.remove:hover { color: var(--pm-danger) !important; }
html body.pm-site .header-cart-panel p.total { display: flex; justify-content: space-between; align-items: baseline; margin: 0 !important; padding: 18px 0 !important; font-size: .9375rem !important; color: var(--pm-text-2); }
html body.pm-site .header-cart-panel p.total strong { font-weight: 500 !important; }
html body.pm-site .header-cart-panel p.total .amount { font: 700 1.1875rem/1 var(--pm-font-body); color: var(--pm-ink); }
html body.pm-site .header-cart-panel .woocommerce-mini-cart__buttons { display: grid !important; gap: 8px !important; }
html body.pm-site .header-cart-panel .woocommerce-mini-cart__empty-message { padding: 32px 0 12px; text-align: center; font-size: .9375rem; color: var(--pm-text-2); }
@media (max-width: 480px) {
	html body.pm-site .header-cart-panel { left: 12px !important; right: 12px !important; width: auto !important; }
}

/* small confirmation on the product button after adding */
html body.pm-site ul.products li.product .product-content-wrap > a.button.pm-just-added { background-size: 100% 100%, auto !important; border-color: var(--pm-ink) !important; }

html body.pm-site.single-product .product_meta .posted_in { display: none; } /* category already shown above the title */
html body.pm-site.single-product div.product .woocommerce-tabs .panel { font-size: 1.0625rem; line-height: 1.7; color: var(--pm-text-2); max-width: 72ch; }
html body.pm-site #respond input[type="text"], html body.pm-site #respond input[type="email"], html body.pm-site #respond textarea { border: 1px solid var(--pm-line) !important; border-radius: 0 !important; }
