/* ==========================================================================
   Happy Tea & Coffee — WooCommerce Styles
   ========================================================================== */

/* ---------- Shop Archive ---------- */
.woocommerce-main {
	padding: var(--space-2xl) 0;
}

/* ---------- Category Hero Banner — full-width image with title overlay ---------- */
.category-hero {
	position: relative;
	width: 100%;
	min-height: 300px;
	overflow: hidden;
}

.category-hero__image {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
}

/* Placeholder image shown until a real category thumbnail is uploaded
   via WP Admin → Products → Categories → Edit → Thumbnail */
.category-hero__image--placeholder {
	background-image: url('https://www.palaisdesthes.com/media/catalog/category/cereale-parfum_-24-desktop.webp');
}

.category-hero__content {
	position: relative;
	margin-left: 55%;
	width: 45%;
	min-height: 300px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: var(--space-xl) var(--space-2xl);
	text-align: center;
	background: rgb(45, 74, 14);
}

.category-hero__title {
	font-family: var(--font-display);
	font-size: var(--font-size-2xl);
	font-weight: 700;
	color: var(--color-white);
	text-transform: uppercase;
	letter-spacing: 0.06em;
	margin-bottom: var(--space-sm);
	text-shadow: 0 2px 8px rgba(0,0,0,0.45);
}

.category-hero__desc {
	color: rgba(255,255,255,0.95);
	font-size: var(--font-size-sm);
	line-height: 1.6;
	max-width: 340px;
	text-shadow: 0 1px 4px rgba(0,0,0,0.4);
}

@media (max-width: 768px) {
	.category-hero {
		min-height: 200px;
	}
	.category-hero__content {
		margin-left: 0;
		width: 100%;
		min-height: 200px;
		background: rgba(0,0,0,0.35);
		padding: var(--space-lg) var(--space-md);
	}
}

/* ---------- Category Quick-Nav Buttons ---------- */
.category-nav {
	padding: var(--space-xl) 0 var(--space-md);
	/* Offset for sticky header when scrollIntoView() targets this element (AJAX filter) */
	scroll-margin-top: 90px;
}

@media (min-width: 992px) {
	.category-nav {
		/* Desktop sticky header is taller */
		scroll-margin-top: 110px;
	}
}

.category-nav__list {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--space-sm);
	list-style: none;
	margin: 0;
	padding: 0;
}

.category-nav__link {
	display: inline-block;
	padding: 0.5rem 1.4rem;
	background: var(--color-white);
	color: var(--color-dark);
	border: 1.5px solid var(--color-border);
	border-radius: 999px;
	font-size: 0.8rem;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	text-decoration: none;
	white-space: nowrap;
	transition: background var(--transition-fast), color var(--transition-fast), border-color var(--transition-fast);
}

.category-nav__link:hover {
	background: var(--color-accent);
	color: #fff;
	border-color: var(--color-accent);
}

.category-nav__link--active {
	background: var(--color-dark);
	color: #fff;
	border-color: var(--color-dark);
}

@media (max-width: 600px) {
	.category-nav__list {
		gap: 6px;
	}
	.category-nav__link {
		padding: 0.4rem 1rem;
		font-size: 0.7rem;
	}
}

/* AJAX loading state for archive product grid */
.woocommerce-main.is-loading ul.products {
	opacity: 0.45;
	pointer-events: none;
	transition: opacity 0.15s ease;
}
.woocommerce-main.is-loading .category-nav__link {
	pointer-events: none;
}

/* ---------- Archive page background ---------- */
.tax-product_cat .woocommerce-main,
.post-type-archive-product .woocommerce-main {
	background: #f4f1ec;
	padding-top: var(--space-xl);
	padding-bottom: var(--space-2xl);
}

.tax-product_cat .woocommerce-main .container,
.post-type-archive-product .woocommerce-main .container {
	background: transparent;
}

/* Shop header (shown when no hero image) */
.shop-header {
	margin-bottom: var(--space-xl);
}

.shop-header__title {
	font-family: var(--font-display);
	font-size: var(--font-size-2xl);
	font-weight: 400;
	margin-bottom: var(--space-sm);
	letter-spacing: 0.01em;
}

.shop-header__description {
	color: var(--color-body);
	max-width: 700px;
}

/* ---------- Shop meta bar: breadcrumbs + count ---------- */
.shop-meta-bar {
	display: none;
}

.shop-meta-bar .container {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--space-md);
	padding-top: var(--space-md);
	padding-bottom: var(--space-md);
}

/* Breadcrumbs inside meta bar: strip single-product overrides */
.shop-meta-bar .breadcrumbs {
	border-bottom: none;
	margin-bottom: 0;
	font-size: var(--font-size-sm);
	color: var(--color-muted);
}

.shop-meta-bar__count {
	font-size: var(--font-size-sm);
	color: var(--color-muted);
	font-weight: 600;
	white-space: nowrap;
}

/* ---------- Shop actions bar: FILTRER + TRIER ---------- */
.shop-actions-bar {
	display: flex;
	justify-content: flex-end;
	gap: var(--space-md);
	padding: var(--space-md) 0 var(--space-lg);
}

.shop-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-width: 170px;
	padding: 0.75rem 1.75rem;
	background-color: var(--color-accent);
	color: #fff;
	border: none;
	border-radius: var(--radius-sm);
	font-size: 0.8rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	cursor: pointer;
	transition: background-color 0.2s ease;
}

.shop-btn:hover,
.shop-btn[aria-expanded="true"] {
	background-color: var(--color-accent-dark);
}

/* Sort panel */
.shop-sort-panel {
	display: flex;
	justify-content: center;
	padding-bottom: var(--space-md);
}

.shop-sort-panel[hidden] {
	display: none;
}

.shop-sort-panel .woocommerce-ordering {
	margin: 0;
}

.shop-sort-panel .woocommerce-ordering select {
	padding: var(--space-sm) var(--space-md);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-sm);
	font-size: var(--font-size-sm);
	background: var(--color-white);
	min-width: 220px;
}

/* ---------- Filter Drawer (slides from LEFT) ---------- */
.filter-drawer {
	position: fixed;
	inset: 0;
	z-index: 9100;
	pointer-events: none;
}
.filter-drawer.is-open {
	pointer-events: auto;
}
body.filter-drawer-open,
body.sort-drawer-open,
body.drawer-open {
	overflow: hidden;
}
.filter-drawer__overlay {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.45);
	opacity: 0;
	transition: opacity 0.3s ease;
	cursor: pointer;
}
.filter-drawer.is-open .filter-drawer__overlay {
	opacity: 1;
}
.filter-drawer__panel {
	position: absolute;
	top: 0;
	left: 0;
	width: min(380px, 92vw);
	height: 100%;
	background: #fff;
	display: flex;
	flex-direction: column;
	transform: translateX(-100%);
	transition: transform 0.3s ease;
}
.filter-drawer.is-open .filter-drawer__panel {
	transform: translateX(0);
}

/* ---------- Sort Drawer (slides from RIGHT) ---------- */
.sort-drawer {
	position: fixed;
	inset: 0;
	z-index: 9100;
	pointer-events: none;
}
.sort-drawer.is-open {
	pointer-events: auto;
}
.sort-drawer__overlay {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.45);
	opacity: 0;
	transition: opacity 0.3s ease;
	cursor: pointer;
}
.sort-drawer.is-open .sort-drawer__overlay {
	opacity: 1;
}
.sort-drawer__panel {
	position: absolute;
	top: 0;
	right: 0;
	width: min(320px, 92vw);
	height: 100%;
	background: #fff;
	display: flex;
	flex-direction: column;
	transform: translateX(100%);
	transition: transform 0.3s ease;
}
.sort-drawer.is-open .sort-drawer__panel {
	transform: translateX(0);
}
.sort-drawer__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: var(--space-lg) var(--space-xl);
	border-bottom: 1px solid var(--color-border);
}
.sort-drawer__title {
	font-size: 0.8rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	color: var(--color-dark);
}
.sort-drawer__close {
	background: none;
	border: none;
	font-size: 1.6rem;
	line-height: 1;
	cursor: pointer;
	color: var(--color-muted);
	padding: 0 0 0 var(--space-md);
}
.sort-drawer__close:hover { color: var(--color-dark); }
.sort-drawer__body { flex: 1; overflow-y: auto; }
.sort-option {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: var(--space-md) var(--space-xl);
	font-size: var(--font-size-sm);
	color: var(--color-dark);
	cursor: pointer;
	border-bottom: 1px solid var(--color-border);
	text-decoration: none;
	transition: background var(--transition-fast);
}
.sort-option:hover { background: var(--color-bg); }
.sort-option--active {
	font-weight: 700;
	color: var(--color-accent);
}
.sort-option--active::after {
	content: '✓';
	font-size: 0.85rem;
}
.filter-drawer__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: var(--space-lg) var(--space-xl);
	border-bottom: 1px solid var(--color-border);
}
.filter-drawer__title {
	font-size: 0.8rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	color: var(--color-dark);
}
.filter-drawer__close {
	background: none;
	border: none;
	font-size: 1.6rem;
	line-height: 1;
	cursor: pointer;
	color: var(--color-muted);
	padding: 0 0 0 var(--space-md);
	transition: color var(--transition-fast);
}
.filter-drawer__close:hover {
	color: var(--color-dark);
}
.filter-drawer__body {
	flex: 1;
	overflow-y: auto;
	padding: 0;
}
/* Filter section */
.filter-section {
	border-bottom: 1px solid var(--color-border);
}
.filter-section__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	padding: var(--space-lg) var(--space-xl);
	background: none;
	border: none;
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--color-dark);
	cursor: pointer;
	text-align: left;
}
.filter-section__chevron {
	flex-shrink: 0;
	transition: transform 0.2s ease;
}
.filter-section.is-open .filter-section__chevron {
	transform: rotate(180deg);
}
.filter-section__body {
	display: none;
	padding: 0 var(--space-xl) var(--space-lg);
}
.filter-section.is-open .filter-section__body {
	display: block;
}
.filter-option {
	display: flex;
	align-items: center;
	gap: var(--space-sm);
	padding: 6px 0;
	cursor: pointer;
	font-size: var(--font-size-sm);
	color: var(--color-dark);
}
.filter-option input[type="checkbox"] {
	width: 16px;
	height: 16px;
	border: 1.5px solid var(--color-border);
	border-radius: 3px;
	accent-color: var(--color-accent);
	cursor: pointer;
	flex-shrink: 0;
}
/* Footer */
.filter-drawer__foot {
	padding: var(--space-lg) var(--space-xl);
	border-top: 1px solid var(--color-border);
	display: flex;
	flex-direction: column;
	gap: var(--space-sm);
}
.filter-drawer__apply {
	width: 100%;
	padding: var(--space-md) var(--space-lg);
	background: var(--color-accent);
	color: #fff;
	border: none;
	border-radius: var(--radius-sm);
	font-size: 0.8rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	cursor: pointer;
	transition: background var(--transition-fast);
}
.filter-drawer__apply:hover {
	background: var(--color-accent-dark, #c45e3a);
}
.filter-drawer__clear {
	text-align: center;
	font-size: var(--font-size-sm);
	color: var(--color-muted);
	text-decoration: underline;
	text-underline-offset: 2px;
}
.filter-drawer__clear:hover {
	color: var(--color-dark);
}

/* ---------- Product Grid ---------- */
ul.products {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: var(--space-md);
	list-style: none;
	padding: 0;
	margin: 0;
}

@media (max-width: 1200px) {
	ul.products {
		grid-template-columns: repeat(3, 1fr);
	}
}

@media (max-width: 768px) {
	ul.products {
		grid-template-columns: repeat(2, 1fr);
		gap: var(--space-sm);
	}
}

/* ---------- Product Card ---------- */
.product-card {
	position: relative;
	background: var(--color-white);
	border-radius: var(--radius-lg);
	overflow: visible;
	box-shadow: 0 1px 4px rgba(0,0,0,0.08);
	transition: box-shadow var(--transition-base), transform var(--transition-base);
	display: flex;
	flex-direction: column;
	height: 100%;
}

.product-card > .product-card__image {
	border-radius: var(--radius-lg) var(--radius-lg) 0 0;
	overflow: hidden;
}

.product-card:hover {
	box-shadow: 0 6px 20px rgba(0,0,0,0.12);
	transform: translateY(-2px);
}

/* Best-Seller row — flow element above image, always reserves height */
.product-card__bestseller-row {
	min-height: 1.6rem;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0.2rem 0 0;
}

.product-card__bestseller {
	font-size: 0.65rem;
	font-weight: var(--font-weight-bold);
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: #8a6930;
}

/* Sans-théine badge — top-right inside the image, circular outlined */
.product-card__theine-badge {
	position: absolute;
	top: var(--space-sm);
	right: var(--space-sm);
	z-index: 3;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	border: 1.5px solid rgba(90,122,30,0.6);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 0.55rem;
	font-weight: var(--font-weight-bold);
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: #5a7a1e;
	text-align: center;
	line-height: 1.2;
	background: rgba(255,255,255,0.85);
	padding: 4px;
}

.product-card__image {
	position: relative;
	overflow: hidden;
	aspect-ratio: 1;
	background: #fff;
	padding: 6%;
}

.product-card__image img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	transition: transform var(--transition-slow);
}

.product-card:hover .product-card__image img {
	transform: scale(1.05);
}

.product-card__badges {
	position: absolute;
	top: var(--space-sm);
	left: var(--space-sm);
	display: flex;
	flex-direction: column;
	gap: var(--space-xs);
	z-index: 2;
}

.product-card__body {
	padding: var(--space-md);
	display: flex;
	flex-direction: column;
	flex: 1;
	text-align: center;
}

.product-card__title {
	font-family: var(--font-display);
	font-size: var(--font-size-md);
	font-weight: 700;
	color: var(--color-dark);
	margin-bottom: var(--space-xs);
	line-height: 1.3;
}

.product-card__title a {
	color: var(--color-dark);
}

.product-card__title a:hover {
	color: var(--color-accent);
}

.product-card__price {
	margin-bottom: var(--space-md);
}

.product-card__price .price {
	font-family: var(--font-display);
	font-size: var(--font-size-base);
	font-weight: 400;
	letter-spacing: 0;
	color: var(--color-dark);
}

.product-card__price .price del {
	font-size: var(--font-size-sm);
}

.product-card__actions {
	display: flex;
	gap: var(--space-sm);
	margin-top: auto;
}

.product-card .add_to_cart_button,
.product-card .product_type_variable,
.product-card .product_type_grouped {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	padding: 0.625rem 1rem;
	background-color: var(--color-accent);
	color: var(--color-white);
	border: none;
	border-radius: var(--radius-sm);
	font-size: var(--font-size-xs);
	font-weight: var(--font-weight-bold);
	text-transform: uppercase;
	letter-spacing: 0.05em;
	cursor: pointer;
	transition: background-color var(--transition-fast);
	text-align: center;
}

