/* =========================================================================
   Naomi Pet House — woocommerce.css
   Clean, app-like WooCommerce overrides. Replaces default WC styling.
   ========================================================================= */

/* ---- Generic WooCommerce resets -------------------------------------- */

.woocommerce .button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button {
	background-color: var(--naomi-primary);
	color: #fff;
	border: none;
	border-radius: var(--naomi-radius-pill);
	font-family: var(--naomi-font-head);
	font-weight: 500;
	font-size: 14px;
	padding: 12px 24px;
	line-height: 1;
	text-transform: none;
	transition: background-color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
	cursor: pointer;
}

.woocommerce .button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover {
	background-color: #cc1525;
	color: #fff;
	transform: translateY(-1.5px);
	box-shadow: 0 4px 12px rgba(232, 25, 44, 0.18);
}

.woocommerce .button.alt,
.woocommerce button.button.alt {
	background-color: var(--naomi-primary);
}

.woocommerce span.onsale {
	background-color: var(--naomi-primary);
	color: #fff;
	border-radius: var(--naomi-radius-pill);
	font-family: var(--naomi-font-head);
	font-weight: 600;
	font-size: 12px;
	min-height: auto;
	min-width: auto;
	padding: 4px 12px;
	line-height: 1.2;
}

.woocommerce .woocommerce-message,
.woocommerce .woocommerce-info,
.woocommerce .woocommerce-error,
.woocommerce-notices-wrapper .woocommerce-message,
.woocommerce-notices-wrapper .woocommerce-info {
	border-top: none;
	border-radius: var(--naomi-radius-sm);
	background-color: var(--naomi-surface);
	color: var(--naomi-dark);
	padding: 14px 18px 14px 44px;
	font-size: 14px;
}

.woocommerce .woocommerce-message::before,
.woocommerce .woocommerce-info::before {
	color: var(--naomi-primary);
}

.woocommerce .woocommerce-error {
	background-color: var(--naomi-red-light);
}

/* ---- Shop / archive toolbar ------------------------------------------ */

.naomi-shop__head {
	padding: 24px 0 8px;
}

.naomi-shop__title {
	margin: 0 0 4px;
}

.naomi-shop__toolbar {
	gap: 12px;
	margin-bottom: 20px;
}

.woocommerce .woocommerce-ordering select,
.woocommerce-page .woocommerce-ordering select {
	border: var(--naomi-border-base) solid var(--naomi-border);
	border-radius: var(--naomi-radius-pill);
	padding: 8px 16px;
	font-family: var(--naomi-font-body);
	font-size: 14px;
	background-color: var(--naomi-bg);
}

.woocommerce .woocommerce-result-count {
	color: var(--naomi-muted);
	font-size: 14px;
	margin: 0;
}

/* ---- Subcategory quick-links (on category archives) ------------------ */

.naomi-subcats-section {
	padding-top: 0;
	padding-bottom: 8px;
}

.naomi-subcats {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.naomi-subcat-card {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 9px 16px;
	border: var(--naomi-border-base) solid var(--naomi-border);
	border-radius: var(--naomi-radius-pill);
	background-color: var(--naomi-bg);
	color: var(--naomi-dark);
	text-decoration: none;
	font-family: var(--naomi-font-head);
	font-weight: 500;
	font-size: 14px;
	transition: border-color 0.15s ease, color 0.15s ease, background-color 0.15s ease;
}

.naomi-subcat-card:hover {
	text-decoration: none;
	border-color: var(--naomi-primary);
	color: var(--naomi-primary);
	background-color: var(--naomi-surface);
}

.naomi-subcat-card__count {
	font-size: 12px;
	color: var(--naomi-muted);
	background-color: var(--naomi-neutral);
	border-radius: var(--naomi-radius-pill);
	padding: 1px 8px;
	min-width: 22px;
	text-align: center;
}

/* ---- Shop layout: filters sidebar + product grid -------------------- */

.naomi-shop__layout {
	display: flex;
	align-items: flex-start;
	gap: 28px;
}

.naomi-shop__content {
	flex: 1 1 auto;
	min-width: 0;
}

.naomi-filters {
	flex: 0 0 230px;
	position: sticky;
	top: 90px;
	padding: 18px;
	border: var(--naomi-border-base) solid var(--naomi-border);
	border-radius: var(--naomi-radius-card-sm);
	background-color: var(--naomi-bg);
}

.naomi-filters__head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	margin-bottom: 14px;
}

.naomi-filters__title {
	font-family: var(--naomi-font-head);
	font-weight: 600;
	font-size: 17px;
	margin: 0;
}

.naomi-filters__clear {
	font-size: 13px;
	color: var(--naomi-primary);
	text-decoration: none;
}

.naomi-filters__clear:hover {
	text-decoration: underline;
}

.naomi-filter-group {
	padding: 14px 0;
	border-top: var(--naomi-border-base) solid var(--naomi-border);
}

.naomi-filter-group:first-of-type {
	border-top: none;
	padding-top: 0;
}

.naomi-filter-group__title {
	font-family: var(--naomi-font-head);
	font-weight: 600;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--naomi-muted);
	margin: 0 0 10px;
}

.naomi-filter-price__row {
	display: flex;
	align-items: center;
	gap: 6px;
}

.naomi-filter-price__row input {
	width: 100%;
	min-width: 0;
	border: var(--naomi-border-base) solid var(--naomi-border);
	border-radius: 10px;
	padding: 7px 10px;
	font-family: var(--naomi-font-body);
	font-size: 14px;
	background-color: var(--naomi-bg);
}

.naomi-filter-price__sep {
	color: var(--naomi-muted);
}

.naomi-filter-price__go {
	flex: 0 0 auto;
	border: none;
	background-color: var(--naomi-dark);
	color: #fff;
	border-radius: 10px;
	padding: 8px 12px;
	font-family: var(--naomi-font-head);
	font-weight: 500;
	font-size: 13px;
	cursor: pointer;
	transition: background-color 0.15s ease;
}

.naomi-filter-price__go:hover {
	background-color: var(--naomi-primary);
}

.naomi-filter-terms {
	display: flex;
	flex-direction: column;
	gap: 2px;
	max-height: 240px;
	overflow-y: auto;
}

.naomi-filter-terms--chips {
	flex-direction: row;
	flex-wrap: wrap;
	gap: 6px;
	max-height: none;
}

.naomi-filter-term {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	padding: 6px 8px;
	border-radius: 8px;
	color: var(--naomi-dark);
	text-decoration: none;
	font-size: 14px;
	transition: background-color 0.12s ease, color 0.12s ease;
}

.naomi-filter-term:hover {
	text-decoration: none;
	background-color: var(--naomi-surface);
	color: var(--naomi-primary);
}

.naomi-filter-term.is-active {
	background-color: #FFF0F0;
	color: var(--naomi-primary);
	font-weight: 500;
}

.naomi-filter-term.is-active .naomi-filter-term__name::before {
	content: "✓ ";
}

.naomi-filter-term__count {
	font-size: 12px;
	color: var(--naomi-muted);
}

.naomi-filter-terms--chips .naomi-filter-term {
	border: var(--naomi-border-base) solid var(--naomi-border);
	border-radius: var(--naomi-radius-pill);
	padding: 5px 12px;
}

