/**
 * Fibre Nova — WooCommerce Brand Styling
 * ------------------------------------------------------------------
 * Maps the site's existing Elementor Kit design tokens (the --e-global-*
 * CSS variables that Elementor outputs site-wide via the active Kit CSS)
 * onto every WooCommerce surface: Cart/Checkout blocks AND classic Woo
 * templates (shop, product, my-account, notices, buttons).
 *
 * Single source of truth = the Elementor Kit (Appearance > Elementor Kit).
 * Change a global colour/font there and WooCommerce follows automatically.
 * Hardcoded hex values below are only fallbacks inside var(...).
 *
 * Brand tokens (current Kit values):
 *   --e-global-color-accent   = #076F92  (brand teal — buttons/links/headings)
 *   --e-global-color-text     = #282828  (body text)
 *   --e-global-color-primary  = #FFFFFF  (button text)
 *   headings font             = Poppins
 *   body font                 = Roboto
 * ------------------------------------------------------------------
 */

/* ===================================================================
   1. BASE TYPOGRAPHY — make Woo surfaces use the site fonts
   =================================================================== */
.woocommerce,
.woocommerce-page,
.wc-block-checkout,
.wc-block-cart,
.wp-block-woocommerce-checkout,
.wp-block-woocommerce-cart {
	font-family: var(--e-global-typography-text-font-family, "Roboto"), sans-serif;
	color: var(--e-global-color-text, #282828);
	font-size: var(--e-global-typography-text-font-size, 18px);
	line-height: var(--e-global-typography-text-line-height, 1.5em);
}

.woocommerce h1,
.woocommerce h2,
.woocommerce h3,
.woocommerce h4,
.woocommerce h5,
.woocommerce h6,
.woocommerce-page h1,
.woocommerce-page h2,
.woocommerce-page h3,
.woocommerce-page h4,
.wc-block-checkout h1,
.wc-block-checkout h2,
.wc-block-checkout h3,
.wc-block-checkout h4,
.wc-block-cart h1,
.wc-block-cart h2,
.wc-block-cart h3,
.wc-block-cart h4,
.wc-block-components-checkout-step-heading,
.wc-block-components-order-summary__heading,
.wc-block-components-panel__button {
	font-family: var(--e-global-typography-primary-font-family, "Poppins"), sans-serif;
	color: var(--e-global-color-text, #282828);
	font-weight: 600;
	line-height: 1.2em;
}

/* ===================================================================
   2. LINKS — brand accent
   =================================================================== */
.woocommerce a,
.woocommerce-page a,
.wc-block-checkout a,
.wc-block-cart a {
	color: var(--e-global-color-accent, #076F92);
	text-decoration: none;
}

.woocommerce a:hover,
.woocommerce-page a:hover,
.wc-block-checkout a:hover,
.wc-block-cart a:hover {
	text-decoration: underline;
}

/* ===================================================================
   3. BUTTONS — mirror the Elementor Kit button exactly
   (accent bg, white text, Poppins 600/capitalize, 4px radius, 15px/35px)
   =================================================================== */
.woocommerce #respond input#submit,
.woocommerce #respond input#submit.alt,
.woocommerce a.button,
.woocommerce a.button.alt,
.woocommerce button.button,
.woocommerce button.button.alt,
.woocommerce input.button,
.woocommerce input.button.alt,
.woocommerce .button,
.woocommerce .button.alt,
.woocommerce .added_to_cart,
.woocommerce-account .woocommerce-Button,
.woocommerce-account .woocommerce-Button.button,
.wc-block-components-button,
.wc-block-components-button:not([disabled]),
.wc-block-components-checkout-place-order-button,
.wc-block-components-checkout-return-to-cart-button,
.wp-block-woocommerce-checkout .wc-block-components-button,
.wp-block-woocommerce-cart .wc-block-components-button,
.wc-block-mini-cart__footer .wc-block-components-button {
	background-color: var(--e-global-color-accent, #076F92);
	color: var(--e-global-color-primary, #ffffff) !important;
	font-family: var(--e-global-typography-accent-font-family, "Poppins"), sans-serif;
	font-size: var(--e-global-typography-accent-font-size, 17px);
	font-weight: var(--e-global-typography-accent-font-weight, 600);
	text-transform: var(--e-global-typography-accent-text-transform, capitalize);
	line-height: var(--e-global-typography-accent-line-height, 1em);
	letter-spacing: var(--e-global-typography-accent-letter-spacing, -0.5px);
	border: 1px solid var(--e-global-color-accent, #076F92);
	border-radius: 4px;
	padding: 15px 35px;
	text-decoration: none;
	transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}

.woocommerce #respond input#submit:hover,
.woocommerce #respond input#submit.alt:hover,
.woocommerce a.button:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button:hover,
.woocommerce input.button.alt:hover,
.woocommerce .button:hover,
.woocommerce .button.alt:hover,
.woocommerce .added_to_cart:hover,
.woocommerce-account .woocommerce-Button:hover,
.wc-block-components-button:hover,
.wc-block-components-button:not([disabled]):hover,
.wc-block-components-checkout-place-order-button:hover,
.wc-block-components-checkout-return-to-cart-button:hover,
.wc-block-mini-cart__footer .wc-block-components-button:hover {
	/* Mirrors the Kit hover: accent at ~59% opacity (#076F9296). */
	background-color: color-mix(in srgb, var(--e-global-color-accent, #076F92) 59%, transparent);
	color: var(--e-global-color-primary, #ffffff) !important;
	border-color: var(--e-global-color-accent, #076F92);
	text-decoration: none;
}

/* Secondary / outline button variant (e.g. "update cart") */
.woocommerce button.button:disabled,
.woocommerce button.button:disabled[disabled],
.wc-block-components-button.outlined,
.wc-block-components-checkout-return-to-cart-button.is-outline {
	background-color: transparent;
	color: var(--e-global-color-accent, #076F92) !important;
	border: 1px solid var(--e-global-color-accent, #076F92);
}

/* ===================================================================
   4. FORM INPUTS — Cart/Checkout blocks + classic Woo forms
   =================================================================== */
.wc-block-components-text-input input,
.wc-block-components-text-input input[type="text"],
.wc-block-components-text-input input[type="email"],
.wc-block-components-text-input input[type="tel"],
.wc-block-components-text-input input[type="password"],
.wc-block-components-address-form input,
.wc-block-components-address-form select,
.wc-block-components-state-input input,
.wc-block-components-country-input select,
.woocommerce form .form-row input[type="text"],
.woocommerce form .form-row input[type="email"],
.woocommerce form .form-row input[type="tel"],
.woocommerce form .form-row input[type="password"],
.woocommerce form .form-row input[type="number"],
.woocommerce form .form-row select,
.woocommerce form .form-row textarea,
.woocommerce .quantity .qty,
.woocommerce-account input[type="text"],
.woocommerce-account input[type="email"],
.woocommerce-account input[type="password"] {
	font-family: var(--e-global-typography-text-font-family, "Roboto"), sans-serif;
	color: var(--e-global-color-text, #282828);
	background-color: #fff;
	border: 1px solid #d6d6d6;
	border-radius: 4px;
	padding: 10px 14px;
	font-size: 16px;
	line-height: 1.4em;
	transition: border-color .2s ease, box-shadow .2s ease;
}

.wc-block-components-text-input input:focus,
.wc-block-components-address-form input:focus,
.wc-block-components-address-form select:focus,
.wc-block-components-state-input input:focus,
.wc-block-components-country-input select:focus,
.woocommerce form .form-row input:focus,
.woocommerce form .form-row select:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce .quantity .qty:focus,
.woocommerce-account input:focus {
	border-color: var(--e-global-color-accent, #076F92);
	box-shadow: 0 0 0 1px var(--e-global-color-accent, #076F92);
	outline: none;
}

/* Floating labels in the blocks checkout */
.wc-block-components-text-input label,
.wc-block-components-address-form label {
	color: var(--e-global-color-text, #282828);
	font-family: var(--e-global-typography-text-font-family, "Roboto"), sans-serif;
}

.wc-block-components-text-input.is-active label,
.wc-block-components-address-form .is-active label {
	color: var(--e-global-color-accent, #076F92);
}

/* Checkbox / radio controls */
.wc-block-components-radio-control .wc-block-components-radio-control__option-label-selected,
.wc-block-components-radio-control__option-label {
	font-family: var(--e-global-typography-text-font-family, "Roboto"), sans-serif;
	color: var(--e-global-color-text, #282828);
}

.wc-block-components-radio-control__input:checked,
.wc-block-components-checkbox__input:checked {
	border-color: var(--e-global-color-accent, #076F92);
	background-color: var(--e-global-color-accent, #076F92);
}

/* ===================================================================
   5. CHECKOUT / CART BLOCKS — layout & order summary
   =================================================================== */
.wc-block-checkout,
.wc-block-cart {
	max-width: 100%;
	margin: 0;
	padding: 0;
}

/* Step headings in the checkout block */
.wc-block-components-checkout-step-heading {
	font-family: var(--e-global-typography-primary-font-family, "Poppins"), sans-serif;
	font-size: 22px;
}

.wc-block-components-checkout-step-number {
	background-color: var(--e-global-color-accent, #076F92);
	color: var(--e-global-color-primary, #ffffff);
	border-color: var(--e-global-color-accent, #076F92);
}

/* Order summary card */
.wc-block-components-order-summary,
.wc-block-components-totals-wrapper,
.wc-block-components-order-summary__button-text {
	border-color: #e6e6e6;
}

.wc-block-components-order-summary__heading,
.wc-block-components-totals-wrapper .wc-block-components-totals-item__label {
	font-family: var(--e-global-typography-primary-font-family, "Poppins"), sans-serif;
}

.wc-block-components-totals-item__value,
.wc-block-components-order-summary-item__total-price {
	color: var(--e-global-color-text, #282828);
	font-family: var(--e-global-typography-text-font-family, "Roboto"), sans-serif;
}

/* Totals grand total */
.wc-block-components-totals-footer-item .wc-block-components-totals-item__label,
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
	font-family: var(--e-global-typography-primary-font-family, "Poppins"), sans-serif;
	font-weight: 600;
	color: var(--e-global-color-text, #282828);
}

/* Place order button — full width, prominent */
.wc-block-components-checkout-place-order-button {
	width: 100%;
	font-size: 18px;
	padding: 18px 35px;
}

/* ===================================================================
   6. SHOP ARCHIVE — product grid (classic)
   =================================================================== */
.woocommerce-products-header__title,
.woocommerce .page-title {
	font-family: var(--e-global-typography-primary-font-family, "Poppins"), sans-serif;
	color: var(--e-global-color-text, #282828);
	font-size: 32px;
	font-weight: 600;
}

.woocommerce .woocommerce-breadcrumb,
.woocommerce .woocommerce-result-count,
.woocommerce .woocommerce-ordering {
	font-family: var(--e-global-typography-text-font-family, "Roboto"), sans-serif;
	color: var(--e-global-color-text, #282828);
}

.woocommerce .woocommerce-breadcrumb a {
	color: var(--e-global-color-accent, #076F92);
}

/* Product cards */
.woocommerce ul.products li.product {
	border: 1px solid #eaeaea;
	border-radius: 8px;
	padding: 20px;
	background: #fff;
	text-align: center;
	transition: box-shadow .2s ease, border-color .2s ease;
}

.woocommerce ul.products li.product:hover {
	border-color: var(--e-global-color-accent, #076F92);
	box-shadow: 0 6px 24px rgba(7, 111, 146, 0.12);
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
	font-family: var(--e-global-typography-primary-font-family, "Poppins"), sans-serif;
	color: var(--e-global-color-text, #282828);
	font-weight: 600;
	font-size: 18px;
	padding: 12px 0 6px;
}

.woocommerce ul.products li.product .price,
.woocommerce ul.products li.product .price .amount {
	color: var(--e-global-color-accent, #076F92);
	font-family: var(--e-global-typography-primary-font-family, "Poppins"), sans-serif;
	font-weight: 600;
	font-size: 18px;
}

.woocommerce ul.products li.product .button {
	margin-top: 12px;
	font-size: 15px;
	padding: 12px 24px;
}

/* ===================================================================
   7. SINGLE PRODUCT (classic)
   =================================================================== */
.woocommerce div.product .product_title {
	font-family: var(--e-global-typography-primary-font-family, "Poppins"), sans-serif;
	color: var(--e-global-color-text, #282828);
	font-size: 34px;
	font-weight: 600;
}

.woocommerce div.product p.price,
.woocommerce div.product span.price {
	color: var(--e-global-color-accent, #076F92);
	font-family: var(--e-global-typography-primary-font-family, "Poppins"), sans-serif;
	font-weight: 600;
	font-size: 24px;
}

.woocommerce div.product .woocommerce-product-details__short-description,
.woocommerce div.product .woocommerce-Tabs-panel {
	font-family: var(--e-global-typography-text-font-family, "Roboto"), sans-serif;
	color: var(--e-global-color-text, #282828);
}

.woocommerce div.product .single_add_to_cart_button {
	font-size: 17px;
	padding: 15px 35px;
}

.woocommerce .star-rating span,
.woocommerce p.stars a {
	color: var(--e-global-color-accent, #076F92);
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active {
	border-color: var(--e-global-color-accent, #076F92);
	background: #fff;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
	color: var(--e-global-color-accent, #076F92);
}

/* ===================================================================
   8. MY ACCOUNT (classic)
   =================================================================== */
.woocommerce-account .woocommerce-MyAccount-content,
.woocommerce-account .woocommerce-MyAccount-navigation {
	font-family: var(--e-global-typography-text-font-family, "Roboto"), sans-serif;
	color: var(--e-global-color-text, #282828);
}

.woocommerce-account .woocommerce-MyAccount-navigation-link.is-active a,
.woocommerce-account .woocommerce-MyAccount-navigation-link a:hover {
	color: var(--e-global-color-accent, #076F92);
}

.woocommerce-account .woocommerce-MyAccount-content h2,
.woocommerce-account .woocommerce-MyAccount-content h3 {
	font-family: var(--e-global-typography-primary-font-family, "Poppins"), sans-serif;
	color: var(--e-global-color-text, #282828);
}

/* ===================================================================
   9. NOTICES — blocks + classic
   =================================================================== */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
	font-family: var(--e-global-typography-text-font-family, "Roboto"), sans-serif;
	border-radius: 4px;
	border-left-width: 4px;
	border-left-style: solid;
	padding: 14px 18px;
}

.woocommerce-message {
	border-top-color: var(--e-global-color-accent, #076F92);
	border-left-color: var(--e-global-color-accent, #076F92);
	background: #f4fbfd;
	color: var(--e-global-color-text, #282828);
}

.woocommerce-message::before {
	color: var(--e-global-color-accent, #076F92);
}

.woocommerce-info {
	border-top-color: var(--e-global-color-accent, #076F92);
	border-left-color: var(--e-global-color-accent, #076F92);
	background: #f4fbfd;
}

.woocommerce-info::before {
	color: var(--e-global-color-accent, #076F92);
}

.woocommerce-error {
	border-top-color: #d63638;
	border-left-color: #d63638;
	background: #fcf0f0;
}

/* Cart/Checkout block notice banners */
.wc-block-components-notice-banner {
	font-family: var(--e-global-typography-text-font-family, "Roboto"), sans-serif;
	border-radius: 4px;
}

.wc-block-components-notice-banner.is-info {
	border-color: var(--e-global-color-accent, #076F92);
}

/* ===================================================================
   10. MISC — breadcrumb, pagination, quantity
   =================================================================== */
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
	border-color: #e6e6e6;
	color: var(--e-global-color-text, #282828);
	font-family: var(--e-global-typography-text-font-family, "Roboto"), sans-serif;
}

.woocommerce nav.woocommerce-pagination ul li a:focus,
.woocommerce nav.woocommerce-pagination ul li a:hover,
.woocommerce nav.woocommerce-pagination ul li span.current {
	background: var(--e-global-color-accent, #076F92);
	color: var(--e-global-color-primary, #ffffff);
	border-color: var(--e-global-color-accent, #076F92);
}

.woocommerce .quantity .qty {
	min-width: 60px;
}

/* Remove default Woo star/price link underlines inside cards */
.woocommerce ul.products li.product a img,
.woocommerce ul.products li.product .woocommerce-LoopProduct-link {
	text-decoration: none;
}

/* ===================================================================
   11. PAGE LAYOUT — central wrapper matching the site's boxed convention
   The rest of the site uses Elementor boxed sections at max-width:1340px
   (desktop) / 90% (tablet). Woo pages render through template-parts/single.php
   which has NO max-width on .site-main / .page-content, so they span
   edge-to-edge. This wraps them in the same centred 1340px container.
   =================================================================== */
.woocommerce-page .site-main {
	max-width: 1340px;
	margin: 0 auto;
	padding: 48px 20px 96px;
	box-sizing: border-box;
}

.woocommerce-page .site-main .page-content {
	width: 100%;
}

.woocommerce-checkout .wp-block-woocommerce-checkout {
	max-width: 1340px;
	margin: 0 auto;
	padding: 48px 20px 96px;
	box-sizing: border-box;
}

@media (max-width: 1024px) {
	.woocommerce-checkout .wp-block-woocommerce-checkout {
		max-width: 90%;
		padding: 32px 20px 64px;
	}
}

@media (max-width: 767px) {
	.woocommerce-checkout .wp-block-woocommerce-checkout {
		max-width: 90%;
		padding: 24px 16px 48px;
	}
}

/* Page title on Woo pages — match site heading style + breathing room */
.woocommerce-page .page-header {
	padding-bottom: 24px;
	margin-bottom: 32px;
}

.woocommerce-page .entry-title {
	font-family: var(--e-global-typography-primary-font-family, "Poppins"), sans-serif;
	color: var(--e-global-color-text, #282828);
	font-size: 36px;
	font-weight: 600;
	line-height: 1.2em;
}

/* Tablet / mobile — match Elementor's 90% boxed convention */
@media (max-width: 1024px) {
	.woocommerce-page .site-main {
		max-width: 90%;
		padding: 32px 0 64px;
	}
}

@media (max-width: 767px) {
	.woocommerce-page .site-main {
		max-width: 90%;
		padding: 24px 0 48px;
	}

	.woocommerce-page .entry-title {
		font-size: 28px;
	}
}

/* ===================================================================
   12. CHECKOUT/CART SPACING POLISH — font spacing & breathing room
   The Woo blocks default to tight gap:0 12px between fields and 12px
   margin-top. This opens everything up to match the site's airy feel.
   =================================================================== */

/* --- Checkout main two-column layout: widen the gap between columns --- */
.wc-block-checkout__main {
	gap: 48px;
}

.wp-block-woocommerce-checkout {
	gap: 48px;
}

@media (max-width: 1024px) {
	.wc-block-checkout__main,
	.wp-block-woocommerce-checkout {
		gap: 32px;
	}
}

/* --- Checkout steps: more vertical separation between sections --- */
.wc-block-components-checkout-step {
	padding-bottom: 32px;
	margin-bottom: 8px;
}

.wc-block-components-checkout-step--with-step-number {
	padding-bottom: 36px;
}

.wc-block-components-checkout-step__container {
	padding-top: 8px;
}

/* --- Step headings: bigger, more line-height --- */
.wc-block-checkout .wc-block-components-checkout-step__title {
	font-family: var(--e-global-typography-primary-font-family, "Poppins"), sans-serif;
	font-size: 22px;
	line-height: 1.3em;
	letter-spacing: 0;
}

.wc-block-components-checkout-step__heading-content {
	margin-bottom: 20px;
}

/* --- Address form: open up the field gaps (row + column) --- */
.wc-block-checkout__billing-fields .wc-block-components-address-form,
.wc-block-checkout__shipping-fields .wc-block-components-address-form {
	gap: 18px 24px;
}

/* --- Individual text inputs: more vertical breathing room --- */
.wc-block-components-text-input,
.wc-block-components-select-input,
.wc-block-components-state-input,
.wc-block-components-country-input {
	margin-top: 18px;
}

.wc-block-components-address-form .wc-block-components-text-input:first-child,
.wc-block-components-address-form .wc-block-components-select-input:first-child,
.wc-block-components-address-form .wc-block-components-state-input:first-child,
.wc-block-components-address-form .wc-block-components-country-input:first-child {
	margin-top: 0;
}

/* --- Input fields: taller, more padding, comfortable line-height --- */
.wc-block-components-text-input input,
.wc-block-components-address-form input,
.wc-block-components-address-form select,
.wc-block-components-state-input input,
.wc-block-components-country-input select,
.woocommerce form .form-row input[type="text"],
.woocommerce form .form-row input[type="email"],
.woocommerce form .form-row input[type="tel"],
.woocommerce form .form-row input[type="password"],
.woocommerce form .form-row input[type="number"],
.woocommerce form .form-row select,
.woocommerce form .form-row textarea {
	padding: 14px 16px;
	font-size: 16px;
	line-height: 1.6em;
}

/* --- Floating labels: nudge up slightly to match taller inputs --- */
.wc-block-components-text-input.is-active label,
.wc-block-components-address-form .is-active label {
	transform: translateY(-50%) scale(0.85);
}

/* --- Form labels: more line-height, comfortable spacing --- */
.wc-block-components-text-input label,
.wc-block-components-address-form label,
.woocommerce form .form-row label {
	line-height: 1.5em;
	margin-bottom: 6px;
	color: var(--e-global-color-text, #282828);
}

/* --- Checkbox / radio groups: more spacing between options --- */
.wc-block-components-radio-control__option {
	padding: 12px 0;
}

.wc-block-components-radio-control__option-layout {
	gap: 12px;
}

/* --- Contact information block: spacing --- */
.wc-block-checkout__contact-fields-block {
	margin-bottom: 8px;
}

/* --- Payment block: spacing between methods --- */
.wc-block-components-checkout-payment-methods {
	gap: 16px;
}

.wc-block-components-payment-method-label {
	line-height: 1.5em;
}

/* --- Order summary: more internal padding + item spacing --- */
.wc-block-components-order-summary {
	padding: 24px;
	border: 1px solid #e6e6e6;
	border-radius: 8px;
}

.wc-block-components-order-summary__heading {
	font-size: 20px;
	margin-bottom: 20px;
}

.wc-block-components-order-summary-item {
	padding: 14px 0;
}

.wc-block-components-order-summary-item__image {
	margin-right: 16px;
}

/* --- Totals: more spacing between line items --- */
.wc-block-components-totals-wrapper {
	padding: 16px 24px;
}

.wc-block-components-totals-item {
	padding: 10px 0;
}

/* --- Place order button: more top margin for separation --- */
.wc-block-components-checkout-place-order-button {
	margin-top: 24px;
}

/* ===================================================================
   13. CART BLOCK SPACING POLISH
   =================================================================== */
.wc-block-cart .wc-block-cart__main,
.wc-block-cart .wc-block-cart__totals {
	gap: 48px;
}

.wc-block-cart-items .wc-block-cart-items__row {
	padding: 24px 0;
}

.wc-block-cart-item__image {
	margin-right: 20px;
}

.wc-block-cart-item__product-name {
	font-family: var(--e-global-typography-primary-font-family, "Poppins"), sans-serif;
	font-weight: 600;
	font-size: 17px;
	line-height: 1.4em;
}

.wc-block-cart-item__product-metadata {
	font-size: 14px;
	line-height: 1.6em;
	color: var(--e-global-color-text, #282828);
}

.wc-block-cart-item__quantity {
	margin-top: 12px;
}

/* Cart totals card */
.wc-block-cart__totals .wc-block-components-totals-wrapper {
	border: 1px solid #e6e6e6;
	border-radius: 8px;
	padding: 24px;
}

@media (max-width: 1024px) {
	.wc-block-cart .wc-block-cart__main,
	.wc-block-cart .wc-block-cart__totals {
		gap: 32px;
	}
}