/* ==========================================================================
   FX-Lighting — woocommerce.css
   Overrides the WooCommerce selectors that survive our custom templates:
   notices, single product layout, tabs, forms, cart/checkout.
   Loaded AFTER components.css so it can reuse its variables.
   ========================================================================== */

/* WooCommerce ships jQuery-based markup we can't fully template away.
   Scope overrides to `.fx-shop__main` / `.woocommerce` so we don't bleed. */

.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
	border: 1px solid var( --fx-border ) !important;
	background: var( --fx-surface ) !important;
	color: var( --fx-text ) !important;
	border-radius: var( --r-md ) !important;
	padding: var( --sp-4 ) var( --sp-5 ) !important;
	margin-bottom: var( --sp-4 ) !important;
	box-shadow: none !important;
	list-style: none !important;
}
.woocommerce-message::before,
.woocommerce-info::before { color: var( --fx-accent ) !important; }
.woocommerce-error { border-color: var( --fx-danger ) !important; }
.woocommerce-error::before { color: var( --fx-danger ) !important; }
.woocommerce-message .button,
.woocommerce-info .button {
	background: var( --fx-accent ) !important;
	color: var( --fx-bg ) !important;
	border-radius: var( --r-pill ) !important;
	padding: 0.5em 1.2em !important;
	font-weight: var( --fw-semi ) !important;
	font-size: var( --fx-fs-xs ) !important;
}

/* ---------------------------------------------------------------- SHOP TOOLBAR */
.fx-shop-toolbar {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: var( --sp-4 );
	flex-wrap: wrap;
	padding-bottom: var( --sp-4 );
	margin-bottom: var( --sp-5 );
	border-bottom: 1px solid var( --fx-border );
}
.woocommerce-result-count { margin: 0 !important; color: var( --fx-text-mute ) !important; font-size: var( --fx-fs-sm ) !important; }
.woocommerce-ordering { margin: 0 !important; }
.woocommerce-ordering select {
	background: var( --fx-surface ) !important;
	color: var( --fx-text ) !important;
	border: 1px solid var( --fx-border-2 ) !important;
	border-radius: var( --r-md ) !important;
	padding: 0.5em 0.9em !important;
	font-size: var( --fx-fs-sm ) !important;
	cursor: pointer;
}
.woocommerce-ordering select:focus { border-color: var( --fx-accent ) !important; outline: none !important; }

/* ---------------------------------------------------------------- PRODUCT LOOP */
ul.products {
	display: grid !important;
	grid-template-columns: repeat( 3, 1fr );
	gap: var( --sp-4 );
	margin: 0 !important;
	padding: 0 !important;
}
ul.products::before,
ul.products::after { display: none !important; }
ul.products li.product {
	width: auto !important;
	margin: 0 !important;
	padding: 0 !important;
	background: var( --fx-surface ) !important;
	border: 1px solid var( --fx-border ) !important;
	border-radius: var( --r-lg ) !important;
	overflow: hidden;
	transition: border-color var( --t-base ), transform var( --t-base ), box-shadow var( --t-base );
	display: flex !important;
	flex-direction: column;
	text-align: left !important;
}
ul.products li.product:hover {
	border-color: var( --fx-border-2 ) !important;
	transform: translateY( -4px );
	box-shadow: var( --sh-2 );
}
ul.products li.product img {
	width: 100% !important;
	height: auto !important;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	margin: 0 !important;
	border-radius: 0 !important;
	transition: transform var( --t-slow ) var( --ease-out );
}
ul.products li.product:hover img { transform: scale( 1.06 ); }
ul.products li.product .woocommerce-loop-product__title {
	padding: var( --sp-4 ) var( --sp-4 ) 0 !important;
	font-family: var( --fx-font-body ) !important;
	font-size: var( --fx-fs-base ) !important;
	font-weight: var( --fw-semi ) !important;
	color: var( --fx-text ) !important;
	line-height: var( --fx-lh-snug ) !important;
}
ul.products li.product .woocommerce-loop-product__title:hover { color: var( --fx-accent ); }
ul.products li.product a {
	color: inherit;
}
ul.products li.product .price {
	padding: var( --sp-2 ) var( --sp-4 ) 0 !important;
	color: var( --fx-accent ) !important;
	font-family: var( --fx-font-display ) !important;
	font-weight: var( --fw-med ) !important;
	display: block;
}
ul.products li.product .price ins { color: var( --fx-accent ) !important; text-decoration: none !important; }
ul.products li.product .price del { color: var( --fx-text-mute ) !important; opacity: 0.7 !important; margin-right: var( --sp-2 ); }
ul.products li.product .price .amount { font-weight: var( --fw-med ) !important; }
ul.products li.product .button,
ul.products li.product .fx-btn {
	margin: var( --sp-3 ) var( --sp-4 ) var( --sp-4 ) !important;
	align-self: flex-start;
}
ul.products li.product .button {
	background: transparent !important;
	color: var( --fx-text ) !important;
	border: 1px solid var( --fx-border-2 ) !important;
	font-family: var( --fx-font-display ) !important;
	font-size: var( --fx-fs-xs ) !important;
	font-weight: var( --fw-med ) !important;
	letter-spacing: 0.08em !important;
	text-transform: uppercase !important;
	padding: 0.6em 1.2em !important;
	border-radius: var( --r-pill ) !important;
	transition: all var( --t-fast ) !important;
}
ul.products li.product .button:hover {
	color: var( --fx-accent ) !important;
	border-color: var( --fx-accent ) !important;
	background: rgba( 77, 168, 255, 0.06 ) !important;
}