.naomi-filter-terms--chips .naomi-filter-term.is-active {
	border-color: var(--naomi-primary);
}

.naomi-filter-terms--chips .naomi-filter-term__count {
	display: none;
}

/* Mobile-only "Φίλτρα" toggle button (shown via mobile.css) */
.naomi-filters-toggle {
	display: none;
	align-items: center;
	gap: 6px;
	border: var(--naomi-border-base) solid var(--naomi-border);
	border-radius: var(--naomi-radius-pill);
	background-color: var(--naomi-bg);
	color: var(--naomi-dark);
	padding: 8px 16px;
	font-family: var(--naomi-font-head);
	font-weight: 500;
	font-size: 14px;
	cursor: pointer;
}

/* ---- Breadcrumbs ----------------------------------------------------- */

.woocommerce-breadcrumb {
	font-size: 13px;
	color: var(--naomi-muted);
	margin: 0 0 18px;
	padding-top: 20px;
}

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

.woocommerce-breadcrumb a:hover {
	color: var(--naomi-primary);
	text-decoration: none;
}

/* ---- Single product: image left / details right (desktop) ------------ */

/* The product container stacks vertically: [image + summary] → [tabs] → [related] */
.naomi-single-product-page .product,
.woocommerce div.product {
	display: block;
}

/* Image left / details right — the 2-column grid lives on the wrapper that
   holds the gallery and the summary. */
.naomi-single-product {
	position: relative;
	margin-bottom: 48px;
}

/* Image left / details right only from tablet up; on mobile it stacks. */
@media (min-width: 768px) {
	.naomi-single-product {
		display: grid;
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
		gap: 48px;
		align-items: start;
	}
}

/* Sale badge floats over the gallery rather than taking up a grid cell. */
.naomi-single-product > .onsale,
.woocommerce span.onsale {
	position: absolute;
	top: 16px;
	left: 16px;
	z-index: 3;
	margin: 0;
	background-color: var(--naomi-primary);
	color: #fff;
	font-family: var(--naomi-font-head);
	font-weight: 600;
	font-size: 12px;
	line-height: 1.4;
	padding: 5px 12px;
	border-radius: var(--naomi-radius-pill);
	min-height: 0;
}

/* Gallery fills its column */
.woocommerce-product-gallery,
.woocommerce div.product div.images {
	width: 100% !important;
	float: none;
	margin: 0;
}

.woocommerce-product-gallery img,
.woocommerce div.product div.images img {
	border-radius: var(--naomi-radius-card);
	border: var(--naomi-border-base) solid var(--naomi-border);
}

/* Summary column */
.naomi-single-product .summary,
.woocommerce div.product div.summary {
	width: 100%;
	float: none;
	margin: 0;
}

.woocommerce div.product .product_title {
	font-family: var(--naomi-font-head);
	font-weight: 500;
	font-size: 26px;
	margin: 0 0 12px;
}

.woocommerce div.product p.price,
.woocommerce div.product span.price {
	color: var(--naomi-dark);
	font-family: var(--naomi-font-head);
	font-weight: 600;
	font-size: 22px;
	margin-bottom: 18px;
}

.woocommerce div.product p.price ins,
.woocommerce div.product span.price ins {
	color: var(--naomi-primary);
	text-decoration: none;
}

.woocommerce div.product p.price del {
	color: var(--naomi-muted);
	opacity: 0.7;
}

.woocommerce div.product .woocommerce-product-details__short-description {
	color: var(--naomi-muted);
	font-size: 15px;
	margin-bottom: 20px;
}

/* Quantity + full-width add to cart */
.woocommerce div.product form.cart {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px;
	margin-bottom: 24px;
}

.woocommerce .quantity .qty {
	width: 72px;
	height: 48px;
	border: var(--naomi-border-base) solid var(--naomi-border);
	border-radius: var(--naomi-radius-pill);
	text-align: center;
	font-family: var(--naomi-font-body);
	font-size: 15px;
	background-color: var(--naomi-bg);
}

.woocommerce div.product form.cart .button,
.woocommerce div.product form.cart button.single_add_to_cart_button {
	flex: 1 1 auto;
	width: 100%;
	min-width: 200px;
	background-color: var(--naomi-primary);
	color: #fff;
	border-radius: var(--naomi-radius-pill);
	font-family: var(--naomi-font-head);
	font-weight: 500;
	font-size: 15px;
	padding: 15px 24px;
	text-align: center;
}

.woocommerce div.product .product_meta {
	font-size: 13px;
	color: var(--naomi-muted);
	border-top: var(--naomi-border-base) solid var(--naomi-border);
	padding-top: 16px;
}

/* Product tabs */
.woocommerce div.product .woocommerce-tabs {
	grid-column: 1 / -1;
	margin-top: 24px;
}

.woocommerce div.product .woocommerce-tabs ul.tabs {
	padding: 0;
	margin: 0 0 16px;
	border-bottom: var(--naomi-border-base) solid var(--naomi-border);
}

