/*
 * Store buttons: Add to Cart and Add to Quote on the old Elementor product pages, category
 * archives and related-product rows, restyled to match the homepage's primary button.
 * Elementor prints per-widget CSS with very high specificity, so the visual properties below
 * use !important. Everything is scoped to body.bbs-active, so Off mode is untouched.
 */

/* ---- Shared look ------------------------------------------------------------------------- */

body.bbs-active :is(
	.elementor-widget-wc-add-to-cart a.elementor-button.add_to_cart_button,
	.elementor-widget-wc-add-to-cart button.single_add_to_cart_button,
	.woocommerce div.product form.cart button.single_add_to_cart_button,
	ul.products li.product a.button.add_to_cart_button,
	ul.products li.product a.button.product_type_variable,
	ul.products li.product a.button.product_type_grouped,
	.e-loop-add-to-cart-form a.button.add_to_cart_button,
	.yith-ywraq-add-to-quote a.add-request-quote-button,
	.yith-ywraq-add-to-quote a.add-request-quote-button-addons
) {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 10px;
	box-sizing: border-box !important;
	min-height: 48px !important;
	margin: 0 !important;
	padding: 14px 26px !important;
	border: 2px solid var(--bbs-navy, #12325c) !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	font-family: var(--bbs-font-display, Archivo, sans-serif) !important;
	font-size: 14px !important;
	font-weight: 700 !important;
	line-height: 1.2 !important;
	letter-spacing: 0.08em !important;
	text-transform: uppercase !important;
	text-decoration: none !important;
	font-style: normal !important;
	white-space: nowrap;
	cursor: pointer;
	transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

/* Primary: Add to Cart */
body.bbs-active :is(
	.elementor-widget-wc-add-to-cart a.elementor-button.add_to_cart_button,
	.elementor-widget-wc-add-to-cart button.single_add_to_cart_button,
	.woocommerce div.product form.cart button.single_add_to_cart_button,
	ul.products li.product a.button.add_to_cart_button,
	ul.products li.product a.button.product_type_variable,
	ul.products li.product a.button.product_type_grouped,
	.e-loop-add-to-cart-form a.button.add_to_cart_button
) {
	background: var(--bbs-navy, #12325c) !important;
	color: #fff !important;
}

body.bbs-active :is(
	.elementor-widget-wc-add-to-cart a.elementor-button.add_to_cart_button,
	.elementor-widget-wc-add-to-cart button.single_add_to_cart_button,
	.woocommerce div.product form.cart button.single_add_to_cart_button,
	ul.products li.product a.button.add_to_cart_button,
	ul.products li.product a.button.product_type_variable,
	ul.products li.product a.button.product_type_grouped,
	.e-loop-add-to-cart-form a.button.add_to_cart_button
):is(:hover, :focus-visible) {
	background: var(--bbs-accent, #2e6fc7) !important;
	border-color: var(--bbs-accent, #2e6fc7) !important;
	color: #fff !important;
}

/* Elementor wraps the label in spans; keep them from fighting the button's typography. */
body.bbs-active .elementor-widget-wc-add-to-cart a.elementor-button.add_to_cart_button :is(.elementor-button-content-wrapper, .elementor-button-text) {
	font: inherit !important;
	letter-spacing: inherit !important;
	text-transform: inherit !important;
	color: inherit !important;
}

/* Secondary: Add to Quote (outlined twin) */
body.bbs-active .yith-ywraq-add-to-quote :is(a.add-request-quote-button, a.add-request-quote-button-addons) {
	background: transparent !important;
	color: var(--bbs-navy, #12325c) !important;
}

body.bbs-active .yith-ywraq-add-to-quote :is(a.add-request-quote-button, a.add-request-quote-button-addons):is(:hover, :focus-visible) {
	background: var(--bbs-navy, #12325c) !important;
	color: #fff !important;
}

/* Arrow on the primary action, as on the homepage. Decorative only. */
body.bbs-active .elementor-widget-wc-add-to-cart a.elementor-button.add_to_cart_button .elementor-button-text::after,
body.bbs-active ul.products li.product a.button.add_to_cart_button::after,
body.bbs-active .e-loop-add-to-cart-form a.button.add_to_cart_button::after {
	content: "→";
	content: "→" / "";
	display: inline-block;
	margin-left: 10px;
	font-family: var(--bbs-font-mono, "IBM Plex Mono", monospace);
	font-weight: 400;
	/* override WooCommerce's icon-font spinner/tick glyphs */
	font-size: 1em;
	position: static;
	animation: none;
}

/* WooCommerce AJAX states */
body.bbs-active :is(.elementor-widget-wc-add-to-cart a.add_to_cart_button, ul.products li.product a.add_to_cart_button).loading {
	opacity: 0.65;
	cursor: progress;
}
body.bbs-active .elementor-widget-wc-add-to-cart a.add_to_cart_button.added .elementor-button-text::after,
body.bbs-active ul.products li.product a.add_to_cart_button.added::after,
body.bbs-active .e-loop-add-to-cart-form a.add_to_cart_button.added::after {
	content: "✓";
	content: "✓" / "";
}

/* The "View cart" link WooCommerce appends after an AJAX add */
body.bbs-active a.added_to_cart.wc-forward {
	display: inline-block;
	margin: 10px 0 0 !important;
	padding: 4px 0 !important;
	background: none !important;
	border: 0 !important;
	color: var(--bbs-navy, #12325c) !important;
	font-family: var(--bbs-font-display, Archivo, sans-serif) !important;
	font-size: 13px !important;
	font-weight: 600 !important;
	letter-spacing: 0.06em !important;
	text-transform: uppercase !important;
	text-decoration: underline !important;
	text-underline-offset: 3px;
}

/* Focus ring: same two-tone ring as the new header and homepage */
body.bbs-active :is(
	.elementor-widget-wc-add-to-cart a.elementor-button,
	.elementor-widget-wc-add-to-cart button.single_add_to_cart_button,
	ul.products li.product a.button,
	.yith-ywraq-add-to-quote a,
	a.added_to_cart.wc-forward
):focus-visible {
	outline: 2px solid var(--bbs-accent, #2e6fc7) !important;
	outline-offset: 2px !important;
	box-shadow: 0 0 0 2px #fff !important;
}

/* Unpriced products get WooCommerce's "Read more" link on cards: show it as the outlined style. */
body.bbs-active ul.products li.product a.button.product_type_simple:not(.add_to_cart_button) {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	box-sizing: border-box !important;
	margin: 14px 0 0 !important;
	border: 2px solid var(--bbs-navy, #12325c) !important;
	border-radius: 0 !important;
	background: transparent !important;
	color: var(--bbs-navy, #12325c) !important;
	font-family: var(--bbs-font-display, Archivo, sans-serif) !important;
	font-style: normal !important;
	font-weight: 700 !important;
	line-height: 1.2 !important;
	text-transform: uppercase !important;
	text-decoration: none !important;
}
body.bbs-active ul.products li.product a.button.product_type_simple:not(.add_to_cart_button):is(:hover, :focus-visible) {
	background: var(--bbs-navy, #12325c) !important;
	color: #fff !important;
}

/* ---- Product page layout: stack the two actions at a common width ------------------------- */

body.bbs-active .elementor-widget-wc-add-to-cart,
body.bbs-active .elementor-widget-yith-ywraq-button-quote {
	width: 100% !important;
	max-width: 360px !important;
	--container-widget-width: 100% !important;
}
body.bbs-active .elementor-widget-wc-add-to-cart a.elementor-button.add_to_cart_button,
body.bbs-active .elementor-widget-yith-ywraq-button-quote a.add-request-quote-button {
	width: 100% !important;
}
body.bbs-active .elementor-widget-yith-ywraq-button-quote {
	margin-top: 12px !important;
}
body.bbs-active .elementor-widget-yith-ywraq-button-quote .yith_ywraq_add_item_browse_message a {
	color: var(--bbs-navy, #12325c);
	font-weight: 600;
	text-decoration: underline;
}


/* Price first, then Add to Cart, then Add to Quote. The template stacks these in one flex
   column; CSS order changes the visual order only (DOM order already reads correctly). */
body.bbs-active .e-con:has(> .elementor-widget-wc-add-to-cart) > .elementor-widget-text-editor,
body.bbs-active .e-con:has(> .elementor-widget-wc-add-to-cart) > .elementor-widget-woocommerce-product-price {
	order: 1;
}
body.bbs-active .e-con:has(> .elementor-widget-wc-add-to-cart) > .elementor-widget-woocommerce-product-price {
	margin-bottom: 14px !important;
}
body.bbs-active .e-con:has(> .elementor-widget-wc-add-to-cart) > .elementor-widget-wc-add-to-cart {
	order: 2;
}
body.bbs-active .e-con:has(> .elementor-widget-wc-add-to-cart) > .elementor-widget-yith-ywraq-button-quote {
	order: 3;
}
body.bbs-active .e-con:has(> .elementor-widget-wc-add-to-cart) > .elementor-widget-shortcode {
	order: 4;
}
body.bbs-active .e-con:has(> .elementor-widget-wc-add-to-cart) > .elementor-widget-woocommerce-product-price .price {
	font-family: var(--bbs-font-display, Archivo, sans-serif) !important;
	font-size: 28px !important;
	font-weight: 800 !important;
	letter-spacing: -0.01em;
	color: var(--bbs-navy, #12325c) !important;
}

/* ---- Product cards (category pages, related products) ------------------------------------ */

body.bbs-active ul.products li.product :is(a.button.add_to_cart_button, a.button.product_type_variable, a.button.product_type_grouped, a.button.product_type_simple),
body.bbs-active ul.products li.product .yith-ywraq-add-to-quote :is(a.add-request-quote-button, a.add-request-quote-button-addons) {
	width: 100% !important;
	min-height: 44px !important;
	padding: 12px 14px !important;
	font-size: 12.5px !important;
	letter-spacing: 0.07em !important;
}
body.bbs-active ul.products li.product .yith-ywraq-add-to-quote {
	margin-top: 8px !important;
}
body.bbs-active ul.products li.product a.button.add_to_cart_button {
	margin-top: 14px !important;
}

/* Elementor loop grids (/shop/, All Bollards): same card sizing as the WooCommerce product lists */
/* :is() takes its most specific argument, so the shared rule above scores (0,5,3); these need more. */
html body.bbs-active [data-elementor-type="loop-item"] .elementor-widget :is(.e-loop-add-to-cart-form a.button.add_to_cart_button, .yith-ywraq-add-to-quote a.add-request-quote-button-addons, .yith-ywraq-add-to-quote a.add-request-quote-button) {
	width: 100% !important;
	max-width: 100% !important;
	min-width: 0 !important;
	min-height: 44px !important;
	padding: 12px 8px !important;
	font-size: 12px !important;
	letter-spacing: 0.05em !important;
	white-space: normal !important;
	text-align: center;
}
/* The loop cards leave ~157px for content; keep the wrappers from growing past it. */
html body.bbs-active [data-elementor-type="loop-item"] .elementor-widget :is(.elementor-add-to-cart, .e-loop-add-to-cart-form-container, .e-loop-add-to-cart-form) {
	width: 100% !important;
	max-width: 100% !important;
	min-width: 0 !important;
}
/* The loop template pulls the Add to Cart widget 15px outward on each side; line it up with Add to Quote. */
html body.bbs-active [data-elementor-type="loop-item"] .elementor-widget-woocommerce-product-add-to-cart > .elementor-widget-container {
	margin-left: 0 !important;
	margin-right: 0 !important;
}
html body.bbs-active [data-elementor-type="loop-item"] .elementor-widget .e-loop-add-to-cart-form a.button.add_to_cart_button::after {
	margin-left: 8px;
}
html body.bbs-active [data-elementor-type="loop-item"] :is(.elementor-widget-woocommerce-product-add-to-cart, .elementor-widget-yith-ywraq-button-quote) {
	width: 100% !important;
	max-width: none !important;
}

@media (max-width: 767px) {
	body.bbs-active .elementor-widget-wc-add-to-cart,
	body.bbs-active .elementor-widget-yith-ywraq-button-quote {
		max-width: none !important;
	}
	body.bbs-active :is(
		.elementor-widget-wc-add-to-cart a.elementor-button.add_to_cart_button,
		.yith-ywraq-add-to-quote a.add-request-quote-button
	) {
		min-height: 52px !important;
		padding: 14px 12px !important;
		font-size: 13px !important;
		letter-spacing: 0.06em !important;
		white-space: normal;
		text-align: center;
	}
	body.bbs-active ul.products li.product :is(a.button, .yith-ywraq-add-to-quote a) {
		padding: 12px 8px !important;
		font-size: 12px !important;
		letter-spacing: 0.05em !important;
		white-space: normal;
		text-align: center;
	}
}

@media (prefers-reduced-motion: reduce) {
	body.bbs-active :is(ul.products li.product a.button, .elementor-widget-wc-add-to-cart a.elementor-button, .yith-ywraq-add-to-quote a) {
		transition: none;
	}
}

/* ---- Empty quote list (the header's Quote link) -------------------------------------------- */

body.bbs-active .bbs-quote-empty {
	max-width: 640px;
	margin: 0 auto 28px;
	padding: 24px 28px;
	border: 1px solid var(--bbs-border, #e1e4e8);
	border-left: 4px solid var(--bbs-navy, #12325c);
	background: var(--bbs-surface, #fff);
	color: var(--bbs-body, #3c4552);
	font-family: var(--bbs-font-body, Barlow, Helvetica, sans-serif);
	font-size: 16px;
	line-height: 1.55;
	text-align: left;
}
body.bbs-active .bbs-quote-empty__title {
	margin: 0 0 8px;
	color: var(--bbs-text, #14181d);
	font-family: var(--bbs-font-display, Archivo, sans-serif);
	font-size: 20px;
	font-weight: 700;
	line-height: 1.25;
}
body.bbs-active .bbs-quote-empty__text {
	margin: 0 0 6px;
}
body.bbs-active .bbs-quote-empty__text:last-child {
	margin-bottom: 0;
}
body.bbs-active .bbs-quote-empty a {
	color: var(--bbs-navy, #12325c);
	font-weight: 600;
	text-decoration: underline;
	text-underline-offset: 3px;
}
body.bbs-active .bbs-quote-empty a:is(:hover, :focus-visible) {
	color: var(--bbs-accent, #2e6fc7);
}
@media (max-width: 767px) {
	body.bbs-active .bbs-quote-empty {
		padding: 20px;
	}
}

/* ---- Quote-only products (crash-rated, automatic) -------------------------------------- */
/* The cart form is gone for these; this replaces it, so it has to carry the same visual weight
   as the Add to Cart button it stands in for. */
body.bbs-active .bbs-quote-only {
	margin: 4px 0 24px;
}
body.bbs-active .bbs-quote-only__note {
	margin: 0 0 12px;
	max-width: 46ch;
	font-size: 0.95rem;
	line-height: 1.55;
	opacity: 0.8;
}
body.bbs-active .bbs-quote-only__cta {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 16px 30px;
	border: 0;
	background: var(--bbs-navy, #12325c);
	color: var(--bbs-surface, #fff);
	font-family: var(--bbs-font-mono, inherit);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	text-decoration: none;
	transition: background-color 0.15s ease;
}
body.bbs-active .bbs-quote-only__cta:is(:hover, :focus-visible) {
	background: var(--bbs-accent, #2e6fc7);
	color: var(--bbs-surface, #fff);
}
@media (max-width: 640px) {
	body.bbs-active .bbs-quote-only__cta {
		width: 100%;
		justify-content: center;
	}
}

/* ---- Ground receiver add-on ------------------------------------------------------------ */
/* Sits under the cart form on removable bollards. Deliberately quieter than Add to Cart — it is
   a second decision, not a competing one — but the note has to read as important. */
body.bbs-active .bbs-addon {
	margin: 20px 0 8px;
	padding: 16px 18px;
	border: 1px solid var(--bbs-hairline, rgba(18, 50, 92, 0.16));
	background: rgba(18, 50, 92, 0.03);
}
body.bbs-active .bbs-addon__note {
	margin: 0 0 14px;
	max-width: 52ch;
	font-size: 0.93rem;
	line-height: 1.55;
}
body.bbs-active .bbs-addon__card {
	display: flex;
	align-items: center;
	gap: 14px;
}
body.bbs-active .bbs-addon__img {
	flex: none;
	width: 56px;
	height: 56px;
	object-fit: contain;
	background: #fff;
}
body.bbs-active .bbs-addon__body {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
	flex: 1 1 auto;
}
body.bbs-active .bbs-addon__name {
	color: inherit;
	font-weight: 600;
	line-height: 1.3;
	text-decoration: none;
}
body.bbs-active .bbs-addon__name:is(:hover, :focus-visible) {
	text-decoration: underline;
	text-underline-offset: 3px;
}
body.bbs-active .bbs-addon__price {
	font-size: 0.95rem;
	opacity: 0.8;
}
body.bbs-active .bbs-addon__btn {
	flex: none;
	padding: 12px 20px;
	border: 1px solid var(--bbs-navy, #12325c);
	background: transparent;
	color: var(--bbs-navy, #12325c);
	font-family: var(--bbs-font-mono, inherit);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.07em;
	text-transform: uppercase;
	text-decoration: none;
	white-space: nowrap;
	transition: background-color 0.15s ease, color 0.15s ease;
}
body.bbs-active .bbs-addon__btn:is(:hover, :focus-visible) {
	background: var(--bbs-navy, #12325c);
	color: var(--bbs-surface, #fff);
}
@media (max-width: 560px) {
	body.bbs-active .bbs-addon__card {
		flex-wrap: wrap;
	}
	body.bbs-active .bbs-addon__btn {
		width: 100%;
		text-align: center;
	}
}