/* ==========================================================
   Bynoa Theme — Main Stylesheet
   ========================================================== */

/* ----------------------------------------------------------
   CSS Custom Properties
---------------------------------------------------------- */
:root {
	--color-primary:          #0B0B0B;
	--color-primary-90:       rgba(11,11,11,.90);
	--color-primary-60:       rgba(11,11,11,.60);
	--color-primary-40:       rgba(11,11,11,.40);
	--color-primary-10:       rgba(11,11,11,.10);
	--color-primary-5:        rgba(11,11,11,.05);

	--color-accent-blush:     #E9C7C3;
	--color-accent-champagne: #D8C3A5;
	--color-white:            #ffffff;

	--color-bg-light:         #FFF9F3;
	--color-bg-dark:          #191919;
	--color-bg-white:         #ffffff;

	--font-main:              'Heebo', 'Arial', sans-serif;

	--section-padding:        70px;
	--px-section:             1rem;

	--radius-sm:   0.5rem;
	--radius-md:   1rem;
	--radius-lg:   1.5rem;
	--radius-xl:   2.5rem;
	--radius-full: 9999px;

	--shadow-sm:   0 1px 4px rgba(0,0,0,.06);
	--shadow-md:   0 4px 20px rgba(0,0,0,.10);
	--shadow-lg:   0 12px 40px rgba(0,0,0,.14);

	--transition:  0.22s ease;

	--container:   1280px;
	--gap:         clamp(1rem, 3vw, 2rem);

	/* Header heights */
	--topbar-h:    38px;
	--header-h:    68px;
}

@media (min-width: 768px) {
	:root { --px-section: 2.5rem; }
}
@media (min-width: 1024px) {
	:root { --px-section: 10rem; }
}

/* ----------------------------------------------------------
   Reset & Base
---------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html {
	font-size: 16px;
	scroll-behavior: smooth;
	-webkit-text-size-adjust: 100%;
	direction: rtl;
}

body {
	font-family: var(--font-main);
	font-size: 1rem;
	line-height: 1.7;
	color: var(--color-primary);
	background: var(--color-bg-light);
	-webkit-font-smoothing: antialiased;
}

img, video { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; transition: color var(--transition); }
ul, ol { list-style: none; }
button { cursor: pointer; font-family: inherit; border: none; background: none; }
input, textarea, select { font-family: inherit; }

::selection { background: rgba(233,199,195,.35); }

/* ----------------------------------------------------------
   Typography
---------------------------------------------------------- */
h1, h2, h3, h4, h5, h6 {
	font-family: var(--font-main);
	font-weight: 800;
	line-height: 1.15;
	color: var(--color-primary);
}

h1 { font-size: clamp(2rem, 5vw, 3.25rem); }
h2 { font-size: clamp(1.5rem, 3vw, 2.25rem); }
h3 { font-size: clamp(1rem, 2vw, 1.25rem); }
h4 { font-size: 1rem; }

p { margin-bottom: 1.25em; }
p:last-child { margin-bottom: 0; }

/* ----------------------------------------------------------
   Layout Utilities
---------------------------------------------------------- */
.container {
	width: 100%;
	max-width: var(--container);
	margin-inline: auto;
	padding-inline: var(--gap);
}

.site { display: flex; flex-direction: column; min-height: 100vh; }

.site-content {
	flex: 1;
	padding-block: calc(var(--gap) * 2);
}

/* Remove padding on front page and WooCommerce single product (sections handle their own spacing) */
.home .site-content,
.front-page-template .site-content,
.single-product .site-content,
.woocommerce .site-content {
	padding-block: 0;
}

.section-px {
	padding-inline: var(--px-section);
}

/* ----------------------------------------------------------
   Accessibility
---------------------------------------------------------- */
.skip-link {
	position: absolute;
	top: -100%;
	inset-inline-start: 1rem;
	z-index: 9999;
	background: var(--color-primary);
	color: var(--color-white);
	padding: .5rem 1rem;
	border-radius: 0 0 var(--radius-sm) var(--radius-sm);
}
.skip-link:focus { top: 0; }

.screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0,0,0,0);
	white-space: nowrap;
}

/* Material Symbols base */
.material-symbols-outlined {
	font-family: 'Material Symbols Outlined', sans-serif;
	font-style: normal;
	font-size: inherit;
	line-height: 1;
	letter-spacing: normal;
	text-transform: none;
	display: inline-block;
	white-space: nowrap;
	word-wrap: normal;
	direction: ltr;
	-webkit-font-feature-settings: 'liga';
	font-feature-settings: 'liga';
	-webkit-font-smoothing: antialiased;
	font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

/* ----------------------------------------------------------
   Buttons
---------------------------------------------------------- */
.btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .4rem;
	padding: .6rem 1.5rem;
	border-radius: var(--radius-full);
	font-family: var(--font-main);
	font-size: .875rem;
	font-weight: 700;
	text-align: center;
	cursor: pointer;
	border: 2px solid transparent;
	transition: background var(--transition), color var(--transition), border-color var(--transition),
	            transform var(--transition), box-shadow var(--transition);
	white-space: nowrap;
}

.btn--lg { padding: .8rem 2.5rem; font-size: 1rem; }
.btn--sm { padding: .45rem 1.25rem; font-size: .8rem; }

.btn--dark {
	background: var(--color-primary);
	color: var(--color-white);
	border-color: var(--color-primary);
}
.btn--dark:hover {
	background: var(--color-bg-dark);
	border-color: var(--color-bg-dark);
	color: var(--color-white);
	box-shadow: var(--shadow-md);
}

.btn--outline-dark {
	background: transparent;
	color: var(--color-primary);
	border-color: var(--color-primary);
}
.btn--outline-dark:hover {
	background: var(--color-primary);
	color: var(--color-white);
}

.btn--ghost-dark {
	background: var(--color-primary-5);
	color: var(--color-primary);
	border-color: transparent;
}
.btn--ghost-dark:hover {
	background: var(--color-primary);
	color: var(--color-white);
}

.btn--white {
	background: var(--color-white);
	color: var(--color-primary);
	border-color: var(--color-white);
}
.btn--white:hover {
	background: transparent;
	color: var(--color-white);
	border-color: var(--color-white);
}

/* ----------------------------------------------------------
   Top Bar
---------------------------------------------------------- */
.site-topbar {
	width: 100%;
	background: var(--color-primary);
	color: rgba(255,255,255,.85);
	border-bottom: 1px solid rgba(255,255,255,.1);
	padding-block: .375rem;
}

.site-topbar__inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: .5rem;
	padding-inline: var(--px-section);
}

@media (min-width: 768px) {
	.site-topbar__inner {
		flex-direction: row;
		justify-content: space-between;
	}
}

.site-topbar__text {
	font-size: .6875rem;
	font-weight: 500;
	letter-spacing: .02em;
	margin: 0;
}

.site-topbar__nav {
	display: flex;
	gap: 1.25rem;
}

.site-topbar__nav a {
	font-size: .6875rem;
	font-weight: 500;
	color: rgba(255,255,255,.8);
	transition: color var(--transition);
}
.site-topbar__nav a:hover { color: var(--color-accent-blush); }

/* ----------------------------------------------------------
   Site Header
---------------------------------------------------------- */
.site-header {
	position: sticky;
	top: 0;
	z-index: 200;                         /* above the fullscreen nav overlay */
	background: rgba(255,255,255,.96);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	border-bottom: 1px solid var(--color-primary-5);
	box-shadow: none;
	transition: box-shadow var(--transition);
}

.site-header.is-scrolled {
	box-shadow: var(--shadow-sm);
}

.site-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.25rem;
	min-height: var(--header-h);
	padding-inline: var(--px-section);
	padding-block: .625rem;
}

.site-header__start {
	display: flex;
	align-items: center;
	gap: 2.5rem;
}

.site-header__end {
	display: flex;
	align-items: center;
	gap: .75rem;
}

/* ----------------------------------------------------------
   Branding
---------------------------------------------------------- */
.site-branding {
	display: flex;
	align-items: center;
}

.site-branding a,
.site-branding .custom-logo-link {
	display: flex;
	align-items: center;
}

.site-branding__name {
	display: flex;
	align-items: center;
	gap: .4rem;
	font-size: 1.2rem;
	font-weight: 900;
	letter-spacing: -.04em;
	text-transform: uppercase;
	color: var(--color-primary);
}

.site-branding__name .material-symbols-outlined {
	font-size: 1.4rem;
}

/* Anchor the selector to #masthead so specificity beats WooCommerce's
   .woocommerce-page img { height: auto } rule (which has 0,1,1 vs our 0,1,0) */
#masthead .site-logo img,
#masthead .custom-logo {
	height: 48px;
	width: auto;
	max-width: 180px;
	object-fit: contain;
}

/* Smaller logo on mobile */
@media (max-width: 1023px) {
	#masthead .site-logo img,
	#masthead .custom-logo {
		height: 32px;
		max-width: 120px;
	}

	.site-branding__name {
		font-size: .95rem;
	}

	.site-branding__name .material-symbols-outlined {
		font-size: 1.15rem;
	}
}

/* ----------------------------------------------------------
   Shared icon button (cart, person, search toggle)
---------------------------------------------------------- */
.header-icon-btn {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2.25rem;
	height: 2.25rem;
	border-radius: var(--radius-full);
	color: var(--color-primary);
	background: transparent;
	border: none;
	cursor: pointer;
	transition: background var(--transition);
	flex-shrink: 0;
}

.header-icon-btn:hover { background: var(--color-primary-5); }

.header-icon-btn .material-symbols-outlined { font-size: 1.3rem; }

/* ----------------------------------------------------------
   Cart
---------------------------------------------------------- */
.header-cart .material-symbols-outlined { font-size: 1.3rem; }

.header-cart__badge {
	position: absolute;
	top: .25rem;
	inset-inline-end: .25rem;
	min-width: .875rem;
	height: .875rem;
	background: var(--color-accent-blush);
	border-radius: var(--radius-full);
	font-size: .5rem;
	font-weight: 900;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--color-primary);
	opacity: 0;
	transition: opacity var(--transition);
}

.header-cart__badge.is-visible { opacity: 1; }

/* ----------------------------------------------------------
   Account link
   Desktop: pill button  |  Mobile: icon only
---------------------------------------------------------- */
.header-account-link {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: .4rem;
	white-space: nowrap;
	text-decoration: none;
	color: var(--color-white);
	background: var(--color-primary);
	border-radius: var(--radius-full);
	padding: .45rem 1.1rem;
	font-size: .75rem;
	font-weight: 700;
	transition: background var(--transition), opacity var(--transition);
}

.header-account-link:hover { background: rgba(11,11,11,.85); }

.header-account-link__icon { font-size: 1rem; }

/* Hide icon on desktop (text only) — uncomment if you prefer no icon on desktop */
/* .header-account-link__icon { display: none; } */

@media (max-width: 1023px) {
	/* Icon-only on mobile — match header-icon-btn style */
	.header-account-link {
		width: 2.25rem;
		height: 2.25rem;
		padding: 0;
		background: transparent;
		color: var(--color-primary);
	}

	.header-account-link:hover { background: var(--color-primary-5); }

	.header-account-link__icon { font-size: 1.3rem; }

	.header-account-link__text {
		display: none; /* hide label, show icon only */
	}
}

/* ----------------------------------------------------------
   Desktop search
---------------------------------------------------------- */
.header-search {
	display: none;
}

@media (min-width: 1024px) {
	.header-search { display: flex; }
}

.header-search__form {
	display: flex;
	align-items: center;
	background: var(--color-primary-5);
	border-radius: var(--radius-full);
	padding: .4rem 1rem;
	gap: .25rem;
}

.header-search__icon {
	font-size: 1.1rem;
	opacity: .45;
	flex-shrink: 0;
}

.header-search__input {
	background: transparent;
	border: none;
	outline: none;
	font-size: .75rem;
	color: var(--color-primary);
	width: 8rem;
}

@media (min-width: 1280px) {
	.header-search__input { width: 10rem; }
}

.header-search__input::placeholder { color: var(--color-primary-40); }

/* ----------------------------------------------------------
   Mobile search toggle button (hidden on desktop)
---------------------------------------------------------- */
.header-mobile-search-btn {
	display: flex; /* visible on mobile by default */
}

@media (min-width: 1024px) {
	.header-mobile-search-btn { display: none; }
}

/* ----------------------------------------------------------
   Mobile search panel (drops below header bar)
---------------------------------------------------------- */
.header-mobile-search-panel {
	padding: .75rem var(--px-section);
	background: var(--color-white);
	border-top: 1px solid var(--color-primary-5);
}

.header-mobile-search-panel[hidden] { display: none; }

@media (min-width: 1024px) {
	.header-mobile-search-panel { display: none !important; }
}

.header-mobile-search-panel form {
	display: flex;
	align-items: center;
	background: var(--color-primary-5);
	border-radius: var(--radius-full);
	padding: .5rem 1rem;
	gap: .4rem;
}

.header-mobile-search-panel .material-symbols-outlined {
	font-size: 1.1rem;
	opacity: .45;
	flex-shrink: 0;
}

.header-mobile-search-panel__input {
	flex: 1;
	background: transparent;
	border: none;
	outline: none;
	font-size: .875rem;
	font-family: var(--font-main);
	color: var(--color-primary);
}

.header-mobile-search-panel__input::placeholder { color: var(--color-primary-40); }

/* ----------------------------------------------------------
   Main Navigation
---------------------------------------------------------- */
.main-navigation { display: flex; align-items: center; }

.nav-menu {
	display: none;
	align-items: center;
	gap: .15rem;
}

@media (min-width: 1024px) {
	.nav-menu { display: flex; }
}

.nav-menu li { position: relative; }

.nav-menu a {
	display: block;
	padding: .45rem .75rem;
	font-size: .75rem;
	font-weight: 700;
	color: var(--color-primary);
	border-radius: var(--radius-sm);
	transition: color var(--transition), background var(--transition);
}

.nav-menu a:hover,
.nav-menu .current-menu-item > a,
.nav-menu .current-page-ancestor > a {
	color: var(--color-accent-blush);
}

/* Desktop dropdown */
.nav-menu .sub-menu {
	position: absolute;
	top: calc(100% + .5rem);
	inset-inline-start: 0;
	min-width: 200px;
	background: var(--color-white);
	border: 1px solid var(--color-primary-10);
	border-radius: var(--radius-md);
	box-shadow: var(--shadow-md);
	padding: .5rem;
	opacity: 0;
	visibility: hidden;
	transform: translateY(6px);
	transition: all var(--transition);
	z-index: 200;
}