.woocommerce div.product .woocommerce-tabs ul.tabs::before {
	border-bottom: none;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li {
	background: transparent;
	border: none;
	border-radius: 0;
	margin: 0 8px 0 0;
	padding: 0;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
	font-family: var(--naomi-font-head);
	font-weight: 500;
	font-size: 14px;
	color: var(--naomi-muted);
	padding: 10px 4px;
	display: inline-block;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
	color: var(--naomi-primary);
	box-shadow: inset 0 -2px 0 var(--naomi-primary);
}

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

.naomi-related {
	grid-column: 1 / -1;
}

/* ---- "Πρόσφατα είδες" (recently viewed) ----------------------------- */
.naomi-recent {
	margin-top: 56px;
	padding-top: 32px;
	border-top: var(--naomi-border-base) solid var(--naomi-border);
}

.naomi-recent[hidden] {
	display: none;
}

.naomi-recent > h2 {
	font-family: var(--naomi-font-head);
	font-size: 22px;
	margin: 0 0 20px;
}

/* ---- Cart page: clean table, no borders, red totals ------------------ */

.woocommerce table.shop_table,
.woocommerce-page table.shop_table {
	border: none;
	border-radius: var(--naomi-radius-card);
	border-collapse: collapse;
	background-color: var(--naomi-bg);
}

.woocommerce table.shop_table th,
.woocommerce table.shop_table td {
	border: none;
	border-bottom: var(--naomi-border-base) solid var(--naomi-border);
	padding: 16px 12px;
	font-size: 14px;
}

.woocommerce table.shop_table thead th {
	font-family: var(--naomi-font-head);
	font-weight: 500;
	color: var(--naomi-muted);
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 0.04em;
}

.woocommerce table.cart img {
	width: 64px;
	border-radius: var(--naomi-radius-sm);
}

.woocommerce a.remove {
	color: var(--naomi-primary) !important;
	border: var(--naomi-border-base) solid var(--naomi-border);
	border-radius: 50%;
	font-weight: 400;
}

.woocommerce a.remove:hover {
	background-color: var(--naomi-primary) !important;
	color: #fff !important;
}

.woocommerce .cart-collaterals .cart_totals,
.woocommerce-page .cart-collaterals .cart_totals {
	background-color: var(--naomi-surface);
	border: var(--naomi-border-base) solid var(--naomi-border);
	border-radius: var(--naomi-radius-card);
	padding: 20px;
	float: none;
	width: 100%;
}

.woocommerce .cart_totals h2 {
	font-size: 20px;
	margin: 0 0 12px;
}

.woocommerce .cart_totals table.shop_table {
	background: transparent;
}

.woocommerce .cart_totals .order-total .amount,
.woocommerce .cart_totals .order-total th {
	color: var(--naomi-primary);
	font-family: var(--naomi-font-head);
	font-weight: 700;
	font-size: 18px;
}

.woocommerce .wc-proceed-to-checkout a.checkout-button {
	width: 100%;
	text-align: center;
	background-color: var(--naomi-primary);
	font-size: 15px;
	padding: 15px 24px;
}

.woocommerce .cart input.button[name="update_cart"] {
	background-color: transparent;
	color: var(--naomi-primary);
	border: var(--naomi-border-base) solid var(--naomi-red-lighter);
}

.woocommerce .coupon .input-text {
	border: var(--naomi-border-base) solid var(--naomi-border);
	border-radius: var(--naomi-radius-pill);
	padding: 10px 16px;
}

/* ---- Checkout: clean labels, red place order ------------------------- */

.woocommerce-checkout .col2-set .col-1,
.woocommerce-checkout .col2-set .col-2 {
	width: 100%;
	float: none;
}

.woocommerce form .form-row label,
.woocommerce-page form .form-row label {
	font-family: var(--naomi-font-head);
	font-weight: 500;
	font-size: 13px;
	color: var(--naomi-dark);
	margin-bottom: 6px;
}

.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 {
	border: var(--naomi-border-base) solid var(--naomi-border);
	border-radius: var(--naomi-radius-sm);
	padding: 12px 14px;
	font-family: var(--naomi-font-body);
	font-size: 14px;
	background-color: var(--naomi-bg);
	min-height: 46px;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus,
.woocommerce-page form .form-row input.input-text:focus,
.select2-container--focus .select2-selection--single,
.select2-container--open .select2-selection--single {
	outline: none;
	border-color: var(--naomi-primary) !important;
	box-shadow: 0 0 0 3px rgba(232, 25, 44, 0.12);
}

.woocommerce-checkout #payment {
	background-color: var(--naomi-surface);
	border-radius: var(--naomi-radius-card);
	border: var(--naomi-border-base) solid var(--naomi-border);
}

.woocommerce-checkout #payment ul.payment_methods {
	list-style: none;
	margin: 0;
	padding: 0;
	border-bottom: var(--naomi-border-base) solid var(--naomi-border);
}

.woocommerce-checkout #payment ul.payment_methods li {
	list-style: none;
	margin: 0;
	padding: 8px 0;
}

.woocommerce-checkout #payment ul.payment_methods li::before {
	content: none;
}

/* Reset bullets on WooCommerce UI lists left unstyled after dequeuing core CSS
   (shipping options in the order review, notices). */
.woocommerce ul#shipping_method,
.woocommerce-checkout-review-order-table ul,
#order_review ul,
.woocommerce-cart ul.shipping__list,
ul.woocommerce-error,
ul.woocommerce-message,
.woocommerce-info,
ul.woocommerce-info {
	list-style: none;
	margin-left: 0;
	padding-left: 0;
}

.woocommerce ul#shipping_method li,
.woocommerce-checkout-review-order-table ul li,
#order_review ul li {
	list-style: none;
	margin-left: 0;
}

.woocommerce ul#shipping_method li::before,
.woocommerce-checkout-review-order-table ul li::before {
	content: none;
}

.woocommerce #payment #place_order,
.woocommerce-checkout #place_order {
	width: 100%;
	background-color: var(--naomi-primary);
	color: #fff;
	border-radius: var(--naomi-radius-pill);
	font-family: var(--naomi-font-head);
	font-weight: 500;
	font-size: 16px;
	padding: 16px 24px;
}

.woocommerce-checkout-review-order-table .order-total .amount {
	color: var(--naomi-primary);
	font-weight: 700;
}

/* ---- Consistent, full-width form fields (fixes ragged widths) -------- */

.woocommerce form .form-row {
	margin: 0 0 14px;
	padding: 0;
	width: 100%;
}

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce form .form-row .select2-container {
	width: 100% !important;
	box-sizing: border-box;
}

/* First / last name (and other paired rows) sit side by side on desktop */
@media (min-width: 600px) {
	.woocommerce form .form-row-first,
	.woocommerce form .form-row-last {
		width: calc(50% - 8px);
		display: inline-block;
		vertical-align: top;
	}

	.woocommerce form .form-row-first {
		margin-right: 16px;
	}
}

/* ---- Cart & Checkout: modern 2-column page layout -------------------- */

/* Cross-sells would be cramped in the totals sidebar — hide for a clean cart. */
.woocommerce-cart .cart-collaterals .cross-sells {
	display: none;
}

@media (min-width: 769px) {

	/* Cart: line items left, sticky totals card on the right */
	.woocommerce-cart .woocommerce {
		display: grid;
		grid-template-columns: minmax(0, 1fr) 340px;
		column-gap: 32px;
		align-items: start;
	}

	/* Empty cart has no totals — keep it single column */
	.woocommerce-cart .woocommerce:has(.cart-empty),
	.woocommerce-cart .woocommerce:has(.wc-empty-cart-message) {
		display: block;
	}

	.woocommerce-cart .woocommerce-notices-wrapper {
		grid-column: 1 / -1;
	}

	.woocommerce-cart form.woocommerce-cart-form {
		grid-column: 1;
		grid-row: 2;
		margin: 0;
	}

	.woocommerce-cart .cart-collaterals {
		grid-column: 2;
		grid-row: 2;
		width: 100%;
	}

	.woocommerce-cart .cart-collaterals .cart_totals {
		width: 100%;
		position: sticky;
		top: 90px;
	}

	/* Checkout: billing/shipping left, sticky order review + payment right */
	.woocommerce-checkout form.checkout {
		display: grid;
		grid-template-columns: minmax(0, 1fr) 380px;
		column-gap: 40px;
		align-items: start;
	}

	.woocommerce-checkout form.checkout #customer_details {
		grid-column: 1;
		grid-row: 1 / span 2;
	}

	.woocommerce-checkout form.checkout #order_review_heading {
		grid-column: 2;
		grid-row: 1;
		margin-top: 0;
	}

	.woocommerce-checkout form.checkout #order_review {
		grid-column: 2;
		grid-row: 2;
		position: sticky;
		top: 90px;
		background-color: var(--naomi-bg);
		border: var(--naomi-border-base) solid var(--naomi-border);
		border-radius: var(--naomi-radius-card);
		padding: 22px;
	}
}

/* Page title spacing on plain pages */
.naomi-page__title {
	margin: 24px 0 20px;
}

/* ---- My Account: vertical sidebar nav with icons --------------------- */

.woocommerce-account .woocommerce-MyAccount-navigation,
.woocommerce-account.woocommerce-page .woocommerce-MyAccount-navigation {
	float: none;
	width: 240px;
	flex: 0 0 240px;
}