.product-card .add_to_cart_button:hover,
.product-card .product_type_variable:hover {
	background-color: var(--color-accent-dark);
	color: var(--color-white);
}

.product-card .add_to_cart_button.loading {
	opacity: 0.6;
	pointer-events: none;
}

.product-card .add_to_cart_button.added::after {
	content: ' ✓';
}

/* Star rating */
.star-rating {
	display: inline-flex;
	gap: 2px;
	font-size: var(--font-size-sm);
	color: var(--color-gold);
	margin-bottom: var(--space-sm);
}

/* ---------- Shop Sidebar ---------- */
.shop-sidebar {
	padding-right: var(--space-lg);
	border-right: 1px solid var(--color-border);
}

@media (max-width: 1024px) {
	.shop-sidebar {
		display: none;
		border-right: none;
		padding-right: 0;
		border-bottom: 1px solid var(--color-border);
		padding-bottom: var(--space-lg);
		margin-bottom: var(--space-lg);
	}

	.shop-sidebar.is-visible {
		display: block;
	}
}

.shop-sidebar .widget {
	margin-bottom: var(--space-xl);
}

.shop-sidebar .widget-title {
	font-size: var(--font-size-sm);
	font-weight: var(--font-weight-bold);
	text-transform: uppercase;
	letter-spacing: 0.05em;
	color: var(--color-dark);
	margin-bottom: var(--space-md);
	padding-bottom: var(--space-sm);
	border-bottom: 1px solid var(--color-border);
}

.shop-sidebar .widget ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

.shop-sidebar .widget ul li {
	display: grid;
	grid-template-columns: 1fr auto;
	grid-template-rows: auto;
	align-items: baseline;
	padding: var(--space-xs) 0;
	border-bottom: 1px solid rgba(0,0,0,0.04);
	list-style: none;
}

.shop-sidebar .widget ul li > a {
	grid-column: 1;
	grid-row: 1;
	font-size: var(--font-size-sm);
	color: var(--color-body);
	padding: 0;
}

.shop-sidebar .widget ul li > a:hover {
	color: var(--color-accent);
}

.shop-sidebar .widget ul li > .count {
	grid-column: 2;
	grid-row: 1;
	font-size: 0.75rem;
	color: var(--color-muted);
}

/* Nested subcategory list spans full width below parent row */
.shop-sidebar .widget ul li > ul {
	grid-column: 1 / -1;
	grid-row: 2;
	padding-left: var(--space-sm);
	margin-top: 0;
	border-top: none;
}

/* Nested items don't need a border */
.shop-sidebar .widget ul ul li {
	border-bottom: none;
	padding: 2px 0;
}

/* Hide uncategorized from sidebar */
.shop-sidebar .widget ul li:has(> a[href*="uncategorized"]) {
	display: none;
}

/* Reset WooCommerce mark (product count highlight) */
mark,
.widget_product_categories mark,
.woocommerce-loop-category__title mark {
	background: none;
	color: var(--color-muted);
	font-size: 0.875em;
	font-weight: var(--font-weight-regular);
}

/* ---------- Single Product ---------- */
.single-product-layout {
	display: grid;
	grid-template-columns: 55fr 45fr;
	gap: var(--space-3xl, 4rem);
	margin-bottom: var(--space-2xl);
	align-items: start;
}

@media (max-width: 900px) {
	.single-product-layout {
		grid-template-columns: 1fr;
		gap: var(--space-xl);
	}
}

/* ── Product gallery ─────────────────────────────────────────────────────── */
.product-gallery {
	position: sticky;
	top: 100px; /* below sticky header */
}

/* WC default flexslider gallery wrapper */
.product-gallery .woocommerce-product-gallery {
	margin: 0;
}

/* Main image */
.product-gallery .woocommerce-product-gallery__wrapper,
.product-gallery .woocommerce-product-gallery__image {
	background: var(--color-light-bg);
	border-radius: var(--radius-md);
	overflow: hidden;
}

.product-gallery .woocommerce-product-gallery__image img {
	width: 100%;
	height: auto;
	display: block;
	object-fit: contain;
	aspect-ratio: 1 / 1;
}

/* Remove WC zoom icon */
.product-gallery .woocommerce-product-gallery__trigger {
	display: none;
}

/* Thumbnail strip */
.product-gallery .flex-control-nav.flex-control-thumbs {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: var(--space-sm);
	margin: var(--space-md) 0 0;
	list-style: none;
	padding: 0;
}

.product-gallery .flex-control-thumbs li {
	border: 2px solid transparent;
	border-radius: var(--radius-sm);
	overflow: hidden;
	cursor: pointer;
	transition: border-color var(--transition-fast);
}

.product-gallery .flex-control-thumbs li:hover,
.product-gallery .flex-control-thumbs li .flex-active {
	border-color: var(--color-accent);
}

.product-gallery .flex-control-thumbs li img {
	width: 100%;
	height: auto;
	display: block;
}

/* Fallback custom thumb classes */
.product-gallery__thumbs {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: var(--space-sm);
	margin-top: var(--space-md);
}

.product-gallery__thumb {
	border: 2px solid transparent;
	border-radius: var(--radius-sm);
	overflow: hidden;
	cursor: pointer;
	transition: border-color var(--transition-fast);
}

.product-gallery__thumb:hover,
.product-gallery__thumb.is-active {
	border-color: var(--color-accent);
}

.product-gallery__thumb img {
	width: 100%;
	height: auto;
	display: block;
}

/* ── Product summary ─────────────────────────────────────────────────────── */
.product-summary {
	display: flex;
	flex-direction: column;
	position: relative;
}

/* Title */
.product-summary .product_title,
.product-summary h1.product_title {
	font-family: var(--font-display);
	font-size: clamp(1.6rem, 3vw, 2.2rem);
	font-weight: 400;
	line-height: 1.2;
	margin: 0 0 var(--space-xs);
	color: var(--color-dark);
	padding-right: 110px; /* space for floating rating */
}

/* Subtitle — ACF sous_titres */
.product-summary__subtitle {
	font-size: var(--font-size-base);
	font-style: italic;
	color: var(--color-muted);
	margin: 0 0 var(--space-md);
	line-height: 1.4;
}

/* Star rating — positioned top-right next to title */
.product-summary .woocommerce-product-rating {
	position: absolute;
	top: 0;
	right: 0;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 3px;
	margin-bottom: 0;
}

.product-summary .star-rating {
	font-size: 1rem;
	color: var(--color-primary);
}

.product-summary .woocommerce-review-link {
	font-size: var(--font-size-sm);
	color: var(--color-muted);
	text-align: right;
}

/* Packaging swatch label (from WCVA) */
.variations_form .variations {
	border: none;
	width: 100%;
}

.variations_form .variations td,
.variations_form .variations th {
	padding: 0;
	border: none;
}

.variations_form .variations .label {
	display: none; /* label shown by swatch context */
}

/* Hide WC native select — WCVA replaces it visually */
.variations_form .variations select {
	display: none !important;
}

/* Swatch row heading */
.product-summary .wcva-wrap > span,
.product-summary .wc-pao-addon-field label,
.product-swatch-heading {
	display: block;
	font-size: var(--font-size-sm);
	font-weight: var(--font-weight-bold);
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--color-dark);
	margin-bottom: var(--space-sm);
}

/* Price — large & prominent */
.product-summary .price,
.product-summary .woocommerce-Price-amount {
	font-family: var(--font-display);
	font-size: clamp(1.2rem, 2.2vw, 1.5rem);
	font-weight: 400;
	color: var(--color-dark);
}

.product-summary .price del {
	font-size: 1.1rem;
	color: var(--color-muted);
	font-weight: 400;
}

.product-summary .price ins {
	text-decoration: none;
	color: var(--color-accent);
}

.product-summary .woocommerce-variation-price {
	margin: var(--space-sm) 0 var(--space-md);
}

/* Qty stepper sizing on single product */
.product-summary .qty-stepper {
	height: 48px;
}

.product-summary .qty-stepper__input {
	width: 56px;
	font-size: var(--font-size-base);
}

/* Qty row + ATC stacked layout */
.product-summary .cart {
	display: flex;
	flex-direction: column;
	gap: var(--space-sm);
	margin-bottom: 0;
}

.product-summary .cart .qty-stepper {
	align-self: flex-start;
}

/* Full-width ATC button */
.single_add_to_cart_button {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--space-sm);
	padding: 1rem 2rem;
	background-color: var(--color-accent);
	color: var(--color-white);
	border: none;
	border-radius: var(--radius-sm);
	font-size: 0.9rem;
	font-weight: var(--font-weight-bold);
	text-transform: uppercase;
	letter-spacing: 0.08em;
	cursor: pointer;
	transition: background-color var(--transition-fast);
}

.single_add_to_cart_button:hover {
	background-color: var(--color-accent-dark);
}

/* Shipping notice */
.product-summary__shipping {
	display: flex;
	align-items: center;
	gap: var(--space-sm);
	font-size: var(--font-size-sm);
	color: #2e7d32;
	margin-top: var(--space-sm);
	margin-bottom: var(--space-lg);
}

.product-summary__shipping svg {
	width: 18px;
	height: 18px;
	flex-shrink: 0;
	stroke: currentColor;
}

/* Tea info bar */
.product-tea-info {
	display: flex;
	gap: 0;
	border-top: 1px solid var(--color-border);
	border-bottom: 1px solid var(--color-border);
	margin-bottom: var(--space-lg);
}

.product-tea-info__item {
	flex: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 4px;
	padding: var(--space-md) var(--space-sm);
	text-align: center;
	border-right: 1px solid var(--color-border);
}

.product-tea-info__item:last-child {
	border-right: none;
}

.product-tea-info__icon {
	display: block;
	color: var(--color-accent);
}

.product-tea-info__icon svg {
	width: 22px;
	height: 22px;
	display: block;
}

.product-tea-info__label {
	display: block;
	font-size: 0.65rem;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--color-muted);
}

.product-tea-info__value {
	display: block;
	font-size: var(--font-size-sm);
	font-weight: var(--font-weight-bold);
	color: var(--color-dark);
}

/* Short description */
.product-summary .woocommerce-product-details__short-description {
	font-size: var(--font-size-base);
	color: var(--color-body);
	line-height: var(--line-height-loose, 1.7);
	margin-bottom: var(--space-lg);
}

/* Product meta */
.product_meta {
	font-size: var(--font-size-sm);
	color: var(--color-muted);
	padding-top: var(--space-md);
	border-top: 1px solid var(--color-border);
}

.product_meta > span {
	display: block;
	margin-bottom: var(--space-xs);
}

.product_meta a {
	color: var(--color-accent);
}

/* ---------- Single Product Enhancements ---------- */

/* Breadcrumbs — subtle separator from product content */
.breadcrumbs {
	border-bottom: 1px solid var(--color-border);
	margin-bottom: 0;
}

/* BEST-SELLER badge above gallery */
.product-gallery__badge {
	text-align: center;
	font-size: 0.65rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--color-muted);
	margin-bottom: var(--space-sm);
}

/* Gallery FlexSlider — show prev/next arrows */
.product-gallery .woocommerce-product-gallery { position: relative; }

.product-gallery .flex-direction-nav {
	list-style: none;
	padding: 0;
	margin: 0;
}

.product-gallery .flex-direction-nav a {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 10;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.92);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
	display: flex;
	align-items: center;
	justify-content: center;
	text-decoration: none;
	font-size: 0;
	color: transparent;
	opacity: 1 !important; /* override FlexSlider default opacity: 0 */
	transition: background var(--transition-fast), box-shadow var(--transition-fast);
	cursor: pointer;
}

.product-gallery .flex-direction-nav a:hover {
	background: #fff;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2);
}

.product-gallery .flex-direction-nav a::after {
	font-size: 1.1rem;
	color: var(--color-dark);
}

.product-gallery .flex-prev { left: 10px; }
.product-gallery .flex-prev::after { content: '‹'; }
.product-gallery .flex-next { right: 10px; }
.product-gallery .flex-next::after { content: '›'; }

/* Gallery dot pagination */
.product-gallery .flex-control-paging {
	display: flex;
	justify-content: center;
	gap: 6px;
	padding: var(--space-sm) 0 0;
	list-style: none;
	margin: 0;
}

.product-gallery .flex-control-paging li a {
	display: block;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--color-border);
	text-indent: -9999px;
	cursor: pointer;
	transition: background var(--transition-fast);
}

.product-gallery .flex-control-paging li a.flex-active {
	background: var(--color-dark);
}

/* Price (left) + Qty (right) on same row — grid layout */
.single_variation_wrap {
	display: grid;
	grid-template-columns: 1fr auto;
	grid-template-rows: auto auto;
	column-gap: var(--space-md);
	row-gap: var(--space-sm);
	align-items: center;
}

/* Base price ("From€ X.XX") — col 1, row 1 before variation is chosen */
.product-summary__base-price {
	grid-column: 1;
	grid-row: 1;
	margin: 0;
}

/* Variation price block — col 1, row 1 */
.single_variation_wrap .woocommerce-variation {
	grid-column: 1;
	grid-row: 1;
}

.woocommerce-variation-price {
	margin: 0;
}

/* display:contents lifts qty + ATC into the parent grid */
.woocommerce-variation-add-to-cart.variations_button {
	display: contents;
}

/* Qty stepper — col 2, row 1 (same row as price) */
.woocommerce-variation-add-to-cart .quantity {
	grid-column: 2;
	grid-row: 1;
}

/* ATC button — full width, row 2 */
.woocommerce-variation-add-to-cart .single_add_to_cart_button {
	grid-column: 1 / -1;
	grid-row: 2;
}

/* Per-unit price line */
.product-summary__per-unit {
	font-size: var(--font-size-sm);
	color: var(--color-muted);
	margin: -4px 0 var(--space-md);
}

.woocommerce-variation-price {
	margin-bottom: 2px !important;
}

/* Video circles row */
/* ── Circle pulse animation ─────────────────────────────────────────────── */
@keyframes video-circle-pulse {
	0%   { box-shadow: 0 0 0 0 rgba(72, 153, 183, 0.55); }
	60%  { box-shadow: 0 0 0 8px rgba(72, 153, 183, 0); }
	100% { box-shadow: 0 0 0 0 rgba(72, 153, 183, 0); }
}

/* ── Loading ring — sweeps around circle on click ────────────────────────── */
@property --ring-pct {
	syntax: '<percentage>';
	inherits: false;
	initial-value: 0%;
}

@keyframes ring-load {
	from { --ring-pct: 0%; }
	to   { --ring-pct: 100%; }
}

/* Modal open animation */
@keyframes reel-modal-in {
	from { opacity: 0; transform: scale(0.88) translateY(24px); }
	to   { opacity: 1; transform: scale(1) translateY(0); }
}

@keyframes reel-overlay-in {
	from { opacity: 0; }
	to   { opacity: 1; }
}