.nav-menu li:hover > .sub-menu,
.nav-menu li:focus-within > .sub-menu {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

.nav-menu .sub-menu a {
	padding: .5rem .8rem;
	border-radius: var(--radius-sm);
	font-size: .8rem;
}

/* ----------------------------------------------------------
   Mobile toggle (hamburger)
---------------------------------------------------------- */
.menu-toggle {
	display: flex;
	flex-direction: column;
	gap: 5px;
	padding: .5rem;
	border-radius: var(--radius-sm);
	background: transparent;
	border: none;
	cursor: pointer;
	transition: background var(--transition);
}

.menu-toggle:hover { background: var(--color-primary-5); }

@media (min-width: 1024px) {
	.menu-toggle { display: none; }
}

.menu-toggle__bar {
	display: block;
	width: 20px;
	height: 2px;
	background: var(--color-primary);
	border-radius: 2px;
	transition: transform var(--transition), opacity var(--transition);
}

.menu-toggle[aria-expanded="true"] .menu-toggle__bar:nth-child(1) {
	transform: translateY(7px) rotate(45deg);
}
.menu-toggle[aria-expanded="true"] .menu-toggle__bar:nth-child(2) {
	opacity: 0;
}
.menu-toggle[aria-expanded="true"] .menu-toggle__bar:nth-child(3) {
	transform: translateY(-7px) rotate(-45deg);
}

/* ----------------------------------------------------------
   Mobile full-screen nav OVERLAY
   Lives OUTSIDE <header> (sibling) to escape the backdrop-filter
   stacking-context that prevents position:fixed from covering
   the full viewport when it's a descendant of that element.
---------------------------------------------------------- */
.mobile-nav-overlay {
	/* Hidden by default — JS adds .is-open to show */
	display: none;

	/* Cover every pixel of the viewport */
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	height: 100%;

	z-index: 9999; /* guaranteed above everything */
	background: var(--color-primary);

	flex-direction: column;
	align-items: center;
	justify-content: center;
	overflow-y: auto;
	padding: 5rem 2rem 3rem; /* room for the close button at top */

	/* Smooth fade-in */
	animation: none;
}

.mobile-nav-overlay.is-open {
	display: flex;
}

/* Never show on desktop */
@media (min-width: 1024px) {
	.mobile-nav-overlay {
		display: none !important;
	}
}

/* ── Close button ── */
.mobile-nav-close {
	position: absolute;
	top: 1.25rem;
	inset-inline-start: 1.25rem; /* left in RTL */
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2.75rem;
	height: 2.75rem;
	background: rgba(255, 255, 255, .08);
	border: 1px solid rgba(255, 255, 255, .15);
	border-radius: var(--radius-full);
	color: var(--color-white);
	cursor: pointer;
	transition: background var(--transition);
}

.mobile-nav-close:hover {
	background: rgba(255, 255, 255, .16);
}

.mobile-nav-close .material-symbols-outlined {
	font-size: 1.4rem;
}

/* ── Nav items inside the overlay ── */
.mobile-nav-menu {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0;
	width: 100%;
}

.mobile-nav-menu li {
	width: 100%;
	text-align: center;
}

/* Top-level links — 26px, white, centered */
.mobile-nav-menu > li > a {
	display: block;
	font-size: 1.625rem; /* 26px */
	font-weight: 700;
	color: var(--color-white);
	padding: .6rem 1.5rem;
	letter-spacing: -.02em;
	transition: color var(--transition);
}

.mobile-nav-menu > li > a:hover,
.mobile-nav-menu > li.current-menu-item > a {
	color: var(--color-accent-blush);
}

/* Sub-menu — smaller, muted */
.mobile-nav-menu .sub-menu {
	list-style: none;
	margin: 0;
	padding: 0 0 .5rem;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.mobile-nav-menu .sub-menu a {
	display: block;
	font-size: 1rem;
	color: rgba(255, 255, 255, .5);
	padding: .35rem 1rem;
	transition: color var(--transition);
}

.mobile-nav-menu .sub-menu a:hover {
	color: var(--color-accent-blush);
}

/* Prevent body scroll while overlay is open */
body.nav-is-open {
	overflow: hidden;
}

/* ----------------------------------------------------------
   Front-Page: Section helpers
---------------------------------------------------------- */
.front-page .section-heading {
	font-size: clamp(1.4rem, 3vw, 2rem);
	font-weight: 900;
	color: var(--color-primary);
	margin-bottom: .5rem;
}

.front-page .section-heading--center { text-align: center; }

.front-page .section-heading--white { color: var(--color-white); }

.front-page .section-subheading {
	font-size: .75rem;
	font-weight: 500;
	color: var(--color-primary-60);
	margin-bottom: 0;
}

.front-page .section-subheading--center { text-align: center; }

.front-page .section-link {
	font-size: .75rem;
	font-weight: 700;
	color: var(--color-primary);
	border-bottom: 1.5px solid var(--color-accent-blush);
	padding-bottom: .1rem;
	transition: color var(--transition);
}
.front-page .section-link:hover { color: var(--color-accent-blush); }

.section-bg-white    { background: var(--color-bg-white); }
.section-bg-subtle   { background: rgba(255,249,243,.35); }
.section-border-top  { border-top: 1px solid var(--color-primary-5); }

/* ----------------------------------------------------------
   Hero Section
---------------------------------------------------------- */
.section-hero {
	background: var(--color-bg-light);
	overflow: hidden;
	padding-block: var(--section-padding);
}

.section-hero__inner {
	display: grid;
	gap: 2.5rem;
	align-items: center;
}

@media (min-width: 1024px) {
	.section-hero__inner {
		grid-template-columns: 1fr 1fr;
	}
}

/* Content side */
.hero-content { z-index: 1; order: 2; }

@media (min-width: 1024px) { .hero-content { order: 1; } }

.hero-content__heading {
	font-size: clamp(2.2rem, 4.5vw, 3.5rem);
	font-weight: 900;
	line-height: 1.1;
	margin-bottom: .75rem;
	letter-spacing: -.02em;
}

.hero-content__heading-accent {
	color: var(--color-accent-champagne);
}

.hero-content__paragraph {
	font-size: 1rem;
	color: var(--color-primary-60);
	max-width: 34rem;
	line-height: 1.7;
	font-weight: 400;
	margin-bottom: 1.5rem;
}

.hero-content__buttons {
	display: flex;
	flex-wrap: wrap;
	gap: .75rem;
	margin-bottom: 2rem;
}

.hero-content__badges {
	display: flex;
	flex-wrap: wrap;
	gap: 1.5rem;
	opacity: .6;
}

.hero-badge {
	display: flex;
	align-items: center;
	gap: .4rem;
}

.hero-badge__icon { font-size: 1.1rem; }
.hero-badge__text { font-size: .75rem; font-weight: 700; }

/* Image side */
.hero-image {
	position: relative;
	order: 1;
	height: 260px;
}

@media (min-width: 1024px) {
	.hero-image {
		order: 2;
		height: 380px;
	}
}

.hero-image__deco {
	position: absolute;
	inset: 0;
	background: rgba(233,199,195,.22);
	border-radius: var(--radius-xl);
	transform: rotate(2deg) translateX(.75rem);
}

.hero-image__frame {
	position: absolute;
	inset: 0;
	background: var(--color-white);
	border-radius: var(--radius-xl);
	overflow: hidden;
	box-shadow: var(--shadow-lg);
}

.hero-image__frame img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* ----------------------------------------------------------
   Categories Section
---------------------------------------------------------- */
.section-categories {
	padding-block: var(--section-padding);
}

.section-categories .section-heading--center {
	margin-bottom: 2.5rem;
}

.categories-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: .75rem;
}

@media (min-width: 1024px) {
	.categories-grid { grid-template-columns: repeat(3, 1fr); }
}

.cat-card {
	position: relative;
	height: 14rem;
	overflow: hidden;
	border-radius: var(--radius-md);
	display: block;
}

.cat-card__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .5s ease;
}

.cat-card:hover .cat-card__img { transform: scale(1.05); }

.cat-card__overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(11,11,11,.7) 0%, transparent 55%);
}

.cat-card__label {
	position: absolute;
	bottom: 1rem;
	inset-inline-end: 1rem;
	color: var(--color-white);
	text-align: start;
}

.cat-card__name {
	font-size: 1.1rem;
	font-weight: 700;
	color: var(--color-white);
	margin-bottom: .1rem;
}

.cat-card__badge {
	font-size: .55rem;
	opacity: .75;
	text-transform: uppercase;
	letter-spacing: .1em;
	font-weight: 700;
}

/* ----------------------------------------------------------
   Best Sellers Section
---------------------------------------------------------- */
.section-bestsellers {
	padding-block: var(--section-padding);
	background: var(--color-bg-light);
}

.section-bestsellers__header {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	margin-bottom: 2.5rem;
}

.products-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1rem;
}

@media (min-width: 1024px) {
	.products-grid { grid-template-columns: repeat(4, 1fr); }
}

.product-card { display: flex; flex-direction: column; }

.product-card__image-wrap {
	position: relative;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	border-radius: var(--radius-md);
	background: var(--color-white);
	margin-bottom: .5rem;
	box-shadow: var(--shadow-sm);
	display: block;
}

.product-card__image {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .5s ease;
}

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

.product-card__badge {
	position: absolute;
	top: .5rem;
	inset-inline-start: .5rem;
	background: var(--color-accent-blush);
	color: var(--color-primary);
	font-size: .5rem;
	font-weight: 900;
	padding: .2rem .5rem;
	border-radius: var(--radius-sm);
	letter-spacing: .05em;
}

.product-card__name {
	font-size: .875rem;
	font-weight: 700;
	margin-bottom: .2rem;
}

.product-card__name a { color: var(--color-primary); }
.product-card__name a:hover { color: var(--color-primary-60); }

.product-card__desc {
	font-size: .625rem;
	color: var(--color-primary-40);
	margin-bottom: .5rem;
	font-weight: 400;
}

.product-card__price {
	font-size: .875rem;
	font-weight: 700;
	margin-bottom: .5rem;
}

.product-card__price .woocommerce-Price-amount { color: var(--color-primary); }

.product-card__btn {
	width: 100%;
	font-size: .6rem;
	padding: .4rem .75rem;
	margin-top: auto;
}

/* ----------------------------------------------------------
   Business Partner Section
---------------------------------------------------------- */
.section-partner {
	background: var(--color-primary);
	color: rgba(255,255,255,.9);
	padding-block: var(--section-padding);
}

.section-partner__inner {
	display: grid;
	gap: 2.5rem;
	align-items: center;
}

@media (min-width: 1024px) {
	.section-partner__inner { grid-template-columns: 1fr 1fr; }
}

.partner-text .section-heading--white { margin-bottom: 1.5rem; }

.partner-text__accent { color: var(--color-accent-blush); }

.partner-features {
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

.partner-feature {
	display: flex;
	gap: .75rem;
	align-items: flex-start;
}

.partner-feature__icon {
	color: var(--color-accent-champagne);
	font-size: 1.2rem;
	flex-shrink: 0;
	margin-top: .1rem;
}

.partner-feature__title {
	display: block;
	font-size: .875rem;
	font-weight: 700;
	color: var(--color-white);
	margin-bottom: .2rem;
}

.partner-feature__text {
	font-size: .6875rem;
	opacity: .7;
	font-weight: 400;
	margin: 0;
}

.partner-stats {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: .75rem;
}

.partner-stat {
	background: rgba(255,255,255,.05);
	border: 1px solid rgba(255,255,255,.1);
	border-radius: var(--radius-md);
	padding: 1.25rem;
	text-align: center;
}

.partner-stat__value {
	font-size: 1.75rem;
	font-weight: 900;
	color: var(--color-accent-blush);
	margin-bottom: .2rem;
	line-height: 1;
}

.partner-stat__label {
	font-size: .5rem;
	text-transform: uppercase;
	letter-spacing: .15em;
	opacity: .6;
	font-weight: 700;
	margin: 0;
}

/* ----------------------------------------------------------
   How It Works Section
---------------------------------------------------------- */
.section-hiw {
	padding-block: var(--section-padding);
}

.section-hiw .section-heading--center {
	margin-bottom: 3rem;
}

.hiw-steps {
	position: relative;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1.5rem;
}

@media (min-width: 768px) {
	.hiw-steps {
		grid-template-columns: repeat(var(--steps-count, 4), 1fr);
	}
}

.hiw-steps__line {
	display: none;
}

@media (min-width: 768px) {
	.hiw-steps__line {
		display: block;
		position: absolute;
		top: 1.4rem;
		inset-inline-start: 10%;
		inset-inline-end: 10%;
		height: 1px;
		background: rgba(216,195,165,.3);
		z-index: 0;
	}
}

.hiw-step {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	position: relative;
	z-index: 1;
}

.hiw-step__number {
	width: 2.75rem;
	height: 2.75rem;
	border-radius: var(--radius-full);
	background: var(--color-primary);
	color: var(--color-white);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.1rem;
	font-weight: 900;
	margin-bottom: .75rem;
	box-shadow: var(--shadow-lg);
	ring-offset-width: 4px;
	outline: 4px solid var(--color-white);
	outline-offset: 2px;
}

.hiw-step__title {
	font-size: .875rem;
	font-weight: 900;
	margin-bottom: .35rem;
}

.hiw-step__text {
	font-size: .625rem;
	color: var(--color-primary-60);
	margin: 0;
}

/* ----------------------------------------------------------
   Who Is It For Section
---------------------------------------------------------- */
.section-for {
	padding-block: var(--section-padding);
	border-top: 1px solid var(--color-primary-5);
}

.section-for__header {
	text-align: center;
	margin-bottom: 2.5rem;
}

.for-cards {
	display: grid;
	grid-template-columns: repeat(1, 1fr);
	gap: 1rem;
}

@media (min-width: 768px) {
	.for-cards { grid-template-columns: repeat(2, 1fr); }
}

@media (min-width: 1024px) {
	.for-cards { grid-template-columns: repeat(4, 1fr); }
}

.for-card {
	background: var(--color-white);
	padding: 1.25rem;
	border-radius: var(--radius-md);
	border: 1px solid var(--color-primary-5);
	box-shadow: var(--shadow-sm);
	transition: box-shadow var(--transition);
	text-align: start;
}

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

.for-card__icon-wrap {
	width: 2.5rem;
	height: 2.5rem;
	background: var(--color-bg-light);
	border-radius: var(--radius-sm);
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: .75rem;
	transition: background var(--transition);
}

.for-card:hover .for-card__icon-wrap {
	background: rgba(233,199,195,.25);
}

.for-card__icon { font-size: 1.2rem; }

.for-card__title {
	font-size: 1rem;
	font-weight: 700;
	margin-bottom: .5rem;
}

.for-card__text {
	font-size: .6875rem;
	color: var(--color-primary-60);
	line-height: 1.6;
	margin: 0;
}

/* ----------------------------------------------------------
   Inspiration Gallery Section
---------------------------------------------------------- */
.section-insp {
	padding-block: var(--section-padding);
}

.section-insp__header {
	margin-bottom: 2.5rem;
}

.insp-gallery {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: .5rem;
}

@media (min-width: 768px) {
	.insp-gallery { grid-template-columns: repeat(4, 1fr); }
}

.insp-gallery__item {
	aspect-ratio: 4 / 5;
	overflow: hidden;
	border-radius: var(--radius-md);
}

.insp-gallery__item--offset {
	transform: translateY(.75rem);
}

.insp-gallery__item img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* ----------------------------------------------------------
   FAQ Section
---------------------------------------------------------- */
.section-faq {
	padding-block: var(--section-padding);
}

.section-faq__inner {
	max-width: 48rem;
	margin-inline: auto;
}

.section-faq__inner .section-heading--center {
	margin-bottom: 3rem;
}

.faq-list {
	display: flex;
	flex-direction: column;
	gap: .5rem;
	margin-bottom: 2.5rem;
}

.faq-item {
	background: var(--color-bg-light);
	border-radius: var(--radius-md);
	overflow: hidden;
}

.faq-item__question {
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 1rem 1.25rem;
	font-size: .875rem;
	font-weight: 700;
	color: var(--color-primary);
	text-align: start;
	cursor: pointer;
	transition: background var(--transition);
	gap: 1rem;
}

.faq-item__question:hover { background: rgba(233,199,195,.15); }

.faq-item__icon {
	font-size: 1.1rem;
	flex-shrink: 0;
	transition: transform var(--transition);
}

.faq-item__question[aria-expanded="true"] .faq-item__icon {
	transform: rotate(180deg);
}

.faq-item__answer {
	overflow: hidden;
}

.faq-item__answer[hidden] { display: none; }

.faq-item__answer-inner {
	padding: 0 1.25rem 1.25rem;
	font-size: .75rem;
	color: var(--color-primary-60);
	line-height: 1.7;
}

.section-faq__footer {
	text-align: center;
}

/* ----------------------------------------------------------
   CTA Section
---------------------------------------------------------- */
.section-cta {
	background: var(--color-accent-blush);
	padding-block: var(--section-padding);
}

.section-cta__inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: space-between;
	gap: 1.5rem;
	text-align: center;
}

@media (min-width: 768px) {
	.section-cta__inner {
		flex-direction: row;
		text-align: start;
	}
}