.woocommerce-account .woocommerce-MyAccount-content,
.woocommerce-account.woocommerce-page .woocommerce-MyAccount-content {
	float: none;
	width: auto;
	flex: 1 1 auto;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul,
.woocommerce-account .woocommerce-MyAccount-navigation ul li {
	list-style: none;
	margin: 0;
	padding: 0;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul {
	border: var(--naomi-border-base) solid var(--naomi-border);
	border-radius: var(--naomi-radius-card);
	overflow: hidden;
	background-color: var(--naomi-bg);
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li {
	border-bottom: var(--naomi-border-base) solid var(--naomi-border);
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li:last-child {
	border-bottom: none;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li a {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 13px 16px;
	font-family: var(--naomi-font-head);
	font-weight: 500;
	font-size: 14px;
	color: var(--naomi-dark);
	text-decoration: none;
	transition: background-color 0.15s ease, color 0.15s ease;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li a::before {
	content: "";
	width: 18px;
	height: 18px;
	flex: 0 0 18px;
	background-color: currentColor;
	-webkit-mask-size: contain;
	mask-size: contain;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	opacity: 0.85;
}

/* Default icon (low specificity) so any unmapped endpoint never shows a solid
   square; the per-endpoint rules below override it. */
.woocommerce-MyAccount-navigation a::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 8v4l3 2'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 8v4l3 2'/%3E%3C/svg%3E");
}

.woocommerce-account .woocommerce-MyAccount-navigation-link--downloads a::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v12'/%3E%3Cpath d='M7 11l5 5 5-5'/%3E%3Cpath d='M5 21h14'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v12'/%3E%3Cpath d='M7 11l5 5 5-5'/%3E%3Cpath d='M5 21h14'/%3E%3C/svg%3E");
}

.woocommerce-account .woocommerce-MyAccount-navigation-link--payment-methods a::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='5' width='20' height='14' rx='2'/%3E%3Cpath d='M2 10h20'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='5' width='20' height='14' rx='2'/%3E%3Cpath d='M2 10h20'/%3E%3C/svg%3E");
}

.woocommerce-account .woocommerce-MyAccount-navigation-link--dashboard a::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 10.5 12 3l9 7.5'/%3E%3Cpath d='M5 9.5V20a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V9.5'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 10.5 12 3l9 7.5'/%3E%3Cpath d='M5 9.5V20a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V9.5'/%3E%3C/svg%3E");
}

.woocommerce-account .woocommerce-MyAccount-navigation-link--orders a::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 7h12l1 13H5L6 7z'/%3E%3Cpath d='M9 7V6a3 3 0 0 1 6 0v1'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 7h12l1 13H5L6 7z'/%3E%3Cpath d='M9 7V6a3 3 0 0 1 6 0v1'/%3E%3C/svg%3E");
}

.woocommerce-account .woocommerce-MyAccount-navigation-link--edit-address a::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 10c0 6-9 12-9 12s-9-6-9-12a9 9 0 0 1 18 0z'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 10c0 6-9 12-9 12s-9-6-9-12a9 9 0 0 1 18 0z'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E");
}

.woocommerce-account .woocommerce-MyAccount-navigation-link--edit-account a::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21c0-4 3.6-6.5 8-6.5s8 2.5 8 6.5'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21c0-4 3.6-6.5 8-6.5s8 2.5 8 6.5'/%3E%3C/svg%3E");
}

.woocommerce-account .woocommerce-MyAccount-navigation-link--pet a::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cellipse cx='6' cy='11' rx='1.7' ry='2.2'/%3E%3Cellipse cx='10' cy='7.5' rx='1.7' ry='2.3'/%3E%3Cellipse cx='14' cy='7.5' rx='1.7' ry='2.3'/%3E%3Cellipse cx='18' cy='11' rx='1.7' ry='2.2'/%3E%3Cpath d='M12 12c-2.5 0-4.6 1.9-5 4.2-.3 1.7 1 3.1 2.7 3.1.9 0 1.6-.4 2.3-.4s1.4.4 2.3.4c1.7 0 3-1.4 2.7-3.1-.4-2.3-2.5-4.2-5-4.2z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cellipse cx='6' cy='11' rx='1.7' ry='2.2'/%3E%3Cellipse cx='10' cy='7.5' rx='1.7' ry='2.3'/%3E%3Cellipse cx='14' cy='7.5' rx='1.7' ry='2.3'/%3E%3Cellipse cx='18' cy='11' rx='1.7' ry='2.2'/%3E%3Cpath d='M12 12c-2.5 0-4.6 1.9-5 4.2-.3 1.7 1 3.1 2.7 3.1.9 0 1.6-.4 2.3-.4s1.4.4 2.3.4c1.7 0 3-1.4 2.7-3.1-.4-2.3-2.5-4.2-5-4.2z'/%3E%3C/svg%3E");
}

.woocommerce-account .woocommerce-MyAccount-navigation-link--customer-logout a::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4'/%3E%3Cpath d='M16 17l5-5-5-5'/%3E%3Cpath d='M21 12H9'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4'/%3E%3Cpath d='M16 17l5-5-5-5'/%3E%3Cpath d='M21 12H9'/%3E%3C/svg%3E");
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a,
.woocommerce-account .woocommerce-MyAccount-navigation ul li a:hover {
	background-color: var(--naomi-surface);
	color: var(--naomi-primary);
}

/* Two-column account layout on desktop */
.woocommerce-account .woocommerce-MyAccount-content,
.woocommerce-account .woocommerce-MyAccount-navigation {
	box-sizing: border-box;
}

@media (min-width: 768px) {
	.woocommerce-account .woocommerce {
		display: flex;
		gap: 32px;
		align-items: flex-start;
	}
}

.woocommerce-MyAccount-content {
	font-size: 15px;
}

.woocommerce-MyAccount-content .woocommerce-Address,
.woocommerce .addresses .address {
	border: var(--naomi-border-base) solid var(--naomi-border);
	border-radius: var(--naomi-radius-card);
	padding: 16px;
}

/* ---- Product badges (sale / new / out of stock) --------------------- */

/* WooCommerce loop list reset + grid (WC core CSS is dequeued, so the default
   <ul> 40px padding/bullets must be cleared or the grid overflows on mobile). */
ul.products {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 22px;
}

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); }

/* ---- Premium product cards (shortcode loop + block grid) ------------- */

/* Card container */
.woocommerce ul.products li.product,
.naomi-product-card {
	display: flex;
	flex-direction: column;
	height: 100%;
	margin: 0;
	padding: 0;
	width: auto;
	background-color: var(--naomi-bg);
	border: var(--naomi-border-base) solid var(--naomi-border);
	border-radius: var(--naomi-radius-card);
	overflow: hidden;
	transition: transform 0.18s ease, box-shadow 0.25s ease;
}

.woocommerce ul.products li.product:hover,
.naomi-products-grid .wp-block-post:hover .naomi-product-card {
	transform: translateY(-4px);
	box-shadow: var(--naomi-shadow-card-hover);
}