.product-videos {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-lg);
	margin: var(--space-sm) 0 var(--space-md);
}

.product-video-circle {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 7px;
	background: none;
	border: none;
	padding: 4px;
	cursor: pointer;
	position: relative;
}

/* Loading ring — hidden by default, shown while is-loading */
.product-video-circle__ring {
	position: absolute;
	top: 4px;
	left: 50%;
	transform: translateX(-50%);
	width: 108px;
	height: 108px;
	border-radius: 50%;
	pointer-events: none;
	opacity: 0;
	z-index: 2;
	background: conic-gradient(var(--color-primary) var(--ring-pct), transparent var(--ring-pct));
	-webkit-mask: radial-gradient(closest-side, transparent 84%, black 86%);
	mask: radial-gradient(closest-side, transparent 84%, black 86%);
}

/* Trigger ring animation on click */
.product-video-circle.is-loading .product-video-circle__ring {
	opacity: 1;
	animation: ring-load 0.55s linear forwards;
}

/* Pause pulse animation while loading */
.product-video-circle.is-loading .product-video-circle__thumb {
	animation-play-state: paused;
}

.product-video-circle__thumb {
	position: relative;
	width: 100px;
	height: 100px;
	border-radius: 50%;
	overflow: hidden;
	border: 3px solid var(--color-primary);
	transition: border-color var(--transition-fast), transform var(--transition-fast);
	flex-shrink: 0;
	/* Staggered pulse per circle index */
	animation: video-circle-pulse 2.4s ease-out infinite;
}

/* Stagger the pulse start time so circles don't all pulse together */
.product-video-circle:nth-child(2) .product-video-circle__thumb { animation-delay: 0.6s; }
.product-video-circle:nth-child(3) .product-video-circle__thumb { animation-delay: 1.2s; }
.product-video-circle:nth-child(4) .product-video-circle__thumb { animation-delay: 1.8s; }

.product-video-circle:hover .product-video-circle__thumb,
.product-video-circle:focus .product-video-circle__thumb {
	border-color: var(--color-primary-dark);
	transform: scale(1.07);
	animation-play-state: paused;
}

.product-video-circle__thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

/* Play button: SVG white circle + teal triangle overlay */
.product-video-circle__play {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(0, 0, 0, 0.12);
	pointer-events: none;
}

.product-video-circle__play svg {
	width: 44px;
	height: 44px;
	filter: drop-shadow(0 1px 4px rgba(0, 0, 0, 0.35));
	transition: transform 0.18s ease;
}

.product-video-circle:hover .product-video-circle__play svg,
.product-video-circle:focus .product-video-circle__play svg {
	transform: scale(1.12);
}

.product-video-circle__label {
	font-size: 0.75rem;
	color: var(--color-primary);
	text-align: center;
	max-width: 100px;
	line-height: 1.3;
	font-weight: 500;
}

/* ── Reel-style video modal ─────────────────────────────────────────────── */
#video-modal {
	display: none;
	position: fixed;
	inset: 0;
	z-index: 99999;
	background: rgba(0, 0, 0, 0);
	align-items: center;
	justify-content: center;
	gap: 20px;
}

#video-modal.is-open {
	display: flex;
	animation: reel-overlay-in 0.3s ease forwards;
	background: rgba(0, 0, 0, 0.85);
}

/* Portrait reel box — phone-screen proportions */
#video-modal-box {
	display: flex;
	flex-direction: column;
	/* Portrait width — like a phone/reel */
	width: min(390px, 92vw);
	border-radius: 14px;
	overflow: hidden;
	box-shadow: 0 20px 60px rgba(0, 0, 0, 0.7);
	animation: reel-modal-in 0.32s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
}

#video-modal-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	background: #fff;
	padding: 13px 16px;
	min-height: 52px;
	gap: 8px;
}

#video-modal-title {
	font-size: 0.85rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	color: var(--color-dark);
	text-transform: uppercase;
	flex: 1;
}

#video-modal-close {
	background: none;
	border: none;
	color: var(--color-dark);
	font-size: 1.6rem;
	cursor: pointer;
	line-height: 1;
	padding: 0;
	opacity: 0.6;
	transition: opacity var(--transition-fast), transform var(--transition-fast);
	flex-shrink: 0;
	width: 28px;
	height: 28px;
	display: flex;
	align-items: center;
	justify-content: center;
}

#video-modal-close:hover {
	opacity: 1;
	transform: scale(1.2);
}

#video-modal-inner {
	background: #000;
	/* Force portrait 9:16 reel aspect ratio */
	aspect-ratio: 9 / 16;
}

#video-modal-inner iframe {
	width: 100%;
	height: 100%;
	border: none;
	display: block;
}

/* Prev / Next navigation arrows — outside the reel box, on the overlay */
#video-modal-prev,
#video-modal-next {
	background: rgba(255, 255, 255, 0.18);
	border: 1.5px solid rgba(255, 255, 255, 0.35);
	border-radius: 50%;
	width: 48px;
	height: 48px;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	color: #fff;
	flex-shrink: 0;
	transition: background var(--transition-fast), transform var(--transition-fast);
}

#video-modal-prev:hover,
#video-modal-next:hover {
	background: rgba(255, 255, 255, 0.35);
	transform: scale(1.1);
}

#video-modal-prev:disabled,
#video-modal-next:disabled {
	opacity: 0.25;
	cursor: default;
	transform: none;
}

/* On narrow screens, stack arrows below the reel */
@media (max-width: 560px) {
	#video-modal {
		flex-direction: column;
	}
	#video-modal-prev,
	#video-modal-next {
		order: 2;
		display: none;
	}
}

/* Full-width info bar (moved out of summary column) */
.product-tea-info {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	margin-bottom: var(--space-2xl);
	overflow: hidden;
}

.product-tea-info__item {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 4px;
	padding: var(--space-lg) var(--space-md);
	text-align: center;
	border-right: 1px solid var(--color-border);
}

.product-tea-info__item:last-child {
	border-right: none;
}

.product-tea-info__icon {
	display: block;
	color: var(--color-accent);
}

.product-tea-info__icon svg {
	width: 24px;
	height: 24px;
	display: block;
}

.product-tea-info__label {
	display: block;
	font-size: 0.6rem;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--color-muted);
}

.product-tea-info__value {
	display: block;
	font-size: var(--font-size-sm);
	font-weight: var(--font-weight-bold);
	color: var(--color-dark);
}

@media (max-width: 600px) {
	.product-tea-info {
		grid-template-columns: repeat(2, 1fr);
	}

	.product-tea-info__item:nth-child(odd) {
		border-right: 1px solid var(--color-border);
	}

	.product-tea-info__item:nth-last-child(-n+2):nth-child(odd) ~ .product-tea-info__item,
	.product-tea-info__item:nth-child(even) {
		border-right: none;
	}
}

/* ---------- Single product — reduce top spacing (no breadcrumb) ---------- */
.product-single-main {
	padding-top: var(--space-xl);
}

/* ---------- Product Tabs — pill-style redesign ---------- */
.woocommerce-tabs {
	margin-top: var(--space-2xl);
}

/* Tab nav row */
.wc-tabs {
	display: flex;
	gap: var(--space-sm);
	border-bottom: none;
	list-style: none;
	padding: 0 0 var(--space-lg);
	margin: 0;
	flex-wrap: wrap;
}

.wc-tabs li {
	margin-bottom: 0;
}

/* Tab buttons — pill shape */
.wc-tabs li a {
	display: inline-flex;
	align-items: center;
	padding: 10px var(--space-xl);
	font-size: var(--font-size-sm);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--color-muted);
	background: var(--color-bg);
	border: 2px solid var(--color-border);
	border-radius: 50px;
	transition: all var(--transition-fast);
	text-decoration: none;
}

.wc-tabs li a:hover {
	color: var(--color-dark);
	border-color: var(--color-dark);
	background: #fff;
}

.wc-tabs li.active a {
	color: #fff;
	background: var(--color-accent);
	border-color: var(--color-accent);
}

/* Panel */
.woocommerce-Tabs-panel {
	padding: var(--space-xl) 0;
	border-top: 1px solid var(--color-border);
}

.woocommerce-Tabs-panel h2 {
	font-size: var(--font-size-lg);
	margin-bottom: var(--space-md);
}

/* Benefits tab content */
.happytea-benefits {
	line-height: 1.75;
	max-width: 720px;
}
.happytea-benefits ul {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: var(--space-sm);
}
.happytea-benefits ul li {
	display: flex;
	align-items: flex-start;
	gap: var(--space-sm);
}
.happytea-benefits ul li::before {
	content: '✓';
	flex-shrink: 0;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background: var(--color-accent);
	color: #fff;
	font-size: 0.75rem;
	font-weight: 700;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: 2px;
}
.happytea-benefits__empty {
	color: var(--color-muted);
	font-style: italic;
}

/* ---------- Related Products ---------- */
section.related.products,
section.up-sells.products,
.related-products,
.up-sells {
	margin-top: var(--space-2xl);
	padding-top: var(--space-2xl);
	border-top: 1px solid var(--color-border);
}

section.related.products > h2,
section.up-sells.products > h2,
.related-products h2,
.up-sells h2 {
	font-size: var(--font-size-xl);
	font-weight: var(--font-weight-bold);
	margin-bottom: var(--space-lg);
}

section.related.products > ul.products,
section.up-sells.products > ul.products,
.related-products .products,
.up-sells .products,
ul.products.columns-4 {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: var(--space-lg);
}

@media (max-width: 768px) {
	section.related.products > ul.products,
	section.up-sells.products > ul.products,
	.related-products .products,
	.up-sells .products,
	ul.products.columns-4 {
		grid-template-columns: repeat(2, 1fr);
	}
}

/* ---------- Cart Page ---------- */
.woocommerce-cart-form {
	margin-bottom: var(--space-2xl);
}

.woocommerce-cart-form table {
	width: 100%;
	border-collapse: collapse;
}

.woocommerce-cart-form th {
	text-align: left;
	font-size: var(--font-size-sm);
	font-weight: var(--font-weight-bold);
	color: var(--color-dark);
	text-transform: uppercase;
	letter-spacing: 0.03em;
	padding: var(--space-md);
	border-bottom: 2px solid var(--color-border);
}

.woocommerce-cart-form td {
	padding: var(--space-md);
	border-bottom: 1px solid var(--color-border);
	vertical-align: middle;
}

.woocommerce-cart-form .product-thumbnail img {
	width: 80px;
	height: 80px;
	object-fit: cover;
	border-radius: var(--radius-sm);
}

.woocommerce-cart-form .product-name a {
	color: var(--color-dark);
	font-weight: var(--font-weight-regular);
}

.woocommerce-cart-form .product-name a:hover {
	color: var(--color-accent);
}

.woocommerce-cart-form .product-remove a {
	color: var(--color-muted);
	font-size: var(--font-size-lg);
}

.woocommerce-cart-form .product-remove a:hover {
	color: var(--color-coral);
}

@media (max-width: 768px) {
	.woocommerce-cart-form table,
	.woocommerce-cart-form thead,
	.woocommerce-cart-form tbody,
	.woocommerce-cart-form th,
	.woocommerce-cart-form td,
	.woocommerce-cart-form tr {
		display: block;
	}

	.woocommerce-cart-form thead {
		display: none;
	}

	.woocommerce-cart-form tr {
		padding: var(--space-md) 0;
		border-bottom: 1px solid var(--color-border);
	}

	.woocommerce-cart-form td {
		padding: var(--space-xs) 0;
		border: none;
	}
}

/* Cart totals */
.cart_totals {
	max-width: 480px;
	margin-left: auto;
	background: var(--color-light-bg);
	padding: var(--space-xl);
	border-radius: var(--radius-md);
}

.cart_totals h2 {
	font-size: var(--font-size-lg);
	margin-bottom: var(--space-md);
}

.cart_totals table {
	width: 100%;
}

.cart_totals th,
.cart_totals td {
	padding: var(--space-sm) 0;
	font-size: var(--font-size-sm);
}

.cart_totals th {
	text-align: left;
	font-weight: var(--font-weight-bold);
	color: var(--color-dark);
}

.cart_totals .order-total {
	font-size: var(--font-size-md);
	border-top: 2px solid var(--color-border);
}

.cart_totals .order-total .amount {
	color: var(--color-gold);
	font-size: var(--font-size-lg);
	font-weight: var(--font-weight-bold);
}

.cart_totals .wc-proceed-to-checkout a {
	display: block;
	margin-top: var(--space-md);
	padding: 1rem;
	background-color: var(--color-accent);
	color: var(--color-white);
	border: none;
	border-radius: var(--radius-sm);
	font-size: var(--font-size-sm);
	font-weight: var(--font-weight-bold);
	text-transform: uppercase;
	letter-spacing: 0.05em;
	text-align: center;
	transition: background-color var(--transition-fast);
}

.cart_totals .wc-proceed-to-checkout a:hover {
	background-color: var(--color-accent-dark);
	color: var(--color-white);
}

/* Coupon form */
.woocommerce-cart-form .coupon {
	display: flex;
	align-items: center;
	gap: var(--space-sm);
	flex-wrap: wrap;
}

.woocommerce-cart-form .coupon label {
	font-size: var(--font-size-sm);
	font-weight: var(--font-weight-bold);
	color: var(--color-dark);
}

.woocommerce-cart-form .coupon .input-text {
	padding: 0.5rem 1rem;
	border: 1px solid var(--color-border);
	border-radius: var(--radius-sm);
	font-size: var(--font-size-sm);
}

.woocommerce-cart-form .coupon .button {
	padding: 0.5rem 1rem;
	background-color: var(--color-dark);
	color: var(--color-white);
	border: none;
	border-radius: var(--radius-sm);
	font-size: var(--font-size-xs);
	font-weight: var(--font-weight-bold);
	text-transform: uppercase;
	letter-spacing: 0.03em;
	cursor: pointer;
	transition: background-color var(--transition-fast);
}

.woocommerce-cart-form .coupon .button:hover {
	background-color: var(--color-accent);
}

.woocommerce-cart-form button[name="update_cart"] {
	float: right;
	padding: 0.5rem 1rem;
	background-color: var(--color-light-bg);
	color: var(--color-body);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-sm);
	font-size: var(--font-size-xs);
	font-weight: var(--font-weight-bold);
	text-transform: uppercase;
	letter-spacing: 0.03em;
	cursor: pointer;
	transition: all var(--transition-fast);
}

.woocommerce-cart-form button[name="update_cart"]:hover {
	background-color: var(--color-accent);
	color: var(--color-white);
	border-color: var(--color-accent);
}

.woocommerce-cart-form button[name="update_cart"]:disabled {
	opacity: 0.5;
	cursor: not-allowed;
}

/* Empty cart */
.cart-empty {
	text-align: center;
	padding: var(--space-2xl) 0;
	font-size: var(--font-size-md);
	color: var(--color-muted);
}