/* ---------------------------------------------------------------- PAGINATION */
.woocommerce-pagination {
	margin-top: var( --sp-7 );
	padding-top: var( --sp-5 );
	border-top: 1px solid var( --fx-border );
}
.woocommerce-pagination ul {
	border: none !important;
	display: flex;
	gap: var( --sp-2 );
	justify-content: center;
}
.woocommerce-pagination li { border: none !important; }
.woocommerce-pagination a,
.woocommerce-pagination span {
	display: grid !important;
	place-items: center;
	min-width: 42px;
	height: 42px;
	padding: 0 !important;
	border: 1px solid var( --fx-border ) !important;
	border-radius: var( --r-md ) !important;
	background: var( --fx-surface ) !important;
	color: var( --fx-text-dim ) !important;
	font-weight: var( --fw-med ) !important;
	transition: all var( --t-fast ) !important;
}
.woocommerce-pagination a:hover,
.woocommerce-pagination .current {
	background: var( --fx-accent ) !important;
	color: var( --fx-bg ) !important;
	border-color: var( --fx-accent ) !important;
}

/* ---------------------------------------------------------------- SINGLE PRODUCT */
.single-product .fx-shop__main { padding-block: var( --sp-7 ); }
.woocommerce div.product {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var( --sp-7 );
	margin-bottom: var( --sp-8 );
}
.woocommerce div.product::before,
.woocommerce div.product::after { display: none; content: none; }

.woocommerce div.product .woocommerce-product-gallery {
	width: auto !important;
	float: none !important;
	margin: 0 !important;
}
.woocommerce div.product .woocommerce-product-gallery__image img {
	border-radius: var( --r-lg );
	border: 1px solid var( --fx-border );
	background: var( --fx-bg-2 );
}
.woocommerce div.product .flex-control-thumbs {
	display: grid !important;
	grid-template-columns: repeat( 4, 1fr );
	gap: var( --sp-2 );
	margin-top: var( --sp-3 ) !important;
}
.woocommerce div.product .flex-control-thumbs li { width: auto !important; }
.woocommerce div.product .flex-control-thumbs img {
	border-radius: var( --r-md );
	opacity: 0.6;
	transition: opacity var( --t-fast );
}
.woocommerce div.product .flex-control-thumbs img:hover,
.woocommerce div.product .flex-control-thumbs img.flex-active { opacity: 1; }

.woocommerce div.product .summary {
	width: auto !important;
	float: none !important;
	margin: 0 !important;
}
.woocommerce div.product .summary > .product_meta { display: none; } /* we render our own */
.woocommerce div.product .product_title {
	font-size: var( --fx-fs-2xl ) !important;
	font-family: var( --fx-font-display ) !important;
	font-weight: var( --fw-bold ) !important;
	margin-bottom: var( --sp-3 ) !important;
	color: var( --fx-text ) !important;
}
.woocommerce div.product .summary .price {
	font-size: var( --fx-fs-xl ) !important;
	color: var( --fx-accent ) !important;
	font-family: var( --fx-font-display ) !important;
	margin-bottom: var( --sp-5 ) !important;
}
.woocommerce div.product .summary .price del { color: var( --fx-text-mute ) !important; }
.woocommerce div.product .summary .price ins { text-decoration: none !important; }

