/*
 * WooCommerce pages styled after the Shopify product / collection / cart pages.
 */

/* ---------- Collection ---------- */
.emp-collection {
	width: min(var(--page-width), 100% - 2 * var(--page-gutter));
	margin: 0 auto;
	padding: 0 0 104px;
}
.emp-collection__toolbar {
	display: flex; align-items: center; justify-content: space-between; gap: 16px;
	padding: 16px 0; margin-bottom: 24px;
	border-top: 1px solid var(--color-line-soft);
	font-size: 13px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-muted);
}
.emp-collection__toolbar .woocommerce-ordering { margin: 0; }
.emp-collection__toolbar select,
.woocommerce-ordering select {
	background: transparent; border: 0; color: var(--color-ink);
	font-size: 13px; letter-spacing: 0.06em; text-transform: uppercase; cursor: pointer;
}
.emp-collection__toolbar option { background: var(--color-surface); }
.emp-collection__empty { color: var(--color-muted); padding: 48px 0; }
.emp-collection .woocommerce-pagination { margin-top: 48px; text-align: center; }

/* Product cards outside the home carousel: a grid at every width (the home section scrolls on mobile). */
.emp-grid.x-bestsellers { background: transparent; padding: 0; }
.emp-grid .x-bestsellers__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 40px 28px;
	overflow: visible;
	padding: 0;
}
@media (max-width: 989px) {
	.emp-grid .x-bestsellers__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 749px) {
	.emp-grid .x-bestsellers__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 12px; }
	.emp-grid .x-bestsellers__card { min-width: 0; width: auto; flex: initial; }
}

/* ---------- Product page ---------- */
.emp-product {
	width: min(1304px, 100% - 2 * var(--page-gutter));
	margin: 0 auto;
	padding: 8px 0 72px;
}
.emp-product__grid {
	display: grid;
	grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr);
	gap: 56px;
	align-items: start;
}
.emp-product__info { position: sticky; top: 100px; }
@media (max-width: 989px) {
	.emp-product__grid { grid-template-columns: 1fr; gap: 24px; }
	.emp-product__info { position: static; }
}

/* woocommerce.css floats div.images / div.summary at 48%; our grid lays them out instead. */
.woocommerce div.product.emp-product div.images,
.woocommerce div.product.emp-product div.summary { float: none; width: 100%; margin: 0; }

/* Gallery: Woo flexslider markup on the dark page, image centred like Shopify. */
.emp-product .woocommerce-product-gallery { position: relative; margin: 0; }
.emp-product .woocommerce-product-gallery__wrapper { margin: 0; }
.emp-product .woocommerce-product-gallery__image img { width: 100%; height: auto; }
.emp-product .woocommerce-product-gallery__trigger {
	position: absolute; top: 12px; right: 12px; z-index: 5;
	width: 40px; height: 40px; border-radius: 50%;
	background: rgba(14, 15, 18, 0.7); color: var(--color-ink); text-indent: -9999px; overflow: hidden;
}
.emp-product .woocommerce-product-gallery__trigger::before {
	content: ""; position: absolute; inset: 12px; border: 1.5px solid var(--color-ink); border-radius: 50%;
}
.emp-product .flex-control-thumbs { display: flex; gap: 8px; margin: 12px 0 0; padding: 0; list-style: none; }
.emp-product .flex-control-thumbs li { width: 72px; }
.emp-product .flex-control-thumbs img { opacity: 0.6; cursor: pointer; }
.emp-product .flex-control-thumbs img.flex-active { opacity: 1; }

.emp-product__title { font-size: 48px; line-height: 1; margin: 0 0 16px; }
.emp-product__price { font-size: 24px; line-height: 1.1; margin-bottom: 4px; }
.emp-product__price .woocommerce-Price-amount { font-family: var(--font-body--family); }
.emp-product__tax-note { font-size: 14px; color: var(--color-muted); margin: 0 0 24px; }
.emp-product__tax-note a { color: inherit; }
@media (max-width: 749px) {
	.emp-product__title { font-size: 36px; }
}