.cta-text__heading {
	color: var(--color-primary) !important;
	margin-bottom: .25rem;
}

.cta-text__sub {
	font-size: .875rem;
	opacity: .8;
	font-weight: 500;
	margin: 0;
	color: var(--color-primary);
}

/* ----------------------------------------------------------
   Site Footer
---------------------------------------------------------- */
.site-footer {
	background: var(--color-primary);
	color: rgba(255,255,255,.9);
	padding-top: 4rem;
	padding-bottom: 2rem;
}

.footer-main {
	display: grid;
	grid-template-columns: 1fr;
	gap: 2rem;
	padding-inline: var(--px-section);
	margin-bottom: 3rem;
}

@media (min-width: 768px) {
	.footer-main { grid-template-columns: repeat(4, 1fr); }
}

/* Footer brand */
.footer-brand__name {
	display: flex;
	align-items: center;
	gap: .4rem;
	font-size: 1.2rem;
	font-weight: 900;
	letter-spacing: -.04em;
	text-transform: uppercase;
	color: var(--color-white);
	margin-bottom: 1rem;
}

.footer-brand__logo {
	margin-bottom: 1rem;
}

.footer-brand__logo img {
	height: 44px;
	width: auto;
	filter: brightness(0) invert(1);
}

.footer-brand__info p {
	font-size: .6875rem;
	opacity: .7;
	margin-bottom: .35rem;
	line-height: 1.5;
}

.footer-brand__info p:last-child { margin-bottom: 0; }

/* Footer columns */
.footer-col__title {
	font-size: .875rem;
	font-weight: 900;
	color: var(--color-white);
	margin-bottom: 1rem;
}

.footer-links {
	display: flex;
	flex-direction: column;
	gap: .5rem;
}

.footer-links a {
	font-size: .6875rem;
	opacity: .7;
	transition: color var(--transition), opacity var(--transition);
}

.footer-links a:hover {
	opacity: 1;
	color: var(--color-accent-blush);
}

.footer-wholesale-note {
	margin-top: .75rem;
	font-size: .6875rem;
	color: var(--color-accent-champagne);
	font-weight: 700;
}

/* Footer bottom */
.footer-bottom {
	border-top: 1px solid rgba(255,255,255,.1);
	padding-top: 1.25rem;
	padding-inline: var(--px-section);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
}

@media (min-width: 768px) {
	.footer-bottom { flex-direction: row; }
}

.footer-copyright {
	font-size: .5625rem;
	opacity: .4;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .1em;
	margin: 0;
}

/* Footer social */
.footer-social {
	display: flex;
	gap: 1rem;
	align-items: center;
}

.footer-social__link {
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: .4;
	transition: opacity var(--transition);
}

.footer-social__link:hover { opacity: 1; }

.footer-social__link svg {
	width: 1rem;
	height: 1rem;
	fill: var(--color-white);
}

/* ----------------------------------------------------------
   Floating WhatsApp Button
---------------------------------------------------------- */
.whatsapp-float {
	position: fixed;
	bottom: 1.5rem;
	inset-inline-start: 1.5rem;
	z-index: 1000;
	width: 3.25rem;
	height: 3.25rem;
	background: #25D366;
	border-radius: var(--radius-full);
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 4px 20px rgba(37,211,102,.4);
	transition: transform var(--transition), box-shadow var(--transition);
}

.whatsapp-float:hover {
	transform: scale(1.08);
	box-shadow: 0 6px 28px rgba(37,211,102,.55);
}

.whatsapp-float svg {
	width: 1.75rem;
	height: 1.75rem;
	fill: var(--color-white);
}

/* ----------------------------------------------------------
   Inner Pages — Basic Content
---------------------------------------------------------- */
.site-main:not(.front-page) {
	padding-block: calc(var(--gap) * 2);
}

.content-area {
	display: grid;
	gap: var(--gap);
}

.content-area.has-sidebar {
	grid-template-columns: 1fr 300px;
	align-items: start;
}

@media (max-width: 900px) {
	.content-area.has-sidebar { grid-template-columns: 1fr; }
}

/* ----------------------------------------------------------
   Posts Grid & Card
---------------------------------------------------------- */
.posts-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr));
	gap: var(--gap);
}

.post-card {
	background: var(--color-bg-white);
	border: 1px solid var(--color-primary-10);
	border-radius: var(--radius-md);
	overflow: hidden;
	box-shadow: var(--shadow-sm);
	transition: transform var(--transition), box-shadow var(--transition);
	display: flex;
	flex-direction: column;
}

.post-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); }

.post-card__thumbnail { aspect-ratio: 16/9; overflow: hidden; }

.post-card__thumbnail img {
	width: 100%; height: 100%; object-fit: cover;
	transition: transform .4s ease;
}
.post-card:hover .post-card__thumbnail img { transform: scale(1.05); }

.post-card__body {
	display: flex; flex-direction: column; flex: 1;
	padding: 1.5rem; gap: 1rem;
}

.post-card__meta {
	display: flex; align-items: center; gap: .75rem; flex-wrap: wrap;
	font-size: .8rem; color: var(--color-primary-60);
}

.post-card__title { font-size: 1.1rem; line-height: 1.3; }
.post-card__title a { color: var(--color-primary); }
.post-card__title a:hover { color: var(--color-primary-60); }
.post-card__excerpt { color: var(--color-primary-60); font-size: .9rem; }

/* ----------------------------------------------------------
   Entry styles (pages, posts)
---------------------------------------------------------- */
.entry-header { margin-bottom: 2rem; }
.entry-title { margin-bottom: .5rem; }

.entry-thumbnail {
	margin-bottom: 2rem;
	border-radius: var(--radius-md);
	overflow: hidden;
}

.entry-content {
	font-size: 1.05rem;
	line-height: 1.8;
}

.entry-content h2, .entry-content h3, .entry-content h4 {
	margin-top: 2rem;
	margin-bottom: .75rem;
}

.entry-content p,
.entry-content ul,
.entry-content ol { margin-bottom: 1.25rem; }

.entry-content ul { list-style: disc; padding-inline-start: 1.5rem; }
.entry-content ol { list-style: decimal; padding-inline-start: 1.5rem; }

/* ----------------------------------------------------------
   Page Header
---------------------------------------------------------- */
.page-header {
	margin-bottom: calc(var(--gap) * 1.5);
	padding-bottom: 1.5rem;
	border-bottom: 1px solid var(--color-primary-10);
}

.page-title { font-size: clamp(1.6rem, 4vw, 2.4rem); }

/* ----------------------------------------------------------
   Sidebar & Widgets
---------------------------------------------------------- */
.widget-area { display: flex; flex-direction: column; gap: 2rem; }

.widget {
	background: var(--color-bg-light);
	border: 1px solid var(--color-primary-10);
	border-radius: var(--radius-md);
	padding: 1.5rem;
}

.widget-title {
	font-size: 1rem;
	font-weight: 700;
	color: var(--color-primary);
	padding-bottom: .75rem;
	margin-bottom: 1rem;
	border-bottom: 2px solid var(--color-accent-champagne);
}

/* ----------------------------------------------------------
   Search Form
---------------------------------------------------------- */
.search-form { display: flex; gap: .5rem; max-width: 480px; }

.search-field {
	flex: 1;
	padding: .65rem 1rem;
	border: 1px solid var(--color-primary-10);
	border-radius: var(--radius-sm);
	font-family: inherit;
	font-size: .95rem;
	color: var(--color-primary);
	background: var(--color-bg-white);
	transition: border-color var(--transition);
}

.search-field:focus {
	outline: none;
	border-color: var(--color-accent-champagne);
}

.search-submit {
	padding: .65rem 1.25rem;
	background: var(--color-primary);
	color: var(--color-white);
	border-radius: var(--radius-sm);
	font-weight: 700;
	font-size: .9rem;
	transition: background var(--transition);
}

.search-submit:hover { background: var(--color-bg-dark); }

/* ----------------------------------------------------------
   404 Page
---------------------------------------------------------- */
.error-404 { text-align: center; padding-block: 5rem; }

.error-404 .page-title {
	font-size: clamp(5rem, 15vw, 10rem);
	font-weight: 900;
	color: var(--color-primary-10);
	line-height: 1;
	margin-bottom: 1rem;
}

.error-404 .page-content { max-width: 500px; margin-inline: auto; }

/* ----------------------------------------------------------
   Navigation
---------------------------------------------------------- */
.post-navigation {
	margin-top: 3rem;
	padding-top: 2rem;
	border-top: 1px solid var(--color-primary-10);
}

.post-navigation .nav-links {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1rem;
}

@media (max-width: 600px) {
	.post-navigation .nav-links { grid-template-columns: 1fr; }
}

.post-navigation .nav-previous,
.post-navigation .nav-next {
	background: var(--color-bg-light);
	border: 1px solid var(--color-primary-10);
	border-radius: var(--radius-md);
	padding: 1.25rem;
	transition: box-shadow var(--transition);
}

.post-navigation .nav-next { text-align: end; }
.post-navigation a { color: var(--color-primary); }
.post-navigation .nav-previous:hover,
.post-navigation .nav-next:hover { box-shadow: var(--shadow-sm); }

.nav-label {
	display: block;
	font-size: .75rem;
	text-transform: uppercase;
	letter-spacing: .08em;
	color: var(--color-primary-60);
	font-weight: 600;
	margin-bottom: .25rem;
}

.nav-title { font-weight: 700; }

/* ----------------------------------------------------------
   WooCommerce overrides
---------------------------------------------------------- */
.woocommerce-main { padding-block: calc(var(--gap) * 2); }

.woocommerce ul.products li.product .price { color: var(--color-primary); font-weight: 700; }

.woocommerce a.button,
.woocommerce button.button,
.woocommerce .button {
	background: var(--color-primary) !important;
	color: var(--color-white) !important;
	border-radius: var(--radius-full) !important;
	font-family: var(--font-main) !important;
	font-weight: 700 !important;
	font-size: .875rem !important;
	padding: .6rem 1.5rem !important;
	border: 2px solid var(--color-primary) !important;
	transition: background var(--transition) !important;
}

.woocommerce a.button:hover,
.woocommerce button.button:hover {
	background: var(--color-bg-dark) !important;
	border-color: var(--color-bg-dark) !important;
	color: var(--color-white) !important;
}

/* ----------------------------------------------------------
   RTL Fixes
---------------------------------------------------------- */
.rtl .alignfull { transform: translateX(50%); }

/* ----------------------------------------------------------
   Responsive Misc
---------------------------------------------------------- */
@media (max-width: 600px) {
	.hiw-steps { grid-template-columns: 1fr 1fr; }
	.for-cards { grid-template-columns: 1fr; }
	.insp-gallery { grid-template-columns: repeat(2, 1fr); }
}

/* ----------------------------------------------------------
   Alignment utilities
---------------------------------------------------------- */
.alignleft  { float: inline-start; margin-inline-end: 1.5rem; margin-bottom: 1rem; }
.alignright { float: inline-end;   margin-inline-start: 1.5rem; margin-bottom: 1rem; }
.aligncenter { margin-inline: auto; text-align: center; }
.alignwide  { max-width: calc(var(--container) + 4rem); margin-inline: auto; }
.alignfull  { width: 100vw; position: relative; inset-inline-start: 50%; transform: translateX(-50%); }

/* Page Links */
.page-links {
	display: flex; gap: .5rem; margin-top: 1.5rem; flex-wrap: wrap; font-size: .9rem;
}

/* ==========================================================
   Product Page
   ========================================================== */

/* ----------------------------------------------------------
   Breadcrumb
---------------------------------------------------------- */
.breadcrumb {
	padding-top: 2rem;
	padding-bottom: 1rem;
}

.breadcrumb__inner {
	display: flex;
	align-items: center;
	gap: .35rem;
	flex-wrap: wrap;
	font-size: .6875rem;
	font-weight: 500;
	color: var(--color-primary-60);
}

.breadcrumb__link {
	color: var(--color-primary-60);
	transition: color var(--transition);
}
.breadcrumb__link:hover { color: var(--color-primary); }

.breadcrumb__sep {
	font-size: .75rem;
	opacity: .5;
}

.breadcrumb__current {
	color: var(--color-primary);
	font-weight: 600;
}

/* WooCommerce native breadcrumb override */
.woocommerce-breadcrumb {
	display: flex;
	align-items: center;
	gap: .35rem;
	flex-wrap: wrap;
	font-size: .6875rem;
	font-weight: 500;
	color: var(--color-primary-60);
	background: none;
	padding: 0;
	margin: 0;
}

/* ----------------------------------------------------------
   Product Main Layout
---------------------------------------------------------- */
.product-main {
	padding-block: var(--section-padding);
}

.product-main__inner {
	display: grid;
	gap: 3rem; /* gap-12 */
}

@media (min-width: 1024px) {
	.product-main__inner {
		grid-template-columns: 1fr 1fr;
		gap: 5rem; /* lg:gap-20 */
		align-items: start;
	}
}

/* ----------------------------------------------------------
   Product Gallery
   Design: flex-col gap-4 | main=aspect-square rounded-2xl | thumbs=grid-cols-4 gap-4 rounded-lg
---------------------------------------------------------- */
.product-gallery {
	display: flex;
	flex-direction: column;
	gap: 1rem; /* gap-4 */
}

/* Main image */
.product-gallery__main-wrap {
	position: relative;
	width: 100%;
	aspect-ratio: 1 / 1;
	background: var(--color-white);
	border-radius: 1rem;                       /* rounded-2xl */
	overflow: hidden;
	border: 1px solid rgba(11,11,11,.05);      /* border-primary/5 */
	box-shadow: 0 1px 3px rgba(0,0,0,.06);
}

.product-gallery__main-img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: opacity .18s ease;
}

/* Thumbnails grid */
.product-gallery__thumbs {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1rem; /* gap-4 */
}

/* Each thumbnail — <button> reset + design styles */
.product-gallery__thumb {
	display: block;             /* override button inline default */
	position: relative;
	width: 100%;
	aspect-ratio: 1 / 1;
	background: var(--color-white);
	border-radius: 1rem;        /* rounded-lg (custom config = 1rem) */
	overflow: hidden;
	border: 1px solid rgba(11,11,11,.05);  /* border border-primary/5 */
	box-shadow: none;
	cursor: pointer;
	opacity: .7;
	padding: 0;
	transition: border-color var(--transition), opacity var(--transition), box-shadow var(--transition);
}

.product-gallery__thumb:hover:not(.is-active) {
	border-color: var(--color-accent-blush);
	opacity: .9;
}

/* Active thumbnail — border-2 border-primary shadow-sm */
.product-gallery__thumb.is-active {
	border: 2px solid var(--color-primary);
	opacity: 1;
	box-shadow: 0 1px 3px rgba(0,0,0,.06);
}

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


/* ----------------------------------------------------------
   Product Info Column
   Design: flex flex-col (no explicit gap — each child has margin-bottom)
---------------------------------------------------------- */
.product-info {
	display: flex;
	flex-direction: column;
}

.product-info__header {
	display: flex;
	flex-direction: column;
	gap: .5rem;
	margin-bottom: 1.5rem; /* mb-6 */
}

.product-b2b-badge {
	font-size: .6875rem;
	font-weight: 900;
	color: var(--color-accent-champagne);
	text-transform: uppercase;
	letter-spacing: .12em;
	margin: 0;
}

.product-info__title {
	font-size: clamp(1.6rem, 3vw, 2.25rem);
	font-weight: 900;
	line-height: 1.15;
	margin: 0;
}

.product-info__sku {
	font-size: .6875rem;
	font-weight: 700;
	color: var(--color-primary-40);
	margin: 0;
}

.product-info__short-desc {
	font-size: 1rem;
	color: var(--color-primary-60);
	line-height: 1.7;
	max-width: 34rem;
}

.product-info__short-desc p { margin-bottom: .75em; }
.product-info__short-desc p:last-child { margin-bottom: 0; }