.return-to-shop a {
	display: inline-block;
	margin-top: var(--space-md);
	padding: 0.75rem 2rem;
	background-color: var(--color-accent);
	color: var(--color-white);
	border-radius: var(--radius-sm);
	font-weight: var(--font-weight-bold);
	text-transform: uppercase;
	letter-spacing: 0.05em;
	transition: background-color var(--transition-fast);
}

.return-to-shop a:hover {
	background-color: var(--color-accent-dark);
	color: var(--color-white);
}

/* ---------- Checkout ---------- */
.woocommerce-checkout {
	max-width: 1000px;
	margin: 0 auto;
}

.col2-set {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--space-xl);
}

@media (max-width: 768px) {
	.col2-set {
		grid-template-columns: 1fr;
	}
}

.woocommerce-checkout h3 {
	font-size: var(--font-size-lg);
	margin-bottom: var(--space-md);
}

.woocommerce-checkout .form-row {
	margin-bottom: var(--space-md);
}

.woocommerce-checkout .form-row label {
	display: block;
	font-size: var(--font-size-sm);
	font-weight: var(--font-weight-bold);
	color: var(--color-dark);
	margin-bottom: var(--space-xs);
}

.woocommerce-checkout .form-row input,
.woocommerce-checkout .form-row select,
.woocommerce-checkout .form-row textarea {
	width: 100%;
	padding: 0.625rem 1rem;
	border: 1px solid var(--color-border);
	border-radius: var(--radius-sm);
	font-size: var(--font-size-base);
}

.woocommerce-checkout .form-row input:focus,
.woocommerce-checkout .form-row select:focus {
	border-color: var(--color-accent);
	outline: none;
	box-shadow: 0 0 0 3px var(--color-accent-light);
}

#order_review {
	background: var(--color-light-bg);
	padding: var(--space-xl);
	border-radius: var(--radius-md);
	margin-top: var(--space-xl);
}

#place_order {
	width: 100%;
	padding: 1rem;
	background-color: var(--color-accent);
	color: var(--color-white);
	border: none;
	border-radius: var(--radius-sm);
	font-size: var(--font-size-base);
	font-weight: var(--font-weight-bold);
	text-transform: uppercase;
	letter-spacing: 0.05em;
	cursor: pointer;
	transition: background-color var(--transition-fast);
}

#place_order:hover {
	background-color: var(--color-accent-dark);
}

/* ---------- My Account ---------- */
.woocommerce-MyAccount-navigation {
	margin-bottom: var(--space-xl);
}

/* Login/Register forms */
/* My Account login/register — center everything */
.woocommerce .col2-set .u-column1,
.woocommerce .col2-set .u-column2 {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.woocommerce form.login,
.woocommerce form.register {
	max-width: 480px;
	width: 100%;
	text-align: left;
}

.woocommerce form.login .form-row,
.woocommerce form.register .form-row {
	margin-bottom: var(--space-md);
}

.woocommerce form.login label,
.woocommerce form.register label {
	display: block;
	font-size: var(--font-size-sm);
	font-weight: var(--font-weight-bold);
	color: var(--color-dark);
	margin-bottom: var(--space-xs);
}

.woocommerce form.login input[type="text"],
.woocommerce form.login input[type="password"],
.woocommerce form.register input[type="text"],
.woocommerce form.register input[type="email"],
.woocommerce form.register input[type="password"] {
	width: 100%;
	padding: 0.625rem 1rem;
	border: 1px solid var(--color-border);
	border-radius: var(--radius-sm);
	font-size: var(--font-size-base);
}

.woocommerce form.login input:focus,
.woocommerce form.register input:focus {
	border-color: var(--color-accent);
	outline: none;
	box-shadow: 0 0 0 3px var(--color-accent-light);
}

.woocommerce form.login .button,
.woocommerce form.register .button {
	padding: 0.75rem 2rem;
	background-color: var(--color-accent);
	color: var(--color-white);
	border: none;
	border-radius: var(--radius-sm);
	font-size: var(--font-size-sm);
	font-weight: var(--font-weight-bold);
	text-transform: uppercase;
	letter-spacing: 0.05em;
	cursor: pointer;
	transition: background-color var(--transition-fast);
}

.woocommerce form.login .button:hover,
.woocommerce form.register .button:hover {
	background-color: var(--color-accent-dark);
}

.woocommerce .lost_password a {
	font-size: var(--font-size-sm);
	color: var(--color-accent);
}

.woocommerce-MyAccount-navigation ul {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-sm);
	padding: 0;
	border-bottom: 2px solid var(--color-border);
}

.woocommerce-MyAccount-navigation li {
	margin-bottom: -2px;
}

.woocommerce-MyAccount-navigation li a {
	display: block;
	padding: var(--space-md) var(--space-lg);
	font-size: var(--font-size-sm);
	font-weight: var(--font-weight-bold);
	color: var(--color-muted);
	border-bottom: 2px solid transparent;
	text-transform: uppercase;
	letter-spacing: 0.03em;
}

.woocommerce-MyAccount-navigation li a:hover {
	color: var(--color-dark);
}

.woocommerce-MyAccount-navigation li.is-active a,
.woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--dashboard.is-active a {
	color: var(--color-accent);
	border-bottom-color: var(--color-accent);
}

.woocommerce-MyAccount-content {
	min-height: 300px;
}

/* ---------- WooCommerce Notices ---------- */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
	padding: var(--space-md) var(--space-lg);
	border-radius: var(--radius-sm);
	margin-bottom: var(--space-lg);
	font-size: var(--font-size-sm);
}

.woocommerce-message {
	background-color: #e8f5e9;
	border-left: 4px solid #4caf50;
	color: #2e7d32;
}

.woocommerce-info {
	background-color: var(--color-primary-light);
	border-left: 4px solid var(--color-primary);
	color: var(--color-primary-dark);
}

.woocommerce-error {
	background-color: #ffebee;
	border-left: 4px solid #f44336;
	color: #c62828;
}

.woocommerce-error li {
	margin-bottom: var(--space-xs);
}

/* ---------- Pagination ---------- */
.woocommerce-pagination {
	margin-top: var(--space-xl);
	text-align: center;
}

.woocommerce-pagination .page-numbers {
	display: inline-flex;
	gap: var(--space-xs);
}

.woocommerce-pagination .page-numbers li {
	display: inline-block;
}

.woocommerce-pagination .page-numbers a,
.woocommerce-pagination .page-numbers span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 var(--space-sm);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-sm);
	font-size: var(--font-size-sm);
	color: var(--color-body);
	transition: all var(--transition-fast);
}

.woocommerce-pagination .page-numbers a:hover {
	border-color: var(--color-accent);
	color: var(--color-accent);
}

.woocommerce-pagination .page-numbers .current {
	background-color: var(--color-accent);
	border-color: var(--color-accent);
	color: var(--color-white);
}

/* ---------- Blog Styles ---------- */
.post-card {
	background: var(--color-white);
	border-radius: var(--radius-md);
	overflow: hidden;
	transition: box-shadow var(--transition-base);
}

.post-card:hover {
	box-shadow: var(--shadow-md);
}

.post-card__thumbnail {
	display: block;
	aspect-ratio: 3/2;
	overflow: hidden;
}

.post-card__thumbnail img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform var(--transition-slow);
}

.post-card:hover .post-card__thumbnail img {
	transform: scale(1.05);
}

.post-card__content {
	padding: var(--space-md);
}

.post-card__meta {
	display: flex;
	gap: var(--space-md);
	font-size: var(--font-size-xs);
	color: var(--color-muted);
	margin-bottom: var(--space-sm);
}

.post-card__title {
	font-size: var(--font-size-md);
	font-weight: var(--font-weight-bold);
	margin-bottom: var(--space-sm);
}

.post-card__title a {
	color: var(--color-dark);
}

.post-card__title a:hover {
	color: var(--color-accent);
}

.post-card__excerpt {
	font-size: var(--font-size-sm);
	color: var(--color-body);
	margin-bottom: var(--space-sm);
}

.post-card__link {
	font-size: var(--font-size-sm);
	font-weight: var(--font-weight-bold);
	color: var(--color-accent);
	text-transform: uppercase;
	letter-spacing: 0.03em;
}

/* Single post */
.single-post__thumbnail {
	margin-bottom: var(--space-xl);
	border-radius: var(--radius-md);
	overflow: hidden;
}

.single-post__header {
	margin-bottom: var(--space-xl);
}

.single-post__meta {
	display: flex;
	gap: var(--space-md);
	font-size: var(--font-size-sm);
	color: var(--color-muted);
	margin-bottom: var(--space-md);
}

.single-post__title {
	font-size: var(--font-size-2xl);
	font-weight: var(--font-weight-light);
}

.entry-content {
	font-size: var(--font-size-base);
	line-height: var(--line-height-normal);
	color: var(--color-body);
}

.entry-content h2,
.entry-content h3,
.entry-content h4 {
	margin-top: var(--space-xl);
}

.entry-content p {
	margin-bottom: var(--space-md);
}

.entry-content ul,
.entry-content ol {
	margin-bottom: var(--space-md);
	padding-left: var(--space-xl);
	list-style: disc;
}

.entry-content ol {
	list-style: decimal;
}

.entry-content blockquote {
	border-left: 4px solid var(--color-accent);
	padding: var(--space-md) var(--space-lg);
	margin: var(--space-lg) 0;
	background: var(--color-light-bg);
	font-style: italic;
}

.entry-content img {
	border-radius: var(--radius-md);
}

.single-post__footer {
	margin-top: var(--space-xl);
	padding-top: var(--space-xl);
	border-top: 1px solid var(--color-border);
}

/* Comments */
.comments-area {
	margin-top: var(--space-2xl);
	padding-top: var(--space-2xl);
	border-top: 1px solid var(--color-border);
}

.comment-list {
	list-style: none;
	padding: 0;
}

.comment-list .comment {
	padding: var(--space-md) 0;
	border-bottom: 1px solid var(--color-border);
}

/* ---------- Homepage Sections ---------- */
.hero-section {
	position: relative;
	min-height: 520px;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	background-size: cover;
	background-position: center;
	color: var(--color-white);
	overflow: hidden;
}

/* Dark overlay — only for photography */
.hero-section--has-image::before {
	content: '';
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.35);
	z-index: 1;
}

/* No-image gradient fallback */
.hero-section--no-image {
	background: linear-gradient(135deg, #2d7090 0%, #1e5570 50%, #163d55 100%);
}

/* Decorative floating circles for no-image hero */
.hero-section--no-image::before {
	content: '';
	position: absolute;
	width: 500px;
	height: 500px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.04);
	top: -120px;
	right: -80px;
	z-index: 1;
}

/* Elegant inner border frame */
.hero-section::after {
	content: '';
	position: absolute;
	inset: 20px;
	border: 1px solid rgba(255, 255, 255, 0.25);
	pointer-events: none;
	z-index: 2;
}

.hero-section__content {
	position: relative;
	z-index: 3;
	max-width: 680px;
	padding: var(--space-2xl) var(--space-xl);
}

.hero-section__title {
	font-family: var(--font-display);
	font-size: var(--font-size-3xl);
	font-weight: 400;
	font-style: italic;
	color: var(--color-white);
	margin-bottom: var(--space-md);
	line-height: 1.2;
	letter-spacing: 0.01em;
}

.hero-section__subtitle {
	font-size: var(--font-size-sm);
	color: rgba(255, 255, 255, 0.8);
	margin-bottom: var(--space-xl);
	font-weight: var(--font-weight-light);
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

@media (max-width: 768px) {
	.hero-section {
		min-height: 380px;
	}

	.hero-section::after {
		inset: 12px;
	}

	.hero-section__title {
		font-size: var(--font-size-2xl);
	}
}

/* Category bubbles — mobile only (hidden on desktop) */
.category-bubbles {
	display: none;
}

@media (max-width: 768px) {
	.category-bubbles {
		display: block;
		padding: var(--space-xl) 0;
		background: var(--color-white);
		border-bottom: 1px solid var(--color-border);
	}
}

.category-bubbles .section__header {
	margin-bottom: var(--space-lg);
	padding-bottom: var(--space-md);
}

.category-bubbles__list {
	display: flex;
	gap: var(--space-xl);
	justify-content: center;
	flex-wrap: nowrap;
	overflow-x: auto;
	padding: 0 var(--space-md) var(--space-sm);
	scrollbar-width: none;
	-ms-overflow-style: none;
}

.category-bubbles__list::-webkit-scrollbar {
	display: none;
}

.category-bubble {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--space-sm);
	text-decoration: none;
	flex-shrink: 0;
}

.category-bubble__image {
	width: 100px;
	height: 100px;
	border-radius: 50%;
	overflow: hidden;
	border: none;
	transition: transform var(--transition-base), box-shadow var(--transition-base);
	background: var(--color-light-bg);
}

.category-bubble:hover .category-bubble__image {
	transform: translateY(-6px);
	box-shadow: var(--shadow-md);
}

.category-bubble__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Default initial style — overridden by nth-child below */
.category-bubble__initial {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	font-family: var(--font-display);
	font-size: 3rem;
	font-weight: 400;
	font-style: italic;
	color: var(--color-white);
	background: linear-gradient(145deg, var(--color-primary), var(--color-primary-dark));
	transition: filter var(--transition-fast);
}

.category-bubble:hover .category-bubble__initial {
	filter: brightness(1.12);
}