/* Image box: square, full-bleed (fills the card edge-to-edge, no inset frame) */
.woocommerce ul.products li.product a img,
.naomi-product-card__image img {
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	margin: 0;
	padding: 0;
	background-color: var(--naomi-neutral);
	transition: transform 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.woocommerce ul.products li.product:hover a img,
.naomi-products-grid .wp-block-post:hover .naomi-product-card__image img {
	transform: scale(1.03);
}

.naomi-product-card__image,
.woocommerce ul.products li.product a.woocommerce-LoopProduct-link {
	display: block;
}

/* Title */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.naomi-product-card__title {
	font-family: var(--naomi-font-head);
	font-weight: 600;
	font-size: 15px;
	line-height: 1.3;
	color: var(--naomi-dark);
	padding: 14px 16px 0;
	margin: 0;
}

/* Price */
.woocommerce ul.products li.product .price,
.naomi-product-card .wp-block-woocommerce-product-price {
	font-family: var(--naomi-font-head);
	font-weight: 700;
	font-size: 18px;
	color: var(--naomi-dark);
	padding: 6px 16px 0;
	margin: 0;
}

.woocommerce ul.products li.product .price del {
	color: var(--naomi-muted);
	font-weight: 500;
	font-size: 14px;
}

.woocommerce ul.products li.product .price ins {
	text-decoration: none;
	color: var(--naomi-primary);
}

/* Add-to-cart button: full width, fills with red on card hover */
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .added_to_cart,
.naomi-product-card .wp-block-button__link,
.naomi-product-card .wp-element-button {
	display: block;
	width: auto;
	margin: 14px 16px 16px;
	margin-top: auto;
	text-align: center;
	background-color: var(--naomi-surface);
	color: var(--naomi-primary);
	border: var(--naomi-border-base) solid var(--naomi-red-lighter);
	border-radius: var(--naomi-radius-pill);
	font-family: var(--naomi-font-head);
	font-weight: 600;
	font-size: 14px;
	padding: 11px 14px;
	transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.woocommerce ul.products li.product:hover .button,
.naomi-products-grid .wp-block-post:hover .naomi-product-card .wp-block-button__link {
	background-color: var(--naomi-primary);
	color: #fff;
	border-color: var(--naomi-primary);
}

/* Make every product card a positioning context for its badge. */
.naomi-products-grid .wp-block-post,
ul.products li.product {
	position: relative;
}

/* Hide WooCommerce's default loop sale flash — we render our own badge. */
ul.products li.product > .onsale {
	display: none;
}

/* Shared badge look — one badge per card. The homepage block grid uses a CSS
   ::before badge; the classic loop renders a real .naomi-badge element (so the
   sale badge can show the exact discount %, e.g. "-25%"). */
.naomi-products-grid .wp-block-post.sale::before,
.naomi-products-grid .wp-block-post.naomi-new::before,
.naomi-products-grid .wp-block-post.outofstock::before,
ul.products li.product .naomi-badge {
	position: absolute;
	top: 16px;
	left: 16px;
	z-index: 3;
	padding: 4px 11px;
	border-radius: var(--naomi-radius-pill);
	font-family: var(--naomi-font-head);
	font-weight: 600;
	font-size: 11px;
	line-height: 1.5;
	letter-spacing: 0.02em;
	color: #fff;
	pointer-events: none;
}

/* "Νέο" (lowest priority) */
.naomi-products-grid .wp-block-post.naomi-new::before {
	content: "Νέο";
	background-color: var(--naomi-dark);
}
.naomi-badge--new {
	background-color: var(--naomi-dark);
}

/* Sale — "Προσφορά" on the block grid, exact "-X%" in the classic loop */
.naomi-products-grid .wp-block-post.sale::before {
	content: "Προσφορά";
	background-color: var(--naomi-primary);
}
.naomi-badge--sale {
	background-color: var(--naomi-primary);
}

/* "Εξαντλήθηκε" (overrides all) */
.naomi-products-grid .wp-block-post.outofstock::before {
	content: "Εξαντλήθηκε";
	background-color: #6B7280;
}
.naomi-badge--out {
	background-color: #6B7280;
}

/* Star rating — WooCommerce's core CSS (with its star font) is dequeued, so we
   render the stars ourselves with unicode glyphs and clip the filled overlay to
   the inline width set by WooCommerce. Only appears once a product has reviews. */
.woocommerce ul.products li.product .star-rating {
	position: relative;
	display: block;
	width: 5.6em;
	height: 1.1em;
	margin: 8px 16px 0;
	overflow: hidden;
	font-size: 13px;
	line-height: 1.1;
	font-family: Arial, "Helvetica Neue", sans-serif;
	letter-spacing: 0.08em;
}

.woocommerce ul.products li.product .star-rating::before {
	content: "\2605\2605\2605\2605\2605";
	color: var(--naomi-border);
}

.woocommerce ul.products li.product .star-rating span {
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden;
	white-space: nowrap;
	text-indent: -9999px;
}

.woocommerce ul.products li.product .star-rating span::before {
	content: "\2605\2605\2605\2605\2605";
	position: absolute;
	top: 0;
	left: 0;
	text-indent: 0;
	color: #F5A623;
}

/* Low-stock urgency nudge */
.naomi-low-stock {
	margin: 6px 16px 0;
	font-family: var(--naomi-font-head);
	font-size: 12px;
	font-weight: 600;
	color: var(--naomi-primary);
}

/* Dim out-of-stock product images a touch */
.naomi-products-grid .wp-block-post.outofstock .naomi-product-card__image,
ul.products li.product.outofstock img {
	opacity: 0.65;
}

/* ---- Mini-cart slide-out drawer ------------------------------------- */

.naomi-no-scroll {
	overflow: hidden;
}

.naomi-drawer-backdrop {
	position: fixed;
	inset: 0;
	background-color: rgba(0, 0, 0, 0.45);
	z-index: 300;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.25s ease, visibility 0.25s;
}

.naomi-drawer-backdrop.is-open {
	opacity: 1;
	visibility: visible;
}

.naomi-cart-drawer,
.naomi-wl-drawer {
	position: fixed;
	top: 0;
	right: 0;
	height: 100%;
	width: 390px;
	max-width: 90vw;
	background-color: var(--naomi-bg);
	z-index: 310;
	display: flex;
	flex-direction: column;
	box-shadow: -16px 0 48px rgba(0, 0, 0, 0.14);
	transform: translateX(100%);
	transition: transform 0.28s cubic-bezier(0.4, 0, 0.2, 1);
}

.naomi-cart-drawer.is-open,
.naomi-wl-drawer.is-open {
	transform: translateX(0);
}

/* ---- Wishlist ---------------------------------------------------------- */

.naomi-wl-drawer__body {
	flex: 1 1 auto;
	overflow-y: auto;
	padding: 16px 20px;
}

.naomi-wl-empty,
.naomi-wl-loading {
	color: var(--naomi-muted);
	font-size: 14px;
	line-height: 1.6;
	text-align: center;
	padding: 24px 8px;
}

.naomi-wl-item {
	display: flex;
	gap: 12px;
	padding: 12px 0;
	border-bottom: var(--naomi-border-base) solid var(--naomi-border);
}

.naomi-wl-item__img {
	flex: none;
	width: 64px;
	height: 64px;
	border-radius: var(--naomi-radius-sm);
	overflow: hidden;
}

.naomi-wl-item__img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.naomi-wl-item__info {
	flex: 1 1 auto;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.naomi-wl-item__title {
	font-family: var(--naomi-font-head);
	font-weight: 600;
	font-size: 13.5px;
	color: var(--naomi-dark);
	line-height: 1.35;
}

.naomi-wl-item__price {
	font-size: 13px;
	color: var(--naomi-primary);
	font-weight: 600;
}

.naomi-wl-item__actions {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-top: 2px;
}

.naomi-wl-item__add {
	font-family: var(--naomi-font-head);
	font-weight: 600;
	font-size: 12.5px;
	color: #fff;
	background-color: var(--naomi-primary);
	padding: 6px 12px;
	border-radius: var(--naomi-radius-pill);
}

.naomi-wl-item__add:hover {
	background-color: #cc1525;
	text-decoration: none;
}

.naomi-wl-item__remove {
	margin-left: auto;
	border: none;
	background: transparent;
	color: var(--naomi-muted);
	font-size: 22px;
	line-height: 1;
	cursor: pointer;
	padding: 0 4px;
}

.naomi-wl-item__remove:hover {
	color: var(--naomi-primary);
}

/* Heart toggle on product cards */
.product.naomi-has-wl,
li.wp-block-post.naomi-has-wl {
	position: relative;
}

.naomi-wl-heart {
	position: absolute;
	top: 12px;
	right: 12px;
	z-index: 3;
	width: 36px;
	height: 36px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: none;
	border-radius: 50%;
	background-color: rgba(255, 255, 255, 0.92);
	box-shadow: var(--naomi-shadow-card);
	color: var(--naomi-muted);
	cursor: pointer;
	transition: transform 0.15s ease, color 0.15s ease;
}

.naomi-wl-heart svg {
	fill: none;
	stroke: currentColor;
	stroke-width: 1.7;
}

.naomi-wl-heart:hover {
	transform: scale(1.08);
	color: var(--naomi-primary);
}

.naomi-wl-heart.is-active {
	color: var(--naomi-primary);
}

.naomi-wl-heart.is-active svg {
	fill: var(--naomi-primary);
	stroke: var(--naomi-primary);
}

/* Single-product heart (inline button next to add-to-cart) */
.naomi-wl-heart--single {
	position: static;
	width: auto;
	height: auto;
	gap: 8px;
	padding: 11px 18px;
	border-radius: var(--naomi-radius-pill);
	background-color: var(--naomi-surface);
	box-shadow: none;
	font-family: var(--naomi-font-head);
	font-weight: 600;
	font-size: 14px;
	margin-top: 12px;
}

.naomi-cart-drawer__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 18px 20px;
	border-bottom: var(--naomi-border-base) solid var(--naomi-border);
}

.naomi-cart-drawer__title {
	font-family: var(--naomi-font-head);
	font-weight: 600;
	font-size: 18px;
	margin: 0;
}

.naomi-cart-drawer__close {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border: none;
	background: transparent;
	color: var(--naomi-dark);
	border-radius: 50%;
	cursor: pointer;
	transition: background-color 0.15s ease;
}

.naomi-cart-drawer__close:hover {
	background-color: var(--naomi-surface);
	color: var(--naomi-primary);
}

.naomi-cart-drawer__body {
	flex: 1 1 auto;
	overflow-y: auto;
	padding: 20px;
}

/* WooCommerce mini-cart inside the drawer */
.naomi-cart-drawer__body .woocommerce-mini-cart {
	margin: 0;
	padding: 0;
	list-style: none;
}

.naomi-cart-drawer__body .woocommerce-mini-cart-item {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	padding: 14px 0;
	border-bottom: var(--naomi-border-base) solid var(--naomi-border);
	position: relative;
}

.naomi-cart-drawer__body .woocommerce-mini-cart-item img {
	width: 60px;
	height: auto;
	border-radius: var(--naomi-radius-sm);
	order: -1;
	margin: 0;
}

.naomi-cart-drawer__body .woocommerce-mini-cart-item a:not(.remove) {
	font-family: var(--naomi-font-head);
	font-weight: 500;
	font-size: 14px;
	color: var(--naomi-dark);
	text-decoration: none;
}

.naomi-cart-drawer__body .woocommerce-mini-cart__total {
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-family: var(--naomi-font-head);
	font-size: 16px;
	margin: 16px 0;
	padding-top: 14px;
}

.naomi-cart-drawer__body .woocommerce-mini-cart__total .amount {
	color: var(--naomi-primary);
	font-weight: 700;
}

.naomi-cart-drawer__body .woocommerce-mini-cart__buttons {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin: 0;
}

.naomi-cart-drawer__body .woocommerce-mini-cart__buttons a {
	display: block;
	text-align: center;
	border-radius: var(--naomi-radius-pill);
	padding: 13px 20px;
	font-family: var(--naomi-font-head);
	font-weight: 500;
	font-size: 15px;
	text-decoration: none;
}

.naomi-cart-drawer__body .woocommerce-mini-cart__buttons a:first-child {
	background-color: var(--naomi-surface);
	color: var(--naomi-primary);
	border: var(--naomi-border-base) solid var(--naomi-red-lighter);
}

.naomi-cart-drawer__body .woocommerce-mini-cart__buttons a.checkout {
	background-color: var(--naomi-primary);
	color: #fff;
}

.naomi-cart-drawer__body p.woocommerce-mini-cart__empty-message {
	text-align: center;
	color: var(--naomi-muted);
	padding: 32px 0;
}

.naomi-cart-drawer__body .woocommerce-mini-cart-item a.remove {
	position: absolute;
	top: 14px;
	right: 0;
}

/* ---- Free-shipping progress bar -------------------------------------- */

.naomi-ship-bar {
	background-color: var(--naomi-surface);
	border: var(--naomi-border-base) solid var(--naomi-red-lighter);
	border-radius: var(--naomi-radius-card-sm);
	padding: 14px 16px;
}

.naomi-ship-bar--cart {
	margin-bottom: 20px;
}

.naomi-ship-bar--mini {
	margin: 0 0 14px;
}

.naomi-ship-bar.is-complete {
	border-color: #1F9D55;
	background-color: #EAF7EF;
}

.naomi-ship-bar__text {
	margin: 0 0 9px;
	font-family: var(--naomi-font-head);
	font-weight: 600;
	font-size: 13.5px;
	color: var(--naomi-dark);
}

.naomi-ship-bar__text .amount {
	color: var(--naomi-primary);
}

.naomi-ship-bar__track {
	display: block;
	height: 8px;
	border-radius: 99px;
	background-color: rgba(40, 12, 12, 0.08);
	overflow: hidden;
}

.naomi-ship-bar__fill {
	display: block;
	height: 100%;
	border-radius: 99px;
	background-color: var(--naomi-primary);
	transition: width 0.4s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.naomi-ship-bar.is-complete .naomi-ship-bar__fill {
	background-color: #1F9D55;
}

/* ---- Single product: reassurance / trust badges ---------------------- */

.naomi-prod-trust {
	list-style: none;
	margin: 20px 0 0;
	padding: 18px 0 0;
	border-top: var(--naomi-border-base) solid var(--naomi-border);
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px 18px;
}

.naomi-prod-trust li {
	display: flex;
	align-items: center;
	gap: 9px;
	font-size: 13.5px;
	font-weight: 500;
	color: var(--naomi-muted);
}

.naomi-prod-trust svg {
	color: var(--naomi-primary);
	flex: none;
}

/* ---- Single product: sticky summary + gallery polish (desktop) ------- */

@media (min-width: 768px) {
	.naomi-single-product .summary,
	.naomi-single-product div.summary {
		position: sticky;
		top: 96px;
		align-self: start;
	}
}

.woocommerce-product-gallery {
	position: relative;
}

.woocommerce-product-gallery .flex-viewport,
.woocommerce-product-gallery > a img,
.woocommerce-product-gallery__image img {
	border-radius: var(--naomi-radius-card);
	background-color: var(--naomi-neutral);
}

/* Gallery thumbnails row */
.woocommerce-product-gallery .flex-control-thumbs {
	display: flex;
	gap: 10px;
	margin: 12px 0 0;
	padding: 0;
	list-style: none;
}

.woocommerce-product-gallery .flex-control-thumbs li {
	width: 72px;
	margin: 0;
}

.woocommerce-product-gallery .flex-control-thumbs img {
	border-radius: 10px;
	border: var(--naomi-border-base) solid var(--naomi-border);
	cursor: pointer;
	opacity: 0.7;
	transition: opacity 0.15s ease, border-color 0.15s ease;
}

.woocommerce-product-gallery .flex-control-thumbs img:hover,
.woocommerce-product-gallery .flex-control-thumbs img.flex-active {
	opacity: 1;
	border-color: var(--naomi-primary);
}

/* Zoom hint icon */
.woocommerce-product-gallery__trigger {
	z-index: 4;
}

/* ---- Variation swatches ---------------------------------------------- */

/* Tidy the WooCommerce variations table into stacked groups. */
.woocommerce div.product form.cart .variations {
	width: 100%;
	border: none;
	margin: 0 0 18px;
}

.woocommerce div.product form.cart .variations tbody,
.woocommerce div.product form.cart .variations tr,
.woocommerce div.product form.cart .variations th,
.woocommerce div.product form.cart .variations td {
	display: block;
	width: auto;
	padding: 0;
	border: none;
	text-align: left;
	background: none;
}

.woocommerce div.product form.cart .variations th.label {
	font-family: var(--naomi-font-head);
	font-weight: 600;
	font-size: 13px;
	color: var(--naomi-dark);
	margin: 12px 0 8px;
}

.naomi-select-hidden {
	position: absolute !important;
	width: 1px;
	height: 1px;
	opacity: 0;
	pointer-events: none;
	overflow: hidden;
}

.naomi-swatches {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.naomi-swatch {
	min-width: 44px;
	padding: 9px 14px;
	border: 1.5px solid var(--naomi-border);
	border-radius: 10px;
	background-color: var(--naomi-bg);
	color: var(--naomi-dark);
	font-family: var(--naomi-font-head);
	font-weight: 600;
	font-size: 14px;
	cursor: pointer;
	transition: border-color 0.12s ease, background-color 0.12s ease, color 0.12s ease, box-shadow 0.12s ease;
}

.naomi-swatch:hover {
	border-color: var(--naomi-red-lighter);
}

.naomi-swatch.is-active {
	border-color: var(--naomi-primary);
	background-color: var(--naomi-surface);
	color: var(--naomi-primary);
}

.naomi-swatch--dot {
	width: 38px;
	height: 38px;
	min-width: 0;
	padding: 0;
	border-radius: 50%;
	position: relative;
	font-size: 0;
}

.naomi-swatch--dot::after {
	content: "";
	position: absolute;
	inset: 4px;
	border-radius: 50%;
	background-color: var(--sw, #ccc);
	border: 1px solid rgba(0, 0, 0, 0.12);
}

.naomi-swatch--dot.is-active {
	border-color: #fff;
	box-shadow: 0 0 0 2px var(--naomi-primary);
}

/* ---- Category hero --------------------------------------------------- */

.naomi-cat-hero {
	background-color: var(--naomi-surface);
	margin-bottom: 8px;
}

.naomi-cat-hero__in {
	max-width: 1180px;
	margin: 0 auto;
	padding: clamp(28px, 4vw, 52px) 24px;
}

.naomi-cat-hero__title {
	font-size: clamp(28px, 4vw, 44px);
	font-weight: 800;
	letter-spacing: -0.02em;
	margin: 0;
}

.naomi-cat-hero__count {
	font-family: var(--naomi-font-head);
	font-weight: 600;
	font-size: 14px;
	color: var(--naomi-muted);
	margin: 8px 0 0;
}

.naomi-cat-hero__desc {
	color: var(--naomi-muted);
	margin-top: 10px;
	max-width: 60ch;
}

.naomi-cat-hero.has-image {
	background-image: linear-gradient(rgba(20, 8, 8, 0.5), rgba(20, 8, 8, 0.42)), var(--cat-img);
	background-size: cover;
	background-position: center;
}

.naomi-cat-hero.has-image .naomi-cat-hero__title {
	color: #fff;
}

.naomi-cat-hero.has-image .naomi-cat-hero__count,
.naomi-cat-hero.has-image .naomi-cat-hero__desc {
	color: rgba(255, 255, 255, 0.88);
}

/* Category pages use the hero above instead of the plain shop head. */
.tax-product_cat .naomi-shop .naomi-shop__head {
	display: none;
}

/* ---- Active filter chips --------------------------------------------- */

.naomi-active-filters {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin-bottom: 18px;
}

.naomi-active-filters__label {
	font-family: var(--naomi-font-head);
	font-weight: 600;
	font-size: 13px;
	color: var(--naomi-muted);
}

.naomi-chip {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 6px 12px;
	border-radius: var(--naomi-radius-pill);
	background-color: var(--naomi-surface);
	border: 1px solid var(--naomi-red-lighter);
	color: var(--naomi-primary);
	font-family: var(--naomi-font-head);
	font-weight: 600;
	font-size: 13px;
	text-decoration: none;
	transition: background-color 0.12s ease;
}

.naomi-chip:hover {
	background-color: var(--naomi-red-light);
	text-decoration: none;
}

.naomi-chip span {
	font-size: 15px;
	line-height: 1;
}

.naomi-active-filters__clear {
	font-size: 13px;
	color: var(--naomi-muted);
	text-decoration: underline;
	margin-left: 4px;
}

/* ---- Mobile sticky add-to-cart bar ----------------------------------- */

.naomi-sticky-atc {
	position: fixed;
	left: 0;
	right: 0;
	bottom: var(--naomi-bottom-nav-h, 64px);
	z-index: 250;
	display: none;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 10px 14px;
	background-color: var(--naomi-bg);
	border-top: var(--naomi-border-base) solid var(--naomi-border);
	box-shadow: 0 -8px 24px -12px rgba(40, 12, 12, 0.18);
	transform: translateY(140%);
	transition: transform 0.28s cubic-bezier(0.4, 0, 0.2, 1);
}

.naomi-sticky-atc.is-shown {
	transform: translateY(0);
}

.naomi-sticky-atc__info {
	display: flex;
	align-items: center;
	gap: 10px;
	min-width: 0;
}

.naomi-sticky-atc__info img {
	width: 44px;
	height: 44px;
	border-radius: 8px;
	object-fit: cover;
	flex: none;
}

.naomi-sticky-atc__meta {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.naomi-sticky-atc__name {
	font-family: var(--naomi-font-head);
	font-weight: 600;
	font-size: 13px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 42vw;
}

.naomi-sticky-atc__price {
	font-family: var(--naomi-font-head);
	font-weight: 700;
	font-size: 15px;
	color: var(--naomi-primary);
}

.naomi-sticky-atc__price del {
	color: var(--naomi-muted);
	font-weight: 500;
	font-size: 12px;
	margin-left: 4px;
}

.naomi-sticky-atc__btn {
	flex: 0 0 auto;
	background-color: var(--naomi-primary);
	color: #fff;
	border: none;
	border-radius: var(--naomi-radius-pill);
	padding: 12px 22px;
	font-family: var(--naomi-font-head);
	font-weight: 600;
	font-size: 14px;
	cursor: pointer;
	text-decoration: none;
	white-space: nowrap;
}

@media (max-width: 767.98px) {
	.naomi-sticky-atc {
		display: flex;
	}
}

/* ---- Login / Register (My Account, logged out) ----------------------- */

.woocommerce-account:not(.logged-in) .naomi-account__heading {
	text-align: center;
}

.woocommerce-account #customer_login.u-columns {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: 24px;
	align-items: start;
	max-width: 900px;
	margin: 8px auto 0;
}

.woocommerce-account #customer_login .u-column1,
.woocommerce-account #customer_login .u-column2 {
	width: auto;
	float: none;
	margin: 0;
	background-color: var(--naomi-bg);
	border: var(--naomi-border-base) solid var(--naomi-border);
	border-radius: var(--naomi-radius-card);
	padding: clamp(22px, 3vw, 34px);
	box-shadow: var(--naomi-shadow-card);
}

.woocommerce-account #customer_login h2 {
	font-family: var(--naomi-font-head);
	font-weight: 700;
	font-size: 22px;
	margin: 0 0 4px;
}

/* small lead under each heading */
.woocommerce-account #customer_login .u-column1 > p:first-of-type,
.woocommerce-account #customer_login .u-column2 > p:first-of-type {
	color: var(--naomi-muted);
	font-size: 14px;
	margin: 0 0 16px;
}

.woocommerce-account #customer_login .woocommerce-form-row label {
	font-family: var(--naomi-font-head);
	font-weight: 600;
	font-size: 13px;
	color: var(--naomi-dark);
	margin-bottom: 6px;
	display: block;
}

.woocommerce-account #customer_login .woocommerce-form-row input.input-text {
	width: 100%;
	box-sizing: border-box;
	border: var(--naomi-border-base) solid var(--naomi-border);
	border-radius: var(--naomi-radius-sm);
	padding: 12px 14px;
	min-height: 48px;
	font-size: 14px;
	background-color: var(--naomi-bg);
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.woocommerce-account #customer_login .woocommerce-form-row input.input-text:focus {
	outline: none;
	border-color: var(--naomi-primary);
	box-shadow: 0 0 0 3px rgba(232, 25, 44, 0.12);
}