.woocommerce div.product .summary .woocommerce-product-details__short-description {
	color: var( --fx-text-dim );
	font-size: var( --fx-fs-md );
	margin-bottom: var( --sp-5 );
	padding-bottom: var( --sp-5 );
	border-bottom: 1px solid var( --fx-border );
}

.woocommerce div.product form.cart {
	margin-bottom: var( --sp-5 ) !important;
	display: flex;
	flex-wrap: wrap;
	gap: var( --sp-3 );
	align-items: center;
}
.woocommerce div.product form.cart .quantity { margin: 0 !important; }
.woocommerce .quantity .qty {
	width: 70px !important;
	height: 48px;
	background: var( --fx-surface ) !important;
	border: 1px solid var( --fx-border-2 ) !important;
	border-radius: var( --r-md ) !important;
	color: var( --fx-text ) !important;
	text-align: center;
}
.woocommerce div.product .single_add_to_cart_button,
.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button {
	background: var( --fx-grad-accent ) !important;
	color: #fff !important;
	border: none !important;
	border-radius: var( --r-pill ) !important;
	padding: 0.95em 2em !important;
	font-family: var( --fx-font-display ) !important;
	font-weight: var( --fw-med ) !important;
	letter-spacing: 0.08em !important;
	text-transform: uppercase !important;
	font-size: var( --fx-fs-sm ) !important;
	transition: all var( --t-base ) !important;
	box-shadow: 0 6px 24px var( --fx-accent-glow ) !important;
	cursor: pointer;
}
.woocommerce div.product .single_add_to_cart_button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover {
	transform: translateY( -2px ) !important;
	box-shadow: 0 10px 32px var( --fx-accent-glow ) !important;
	color: #fff !important;
}

/* product meta line */
.woocommerce div.product .fx-product-meta {
	display: flex;
	flex-wrap: wrap;
	gap: var( --sp-2 ) var( --sp-5 );
	margin-bottom: var( --sp-5 );
	font-size: var( --fx-fs-sm );
	color: var( --fx-text-mute );
}
.woocommerce div.product .fx-product-meta a { color: var( --fx-accent ); }