/* Size select + quantity + buttons. */
.emp-product__form form.cart { margin: 0; }
.emp-product__form table.variations { width: 100%; border-collapse: collapse; margin: 0 0 16px; }
.emp-product__form table.variations th,
.emp-product__form table.variations td { display: block; padding: 0; text-align: left; }
.emp-product__form table.variations th.label { margin-bottom: 8px; }
.emp-product__form table.variations label { font-size: 14px; font-weight: 600; color: var(--color-ink); }
.emp-product__form table.variations select {
	width: 100%; height: 52px; padding: 0 44px 0 16px;
	appearance: none; -webkit-appearance: none;
	background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23D2B27A' stroke-width='1.5'/%3E%3C/svg%3E") no-repeat right 16px center;
	border: 1px solid rgba(241, 236, 226, 0.25);
	border-radius: 0;
	color: var(--color-ink);
	font-size: 16px;
	cursor: pointer;
}
.emp-product__form table.variations select:hover { border-color: rgba(241, 236, 226, 0.55); }
.emp-product__form table.variations option { background: var(--color-surface); color: var(--color-ink); }
/* The price is shown at the top (data-emp-price); hide Woo's duplicate under the select. */
.emp-product__form .single_variation .woocommerce-variation-price,
.emp-product__form .single_variation .woocommerce-variation-description { display: none; }
.emp-product__form .woocommerce-variation-availability { font-size: 14px; color: var(--color-muted); margin-bottom: 12px; }

.emp-product__form .woocommerce-variation-add-to-cart,
.emp-product__form form.cart:not(.variations_form) {
	display: grid;
	grid-template-columns: 132px 1fr;
	gap: 12px;
}
.emp-product__form .emp-buy-now { grid-column: 1 / -1; }

.emp-product__form .quantity {
	display: flex; align-items: stretch;
	height: 52px; border: 1px solid rgba(241, 236, 226, 0.25);
}
.emp-product__form .quantity .qty {
	width: 100%; min-width: 0; text-align: center;
	background: transparent; border: 0; color: var(--color-ink); font-size: 16px;
	-moz-appearance: textfield;
}
.emp-product__form .quantity .qty::-webkit-outer-spin-button,
.emp-product__form .quantity .qty::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.emp-qty-btn {
	flex: 0 0 40px; background: none; border: 0; color: var(--color-ink); font-size: 18px; cursor: pointer;
}
.emp-qty-btn:hover { color: var(--color-gold); }

.emp-product__form .single_add_to_cart_button { width: 100%; }
.emp-product__form .emp-buy-now {
	background: rgba(210, 178, 122, 0.85); border-color: transparent;
}
.emp-product__form .emp-buy-now:hover { background: var(--color-gold); }

/* Order by phone / WhatsApp: prominent for customers who prefer to call. */
.emp-order-phone {
	display: flex; flex-wrap: wrap; align-items: center; gap: 6px 18px;
	margin-top: 18px; padding: 14px 16px;
	border: 1px solid var(--color-line-soft);
	font-size: 14px; color: var(--color-muted);
}
.emp-order-phone a {
	color: var(--color-ink); font-weight: 600; letter-spacing: 0.04em; text-decoration: none;
	border-bottom: 1px solid var(--color-gold);
}
.emp-order-phone a:hover { color: var(--color-gold); }

.emp-product__desc { margin-top: 24px; color: var(--color-ink); }
.emp-product__desc .x-desc__intro { color: var(--color-ink); }

/* Related products. */
.emp-related { background: var(--color-surface-2); padding: 56px 0 72px; }
.emp-related__inner { width: min(1304px, 100% - 2 * var(--page-gutter)); margin: 0 auto; }
.emp-related__heading { font-size: 40px; margin: 0 0 32px; }
.emp-related .x-bestsellers__card { background: var(--color-bg); }
@media (max-width: 749px) {
	.emp-related__heading { font-size: 30px; }
}