.woocommerce-account #customer_login button:not(.show-password-input):not(.hide-password-input) {
	width: 100%;
	background-color: var(--naomi-primary);
	color: #fff;
	border: none;
	border-radius: var(--naomi-radius-pill);
	padding: 14px 20px;
	margin-top: 6px;
	font-family: var(--naomi-font-head);
	font-weight: 600;
	font-size: 15px;
	cursor: pointer;
	transition: background-color 0.15s ease;
}

.woocommerce-account #customer_login button:not(.show-password-input):not(.hide-password-input):hover {
	background-color: #cc1525;
}

.woocommerce-account #customer_login .woocommerce-form-login__rememberme {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 13px;
	color: var(--naomi-muted);
	margin: 10px 0;
}

.woocommerce-account #customer_login .woocommerce-form-login__rememberme input {
	width: auto;
	min-height: 0;
}

.woocommerce-account #customer_login .lost_password {
	margin: 6px 0 0;
	font-size: 13px;
}

.woocommerce-account #customer_login .lost_password a {
	color: var(--naomi-primary);
}

.woocommerce-account #customer_login .woocommerce-privacy-policy-text {
	font-size: 12px;
	color: var(--naomi-muted);
	margin-top: 12px;
}

/* Single-form fallback (registration disabled): keep the login card tidy */
.woocommerce-account #customer_login:not(.col2-set) {
	max-width: 460px;
}