/* ---------------------------------------------------------------- TABS */
.woocommerce div.product .woocommerce-tabs {
	grid-column: 1 / -1;
	border-top: 1px solid var( --fx-border );
	padding-top: var( --sp-7 );
	margin-top: var( --sp-7 );
}
.woocommerce div.product .woocommerce-tabs ul.tabs {
	padding: 0 !important;
	margin: 0 0 var( --sp-5 ) 0 !important;
	border-bottom: 1px solid var( --fx-border ) !important;
	display: flex;
	gap: var( --sp-5 );
}
.woocommerce div.product .woocommerce-tabs ul.tabs::before { display: none !important; }
.woocommerce div.product .woocommerce-tabs ul.tabs li {
	background: transparent !important;
	border: none !important;
	border-radius: 0 !important;
	padding: 0 !important;
	margin: 0 !important;
	position: relative;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after { display: none !important; }
.woocommerce div.product .woocommerce-tabs ul.tabs li.active {
	background: transparent !important;
	border-bottom: 2px solid var( --fx-accent ) !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs a {
	color: var( --fx-text-mute ) !important;
	font-family: var( --fx-font-display ) !important;
	font-weight: var( --fw-med ) !important;
	letter-spacing: 0.1em !important;
	text-transform: uppercase !important;
	font-size: var( --fx-fs-sm ) !important;
	padding: var( --sp-4 ) 0 !important;
	display: inline-block;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a { color: var( --fx-accent ) !important; }

.woocommerce-Tabs-panel {
	color: var( --fx-text-dim );
}
.woocommerce-Tabs-panel h2 { display: none; } /* tab title redundant */
.woocommerce-Tabs-panel p { margin-bottom: var( --sp-4 ); }
.woocommerce-Tabs-panel h2,
.woocommerce-Tabs-panel h3 { color: var( --fx-text ); }

/* attribute table in additional info */
.woocommerce table.shop_attributes {
	border: none !important;
	border-radius: var( --r-md );
	overflow: hidden;
}
.woocommerce table.shop_attributes th,
.woocommerce table.shop_attributes td {
	border: 1px solid var( --fx-border ) !important;
	background: var( --fx-surface ) !important;
	color: var( --fx-text-dim ) !important;
	padding: var( --sp-3 ) var( --sp-4 ) !important;
}
.woocommerce table.shop_attributes th { color: var( --fx-text ) !important; font-weight: var( --fw-semi ) !important; }

/* ---------------------------------------------------------------- RELATED */
.woocommerce .related.products { grid-column: 1 / -1; padding-top: var( --sp-7 ); border-top: 1px solid var( --fx-border ); }
.woocommerce .related.products > h2 {
	font-size: var( --fx-fs-xl ) !important;
	font-family: var( --fx-font-display ) !important;
	margin-bottom: var( --sp-5 ) !important;
}

/* ---------------------------------------------------------------- CART / CHECKOUT / ACCOUNT */
.woocommerce-cart table.cart,
.woocommerce-checkout table.cart,
.woocommerce-checkout-review-order-table,
.woocommerce table.shop_table {
	border: 1px solid var( --fx-border ) !important;
	border-radius: var( --r-md ) !important;
	border-collapse: separate !important;
	border-spacing: 0;
	background: var( --fx-surface );
	color: var( --fx-text-dim );
}
.woocommerce table.shop_table th {
	background: var( --fx-surface-2 ) !important;
	color: var( --fx-text ) !important;
	font-family: var( --fx-font-display ) !important;
	font-weight: var( --fw-med ) !important;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	font-size: var( --fx-fs-xs ) !important;
	padding: var( --sp-4 ) !important;
}
.woocommerce table.shop_table td { padding: var( --sp-4 ) !important; border-top: 1px solid var( --fx-border ) !important; }
.woocommerce-cart-form input[type="number"],
.woocommerce input[type="text"],
.woocommerce input[type="email"],
.woocommerce input[type="tel"],
.woocommerce input[type="password"],
.woocommerce textarea,
.woocommerce select {
	background: var( --fx-bg-2 ) !important;
	border: 1px solid var( --fx-border-2 ) !important;
	border-radius: var( --r-md ) !important;
	color: var( --fx-text ) !important;
	padding: 0.7em 0.9em !important;
	font-size: var( --fx-fs-sm );
	width: 100%;
}
.woocommerce-cart-form input[type="number"]:focus,
.woocommerce input:focus,
.woocommerce textarea:focus,
.woocommerce select:focus { border-color: var( --fx-accent ) !important; outline: none !important; }

.cart-collaterals .cart_totals h2,
.woocommerce-checkout h3 {
	font-family: var( --fx-font-display ) !important;
	font-size: var( --fx-fs-lg ) !important;
	margin-bottom: var( --sp-4 ) !important;
}
.cart-collaterals .cart_totals table { border: 1px solid var( --fx-border ); border-radius: var( --r-md ); }

/* coupon */
.woocommerce-cart-form input#coupon_code { width: auto; flex: 1; }
.woocommerce form .form-row { margin: 0 0 var( --sp-3 ) !important; padding: 0 !important; }
.woocommerce form .form-row label { color: var( --fx-text-dim ) !important; font-size: var( --fx-fs-sm ) !important; margin-bottom: var( --sp-1 ) !important; }

/* account page */
.woocommerce-account .woocommerce-MyAccount-navigation ul {
	display: flex;
	flex-direction: column;
	gap: var( --sp-1 );
	border: 1px solid var( --fx-border );
	border-radius: var( --r-md );
	padding: var( --sp-3 );
	background: var( --fx-surface );
}
.woocommerce-account .woocommerce-MyAccount-navigation li { list-style: none; }
.woocommerce-account .woocommerce-MyAccount-navigation li a {
	display: block;
	padding: var( --sp-3 );
	color: var( --fx-text-dim );
	border-radius: var( --r-sm );
	font-size: var( --fx-fs-sm );
}
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a,
.woocommerce-account .woocommerce-MyAccount-navigation li a:hover {
	background: var( --fx-surface-2 );
	color: var( --fx-accent );
}

/* star rating minimal */
.star-rating { color: var( --fx-gold ) !important; }

/* onsale badge */
.woocommerce span.onsale {
	background: var( --fx-accent ) !important;
	color: var( --fx-bg ) !important;
	border-radius: var( --r-pill ) !important;
	font-size: var( --fx-fs-xs ) !important;
	font-weight: var( --fw-semi ) !important;
	padding: 0.3em 0.8em !important;
	min-height: auto !important;
	min-width: auto !important;
	line-height: 1.4 !important;
	top: var( --sp-3 ) !important;
	left: var( --sp-3 ) !important;
}

/* ---------------------------------------------------------------- YITH Request a Quote */
.ywraq-wrapper,
.woocommerce .ywraq-wrapper {
	background: var( --fx-surface );
	border: 1px solid var( --fx-border );
	border-radius: var( --r-lg );
	padding: var( --sp-6 );
	margin-block: var( --sp-5 );
	color: var( --fx-text );
}
.ywraq-form-table-wrapper {
	color: var( --fx-text-dim );
}
.ywraq-form-table-wrapper p {
	color: var( --fx-text-dim );
	font-size: var( --fx-fs-md );
}
/* the "No products in list" / empty state */
.ywraq-form-table-wrapper > p:first-child {
	font-family: var( --fx-font-display );
	font-size: var( --fx-fs-lg );
	color: var( --fx-text );
	text-align: center;
	padding: var( --sp-6 );
}
/* quote table */
.woocommerce .ywraq-wrapper table.shop_table,
.ywraq-wrapper table {
	background: transparent !important;
	border: 1px solid var( --fx-border ) !important;
	border-radius: var( --r-md ) !important;
}
.ywraq-wrapper table th {
	color: var( --fx-text ) !important;
	background: var( --fx-surface-2 ) !important;
	border-bottom: 1px solid var( --fx-border ) !important;
}
.ywraq-wrapper table td {
	border-bottom: 1px solid var( --fx-border ) !important;
	color: var( --fx-text-dim ) !important;
}
.ywraq-wrapper table a {
	color: var( --fx-accent );
}
/* buttons */
.ywraq-wrapper .button,
.ywraq-wrapper a.button,
.ywraq-wrapper input[type="submit"] {
	background: var( --fx-grad-accent ) !important;
	color: #fff !important;
	border: none !important;
	border-radius: var( --r-pill ) !important;
	padding: 0.8em 1.8em !important;
	font-family: var( --fx-font-display ) !important;
	font-weight: var( --fw-med ) !important;
	letter-spacing: 0.08em !important;
	text-transform: uppercase !important;
	font-size: var( --fx-fs-sm ) !important;
	box-shadow: 0 6px 24px var( --fx-accent-glow ) !important;
	transition: transform var( --t-base ) !important;
}
.ywraq-wrapper .button:hover,
.ywraq-wrapper a.button:hover {
	transform: translateY( -2px ) !important;
	color: #fff !important;
}
/* remove-from-quote links */
.ywraq-wrapper .remove,
.ywraq-wrapper .ywraq-item-remove {
	color: var( --fx-text-mute ) !important;
}
.ywraq-wrapper .remove:hover {
	color: var( --fx-danger ) !important;
}
/* the request-quote form on single product */
.single-product .yith-ywraq-add-to-quote {
	margin-block: var( --sp-3 );
}
.single-product .yith-ywraq-add-to-quote a,
.single-product .yith-ywraq-add-to-quote button {
	background: transparent !important;
	color: var( --fx-text ) !important;
	border: 1px solid var( --fx-border-2 ) !important;
	border-radius: var( --r-pill ) !important;
	padding: 0.6em 1.2em !important;
	font-family: var( --fx-font-display ) !important;
	font-size: var( --fx-fs-xs ) !important;
	text-transform: uppercase !important;
	letter-spacing: 0.08em !important;
}
.single-product .yith-ywraq-add-to-quote a:hover {
	color: var( --fx-accent ) !important;
	border-color: var( --fx-accent ) !important;
}