/* Nos Thés — teal (primary) */
.category-bubble:nth-child(1) .category-bubble__initial {
	background: linear-gradient(145deg, #4899b7, #2e7a9a);
}

/* Nos Cafés — warm coffee brown */
.category-bubble:nth-child(2) .category-bubble__initial {
	background: linear-gradient(145deg, #a0784a, #7a5630);
}

/* Rooibos & Infusions — warm coral/orange */
.category-bubble:nth-child(3) .category-bubble__initial {
	background: linear-gradient(145deg, #f68872, #d9614c);
}

/* Box & Coffrets Cadeaux — gold */
.category-bubble:nth-child(4) .category-bubble__initial {
	background: linear-gradient(145deg, #ccb38d, #aa9068);
	color: #4a3a20;
}

/* Accessoires — sage green */
.category-bubble:nth-child(5) .category-bubble__initial {
	background: linear-gradient(145deg, #6aaa8f, #4a8a70);
}

.category-bubble__name {
	font-size: var(--font-size-sm);
	font-weight: var(--font-weight-bold);
	color: var(--color-dark);
	text-align: center;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	font-size: var(--font-size-xs);
}

.category-bubble:hover .category-bubble__name {
	color: var(--color-accent);
}

@media (max-width: 768px) {
	.category-bubble__image {
		width: 72px;
		height: 72px;
	}

	.category-bubble__initial {
		font-size: 1.75rem;
	}

	.category-bubbles__list {
		gap: var(--space-lg);
		justify-content: flex-start;
	}
}

/* ---------- Multi-step Checkout (arg-multistep) ---------- */
.arg-multistep-checkout .arg-wizard-head {
	margin-bottom: var(--space-xl);
}

.arg-multistep-checkout .arg-wizard-head li {
	font-size: var(--font-size-xs);
}

.arg-multistep-checkout .arg-checkout-step {
	padding: var(--space-lg) 0;
}

/* Checkout order review table */
.woocommerce-checkout-review-order-table {
	width: 100%;
	border-collapse: collapse;
	margin-bottom: var(--space-lg);
}

.woocommerce-checkout-review-order-table th,
.woocommerce-checkout-review-order-table td {
	padding: var(--space-sm) var(--space-md);
	border-bottom: 1px solid var(--color-border);
	font-size: var(--font-size-sm);
}

.woocommerce-checkout-review-order-table th {
	font-weight: var(--font-weight-bold);
	color: var(--color-dark);
	text-align: left;
}

.woocommerce-checkout-review-order-table .order-total .amount {
	color: var(--color-gold);
	font-size: var(--font-size-md);
	font-weight: var(--font-weight-bold);
}

/* Payment methods */
.wc_payment_methods {
	list-style: none;
	padding: 0;
	margin: var(--space-lg) 0;
}

.wc_payment_methods li {
	padding: var(--space-md);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-sm);
	margin-bottom: var(--space-sm);
}

.wc_payment_methods li label {
	font-weight: var(--font-weight-bold);
	cursor: pointer;
}

/* ---------- Stock badges ---------- */
.product-card .stock-badge,
.onsale,
.out-of-stock-badge {
	display: inline-block;
	padding: 0.25rem 0.75rem;
	font-size: var(--font-size-xs);
	font-weight: var(--font-weight-bold);
	text-transform: uppercase;
	letter-spacing: 0.03em;
	border-radius: var(--radius-sm);
}

.onsale {
	background-color: var(--color-coral);
	color: var(--color-white);
}

.out-of-stock-badge {
	background-color: #3a3a3a;
	color: var(--color-white);
}

/* ---------- Price Styling ---------- */
.price {
	color: var(--color-gold);
	font-weight: var(--font-weight-light);
	letter-spacing: 1px;
}

.price del {
	color: var(--color-muted);
	font-size: 0.85em;
}

.price ins {
	text-decoration: none;
	color: var(--color-coral);
}

/* "À partir de" prefix */
.price .from-prefix {
	font-size: var(--font-size-sm);
	color: var(--color-muted);
	font-weight: var(--font-weight-regular);
	letter-spacing: normal;
}

/* ---------- Variation Swatches (plugin compat) ---------- */
.cfvsw-swatches-container {
	display: flex;
	gap: var(--space-sm);
	flex-wrap: wrap;
}

.cfvsw-swatches-container .cfvsw-swatch {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	padding: 0.375rem 0.75rem;
	border: 2px solid var(--color-border);
	border-radius: var(--radius-sm);
	font-size: var(--font-size-sm);
	font-weight: var(--font-weight-bold);
	cursor: pointer;
	transition: all var(--transition-fast);
}

.cfvsw-swatches-container .cfvsw-swatch:hover {
	border-color: var(--color-accent);
}

.cfvsw-swatches-container .cfvsw-swatch.selected,
.cfvsw-swatches-container .cfvsw-swatch.cfvsw-selected-swatch {
	border-color: var(--color-dark);
	background-color: var(--color-dark);
	color: var(--color-white);
}

/* ---------- Product Card — Subtitle & Swatches ---------- */
.product-card__subtitle {
	font-size: var(--font-size-xs);
	color: #5a7a1e;
	margin-bottom: var(--space-sm);
	line-height: 1.4;
	min-height: 2.8em;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.product-card__swatches {
	display: flex;
	flex-wrap: nowrap;
	justify-content: center;
	align-items: center;
	gap: 6px;
	margin-bottom: var(--space-sm);
}

.product-card__swatches-more {
	font-size: 0.65rem;
	color: var(--color-muted);
	text-decoration: none;
	white-space: nowrap;
	margin-left: 2px;
}

.product-card__swatches-more:hover {
	color: var(--color-accent);
	text-decoration: underline;
}

.swatch {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0.25rem 0.625rem;
	border: 1.5px solid var(--color-border);
	border-radius: 3px;
	font-size: 0.7rem;
	font-weight: var(--font-weight-bold);
	letter-spacing: 0.02em;
	cursor: pointer;
	background: var(--color-white);
	color: var(--color-body);
	transition: border-color var(--transition-fast), background var(--transition-fast), color var(--transition-fast);
	line-height: 1;
}

.swatch:hover {
	border-color: var(--color-dark);
	color: var(--color-dark);
}

.swatch--selected {
	border-color: var(--color-dark);
	background: var(--color-dark);
	color: var(--color-white);
}

.swatch--disabled {
	opacity: 0.35;
	cursor: not-allowed;
	text-decoration: line-through;
	pointer-events: none;
}

/* AJAX "Ajouter" button on product card */
.btn-atc {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0.5rem 1.25rem;
	background-color: var(--color-accent);
	color: var(--color-white);
	border: none;
	border-radius: var(--radius-sm);
	font-size: var(--font-size-xs);
	font-weight: var(--font-weight-bold);
	text-transform: uppercase;
	letter-spacing: 0.06em;
	cursor: pointer;
	transition: background-color var(--transition-fast), opacity var(--transition-fast);
	width: 100%;
}

.btn-atc:hover {
	background-color: var(--color-accent-dark);
}

.btn-atc.loading {
	opacity: 0.7;
	cursor: wait;
}

.btn-atc.added {
	background-color: #4caf50;
}

/* ==========================================================================
   Phase 1 — Notices
   ========================================================================== */

.wc-notice {
	display: flex;
	align-items: flex-start;
	gap: var(--space-sm);
	padding: var(--space-sm) var(--space-md);
	border-radius: var(--radius-sm);
	margin-bottom: var(--space-md);
	font-size: var(--font-size-sm);
	line-height: 1.5;
}

.wc-notice__icon {
	flex-shrink: 0;
	margin-top: 1px;
}

.wc-notice__text {
	flex: 1;
}

.wc-notice--info {
	background: var(--color-accent-light);
	border-left: 3px solid var(--color-accent);
	color: var(--color-dark);
}

.wc-notice--info .wc-notice__icon {
	color: var(--color-accent);
}

.wc-notice--error {
	background: #fef2f2;
	border-left: 3px solid var(--color-coral);
	color: #991b1b;
}

.wc-notice--error .wc-notice__icon {
	color: var(--color-coral);
}

.wc-notice--success {
	background: #f0fdf4;
	border-left: 3px solid #22c55e;
	color: #166534;
}

.wc-notice--success .wc-notice__icon {
	color: #22c55e;
}

/* Ensure WC's own notice classes also get our styles */
.woocommerce-info,
.woocommerce-message {
	display: flex;
	align-items: flex-start;
	gap: var(--space-sm);
	padding: var(--space-sm) var(--space-md);
	border-radius: var(--radius-sm);
	margin-bottom: var(--space-md);
	font-size: var(--font-size-sm);
	background: var(--color-accent-light);
	border-left: 3px solid var(--color-accent);
	color: var(--color-dark);
	border-top: none;
}

.woocommerce-error {
	display: flex;
	flex-direction: column;
	gap: var(--space-xs);
	padding: var(--space-sm) var(--space-md);
	border-radius: var(--radius-sm);
	margin-bottom: var(--space-md);
	font-size: var(--font-size-sm);
	background: #fef2f2;
	border-left: 3px solid var(--color-coral);
	color: #991b1b;
	border-top: none;
	list-style: none;
}

.woocommerce-error li::before {
	content: none;
}

/* ==========================================================================
   Phase 1 — Breadcrumb
   ========================================================================== */

.breadcrumb {
	padding: var(--space-sm) 0;
	margin-bottom: var(--space-md);
}

.breadcrumb__list {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0;
	list-style: none;
	padding: 0;
	margin: 0;
	font-size: var(--font-size-sm);
	color: var(--color-muted);
}

.breadcrumb__item {
	display: flex;
	align-items: center;
}

.breadcrumb__link {
	color: var(--color-body);
	text-decoration: none;
	transition: color var(--transition-fast);
}

.breadcrumb__link:hover {
	color: var(--color-accent);
}

.breadcrumb__sep {
	margin: 0 var(--space-xs);
	color: var(--color-border);
}

.breadcrumb__current {
	color: var(--color-muted);
}

/* ==========================================================================
   Phase 1 — Quantity Stepper
   ========================================================================== */

.qty-stepper {
	display: inline-flex;
	align-items: stretch;
	border: 1px solid var(--color-border);
	border-radius: var(--radius-sm);
	overflow: hidden;
	height: 40px;
}

.qty-stepper__btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	background: var(--color-light-bg);
	border: none;
	font-size: 1.125rem;
	color: var(--color-body);
	cursor: pointer;
	transition: background var(--transition-fast), color var(--transition-fast);
	padding: 0;
	line-height: 1;
}

.qty-stepper__btn:hover {
	background: var(--color-accent);
	color: var(--color-white);
}

.qty-stepper__input {
	width: 48px;
	text-align: center;
	border: none;
	border-left: 1px solid var(--color-border);
	border-right: 1px solid var(--color-border);
	font-family: var(--font-body);
	font-size: var(--font-size-sm);
	color: var(--color-dark);
	background: var(--color-white);
	-moz-appearance: textfield;
	padding: 0 var(--space-xs);
}

.qty-stepper__input::-webkit-inner-spin-button,
.qty-stepper__input::-webkit-outer-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

/* ==========================================================================
   Phase 1 — No Products Found
   ========================================================================== */

.no-products-found {
	text-align: center;
	padding: var(--space-3xl) var(--space-lg);
	grid-column: 1 / -1;
}

.no-products-found__icon {
	color: var(--color-border);
	margin-bottom: var(--space-md);
}

.no-products-found__title {
	font-family: var(--font-display);
	font-size: var(--font-size-xl);
	color: var(--color-dark);
	margin-bottom: var(--space-sm);
}

.no-products-found__text {
	color: var(--color-body);
	margin-bottom: var(--space-lg);
}

/* ==========================================================================
   Phase 1 — Loop Sort & Result Count
   ========================================================================== */

.shop-sort {
	appearance: none;
	-webkit-appearance: none;
	padding: var(--space-xs) var(--space-2xl) var(--space-xs) var(--space-sm);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-sm);
	background-color: var(--color-white);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23999' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right var(--space-sm) center;
	font-family: var(--font-body);
	font-size: var(--font-size-sm);
	color: var(--color-dark);
	cursor: pointer;
	transition: border-color var(--transition-fast);
}

.shop-sort:focus {
	outline: 2px solid var(--color-accent);
	outline-offset: 2px;
	border-color: var(--color-accent);
}

.shop-result-count {
	font-size: var(--font-size-sm);
	color: var(--color-muted);
	margin: 0;
}

/* ==========================================================================
   Phase 1 — Pagination
   ========================================================================== */

.wc-pagination ul,
.woocommerce-pagination ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--space-xs);
	list-style: none;
	padding: 0;
	margin: var(--space-2xl) 0 0;
}

.wc-pagination ul li,
.woocommerce-pagination ul li {
	display: flex;
}

.wc-pagination ul .page-numbers,
.woocommerce-pagination ul .page-numbers {
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 38px;
	height: 38px;
	padding: 0 var(--space-sm);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-sm);
	font-size: var(--font-size-sm);
	color: var(--color-body);
	text-decoration: none;
	transition: all var(--transition-fast);
}

.wc-pagination ul .page-numbers:hover,
.woocommerce-pagination ul .page-numbers:hover {
	border-color: var(--color-accent);
	color: var(--color-accent);
}

.wc-pagination ul .page-numbers.current,
.woocommerce-pagination ul .page-numbers.current {
	background: var(--color-accent);
	border-color: var(--color-accent);
	color: var(--color-white);
}

.wc-pagination ul .page-numbers.dots,
.woocommerce-pagination ul .page-numbers.dots {
	border-color: transparent;
	pointer-events: none;
}

/* ==========================================================================
   Phase 1 — Star Rating
   ========================================================================== */

.star-rating {
	overflow: hidden;
	position: relative;
	height: 1em;
	line-height: 1;
	font-size: 0.85em;
	width: 5.4em;
	font-family: 'star';
}

.star-rating::before {
	content: '\53\53\53\53\53';
	color: var(--color-border);
	float: left;
	top: 0;
	left: 0;
	position: absolute;
}

.star-rating span {
	overflow: hidden;
	float: left;
	top: 0;
	left: 0;
	position: absolute;
	padding-top: 1.5em;
}

.star-rating span::before {
	content: '\53\53\53\53\53';
	top: 0;
	position: absolute;
	left: 0;
	color: var(--color-gold);
}

/* CSS star rating fallback (no font dependency) */
.product-card__rating {
	display: flex;
	align-items: center;
	gap: 2px;
	margin-bottom: var(--space-xs);
}

/* ==========================================================================
   Phase 2 — Single Product: Tabs
   ========================================================================== */

.product-tabs {
	margin-top: var(--space-2xl);
}

.product-tabs__nav {
	display: flex;
	gap: var(--space-sm);
	flex-wrap: wrap;
	border-bottom: none;
	margin-bottom: var(--space-xl);
}

.product-tabs__tab {
	padding: 10px var(--space-xl);
	background: var(--color-bg);
	border: 2px solid var(--color-border);
	border-radius: 50px;
	font-family: var(--font-body);
	font-size: var(--font-size-sm);
	font-weight: 600;
	color: var(--color-muted);
	cursor: pointer;
	transition: all var(--transition-fast);
	white-space: nowrap;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	line-height: 1;
}

.product-tabs__tab:hover {
	color: var(--color-dark);
	border-color: var(--color-dark);
	background: #fff;
}

.product-tabs__tab.is-active {
	color: #fff;
	background: var(--color-accent);
	border-color: var(--color-accent);
}

.product-tabs__panel {
	line-height: 1.7;
	color: var(--color-body);
	border-top: 1px solid var(--color-border);
	padding-top: var(--space-xl);
}

.product-tabs__panel h2 {
	font-size: var(--font-size-lg);
	margin-bottom: var(--space-md);
}

/* Attributes table inside additional information */
.woocommerce-product-attributes {
	width: 100%;
	border-collapse: collapse;
}

.woocommerce-product-attributes th,
.woocommerce-product-attributes td {
	padding: var(--space-sm) var(--space-md);
	border-bottom: 1px solid var(--color-border);
	font-size: var(--font-size-sm);
	text-align: left;
	vertical-align: top;
}

.woocommerce-product-attributes th {
	color: var(--color-dark);
	font-weight: var(--font-weight-bold);
	width: 35%;
	background: var(--color-light-bg);
}

.woocommerce-product-attributes td {
	color: var(--color-body);
}

/* ==========================================================================
   Phase 2 — Single Product: Meta
   ========================================================================== */