@media (max-width: 600px) {
	.woocommerce-account #customer_login.u-columns {
		grid-template-columns: 1fr;
	}
}

/* ---- Pet fields inside the registration form ------------------------- */

.woocommerce-account #customer_login .naomi-reg-pet {
	margin: 4px 0 14px;
	padding: 16px 18px;
	background-color: var(--naomi-surface);
	border-radius: var(--naomi-radius-sm);
}

.naomi-reg-pet__title {
	font-family: var(--naomi-font-head);
	font-weight: 700;
	font-size: 14px;
	margin: 0 0 2px;
}

.naomi-reg-pet__title span {
	color: var(--naomi-muted);
	font-weight: 500;
	font-size: 12px;
}

.naomi-reg-pet__intro {
	color: var(--naomi-muted);
	font-size: 12.5px;
	line-height: 1.5;
	margin: 0 0 12px;
}

.naomi-reg-pet__label {
	display: block;
	font-family: var(--naomi-font-head);
	font-weight: 600;
	font-size: 13px;
	margin-bottom: 6px;
}

.naomi-reg-pet__types {
	display: flex;
	gap: 16px;
}

.naomi-reg-pet__types label {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 14px;
	cursor: pointer;
}

.naomi-reg-pet__types input {
	width: auto;
	min-height: 0;
}

/* ---- Password show/hide toggle (WC adds this button via JS) ----------- */

.woocommerce .password-input,
.woocommerce-page .password-input {
	position: relative;
	display: block;
}

.woocommerce .password-input .input-text {
	width: 100%;
	padding-right: 44px;
}

.woocommerce .show-password-input,
.woocommerce .hide-password-input {
	position: absolute;
	top: 50%;
	right: 12px;
	transform: translateY(-50%);
	width: 24px;
	height: 24px;
	min-height: 0;
	margin: 0;
	padding: 0;
	border: none;
	background: transparent;
	box-shadow: none;
	cursor: pointer;
}

.woocommerce .show-password-input::after,
.woocommerce .hide-password-input::after {
	content: "";
	display: block;
	width: 22px;
	height: 22px;
	background-color: var(--naomi-muted);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12s3.5-7 10-7 10 7 10 7-3.5 7-10 7-10-7-10-7z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E") center / 20px no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12s3.5-7 10-7 10 7 10 7-3.5 7-10 7-10-7-10-7z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E") center / 20px no-repeat;
}

.woocommerce .hide-password-input::after {
	background-color: var(--naomi-primary);
}