/* ----------------------------------------------------------
   Price / Cart Panel
---------------------------------------------------------- */
.product-panel {
	background: var(--color-white);
	border: 1px solid rgba(11,11,11,.05);  /* border-primary/5 */
	border-radius: 1rem;                   /* rounded-2xl */
	padding: 1.5rem;
	box-shadow: 0 1px 3px rgba(0,0,0,.06);
	display: flex;
	flex-direction: column;
	gap: 1rem;
	margin-bottom: 2rem;
}

/* Price (logged in) */
.product-panel__price {
	font-size: 1.5rem;
	font-weight: 900;
	color: var(--color-primary);
}

.product-panel__price .woocommerce-Price-amount { color: var(--color-primary); }
.product-panel__price del { opacity: .4; font-size: 1rem; margin-inline-start: .5rem; }

/* Out of stock */
.product-panel__out-of-stock {
	text-align: center;
	font-size: .875rem;
	font-weight: 700;
	color: var(--color-primary-60);
	padding: .75rem;
	background: var(--color-bg-light);
	border-radius: var(--radius-md);
}

/* Lock badge (not logged in) */
.product-panel__lock-badge {
	display: inline-flex;
	align-items: center;
	gap: .4rem;
	background: rgba(233,199,195,.25);
	color: var(--color-accent-blush);
	border-radius: var(--radius-full);
	padding: .3rem .9rem;
	font-size: .6875rem;
	font-weight: 900;
	align-self: flex-start;
}

.product-panel__lock-badge .material-symbols-outlined {
	font-size: 1rem;
}

/* Locked state overlay */
.product-panel__locked-actions {
	opacity: .4;
	pointer-events: none;
	filter: grayscale(1);
}

/* Lock note */
.product-panel__lock-note {
	font-size: .625rem;
	text-align: center;
	color: var(--color-primary-40);
	font-weight: 500;
	margin: 0;
}

/* ----------------------------------------------------------
   Cart Form Row
---------------------------------------------------------- */
.product-cart-form { display: flex; flex-direction: column; gap: 1rem; }

.product-cart-form__qty-row {
	display: flex;
	align-items: center;
	gap: 1rem;
	flex-wrap: wrap;
}

.product-cart-form__qty-row--disabled {
	opacity: .4;
	pointer-events: none;
}

.product-cart-form__qty-label {
	font-size: .75rem;
	font-weight: 700;
}

.product-cart-form__moq {
	font-size: .625rem;
	font-weight: 500;
	color: var(--color-primary-60);
}

/* ----------------------------------------------------------
   Quantity Stepper
---------------------------------------------------------- */
.qty-stepper {
	display: flex;
	align-items: center;
	background: var(--color-bg-light);
	border: 1px solid var(--color-primary-10);
	border-radius: var(--radius-full);
	overflow: hidden;
}

.qty-stepper__btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2.2rem;
	height: 2.2rem;
	background: transparent;
	border: none;
	cursor: pointer;
	color: var(--color-primary);
	transition: background var(--transition);
	flex-shrink: 0;
}

.qty-stepper__btn:hover:not(:disabled) {
	background: var(--color-primary-10);
}

.qty-stepper__btn:disabled {
	cursor: not-allowed;
	color: var(--color-primary-40);
}

.qty-stepper__btn .material-symbols-outlined {
	font-size: 1.1rem;
}

.qty-stepper__input {
	width: 3rem;
	text-align: center;
	border: none;
	background: transparent;
	font-size: .875rem;
	font-weight: 700;
	font-family: var(--font-main);
	color: var(--color-primary);
	-moz-appearance: textfield;
}

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

.qty-stepper__input:focus { outline: none; }

.qty-stepper--disabled {
	opacity: .4;
}

/* Add to Cart button full width */
.btn--full {
	width: 100%;
	justify-content: center;
}

/* ----------------------------------------------------------
   Product Accordions
---------------------------------------------------------- */
.product-accordions {
	border-top: 1px solid var(--color-primary-5);
}

.product-accordion { }

.product-accordion--bordered {
	border-top: 1px solid var(--color-primary-5);
}

.product-accordion__trigger {
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: .875rem 0;
	font-size: .875rem;
	font-weight: 700;
	color: var(--color-primary);
	text-align: start;
	background: none;
	border: none;
	cursor: pointer;
	gap: 1rem;
	transition: color var(--transition);
}

.product-accordion__trigger:hover { color: var(--color-primary-60); }

.product-accordion__icon {
	font-size: 1.1rem;
	flex-shrink: 0;
	transition: transform var(--transition);
}

.product-accordion__trigger[aria-expanded="true"] .product-accordion__icon {
	transform: rotate(180deg);
}

.product-accordion__body {
	padding-bottom: 1.25rem;
}

.product-accordion__body[hidden] { display: none; }

/* Specs table */
.product-specs-table {
	width: 100%;
	border-collapse: collapse;
	font-size: .75rem;
}

.product-specs-table tr {
	border-bottom: 1px solid var(--color-primary-5);
}

.product-specs-table tr:last-child { border-bottom: none; }

.product-specs-table th {
	padding: .5rem .75rem .5rem 0;
	font-weight: 700;
	color: var(--color-primary);
	text-align: start;
	width: 35%;
	vertical-align: top;
}

.product-specs-table td {
	padding: .5rem 0;
	color: var(--color-primary-60);
	vertical-align: top;
}

/* Description content */
.product-desc-content {
	font-size: .75rem;
	color: var(--color-primary-60);
	line-height: 1.7;
}

.product-desc-content p { margin-bottom: .75em; }
.product-desc-content p:last-child { margin-bottom: 0; }

/* ----------------------------------------------------------
   Related Products Section
---------------------------------------------------------- */
.section-related {
	padding-block: var(--section-padding);
}

.section-related__header {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	margin-bottom: 2.5rem;
}

/* SKU on related cards */
.product-card__sku {
	font-size: .625rem;
	color: var(--color-primary-40);
	font-weight: 500;
	margin-bottom: .5rem;
}

/* ==========================================================
   PRODUCT ARCHIVE PAGE
   archive-product.php styles
========================================================== */

/* ----------------------------------------------------------
   Archive: Hero / Header
---------------------------------------------------------- */
.archive-header {
	padding-block: var(--section-padding);
	background: var(--color-bg);
	border-bottom: 1px solid var(--color-primary-5);
}

.archive-header__inner {
	max-width: 42rem; /* max-w-2xl */
}

.archive-header__title {
	font-size: clamp(1.75rem, 4vw, 2.5rem);
	font-weight: 900;
	line-height: 1.1;
	margin-bottom: 1rem;
}

.archive-header__desc {
	font-size: .9375rem;
	line-height: 1.75;
	color: var(--color-primary-60);
}

/* ----------------------------------------------------------
   Archive: Sticky Toolbar
---------------------------------------------------------- */
.archive-toolbar {
	position: sticky;
	top: var(--header-h);
	z-index: 40;
	background: rgba(255, 255, 255, .9);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	border-bottom: 1px solid var(--color-primary-5);
}

.archive-toolbar__inner {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	align-items: stretch;
	padding-block: 1rem;
}

@media (min-width: 768px) {
	.archive-toolbar__inner {
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
	}
}

/* Start: search + filter button */
.archive-toolbar__start {
	display: flex;
	align-items: center;
	gap: .75rem;
	flex: 1;
}

/* End: active filters + sort */
.archive-toolbar__end {
	display: flex;
	align-items: center;
	gap: 1.5rem;
	justify-content: space-between;
}

@media (min-width: 768px) {
	.archive-toolbar__end {
		justify-content: flex-end;
	}
}

/* Search field */
.archive-search {
	position: relative;
	flex: 1;
	max-width: 16rem;
}

.archive-search__icon {
	position: absolute;
	right: .75rem;
	top: 50%;
	transform: translateY(-50%);
	font-size: 1.125rem;
	opacity: .4;
	pointer-events: none;
}

.archive-search form {
	margin: 0;
}

.archive-search__input {
	width: 100%;
	background: var(--color-primary-5);
	border: none;
	border-radius: .5rem;
	padding: .5rem 2.5rem .5rem 1rem;
	font-size: .875rem;
	font-family: var(--font-main);
	color: var(--color-primary);
	outline: none;
	transition: box-shadow var(--transition);
}

.archive-search__input:focus {
	box-shadow: 0 0 0 2px var(--color-accent-blush);
}

.archive-search__input::placeholder {
	color: rgba(11, 11, 11, .4);
}

/* Filter button */
.archive-filter-btn {
	display: flex;
	align-items: center;
	gap: .5rem;
	background: var(--color-primary-5);
	border: none;
	border-radius: .5rem;
	padding: .5rem 1rem;
	font-size: .875rem;
	font-weight: 700;
	font-family: var(--font-main);
	cursor: pointer;
	white-space: nowrap;
	transition: background var(--transition);
}

.archive-filter-btn:hover {
	background: rgba(11, 11, 11, .1);
}

.archive-filter-btn .material-symbols-outlined {
	font-size: 1.125rem;
}

/* Active filter pills */
.archive-active-filters {
	display: flex;
	align-items: center;
	gap: 1rem;
}

.archive-active-filter {
	display: flex;
	align-items: center;
	gap: .375rem;
	font-size: .6875rem;
	font-weight: 500;
}

.archive-active-filter__label {
	opacity: .6;
}

.archive-active-filter__value {
	font-weight: 700;
	color: var(--color-primary);
}

/* Sort dropdown */
.archive-sort {
	display: flex;
	align-items: center;
	gap: .5rem;
}

.archive-sort__label {
	font-size: .75rem;
	font-weight: 500;
	opacity: .6;
	white-space: nowrap;
}

.archive-sort__select {
	background: transparent;
	border: none;
	font-size: .75rem;
	font-weight: 700;
	font-family: var(--font-main);
	color: var(--color-primary);
	cursor: pointer;
	outline: none;
	padding: 0;
}

/* ----------------------------------------------------------
   Archive: Products Section
---------------------------------------------------------- */
.archive-products {
	padding-block: var(--section-padding);
}

/* Grid: 1 col → 2 col → 4 col */
.archive-grid {
	display: grid;
	grid-template-columns: 1fr;
	column-gap: 1.5rem; /* gap-x-6 */
	row-gap: 2.5rem;    /* gap-y-10 */
}

@media (min-width: 576px) {
	.archive-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (min-width: 1024px) {
	.archive-grid {
		grid-template-columns: repeat(4, 1fr);
	}
}

/* ----------------------------------------------------------
   Archive Card
---------------------------------------------------------- */
.archive-card {
	display: flex;
	flex-direction: column;
}

/* Image wrapper */
.archive-card__image-wrap {
	position: relative;
	display: block;
	width: 100%;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	border-radius: .75rem; /* rounded-xl */
	background: var(--color-white);
	margin-bottom: 1rem;
	box-shadow: 0 1px 3px rgba(0, 0, 0, .06);
	border: 1px solid var(--color-primary-5);
	text-decoration: none;
}

.archive-card__image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .7s ease;
}

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

/* B2B / custom badge */
.archive-card__badge {
	position: absolute;
	top: .75rem;
	left: .75rem;
	background: rgba(255, 255, 255, .9);
	backdrop-filter: blur(4px);
	-webkit-backdrop-filter: blur(4px);
	font-size: .625rem;
	font-weight: 700;
	padding: .25rem .5rem;
	border-radius: .375rem;
	box-shadow: 0 1px 3px rgba(0, 0, 0, .1);
	line-height: 1;
	letter-spacing: .03em;
}

/* Card body */
.archive-card__body {
	display: flex;
	flex-direction: column;
	flex: 1;
}

.archive-card__name {
	font-size: 1rem;
	font-weight: 700;
	margin-bottom: .25rem;
	line-height: 1.3;
}

.archive-card__name a {
	color: inherit;
	text-decoration: none;
}

.archive-card__name a:hover {
	color: var(--color-primary-60);
}

.archive-card__meta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: .75rem;
	gap: .5rem;
}

.archive-card__sku {
	font-size: .6875rem;
	font-weight: 900;
	opacity: .9;
	letter-spacing: .05em;
}

.archive-card__attr {
	font-size: .6875rem;
	opacity: .6;
	text-align: start;
}

/* Card footer */
.archive-card__footer {
	display: flex;
	flex-direction: column;
	gap: .75rem;
	margin-top: auto;
}

/* Price (logged in) */
.archive-card__price .price {
	font-size: .9375rem;
	font-weight: 700;
}

/* Price locked (guest) */
.archive-card__price-locked {
	background: rgba(233, 199, 195, .1);
	border: 1px solid rgba(233, 199, 195, .2);
	border-radius: .5rem;
	padding: .5rem .75rem;
	text-align: center;
}

.archive-card__price-locked p {
	font-size: .6875rem;
	font-weight: 700;
	margin: 0;
}

/* CTA button override for cards */
.archive-card__btn {
	width: 100%;
	text-align: center;
	padding-block: .75rem;
	font-size: .75rem;
}

/* ----------------------------------------------------------
   Archive: Empty State
---------------------------------------------------------- */
.archive-empty {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding-block: 5rem;
	gap: 1rem;
	text-align: center;
}

.archive-empty__icon {
	font-size: 3rem;
	opacity: .3;
}

.archive-empty h2 {
	font-size: 1.5rem;
	font-weight: 700;
}

.archive-empty p {
	font-size: .875rem;
	color: var(--color-primary-60);
}

/* ----------------------------------------------------------
   Archive: Pagination
---------------------------------------------------------- */
.archive-pagination {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: .5rem;
	margin-top: 5rem;
	flex-wrap: wrap;
}

.archive-pagination__item {
	display: flex;
	align-items: center;
	justify-content: center;
}

.archive-pagination__item a,
.archive-pagination__item span.page-numbers {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2.5rem;
	height: 2.5rem;
	border-radius: .5rem;
	border: 1px solid var(--color-primary-10);
	font-size: .875rem;
	font-weight: 700;
	color: var(--color-primary);
	text-decoration: none;
	transition: background var(--transition), border-color var(--transition);
}

.archive-pagination__item a:hover {
	background: var(--color-primary-5);
}

/* Current page */
.archive-pagination__item.is-current span.page-numbers,
.archive-pagination__item span.page-numbers.current {
	background: var(--color-primary);
	color: var(--color-white);
	border-color: var(--color-primary);
}

/* Prev / Next arrows */
.archive-pagination__item a.prev,
.archive-pagination__item a.next {
	font-size: 0; /* hide link text, show only icon */
}

.archive-pagination__item a.prev .material-symbols-outlined,
.archive-pagination__item a.next .material-symbols-outlined {
	font-size: 1.125rem;
}

.archive-pagination__dots {
	padding-inline: .5rem;
	opacity: .4;
	font-size: .875rem;
}

/* ----------------------------------------------------------
   Single-product: no top/bottom site-content padding
   (already declared; kept here for reference)
---------------------------------------------------------- */
.woocommerce-page .site-content { padding-block: 0; }

/* ==========================================================
   WHOLESALE REGISTRATION PAGE
   page-wholesale-register.php styles
========================================================== */

/* ----------------------------------------------------------
   Page wrapper
---------------------------------------------------------- */
.reg-page {
	background: var(--color-bg);
	padding-block: var(--section-padding);
}

.reg-container {
	max-width: 48rem; /* ~768px, generous for a form */
	margin-inline: auto;
	padding-inline: var(--section-px);
}

/* ----------------------------------------------------------
   Header
---------------------------------------------------------- */
.reg-header {
	text-align: center;
	margin-bottom: 3rem;
}

.reg-header__title {
	font-size: clamp(1.75rem, 5vw, 2.5rem);
	font-weight: 900;
	line-height: 1.1;
	margin-bottom: .75rem;
}

.reg-header__sub {
	font-size: 1.0625rem;
	opacity: .7;
}

/* ----------------------------------------------------------
   Form layout
---------------------------------------------------------- */
.reg-form {
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
}