.product-meta {
	margin-top: var(--space-md);
	padding-top: var(--space-md);
	border-top: 1px solid var(--color-border);
}

.product-meta__row {
	display: flex;
	gap: var(--space-xs);
	font-size: var(--font-size-sm);
	color: var(--color-muted);
	margin-bottom: var(--space-xs);
}

.product-meta__label {
	font-weight: var(--font-weight-bold);
	color: var(--color-dark);
	flex-shrink: 0;
}

.product-meta__value a {
	color: var(--color-accent);
	text-decoration: none;
}

.product-meta__value a:hover {
	text-decoration: underline;
}

/* ==========================================================================
   Phase 2 — Related Products & Upsells
   ========================================================================== */

.related-products,
.upsells-products {
	margin-top: var(--space-3xl);
	padding-top: var(--space-2xl);
	border-top: 1px solid var(--color-border);
}

.section-header--left {
	text-align: left;
	margin-bottom: var(--space-lg);
}

.section-header--left .section-header__title {
	font-size: var(--font-size-xl);
	font-family: var(--font-display);
	color: var(--color-dark);
}

/* Sale flash on single product (larger) */
.badge--sale-lg {
	font-size: var(--font-size-sm);
	padding: var(--space-xs) var(--space-sm);
}

/* ==========================================================================
   Phase 3 — Cart Page
   ========================================================================== */

/* Cart two-column layout */
.cart-layout {
	display: grid;
	grid-template-columns: 1fr 360px;
	gap: var(--space-xl);
	align-items: start;
	padding: var(--space-2xl) 0;
}

@media (max-width: 960px) {
	.cart-layout {
		grid-template-columns: 1fr;
	}
}

/* Cart table */
.cart-table {
	width: 100%;
	border-collapse: collapse;
}

.cart-table__head th {
	padding: var(--space-sm) var(--space-md);
	font-family: var(--font-body);
	font-size: var(--font-size-xs);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.07em;
	color: var(--color-muted);
	border-bottom: 2px solid var(--color-border);
	text-align: left;
}

.cart-table__head .product-remove,
.cart-table__head .product-thumbnail {
	width: 1%;
	white-space: nowrap;
}

.cart-table__row td {
	padding: var(--space-md);
	vertical-align: middle;
	border-bottom: 1px solid var(--color-border);
}

.cart-table__row .product-thumbnail img {
	width: 72px;
	height: 72px;
	object-fit: cover;
	border-radius: var(--radius-sm);
	display: block;
}

.cart-table__row .product-name {
	font-weight: 500;
	color: var(--color-dark);
}

.cart-table__row .product-name a {
	color: inherit;
	text-decoration: none;
}

.cart-table__row .product-name a:hover {
	color: var(--color-accent);
}

.cart-table__row .product-price,
.cart-table__row .product-subtotal {
	font-variant-numeric: tabular-nums;
}

.cart-table__row .product-subtotal {
	font-weight: 600;
	color: var(--color-dark);
}

/* Remove button */
.cart-remove {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	background: transparent;
	color: var(--color-muted);
	font-size: 1.25rem;
	line-height: 1;
	text-decoration: none;
	transition: background 0.15s, color 0.15s;
}

.cart-remove:hover {
	background: var(--color-danger, #fee2e2);
	color: var(--color-coral, #e57373);
}

/* Cart actions row (coupon + update) */
.cart-table__actions td {
	padding: var(--space-md) var(--space-md);
}

.cart-coupon {
	display: flex;
	align-items: center;
	gap: var(--space-sm);
	margin-bottom: var(--space-sm);
}

.cart-coupon__input {
	flex: 1;
	max-width: 220px;
	padding: var(--space-sm) var(--space-md);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-sm);
	font-size: var(--font-size-sm);
	background: var(--color-white);
	color: var(--color-dark);
}

.cart-coupon__input:focus {
	outline: none;
	border-color: var(--color-accent);
	box-shadow: 0 0 0 3px var(--color-accent-light);
}

.cart-coupon__btn {
	white-space: nowrap;
}

.cart-update {
	font-size: var(--font-size-sm);
}

/* Cart totals sidebar */
.cart-totals {
	background: var(--color-light);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	padding: var(--space-lg);
}

.cart-totals__title {
	font-family: var(--font-display);
	font-size: var(--font-size-lg);
	font-weight: 400;
	margin-bottom: var(--space-lg);
	color: var(--color-dark);
}

.cart-totals__rows {
	display: flex;
	flex-direction: column;
	gap: var(--space-sm);
	margin-bottom: var(--space-lg);
}

.cart-totals__row {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: var(--space-sm);
	padding: var(--space-xs) 0;
	border-bottom: 1px solid var(--color-border);
	font-size: var(--font-size-sm);
}

.cart-totals__row:last-child {
	border-bottom: none;
}

.cart-totals__row--discount .cart-totals__value {
	color: var(--color-coral, #e57373);
}

.cart-totals__row--total {
	padding-top: var(--space-sm);
	font-weight: 700;
	font-size: var(--font-size-base);
}

.cart-totals__row--total .cart-totals__value {
	font-size: var(--font-size-lg);
	color: var(--color-dark);
}

.cart-totals__label {
	color: var(--color-body);
}

.cart-totals__value {
	color: var(--color-dark);
	font-variant-numeric: tabular-nums;
	text-align: right;
}

/* WC shipping table within totals */
.cart-totals .woocommerce-shipping-destination {
	font-size: var(--font-size-xs);
	color: var(--color-muted);
	margin-top: var(--space-xs);
}

.cart-totals__checkout .checkout-button {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
}

/* Full-width button modifier */
.btn--full {
	width: 100%;
	justify-content: center;
}

/* Cart empty state */
.cart-empty {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	padding: var(--space-3xl) var(--space-xl);
	max-width: 440px;
	margin: 0 auto;
}

.cart-empty__icon {
	color: var(--color-muted);
	margin-bottom: var(--space-lg);
	opacity: 0.5;
}

.cart-empty__title {
	font-family: var(--font-display);
	font-size: var(--font-size-2xl);
	font-weight: 400;
	color: var(--color-dark);
	margin-bottom: var(--space-sm);
}

.cart-empty__text {
	color: var(--color-muted);
	font-size: var(--font-size-sm);
	margin-bottom: var(--space-xl);
}

.cart-empty__actions {
	display: flex;
	gap: var(--space-sm);
	flex-wrap: wrap;
	justify-content: center;
}

/* Cart cross-sells strip */
.cart-cross-sells {
	margin-top: var(--space-3xl);
	padding-top: var(--space-2xl);
	border-top: 1px solid var(--color-border);
}

/* Mobile: stack cart table as cards */
@media (max-width: 640px) {
	.cart-table thead {
		display: none;
	}

	.cart-table__row td {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: var(--space-sm) var(--space-md);
		border-bottom: none;
	}

	.cart-table__row td::before {
		content: attr(data-title);
		font-size: var(--font-size-xs);
		font-weight: 600;
		text-transform: uppercase;
		letter-spacing: 0.07em;
		color: var(--color-muted);
		flex: 0 0 40%;
	}

	.cart-table__row td.product-remove,
	.cart-table__row td.product-thumbnail {
		display: none;
	}

	.cart-table__row {
		display: block;
		border: 1px solid var(--color-border);
		border-radius: var(--radius-md);
		margin-bottom: var(--space-md);
		overflow: hidden;
	}
}

/* ==========================================================================
   Phase 4 — My Account
   ========================================================================== */

/* Account two-column layout */
.account-layout {
	display: grid;
	grid-template-columns: 240px 1fr;
	gap: var(--space-xl);
	align-items: start;
	padding: var(--space-2xl) 0;
}

@media (max-width: 768px) {
	.account-layout {
		grid-template-columns: 1fr;
	}
}

/* Account navigation sidebar */
.account-nav__list {
	list-style: none;
	padding: 0;
	margin: 0;
	background: var(--color-light);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	overflow: hidden;
}

.account-nav__item {
	border-bottom: 1px solid var(--color-border);
}

.account-nav__item:last-child {
	border-bottom: none;
}

.account-nav__link {
	display: flex;
	align-items: center;
	gap: var(--space-sm);
	padding: var(--space-sm) var(--space-md);
	color: var(--color-body);
	text-decoration: none;
	font-size: var(--font-size-sm);
	transition: background 0.15s, color 0.15s;
}

.account-nav__link:hover {
	background: rgba(246, 136, 114, 0.08);
	color: var(--color-accent);
}

.account-nav__item.is-active .account-nav__link,
.account-nav__item.woocommerce-MyAccount-navigation-link--is-active .account-nav__link {
	background: var(--color-accent);
	color: var(--color-white);
	font-weight: 600;
	border-left: 3px solid var(--color-accent);
}

.account-nav__icon {
	display: flex;
	flex-shrink: 0;
	opacity: 0.75;
}

.account-nav__item.is-active .account-nav__icon,
.account-nav__item.woocommerce-MyAccount-navigation-link--is-active .account-nav__icon {
	opacity: 1;
}

/* Account dashboard */
.account-dashboard__welcome {
	margin-bottom: var(--space-xl);
	padding: var(--space-lg);
	background: var(--color-light);
	border-radius: var(--radius-md);
	border-left: 4px solid var(--color-accent);
}

.account-dashboard__hello {
	font-size: var(--font-size-base);
	color: var(--color-dark);
	margin-bottom: var(--space-xs);
}

.account-dashboard__intro {
	font-size: var(--font-size-sm);
	color: var(--color-muted);
	margin: 0;
}

.account-dashboard__cards {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--space-md);
}

@media (max-width: 640px) {
	.account-dashboard__cards {
		grid-template-columns: 1fr;
	}
}

.account-card {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: var(--space-xs);
	padding: var(--space-lg);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	text-decoration: none;
	color: var(--color-dark);
	transition: border-color 0.15s, box-shadow 0.15s, transform 0.15s;
}

.account-card:hover {
	border-color: var(--color-accent);
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
	transform: translateY(-2px);
}

.account-card__icon {
	display: flex;
	color: var(--color-accent);
	margin-bottom: var(--space-xs);
}

.account-card__title {
	font-size: var(--font-size-base);
	font-weight: 600;
}

.account-card__desc {
	font-size: var(--font-size-sm);
	color: var(--color-muted);
}

/* Orders table */
.orders-table {
	width: 100%;
	border-collapse: collapse;
	font-size: var(--font-size-sm);
}

.orders-table__head th {
	padding: var(--space-sm) var(--space-md);
	font-size: var(--font-size-xs);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.07em;
	color: var(--color-muted);
	border-bottom: 2px solid var(--color-border);
	text-align: left;
}

.orders-table__row td,
.orders-table__row th {
	padding: var(--space-md);
	border-bottom: 1px solid var(--color-border);
	vertical-align: middle;
}

.orders-table__order-link {
	font-weight: 600;
	color: var(--color-accent);
	text-decoration: none;
}

.orders-table__order-link:hover {
	text-decoration: underline;
}

/* Order status badges */
.order-status {
	display: inline-block;
	padding: 2px var(--space-sm);
	border-radius: 999px;
	font-size: var(--font-size-xs);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.05em;
}

.order-status--processing,
.order-status--on-hold {
	background: #fef3c7;
	color: #92400e;
}

.order-status--completed {
	background: #d1fae5;
	color: #065f46;
}

.order-status--cancelled,
.order-status--refunded,
.order-status--failed {
	background: #fee2e2;
	color: #991b1b;
}

.order-status--pending {
	background: #e0e7ff;
	color: #3730a3;
}

/* Orders pagination */
.orders-table + .wc-pagination {
	margin-top: var(--space-lg);
	display: flex;
	gap: var(--space-sm);
}

/* Account empty state */
.account-empty {
	text-align: center;
	padding: var(--space-3xl) var(--space-xl);
}

.account-empty__text {
	color: var(--color-muted);
	margin-bottom: var(--space-lg);
}

/* Auth two-panel layout */
.auth-layout {
	padding: var(--space-2xl) 0;
	max-width: 540px;
	margin: 0 auto;
}

.auth-layout--two-col {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--space-2xl);
	align-items: start;
}

@media (max-width: 768px) {
	.auth-layout--two-col {
		grid-template-columns: 1fr;
	}
}

.auth-panel {
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	padding: var(--space-xl);
}

.auth-panel__title {
	font-family: var(--font-display);
	font-size: var(--font-size-xl);
	font-weight: 400;
	margin-bottom: var(--space-xl);
	color: var(--color-dark);
}

.auth-form .form-field {
	margin-bottom: var(--space-md);
}

.auth-form .form-field__label {
	display: block;
	font-size: var(--font-size-sm);
	font-weight: 500;
	color: var(--color-dark);
	margin-bottom: var(--space-xs);
}

.auth-form .form-field__input {
	display: block;
	width: 100%;
	padding: var(--space-sm) var(--space-md);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-sm);
	font-size: var(--font-size-sm);
	background: var(--color-white);
	color: var(--color-dark);
	transition: border-color 0.15s, box-shadow 0.15s;
}

.auth-form .form-field__input:focus {
	outline: none;
	border-color: var(--color-accent);
	box-shadow: 0 0 0 3px var(--color-accent-light);
}

.auth-form__footer {
	display: flex;
	flex-direction: column;
	gap: var(--space-sm);
	margin-top: var(--space-lg);
}

.auth-form__remember {
	display: flex;
	align-items: center;
	gap: var(--space-xs);
	font-size: var(--font-size-sm);
	color: var(--color-body);
	cursor: pointer;
}

.auth-form__lost-password {
	margin-top: var(--space-md);
	text-align: center;
	font-size: var(--font-size-sm);
}

.auth-form__lost-password a {
	color: var(--color-accent);
}

.auth-form__note {
	font-size: var(--font-size-sm);
	color: var(--color-muted);
	margin-bottom: var(--space-md);
}

/* Order detail */
.order-detail__header {
	background: var(--color-light);
	border-left: 4px solid var(--color-accent);
	padding: var(--space-md) var(--space-lg);
	border-radius: var(--radius-sm);
	margin-bottom: var(--space-xl);
}

.order-detail__summary {
	font-size: var(--font-size-sm);
	color: var(--color-body);
	margin: 0;
}

.order-detail__section-title {
	font-family: var(--font-display);
	font-size: var(--font-size-lg);
	font-weight: 400;
	margin-bottom: var(--space-md);
}

.order-notes {
	list-style: none;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: var(--space-sm);
}

.order-note {
	background: var(--color-light);
	border-radius: var(--radius-sm);
	padding: var(--space-md);
	border: 1px solid var(--color-border);
}

.order-note__date {
	font-size: var(--font-size-xs);
	color: var(--color-muted);
	margin-bottom: var(--space-xs);
}

.order-note__content p {
	font-size: var(--font-size-sm);
	margin: 0;
}

