/* mu-plugins/CONTRACTOR-COMMERCE/assets/contractor-commerce.css
 * Scope: enqueued only on the shop page / shop template and the front page. Every rule is
 * prefixed with a body class so nothing leaks to other templates.
 * The theme's header#masthead is position:fixed (custom.css:934-945), so it contributes no
 * height; the theme compensates with a per-breakpoint PERCENTAGE margin-top on whichever
 * section comes first (.insideimage 7.5% custom.css:3325, .sliderfull 7% custom.css:1924).
 * We reproduce that ladder as a fallback but prefer the JS-measured --bcc-header-h
 * (assets/contractor-commerce.js), exact at every width and after the .smallbar shrink. */

:root { --bcc-header-h: 7.5%; }   /* replaced with a px value by contractor-commerce.js */

/* 1. flush under the fixed nav, zero extra chrome */
.page-template-bcc-shop-fullwidth .bcc-shop-wrap { padding-top: 0; margin-top: 0; }
.page-template-bcc-shop-fullwidth #content.bcc-shop-content {
	padding-top: var(--bcc-header-h); padding-bottom: 0; margin-top: 0; max-width: none;
}
.page-template-bcc-shop-fullwidth .bcc-shop-main { margin: 0; padding: 0; width: 100%; max-width: none; }
/* the mount div plus the elements the vendor bundle swaps in at runtime (it removes
 * #concom-navigator and inserts #concom-shop / #concom-custom-quote under <main>) */
.page-template-bcc-shop-fullwidth #concom-navigator,
.page-template-bcc-shop-fullwidth #concom-shop,
.page-template-bcc-shop-fullwidth #concom-custom-quote { width: 100%; max-width: none; margin: 0; }

/* 2. CSS-only fallback ladder mirroring the theme's .insideimage offsets (media-query em
 *    resolves against the 16px browser default, not html{font-size:14px!important}). */
@media screen and (max-width: 25em)                               { :root { --bcc-header-h: 8%; } }
@media screen and (min-width: 39.939em) and (max-width: 55em)     { :root { --bcc-header-h: 11.5%; } }
@media screen and (min-width: 55.001em) and (max-width: 59.999em) { :root { --bcc-header-h: 14.5%; } }
@media screen and (min-width: 60em)     and (max-width: 63.938em) { :root { --bcc-header-h: 9.5%; } }

/* 3. full-width container: 2% gutters below 1024px, none at/above (capped only by .site 1700px) */
.page-template-bcc-shop-fullwidth #content.bcc-shop-content { padding-left: 2%; padding-right: 2%; }
@media screen and (min-width: 64em) {
	.page-template-bcc-shop-fullwidth #content.bcc-shop-content { padding-left: 0; padding-right: 0; }
}

/* 4. unclip the widget: .site{overflow:hidden} (custom.css:6-11) kills position:sticky and
 *    clips dropdowns inside the storefront. Restore on this template only. */
.page-template-bcc-shop-fullwidth #page.site { overflow: visible; }

/* 5. mobile: breathing room above the fixed bottom bar */
@media screen and (max-width: 59.999em) {
	.page-template-bcc-shop-fullwidth .bcc-shop-main { padding-bottom: 1em; }
}

/* 6. homepage hero CTA — "Instant HVAC Quote" row appended to the active slide's content */
.sliderfull .bcc-quote-row { margin-top: .4em; }
.sliderfull a.btn.bcc-quote-btn {
	display: inline-block; background-color: #FDC82F; border: .2em solid #FDC82F; color: #000;
	margin: 0; max-width: 22em; width: auto; text-align: center; text-transform: uppercase;
	padding: 0.72em 1.2em; border-radius: 0; letter-spacing: .06em; font-weight: 900;
	font-family: 'poppinsregular', sans-serif; font-size: .9em;
}
.sliderfull a.btn.bcc-quote-btn:hover,
.sliderfull a.btn.bcc-quote-btn:focus { background-color: #000; border-color: #000; color: #fff; }
@media screen and (max-width: 59.999em) {
	.sliderfull a.btn.bcc-quote-btn { display: block; width: 100%; max-width: none; margin: .5em 0; }
}