/* ----------------------------------------------------------
   Card (white section)
---------------------------------------------------------- */
.reg-card {
	background: var(--color-white);
	border: 1px solid var(--color-primary-5);
	border-radius: 1rem; /* rounded-2xl */
	padding: 2rem;
	box-shadow: 0 1px 4px rgba(0, 0, 0, .05);
}

.reg-card__title {
	display: flex;
	align-items: center;
	gap: .5rem;
	font-size: 1rem;
	font-weight: 900;
	margin-bottom: 1.5rem;
}

.reg-card__title .material-symbols-outlined {
	color: var(--color-accent-champagne);
	font-size: 1.25rem;
}

/* ----------------------------------------------------------
   Grid: 2 cols on md, 1 col on mobile
---------------------------------------------------------- */
.reg-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1rem;
}

@media (min-width: 640px) {
	.reg-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

.form-field--full {
	grid-column: 1 / -1;
}

/* ----------------------------------------------------------
   Form elements
---------------------------------------------------------- */
.form-label {
	display: block;
	font-size: .6875rem;
	font-weight: 700;
	color: rgba(11, 11, 11, .8);
	margin-bottom: .375rem;
}

.req {
	color: #d63638;
}

.form-input,
.form-select {
	width: 100%;
	border: 1px solid #e5e7eb;
	border-radius: .5rem;
	padding: .75rem 1rem;
	font-size: .875rem;
	font-family: var(--font-main);
	color: var(--color-primary);
	background: rgba(255, 255, 255, .5);
	outline: none;
	transition: border-color var(--transition), box-shadow var(--transition);
	box-sizing: border-box;
}

.form-input:focus,
.form-select:focus {
	border-color: var(--color-primary);
	box-shadow: 0 0 0 3px rgba(11, 11, 11, .06);
}

.form-input::placeholder {
	color: rgba(11, 11, 11, .35);
}

.form-select {
	appearance: none;
	-webkit-appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%230B0B0B' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: left .75rem center;
	background-size: 1rem;
	padding-left: 2.5rem;
	cursor: pointer;
}

/* ----------------------------------------------------------
   Checkbox
---------------------------------------------------------- */
.form-checkbox-wrap {
	display: flex;
	align-items: flex-start;
	gap: .75rem;
	margin-bottom: 1.5rem;
}

.form-checkbox {
	flex-shrink: 0;
	width: 1rem;
	height: 1rem;
	margin-top: .125rem;
	border: 1px solid #e5e7eb;
	border-radius: .25rem;
	cursor: pointer;
	accent-color: var(--color-primary);
}

.form-checkbox-label {
	font-size: .75rem;
	opacity: .7;
	cursor: pointer;
	line-height: 1.6;
}

/* ----------------------------------------------------------
   Submit card extras
---------------------------------------------------------- */
.reg-submit-card {
	padding: 2rem;
}

.reg-form-error {
	background: #fff5f5;
	border: 1px solid #fecaca;
	border-radius: .5rem;
	color: #d63638;
	font-size: .875rem;
	font-weight: 600;
	padding: .75rem 1rem;
	margin-bottom: 1rem;
}

/* Submit button */
.reg-submit-btn {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: .5rem;
	font-size: 1.0625rem;
	font-weight: 900;
	padding-block: 1rem;
	border-radius: 50px;
	transition: background var(--transition), opacity var(--transition);
}

.btn--xl {
	padding-block: 1rem;
	font-size: 1.0625rem;
}

/* Loading spinner (shown when .is-loading) */
.reg-submit-btn__spinner {
	display: none;
	width: 1.1rem;
	height: 1.1rem;
	border: 2px solid rgba(255, 255, 255, .4);
	border-top-color: #fff;
	border-radius: 50%;
	animation: reg-spin .7s linear infinite;
}

.reg-submit-btn.is-loading .reg-submit-btn__spinner {
	display: inline-block;
}

.reg-submit-btn.is-loading .reg-submit-btn__text {
	opacity: .7;
}

@keyframes reg-spin {
	to { transform: rotate(360deg); }
}

/* ----------------------------------------------------------
   Success message
---------------------------------------------------------- */
.reg-success {
	display: flex;
	align-items: center;
	gap: 1.25rem;
	margin-top: 2rem;
	padding: 1.5rem;
	background: #f0fdf4;
	border: 1px solid #bbf7d0;
	border-radius: .75rem;
	color: #166534;
}

.reg-success[hidden] {
	display: none;
}

.reg-success__icon {
	font-size: 2rem;
	flex-shrink: 0;
	color: #22c55e;
}

.reg-success__title {
	font-weight: 700;
	font-size: 1rem;
	margin-bottom: .25rem;
}

.reg-success__sub {
	font-size: .875rem;
	opacity: .8;
}

/* =============================================================
   CART PAGE
   ============================================================= */

/* Remove default site-content block-padding on the cart page */
.woocommerce-cart .site-content {
	padding-block: 0;
}

/* Cart page wrapper */
.cart-page {
	padding-block: 4.375rem;
}

/* ── Page header ─────────────────────────────────────────── */
.cart-page__header {
	margin-bottom: 2.5rem;
}

.cart-page__title {
	font-size: clamp(1.5rem, 3vw, 1.875rem);
	font-weight: 900;
	margin-bottom: .5rem;
}

.cart-breadcrumb {
	display: flex;
	align-items: center;
	gap: .375rem;
	font-size: .6875rem;
	font-weight: 700;
	color: rgba(11, 11, 11, .4);
}

.cart-breadcrumb a {
	color: inherit;
	transition: color var(--transition);
}

.cart-breadcrumb a:hover {
	color: var(--color-primary);
}

.cart-breadcrumb__sep .material-symbols-outlined {
	font-size: .875rem;
	vertical-align: middle;
}

/* ── MOQ progress bar ────────────────────────────────────── */
.cart-moq {
	margin-bottom: 2rem;
}

.cart-moq__inner {
	background: #fff;
	border: 1px solid rgba(11, 11, 11, .05);
	border-radius: 1rem;
	padding: 1.25rem 1.5rem;
	box-shadow: 0 1px 4px rgba(0, 0, 0, .04);
}

.cart-moq__top {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: .75rem;
	gap: 1rem;
}

.cart-moq__info {
	display: flex;
	align-items: center;
	gap: .5rem;
	min-width: 0;
}

.cart-moq__info .material-symbols-outlined {
	color: var(--color-accent-champagne);
	font-size: 1.25rem;
	flex-shrink: 0;
}

.cart-moq__info p {
	font-size: .875rem;
	font-weight: 700;
	line-height: 1.4;
}

.cart-moq__count {
	font-size: .875rem;
	font-weight: 900;
	white-space: nowrap;
	flex-shrink: 0;
}

.cart-moq__bar {
	width: 100%;
	background: rgba(11, 11, 11, .06);
	height: .5rem;
	border-radius: 50px;
	overflow: hidden;
}

.cart-moq__fill {
	height: 100%;
	background: var(--color-accent-champagne);
	border-radius: 50px;
	transition: width .5s ease;
}

.cart-moq__note {
	margin-top: .75rem;
	font-size: .6875rem;
	opacity: .55;
	line-height: 1.5;
}

/* ── Cart grid layout ────────────────────────────────────── */
.cart-form.section-px {
	padding-block: 0;
}

.cart-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 2rem;
}

@media (min-width: 1024px) {
	.cart-grid {
		grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
		align-items: start;
	}
}

/* ── Cart table ──────────────────────────────────────────── */
.cart-items-col {
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

.cart-table-wrap {
	background: #fff;
	border: 1px solid rgba(11, 11, 11, .05);
	border-radius: 1rem;
	overflow: hidden;
	box-shadow: 0 1px 4px rgba(0, 0, 0, .04);
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

.cart-table {
	width: 100%;
	text-align: right;
	border-collapse: collapse;
	min-width: 560px;
}

.cart-table thead tr {
	background: rgba(11, 11, 11, .04);
}

.cart-table th {
	padding: .875rem 1.25rem;
	font-size: .6875rem;
	font-weight: 900;
	text-transform: uppercase;
	letter-spacing: .07em;
	white-space: nowrap;
}

.cart-table tbody tr {
	border-bottom: 1px solid rgba(11, 11, 11, .05);
	transition: background var(--transition);
}

.cart-table tbody tr:last-child {
	border-bottom: none;
}

.cart-table tbody tr:hover {
	background: rgba(11, 11, 11, .015);
}

.cart-table td {
	padding: 1.25rem 1.25rem;
	vertical-align: middle;
}

/* ── Cart item cell ──────────────────────────────────────── */
.cart-item {
	display: flex;
	gap: .875rem;
	align-items: center;
}

.cart-item__img-wrap {
	display: block;
	flex-shrink: 0;
}

.cart-item__img {
	width: 4.5rem;
	height: 4.5rem;
	object-fit: cover;
	border-radius: .625rem;
	border: 1px solid rgba(11, 11, 11, .05);
	background: var(--color-bg);
	display: block;
}

.cart-item__info {
	display: flex;
	flex-direction: column;
	justify-content: center;
	min-width: 0;
}

.cart-item__name {
	font-size: .875rem;
	font-weight: 700;
	margin-bottom: .25rem;
	line-height: 1.3;
}

.cart-item__name a {
	color: inherit;
	transition: color var(--transition);
}

.cart-item__name a:hover {
	color: var(--color-accent-blush);
}

.cart-item__meta {
	font-size: .625rem;
	opacity: .55;
	margin-bottom: .1rem;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* ── Cart qty stepper ────────────────────────────────────── */
.cart-qty-stepper {
	display: inline-flex;
	align-items: center;
	border: 1px solid rgba(11, 11, 11, .1);
	border-radius: 50px;
	padding: 0 .25rem;
	gap: .125rem;
}

.cart-qty-btn {
	width: 1.625rem;
	height: 1.625rem;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.125rem;
	line-height: 1;
	cursor: pointer;
	background: transparent;
	border: none;
	color: var(--color-primary);
	transition: color var(--transition);
	padding: 0;
	font-family: var(--font-main);
}

.cart-qty-btn:hover {
	color: var(--color-accent-blush);
}

.cart-qty-input {
	width: 2.25rem;
	border: none;
	background: transparent;
	text-align: center;
	font-size: .75rem;
	font-weight: 700;
	padding: .25rem 0;
	font-family: var(--font-main);
	color: var(--color-primary);
	-moz-appearance: textfield;
}

.cart-qty-input::-webkit-outer-spin-button,
.cart-qty-input::-webkit-inner-spin-button {
	-webkit-appearance: none;
}

.cart-qty-input:focus {
	outline: none;
}

/* ── Price cells ─────────────────────────────────────────── */
.cart-unit-price {
	font-size: .75rem;
	font-weight: 500;
}

.cart-row-total {
	font-size: .875rem;
	font-weight: 900;
}

/* ── Remove button ───────────────────────────────────────── */
.cart-remove-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2rem;
	height: 2rem;
	border-radius: 50%;
	color: rgba(11, 11, 11, .3);
	transition: background var(--transition), color var(--transition);
}

.cart-remove-btn:hover {
	background: #fff5f5;
	color: #ef4444;
}

.cart-remove-btn .material-symbols-outlined {
	font-size: 1.125rem;
}

/* ── Bottom actions bar ──────────────────────────────────── */
.cart-bottom-actions {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding-inline: .5rem;
	flex-wrap: wrap;
	gap: .5rem;
}

.cart-continue-link {
	font-size: .75rem;
	font-weight: 700;
	border-bottom: 1px solid rgba(11, 11, 11, .2);
	padding-bottom: .125rem;
	color: var(--color-primary);
	transition: color var(--transition), border-color var(--transition);
}

.cart-continue-link:hover {
	color: var(--color-accent-blush);
	border-color: var(--color-accent-blush);
}

.cart-empty-link {
	font-size: .75rem;
	font-weight: 700;
	color: #ef4444;
	opacity: .55;
	transition: opacity var(--transition);
}

.cart-empty-link:hover {
	opacity: 1;
}

/* Hidden update-cart submit (triggered by JS) */
.cart-update-btn {
	position: absolute;
	visibility: hidden;
	pointer-events: none;
	width: 0;
	height: 0;
	overflow: hidden;
}

/* ── Order Summary panel ─────────────────────────────────── */
.cart-summary {
	background: #fff;
	border: 1px solid rgba(11, 11, 11, .05);
	border-radius: 1rem;
	padding: 2rem;
	box-shadow: 0 1px 4px rgba(0, 0, 0, .04);
	position: sticky;
	top: calc(var(--header-h, 70px) + 1.5rem);
}

.cart-summary__title {
	font-size: 1.125rem;
	font-weight: 900;
	margin-bottom: 1.5rem;
	padding-bottom: 1rem;
	border-bottom: 1px solid rgba(11, 11, 11, .05);
}

.cart-summary__rows {
	display: flex;
	flex-direction: column;
	gap: .875rem;
	margin-bottom: 1.75rem;
}

.cart-summary__row {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 1rem;
}

.cart-summary__row--total {
	padding-top: 1rem;
	border-top: 1px solid rgba(11, 11, 11, .07);
}

.cart-summary__label {
	font-size: .875rem;
	opacity: .6;
}

.cart-summary__label--bold {
	font-size: 1rem;
	font-weight: 900;
	opacity: 1;
}

.cart-summary__value {
	font-size: .875rem;
	font-weight: 700;
}

.cart-summary__value--total {
	font-size: 1.25rem;
	font-weight: 900;
}

.cart-summary__free {
	color: #16a34a;
	font-weight: 700;
}

/* ── Delivery info box ───────────────────────────────────── */
.cart-delivery-box {
	display: flex;
	align-items: flex-start;
	gap: .625rem;
	background: rgba(216, 195, 165, .08);
	border-radius: .75rem;
	padding: 1rem;
	margin-bottom: 1.5rem;
}

.cart-delivery-box .material-symbols-outlined {
	color: var(--color-accent-champagne);
	font-size: 1.125rem;
	flex-shrink: 0;
	margin-top: .1rem;
}

.cart-delivery-box p {
	font-size: .6875rem;
	font-weight: 500;
	line-height: 1.6;
}

/* ── Checkout button ─────────────────────────────────────── */
.cart-checkout-btn {
	display: block;
	width: 100%;
	text-align: center;
	padding-block: 1rem;
	border-radius: 50px;
	font-size: 1rem;
	font-weight: 900;
	background: var(--color-primary);
	color: #fff;
	margin-bottom: 1rem;
	box-shadow: 0 8px 20px rgba(11, 11, 11, .12);
	transition: background var(--transition), opacity var(--transition);
	border: none;
	cursor: pointer;
	font-family: var(--font-main);
}

.cart-checkout-btn:hover {
	background: rgba(11, 11, 11, .85);
	color: #fff;
}

.cart-checkout-btn--locked {
	opacity: .4;
	cursor: not-allowed;
	pointer-events: none;
}

.cart-moq-locked-note {
	text-align: center;
	font-size: .6875rem;
	font-weight: 700;
	color: #b45309;
	margin-bottom: 1rem;
	margin-top: -.5rem;
}

/* ── Payment trust strip ─────────────────────────────────── */
.cart-trust {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: .625rem;
}

.cart-trust__label {
	font-size: .5625rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .1em;
	opacity: .4;
}

.cart-trust__icons {
	display: flex;
	gap: .75rem;
	opacity: .28;
}

.cart-trust__icons .material-symbols-outlined {
	font-size: 1.25rem;
}

/* ── Empty cart ──────────────────────────────────────────── */
.cart-empty {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding-block: 5rem;
	gap: 1rem;
	text-align: center;
}

.cart-empty__icon {
	font-size: 3.5rem;
	opacity: .18;
}

.cart-empty h2 {
	font-size: 1.5rem;
	font-weight: 700;
}

.cart-empty p {
	font-size: .875rem;
	opacity: .55;
}

/* ── Responsive: stack table to cards on mobile ──────────── */
@media (max-width: 639px) {
	.cart-table-wrap {
		overflow-x: visible;
	}

	.cart-table {
		min-width: 0;
	}

	.cart-table thead {
		display: none;
	}

	.cart-table tbody tr {
		display: grid;
		grid-template-columns: 1fr 1fr;
		grid-template-areas:
			"product product"
			"qty     price"
			"total   remove";
		padding: 1rem;
		gap: .75rem 1rem;
	}

	.cart-table td {
		padding: 0;
	}

	.cart-col--product { grid-area: product; }
	.cart-col--qty     { grid-area: qty; }
	.cart-col--price   { grid-area: price; text-align: left; }
	.cart-col--total   { grid-area: total; }
	.cart-col--remove  { grid-area: remove; display: flex; justify-content: flex-start; align-items: center; }

	.cart-table td::before {
		display: block;
		font-size: .625rem;
		font-weight: 900;
		text-transform: uppercase;
		letter-spacing: .07em;
		opacity: .45;
		margin-bottom: .25rem;
		content: attr(data-label);
	}

	.cart-col--product::before,
	.cart-col--remove::before {
		display: none;
	}
}

/* ── Min-amount warning banner ───────────────────────────── */
.cart-min-amount {
	padding-block: .875rem;
}

.cart-min-amount__inner {
	display: flex;
	align-items: flex-start;
	gap: .875rem;
	background: #fef3c7;
	border: 1px solid #fde68a;
	border-radius: .875rem;
	padding: 1rem 1.25rem;
}

.cart-min-amount__icon {
	color: #b45309;
	font-size: 1.25rem;
	flex-shrink: 0;
	line-height: 1.4;
}

.cart-min-amount__text strong {
	display: block;
	font-size: .875rem;
	font-weight: 700;
	color: #92400e;
	margin-bottom: .25rem;
}

.cart-min-amount__text p {
	font-size: .8125rem;
	color: #92400e;
	margin: 0;
}

/* =============================================================
   CHECKOUT PAGE
   ============================================================= */

/* WooCommerce wraps output in .woocommerce — remove its default padding */
.checkout-main .woocommerce {
	padding: 0;
}

.woocommerce-checkout .site-content {
	padding-block: 0;
}

/* ── Page wrapper ────────────────────────────────────────── */
.checkout-page {
	padding-block: 4.375rem;
}

.checkout-page__header {
	margin-bottom: 2rem;
	border-bottom: 1px solid rgba(11, 11, 11, .08);
	padding-bottom: 1rem;
}

.checkout-page__title {
	font-size: clamp(1.375rem, 3vw, 1.75rem);
	font-weight: 900;
	margin: 0;
}

/* ── Grid layout ─────────────────────────────────────────── */
.checkout-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 2rem;
	align-items: start;
}

@media (min-width: 1024px) {
	.checkout-grid {
		grid-template-columns: minmax(0, 8fr) minmax(0, 4fr);
	}
}

/* ── Step sections ───────────────────────────────────────── */
.checkout-step {
	background: #fff;
	border: 1px solid rgba(11, 11, 11, .05);
	border-radius: 1rem;
	padding: 1.5rem;
	box-shadow: 0 1px 4px rgba(0, 0, 0, .04);
	margin-bottom: 1.5rem;
}

.checkout-step__hd {
	display: flex;
	align-items: center;
	gap: .75rem;
	margin-bottom: 1.25rem;
}

.checkout-step__num {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2rem;
	height: 2rem;
	border-radius: 50%;
	background: var(--color-primary);
	color: #fff;
	font-size: .875rem;
	font-weight: 900;
	flex-shrink: 0;
}

.checkout-step__title {
	font-size: 1.125rem;
	font-weight: 700;
	margin: 0;
}

/* ── WooCommerce billing/shipping field overrides ────────── */
.checkout-address-wrap .woocommerce-billing-fields > h3,
.checkout-address-wrap .woocommerce-shipping-fields > h3,
.checkout-address-wrap .woocommerce-billing-fields__field-wrapper > p.form-row:empty {
	display: none;
}

/* Hide country / state / postcode — pre-set to Israel, not shown in UI */
.checkout-address-wrap .bynoa-hidden-field,
.checkout-address-wrap #billing_country_field,
.checkout-address-wrap #billing_state_field,
.checkout-address-wrap #billing_postcode_field {
	display: none !important;
}