/* Mobile orders table: stack as cards */
@media (max-width: 640px) {
	.orders-table thead {
		display: none;
	}

	.orders-table__row {
		display: block;
		border: 1px solid var(--color-border);
		border-radius: var(--radius-md);
		margin-bottom: var(--space-md);
		overflow: hidden;
	}

	.orders-table__row td,
	.orders-table__row th {
		display: flex;
		justify-content: space-between;
		align-items: center;
		border-bottom: 1px solid var(--color-border);
		padding: var(--space-sm) var(--space-md);
	}

	.orders-table__row td:last-child,
	.orders-table__row th:last-child {
		border-bottom: none;
	}

	.orders-table__row td::before,
	.orders-table__row th::before {
		content: attr(data-title);
		font-size: var(--font-size-xs);
		font-weight: 600;
		text-transform: uppercase;
		letter-spacing: 0.07em;
		color: var(--color-muted);
		flex: 0 0 40%;
	}
}

/* ==========================================================================
   Phase 5 — Thank You Page
   ========================================================================== */

.thankyou {
	padding: var(--space-2xl) 0;
	max-width: 640px;
	margin: 0 auto;
}

/* Hero / success state */
.thankyou__hero {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	margin-bottom: var(--space-2xl);
}

.thankyou__check {
	width: 88px;
	height: 88px;
	border-radius: 50%;
	background: rgba(246, 136, 114, 0.15);
	color: var(--color-accent);
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: var(--space-lg);
}

.thankyou__title {
	font-family: var(--font-display);
	font-size: var(--font-size-2xl);
	font-weight: 400;
	color: var(--color-dark);
	margin-bottom: var(--space-sm);
}

.thankyou__subtitle {
	font-size: var(--font-size-sm);
	color: var(--color-muted);
	max-width: 420px;
}

/* Order summary card */
.order-summary {
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	overflow: hidden;
	margin-bottom: var(--space-xl);
}

.order-summary__title {
	font-family: var(--font-display);
	font-size: var(--font-size-lg);
	font-weight: 400;
	padding: var(--space-md) var(--space-lg);
	border-bottom: 1px solid var(--color-border);
	margin: 0;
	background: var(--color-light);
}

.order-summary__list {
	list-style: none;
	padding: 0;
	margin: 0;
}

.order-summary__item {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: var(--space-sm) var(--space-lg);
	border-bottom: 1px solid var(--color-border);
	font-size: var(--font-size-sm);
}

.order-summary__item:last-child {
	border-bottom: none;
}

.order-summary__item--total {
	font-size: var(--font-size-base);
	padding: var(--space-md) var(--space-lg);
	background: var(--color-light);
}

.order-summary__item--total .order-summary__value {
	font-size: var(--font-size-lg);
	color: var(--color-dark);
}

.order-summary__label {
	color: var(--color-muted);
}

.order-summary__value {
	color: var(--color-dark);
	font-variant-numeric: tabular-nums;
}

/* CTA buttons row */
.thankyou__actions {
	display: flex;
	gap: var(--space-sm);
	justify-content: center;
	flex-wrap: wrap;
}

/* Failed payment state */
.thankyou__failed {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	padding: var(--space-3xl) var(--space-xl);
}

.thankyou__failed-icon {
	color: var(--color-coral, #e57373);
	margin-bottom: var(--space-lg);
}

.thankyou__failed-title {
	font-family: var(--font-display);
	font-size: var(--font-size-2xl);
	font-weight: 400;
	margin-bottom: var(--space-sm);
}

.thankyou__failed-text {
	font-size: var(--font-size-sm);
	color: var(--color-muted);
	margin-bottom: var(--space-xl);
	max-width: 400px;
}

.thankyou__failed-actions {
	display: flex;
	gap: var(--space-sm);
	flex-wrap: wrap;
	justify-content: center;
}


/* ==========================================================================
   WEIGHT SWATCHES — Illustrated tile style (product page)
   Targets WCVA plugin labels (.wcva_single_textblock / .wcvaswatchlabel)
   ========================================================================== */

/* Flex row container */
.attribute-swatch {
	display: flex !important;
	flex-wrap: wrap;
	gap: 10px;
	align-items: flex-start;
	margin-top: 6px;
}

.attribute-swatch .swatchinput {
	display: inline-flex;
}

/* --- Tile layout --- */
label.wcva_single_textblock {
	display: inline-flex !important;
	flex-direction: column;
	align-items: center;
	justify-content: flex-end;
	width: 76px !important;
	min-height: 96px !important;
	padding: 10px 6px 8px !important;
	background: var(--color-white) !important;
	border: 1.5px solid var(--color-border) !important;
	outline: none !important;
	border-radius: var(--radius-md) !important;
	font-size: 0.7rem !important;
	font-weight: var(--font-weight-bold) !important;
	color: var(--color-dark) !important;
	line-height: 1.3 !important;
	letter-spacing: 0.02em;
	text-align: center;
	gap: 6px;
	box-shadow: none !important;
	cursor: pointer;
	transition: border-color var(--transition-fast), background var(--transition-fast), color var(--transition-fast);
}

label.wcva_single_textblock:hover {
	border-color: var(--color-accent) !important;
}

/* --- Selected / active tile --- */
label.selectedswatch.wcva_single_textblock,
label.selectedswatch.wcva_single_textblock.wcvaround {
	background: var(--color-dark) !important;
	border-color: var(--color-dark) !important;
	color: var(--color-white) !important;
	outline: none !important;
	box-shadow: none !important;
	border-radius: var(--radius-md) !important;
	line-height: 1.3 !important;
	padding: 10px 6px 8px !important;
	font-size: 0.7rem !important;
}

/* --- SVG pouch icon via mask-image --- */
label.wcva_single_textblock::before {
	content: '';
	display: block;
	width: 38px;
	height: 44px;
	flex-shrink: 0;
	background-color: currentColor;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-size: contain;
	mask-size: contain;
	-webkit-mask-position: center;
	mask-position: center;
	opacity: 0.85;
}

/* 50g — tea sachet (square bag + string + tag) */
label.attribute_pa_size_50g::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 60'%3E%3Crect x='21' y='1' width='8' height='5' rx='1.5'/%3E%3Crect x='24' y='6' width='2' height='9'/%3E%3Cellipse cx='25' cy='17' rx='5' ry='2.5'/%3E%3Cpath d='M12,15 Q10,15 10,17 L10,52 Q10,55 13,55 L37,55 Q40,55 40,52 L40,17 Q40,15 38,15 Z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 60'%3E%3Crect x='21' y='1' width='8' height='5' rx='1.5'/%3E%3Crect x='24' y='6' width='2' height='9'/%3E%3Cellipse cx='25' cy='17' rx='5' ry='2.5'/%3E%3Cpath d='M12,15 Q10,15 10,17 L10,52 Q10,55 13,55 L37,55 Q40,55 40,52 L40,17 Q40,15 38,15 Z'/%3E%3C/svg%3E");
}

/* 100g — metal tin/canister (dome lid + cylindrical body) */
label.attribute_pa_size_100g::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 60'%3E%3Cellipse cx='25' cy='14' rx='19' ry='5'/%3E%3Crect x='4' y='11' width='42' height='8' rx='2'/%3E%3Crect x='6' y='19' width='38' height='35' rx='2'/%3E%3Cellipse cx='25' cy='54' rx='19' ry='4'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 60'%3E%3Cellipse cx='25' cy='14' rx='19' ry='5'/%3E%3Crect x='4' y='11' width='42' height='8' rx='2'/%3E%3Crect x='6' y='19' width='38' height='35' rx='2'/%3E%3Cellipse cx='25' cy='54' rx='19' ry='4'/%3E%3C/svg%3E");
}

/* 200g — stand-up kraft pouch (sealed top + zipper + gusseted body) */
label.attribute_pa_size_200g::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 60'%3E%3Crect x='13' y='4' width='24' height='6' rx='1'/%3E%3Crect x='14' y='11' width='22' height='2.5' rx='1.5'/%3E%3Cpath d='M15,13 Q12,13 11,16 L8,52 Q7,57 12,58 L38,58 Q43,57 42,52 L39,16 Q38,13 35,13 Z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 60'%3E%3Crect x='13' y='4' width='24' height='6' rx='1'/%3E%3Crect x='14' y='11' width='22' height='2.5' rx='1.5'/%3E%3Cpath d='M15,13 Q12,13 11,16 L8,52 Q7,57 12,58 L38,58 Q43,57 42,52 L39,16 Q38,13 35,13 Z'/%3E%3C/svg%3E");
}

/* 250g — metal tin (coffee canister) */
label.attribute_pa_size_250g::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 60'%3E%3Cellipse cx='25' cy='14' rx='19' ry='5'/%3E%3Crect x='4' y='11' width='42' height='8' rx='2'/%3E%3Crect x='6' y='19' width='38' height='35' rx='2'/%3E%3Cellipse cx='25' cy='54' rx='19' ry='4'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 60'%3E%3Cellipse cx='25' cy='14' rx='19' ry='5'/%3E%3Crect x='4' y='11' width='42' height='8' rx='2'/%3E%3Crect x='6' y='19' width='38' height='35' rx='2'/%3E%3Cellipse cx='25' cy='54' rx='19' ry='4'/%3E%3C/svg%3E");
}

/* 500g — large kraft pouch */
label.attribute_pa_size_500g::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 60'%3E%3Crect x='13' y='4' width='24' height='6' rx='1'/%3E%3Crect x='14' y='11' width='22' height='2.5' rx='1.5'/%3E%3Cpath d='M15,13 Q12,13 11,16 L8,52 Q7,57 12,58 L38,58 Q43,57 42,52 L39,16 Q38,13 35,13 Z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 60'%3E%3Crect x='13' y='4' width='24' height='6' rx='1'/%3E%3Crect x='14' y='11' width='22' height='2.5' rx='1.5'/%3E%3Cpath d='M15,13 Q12,13 11,16 L8,52 Q7,57 12,58 L38,58 Q43,57 42,52 L39,16 Q38,13 35,13 Z'/%3E%3C/svg%3E");
}

/* 1kg / 1Kg — extra large kraft bag */
label.attribute_pa_size_1kg::before,
label.attribute_pa_size_1Kg::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 60'%3E%3Crect x='10' y='3' width='30' height='7' rx='1'/%3E%3Crect x='11' y='11' width='28' height='3' rx='1.5'/%3E%3Cpath d='M12,14 Q8,14 7,17 L4,52 Q3,58 9,59 L41,59 Q47,58 46,52 L43,17 Q42,14 38,14 Z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 60'%3E%3Crect x='10' y='3' width='30' height='7' rx='1'/%3E%3Crect x='11' y='11' width='28' height='3' rx='1.5'/%3E%3Cpath d='M12,14 Q8,14 7,17 L4,52 Q3,58 9,59 L41,59 Q47,58 46,52 L43,17 Q42,14 38,14 Z'/%3E%3C/svg%3E");
}

/* WCVA plugin renders a duplicate text label below each swatch via .belowtext.
   The label text is already shown inside the swatch tile, so hide the extra. */
.attribute-swatch .belowtext {
	display: none !important;
}

/* ==========================================================================
   Product Card Swatches — tile + pouch icon (matches single product style)
   ========================================================================== */

/* Override pill layout → tile layout */
.product-card__swatches .swatch {
	flex-direction: column;
	align-items: center;
	justify-content: flex-end;
	width: 48px;
	min-height: 58px;
	padding: 4px 3px 5px;
	border-radius: var(--radius-md);
	font-size: 0.6rem;
	gap: 0;
	position: relative;
}

/* Pouch icon pseudo-element */
.product-card__swatches .swatch::before {
	content: '';
	display: block;
	width: 22px;
	height: 28px;
	background-color: currentColor;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-size: contain;
	mask-size: contain;
	-webkit-mask-position: center;
	mask-position: center;
	margin-bottom: 3px;
	flex-shrink: 0;
}

/* Selected state: icon turns white (inherits via currentColor) */
.product-card__swatches .swatch--selected {
	border-color: var(--color-dark);
	background: var(--color-dark);
	color: var(--color-white);
}

/* --- Per-weight SVG masks --- */

/* 50g — tea sachet */
.product-card__swatches .swatch--size-50g::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 60'%3E%3Crect x='21' y='1' width='8' height='5' rx='1.5'/%3E%3Crect x='24' y='6' width='2' height='9'/%3E%3Cellipse cx='25' cy='17' rx='5' ry='2.5'/%3E%3Cpath d='M12,15 Q10,15 10,17 L10,52 Q10,55 13,55 L37,55 Q40,55 40,52 L40,17 Q40,15 38,15 Z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 60'%3E%3Crect x='21' y='1' width='8' height='5' rx='1.5'/%3E%3Crect x='24' y='6' width='2' height='9'/%3E%3Cellipse cx='25' cy='17' rx='5' ry='2.5'/%3E%3Cpath d='M12,15 Q10,15 10,17 L10,52 Q10,55 13,55 L37,55 Q40,55 40,52 L40,17 Q40,15 38,15 Z'/%3E%3C/svg%3E");
}

/* 100g / 250g — metal tin */
.product-card__swatches .swatch--size-100g::before,
.product-card__swatches .swatch--size-250g::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 60'%3E%3Cellipse cx='25' cy='14' rx='19' ry='5'/%3E%3Crect x='4' y='11' width='42' height='8' rx='2'/%3E%3Crect x='6' y='19' width='38' height='35' rx='2'/%3E%3Cellipse cx='25' cy='54' rx='19' ry='4'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 60'%3E%3Cellipse cx='25' cy='14' rx='19' ry='5'/%3E%3Crect x='4' y='11' width='42' height='8' rx='2'/%3E%3Crect x='6' y='19' width='38' height='35' rx='2'/%3E%3Cellipse cx='25' cy='54' rx='19' ry='4'/%3E%3C/svg%3E");
}

/* 200g / 500g — stand-up kraft pouch */
.product-card__swatches .swatch--size-200g::before,
.product-card__swatches .swatch--size-500g::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 60'%3E%3Crect x='13' y='4' width='24' height='6' rx='1'/%3E%3Crect x='14' y='11' width='22' height='2.5' rx='1.5'/%3E%3Cpath d='M15,13 Q12,13 11,16 L8,52 Q7,57 12,58 L38,58 Q43,57 42,52 L39,16 Q38,13 35,13 Z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 60'%3E%3Crect x='13' y='4' width='24' height='6' rx='1'/%3E%3Crect x='14' y='11' width='22' height='2.5' rx='1.5'/%3E%3Cpath d='M15,13 Q12,13 11,16 L8,52 Q7,57 12,58 L38,58 Q43,57 42,52 L39,16 Q38,13 35,13 Z'/%3E%3C/svg%3E");
}