/* Sticky add-to-cart bar (shows once the main buttons scroll out of view). */
.emp-sticky-atc {
	position: fixed; left: 50%; bottom: 16px; z-index: 90;
	width: min(720px, 100% - 24px);
	transform: translateX(-50%);
	background: var(--color-surface);
	border: 1px solid var(--color-line);
	box-shadow: 0 24px 48px -28px rgba(0, 0, 0, 0.9);
}
.emp-sticky-atc[hidden] { display: none; }
.emp-sticky-atc__inner { display: flex; align-items: center; gap: 14px; padding: 8px 10px; }
.emp-sticky-atc__img { width: 48px; height: 48px; object-fit: contain; }
.emp-sticky-atc__text { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.emp-sticky-atc__title { font-size: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.emp-sticky-atc__variant { font-size: 13px; color: var(--color-muted); }
.emp-sticky-atc__price { font-weight: 600; }
.emp-sticky-atc__btn { min-height: 44px; padding: 0 18px; }
@media (max-width: 749px) {
	.emp-sticky-atc { bottom: 76px; }
	.emp-sticky-atc__img, .emp-sticky-atc__price { display: none; }
}

/* ---------- Notices ---------- */
.woocommerce-notices-wrapper:empty { display: none; }
.woocommerce-message, .woocommerce-info, .woocommerce-error,
.wc-block-components-notice-banner {
	list-style: none;
	margin: 0 0 20px; padding: 14px 16px;
	background: var(--color-surface) !important; color: var(--color-ink) !important;
	border: 1px solid var(--color-gold) !important; border-radius: 0 !important;
	display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px;
	font-size: 14px;
}
.woocommerce-error { border-color: #c0605a !important; }
.woocommerce-message::before, .woocommerce-info::before, .woocommerce-error::before { display: none; }
.woocommerce-message .button { min-height: 40px; order: 2; }

/* ---------- Cart, checkout, account (classic + block markup) on the dark theme ---------- */
.woocommerce-cart .emp-page,
.woocommerce-checkout .emp-page,
.woocommerce-account .emp-page { width: min(1160px, 100% - 2 * var(--page-gutter)); }
.woocommerce-cart .emp-page__content,
.woocommerce-checkout .emp-page__content,
.woocommerce-account .emp-page__content { color: var(--color-ink); }

.woocommerce input.input-text, .woocommerce textarea, .woocommerce select,
.woocommerce-page input[type="text"], .woocommerce-page input[type="email"], .woocommerce-page input[type="tel"],
.woocommerce-page input[type="password"], .woocommerce-page input[type="number"],
.wc-block-components-text-input input, .wc-block-components-textarea,
.wc-block-components-combobox .wc-block-components-combobox-control input,
.wc-blocks-components-select__select {
	background: transparent !important;
	color: var(--color-ink) !important;
	border: 1px solid rgba(241, 236, 226, 0.25) !important;
	border-radius: 0 !important;
}
.wc-block-components-text-input label, .wc-blocks-components-select__label,
.wc-block-components-combobox .wc-block-components-combobox-control label { color: var(--color-muted) !important; }
.wc-blocks-components-select__select option { background: var(--color-surface); }

.wc-block-components-button:not(.is-link),
:is(.woocommerce-cart, .woocommerce-checkout, .woocommerce-account) .woocommerce :is(button.button, a.button, input.button) {
	background: var(--color-primary-button-background) !important;
	color: var(--color-primary-button-text) !important;
	border: 1px solid var(--color-primary-button-border) !important;
	border-radius: 0 !important;
	font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase;
}
.wc-block-components-button:not(.is-link):hover,
:is(.woocommerce-cart, .woocommerce-checkout, .woocommerce-account) .woocommerce :is(button.button, a.button):hover {
	background: var(--color-primary-button-hover-background) !important;
}

.wc-block-cart, .wc-block-checkout,
.wc-block-components-totals-wrapper, .wc-block-components-panel,
.wc-block-components-order-summary, .wc-block-components-sidebar-layout { color: var(--color-ink); }
.wc-block-components-product-name { color: var(--color-ink) !important; }
.wc-block-cart-item__image img, .wc-block-components-order-summary-item__image img { background: var(--color-tile); }
.wc-block-components-radio-control__option,
.wc-block-components-radio-control-accordion-option,
.wc-block-checkout__shipping-option .wc-block-components-radio-control__option { border-color: rgba(241, 236, 226, 0.2) !important; }
.wc-block-components-quantity-selector { border-color: rgba(241, 236, 226, 0.25) !important; }
.wc-block-components-quantity-selector input, .wc-block-components-quantity-selector button { color: var(--color-ink) !important; }
.wc-block-components-checkbox .wc-block-components-checkbox__input[type=checkbox] { background: transparent; border-color: rgba(241, 236, 226, 0.4); }
.wc-block-components-checkbox .wc-block-components-checkbox__mark { fill: var(--color-bg); }
.wc-block-components-checkbox .wc-block-components-checkbox__input[type=checkbox]:checked { background: var(--color-gold); }
.wc-block-components-title, .wc-block-components-checkout-step__title { font-family: var(--font-heading--family) !important; }

/* Classic cart table (if a classic shortcode page is used). */
.woocommerce table.shop_table { border-color: var(--color-line-soft); border-radius: 0; }
.woocommerce table.shop_table td, .woocommerce table.shop_table th { border-color: var(--color-line-soft); }

/* Account navigation. */
.woocommerce-MyAccount-navigation ul { list-style: none; padding: 0; margin: 0 0 24px; display: flex; flex-wrap: wrap; gap: 8px 20px; }
.woocommerce-MyAccount-navigation a { color: var(--color-muted); text-decoration: none; text-transform: uppercase; font-size: 13px; letter-spacing: 0.08em; }
.woocommerce-MyAccount-navigation .is-active a, .woocommerce-MyAccount-navigation a:hover { color: var(--color-gold); }

/* woocommerce.css sets `.woocommerce img { height: auto }`, which beats the header/footer logo sizes. */
.woocommerce-page .x-header__logo-img,
.woocommerce-page .x-header__drawer-logo-img { height: var(--x-logo-h); width: auto; }
.woocommerce-page .x-footer__logo-img { height: var(--x-footer-logo-h); width: auto; }
@media (max-width: 989px) {
	.woocommerce-page .x-header__logo-img { height: var(--x-logo-h-mobile); }
}

/* Buy buttons: gold like Shopify, beating woocommerce.css `button.button.alt` (purple) and `button.button` (grey). */
.woocommerce div.product .emp-product__form .button,
.woocommerce div.product .emp-product__form button.button.alt {
	min-height: 52px; padding: 0 20px;
	background: var(--color-primary-button-background); border: 1px solid var(--color-primary-button-border);
	border-radius: 0; color: var(--color-primary-button-text);
	font-size: 14px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase;
}
.woocommerce div.product .emp-product__form .button:hover,
.woocommerce div.product .emp-product__form button.button.alt:hover {
	background: var(--color-primary-button-hover-background); border-color: var(--color-primary-button-hover-border);
	color: var(--color-primary-button-hover-text);
}
.woocommerce div.product .emp-product__form .emp-buy-now { background: rgba(210, 178, 122, 0.82); border-color: transparent; }
.woocommerce div.product .emp-product__form .button.disabled,
.woocommerce div.product .emp-product__form .button:disabled { opacity: 0.5; }

/* Block checkout selects (Country, State) render on a white container by default. */
.wc-blocks-components-select .wc-blocks-components-select__container {
	background: transparent !important;
	border: 1px solid rgba(241, 236, 226, 0.25) !important;
	border-radius: 0 !important;
}
.wc-blocks-components-select .wc-blocks-components-select__select { border: 0 !important; color: var(--color-ink) !important; }
.wc-blocks-components-select .wc-blocks-components-select__expand { fill: var(--color-gold) !important; }

/* "View cart" inside the added-to-cart notice. */
.woocommerce .woocommerce-message .button,
.woocommerce .woocommerce-message a.button {
	min-height: 40px; padding: 0 16px;
	background: var(--color-primary-button-background); border: 1px solid var(--color-primary-button-border);
	border-radius: 0; color: var(--color-primary-button-text);
	font-size: 13px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase;
}
.woocommerce .woocommerce-message .button:hover { background: var(--color-primary-button-hover-background); color: var(--color-primary-button-hover-text); }

/* Phone / WhatsApp line above the cart and checkout. */
.woocommerce-cart .emp-order-phone,
.woocommerce-checkout .emp-order-phone { margin: 0 0 28px; justify-content: center; }