/* 2-column grid — must override WooCommerce's float-based layout */
.checkout-address-wrap .woocommerce-billing-fields__field-wrapper,
.checkout-address-wrap .woocommerce-shipping-fields__field-wrapper {
	display: grid !important;
	grid-template-columns: 1fr 1fr !important;
	gap: .875rem !important;
}

/* Reset WooCommerce's float layout on each form-row */
.checkout-address-wrap .woocommerce-billing-fields__field-wrapper .form-row,
.checkout-address-wrap .woocommerce-shipping-fields__field-wrapper .form-row {
	float: none !important;
	width: auto !important;
	padding: 0 !important;
	margin: 0 !important;
	clear: none !important;
}

.checkout-address-wrap .form-row-wide {
	grid-column: 1 / -1 !important;
}

/* Ensure input wrapper is block-level */
.checkout-address-wrap .form-row .woocommerce-input-wrapper {
	display: block;
}

/* Field labels */
.checkout-address-wrap .form-row > label {
	display: block !important;
	font-size: .75rem !important;
	font-weight: 700 !important;
	opacity: .65 !important;
	margin-bottom: .375rem !important;
	color: var(--color-primary) !important;
}

.checkout-address-wrap .form-row .required {
	color: #ef4444;
	opacity: 1;
}

/* Text inputs — use !important to beat WooCommerce's woocommerce.css */
.checkout-address-wrap .form-row .input-text,
.checkout-address-wrap .form-row input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="submit"]),
.checkout-address-wrap .form-row select,
.checkout-address-wrap .form-row textarea {
	display: block !important;
	width: 100% !important;
	padding: .625rem .875rem !important;
	border: 1px solid rgba(11, 11, 11, .12) !important;
	border-radius: .5rem !important;
	font-size: .875rem !important;
	font-family: var(--font-main) !important;
	background: var(--color-bg) !important;
	color: var(--color-primary) !important;
	transition: border-color var(--transition), box-shadow var(--transition) !important;
	appearance: auto !important;
	-webkit-appearance: auto !important;
	box-shadow: none !important;
	line-height: 1.5 !important;
	box-sizing: border-box !important;
}

.checkout-address-wrap .form-row .input-text:focus,
.checkout-address-wrap .form-row input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="submit"]):focus,
.checkout-address-wrap .form-row select:focus,
.checkout-address-wrap .form-row textarea:focus {
	outline: none !important;
	border-color: var(--color-primary) !important;
	box-shadow: 0 0 0 3px rgba(11, 11, 11, .06) !important;
}

/* Validation errors */
.checkout-address-wrap .woocommerce-invalid .input-text,
.checkout-address-wrap .woocommerce-invalid select {
	border-color: #ef4444 !important;
}

/* Ship-to-different-address toggle */
.woocommerce-shipping-fields h3 label {
	display: flex;
	align-items: center;
	gap: .5rem;
	font-size: .875rem;
	font-weight: 700;
	cursor: pointer;
}

/* ── Notes toggle button ─────────────────────────────────── */
.checkout-notes-wrap {
	margin-top: .25rem;
}

.checkout-notes-toggle {
	display: inline-flex;
	align-items: center;
	gap: .375rem;
	background: none;
	border: 1px dashed rgba(11, 11, 11, .2);
	border-radius: .5rem;
	padding: .5rem .875rem;
	cursor: pointer;
	font-size: .8125rem;
	font-weight: 700;
	color: var(--color-primary);
	opacity: .65;
	transition: opacity var(--transition), border-color var(--transition);
	font-family: var(--font-main);
}

.checkout-notes-toggle:hover {
	opacity: 1;
	border-color: rgba(11, 11, 11, .4);
}

.checkout-notes-toggle .material-symbols-outlined {
	font-size: 1rem;
	line-height: 1;
}

.checkout-notes-field-wrap.is-hidden {
	display: none;
}

/* ── Notes textarea ─────────────────────────────────────── */
.checkout-notes-field textarea,
.checkout-notes-field-wrap textarea {
	width: 100%;
	padding: .875rem 1rem;
	border: 1px solid rgba(11, 11, 11, .12) !important;
	border-radius: .75rem !important;
	font-size: .875rem !important;
	font-family: var(--font-main) !important;
	resize: vertical;
	min-height: 5rem;
	background: var(--color-bg) !important;
	transition: border-color var(--transition);
}

.checkout-notes-field textarea:focus,
.checkout-notes-field-wrap textarea:focus {
	outline: none;
	border-color: var(--color-primary) !important;
}

/* ── Shipping options ────────────────────────────────────── */
.checkout-shipping-options {
	display: flex;
	flex-direction: column;
	gap: .75rem;
}

.checkout-shipping-option {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 1rem 1.25rem;
	background: #fff;
	border: 1px solid rgba(11, 11, 11, .1);
	border-radius: .875rem;
	cursor: pointer;
	transition: border-color var(--transition), background var(--transition);
	gap: 1rem;
}

.checkout-shipping-option:hover {
	border-color: var(--color-accent-blush);
}

.checkout-shipping-option.is-selected {
	border-color: var(--color-primary);
	background: rgba(11, 11, 11, .02);
}

.checkout-shipping-option__start {
	display: flex;
	align-items: center;
	gap: .875rem;
}

.checkout-shipping-option input[type="radio"] {
	width: 1rem;
	height: 1rem;
	accent-color: var(--color-primary);
	flex-shrink: 0;
}

.checkout-shipping-option__name {
	font-size: .875rem;
	font-weight: 700;
}

.checkout-shipping-option__desc {
	font-size: .6875rem;
	opacity: .55;
	margin-top: .125rem;
}

.checkout-shipping-option__price {
	font-size: .875rem;
	font-weight: 900;
	white-space: nowrap;
}

.checkout-shipping-option__price .is-free {
	color: #16a34a;
}

/* ── Payment method cards (WooCommerce output restyled) ──── */

/* Hide WC's default submit/terms row — custom button is in sidebar */
.checkout-payment-wrap .form-row.place-order {
	display: none !important;
}

/* Payment list as cards */
.checkout-payment-wrap .wc_payment_methods {
	list-style: none;
	padding: 0;
	margin: 0;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1rem;
}

@media (max-width: 600px) {
	.checkout-payment-wrap .wc_payment_methods {
		grid-template-columns: 1fr;
	}
}

.checkout-payment-wrap .wc_payment_method {
	border: 1px solid rgba(11, 11, 11, .1);
	border-radius: 1rem;
	padding: 1rem;
	background: #fff;
	cursor: pointer;
	position: relative;
	transition: border-color var(--transition), border-width var(--transition);
}

.checkout-payment-wrap .wc_payment_method:has(input.input-radio:checked) {
	border: 2px solid var(--color-primary);
}

/* Fallback for browsers without :has() — handled via JS class */
.checkout-payment-wrap .wc_payment_method.is-selected {
	border: 2px solid var(--color-primary);
}

/* Payment radio input — top right corner */
.checkout-payment-wrap .wc_payment_method input.input-radio {
	position: absolute;
	top: .75rem;
	left: .75rem; /* LTR positioning; page is RTL so left = left side */
	right: auto;
	width: 1rem;
	height: 1rem;
	accent-color: var(--color-primary);
}

/* Payment method icon (gateway may inject icons) */
.checkout-payment-wrap .wc_payment_method > label {
	display: flex;
	align-items: center;
	gap: .5rem;
	font-size: .875rem;
	font-weight: 700;
	cursor: pointer;
	padding-top: .25rem;
	margin-bottom: .25rem;
}

.checkout-payment-wrap .wc_payment_method > label img {
	max-height: 1.5rem;
}

/* Payment description */
.checkout-payment-wrap .payment_box {
	font-size: .75rem;
	opacity: .6;
	padding-top: .25rem;
	line-height: 1.5;
}

/* If payment box has form fields (like credit card), show them normally */
.checkout-payment-wrap .payment_box form,
.checkout-payment-wrap .payment_box .form-row {
	opacity: 1;
}

/* ── Order Summary Sidebar ───────────────────────────────── */
.checkout-summary-col {
	position: sticky;
	top: calc(var(--header-h, 70px) + 1.5rem);
}

.checkout-summary {
	background: #fff;
	border: 1px solid rgba(11, 11, 11, .08);
	border-radius: 1rem;
	box-shadow: 0 4px 20px rgba(11, 11, 11, .08);
	padding: 1.5rem;
	display: flex;
	flex-direction: column;
	gap: 1.25rem;
}

.checkout-summary__title {
	font-size: 1.125rem;
	font-weight: 900;
	padding-bottom: 1rem;
	border-bottom: 1px solid rgba(11, 11, 11, .06);
	margin: 0;
}

/* ── Cart item rows in sidebar ───────────────────────────── */
.checkout-items-list {
	display: flex;
	flex-direction: column;
	gap: .875rem;
	max-height: 18rem;
	overflow-y: auto;
	padding-inline-end: .25rem;
}

.checkout-item {
	display: flex;
	gap: .875rem;
	align-items: center;
}

.checkout-item__img-wrap {
	flex-shrink: 0;
}

.checkout-item__img {
	width: 3.5rem;
	height: 3.5rem;
	object-fit: cover;
	border-radius: .625rem;
	border: 1px solid rgba(11, 11, 11, .05);
	background: var(--color-bg);
	display: block;
}

.checkout-item__info {
	flex: 1;
	min-width: 0;
}

.checkout-item__name {
	font-size: .75rem;
	font-weight: 700;
	line-height: 1.35;
	margin-bottom: .25rem;
}

.checkout-item__row {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: .5rem;
}

.checkout-item__qty {
	font-size: .625rem;
	opacity: .55;
}

.checkout-item__price {
	font-size: .75rem;
	font-weight: 700;
	white-space: nowrap;
}

/* ── Totals rows ─────────────────────────────────────────── */
.checkout-totals-rows {
	display: flex;
	flex-direction: column;
	gap: .625rem;
	padding-top: .75rem;
	border-top: 1px solid rgba(11, 11, 11, .06);
}

.checkout-total-row {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 1rem;
}

.checkout-total-row__label {
	font-size: .875rem;
	opacity: .6;
}

.checkout-total-row__value {
	font-size: .875rem;
	font-weight: 700;
}

.checkout-total-row--grand {
	padding-top: .625rem;
	border-top: 1px solid rgba(11, 11, 11, .06);
}

.checkout-total-row--grand .checkout-total-row__label {
	font-size: 1rem;
	font-weight: 900;
	opacity: 1;
}

.checkout-total-row--grand .checkout-total-row__value {
	font-size: 1.25rem;
	font-weight: 900;
}

.checkout-total-row .is-free {
	color: #16a34a;
}

/* ── MOQ / minimum amount warning ───────────────────────── */
.checkout-warning {
	background: #fff5f5;
	border: 1px solid #fecaca;
	border-radius: .875rem;
	padding: 1rem;
}

.checkout-warning__header {
	display: flex;
	align-items: center;
	gap: .5rem;
	color: #b91c1c;
	margin-bottom: .5rem;
}

.checkout-warning__header .material-symbols-outlined {
	font-size: 1.125rem;
}

.checkout-warning__header strong {
	font-size: .8125rem;
}

.checkout-warning__body p {
	font-size: .75rem;
	color: #dc2626;
	line-height: 1.5;
	margin-bottom: .375rem;
}

.checkout-warning__back {
	display: block;
	margin-top: .75rem;
	width: 100%;
	text-align: center;
	padding: .5rem;
	background: #fff;
	border: 1px solid #fca5a5;
	border-radius: .5rem;
	color: #b91c1c;
	font-size: .6875rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .05em;
	transition: background var(--transition);
}

