/**
 * Barcode Women's Wear — Custom Theme Styles
 * ============================================
 * For elements that theme.json cannot handle.
 * Brand tokens are defined in theme.json and referenced via CSS custom properties.
 */

/* ─── CSS Custom Properties (from theme.json) ─── */
:root {
	--barcode-cream: var(--wp--preset--color--brand-cream, #f7f2e3);
	--barcode-taupe: var(--wp--preset--color--brand-taupe, #b9af9a);
	--barcode-brown: var(--wp--preset--color--brand-brown, #8b6148);
	--barcode-espresso: var(--wp--preset--color--brand-espresso, #3d2b1f);
	--barcode-gold: var(--wp--preset--color--brand-gold, #c8a04a);
	--barcode-blush: var(--wp--preset--color--brand-blush, #d9bfb0);
	--transition-fast: 0.2s ease;
	--transition-smooth: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	--shadow-soft: 0 2px 8px rgba(61, 43, 31, 0.08);
	--shadow-hover: 0 8px 24px rgba(61, 43, 31, 0.12);
	--radius-card: 12px;
	--radius-button: 4px;
}

/* ─── HEADER ─── */
/* A4 sticky-header fix: WordPress wraps the header template part in a
   <header class="wp-block-template-part"> that is only as tall as the header
   itself, so position:sticky on .site-header had zero room to travel and just
   scrolled away. display:contents drops that wrapper box from layout, making
   .site-header a direct child of the full-height .wp-site-blocks so sticky works
   — and, unlike making the wrapper itself sticky, it adds NO stacking context,
   so the .has-modal-open z-index logic on .site-header is preserved. */
header.wp-block-template-part {
	display: contents;
}

.site-header {
	position: sticky;
	top: 0;
	z-index: 100;
	backdrop-filter: blur(8px);
	border-bottom: 1px solid var(--barcode-taupe);
}

/* 3-column header: left-nav | center-logo | right-nav */
.header-row {
	display: grid !important;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	gap: 1rem;
}

/* Left nav group */
.header-nav-left {
	justify-self: start;
}

/* Center logo — bigger */
.header-logo-center {
	justify-self: center;
}
.header-logo-center img,
.site-header .wp-block-site-logo img {
	max-height: 160px;
	width: auto;
	object-fit: contain;
}

/* Right nav + actions group */
.header-nav-right {
	justify-self: end;
}

.main-navigation .wp-block-navigation-item a {
	position: relative;
	padding: 0.5rem 0;
	font-family: var(--wp--preset--font-family--headline) !important;
	text-transform: none !important;
	letter-spacing: 0.02em !important;
	font-size: 0.95rem !important;
	font-weight: 400 !important;
	color: var(--barcode-espresso, #3d2b1f);
}

.main-navigation .wp-block-navigation-item a::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 50%;
	width: 0;
	height: 1.5px;
	background: var(--barcode-brown);
	transition: width var(--transition-smooth), left var(--transition-smooth);
}

.main-navigation .wp-block-navigation-item a:hover::after,
.main-navigation .wp-block-navigation-item.current-menu-item a::after {
	width: 100%;
	left: 0;
}

/* Hide the default WooCommerce customer account icon (we use our own) */
.site-header .wc-block-customer-account,
.site-header .wp-block-woocommerce-customer-account,
.header-row .wc-block-customer-account__link {
	display: none !important;
}

/* Account Icon — outline style */
.header-account-link {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	border: 1.5px solid var(--barcode-espresso, #3d2b1f);
	background: transparent;
	color: var(--barcode-espresso, #3d2b1f);
	text-decoration: none;
	transition: all var(--transition-fast);
}
.header-account-link:hover {
	background: var(--barcode-espresso, #3d2b1f);
	color: var(--barcode-cream, #f7f2e3);
}
.header-account-link:hover svg {
	stroke: var(--barcode-cream, #f7f2e3);
}
.header-account-link svg {
	width: 16px;
	height: 16px;
	stroke: var(--barcode-espresso, #3d2b1f);
}

/* ─── BRAND STORY SPACING FIX ─── */
.brand-story-section {
	margin-top: 0 !important;
}

/* ─── HERO SECTION ─── */
.hero-section {
	overflow: hidden;
}

.hero-columns {
	min-height: 500px;
}

.hero-badge {
	color: var(--barcode-brown);
	font-weight: 500;
	margin-bottom: 0.5rem !important;
}

.hero-headline {
	letter-spacing: 0.02em;
	margin-bottom: 1rem !important;
}

.hero-body {
	color: #6b5e56;
	line-height: 1.8;
	margin-bottom: 2rem !important;
}

.hero-image img {
	border-radius: 200px 200px 200px 200px;
	object-fit: cover;
	object-position: top center;
	max-height: 600px;
	width: 100%;
	box-shadow: var(--shadow-hover);
}

.hero-cta .wp-block-button__link {
	transition: all var(--transition-smooth);
}

.hero-cta .wp-block-button__link:hover {
	transform: translateY(-2px);
	box-shadow: var(--shadow-hover);
}

/* ─── PRODUCT CARDS ─── */
.barcode-product-card {
	position: relative;
	transition: transform var(--transition-smooth);
}

.barcode-product-card:hover {
	transform: translateY(-4px);
}

.product-card-image img {
	border-radius: var(--radius-card);
	aspect-ratio: 3 / 4;
	object-fit: cover;
	width: 100%;
	transition: box-shadow var(--transition-smooth);
}

.barcode-product-card:hover .product-card-image img {
	box-shadow: var(--shadow-hover);
}

/* Wishlist heart (positioned on product card image) */
.barcode-product-card .product-card-image {
	position: relative;
}

.wishlist-heart {
	position: absolute;
	top: 12px;
	right: 12px;
	background: rgba(255, 255, 255, 0.9);
	border: none;
	border-radius: 50%;
	width: 36px;
	height: 36px;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	font-size: 18px;
	z-index: 5;
	transition: all var(--transition-fast);
	color: var(--barcode-espresso);
}

.wishlist-heart:hover {
	background: white;
	transform: scale(1.1);
}

.wishlist-heart.wishlisted {
	color: var(--barcode-gold);
}

.product-card-title a {
	color: var(--barcode-espresso) !important;
	text-decoration: none !important;
	font-family: var(--wp--preset--font-family--body);
}

.product-card-price {
	color: var(--barcode-brown) !important;
	font-weight: 600;
}

/* ─── SHOP PAGE ─── */
.shop-page-title {
	font-family: var(--wp--preset--font-family--headline);
	margin-bottom: 0.25rem !important;
}

.shop-breadcrumbs {
	font-size: var(--wp--preset--font-size--small);
	color: #6b5e56;
}

.shop-breadcrumbs a {
	color: #6b5e56;
}

.shop-columns {
	gap: 2rem !important;
}

.shop-toolbar {
	margin-bottom: 1.5rem;
	padding-bottom: 1rem;
	border-bottom: 1px solid var(--barcode-taupe);
}

/* ─── FILTER SIDEBAR ─── */
.filter-section {
	padding-right: 1.5rem;
	border-right: 1px solid var(--barcode-taupe);
}

.filter-header {
	padding-bottom: 0.75rem;
	border-bottom: 1px solid var(--barcode-espresso);
	margin-bottom: 1rem !important;
}

.filter-group {
	padding-bottom: 1rem;
	border-bottom: 1px solid #e8e4dc;
}

.filter-group-title {
	cursor: pointer;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.filter-group-title::after {
	content: '−';
	font-size: 1.2em;
	font-weight: 300;
	color: var(--barcode-taupe);
}

.filter-group.collapsed .filter-group-title::after {
	content: '+';
}

.filter-categories li {
	list-style: none;
	padding: 0.25rem 0;
	font-size: var(--wp--preset--font-size--small);
}

.filter-categories li a {
	color: var(--barcode-espresso);
	text-decoration: none;
}

.filter-categories li a:hover {
	color: var(--barcode-brown);
}

/* ─── Category Expand / Collapse ─── */
.filter-categories .wc-block-product-categories-list--depth-0 > .wc-block-product-categories-list-item {
	position: relative;
}

/* Parent category link + toggle row */
.filter-categories .wc-block-product-categories-list-item > a {
	display: inline;
}

/* Toggle arrow button */
.barcode-cat-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: none;
	border: none;
	cursor: pointer;
	padding: 2px 6px;
	margin-left: 4px;
	color: var(--barcode-taupe);
	transition: transform var(--transition-fast), color var(--transition-fast);
	vertical-align: middle;
}
.barcode-cat-toggle:hover {
	color: var(--barcode-brown);
}
.barcode-cat-toggle.is-open svg {
	transform: rotate(180deg);
}

/* Subcategory list indent */
.filter-categories .wc-block-product-categories-list--depth-1 {
	padding-left: 1rem;
	margin-top: 0.25rem;
	border-left: 1px solid #e8e4dc;
}

.filter-categories .wc-block-product-categories-list--depth-1 > li {
	padding: 0.15rem 0;
	font-size: 0.82rem;
}
.filter-categories .wc-block-product-categories-list--depth-1 > li > a {
	color: #6b5e56;
}
.filter-categories .wc-block-product-categories-list--depth-1 > li > a:hover {
	color: var(--barcode-brown);
}

/* ─── Collapsed filter groups hide inner content ─── */
.filter-group.collapsed > *:not(.filter-group-title) {
	display: none !important;
}

/* ─── Mobile: Filter sidebar toggle ─── */
.barcode-filter-toggle {
	display: none;
}

@media (max-width: 781px) {
	.barcode-filter-toggle {
		display: flex;
		align-items: center;
		gap: 0.5rem;
		width: 100%;
		padding: 0.75rem 1rem;
		background: var(--barcode-cream, #f7f2e3);
		border: 1px solid var(--barcode-taupe);
		border-radius: var(--radius-button);
		font-size: var(--wp--preset--font-size--small);
		font-weight: 600;
		text-transform: uppercase;
		letter-spacing: 0.05em;
		color: var(--barcode-espresso);
		cursor: pointer;
		margin-bottom: 1rem;
		transition: all var(--transition-fast);
	}
	.barcode-filter-toggle:hover,
	.barcode-filter-toggle.is-active {
		background: var(--barcode-espresso);
		color: var(--barcode-cream);
		border-color: var(--barcode-espresso);
	}
	.barcode-filter-toggle.is-active svg {
		stroke: var(--barcode-cream);
	}

	.filter-section--mobile-hidden {
		display: none !important;
	}

	/* Remove right border on mobile sidebar */
	.filter-section {
		border-right: none;
		padding-right: 0;
	}
}

/* Color swatches */
.barcode-color-swatch {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	cursor: pointer;
	padding: 4px 0;
}

.barcode-color-swatch__circle {
	width: 20px;
	height: 20px;
	border-radius: 50%;
	border: 1px solid var(--barcode-taupe);
	transition: box-shadow var(--transition-fast);
}

.barcode-color-swatch__circle:hover,
.barcode-color-swatch.active .barcode-color-swatch__circle {
	box-shadow: 0 0 0 2px var(--barcode-brown);
}

/* ─── PRODUCT DETAIL PAGE ─── */
.product-detail-layout {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 3rem;
}

.product-gallery-vertical .woocommerce-product-gallery {
	display: flex;
	flex-direction: row-reverse;
	gap: 12px;
}

.product-gallery-vertical .flex-control-thumbs {
	display: flex;
	flex-direction: column;
	gap: 8px;
	width: 80px;
	flex-shrink: 0;
}

.product-gallery-vertical .flex-control-thumbs li {
	width: 80px !important;
	margin: 0 !important;
}

.product-gallery-vertical .flex-control-thumbs li img {
	border-radius: 8px;
	cursor: pointer;
	opacity: 0.6;
	transition: opacity var(--transition-fast);
}

.product-gallery-vertical .flex-control-thumbs li img:hover,
.product-gallery-vertical .flex-control-thumbs li img.flex-active {
	opacity: 1;
}

.product-gallery-vertical .woocommerce-product-gallery__wrapper {
	flex: 1;
}

.product-gallery-vertical .woocommerce-product-gallery__wrapper img {
	border-radius: var(--radius-card);
}

.product-gallery-vertical .woocommerce-product-gallery__trigger {
	position: absolute;
	bottom: 16px;
	right: 16px;
	z-index: 10;
	background: rgba(255, 255, 255, 0.9);
	border-radius: 50%;
	width: 40px;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
}

/* Product info panel */
.product-title {
	font-family: var(--wp--preset--font-family--headline) !important;
	margin-bottom: 0.5rem !important;
}

.product-price-display {
	color: var(--barcode-brown) !important;
	font-size: var(--wp--preset--font-size--large) !important;
	font-weight: 600;
	margin-bottom: 1rem !important;
}

.product-description {
	color: #6b5e56;
	line-height: 1.8;
	margin-bottom: 1.5rem !important;
}

/* Size selector pills */
.variations .value select,
.product-add-to-cart .size-selector button {
	padding: 0.5rem 1rem;
	border: 1px solid var(--barcode-taupe);
	border-radius: var(--radius-button);
	background: white;
	cursor: pointer;
	font-size: var(--wp--preset--font-size--small);
	transition: all var(--transition-fast);
}

.product-add-to-cart .size-selector button:hover,
.product-add-to-cart .size-selector button.active {
	background: var(--barcode-espresso);
	color: var(--barcode-cream);
	border-color: var(--barcode-espresso);
}

/* Quantity stepper */
.quantity .qty {
	width: 50px;
	text-align: center;
	border: 1px solid var(--barcode-taupe);
	border-radius: var(--radius-button);
	padding: 0.5rem;
}

/* Add to Bag button */
.single_add_to_cart_button {
	background: var(--barcode-brown) !important;
	color: var(--barcode-cream) !important;
	width: 100%;
	padding: 1rem !important;
	font-size: var(--wp--preset--font-size--small) !important;
	font-weight: 600 !important;
	letter-spacing: 0.15em !important;
	text-transform: uppercase !important;
	border-radius: var(--radius-button) !important;
	border: none !important;
	cursor: pointer;
	transition: all var(--transition-smooth) !important;
}

.single_add_to_cart_button:hover {
	background: var(--barcode-espresso) !important;
	transform: translateY(-2px);
	box-shadow: var(--shadow-hover);
}

/* Add to Wishlist button (product page) */
.barcode-wishlist-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	width: 100%;
	padding: 1rem;
	background: var(--barcode-cream);
	color: var(--barcode-espresso);
	border: 1px solid var(--barcode-taupe);
	border-radius: var(--radius-button);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	cursor: pointer;
	transition: all var(--transition-fast);
	margin-top: 0.5rem;
}

.barcode-wishlist-btn:hover {
	border-color: var(--barcode-espresso);
	background: #f0ebe0;
}

/* WhatsApp product inquiry */
.barcode-whatsapp-product {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	color: var(--barcode-brown);
	font-size: var(--wp--preset--font-size--small);
	text-decoration: none;
	padding: 0.5rem 0;
	margin-top: 0.75rem;
	transition: color var(--transition-fast);
}

.barcode-whatsapp-product:hover {
	color: var(--barcode-espresso);
}

/* Product tabs */
.product-info-tabs .woocommerce-tabs ul.tabs {
	display: flex;
	gap: 2rem;
	border-bottom: 1px solid var(--barcode-taupe);
	padding: 0;
	margin: 0 0 1.5rem 0;
	list-style: none;
}

.product-info-tabs .woocommerce-tabs ul.tabs li a {
	color: #6b5e56;
	text-decoration: none;
	padding: 0.75rem 0;
	display: inline-block;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	border-bottom: 2px solid transparent;
	transition: all var(--transition-fast);
}

.product-info-tabs .woocommerce-tabs ul.tabs li.active a {
	color: var(--barcode-espresso);
	border-bottom-color: var(--barcode-brown);
}

/* ─── RELATED PRODUCTS / CAROUSEL ─── */
.related-heading {
	font-family: var(--wp--preset--font-family--headline);
	margin-bottom: 1.5rem !important;
}

.barcode-carousel-container {
	position: relative;
}

.barcode-carousel-container .products {
	display: flex;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	gap: 20px;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
	padding-bottom: 1rem;
}

.barcode-carousel-container .products::-webkit-scrollbar {
	display: none;
}

.barcode-carousel-container .products li {
	flex: 0 0 calc(25% - 15px);
	scroll-snap-align: start;
	list-style: none;
}

/* Carousel arrows */
.carousel-arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	background: rgba(255, 255, 255, 0.95);
	border: 1px solid var(--barcode-taupe);
	border-radius: 50%;
	width: 40px;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	font-size: 1.25rem;
	color: var(--barcode-espresso);
	z-index: 10;
	transition: all var(--transition-fast);
	box-shadow: var(--shadow-soft);
}

.carousel-arrow:hover {
	background: var(--barcode-espresso);
	color: var(--barcode-cream);
	border-color: var(--barcode-espresso);
}

.carousel-arrow--prev { left: -20px; }
.carousel-arrow--next { right: -20px; }

/* ─── BENEFITS STRIP ─── */
.benefits-strip {
	margin-top: 2rem;
}

.benefits-columns {
	gap: 1rem !important;
}

.benefit-item {
	text-align: center;
}

.benefit-icon {
	font-size: 1.5rem;
	margin-bottom: 0.25rem !important;
}

.benefit-title {
	font-family: var(--wp--preset--font-family--body) !important;
	font-weight: 600 !important;
	margin-bottom: 0.125rem !important;
}

.benefit-detail {
	color: #6b5e56;
}

/* ─── FOOTER ─── */
.site-footer a {
	color: var(--barcode-cream) !important;
	text-decoration: none;
}

.site-footer a:hover {
	color: var(--barcode-gold) !important;
}

.footer-logo img {
	max-width: 160px;
	filter: brightness(1.2);
}

.footer-links {
	list-style: none;
	padding: 0;
}

.footer-links li {
	padding: 0.25rem 0;
}

.footer-divider {
	opacity: 0.2;
	margin: 2rem 0 1rem 0 !important;
	width: 100% !important;
	border-color: var(--wp--preset--color--brand-taupe, #b9af9a) !important;
}

/* ─── FOOTER 4-COLUMN LAYOUT ─── */
.footer-columns {
	gap: 2.5rem !important;
}
.footer-columns .wp-block-column {
	margin-bottom: 0 !important;
}
.footer-columns .wp-block-column h4 {
	margin-bottom: 1.2rem;
}
.footer-logo {
	margin-bottom: 0 !important;
}
.footer-logo img {
	max-width: 180px !important;
}

/* ─── MOBILE-FIRST RESPONSIVE ─── */
@media (max-width: 781px) {

	/* ── HEADER: collapse to hamburger | logo | cart on mobile ── */
	.header-row {
		grid-template-columns: 1fr auto 1fr !important;
		gap: 0 !important;
	}
	/* Left nav becomes hamburger overlay on mobile */
	.header-nav-left {
		order: -1;
		justify-self: start;
	}
	/* Logo stays centered */
	.header-logo-center,
	.header-row .wp-block-site-logo {
		order: 0;
		justify-self: center;
		display: flex !important;
		justify-content: center !important;
		align-items: center !important;
		width: 100% !important;
	}
	.header-logo-center img,
	.site-header .wp-block-site-logo img {
		max-height: 110px !important;
	}
	/* Right nav: hide text links, show only account + cart */
	.header-nav-right {
		order: 1;
		justify-self: end;
	}
	.header-nav-right .nav-right {
		display: none !important;
	}

	/* Footer: wrap columns into grid on mobile */
	.footer-columns {
		flex-wrap: wrap !important;
	}
	/* Logo column — full width, centered, constrained */
	.footer-columns .wp-block-column:first-child {
		flex-basis: 100% !important;
		text-align: center;
		margin-bottom: 1.5rem !important;
	}
	.footer-logo {
		text-align: center;
	}
	.footer-logo img {
		margin: 0 auto;
		max-width: 120px !important;
		width: 120px !important;
	}
	/* Tagline text centered */
	.footer-columns .wp-block-column:first-child p {
		text-align: center;
	}
	/* Quick Links & Contact Us — side by side */
	.footer-columns .wp-block-column:nth-child(2),
	.footer-columns .wp-block-column:nth-child(3) {
		flex-basis: 48% !important;
		margin-bottom: 1.5rem !important;
	}
	/* Our Stores — full width */
	.footer-columns .wp-block-column:nth-child(4) {
		flex-basis: 100% !important;
		margin-bottom: 1.5rem !important;
	}

	/* ── BENEFITS STRIP ── */
	.benefits-columns {
		flex-wrap: wrap !important;
	}
	.benefit-item {
		flex-basis: 50% !important;
		max-width: 50% !important;
		margin-bottom: 1rem;
	}
	/* Contact cards stack */
	.contact-grid {
		grid-template-columns: repeat(2, 1fr) !important;
		gap: 1rem !important;
	}
	/* Store cards stack */
	.store-card {
		margin-bottom: 1.5rem;
	}
	/* Hero text sizing */
	.hero-text-col h1 {
		font-size: 2rem !important;
	}
	/* Checkout button full width */
	.wc-block-checkout .wc-block-components-checkout-place-order-button {
		width: 100% !important;
	}
	/* Product detail page mobile improvements */
	.product-detail-layout {
		gap: 1.5rem !important;
	}
	.product-detail-info {
		padding: 0 1rem !important; /* Elegant touch margin for page edges */
	}
	.barcode-whatsapp-product {
		width: 100% !important;
		box-sizing: border-box !important;
		text-align: center !important;
		justify-content: center !important;
		margin-top: 1rem !important;
	}
	.cart button.single_add_to_cart_button {
		width: 100% !important;
		margin-bottom: 0.5rem !important;
	}
}

@media (max-width: 480px) {
	/* Benefits single column on small screens */
	.benefit-item {
		flex-basis: 100% !important;
		max-width: 100% !important;
	}
	/* Contact cards single column */
	.contact-grid {
		grid-template-columns: 1fr !important;
	}
	/* Header logo slightly smaller on very small phones */
	.header-logo-center img,
	.site-header .wp-block-site-logo img {
		max-height: 90px !important;
	}
	/* WhatsApp floating button slightly smaller on phones */
	.barcode-whatsapp-float {
		bottom: 16px !important;
		right: 16px !important;
		width: 48px !important;
		height: 48px !important;
	}
	.barcode-whatsapp-float svg {
		width: 24px !important;
		height: 24px !important;
	}
	/* WooCommerce blocks container padding on phone */
	.wc-block-cart, .wc-block-checkout {
		padding: 1rem 0.5rem !important;
	}
}

/* ─── WHATSAPP FLOATING BUTTON ─── */
.barcode-whatsapp-float {
	position: fixed;
	bottom: 24px;
	right: 24px;
	width: 56px;
	height: 56px;
	background: #25D366;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
	z-index: 9999;
	transition: transform var(--transition-fast);
	text-decoration: none;
}

.barcode-whatsapp-float:hover {
	transform: scale(1.1);
}

/* ─── PAGINATION ─── */
.shop-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	font-size: var(--wp--preset--font-size--small);
	color: var(--barcode-espresso);
	text-decoration: none;
	transition: all var(--transition-fast);
}

.shop-pagination .page-numbers.current {
	background: var(--barcode-brown);
	color: var(--barcode-cream);
}

.shop-pagination .page-numbers:hover:not(.current) {
	background: #f0ebe0;
}

/* ─── BREADCRUMBS ─── */
.woocommerce-breadcrumb {
	font-size: var(--wp--preset--font-size--small);
	color: #6b5e56;
}

.woocommerce-breadcrumb a {
	color: #6b5e56;
	text-decoration: none;
}

.woocommerce-breadcrumb a:hover {
	color: var(--barcode-brown);
}

/* ─── RESPONSIVE ─── */
@media (max-width: 1024px) {
	.hero-columns {
		flex-direction: column-reverse !important;
	}
	.hero-text-col,
	.hero-image-col {
		flex-basis: 100% !important;
		max-width: 100% !important;
	}
	.hero-image img {
		max-height: 400px;
		border-radius: 24px;
		object-position: top center;
	}
	.shop-columns {
		flex-direction: column !important;
	}
	.shop-sidebar {
		flex-basis: 100% !important;
		max-width: 100% !important;
		order: 2;
	}
	.shop-grid {
		flex-basis: 100% !important;
		max-width: 100% !important;
		order: 1;
	}
	.filter-section {
		border-right: none;
		padding-right: 0;
		border-top: 1px solid var(--barcode-taupe);
		padding-top: 1.5rem;
	}
	.product-detail-layout {
		grid-template-columns: 1fr !important;
		gap: 2rem;
	}
}

@media (max-width: 768px) {
	.barcode-carousel-container .products li {
		flex: 0 0 calc(50% - 10px);
	}
	.shop-grid .wp-block-woocommerce-product-template,
	.barcode-product-grid .wp-block-woocommerce-product-template {
		display: grid !important;
		grid-template-columns: repeat(2, 1fr) !important;
		gap: 14px !important;
		align-items: start !important;
	}
	.shop-grid .wp-block-woocommerce-product-template > li,
	.barcode-product-grid .wp-block-woocommerce-product-template > li {
		width: auto !important;
		max-width: none !important;
		min-width: 0 !important;
		margin: 0 !important;
	}
	.header-social-icons {
		display: none !important;
	}
	/* Hide account icon on mobile too - keep header clean */
	.header-account-link {
		display: none !important;
	}
}

/* ─── MOBILE NAVIGATION OVERLAY ─── */
/* Full-screen overlay panel from right with absolute seamless styling */
.wp-block-navigation__responsive-container.is-menu-open {
	background: var(--barcode-cream, #f7f2e3) !important;
	background-color: var(--barcode-cream, #f7f2e3) !important;
}

/* Strip default Gutenberg dialog and close wrapper styles completely to be perfectly transparent */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-close,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	background: transparent !important;
	background-color: transparent !important;
	box-shadow: none !important;
	border: none !important;
	padding: 0 !important;
	margin: 0 !important;
	width: 100% !important;
	height: auto !important;
}

.wp-block-navigation__responsive-container.is-menu-open {
	position: fixed !important;
	top: 0 !important;
	right: 0 !important;
	left: auto !important;
	bottom: 0 !important;
	width: 85vw !important;
	max-width: 360px !important;
	height: 100vh !important;
	z-index: 99999 !important;
	padding: 2rem 1.5rem !important;
	box-shadow: -8px 0 24px rgba(61, 43, 31, 0.15) !important;
	animation: slideInRight 0.3s ease-out !important;
	overflow-y: auto !important;
	display: flex !important;
	flex-direction: column !important;
	align-items: flex-start !important;
	justify-content: flex-start !important;
}

@keyframes slideInRight {
	from { transform: translateX(100%); }
	to { transform: translateX(0); }
}

/* Overlay backdrop - moved to root HTML element to prevent dimming background of drawer */
.wp-block-navigation__responsive-container.is-menu-open::before {
	content: none !important;
	display: none !important;
}

html.has-modal-open::after {
	content: '';
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(61, 43, 31, 0.35) !important;
	z-index: 9998 !important; /* Positioned directly behind the drawer (99999) but above rest of page */
	width: 100vw !important;
	height: 100vh !important;
	pointer-events: none !important;
	animation: fadeInBackdrop 0.25s ease-out !important;
}

@keyframes fadeInBackdrop {
	from { opacity: 0; }
	to { opacity: 1; }
}

/* Close button styling */
.wp-block-navigation__responsive-container-close {
	position: absolute !important;
	top: 1rem !important;
	right: 1rem !important;
	background: none !important;
	border: none !important;
	color: var(--barcode-espresso, #3d2b1f) !important;
	cursor: pointer;
	z-index: 10;
}
.wp-block-navigation__responsive-container-close svg {
	width: 24px !important;
	height: 24px !important;
}

/* Navigation items in overlay */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	display: flex !important;
	flex-direction: column !important;
	align-items: flex-start !important;
	gap: 0 !important;
	width: 100% !important;
	padding-top: 1.5rem !important; /* Slightly reduced top padding to fit branding */
}

/* Beautiful brand logo emblem header inside mobile menu drawer */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container::before {
	content: '';
	display: block;
	width: 100%;
	height: 100px;
	margin-bottom: 1.5rem;
	background-image: url('https://barcode-shop.online/wp-content/uploads/2026/05/barcode-logo-espresso-transparent.png');
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	border-bottom: 1px solid rgba(60, 40, 30, 0.08);
	padding-bottom: 1.5rem;
}

/* Luxury brand footer inside mobile menu drawer to fill empty space elegantly */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container::after {
	content: "BARCODE WOMEN'S WEAR\AEvery Piece Matters\A\A📍 GENENA MALL, CAIRO\A📍 SHARK EL MAHATA, BENI MAZAR\A\A📞 01097926261";
	white-space: pre-wrap;
	font-family: var(--wp--preset--font-family--body), sans-serif;
	font-size: 0.72rem;
	color: rgba(61, 43, 31, 0.55);
	line-height: 1.8;
	text-align: center;
	display: block;
	width: 100%;
	margin-top: 3.5rem;
	border-top: 1px solid rgba(60, 40, 30, 0.08);
	padding-top: 2rem;
	letter-spacing: 0.04em;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
	width: 100% !important;
	border-bottom: 1px solid rgba(60, 40, 30, 0.08); /* Delicate fashion house border */
	position: relative !important;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item a {
	display: block !important;
	padding: 1.05rem 0 !important;
	font-family: var(--wp--preset--font-family--headline), Didot, serif !important;
	font-size: 1.1rem !important;
	font-weight: 400 !important;
	letter-spacing: 0.03em !important;
	text-transform: uppercase !important; /* Premium fashion look */
	color: var(--barcode-espresso, #3d2b1f) !important;
	text-decoration: none !important;
	transition: opacity 0.2s ease !important;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item a:hover {
	color: var(--barcode-brown, #8b6148) !important;
	opacity: 0.75;
}

/* Submenu items in overlay - Collapsible accordion */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
	display: none !important; /* Hidden by default */
	position: static !important;
	background: transparent !important;
	box-shadow: none !important;
	padding-left: 1.25rem !important;
	width: 100% !important;
	margin: 0 !important;
	box-sizing: border-box !important;
	border-left: 1.5px solid rgba(60, 40, 30, 0.12) !important; /* Elegant visual left connector line */
	margin-bottom: 0.6rem !important;
	margin-top: 0.25rem !important;
}

/* Display submenu container only when parent toggle button has aria-expanded="true" OR when parent classes are active */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu__toggle[aria-expanded="true"] ~ .wp-block-navigation__submenu-container,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu.is-active > .wp-block-navigation__submenu-container,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu.is-expanded > .wp-block-navigation__submenu-container {
	display: block !important;
	animation: submenuSlideIn 0.3s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

@keyframes submenuSlideIn {
	from {
		opacity: 0;
		transform: translateY(-4px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

/* Style child links differently (clean typographic contrast) */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item {
	border-bottom: none !important; /* Remove nested borders */
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item a {
	font-size: 0.95rem !important;
	padding: 0.55rem 0 !important;
	text-transform: capitalize !important; /* Capitalize sub-items like dresses/tops */
	font-family: var(--wp--preset--font-family--headline), sans-serif !important;
	letter-spacing: 0.01em !important;
	opacity: 0.85;
}

/* Rotate arrow beautifully when expanded */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu__toggle {
	position: absolute;
	right: 0;
	top: 1.05rem; /* Exactly aligned with the line padding */
	background: transparent !important;
	border: none !important;
	padding: 0.5rem !important;
	display: flex !important;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	z-index: 10;
	color: var(--barcode-espresso, #3d2b1f) !important;
	transition: transform 0.25s cubic-bezier(0.25, 1, 0.5, 1) !important;
}

/* Force visibility and boutique sizing on the svg path for toggle arrow icon */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu__toggle svg {
	width: 14px !important;
	height: 14px !important;
	min-width: 14px !important;
	min-height: 14px !important;
	flex-shrink: 0 !important;
	display: block !important;
	color: var(--barcode-espresso, #3d2b1f) !important;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu__toggle svg path,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu__toggle svg polygon,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu__toggle svg polyline {
	stroke: var(--barcode-espresso, #3d2b1f) !important;
	stroke-width: 1.5px !important;
	fill: var(--barcode-espresso, #3d2b1f) !important;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu__toggle[aria-expanded="true"] {
	transform: rotate(180deg) !important;
}

/* Hamburger button styling */
.wp-block-navigation__responsive-container-open {
	color: var(--barcode-espresso, #3d2b1f) !important;
	background: none !important;
	border: none !important;
}
.wp-block-navigation__responsive-container-open svg {
	width: 28px !important;
	height: 28px !important;
}

@media (max-width: 480px) {
	.shop-grid .wp-block-woocommerce-product-template,
	.barcode-product-grid .wp-block-woocommerce-product-template {
		display: grid !important;
		grid-template-columns: repeat(2, 1fr) !important;
		gap: 10px !important;
		align-items: start !important;
	}
	.shop-grid .wp-block-woocommerce-product-template > li,
	.barcode-product-grid .wp-block-woocommerce-product-template > li {
		width: auto !important;
		max-width: none !important;
		min-width: 0 !important;
		margin: 0 !important;
	}
	.barcode-carousel-container .products li {
		flex: 0 0 calc(50% - 10px) !important;
	}
}

/* Prevent site header elements and background from overlapping the mobile menu drawer */
.has-modal-open .site-header {
	background: transparent !important;
	background-color: transparent !important;
	border-bottom: none !important;
	box-shadow: none !important;
	backdrop-filter: none !important;
	z-index: 999999 !important; /* Elevate the site header stacking context above the backdrop! */
}

.has-modal-open .site-header .header-logo-center,
.has-modal-open .site-header .header-nav-right,
.has-modal-open .site-header .header-nav-left > *:not(.main-navigation) {
	opacity: 0 !important;
	visibility: hidden !important;
	pointer-events: none !important;
	transition: opacity 0.25s ease-out !important;
}

/* ============================================================
   SPRINT 2 — WooCommerce Customization + Interactivity
   ============================================================ */

/* ─── Wishlist Heart Icon (Product Cards) ─── */
.barcode-wishlist-heart {
	position: absolute;
	top: 12px;
	right: 12px;
	z-index: 10;
	background: rgba(255, 255, 255, 0.85);
	border: none;
	border-radius: 50%;
	width: 36px;
	height: 36px;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	font-size: 18px;
	color: var(--barcode-espresso);
	transition: all var(--transition-fast);
	backdrop-filter: blur(4px);
	box-shadow: 0 1px 4px rgba(61, 43, 31, 0.1);
}
.barcode-wishlist-heart:hover {
	background: rgba(255, 255, 255, 1);
	transform: scale(1.1);
	color: var(--barcode-brown);
}
.barcode-wishlist-heart.wishlisted {
	color: var(--barcode-gold);
	background: rgba(255, 255, 255, 0.95);
}
.barcode-wishlist-heart.wishlisted .wishlist-icon {
	animation: heartPop 0.3s ease;
}
@keyframes heartPop {
	0% { transform: scale(1); }
	50% { transform: scale(1.3); }
	100% { transform: scale(1); }
}

/* Product card needs relative positioning for heart */
.barcode-product-card,
.woocommerce ul.products li.product {
	position: relative;
}

/* ─── ADD TO WISHLIST Button (Product Page) ─── */
.barcode-wishlist-product-btn {
	display: block;
	width: 100%;
	padding: 0.875rem 2rem;
	margin-top: 0.75rem;
	background: transparent;
	border: 1.5px solid var(--barcode-espresso);
	border-radius: var(--radius-button);
	color: var(--barcode-espresso);
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	cursor: pointer;
	transition: all var(--transition-smooth);
}
.barcode-wishlist-product-btn:hover {
	background: var(--barcode-espresso);
	color: var(--barcode-cream);
}
.barcode-wishlist-product-btn.wishlisted {
	background: var(--barcode-espresso);
	color: var(--barcode-gold);
	border-color: var(--barcode-espresso);
}

/* ─── ADD TO BAG Button Override ─── */
.woocommerce div.product form.cart .single_add_to_cart_button,
.single_add_to_cart_button {
	display: block !important;
	width: 100%;
	padding: 0.875rem 2rem;
	background: var(--barcode-brown) !important;
	color: var(--barcode-cream) !important;
	border: none;
	border-radius: var(--radius-button);
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	cursor: pointer;
	transition: background var(--transition-smooth);
}
.single_add_to_cart_button:hover {
	background: var(--barcode-espresso) !important;
}

/* ─── WhatsApp Product Inquiry Link ─── */
.barcode-whatsapp-product {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-top: 1rem;
	padding: 0.5rem 0;
	color: var(--barcode-brown);
	font-size: 0.875rem;
	font-weight: 500;
	text-decoration: none;
	border-bottom: 1px solid transparent;
	transition: all var(--transition-fast);
}
.barcode-whatsapp-product:hover {
	color: var(--barcode-espresso);
	border-bottom-color: var(--barcode-espresso);
}

/* ─── WooCommerce Breadcrumbs (• separator) ─── */
.woocommerce-breadcrumb {
	font-family: var(--wp--preset--font-family--body);
	font-size: 0.8125rem;
	color: var(--barcode-brown);
	letter-spacing: 0.02em;
}
.woocommerce-breadcrumb a {
	color: var(--barcode-taupe);
	text-decoration: none;
	transition: color var(--transition-fast);
}
.woocommerce-breadcrumb a:hover {
	color: var(--barcode-espresso);
}

/* ─── Shop Page Title ─── */
.shop-page-title,
.woocommerce-products-header__title {
	font-family: var(--wp--preset--font-family--headline) !important;
	font-size: var(--wp--preset--font-size--xx-large) !important;
	font-weight: 700;
	color: var(--barcode-espresso);
	margin-bottom: 0.25rem;
}

/* ─── Filter Sidebar ─── */
.shop-sidebar .filter-section {
	border-right: 1px solid var(--barcode-taupe);
	padding-right: 1.5rem;
}
.shop-sidebar .filter-header h3 {
	font-family: var(--wp--preset--font-family--headline);
	font-size: 1rem;
	font-weight: 400;
	color: var(--barcode-espresso);
	text-transform: none;
	letter-spacing: 0.02em;
}
.shop-sidebar .filter-group {
	border-top: 1px solid rgba(185, 175, 154, 0.3);
	padding-top: 1rem;
}
.shop-sidebar .filter-group-title {
	font-family: var(--wp--preset--font-family--headline) !important;
	font-weight: 400 !important;
	text-transform: none !important;
	letter-spacing: 0.02em !important;
	color: var(--barcode-espresso);
	margin-bottom: 0.75rem;
}

/* Category filter list */
.filter-categories ul {
	list-style: none;
	padding: 0;
	margin: 0;
}
.filter-categories ul li a {
	display: block;
	padding: 0.375rem 0;
	color: var(--barcode-espresso);
	font-size: 0.875rem;
	text-decoration: none;
	transition: color var(--transition-fast);
}
.filter-categories ul li a:hover {
	color: var(--barcode-brown);
}
.filter-categories ul li.current-cat a {
	font-weight: 600;
	color: var(--barcode-brown);
}

/* ─── Color Swatch Circles ─── */
.barcode-color-swatch {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	cursor: pointer;
	padding: 4px 0;
}
.barcode-color-swatch__circle {
	width: 22px;
	height: 22px;
	border-radius: 50%;
	border: 1.5px solid var(--barcode-taupe);
	transition: border-color var(--transition-fast), transform var(--transition-fast);
}
.barcode-color-swatch__circle:hover {
	transform: scale(1.15);
}
.barcode-color-swatch.active .barcode-color-swatch__circle {
	border-color: var(--barcode-espresso);
	border-width: 2.5px;
}
/* Color mappings — all product attribute swatches */
.barcode-color-swatch--beige .barcode-color-swatch__circle { background: #d4b896; }
.barcode-color-swatch--white .barcode-color-swatch__circle { background: #ffffff; border: 1px solid #ddd; }
.barcode-color-swatch--black .barcode-color-swatch__circle { background: #1a1a1a; }
.barcode-color-swatch--brown .barcode-color-swatch__circle { background: #8b6148; }
.barcode-color-swatch--dark-brown .barcode-color-swatch__circle { background: #4a2c17; }
.barcode-color-swatch--red-brown .barcode-color-swatch__circle { background: #8b3a2a; }
.barcode-color-swatch--olive .barcode-color-swatch__circle { background: #6b7c4e; }
.barcode-color-swatch--gray .barcode-color-swatch__circle { background: #9e9e9e; }
.barcode-color-swatch--charcoal .barcode-color-swatch__circle { background: #4a4a4a; }
.barcode-color-swatch--cream .barcode-color-swatch__circle { background: #f5f0e1; border: 1px solid #ddd; }
.barcode-color-swatch--teal .barcode-color-swatch__circle { background: #5f9ea0; }
.barcode-color-swatch--light-blue .barcode-color-swatch__circle { background: #a8c8e8; }
.barcode-color-swatch--dark-green .barcode-color-swatch__circle { background: #2d5a27; }
.barcode-color-swatch--blue .barcode-color-swatch__circle { background: #4a78a8; }
.barcode-color-swatch--denim-blue .barcode-color-swatch__circle { background: #4a6fa5; }
.barcode-color-swatch--burgundy .barcode-color-swatch__circle { background: #722f37; }
.barcode-color-swatch--red .barcode-color-swatch__circle { background: #c0392b; }
.barcode-color-swatch--gold .barcode-color-swatch__circle { background: #c9a94e; }
.barcode-color-swatch--camel .barcode-color-swatch__circle { background: #c19a5b; }
.barcode-color-swatch--floral .barcode-color-swatch__circle { background: linear-gradient(135deg, #e8a0bf 0%, #a8d8a0 50%, #f0d060 100%); }
.barcode-color-swatch--orange .barcode-color-swatch__circle { background: #e67e22; }
.barcode-color-swatch--coffee .barcode-color-swatch__circle { background: #6f4e37; }
.barcode-color-swatch--navy .barcode-color-swatch__circle { background: #1b2a4a; }
.barcode-color-swatch--pink .barcode-color-swatch__circle { background: #e8a0bf; }

/* ─── Size Selector Pills ─── */
.barcode-size-pills {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
}
.barcode-size-pill {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	padding: 8px 14px;
	border: 1.5px solid var(--barcode-taupe);
	border-radius: var(--radius-button);
	background: transparent;
	color: var(--barcode-espresso);
	font-family: var(--wp--preset--font-family--body);
	font-size: 0.8125rem;
	font-weight: 500;
	cursor: pointer;
	transition: all var(--transition-fast);
}
.barcode-size-pill:hover {
	border-color: var(--barcode-espresso);
}
.barcode-size-pill.selected,
.barcode-size-pill.active {
	background: var(--barcode-espresso);
	color: var(--barcode-cream);
	border-color: var(--barcode-espresso);
}

/* ─── Quantity Stepper ─── */
.woocommerce div.product form.cart div.quantity {
	display: inline-flex;
	align-items: center;
	border: 1.5px solid var(--barcode-taupe);
	border-radius: var(--radius-button);
	overflow: hidden;
}
.woocommerce div.product form.cart div.quantity input.qty {
	width: 48px;
	text-align: center;
	border: none;
	font-family: var(--wp--preset--font-family--body);
	font-size: 0.875rem;
	font-weight: 500;
	color: var(--barcode-espresso);
	background: transparent;
	-moz-appearance: textfield;
}
.woocommerce div.product form.cart div.quantity input.qty::-webkit-outer-spin-button,
.woocommerce div.product form.cart div.quantity input.qty::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

/* ─── Product Detail — Vertical Thumbnail Gallery ─── */
.woocommerce div.product div.images {
	display: flex;
	flex-direction: row-reverse;
	gap: 12px;
}
.woocommerce div.product div.images .flex-control-thumbs {
	display: flex;
	flex-direction: column;
	gap: 8px;
	width: 80px;
	flex-shrink: 0;
}
.woocommerce div.product div.images .flex-control-thumbs li {
	width: 80px !important;
	margin: 0;
	border-radius: 4px;
	overflow: hidden;
	border: 1.5px solid transparent;
	transition: border-color var(--transition-fast);
}
.woocommerce div.product div.images .flex-control-thumbs li img.flex-active {
	border-color: var(--barcode-brown);
}
.woocommerce div.product div.images .woocommerce-product-gallery__wrapper {
	flex: 1;
}
.woocommerce div.product div.images .woocommerce-product-gallery__trigger {
	position: absolute;
	bottom: 12px;
	right: 12px;
	z-index: 10;
	background: rgba(255, 255, 255, 0.85);
	border-radius: 50%;
	width: 36px;
	height: 36px;
	display: flex;
	align-items: center;
	justify-content: center;
	backdrop-filter: blur(4px);
}

/* ─── Product Info Strip (3-column tabs) ─── */
.woocommerce-tabs {
	margin-top: 2rem !important;
}
.woocommerce-tabs ul.tabs {
	display: flex !important;
	gap: 0;
	list-style: none !important;
	padding: 0 !important;
	margin: 0 !important;
	border-bottom: 1px solid var(--barcode-taupe) !important;
}
.woocommerce-tabs ul.tabs li {
	flex: 1;
	margin: 0 !important;
	padding: 0 !important;
	border: none !important;
	border-radius: 0 !important;
	background: none !important;
}
.woocommerce-tabs ul.tabs li a {
	display: block;
	padding: 1rem;
	text-align: center;
	font-family: var(--wp--preset--font-family--body);
	font-size: 0.8125rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	color: var(--barcode-taupe);
	text-decoration: none;
	border-bottom: 2px solid transparent;
	transition: all var(--transition-fast);
}
.woocommerce-tabs ul.tabs li a:hover {
	color: var(--barcode-brown);
}
.woocommerce-tabs ul.tabs li.active a {
	color: var(--barcode-espresso);
	border-bottom-color: var(--barcode-espresso);
}
.woocommerce-tabs .panel {
	padding: 1.5rem 0;
	font-size: 0.875rem;
	line-height: 1.7;
	color: var(--barcode-espresso);
}

/* ─── Pagination (Brown circle active state) ─── */
.shop-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	font-size: 0.875rem;
	color: var(--barcode-espresso);
	text-decoration: none;
	transition: all var(--transition-fast);
}
.shop-pagination .page-numbers:hover {
	background: rgba(139, 97, 72, 0.1);
}
.shop-pagination .page-numbers.current {
	background: var(--barcode-brown);
	color: var(--barcode-cream);
}

/* ─── Shop Toolbar ─── */
.shop-toolbar {
	margin-bottom: 1.5rem;
	padding-bottom: 1rem;
	border-bottom: 1px solid rgba(185, 175, 154, 0.3);
}
.shop-toolbar .woocommerce-result-count {
	font-size: 0.8125rem;
	color: var(--barcode-taupe);
	margin: 0;
}
.shop-toolbar .woocommerce-ordering select {
	font-family: var(--wp--preset--font-family--body);
	font-size: 0.8125rem;
	color: var(--barcode-espresso);
	border: 1px solid var(--barcode-taupe);
	border-radius: var(--radius-button);
	padding: 6px 28px 6px 10px;
	background: transparent;
	cursor: pointer;
}

/* ─── Mobile: Filter Sidebar ─── */
@media (max-width: 768px) {
	.shop-columns {
		flex-direction: column !important;
	}
	.shop-sidebar {
		flex-basis: 100% !important;
		margin-bottom: 1.5rem;
	}
	.shop-sidebar .filter-section {
		border-right: none;
		border-bottom: 1px solid var(--barcode-taupe);
		padding-right: 0;
		padding-bottom: 1.5rem;
	}
	.shop-grid {
		flex-basis: 100% !important;
	}
	/* Vertical gallery → stacked on mobile */
	.woocommerce div.product div.images {
		flex-direction: column-reverse;
	}
	.woocommerce div.product div.images .flex-control-thumbs {
		flex-direction: row;
		width: 100%;
		overflow-x: auto;
	}
	.woocommerce div.product div.images .flex-control-thumbs li {
		width: 60px !important;
		flex-shrink: 0;
	}
}


/* ─── Sprint 3: Size Guide Link ─── */
.barcode-size-guide-link {
	display: inline-block;
	font-size: 0.85rem;
	color: var(--barcode-brown);
	text-decoration: underline;
	text-underline-offset: 3px;
	letter-spacing: 0.05em;
	margin-bottom: 0.5rem;
	cursor: pointer;
	transition: color 0.2s ease;
}
.barcode-size-guide-link:hover {
	color: var(--barcode-espresso);
}

/* ─── Size Guide Modal ─── */
.barcode-size-guide-modal {
	border: none;
	border-radius: 12px;
	padding: 0;
	max-width: 520px;
	width: 90vw;
	box-shadow: 0 24px 64px rgba(0, 0, 0, 0.25);
	background: var(--barcode-cream, #faf7f4);
}
.barcode-size-guide-modal::backdrop {
	background: rgba(61, 43, 31, 0.5);
	backdrop-filter: blur(4px);
}
.size-guide-inner {
	padding: 2.5rem;
	position: relative;
}
.size-guide-inner h2 {
	font-family: var(--font-headline, 'Playfair Display', serif);
	font-size: 1.6rem;
	color: var(--barcode-espresso);
	margin: 0 0 0.5rem;
}
.size-guide-close {
	position: absolute;
	top: 1rem;
	right: 1.2rem;
	background: none;
	border: none;
	font-size: 1.8rem;
	cursor: pointer;
	color: var(--barcode-espresso);
	line-height: 1;
	padding: 0.25rem;
	transition: opacity 0.2s;
}
.size-guide-close:hover {
	opacity: 0.6;
}
.size-guide-table {
	width: 100%;
	border-collapse: collapse;
	margin-top: 1rem;
}
.size-guide-table th,
.size-guide-table td {
	padding: 0.75rem 1rem;
	text-align: center;
	border-bottom: 1px solid rgba(185, 175, 154, 0.3);
	font-size: 0.9rem;
}
.size-guide-table th {
	background: rgba(139, 97, 72, 0.08);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--barcode-espresso);
}
.size-guide-table tbody tr:hover {
	background: rgba(139, 97, 72, 0.04);
}

/* ─── Sprint 3: WooCommerce Variation Form Styling ─── */
.woocommerce div.product form.variations_form .variations {
	margin-bottom: 1.5rem;
}
.woocommerce div.product form.variations_form .variations td.label {
	font-family: var(--font-body, Helvetica, sans-serif);
	font-size: 0.85rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--barcode-espresso);
	padding: 0.5rem 1rem 0.5rem 0;
	vertical-align: middle;
}
.woocommerce div.product form.variations_form .variations td.value select {
	border: 1.5px solid var(--barcode-taupe, #b9af9a);
	border-radius: 6px;
	padding: 0.6rem 1rem;
	font-size: 0.9rem;
	background: var(--barcode-cream, #faf7f4);
	color: var(--barcode-espresso);
	outline: none;
	transition: border-color 0.2s;
	width: 100%;
	max-width: 220px;
}
.woocommerce div.product form.variations_form .variations td.value select:focus {
	border-color: var(--barcode-brown);
}
.woocommerce div.product form.variations_form .reset_variations {
	font-size: 0.8rem;
	color: var(--barcode-brown);
	text-decoration: underline;
	margin-left: 0.5rem;
}
.woocommerce div.product form.variations_form .woocommerce-variation-price {
	margin-bottom: 1rem;
}

/* ─── Sprint 3: Cart Page Brand Styling ─── */
.woocommerce-cart .woocommerce table.shop_table {
	border: 1px solid rgba(185, 175, 154, 0.3);
	border-radius: 8px;
	overflow: hidden;
}
.woocommerce-cart .woocommerce table.shop_table thead {
	background: rgba(139, 97, 72, 0.06);
}
.woocommerce-cart .woocommerce table.shop_table th {
	font-family: var(--font-body, Helvetica, sans-serif);
	font-size: 0.8rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--barcode-espresso);
	padding: 1rem;
}
.woocommerce-cart .woocommerce table.shop_table td {
	padding: 1rem;
	vertical-align: middle;
}
.woocommerce-cart .cart_totals h2 {
	font-family: var(--font-headline, 'Playfair Display', serif);
	font-size: 1.3rem;
	color: var(--barcode-espresso);
}
.woocommerce-cart .cart_totals .wc-proceed-to-checkout a.checkout-button {
	background-color: var(--barcode-brown, #8b6148) !important;
	color: var(--barcode-cream, #faf7f4) !important;
	border-radius: 6px;
	font-size: 0.85rem;
	font-weight: 600;
	letter-spacing: 0.15em;
	padding: 1rem 2rem;
	text-transform: uppercase;
	transition: background-color 0.3s;
}
.woocommerce-cart .cart_totals .wc-proceed-to-checkout a.checkout-button:hover {
	background-color: var(--barcode-espresso, #3d2b1f) !important;
}

/* ─── Sprint 3: Checkout Brand Styling ─── */
.woocommerce-checkout #payment {
	background: rgba(247, 242, 227, 0.5);
	border-radius: 8px;
	border: 1px solid rgba(185, 175, 154, 0.3);
}
.woocommerce-checkout #place_order {
	background-color: var(--barcode-brown, #8b6148) !important;
	color: var(--barcode-cream, #faf7f4) !important;
	border: none;
	border-radius: 6px;
	font-size: 0.9rem;
	font-weight: 600;
	letter-spacing: 0.15em;
	padding: 1rem 2rem;
	text-transform: uppercase;
	transition: background-color 0.3s;
}
.woocommerce-checkout #place_order:hover {
	background-color: var(--barcode-espresso, #3d2b1f) !important;
}
.woocommerce-checkout .woocommerce-input-wrapper input.input-text,
.woocommerce-checkout .woocommerce-input-wrapper select {
	border: 1.5px solid var(--barcode-taupe, #b9af9a);
	border-radius: 6px;
	padding: 0.7rem 1rem;
	background: var(--barcode-cream, #faf7f4);
	font-size: 0.9rem;
	transition: border-color 0.2s;
}
.woocommerce-checkout .woocommerce-input-wrapper input.input-text:focus,
.woocommerce-checkout .woocommerce-input-wrapper select:focus {
	border-color: var(--barcode-brown);
	outline: none;
}

/* ─── Sprint 3: About & Contact Page Styling ─── */
.about-page h1,
.contact-page h1 {
	font-family: var(--font-headline, 'Playfair Display', serif);
}
.about-page h2,
.contact-page h2 {
	font-family: var(--font-headline, 'Playfair Display', serif);
	color: var(--barcode-espresso);
	margin-top: 2rem;
}
.about-page p,
.contact-page p {
	color: var(--barcode-espresso);
}
.about-page .wp-block-separator,
.contact-page .wp-block-separator {
	border-color: var(--barcode-taupe);
	opacity: 0.4;
}
.about-page a,
.contact-page a {
	color: var(--barcode-brown);
	text-decoration: underline;
	text-underline-offset: 3px;
}
.about-page a:hover,
.contact-page a:hover {
	color: var(--barcode-espresso);
}

/* ─── G14: Header Account Icon ─── */
.header-account-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	text-decoration: none;
	color: var(--barcode-espresso);
	transition: opacity 0.2s;
}
.header-account-icon:hover {
	opacity: 0.6;
}
.header-account-icon svg {
	display: block;
}

/* ─── Header Search Icon ─── */
.header-search-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	text-decoration: none;
	color: var(--barcode-espresso);
}
.header-search-btn {
	background: none;
	border: none;
	padding: 4px;
	cursor: pointer;
	color: var(--barcode-espresso, #3d2b1f);
	display: flex;
	align-items: center;
	justify-content: center;
	transition: opacity 0.2s;
}
.header-search-btn:hover {
	opacity: 0.6;
}
.header-search-btn:focus {
	outline: none;
}

/* ─── Search Overlay ─── */
.barcode-search-overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(61, 43, 31, 0.55);
	backdrop-filter: blur(6px);
	z-index: 9999;
	display: flex;
	align-items: flex-start;
	justify-content: center;
	padding-top: 12vh;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.3s ease, visibility 0.3s ease;
}
.barcode-search-overlay.active {
	opacity: 1;
	visibility: visible;
}
.barcode-search-inner {
	background: var(--barcode-cream, #f7f2e3);
	border-radius: 12px;
	padding: 2rem 2.5rem;
	width: 90%;
	max-width: 600px;
	box-shadow: 0 24px 64px rgba(0, 0, 0, 0.25);
	transform: translateY(-20px);
	transition: transform 0.3s ease;
	position: relative;
}
.barcode-search-overlay.active .barcode-search-inner {
	transform: translateY(0);
}
.barcode-search-inner h3 {
	font-family: var(--font-headline, 'Playfair Display', serif);
	font-size: 1.3rem;
	color: var(--barcode-espresso, #3d2b1f);
	margin: 0 0 1rem;
	letter-spacing: 0.05em;
}
.barcode-search-inner form {
	display: flex;
	gap: 0.5rem;
}
.barcode-search-inner input[type="search"] {
	flex: 1;
	border: 1.5px solid var(--barcode-taupe, #b9af9a);
	border-radius: 6px;
	padding: 0.85rem 1rem;
	font-size: 0.95rem;
	font-family: var(--font-body, Helvetica, sans-serif);
	background: #fff;
	color: var(--barcode-espresso, #3d2b1f);
	outline: none;
	transition: border-color 0.2s;
}
.barcode-search-inner input[type="search"]:focus {
	border-color: var(--barcode-brown, #8b6148);
}
.barcode-search-inner input[type="search"]::placeholder {
	color: var(--barcode-taupe, #b9af9a);
}
.barcode-search-inner button[type="submit"] {
	background: var(--barcode-espresso, #3d2b1f);
	color: var(--barcode-cream, #f7f2e3);
	border: none;
	border-radius: 6px;
	padding: 0.85rem 1.5rem;
	font-size: 0.85rem;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	cursor: pointer;
	transition: background-color 0.2s;
}
.barcode-search-inner button[type="submit"]:hover {
	background: var(--barcode-brown, #8b6148);
}
.barcode-search-close {
	position: absolute;
	top: 0.75rem;
	right: 1rem;
	background: none;
	border: none;
	font-size: 1.5rem;
	cursor: pointer;
	color: var(--barcode-espresso, #3d2b1f);
	padding: 0.25rem;
	line-height: 1;
	transition: opacity 0.2s;
}
.barcode-search-close:hover {
	opacity: 0.5;
}

/* ─── G6: Size Pill Buttons ─── */
.barcode-size-pills {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin-top: 0.25rem;
}
.size-pill {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	height: 40px;
	padding: 0 0.85rem;
	border: 1.5px solid var(--barcode-taupe, #b9af9a);
	border-radius: 6px;
	background: transparent;
	color: var(--barcode-espresso, #3d2b1f);
	font-family: var(--font-body, Helvetica, sans-serif);
	font-size: 0.82rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	cursor: pointer;
	transition: all 0.2s ease;
}
.size-pill:hover {
	border-color: var(--barcode-brown, #8b6148);
	background: rgba(139, 97, 72, 0.05);
}
.size-pill.active {
	background: var(--barcode-espresso, #3d2b1f);
	border-color: var(--barcode-espresso, #3d2b1f);
	color: var(--barcode-cream, #faf7f4);
}

/* ─── G7: Circular Color Swatches ─── */
.barcode-color-swatches {
	display: flex;
	flex-wrap: wrap;
	gap: 0.65rem;
	margin-top: 0.25rem;
}
.color-swatch {
	width: 32px;
	height: 32px;
	border-radius: 50%;
	border: 2px solid transparent;
	cursor: pointer;
	transition: all 0.2s ease;
	outline: none;
	padding: 0;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12);
	position: relative;
}
.color-swatch:hover {
	transform: scale(1.15);
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.18);
}
.color-swatch.active {
	border-color: var(--barcode-espresso, #3d2b1f);
	box-shadow: 0 0 0 3px var(--barcode-cream, #faf7f4), 0 0 0 5px var(--barcode-espresso, #3d2b1f);
	transform: scale(1.1);
}
.color-swatch.swatch-light {
	border-color: var(--barcode-taupe, #b9af9a);
}
.color-swatch.swatch-light.active {
	border-color: var(--barcode-espresso, #3d2b1f);
}

/* Hide the original variation table layout for cleaner look */
.woocommerce div.product form.variations_form .variations td {
	display: block;
	padding: 0.3rem 0;
}
.woocommerce div.product form.variations_form .variations tr {
	display: block;
	margin-bottom: 0.75rem;
}
.woocommerce div.product form.variations_form .variations td.label label {
	font-family: var(--font-body, Helvetica, sans-serif);
	font-size: 0.8rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--barcode-espresso);
}

/* ─── G16: Quantity Stepper ─── */
.barcode-qty-stepper {
	display: inline-flex;
	align-items: center;
	border: 1.5px solid var(--barcode-taupe, #b9af9a);
	border-radius: 6px;
	overflow: hidden;
	height: 48px;
}
.barcode-qty-stepper input.qty {
	width: 48px;
	height: 100%;
	text-align: center;
	border: none;
	border-left: 1px solid var(--barcode-taupe, #b9af9a);
	border-right: 1px solid var(--barcode-taupe, #b9af9a);
	font-size: 0.95rem;
	font-weight: 600;
	color: var(--barcode-espresso);
	background: var(--barcode-cream, #faf7f4);
	-moz-appearance: textfield;
	outline: none;
}
.barcode-qty-stepper input.qty::-webkit-inner-spin-button,
.barcode-qty-stepper input.qty::-webkit-outer-spin-button {
	-webkit-appearance: none;
	margin: 0;
}
.qty-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 100%;
	border: none;
	background: transparent;
	font-size: 1.2rem;
	color: var(--barcode-espresso);
	cursor: pointer;
	transition: background 0.2s;
	padding: 0;
}
.qty-btn:hover {
	background: rgba(139, 97, 72, 0.08);
}
.qty-btn:active {
	background: rgba(139, 97, 72, 0.15);
}

/* ─── Footer Contact List ─── */
.footer-contact-list,
.footer-stores-list {
	list-style: none;
	padding: 0;
	margin: 0;
}
.footer-contact-list li,
.footer-stores-list li {
	display: flex;
	align-items: flex-start;
	gap: 0.6rem;
	margin-bottom: 0.6rem;
	font-size: 0.875rem;
	line-height: 1.5;
	color: var(--barcode-cream, #f7f2e3);
}
.footer-contact-list li svg,
.footer-stores-list li svg {
	flex-shrink: 0;
	margin-top: 2px;
	opacity: 0.65;
}
.footer-contact-list li a {
	color: var(--barcode-cream, #f7f2e3);
	text-decoration: none;
	border-bottom: 1px solid transparent;
	transition: border-color 0.2s, opacity 0.2s;
}
.footer-contact-list li a:hover {
	border-bottom-color: var(--barcode-taupe, #b9af9a);
	opacity: 0.85;
}
.footer-stores-list li {
	margin-bottom: 0.75rem;
}
.footer-stores-list li span {
	line-height: 1.45;
}
.footer-stores-list li em {
	font-style: normal;
	opacity: 0.6;
	font-size: 0.8rem;
}

/* ─── G13: Shop Dropdown Menu ─── */
.wp-block-navigation-submenu {
	position: relative;
}
.wp-block-navigation-submenu .wp-block-navigation__submenu-container {
	background: var(--barcode-cream, #f7f2e3);
	border: 1px solid var(--barcode-taupe, #b9af9a);
	border-radius: 4px;
	box-shadow: 0 4px 16px rgba(61, 43, 31, 0.12);
	padding: 0.5rem 0;
	min-width: 180px;
	z-index: 100;
}
.wp-block-navigation-submenu .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	padding: 0.5rem 1.25rem;
	display: block;
	font-family: var(--wp--preset--font-family--headline);
	font-size: 0.85rem;
	font-weight: 400;
	letter-spacing: 0.02em;
	text-transform: none;
	color: var(--barcode-espresso, #3d2b1f);
	transition: background 0.15s, color 0.15s;
}
.wp-block-navigation-submenu .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover {
	background: rgba(139, 97, 72, 0.08);
	color: var(--barcode-brown, #8b6148);
}

/* ─── G17: Sidebar Color Filter Swatches ─── */
.wc-block-attribute-filter .wc-block-attribute-filter-list li label,
.wp-block-woocommerce-attribute-filter .wc-block-attribute-filter-list li label {
	display: flex;
	align-items: center;
	gap: 0.5rem;
}

/* ─── G22: CSS-Only Background Treatments ─── */

/* Homepage "Warm Earth" story strip — rich espresso gradient */
.brand-story-section {
	background: linear-gradient(160deg, #3d2b1f 0%, #2a1a10 40%, #1f1209 100%) !important;
}

/* Footer — subtle warm-dark gradient */
.site-footer {
	background: linear-gradient(180deg, #2a1a10 0%, #1f1209 100%) !important;
}

/* ─── G22b: Dark-Section Typography (Designer Guide) ─── */
/* Headings on dark BG → cream (#f7f2e3), section labels → gold (#c8a04a) */
.brand-story-section h2,
.brand-story-section h3,
.brand-story-section h4,
.contact-stores-section h2,
.about-stores-section h2,
.site-footer h4,
.site-footer h5,
.site-footer h6 {
	color: var(--wp--preset--color--brand-cream, #f7f2e3) !important;
}

.brand-story-section p,
.contact-stores-section p,
.about-stores-section p,
.site-footer p,
.site-footer li {
	color: var(--wp--preset--color--brand-cream, #f7f2e3) !important;
	opacity: 0.9;
}

.brand-story-section a,
.contact-stores-section a,
.about-stores-section a,
.site-footer a {
	color: var(--wp--preset--color--brand-gold, #c8a04a) !important;
}
.site-footer a:hover,
.contact-stores-section a:hover,
.about-stores-section a:hover {
	color: var(--wp--preset--color--brand-cream, #f7f2e3) !important;
}

/* ─── G27: Cart + Checkout Refinements ─── */
.wc-block-cart .wc-block-cart__submit-button,
.wc-block-checkout .wc-block-components-checkout-place-order-button {
	background-color: var(--barcode-brown, #8b6148) !important;
	color: var(--barcode-cream, #f7f2e3) !important;
	border: none !important;
	border-radius: 4px !important;
	font-family: var(--font-body, Helvetica, sans-serif);
	font-size: 0.85rem;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	padding: 0.875rem 2rem;
	transition: background-color 0.2s;
}
.wc-block-cart .wc-block-cart__submit-button:hover,
.wc-block-checkout .wc-block-components-checkout-place-order-button:hover {
	background-color: var(--barcode-espresso, #3d2b1f) !important;
}
.wc-block-components-totals-wrapper {
	border-color: var(--barcode-taupe, #b9af9a) !important;
}
.wc-block-components-order-summary .wc-block-components-order-summary-item__description {
	font-family: var(--font-body, Helvetica, sans-serif);
}
.wc-block-checkout .wc-block-components-text-input input,
.wc-block-checkout .wc-block-components-text-input textarea {
	border-color: var(--barcode-taupe, #b9af9a) !important;
	border-radius: 4px !important;
	font-family: var(--font-body, Helvetica, sans-serif);
}
.wc-block-checkout .wc-block-components-text-input input:focus,
.wc-block-checkout .wc-block-components-text-input textarea:focus {
	border-color: var(--barcode-brown, #8b6148) !important;
	box-shadow: 0 0 0 1px var(--barcode-brown, #8b6148) !important;
}

/* ─── CONTACT PAGE — Card Grid ─── */
.contact-card {
	text-align: center;
	padding: 2rem 1.25rem;
	border: 1px solid var(--wp--preset--color--brand-taupe, #b9af9a);
	border-radius: 8px;
	transition: box-shadow 0.25s ease, transform 0.25s ease;
	height: 100%;
}
.contact-card:hover {
	box-shadow: 0 6px 24px rgba(61,43,31,0.1);
	transform: translateY(-2px);
}
.contact-card__icon {
	width: 56px;
	height: 56px;
	border-radius: 50%;
	background: rgba(139,97,72,0.08);
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto 1rem;
}
.contact-card h3 {
	font-family: var(--wp--preset--font-family--headline);
	font-size: 1.1rem;
	letter-spacing: 0.06em;
	margin-bottom: 0.5rem;
	color: var(--wp--preset--color--brand-espresso);
}
.contact-card p {
	font-size: 0.95rem;
	margin: 0.25rem 0;
	color: var(--wp--preset--color--brand-espresso);
}
.contact-card a {
	color: var(--wp--preset--color--brand-brown);
	text-decoration: none;
	border-bottom: 1px solid transparent;
	transition: border-color 0.2s;
}
.contact-card a:hover {
	border-bottom-color: var(--wp--preset--color--brand-brown);
}

/* ─── CONTACT PAGE — Store Cards (Dark Section) ─── */
.contact-stores-section {
	background: linear-gradient(160deg, #3d2b1f 0%, #2a1a10 60%, #1f1209 100%) !important;
}
.store-card {
	padding: 1.5rem;
	border: 1px solid rgba(247,242,227,0.15);
	border-radius: 8px;
	background: rgba(0,0,0,0.2);
}
.store-card__label {
	font-size: 0.7rem;
	font-weight: 600;
	letter-spacing: 0.15em;
	color: var(--wp--preset--color--brand-gold, #c8a04a);
	margin-bottom: 0.5rem;
}
.store-card h3 {
	font-family: var(--wp--preset--font-family--headline);
	font-size: 1.25rem;
	margin-bottom: 0.5rem;
	color: var(--wp--preset--color--brand-cream);
}
.store-card p {
	font-size: 0.95rem;
	line-height: 1.6;
	margin: 0.2rem 0;
	opacity: 0.85;
}
.store-card__phone {
	margin-top: 0.75rem !important;
}

/* ─── ABOUT PAGE — Gradient Treatments ─── */
.about-texture-banner {
	background: linear-gradient(135deg, #f7f2e3 0%, #ede4d0 50%, #e5d9c3 100%) !important;
}

/* ─── SIZE GUIDE PAGE ─── */
.size-guide-page {
	max-width: 900px;
	margin: 0 auto;
}

.barcode-size-chart {
	width: 100%;
	border-collapse: collapse;
	margin: 1.5rem 0;
	font-size: 0.95rem;
}

.barcode-size-chart thead {
	background: var(--barcode-espresso, #3d2b1f);
	color: var(--barcode-cream, #f7f2e3);
}

.barcode-size-chart th {
	padding: 0.75rem 1rem;
	text-align: center;
	font-weight: 600;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	font-size: 0.85rem;
}

.barcode-size-chart td {
	padding: 0.75rem 1rem;
	text-align: center;
	border-bottom: 1px solid #e8e4dc;
	color: var(--barcode-espresso, #3d2b1f);
}

.barcode-size-chart tbody tr:nth-child(even) {
	background: rgba(185, 175, 154, 0.08);
}

.barcode-size-chart tbody tr:hover {
	background: rgba(185, 175, 154, 0.15);
}

@media (max-width: 480px) {
	.barcode-size-chart {
		font-size: 0.85rem;
	}
	.barcode-size-chart th,
	.barcode-size-chart td {
		padding: 0.5rem 0.4rem;
	}
}

/* (Removed 2026-06-10: the old "Paid on delivery" CSS overlay — real delivery
   fees are now charged at checkout, so the genuine prices must show.) */

/* Checkout header: replace site-title text with logo */
.wp-block-woocommerce-checkout .wp-block-site-title,
.wc-block-checkout__header-brand {
	font-size: 0 !important;
	line-height: 0;
}
.wp-block-woocommerce-checkout .wp-block-site-title a,
.wc-block-checkout__header-brand a {
	display: block;
	background: url('/wp-content/uploads/2026/05/barcode-logo-espresso-transparent.png') no-repeat center center;
	background-size: contain;
	width: 120px;
	height: 80px;
	font-size: 0;
	text-indent: -9999px;
}

/* ─── COORDINATED LOOKS GALLERY GRID ─── */
.barcode-gallery-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.5rem;
	margin: 2rem 0;
}

@media (max-width: 991px) {
	.barcode-gallery-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 1.2rem;
	}
}

@media (max-width: 480px) {
	.barcode-gallery-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 0.8rem;
	}
}

/* ─── Mobile PDP: cap gallery height so the title/price sit closer to the fold ─── */
@media (max-width: 768px) {
	/* Clamp the gallery + its visible window to the column. .flex-viewport already
	   has overflow:hidden, so the wide FlexSlider track inside it is clipped and
	   can't push the page wider than the screen. We deliberately do NOT force
	   widths on the track/slides themselves — that collapses FlexSlider's
	   horizontal strip and breaks navigation; the JS resize nudge lets FlexSlider
	   recompute slide widths to fit this column instead. */
	.product-detail-layout { min-width: 0 !important; }
	.product-gallery-vertical,
	.product-gallery-vertical .woocommerce-product-gallery,
	.product-gallery-vertical .flex-viewport {
		max-width: 100% !important;
		min-width: 0 !important;
		width: 100% !important;
	}
	.product-gallery-vertical .woocommerce-product-gallery,
	.product-gallery-vertical .flex-viewport {
		overflow: hidden !important;
	}
	.product-gallery-vertical .flex-viewport,
	.product-gallery-vertical ul.slides,
	.product-gallery-vertical ul.slides > li,
	.product-gallery-vertical .woocommerce-product-gallery__image {
		max-height: 56vh !important;
		height: 56vh !important;
	}
	.product-gallery-vertical ul.slides > li img,
	.product-gallery-vertical .woocommerce-product-gallery__image img {
		height: 56vh !important;
		max-height: 56vh !important;
		width: 100% !important;
		object-fit: cover !important;
		object-position: top center !important;
	}
}

/* ─── Mobile safety net: never allow horizontal page scroll (which is what lets
   the page pinch-zoom-out). The real overflow causes (home banner, PDP gallery)
   are fixed above; this only mops up stray sub-pixel overflow from stock
   WooCommerce blocks (cart/checkout) and future additions. Uses `clip`, not
   `hidden`, so it never creates a scroll container or breaks the sticky header. ─── */
@media (max-width: 768px) {
	html, body { overflow-x: clip; }
}

/* ─── Wishlist Page ─── */
.barcode-wishlist-view { padding: 1rem 0 3rem; min-height: 40vh; }
.barcode-wishlist-empty,
.barcode-wishlist-loading {
	text-align: center;
	color: var(--barcode-brown, #8b6148);
	font-size: 1.05rem;
	padding: 3rem 1rem;
}
.barcode-wishlist-grid {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1.5rem;
}
.barcode-wishlist-grid li.product { position: relative; margin: 0; text-align: left; }
.barcode-wishlist-grid li.product a { text-decoration: none; color: inherit; display: block; }
.barcode-wishlist-grid li.product img {
	width: 100%;
	aspect-ratio: 2 / 3;
	object-fit: cover;
	border-radius: var(--radius-card, 8px);
	margin-bottom: 0.5rem;
}
.barcode-wishlist-grid .woocommerce-loop-product__title { font-size: 0.95rem; font-weight: 400; margin: 0.25rem 0; }
.barcode-wishlist-grid .price { color: var(--barcode-brown, #8b6148); font-weight: 600; }
.barcode-wishlist-remove {
	position: absolute;
	top: 8px;
	right: 8px;
	z-index: 2;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	border: none;
	background: rgba(255, 255, 255, 0.92);
	color: var(--barcode-espresso, #3d2b1f);
	font-size: 1.2rem;
	line-height: 1;
	cursor: pointer;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15);
}
.barcode-wishlist-remove:hover { background: #fff; color: #c0392b; }
@media (max-width: 768px) {
	.barcode-wishlist-grid { grid-template-columns: repeat(2, 1fr); gap: 14px; }
}

/* ─── PDP buy box: Add to Cart BEFORE Wishlist (content-creator request) ─── */
.product-detail-layout .product-info-panel { display: flex !important; flex-direction: column !important; }
.product-info-panel > .product-title { order: 1 !important; }
.product-info-panel > .product-price-display { order: 2 !important; }
.product-info-panel > .product-description { order: 3 !important; }
.product-info-panel > .barcode-size-guide-link { order: 4 !important; }
.product-info-panel > .wp-block-add-to-cart-form { order: 5 !important; }
.product-info-panel > .barcode-wishlist-product-btn { order: 6 !important; }
.product-info-panel > .barcode-whatsapp-product { order: 7 !important; }

/* ─── Shop card image block: positioning context for arrows/dots/quick-add ─── */
.wp-block-woocommerce-product-image { position: relative; overflow: hidden; }

/* ─── Shop card CTA: Add to Cart + Buy Now — static row BELOW the photo (#50) ─── */
.barcode-card-cta {
	display: flex;
	gap: 6px;
	margin: 8px 0 2px;
}
.barcode-card-cta button {
	flex: 1;
	padding: 9px 4px;
	border: none;
	border-radius: 6px;
	font-size: 0.7rem;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	cursor: pointer;
	white-space: nowrap;
}
.barcode-cta-add {
	background: rgba(61, 43, 31, 0.92);
	color: #fff;
}
.barcode-cta-buy {
	background: var(--barcode-gold, #c9a94e);
	color: var(--barcode-espresso, #3d2b1f);
	font-weight: 700;
}
.barcode-cta-add:hover { background: var(--barcode-espresso, #3d2b1f); }
.barcode-cta-buy:hover { filter: brightness(1.08); }
.wp-block-woocommerce-product-image .barcode-quick-sizes {
	position: absolute;
	left: 8px;
	right: 8px;
	bottom: 8px;
	z-index: 6;
	display: none;
	flex-wrap: wrap;
	gap: 6px;
	justify-content: center;
	background: rgba(247, 242, 227, 0.97);
	padding: 9px;
	border-radius: 6px;
	box-shadow: 0 2px 10px rgba(61, 43, 31, 0.18);
}
.wp-block-woocommerce-product-image .barcode-quick-sizes.open { display: flex; }
.barcode-quick-size {
	padding: 6px 11px;
	border: 1px solid var(--barcode-espresso, #3d2b1f);
	border-radius: 4px;
	font-size: 0.78rem;
	text-decoration: none;
	color: var(--barcode-espresso, #3d2b1f);
	background: #fff;
}
.barcode-quick-size:hover { background: var(--barcode-espresso, #3d2b1f); color: #fff; }

/* ─── Shop card swipe carousel (#39) + tap colour dot (#40) ─── */
.wp-block-woocommerce-product-image .barcode-card-arrow {
	position: absolute;
	top: 44%;
	transform: translateY(-50%);
	z-index: 5;
	width: 32px;
	height: 32px;
	display: flex;
	align-items: center;
	justify-content: center;
	border: none;
	border-radius: 50%;
	background: rgba(247, 242, 227, 0.9);
	color: #3d2b1f;
	font-size: 1.3rem;
	line-height: 1;
	cursor: pointer;
	opacity: 0;
	transition: opacity 0.2s ease, background 0.2s ease;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.18);
}
.barcode-card-arrow-prev { left: 6px; }
.barcode-card-arrow-next { right: 6px; }
.barcode-card-arrow:hover { background: #fff; }
@media (hover: hover) {
	.barcode-product-card:hover .barcode-card-arrow,
	li.product:hover .barcode-card-arrow { opacity: 0.95; }
}
@media (hover: none) {
	/* Touch uses swipe — keep the card clean */
	.wp-block-woocommerce-product-image .barcode-card-arrow { display: none; }
}
.wp-block-woocommerce-product-image .barcode-card-dots {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 10px;
	z-index: 5;
	display: flex;
	gap: 5px;
	justify-content: center;
	pointer-events: none;
	opacity: 0;
	transition: opacity 0.2s ease;
}
.barcode-card-dot {
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.7);
	box-shadow: 0 0 0 1px rgba(61, 43, 31, 0.4);
	pointer-events: auto;
	cursor: pointer;
	transition: background 0.2s ease, transform 0.2s ease;
}
.barcode-card-dot.active { background: #3d2b1f; transform: scale(1.3); }
@media (hover: hover) {
	.barcode-product-card:hover .barcode-card-dots,
	li.product:hover .barcode-card-dots { opacity: 1; }
}
@media (hover: none) {
	.wp-block-woocommerce-product-image .barcode-card-dots { opacity: 1; }
}
.barcode-card-arrow:focus-visible,
.barcode-card-dot:focus-visible { outline: 2px solid #3d2b1f; outline-offset: 2px; }
/* Interactive colour dots (#40) */
.bc-swatch.bc-swatch-live { cursor: pointer; }
.bc-swatch.bc-swatch-active { transform: scale(1.2); box-shadow: 0 0 0 2px #fff, 0 0 0 3px #3d2b1f; }

.barcode-gallery-item {
	position: relative;
	transition: transform var(--transition-smooth);
}

.barcode-gallery-item:hover {
	transform: translateY(-4px);
}

.barcode-gallery-item img {
	border-radius: var(--radius-card);
	aspect-ratio: 2 / 3;
	object-fit: cover;
	width: 100%;
	transition: box-shadow var(--transition-smooth);
}

.barcode-gallery-item:hover img {
	box-shadow: var(--shadow-hover);
}


.color-dot-yellow { background-color: #f0d060; border: 1px solid #c4a830; }

/* ═══════════ Contact page redesign (2026-06-11) ═══════════ */
.bc-contact { padding: 3.5rem 1rem 4.5rem; }
.bc-kicker {
	text-align: center;
	font-size: 0.78rem;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--barcode-gold, #c9a94e);
	margin: 0 0 0.6rem;
	font-weight: 600;
}
.bc-contact-title {
	font-family: var(--wp--preset--font-family--headline, "Playfair Display", serif);
	text-align: center;
	font-size: clamp(2.2rem, 5vw, 3.2rem);
	font-weight: 700;
	letter-spacing: 0.04em;
	color: var(--barcode-espresso, #3d2b1f);
	margin: 0 0 0.8rem;
}
.bc-contact-sub {
	text-align: center;
	max-width: 520px;
	margin: 0 auto 2.8rem;
	line-height: 1.7;
	color: #6b5a4e;
}
/* channels */
.bc-channels {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1rem;
	max-width: 980px;
	margin: 0 auto 3.2rem;
}
.bc-channel {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.45rem;
	padding: 1.5rem 1rem 1.3rem;
	background: #fff;
	border: 1px solid rgba(61, 43, 31, 0.12);
	border-radius: 14px;
	text-decoration: none;
	transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}
.bc-channel:hover {
	transform: translateY(-4px);
	box-shadow: 0 12px 28px rgba(61, 43, 31, 0.12);
	border-color: var(--barcode-gold, #c9a94e);
}
.bc-channel__icon {
	width: 52px;
	height: 52px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	color: var(--barcode-espresso, #3d2b1f);
	background: var(--barcode-cream, #f7f2e3);
	box-shadow: inset 0 0 0 1px rgba(201, 169, 78, 0.55);
	margin-bottom: 0.3rem;
}
.bc-channel__name {
	font-family: var(--wp--preset--font-family--headline, "Playfair Display", serif);
	font-size: 1.02rem;
	font-weight: 700;
	color: var(--barcode-espresso, #3d2b1f);
}
.bc-channel__val {
	font-size: 0.85rem;
	color: #8a7563;
	word-break: break-word;
	text-align: center;
}
/* stores */
.bc-stores {
	background: var(--barcode-espresso, #3d2b1f);
	border-radius: 18px;
	padding: 3rem 2rem 2.6rem;
	color: var(--barcode-cream, #f7f2e3);
}
.bc-kicker--light { color: var(--barcode-gold, #c9a94e); }
.bc-stores__title {
	font-family: var(--wp--preset--font-family--headline, "Playfair Display", serif);
	text-align: center;
	font-size: clamp(1.6rem, 3.5vw, 2.2rem);
	color: #fff;
	margin: 0 0 2.2rem;
	letter-spacing: 0.03em;
}
.bc-stores__grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1.4rem;
	max-width: 880px;
	margin: 0 auto;
}
.bc-store {
	background: rgba(247, 242, 227, 0.05);
	border: 1px solid rgba(201, 169, 78, 0.35);
	border-radius: 14px;
	padding: 1.8rem 1.6rem 1.6rem;
	display: flex;
	flex-direction: column;
	gap: 0.55rem;
}
.bc-store__tag {
	font-size: 0.72rem;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--barcode-gold, #c9a94e);
	margin: 0;
	font-weight: 600;
}
.bc-store__name {
	font-family: var(--wp--preset--font-family--headline, "Playfair Display", serif);
	font-size: 1.5rem;
	color: #fff;
	margin: 0;
}
.bc-store__addr { margin: 0; line-height: 1.65; color: rgba(247, 242, 227, 0.92); }
.bc-store__hours {
	margin: 0.2rem 0 0.4rem;
	font-size: 0.88rem;
	line-height: 1.65;
	color: rgba(247, 242, 227, 0.65);
	border-top: 1px solid rgba(201, 169, 78, 0.25);
	padding-top: 0.7rem;
}
.bc-store__actions { display: flex; gap: 0.7rem; flex-wrap: wrap; margin-top: auto; }
.bc-btn {
	display: inline-block;
	padding: 0.6rem 1.15rem;
	border-radius: 8px;
	font-size: 0.85rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-decoration: none;
	background: var(--barcode-gold, #c9a94e);
	color: var(--barcode-espresso, #3d2b1f);
	transition: filter 0.2s ease, transform 0.2s ease;
}
.bc-btn:hover { filter: brightness(1.08); transform: translateY(-1px); }
.bc-btn--ghost {
	background: transparent;
	color: var(--barcode-cream, #f7f2e3);
	border: 1px solid rgba(247, 242, 227, 0.45);
}
.bc-stores__note {
	text-align: center;
	margin: 1.8rem auto 0;
	font-size: 0.85rem;
	color: rgba(247, 242, 227, 0.6);
	max-width: 560px;
}
@media (max-width: 900px) {
	.bc-channels { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 680px) {
	.bc-contact { padding-top: 2.2rem; }
	.bc-stores__grid { grid-template-columns: 1fr; }
	.bc-stores { padding: 2.2rem 1.2rem 2rem; }
}
@media (max-width: 420px) {
	.bc-channels { gap: 0.7rem; }
	.bc-channel { padding: 1.1rem 0.5rem 1rem; }
	.bc-channel__val { font-size: 0.78rem; }
}

/* ═══════════ Mobile conversion sprint (2026-06-12) ═══════════ */

/* ── #45 PDP first-screen title + price ── */
.barcode-pdp-topbar {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 1rem;
	padding: 0.15rem 0.1rem 0.65rem;
}
.barcode-pdp-topbar__title {
	font-family: var(--wp--preset--font-family--headline, "Playfair Display", serif);
	font-weight: 700;
	font-size: 1.08rem;
	line-height: 1.3;
	color: var(--barcode-espresso, #3d2b1f);
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.barcode-pdp-topbar__price {
	font-weight: 700;
	white-space: nowrap;
	color: var(--barcode-brown, #8b6148);
}
.barcode-pdp-topbar__price del { opacity: 0.55; margin-right: 0.3em; }
@media (min-width: 769px) { .barcode-pdp-topbar { display: none; } }

/* ── #41 sticky buy bar ── */
.barcode-sticky-buy {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 998;
	display: flex;
	align-items: center;
	gap: 0.9rem;
	padding: 0.62rem 0.95rem calc(0.62rem + env(safe-area-inset-bottom));
	background: #fff;
	box-shadow: 0 -4px 18px rgba(61, 43, 31, 0.16);
	transform: translateY(110%);
	transition: transform 0.25s ease;
}
.barcode-sticky-buy.visible { transform: none; }
.barcode-sticky-buy__price { font-weight: 700; color: var(--barcode-espresso, #3d2b1f); white-space: nowrap; }
.barcode-sticky-buy__price del { display: none; }
.barcode-sticky-buy__btn {
	flex: 1;
	padding: 12px 10px;
	border: none;
	border-radius: 8px;
	background: var(--barcode-espresso, #3d2b1f);
	color: #fff;
	font-size: 0.85rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	cursor: pointer;
}
@media (max-width: 960px) {
	body.barcode-has-sticky-buy .barcode-whatsapp-float { bottom: 118px !important; }
	body.barcode-has-sticky-buy { padding-bottom: 70px; }
}

/* ── #43 option-pick guidance (replaces the native alert) ── */
.barcode-needs-pick {
	animation: bcPulse 1.1s ease 2;
	border-radius: 10px;
}
@keyframes bcPulse {
	0%   { box-shadow: 0 0 0 0 rgba(201, 169, 78, 0.8); }
	70%  { box-shadow: 0 0 0 12px rgba(201, 169, 78, 0); }
	100% { box-shadow: 0 0 0 0 rgba(201, 169, 78, 0); }
}
.barcode-pick-msg {
	display: none;
	margin: 0.5rem 0 0;
	font-size: 0.86rem;
	font-weight: 600;
	color: #9a3324;
}
.barcode-pick-msg.show { display: block; }
.single_add_to_cart_button.loading { opacity: 0.6; pointer-events: none; }

/* ── #42 shop toolbar + off-canvas filter drawer (mobile) ── */
.barcode-shop-toolbar { display: none; }
@media (max-width: 960px) {
	.barcode-shop-toolbar {
		position: sticky;
		top: 0;
		z-index: 60;
		display: flex;
		align-items: center;
		gap: 0.8rem;
		padding: 0.55rem 0.2rem;
		margin-bottom: 0.4rem;
		background: var(--barcode-cream, #f7f2e3);
		border-bottom: 1px solid rgba(61, 43, 31, 0.12);
	}
	.barcode-shop-toolbar__filter {
		display: inline-flex;
		align-items: center;
		gap: 0.4rem;
		padding: 0.55rem 1rem;
		border: 1px solid var(--barcode-espresso, #3d2b1f);
		border-radius: 8px;
		background: transparent;
		color: var(--barcode-espresso, #3d2b1f);
		font-size: 0.82rem;
		font-weight: 600;
		letter-spacing: 0.04em;
		cursor: pointer;
	}
	.barcode-shop-toolbar .wc-block-catalog-sorting,
	.barcode-shop-toolbar form.woocommerce-ordering { margin: 0 0 0 auto; }
	.barcode-shop-toolbar select.orderby { max-width: 180px; font-size: 0.82rem; }

	.shop-sidebar {
		position: fixed;
		top: 0;
		left: 0;
		bottom: 0;
		width: min(84vw, 360px);
		z-index: 1001;
		background: var(--barcode-cream, #f7f2e3);
		transform: translateX(-105%);
		transition: transform 0.28s ease;
		overflow-y: auto;
		padding: 1.1rem 1.2rem 2.5rem;
		box-shadow: 4px 0 24px rgba(0, 0, 0, 0.18);
	}
	body.barcode-filters-open .shop-sidebar { transform: none; }
	body.barcode-filters-open { overflow: hidden; }
	.shop-sidebar .filter-section { display: block !important; }
	.shop-sidebar .barcode-filter-toggle { display: none !important; }
	.barcode-filter-backdrop {
		position: fixed;
		inset: 0;
		z-index: 1000;
		background: rgba(33, 29, 26, 0.45);
		opacity: 0;
		pointer-events: none;
		transition: opacity 0.25s ease;
	}
	body.barcode-filters-open .barcode-filter-backdrop { opacity: 1; pointer-events: auto; }
	.barcode-filter-close {
		position: sticky;
		top: 0;
		margin-left: auto;
		display: block;
		width: 36px;
		height: 36px;
		border: none;
		border-radius: 50%;
		background: var(--barcode-espresso, #3d2b1f);
		color: #fff;
		font-size: 1.3rem;
		line-height: 1;
		cursor: pointer;
	}
}

/* ── #49 checkout trust strip ── */
.barcode-trust-strip {
	text-align: center;
	font-size: 0.8rem;
	color: #6b5a4e;
	padding: 0.55rem 0.4rem;
	margin: 0.4rem 0 0.6rem;
	border-top: 1px solid rgba(61, 43, 31, 0.12);
}

/* ── #50 load more ── */
.barcode-load-more {
	display: block;
	margin: 1.6rem auto 0.4rem;
	padding: 0.8rem 2.6rem;
	border: 1px solid var(--barcode-espresso, #3d2b1f);
	border-radius: 8px;
	background: transparent;
	color: var(--barcode-espresso, #3d2b1f);
	font-size: 0.85rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	cursor: pointer;
	transition: background 0.2s ease, color 0.2s ease;
}
.barcode-load-more:hover { background: var(--barcode-espresso, #3d2b1f); color: #fff; }
.barcode-load-more:disabled { opacity: 0.55; }

/* ═══════════ Tier A — purchase & navigation flow (2026-06-13) ═══════════ */

/* ── A1: Buy Now (buy box + sticky bar) ── */
.barcode-buy-now {
	display: block;
	width: 100%;
	margin-top: 0.6rem;
	padding: 0.875rem 2rem;
	background: var(--barcode-gold, #c8a04a);
	color: var(--barcode-espresso, #3d2b1f);
	border: none;
	border-radius: var(--radius-button, 4px);
	font-size: 0.85rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	cursor: pointer;
	transition: filter 0.25s ease;
}
.barcode-buy-now:hover { filter: brightness(1.06); }
.barcode-buy-now:active { filter: brightness(0.96); }
.barcode-buy-now:focus-visible { outline: 2px solid var(--barcode-espresso, #3d2b1f); outline-offset: 2px; }
.barcode-sticky-buy__btn--buy { background: var(--barcode-gold, #c8a04a); color: var(--barcode-espresso, #3d2b1f); }
.barcode-sticky-buy__btn--buy:active { filter: brightness(0.96); }
.barcode-sticky-buy { gap: 0.55rem; }
.barcode-sticky-buy__btn { padding: 12px 6px; font-size: 0.8rem; letter-spacing: 0.04em; }
@media (max-width: 360px) {
	.barcode-sticky-buy { gap: 0.45rem; padding-left: 0.7rem; padding-right: 0.7rem; }
	.barcode-sticky-buy__price { font-size: 0.82rem; }
	.barcode-sticky-buy__btn { padding: 11px 4px; font-size: 0.74rem; }
}

/* ── A2: category chips ── */
.barcode-cat-chips { margin: 0.4rem 0 1rem; }
.barcode-cat-chips__track {
	display: flex; flex-wrap: nowrap; gap: 0.5rem;
	overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch;
	scroll-snap-type: x proximity; scroll-padding-left: 0.2rem;
	padding: 0.15rem 0.2rem 0.45rem;
	-ms-overflow-style: none; scrollbar-width: none;
}
.barcode-cat-chips__track::-webkit-scrollbar { width: 0; height: 0; display: none; }
.barcode-cat-chip {
	flex: 0 0 auto; scroll-snap-align: start; display: inline-flex; align-items: center;
	white-space: nowrap; padding: 0.42rem 0.95rem;
	border: 1px solid var(--barcode-espresso, #3d2b1f); border-radius: 999px;
	background: transparent; color: var(--barcode-espresso, #3d2b1f);
	font-size: 0.82rem; font-weight: 600; letter-spacing: 0.03em; line-height: 1.1;
	text-decoration: none; transition: background-color 0.18s ease, color 0.18s ease, border-color 0.18s ease;
}
.barcode-cat-chip:hover, .barcode-cat-chip:focus-visible {
	background: var(--barcode-cream, #f7f2e3); border-color: var(--barcode-brown, #8b6148); color: var(--barcode-brown, #8b6148);
}
.barcode-cat-chip:focus-visible { outline: 2px solid var(--barcode-gold, #c8a04a); outline-offset: 2px; }
.barcode-cat-chip.is-active, .barcode-cat-chip.is-active:hover {
	background: var(--barcode-espresso, #3d2b1f); border-color: var(--barcode-espresso, #3d2b1f); color: #fff;
}
.barcode-cat-chip--skeleton {
	width: 72px; height: 31px; border-color: transparent;
	background: linear-gradient(90deg, rgba(61,43,31,0.06) 25%, rgba(61,43,31,0.12) 37%, rgba(61,43,31,0.06) 63%);
	background-size: 400% 100%; animation: barcodeChipSkel 1.2s ease-in-out infinite; border-radius: 999px;
}
.barcode-cat-chip--skeleton:nth-child(2) { width: 88px; }
.barcode-cat-chip--skeleton:nth-child(3) { width: 64px; }
.barcode-cat-chip--skeleton:nth-child(4) { width: 96px; }
.barcode-cat-chip--skeleton:nth-child(5) { width: 70px; }
@keyframes barcodeChipSkel { 0% { background-position: 100% 0; } 100% { background-position: 0 0; } }
@media (prefers-reduced-motion: reduce) { .barcode-cat-chip--skeleton { animation: none; } }
@media (max-width: 960px) {
	.barcode-cat-chips { margin-top: 0; margin-bottom: 0.6rem; }
	.barcode-cat-chips__track { padding-left: 0.2rem; padding-right: 0.2rem; }
}

/* ── A3: live search suggestions ── */
.barcode-search-results { margin-top: 0.85rem; max-height: 56vh; overflow-y: auto; -webkit-overflow-scrolling: touch; border-top: 1px solid var(--barcode-taupe, #b9af9a); }
.barcode-search-results[hidden] { display: none; }
.barcode-search-row { display: flex; align-items: center; gap: 0.85rem; padding: 0.6rem 0.25rem; text-decoration: none; border-bottom: 1px solid rgba(185, 175, 154, 0.4); transition: background-color 0.15s ease; }
.barcode-search-row:last-child { border-bottom: none; }
.barcode-search-row:hover, .barcode-search-row:focus { background: rgba(201, 169, 78, 0.12); outline: none; }
.barcode-search-thumb { flex: 0 0 48px; width: 48px; height: 48px; border-radius: 6px; overflow: hidden; background: #fff; border: 1px solid var(--barcode-taupe, #b9af9a); display: flex; align-items: center; justify-content: center; }
.barcode-search-thumb img { width: 48px; height: 48px; object-fit: cover; display: block; }
.barcode-search-meta { display: flex; flex-direction: column; gap: 0.15rem; min-width: 0; }
.barcode-search-name { font-size: 0.9rem; color: var(--barcode-espresso, #3d2b1f); line-height: 1.3; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.barcode-search-price { font-size: 0.85rem; font-weight: 600; color: var(--barcode-brown, #8b6148); }
.barcode-search-msg { padding: 0.9rem 0.25rem; font-size: 0.85rem; color: var(--barcode-taupe, #b9af9a); text-align: center; }
.barcode-search-results.is-loading::before { content: "Searching\2026"; display: block; padding: 0.9rem 0.25rem; font-size: 0.85rem; color: var(--barcode-taupe, #b9af9a); text-align: center; }
.barcode-search-results.is-loading .barcode-search-row { display: none; }
@media (max-width: 960px) { .barcode-search-results { max-height: 44vh; } }

/* ── A4: sticky compact mobile header (header already sticky top:0 z:100) ── */
:root { --barcode-header-h: 64px; }
.site-header { transition: padding-top 0.22s ease, padding-bottom 0.22s ease, box-shadow 0.22s ease, background-color 0.22s ease; will-change: padding-top, padding-bottom; }
.site-header .header-logo-center img, .site-header .wp-block-site-logo img { transition: max-height 0.22s ease; }
@media (max-width: 960px) {
	body.barcode-header-stuck .site-header { padding-top: 0.4rem !important; padding-bottom: 0.4rem !important; box-shadow: 0 2px 12px rgba(61, 43, 31, 0.12); }
	body.barcode-header-stuck .site-header .header-logo-center img, body.barcode-header-stuck .site-header .wp-block-site-logo img { max-height: 64px !important; }
	/* Header is not a real sticky (its block-template-part wrapper is header-height,
	   so it scrolls away) — pin the Filter/Sort bar flush to the very top instead. */
	.barcode-shop-toolbar { top: 0 !important; }
}
@media (max-width: 480px) {
	body.barcode-header-stuck .site-header .header-logo-center img, body.barcode-header-stuck .site-header .wp-block-site-logo img { max-height: 56px !important; }
}

/* ── A5: phone validation hint ── */
.barcode-phone-hint { font-size: 0.78rem; line-height: 1.3; margin: 0.3rem 0 0.2rem; display: none; }
.barcode-phone-hint.is-invalid { display: block; color: #c0392b; }
.barcode-phone-hint.is-valid { display: block; color: var(--barcode-gold, #c8a04a); font-weight: 600; }

/* ── SALE badge → top-left so it never overlaps the wishlist heart (top-right) ── */
.wc-block-components-product-sale-badge {
	left: 12px !important;
	right: auto !important;
	top: 12px !important;
	z-index: 8; /* below the heart (z:10); opposite corners so no overlap anyway */
}
/* On the single product gallery, keep it clear of the top-right zoom/heart too */
.woocommerce-product-gallery .wc-block-components-product-sale-badge,
.product-detail-layout .wc-block-components-product-sale-badge {
	left: 12px !important;
	right: auto !important;
}

/* ── Discount % chip on every on-sale price ── */
.barcode-disc {
	display: inline-block;
	margin-left: 6px;
	background: #c0392b;
	color: #fff;
	font-size: 0.7rem;
	font-weight: 700;
	line-height: 1;
	padding: 2px 6px;
	border-radius: 4px;
	vertical-align: middle;
	letter-spacing: 0.02em;
	white-space: nowrap;
}
/* live-search rows: struck regular + sale */
.barcode-search-price del { opacity: 0.55; font-weight: 400; margin-right: 5px; }
.barcode-search-price ins { text-decoration: none; }

/* ── Homepage sale banner ── */
.barcode-sale-banner {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.7rem;
	flex-wrap: wrap;
	width: 100%;
	box-sizing: border-box;
	margin: 0 0 0.5rem;
	padding: 0.7rem 1rem;
	background: linear-gradient(90deg, var(--barcode-espresso, #3d2b1f) 0%, #51392a 100%);
	color: var(--barcode-cream, #f7f2e3);
	text-decoration: none;
	text-align: center;
	font-size: 0.95rem;
	letter-spacing: 0.01em;
	transition: filter 0.2s ease;
}
.barcode-sale-banner:hover { filter: brightness(1.07); }
.barcode-sale-banner__tag {
	background: var(--barcode-gold, #c8a04a);
	color: var(--barcode-espresso, #3d2b1f);
	font-weight: 800;
	font-size: 0.72rem;
	letter-spacing: 0.18em;
	padding: 3px 9px;
	border-radius: 4px;
}
.barcode-sale-banner__text strong { color: var(--barcode-gold, #c8a04a); font-weight: 800; }
.barcode-sale-banner__cta {
	font-weight: 700;
	letter-spacing: 0.04em;
	border-bottom: 1px solid rgba(247,242,227,0.5);
	padding-bottom: 1px;
	white-space: nowrap;
}
@media (max-width: 600px) {
	.barcode-sale-banner { font-size: 0.84rem; gap: 0.5rem; padding: 0.6rem 0.8rem; }
	.barcode-sale-banner__cta { width: 100%; }
}