/* 1kg — extra large kraft bag */
.product-card__swatches .swatch--size-1kg::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 60'%3E%3Crect x='10' y='3' width='30' height='7' rx='1'/%3E%3Crect x='11' y='11' width='28' height='3' rx='1.5'/%3E%3Cpath d='M12,14 Q8,14 7,17 L4,52 Q3,58 9,59 L41,59 Q47,58 46,52 L43,17 Q42,14 38,14 Z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 60'%3E%3Crect x='10' y='3' width='30' height='7' rx='1'/%3E%3Crect x='11' y='11' width='28' height='3' rx='1.5'/%3E%3Cpath d='M12,14 Q8,14 7,17 L4,52 Q3,58 9,59 L41,59 Q47,58 46,52 L43,17 Q42,14 38,14 Z'/%3E%3C/svg%3E");
}

/* ==========================================================================
   Related products slider
   ========================================================================== */
.related-products__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: var(--space-xl);
}
.related-products__title {
	font-family: var(--font-serif);
	font-size: 1.5rem;
	margin: 0;
}
.related-slider__nav {
	display: flex;
	gap: var(--space-sm);
}
.related-slider__btn {
	width: 36px;
	height: 36px;
	border-radius: 50%;
	border: 1px solid var(--color-border);
	background: #fff;
	font-size: 1.4rem;
	line-height: 1;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background var(--transition-fast), border-color var(--transition-fast);
}
.related-slider__btn:hover {
	background: var(--color-accent);
	border-color: var(--color-accent);
	color: #fff;
}
.related-slider__btn:disabled {
	opacity: 0.35;
	cursor: default;
	pointer-events: none;
}
.related-slider__viewport {
	overflow: hidden;
}
.related-slider__viewport .products {
	display: flex;
	flex-wrap: nowrap;
	gap: var(--space-md);
	margin: 0;
	padding: 0;
	list-style: none;
	transition: transform 0.35s ease;
}
.related-slider__viewport .products > li.product {
	flex: 0 0 calc(25% - var(--space-md) * 3 / 4);
	min-width: 0;
}
@media (max-width: 1199px) {
	.related-slider__viewport .products > li.product {
		flex: 0 0 calc(33.333% - var(--space-md) * 2 / 3);
	}
}
@media (max-width: 899px) {
	.related-slider__viewport .products > li.product {
		flex: 0 0 calc(50% - var(--space-md) / 2);
	}
}
@media (max-width: 599px) {
	.related-slider__viewport .products > li.product {
		flex: 0 0 100%;
	}
}

/* ==========================================================================
   Wishlist heart button (YITH) — gallery bottom-left
   ========================================================================== */
.woocommerce-product-gallery {
	position: relative;
}
.product-gallery__wishlist {
	position: absolute;
	bottom: var(--space-md);
	left: var(--space-md);
	z-index: 10;
}
.product-gallery__wishlist .add_to_wishlist,
.product-gallery__wishlist .yith-wcwl-add-to-wishlist a {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 0.8rem;
	color: var(--color-muted);
	text-decoration: none;
	background: rgba(255,255,255,0.88);
	border-radius: 20px;
	padding: 5px 10px 5px 8px;
	border: 1px solid var(--color-border);
	transition: color var(--transition-fast), border-color var(--transition-fast);
}
.product-gallery__wishlist .add_to_wishlist:hover,
.product-gallery__wishlist .yith-wcwl-add-to-wishlist a:hover {
	color: #e03030;
	border-color: #e03030;
}
.product-gallery__wishlist .add_to_wishlist::before {
	content: '♡';
	font-size: 1rem;
	line-height: 1;
}
.product-gallery__wishlist .yith-wcwl-wishlistexistsbrowse a:not(.happytea-remove-wishlist)::before,
.product-gallery__wishlist .yith-wcwl-wishlistaddedbrowse a:not(.happytea-remove-wishlist)::before {
	content: '♥';
	color: #e03030;
}
/* Hide YITH's built-in SVG/icon — we use CSS ::before hearts instead */
.product-gallery__wishlist .yith-wcwl-add-to-wishlist .yith-wcwl-icon,
.product-gallery__wishlist .yith-wcwl-add-to-wishlist svg.yith-wcwl-icon-svg,
.product-gallery__wishlist .add_to_wishlist svg.yith-wcwl-icon-svg,
.product-gallery__wishlist .yith-wcwl-icon-svg__wrapper {
	display: none !important;
}

/* Remove duplicate YITH wishlist that appears in the summary column / after ATC button */
.entry-summary .yith-wcwl-add-to-wishlist,
.woocommerce-variation-add-to-cart .yith-wcwl-add-to-wishlist {
	display: none !important;
}

/* Remove from wishlist link */
.product-gallery__wishlist .happytea-remove-wishlist {
	display: block;
	font-size: 0.72rem;
	color: var(--color-muted);
	text-decoration: none;
	margin-top: 4px;
	padding: 4px 10px;
	background: rgba(255,255,255,0.88);
	border: 1px solid var(--color-border);
	border-radius: 20px;
	transition: color var(--transition-fast), border-color var(--transition-fast);
	text-align: center;
}
.product-gallery__wishlist .happytea-remove-wishlist:hover {
	color: #e03030;
	border-color: #e03030;
}

/* ==========================================================================
   Gallery custom arrows — styled like reference (Palais des Thés)
   Tall semi-transparent panels pinned to left/right edges, hidden until hover
   ========================================================================== */
.gallery-arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 20;
	width: 44px;
	height: 100px;
	border-radius: 5px;
	background: rgba(255, 255, 255, 0.3);
	border: none;
	cursor: pointer;
	font-size: 1.6rem;
	line-height: 1;
	color: #555;
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	transition: opacity 0.2s ease, background 0.2s ease;
}
.woocommerce-product-gallery:hover .gallery-arrow {
	opacity: 1;
}
.gallery-arrow:hover {
	background: rgba(255, 255, 255, 0.6);
}
.gallery-arrow:disabled {
	opacity: 0 !important;
	pointer-events: none;
}
.gallery-arrow--prev { left: 0; }
.gallery-arrow--next { right: 0; }

/* Base price visibility toggled by JS (initBasePriceVisibility) via found_variation / reset_data */

/* ==========================================================================
   Description tabs — appears BEFORE related products (see hook order)
   ========================================================================== */

/* ==========================================================================
   Reviews — two-column layout (summary left / list right)
   ========================================================================== */

/* Outer wrapper */
.happytea-reviews {
	padding: var(--space-xl) 0 0;
}

/* Two-column grid */
.happytea-reviews__body {
	display: grid;
	grid-template-columns: 260px 1fr;
	gap: var(--space-2xl);
	align-items: start;
	margin-bottom: var(--space-2xl);
}

/* ── Left: summary ─────────────────────────────────────── */
.happytea-reviews__summary {
	position: sticky;
	top: var(--space-xl);
	padding: var(--space-xl);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	text-align: center;
}

.happytea-reviews__average {
	display: flex;
	align-items: baseline;
	justify-content: center;
	gap: 2px;
	margin-bottom: var(--space-xs);
}

.happytea-reviews__score {
	font-size: 3rem;
	font-weight: 700;
	color: var(--color-primary);
	line-height: 1;
}

.happytea-reviews__out-of {
	font-size: 1.1rem;
	color: var(--color-muted);
	font-weight: 600;
}

.happytea-reviews__stars .star-rating {
	margin: 0 auto var(--space-xs);
	font-size: 1.1rem;
	color: var(--color-primary);
}

.happytea-reviews__count {
	font-size: var(--font-size-sm);
	color: var(--color-muted);
	margin: 0 0 var(--space-lg);
}

/* Distribution bars */
.happytea-reviews__bars {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.happytea-reviews__bar-row {
	display: grid;
	grid-template-columns: 30px 1fr 24px;
	align-items: center;
	gap: 8px;
}

.happytea-reviews__bar-label {
	font-size: 0.72rem;
	color: var(--color-muted);
	text-align: right;
	white-space: nowrap;
}

.happytea-reviews__bar-track {
	display: block;
	height: 6px;
	background: var(--color-border);
	border-radius: 3px;
	overflow: hidden;
}

.happytea-reviews__bar-fill {
	display: block;
	height: 100%;
	background: var(--color-accent);
	border-radius: 3px;
	transition: width 0.4s ease;
}

.happytea-reviews__bar-count {
	font-size: 0.72rem;
	color: var(--color-muted);
}

/* ── Right: review list ────────────────────────────────── */
.happytea-reviews__list {
	list-style: none;
	margin: 0;
	padding: 0;
	counter-reset: none;
}

.happytea-reviews__list li {
	list-style: none;
}

/* Individual review item */
.happytea-review {
	padding: var(--space-lg) 0;
	border-top: 1px solid var(--color-border);
}

.happytea-review:last-child {
	border-bottom: 1px solid var(--color-border);
}

.happytea-review__header {
	display: flex;
	align-items: center;
	gap: var(--space-sm);
	margin-bottom: var(--space-sm);
}

.happytea-review__header .star-rating {
	font-size: 0.9rem;
	color: var(--color-primary);
}

.happytea-review__score-text {
	font-size: var(--font-size-sm);
	font-weight: 700;
	color: var(--color-dark);
}

.happytea-review__verified {
	margin-left: auto;
	font-size: 0.72rem;
	color: var(--color-muted);
}

.happytea-review__text {
	font-size: var(--font-size-base);
	color: var(--color-body);
	line-height: 1.6;
	margin-bottom: var(--space-xs);
}

.happytea-review__text p {
	margin: 0;
}

.happytea-review__meta {
	font-size: var(--font-size-sm);
	color: var(--color-muted);
	margin: 0;
}

.happytea-review__author {
	color: var(--color-dark);
}

.happytea-review__sep {
	margin: 0 4px;
}

/* ── Review form ────────────────────────────────────────── */
.happytea-reviews__form-wrap {
	border-top: 2px solid var(--color-border);
	padding-top: var(--space-xl);
	max-width: 640px;
}

.happytea-reviews__form-wrap .comment-reply-title {
	font-size: var(--font-size-lg);
	font-weight: 700;
	display: block;
	margin-bottom: var(--space-lg);
}

.happytea-reviews__form-wrap .comment-form p {
	margin-bottom: var(--space-md);
}

.happytea-reviews__form-wrap label {
	display: block;
	font-size: var(--font-size-sm);
	font-weight: 600;
	margin-bottom: 4px;
	color: var(--color-dark);
}

.happytea-reviews__form-wrap input[type="text"],
.happytea-reviews__form-wrap input[type="email"],
.happytea-reviews__form-wrap textarea,
.happytea-reviews__form-wrap select {
	width: 100%;
	padding: 10px 14px;
	border: 1px solid var(--color-border);
	border-radius: var(--radius-sm);
	font-size: var(--font-size-base);
	font-family: inherit;
	color: var(--color-dark);
	background: #fff;
}

.happytea-reviews__form-wrap textarea {
	resize: vertical;
}

.happytea-reviews__form-wrap input[type="submit"] {
	background: var(--color-accent);
	color: #fff;
	border: none;
	padding: 12px 32px;
	border-radius: var(--radius-sm);
	font-size: var(--font-size-base);
	font-weight: 700;
	cursor: pointer;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	transition: background var(--transition-fast);
}

.happytea-reviews__form-wrap input[type="submit"]:hover {
	background: var(--color-accent-dark, var(--color-dark));
}

.happytea-reviews__form-wrap .comment-form-rating select {
	width: auto;
}

/* ── Responsive ─────────────────────────────────────────── */
@media (max-width: 768px) {
	.happytea-reviews__body {
		grid-template-columns: 1fr;
	}

	.happytea-reviews__summary {
		position: static;
	}
}

/* ── Standalone reviews section (section mode) ──────────── */
.happytea-reviews-section {
	border-top: 1px solid var(--color-border);
	padding: var(--space-2xl) 0;
	margin-top: 0;
}

/* ── Order Tracking page ─────────────────────────────────── */
.woocommerce-form-track-order {
	max-width: 540px;
	margin: var(--space-3xl) auto;
	background: #fff;
	border: 1px solid var(--color-border);
	border-radius: var(--radius-lg);
	padding: var(--space-2xl);
	box-shadow: var(--shadow-sm);
}

/* Intro paragraph */
.woocommerce-form-track-order > p:first-of-type {
	font-size: var(--font-size-sm);
	color: var(--color-muted);
	line-height: var(--line-height-loose);
	margin-bottom: var(--space-xl);
	text-align: center;
}

/* Stack the two field rows vertically and clear WC floats */
.woocommerce-form-track-order .form-row-first,
.woocommerce-form-track-order .form-row-last {
	float: none;
	width: 100%;
	display: flex;
	flex-direction: column;
	gap: var(--space-xs);
	margin-bottom: var(--space-md);
	padding: 0;
}

.woocommerce-form-track-order .form-row {
	clear: both;
	margin-bottom: var(--space-md);
}

/* Labels */
.woocommerce-form-track-order label {
	font-size: var(--font-size-sm);
	font-weight: 600;
	color: var(--color-dark);
	letter-spacing: 0.03em;
	text-transform: uppercase;
	display: block;
	margin-bottom: 4px;
}

/* Inputs */
.woocommerce-form-track-order .input-text {
	width: 100%;
	padding: 0.65rem 0.9rem;
	border: 1px solid var(--color-border);
	border-radius: var(--radius-sm);
	font-size: var(--font-size-base);
	color: var(--color-dark);
	background: var(--color-light);
	transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
	box-sizing: border-box;
}

.woocommerce-form-track-order .input-text:focus {
	outline: none;
	border-color: var(--color-accent);
	box-shadow: 0 0 0 3px rgba(180, 120, 60, 0.12);
}

/* Submit button */
.woocommerce-form-track-order button[type="submit"],
.woocommerce-form-track-order .button {
	width: 100%;
	padding: 0.8rem 1.5rem;
	background: var(--color-accent);
	color: #fff !important;
	border: none;
	border-radius: var(--radius-sm);
	font-size: var(--font-size-base);
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	cursor: pointer;
	transition: background var(--transition-fast), transform var(--transition-fast);
	margin-top: var(--space-xs);
}

.woocommerce-form-track-order button[type="submit"]:hover,
.woocommerce-form-track-order .button:hover {
	background: var(--color-accent-dark, var(--color-accent));
	transform: translateY(-1px);
}

/* Order result table (shown after submission) */
.woocommerce-form-track-order .shop_table {
	width: 100%;
	border-collapse: collapse;
	margin-top: var(--space-xl);
}
.woocommerce-form-track-order .shop_table th,
.woocommerce-form-track-order .shop_table td {
	padding: var(--space-sm) var(--space-md);
	border-bottom: 1px solid var(--color-border);
	font-size: var(--font-size-sm);
	text-align: left;
}
.woocommerce-form-track-order .shop_table th {
	font-weight: 600;
	color: var(--color-dark);
	text-transform: uppercase;
	letter-spacing: 0.04em;
}

@media (max-width: 600px) {
	.woocommerce-form-track-order {
		padding: var(--space-lg);
		margin: var(--space-xl) var(--space-md);
	}
}