.checkout-warning__back:hover {
	background: #fee2e2;
	color: #b91c1c;
}

/* ── Place Order button ──────────────────────────────────── */
.checkout-place-order-btn {
	display: block;
	width: 100%;
	padding-block: 1rem;
	border-radius: 50px;
	background: var(--color-primary);
	color: #fff;
	font-size: 1rem;
	font-weight: 900;
	font-family: var(--font-main);
	text-align: center;
	border: none;
	cursor: pointer;
	box-shadow: 0 8px 24px rgba(11, 11, 11, .15);
	transition: background var(--transition), opacity var(--transition);
}

.checkout-place-order-btn:hover {
	background: rgba(11, 11, 11, .85);
	color: #fff;
}

.checkout-place-order-btn.is-locked {
	opacity: .45;
	cursor: not-allowed;
	pointer-events: none;
}

.checkout-legal-note {
	text-align: center;
	font-size: .5625rem;
	opacity: .4;
	font-weight: 700;
	line-height: 1.5;
}

/* ── WC #place_order hidden real button ──────────────────── */
.checkout-payment-wrap #place_order {
	position: absolute;
	left: -9999px;
	top: -9999px;
	width: 0;
	height: 0;
	overflow: hidden;
	opacity: 0;
	pointer-events: none;
}

/* ── Responsive ──────────────────────────────────────────── */
@media (max-width: 767px) {
	.checkout-address-wrap .woocommerce-billing-fields__field-wrapper,
	.checkout-address-wrap .woocommerce-shipping-fields__field-wrapper {
		grid-template-columns: 1fr;
	}

	.checkout-address-wrap .form-row-wide {
		grid-column: auto;
	}

	.checkout-payment-wrap .wc_payment_methods {
		grid-template-columns: 1fr;
	}
}

/* =============================================================
   FILTER DRAWER
   ============================================================= */

/* ── Overlay backdrop ────────────────────────────────────── */
.filter-overlay {
	display: none;
	position: fixed;
	inset: 0;
	background: rgba(11, 11, 11, .45);
	z-index: 8900;
	backdrop-filter: blur(2px);
	-webkit-backdrop-filter: blur(2px);
	opacity: 0;
	transition: opacity .3s ease;
}

.filter-overlay.is-visible {
	display: block;
	opacity: 1;
}

/* Body scroll lock when drawer is open */
body.filter-is-open {
	overflow: hidden;
}

/* ── Drawer panel ────────────────────────────────────────── */
.filter-drawer {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	max-width: 400px;
	background: #fff;
	z-index: 9000;
	display: flex;
	flex-direction: column;
	transform: translateX(100%);
	transition: transform .35s cubic-bezier(.4, 0, .2, 1);
	box-shadow: -8px 0 40px rgba(11, 11, 11, .12);
	overscroll-behavior: contain;
}

.filter-drawer.is-open {
	transform: translateX(0);
}

/* ── Drawer header ───────────────────────────────────────── */
.filter-drawer__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 1.25rem 1.5rem;
	border-bottom: 1px solid rgba(11, 11, 11, .07);
	flex-shrink: 0;
}

.filter-drawer__title-row {
	display: flex;
	align-items: center;
	gap: .625rem;
}

.filter-drawer__title {
	font-size: 1rem;
	font-weight: 900;
	margin: 0;
}

.filter-drawer__count {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 1.375rem;
	height: 1.375rem;
	padding-inline: .3rem;
	background: var(--color-primary);
	color: #fff;
	border-radius: 50px;
	font-size: .625rem;
	font-weight: 900;
}

.filter-drawer__close {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2.25rem;
	height: 2.25rem;
	border-radius: 50%;
	background: rgba(11, 11, 11, .05);
	border: none;
	cursor: pointer;
	transition: background var(--transition);
	color: var(--color-primary);
	flex-shrink: 0;
}

.filter-drawer__close:hover {
	background: rgba(11, 11, 11, .1);
}

.filter-drawer__close .material-symbols-outlined {
	font-size: 1.125rem;
}

/* ── Scrollable body ─────────────────────────────────────── */
.filter-drawer__body {
	flex: 1;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	overscroll-behavior: contain;
}

/* ── Filter sections (accordion) ────────────────────────── */
.filter-section {
	border-bottom: 1px solid rgba(11, 11, 11, .07);
}

.filter-section__toggle {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	padding: 1rem 1.5rem;
	background: transparent;
	border: none;
	cursor: pointer;
	font-family: var(--font-main);
	font-size: .875rem;
	font-weight: 700;
	color: var(--color-primary);
	text-align: right;
	transition: background var(--transition);
}

.filter-section__toggle:hover {
	background: rgba(11, 11, 11, .02);
}

.filter-section__chevron {
	font-size: 1.25rem;
	transition: transform .25s ease;
	flex-shrink: 0;
}

.filter-section__toggle[aria-expanded="false"] .filter-section__chevron {
	transform: rotate(-180deg);
}

.filter-section__content {
	padding: .25rem 1.5rem 1.25rem;
	display: flex;
	flex-direction: column;
	gap: .5rem;
	overflow: hidden;
	transition: all .25s ease;
}

.filter-section__content.is-collapsed {
	display: none;
}

/* ── Radio options (category) ────────────────────────────── */
.filter-radio {
	display: flex;
	align-items: center;
	gap: .625rem;
	cursor: pointer;
	padding-block: .25rem;
}

.filter-radio input[type="radio"] {
	position: absolute;
	opacity: 0;
	width: 0;
	height: 0;
}

.filter-radio__dot {
	width: 1rem;
	height: 1rem;
	border-radius: 50%;
	border: 2px solid rgba(11, 11, 11, .2);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	transition: border-color var(--transition);
}

.filter-radio__dot::after {
	content: '';
	width: .4rem;
	height: .4rem;
	border-radius: 50%;
	background: var(--color-primary);
	opacity: 0;
	transition: opacity var(--transition);
}

.filter-radio input:checked ~ .filter-radio__dot {
	border-color: var(--color-primary);
}

.filter-radio input:checked ~ .filter-radio__dot::after {
	opacity: 1;
}

.filter-radio__label {
	font-size: .8125rem;
	font-weight: 600;
	flex: 1;
}

.filter-radio:hover .filter-radio__dot {
	border-color: var(--color-primary);
}

.filter-radio__count {
	font-size: .6875rem;
	opacity: .45;
}

/* ── Checkbox options (attributes) ──────────────────────── */
.filter-check {
	display: flex;
	align-items: center;
	gap: .625rem;
	cursor: pointer;
	padding-block: .25rem;
}

.filter-check input[type="checkbox"] {
	position: absolute;
	opacity: 0;
	width: 0;
	height: 0;
}

.filter-check__box {
	width: 1rem;
	height: 1rem;
	border-radius: .25rem;
	border: 2px solid rgba(11, 11, 11, .2);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	transition: background var(--transition), border-color var(--transition);
}

.filter-check__box::after {
	content: '';
	width: .35rem;
	height: .6rem;
	border-right: 2px solid #fff;
	border-bottom: 2px solid #fff;
	transform: rotate(45deg) translate(-1px, -1px);
	opacity: 0;
	transition: opacity var(--transition);
}

.filter-check input:checked ~ .filter-check__box {
	background: var(--color-primary);
	border-color: var(--color-primary);
}

.filter-check input:checked ~ .filter-check__box::after {
	opacity: 1;
}

.filter-check:hover .filter-check__box {
	border-color: var(--color-primary);
}

.filter-check__label {
	font-size: .8125rem;
	font-weight: 600;
	flex: 1;
}

/* ── Price filter ────────────────────────────────────────── */
.filter-price {
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

/* Track + dual-thumb slider */
.filter-price__track-wrap {
	position: relative;
	height: 2.5rem;
	display: flex;
	align-items: center;
}

.filter-price__track {
	position: absolute;
	left: 0;
	right: 0;
	height: .25rem;
	background: rgba(11, 11, 11, .1);
	border-radius: 50px;
	pointer-events: none;
}

.filter-price__fill {
	position: absolute;
	height: 100%;
	background: var(--color-primary);
	border-radius: 50px;
}

/* Two range inputs overlap on same track */
.filter-price__slider {
	position: absolute;
	left: 0;
	right: 0;
	width: 100%;
	height: .25rem;
	appearance: none;
	-webkit-appearance: none;
	background: transparent;
	pointer-events: none;
	outline: none;
}

.filter-price__slider::-webkit-slider-thumb {
	-webkit-appearance: none;
	appearance: none;
	width: 1.25rem;
	height: 1.25rem;
	border-radius: 50%;
	background: var(--color-primary);
	border: 2px solid #fff;
	box-shadow: 0 2px 8px rgba(11, 11, 11, .25);
	cursor: pointer;
	pointer-events: auto;
	position: relative;
	z-index: 2;
}

.filter-price__slider::-moz-range-thumb {
	width: 1.25rem;
	height: 1.25rem;
	border-radius: 50%;
	background: var(--color-primary);
	border: 2px solid #fff;
	box-shadow: 0 2px 8px rgba(11, 11, 11, .25);
	cursor: pointer;
	pointer-events: auto;
}

/* Number inputs */
.filter-price__inputs {
	display: flex;
	align-items: center;
	gap: .625rem;
}

.filter-price__field {
	display: flex;
	align-items: center;
	gap: .25rem;
	border: 1px solid rgba(11, 11, 11, .15);
	border-radius: .5rem;
	padding: .375rem .625rem;
	flex: 1;
	background: rgba(11, 11, 11, .02);
	transition: border-color var(--transition);
}

.filter-price__field:focus-within {
	border-color: var(--color-primary);
	background: #fff;
}

.filter-price__currency {
	font-size: .75rem;
	font-weight: 700;
	opacity: .5;
	flex-shrink: 0;
}

.filter-price__input {
	border: none;
	background: transparent;
	font-size: .8125rem;
	font-weight: 700;
	font-family: var(--font-main);
	color: var(--color-primary);
	width: 100%;
	padding: 0;
	-moz-appearance: textfield;
}

.filter-price__input::-webkit-outer-spin-button,
.filter-price__input::-webkit-inner-spin-button {
	-webkit-appearance: none;
}

.filter-price__input:focus {
	outline: none;
}

.filter-price__dash {
	font-size: .875rem;
	opacity: .4;
	flex-shrink: 0;
}

/* ── Drawer footer ───────────────────────────────────────── */
.filter-drawer__footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 1rem 1.5rem;
	border-top: 1px solid rgba(11, 11, 11, .07);
	background: #fff;
	gap: 1rem;
	flex-shrink: 0;
}

.filter-reset-btn {
	font-size: .8125rem;
	font-weight: 700;
	color: rgba(11, 11, 11, .5);
	border-bottom: 1px solid rgba(11, 11, 11, .2);
	padding-bottom: .1rem;
	transition: color var(--transition), border-color var(--transition);
	flex-shrink: 0;
}

.filter-reset-btn:hover {
	color: var(--color-primary);
	border-color: var(--color-primary);
}

.filter-apply-btn {
	flex: 1;
	text-align: center;
	padding-block: .75rem;
	font-size: .875rem;
}

/* ── Filter button active badge ──────────────────────────── */
.archive-filter-btn__badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 1.125rem;
	height: 1.125rem;
	padding-inline: .2rem;
	background: var(--color-accent-blush);
	color: var(--color-primary);
	border-radius: 50px;
	font-size: .625rem;
	font-weight: 900;
	line-height: 1;
}

.archive-filter-btn.has-filters {
	background: rgba(11, 11, 11, .08);
}

/* ── Active filter chips in toolbar ─────────────────────── */
.archive-active-chips {
	display: flex;
	flex-wrap: wrap;
	gap: .375rem;
	align-items: center;
}

.archive-chip {
	display: inline-flex;
	align-items: center;
	gap: .25rem;
	background: rgba(11, 11, 11, .07);
	border-radius: 50px;
	padding: .25rem .625rem .25rem .5rem;
	font-size: .6875rem;
	font-weight: 700;
}

.archive-chip__remove {
	display: flex;
	align-items: center;
	color: inherit;
	opacity: .6;
	transition: opacity var(--transition);
}

.archive-chip__remove:hover {
	opacity: 1;
}

.archive-chip__remove .material-symbols-outlined {
	font-size: .875rem;
}

/* =============================================================
   MY ACCOUNT PAGE
   ============================================================= */

.account-main .woocommerce {
	padding: 0;
}

.woocommerce-account .site-content {
	padding-block: 0;
}

/* ── Page wrapper ─────────────────────────────────────────── */
.account-page {
	padding-block: 4rem 5rem;
}

/* ── Page header ──────────────────────────────────────────── */
.account-page__header {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: 1.25rem;
	margin-bottom: 2.5rem;
}

.account-page__title {
	font-size: clamp(1.5rem, 3vw, 2rem);
	font-weight: 900;
	margin: 0 0 .375rem;
}

.account-page__desc {
	font-size: .875rem;
	opacity: .55;
	margin: 0;
}

/* ── Tier badge (page header) ─────────────────────────────── */
.account-tier-badge {
	display: flex;
	align-items: center;
	gap: .75rem;
	padding: .875rem 1.25rem;
	background: #fff;
	border: 2px solid rgba(11, 11, 11, .08);
	border-radius: .875rem;
	box-shadow: 0 1px 4px rgba(0, 0, 0, .06);
}

.account-tier-badge__icon {
	font-size: 1.5rem;
	line-height: 1;
}

.account-tier-badge__label {
	font-size: .625rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .08em;
	opacity: .45;
	margin: 0 0 .125rem;
}

.account-tier-badge__name {
	font-size: .9375rem;
	font-weight: 900;
	margin: 0;
}

/* Tier colour variants */
.account-tier-badge--silver .account-tier-badge__icon,
.account-tier-badge--silver .account-tier-badge__name { color: #9CA3AF; }
.account-tier-badge--gold .account-tier-badge__icon,
.account-tier-badge--gold .account-tier-badge__name { color: #F59E0B; }
.account-tier-badge--platinum .account-tier-badge__icon,
.account-tier-badge--platinum .account-tier-badge__name { color: #818CF8; }
.account-tier-badge--diamond .account-tier-badge__icon,
.account-tier-badge--diamond .account-tier-badge__name { color: var(--color-accent-blush); }

/* ── Layout: sidebar + content ────────────────────────────── */
.account-layout {
	display: grid;
	grid-template-columns: 1fr;
	gap: 2rem;
	align-items: start;
}

@media (min-width: 1024px) {
	.account-layout {
		grid-template-columns: 260px 1fr;
	}
}

/* ── Sidebar navigation ───────────────────────────────────── */
.account-sidebar {
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
}

@media (min-width: 1024px) {
	.account-sidebar {
		position: sticky;
		top: 5rem;
	}
}

.account-nav {
	display: flex;
	flex-direction: column;
	gap: .375rem;
}

@media (max-width: 1023px) {
	.account-nav {
		flex-direction: row;
		flex-wrap: wrap;
	}
}

.account-nav__item {
	display: flex;
	align-items: center;
	gap: .75rem;
	padding: .75rem 1.125rem;
	border-radius: .625rem;
	font-size: .875rem;
	font-weight: 700;
	color: rgba(11, 11, 11, .6);
	background: #fff;
	border: 1px solid rgba(11, 11, 11, .05);
	transition: background var(--transition), color var(--transition), border-color var(--transition);
	text-decoration: none;
}

.account-nav__item:hover {
	background: rgba(11, 11, 11, .04);
	color: var(--color-primary);
}

.account-nav__item.is-active {
	background: var(--color-primary);
	color: #fff;
	border-color: var(--color-primary);
}

.account-nav__item--logout {
	color: rgba(239, 68, 68, .7);
	border-color: rgba(239, 68, 68, .12);
	margin-top: .5rem;
}

.account-nav__item--logout:hover {
	background: rgba(239, 68, 68, .06);
	color: #ef4444;
}

.account-nav__icon {
	font-size: 1.125rem;
	line-height: 1;
	flex-shrink: 0;
}

/* ── Manager contact card ─────────────────────────────────── */
.account-manager-card {
	background: rgba(216, 195, 165, .1);
	border: 1px solid rgba(216, 195, 165, .25);
	border-radius: .875rem;
	padding: 1.25rem;
}

.account-manager-card__label {
	font-size: .625rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .08em;
	opacity: .45;
	margin: 0 0 .875rem;
}

.account-manager-card__profile {
	display: flex;
	align-items: center;
	gap: .75rem;
	margin-bottom: 1rem;
}

.account-manager-card__avatar {
	width: 2.5rem;
	height: 2.5rem;
	border-radius: 50%;
	background: var(--color-accent-champagne);
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1rem;
	font-weight: 900;
	flex-shrink: 0;
}

.account-manager-card__name {
	font-size: .875rem;
	font-weight: 700;
	margin: 0 0 .125rem;
}

.account-manager-card__status {
	font-size: .6875rem;
	opacity: .55;
	font-style: italic;
	margin: 0;
}

.account-manager-card__actions {
	display: flex;
	flex-direction: column;
	gap: .5rem;
}

.account-manager-card__btn {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: .5rem;
	width: 100%;
	padding: .5rem;
	background: #fff;
	border: 1px solid rgba(11, 11, 11, .1);
	border-radius: .5rem;
	font-size: .75rem;
	font-weight: 700;
	color: var(--color-primary);
	text-decoration: none;
	transition: background var(--transition), color var(--transition);
}

.account-manager-card__btn:hover {
	background: var(--color-primary);
	color: #fff;
}

.account-manager-card__btn .material-symbols-outlined {
	font-size: .875rem;
}

/* ── Dashboard stat cards ─────────────────────────────────── */
.dashboard-stats {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 1rem;
	margin-bottom: 1.5rem;
}

.dashboard-stat-card {
	background: #fff;
	border: 1px solid rgba(11, 11, 11, .05);
	border-radius: .875rem;
	padding: 1.25rem 1.5rem;
	box-shadow: 0 1px 4px rgba(0, 0, 0, .04);
}

.dashboard-stat-card--accent {
	border-right: 4px solid var(--color-accent-blush);
}

.dashboard-stat-card__label {
	font-size: .75rem;
	font-weight: 500;
	opacity: .5;
	margin: 0 0 .375rem;
}

.dashboard-stat-card__value {
	font-size: 1.625rem;
	font-weight: 900;
	margin: 0;
	line-height: 1.15;
}

/* ── Loyalty card ─────────────────────────────────────────── */
.dashboard-stat-card--loyalty {
	grid-column: 1 / -1;
}

.dashboard-stat-card__loyalty-hd {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: 1rem;
}

.dashboard-tier-badge {
	display: inline-flex;
	align-items: center;
	gap: .375rem;
	padding: .375rem .875rem;
	border-radius: 50px;
	font-size: .75rem;
	font-weight: 900;
	background: rgba(11, 11, 11, .05);
}

.dashboard-tier-badge .material-symbols-outlined {
	font-size: .9375rem;
	line-height: 1;
}

.dashboard-tier-badge--silver { background: rgba(156, 163, 175, .12); color: #6B7280; }
.dashboard-tier-badge--gold   { background: rgba(245, 158, 11, .12);  color: #B45309; }
.dashboard-tier-badge--platinum { background: rgba(129, 140, 248, .14); color: #4F46E5; }
.dashboard-tier-badge--diamond { background: rgba(233, 199, 195, .2);  color: #C0847F; }

/* Loyalty progress bar */
.dashboard-loyalty-progress {
	margin-bottom: 1rem;
}

.dashboard-loyalty-progress__bar {
	height: .375rem;
	background: rgba(11, 11, 11, .06);
	border-radius: 50px;
	overflow: hidden;
	margin-bottom: .375rem;
}

.dashboard-loyalty-progress__fill {
	height: 100%;
	background: var(--color-primary);
	border-radius: 50px;
	transition: width .6s ease;
}

.dashboard-loyalty-progress__label {
	font-size: .6875rem;
	opacity: .5;
	margin: 0;
}

.dashboard-loyalty-max {
	font-size: .8125rem;
	font-weight: 700;
	color: var(--color-accent-champagne);
	margin: 0 0 1rem;
}

/* Tier steps row */
.dashboard-tier-list {
	display: flex;
	gap: .5rem;
	padding-top: .875rem;
	border-top: 1px solid rgba(11, 11, 11, .06);
	flex-wrap: wrap;
}

.dashboard-tier-step {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: .125rem;
	padding: .5rem .75rem;
	border-radius: .5rem;
	background: rgba(11, 11, 11, .03);
	border: 1px solid transparent;
	flex: 1;
	min-width: 70px;
	text-align: center;
}

.dashboard-tier-step.is-reached {
	background: rgba(11, 11, 11, .05);
}

.dashboard-tier-step.is-current {
	border-color: var(--color-primary);
	background: rgba(11, 11, 11, .04);
}

.dashboard-tier-step__icon {
	font-size: 1.125rem;
	opacity: .35;
}

.dashboard-tier-step.is-reached .dashboard-tier-step__icon,
.dashboard-tier-step.is-current .dashboard-tier-step__icon {
	opacity: 1;
}

.dashboard-tier-step__name {
	font-size: .625rem;
	font-weight: 900;
	text-transform: uppercase;
	letter-spacing: .06em;
	opacity: .5;
}

.dashboard-tier-step.is-reached .dashboard-tier-step__name,
.dashboard-tier-step.is-current .dashboard-tier-step__name {
	opacity: 1;
}

.dashboard-tier-step__pts {
	font-size: .5625rem;
	font-weight: 700;
	opacity: .35;
}

/* ── Generic dashboard card ───────────────────────────────── */
.dashboard-card {
	background: #fff;
	border: 1px solid rgba(11, 11, 11, .05);
	border-radius: .875rem;
	padding: 1.5rem;
	box-shadow: 0 1px 4px rgba(0, 0, 0, .04);
	margin-bottom: 1.5rem;
}

.dashboard-card:last-child {
	margin-bottom: 0;
}

.dashboard-card__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 1.25rem;
}

.dashboard-card__title {
	font-size: 1.0625rem;
	font-weight: 900;
	margin: 0;
}

.dashboard-card__link {
	font-size: .75rem;
	font-weight: 700;
	color: var(--color-accent-champagne);
	text-decoration: none;
}

.dashboard-card__link:hover {
	text-decoration: underline;
}

.dashboard-card__edit {
	font-size: .6875rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .06em;
	color: var(--color-accent-champagne);
	text-decoration: none;
}

.dashboard-card__edit:hover {
	text-decoration: underline;
}

/* ── Recent orders table ──────────────────────────────────── */
.dashboard-orders-wrap {
	overflow-x: auto;
}

.dashboard-orders-table {
	width: 100%;
	border-collapse: collapse;
	font-size: .875rem;
	text-align: right;
}

.dashboard-orders-table thead tr {
	background: rgba(11, 11, 11, .03);
}

.dashboard-orders-table th {
	padding: .75rem 1rem;
	font-weight: 700;
	font-size: .75rem;
	opacity: .55;
	white-space: nowrap;
}

.dashboard-orders-table td {
	padding: 1rem;
	border-top: 1px solid rgba(11, 11, 11, .04);
}

.dashboard-orders-table tbody tr:hover {
	background: rgba(11, 11, 11, .01);
}

.orders-col--num strong {
	font-weight: 700;
}

.orders-col--date,
.orders-col--qty {
	opacity: .65;
}

/* Status badge */
.order-status-badge {
	display: inline-block;
	padding: .25rem .625rem;
	border-radius: .375rem;
	font-size: .6875rem;
	font-weight: 700;
	white-space: nowrap;
}

.order-status-badge.status--green  { background: rgba(16, 185, 129, .1);  color: #065F46; }
.order-status-badge.status--blue   { background: rgba(59, 130, 246, .1);  color: #1E40AF; }
.order-status-badge.status--amber  { background: rgba(245, 158, 11, .1);  color: #92400E; }
.order-status-badge.status--red    { background: rgba(239, 68, 68, .1);   color: #991B1B; }

.dashboard-orders-table__view-btn {
	font-size: .8125rem;
	font-weight: 700;
	color: var(--color-primary);
	text-decoration: none;
	transition: color var(--transition);
}

.dashboard-orders-table__view-btn:hover {
	color: var(--color-accent-blush);
}

/* ── Two-column cards row ─────────────────────────────────── */
.dashboard-two-col {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1.5rem;
}

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

.dashboard-two-col .dashboard-card {
	margin-bottom: 0;
}

/* ── Business details / address ───────────────────────────── */
.dashboard-details {
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: .875rem;
}

.dashboard-details__row dt {
	font-size: .625rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .07em;
	opacity: .4;
	margin-bottom: .125rem;
}

.dashboard-details__row dd {
	font-size: .875rem;
	font-weight: 700;
	margin: 0;
}

.dashboard-address {
	display: flex;
	flex-direction: column;
	gap: .875rem;
}

.dashboard-address__row {
	display: flex;
	align-items: flex-start;
	gap: .625rem;
}

.dashboard-address__row .material-symbols-outlined {
	font-size: 1.125rem;
	opacity: .4;
	flex-shrink: 0;
	margin-top: .125rem;
}

.dashboard-address__row address,
.dashboard-address__row p {
	font-size: .875rem;
	opacity: .75;
	margin: 0;
	font-style: normal;
	line-height: 1.6;
}

.dashboard-empty {
	font-size: .875rem;
	opacity: .5;
	text-align: center;
	padding: 1.5rem 0;
}

.dashboard-empty a {
	color: var(--color-primary);
	font-weight: 700;
}

/* ── Account content — WooCommerce forms inside the content area */
.account-content .woocommerce-error,
.account-content .woocommerce-message,
.account-content .woocommerce-info {
	margin-bottom: 1.25rem;
}

.account-content .woocommerce-MyAccount-content {
	background: #fff;
	border: 1px solid rgba(11, 11, 11, .05);
	border-radius: .875rem;
	padding: 1.5rem;
	box-shadow: 0 1px 4px rgba(0, 0, 0, .04);
}

/* Style WC's own field labels/inputs inside account forms */
.account-content .form-row label {
	font-size: .75rem;
	font-weight: 700;
	opacity: .65;
	display: block;
	margin-bottom: .375rem;
}

.account-content .form-row .input-text,
.account-content .form-row select,
.account-content .form-row textarea {
	width: 100%;
	padding: .625rem .875rem;
	border: 1px solid rgba(11, 11, 11, .12);
	border-radius: .5rem;
	font-size: .875rem;
	font-family: var(--font-main);
	background: var(--color-bg);
	color: var(--color-primary);
}

.account-content .form-row .input-text:focus,
.account-content .form-row select:focus {
	outline: none;
	border-color: var(--color-primary);
	box-shadow: 0 0 0 3px rgba(11, 11, 11, .06);
}

.account-content .woocommerce-Button,
.account-content button[type="submit"],
.account-content .button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: .75rem 2rem;
	background: var(--color-primary);
	color: #fff;
	border: none;
	border-radius: 50px;
	font-size: .9375rem;
	font-weight: 700;
	font-family: var(--font-main);
	cursor: pointer;
	transition: opacity var(--transition);
	text-decoration: none;
}

.account-content .woocommerce-Button:hover,
.account-content button[type="submit"]:hover,
.account-content .button:hover {
	opacity: .85;
}

/* ── Login form ───────────────────────────────────────────── */
.account-login-page {
	min-height: 70vh;
	display: flex;
	align-items: center;
	justify-content: center;
	padding-block: 3rem 5rem;
}

.account-login-box {
	width: 100%;
	max-width: 420px;
	background: #fff;
	border: 1px solid rgba(11, 11, 11, .06);
	border-radius: 1.25rem;
	padding: 2.5rem 2rem;
	box-shadow: 0 4px 24px rgba(0, 0, 0, .07);
}

.account-login-box__logo {
	display: flex;
	justify-content: center;
	margin-bottom: 1.5rem;
}

.account-login-box__logo img {
	height: 44px;
	width: auto;
}

.account-login-box__site-name {
	font-size: 1.25rem;
	font-weight: 900;
	letter-spacing: -.03em;
}

.account-login-box__header {
	text-align: center;
	margin-bottom: 1.75rem;
}

.account-login-box__title {
	font-size: 1.375rem;
	font-weight: 900;
	margin: 0 0 .5rem;
}

.account-login-box__subtitle {
	font-size: .8125rem;
	opacity: .5;
	margin: 0;
}

/* Login form fields */
.account-login-field {
	margin-bottom: 1rem;
}

.account-login-field label,
.account-login-field__label-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size: .75rem;
	font-weight: 700;
	opacity: .65;
	margin-bottom: .375rem;
}

.account-login-field .input-text,
.account-login-field input {
	display: block;
	width: 100%;
	padding: .75rem 1rem;
	border: 1px solid rgba(11, 11, 11, .12);
	border-radius: .625rem;
	font-size: .875rem;
	font-family: var(--font-main);
	background: var(--color-bg);
	color: var(--color-primary);
	transition: border-color var(--transition), box-shadow var(--transition);
	box-sizing: border-box;
}

.account-login-field .input-text:focus,
.account-login-field input:focus {
	outline: none;
	border-color: var(--color-primary);
	box-shadow: 0 0 0 3px rgba(11, 11, 11, .06);
}

.account-login-forgot {
	font-size: .6875rem;
	font-weight: 700;
	color: var(--color-accent-champagne);
	text-decoration: none;
	opacity: 1;
}

.account-login-forgot:hover {
	text-decoration: underline;
}

.account-login-remember {
	margin-bottom: 1.25rem;
}

.account-login-remember label {
	display: flex;
	align-items: center;
	gap: .5rem;
	font-size: .8125rem;
	cursor: pointer;
}

.account-login-btn {
	display: block;
	width: 100%;
	padding: .875rem;
	background: var(--color-primary);
	color: #fff;
	border: none;
	border-radius: 50px;
	font-size: 1rem;
	font-weight: 700;
	font-family: var(--font-main);
	cursor: pointer;
	transition: opacity var(--transition);
	margin-bottom: 1.5rem;
}

.account-login-btn:hover {
	opacity: .85;
}

/* Register link section */
.account-login-register {
	text-align: center;
	padding-top: 1.25rem;
	border-top: 1px solid rgba(11, 11, 11, .07);
}

.account-login-register__text {
	font-size: .8125rem;
	opacity: .5;
	margin: 0 0 .875rem;
}

.account-login-register-btn {
	display: inline-flex;
	align-items: center;
	gap: .5rem;
	padding: .625rem 1.5rem;
	background: rgba(11, 11, 11, .04);
	border: 1px solid rgba(11, 11, 11, .08);
	border-radius: 50px;
	font-size: .8125rem;
	font-weight: 700;
	color: var(--color-primary);
	text-decoration: none;
	transition: background var(--transition), color var(--transition);
}

.account-login-register-btn:hover {
	background: var(--color-primary);
	color: #fff;
}

.account-login-register-btn .material-symbols-outlined {
	font-size: 1rem;
}

/* ── Responsive ───────────────────────────────────────────── */
@media (max-width: 767px) {
	.account-page__header {
		flex-direction: column;
		align-items: flex-start;
	}

	.account-tier-badge {
		width: 100%;
	}

	.dashboard-stats {
		grid-template-columns: 1fr;
	}

	.dashboard-stat-card--loyalty {
		grid-column: auto;
	}

	.dashboard-orders-table th:nth-child(3),
	.dashboard-orders-table td.orders-col--qty {
		display: none;
	}
}

@media (max-width: 1023px) {
	.account-nav__item {
		flex: 1;
		justify-content: center;
		font-size: .75rem;
		padding: .625rem .875rem;
	}

	.account-nav__item--logout {
		margin-top: 0;
	}
}