/*
Theme Name: Bull BBQ EU (US Look)
Theme URI: https://bullbbq.eu/
Description: Child theme of Domestica for bullbbq.eu. Keeps every function of the live Domestica-child theme (shortcodes, dealer & distributor areas, media library, WooCommerce tweaks, recipe templates) and re-skins the site to the Bull BBQ US design system used on bullbbq.com — condensed uppercase headings, Bull red #d11d23, angled buttons and panels, white sticky header, black footer.
Author: M7Alpha
Author URI: https://m7alpha.com/
Version: 1.0.0
Text Domain: domestica
Template: Domestica
*/

/* ===========================================================================
   CONTENTS
   1.  Design tokens
   2.  Typography
   3.  Buttons
   4.  Angled panels & dividers
   5.  Header
   6.  Page titles / banners
   7.  Links & lists
   8.  Forms (incl. Gravity Forms)
   9.  WooCommerce — archive, cards, single product
   10. Recipes
   11. Blog / news
   12. Dealer, distributor & media areas
   13. Footer
   14. Elementor & misc components
   15. Responsive
   ---------------------------------------------------------------------------
   base-layout.css (enqueued BEFORE this file) carries the original layout
   rules. Everything visual is set here so the two never fight for the same
   job: layout there, looks here.
   ======================================================================== */


/* ===========================================================================
   1. DESIGN TOKENS  — lifted from the bullbbq.com theme.json palette
   ======================================================================== */

:root {
	/* Brand colour */
	--bull-red:          #d11d23;   /* Bull Red      */
	--bull-red-brown:    #6e0d0e;   /* Bull Red Brown — button/link hover */
	--bull-black:        #000000;
	--bull-dark-gray:    #231f20;   /* Bull Dark Gray */
	--bull-light-gray:   #e8e7e3;   /* Bull Light Gray — card & section fill */
	--bull-mid-gray:     #6f6f6f;
	--bull-white:        #ffffff;

	/* Type — the first family in each stack is the licensed Adobe Fonts face
	   used on bullbbq.com. It only resolves once an Adobe Fonts kit covering
	   this domain is loaded (see BULLBBQ_ADOBE_FONTS_KIT in functions.php);
	   until then the Google Fonts fallbacks render a near-identical match. */
	--bull-font-head: "din-2014-narrow", "Barlow Semi Condensed", "Archivo Narrow", "Helvetica Neue", Helvetica, Arial, sans-serif;
	--bull-font-body: "trade-gothic-next", "Archivo", "Helvetica Neue", Helvetica, Arial, sans-serif;

	/* Fluid type scale — mirrors the bullbbq.com preset sizes */
	--bull-fs-x-small: 16px;
	--bull-fs-small:   18px;
	--bull-fs-medium:  clamp(17px, 0.95rem + 0.25vw, 20px);
	--bull-fs-large:   clamp(20px, 1.1rem + 0.4vw, 24px);
	--bull-fs-h4:      clamp(20px, 1.1rem + 0.5vw, 26px);
	--bull-fs-h3:      clamp(24px, 1.2rem + 1vw, 36px);
	--bull-fs-h2:      clamp(30px, 1.4rem + 1.8vw, 48px);
	--bull-fs-h1:      clamp(36px, 1.6rem + 2.8vw, 64px);

	/* Shape */
	--bull-header-h:   120px;       /* must match Qode Options > Header height */
	--bull-angle:      -15deg;      /* the Bull slant: skewX(345deg) on .com */
	--bull-radius:     0;           /* the US site is square-edged throughout */

	/* Spacing */
	--bull-space-s:    clamp(30px, 4vw, 40px);
	--bull-space-m:    clamp(40px, 6vw, 60px);
	--bull-space-l:    clamp(50px, 8vw, 80px);

	/* Qode variable remap — anything in the parent theme still reading
	   --qode-main-color now picks up Bull red. */
	--qode-main-color: var(--bull-red);
}


/* ===========================================================================
   2. TYPOGRAPHY
   ======================================================================== */

body,
body p,
.qodef-section-title .qodef-m-text,
.single-recipe-extra-details,
.qodef-banner.qodef-layout--link-button .qodef-m-text,
.cat-name,
.qodef-social-icons-group .qodef-social-icons-item a,
.qodef-blog.qodef--single .qodef-blog-item .qodef-e-bottom-holder .qodef-e-info > * {
	font-family: var(--bull-font-body) !important;
}

body {
	font-size: var(--bull-fs-medium);
	line-height: 1.7;
	color: var(--bull-black);
	background-color: var(--bull-white);
	-webkit-font-smoothing: antialiased;
}

/* Headings: condensed, bold, uppercase, tight — never italic. */
h1, h2, h3, h4, h5, h6,
.qodef-h1, .qodef-h2, .qodef-h3, .qodef-h4, .qodef-h5, .qodef-h6,
.rs-layer,
.recipe-title,
.dealer-title,
.technical-title,
.qodef-page-title .qodef-m-title,
.qodef-woo-product-title,
.qodef-e-title,
.qodef-section-title .qodef-m-title,
.elementor-heading-title,
#qodef-single-post-navigation .qodef-m-nav.qodef--next .qodef-m-nav-title,
#qodef-single-post-navigation .qodef-m-nav.qodef--prev .qodef-m-nav-title {
	font-family: var(--bull-font-head) !important;
	font-weight: 700 !important;
	font-style: normal !important;
	text-transform: uppercase !important;
	line-height: 1.1 !important;
	letter-spacing: 0 !important;
	color: var(--bull-black);
	text-wrap: pretty;
}

h1, .qodef-h1 { font-size: var(--bull-fs-h1) !important; margin: 0 0 0.4em; }
h2, .qodef-h2 { font-size: var(--bull-fs-h2) !important; margin: 0 0 0.4em; }
h3, .qodef-h3 { font-size: var(--bull-fs-h3) !important; margin: 0 0 0.4em; }
h4, .qodef-h4 { font-size: var(--bull-fs-h4) !important; margin: 0 0 0.4em; }
h5, .qodef-h5 { font-size: var(--bull-fs-large) !important; margin: 0 0 0.4em; }
h6, .qodef-h6 { font-size: var(--bull-fs-small) !important; margin: 0 0 0.4em; }

/* The US site sets the second line of a two-line headline in red. */
h1 strong, h2 strong, h3 strong,
.qodef-h1 strong, .qodef-h2 strong, .qodef-h3 strong,
h1 em, h2 em, h3 em {
	color: var(--bull-red) !important;
	font-style: normal !important;
	font-weight: inherit !important;
}

/* Section eyebrow / subtitle */
.qodef-section-title .qodef-m-subtitle {
	font-family: var(--bull-font-head) !important;
	font-weight: 700 !important;
	font-style: normal !important;
	text-transform: uppercase !important;
	letter-spacing: 0.08em !important;
	color: var(--bull-red) !important;
}

strong, b { font-weight: 700; }

::selection {
	color: var(--bull-white);
	background-color: var(--bull-red-brown);
}


/* ===========================================================================
   3. BUTTONS
   ---------------------------------------------------------------------------
   The Bull button is a parallelogram: a flat face with both vertical edges
   slanted by 15°. Anchors and spans get it from a skewed ::before shell (which
   also gives us an outline variant for free); real <input>/<button> elements
   cannot carry pseudo-elements reliably, so those use clip-path instead.
   ======================================================================== */

.bull-btn,
.qodef-button.qodef-layout--filled,
.qodef-button.qodef-layout--outlined,
.qodef-button.qodef-layout--textual,
.qodef-qi-button,
.qodef-e-read-more .qodef-qi-button.qodef-layout--filled,
.elementor-button,
.recipe-btn,
.findadealer-cont a,
.product-pdfs-cont p a,
.single_schdule_btn,
.single-feat-product-inner-btn,
.product-warranty-btn,
a.export-csv.button,
.kitchen_conf_open,
#qodef-woo-page .button,
#qodef-woo-page .added_to_cart,
.qodef-woo-shortcode .button,
.woocommerce a.button,
.full-btn,
.main_cta > a .qodef-menu-item-text,
.secondary_cta > a .qodef-menu-item-text {
	position: relative !important;
	isolation: isolate;
	display: inline-block !important;
	width: auto !important;
	max-width: 100%;
	padding: 11px 32px !important;
	margin: 0;
	font-family: var(--bull-font-body) !important;
	font-size: var(--bull-fs-x-small) !important;
	font-weight: 600 !important;
	font-style: normal !important;
	line-height: 1.3 !important;
	letter-spacing: 0.01em !important;
	text-align: center;
	text-transform: none !important;
	text-decoration: none !important;
	color: var(--bull-white) !important;
	background-color: transparent !important;
	background-image: none !important;
	border: 0 !important;
	border-radius: var(--bull-radius) !important;
	box-shadow: none !important;
	cursor: pointer;
	transition: color .2s ease-out;
}

.bull-btn::before,
.qodef-button.qodef-layout--filled::before,
.qodef-button.qodef-layout--outlined::before,
.qodef-button.qodef-layout--textual::before,
.qodef-qi-button::before,
.qodef-e-read-more .qodef-qi-button.qodef-layout--filled::before,
.elementor-button::before,
.recipe-btn::before,
.findadealer-cont a::before,
.product-pdfs-cont p a::before,
.single_schdule_btn::before,
.single-feat-product-inner-btn::before,
.product-warranty-btn::before,
a.export-csv.button::before,
.kitchen_conf_open::before,
#qodef-woo-page .button::before,
#qodef-woo-page .added_to_cart::before,
.qodef-woo-shortcode .button::before,
.woocommerce a.button::before,
.full-btn::before,
.main_cta > a .qodef-menu-item-text::before,
.secondary_cta > a .qodef-menu-item-text::before {
	content: '';
	position: absolute;
	inset: 0;
	z-index: -1;
	background-color: var(--bull-red);
	transform: skewX(var(--bull-angle));
	transition: background-color .2s ease-out, border-color .2s ease-out;
}

/* Hover — the US site darkens to Red Brown */
.bull-btn:hover, .bull-btn:focus,
.qodef-button.qodef-layout--filled:hover,
.qodef-button.qodef-layout--outlined:hover,
.qodef-button.qodef-layout--textual:hover,
.qodef-qi-button:hover,
.qodef-e-read-more .qodef-qi-button.qodef-layout--filled:hover,
.elementor-button:hover,
.recipe-btn:hover,
.findadealer-cont a:hover,
.product-pdfs-cont p a:hover,
.single_schdule_btn:hover,
.single-feat-product-inner-btn:hover,
.product-warranty-btn:hover,
a.export-csv.button:hover,
.kitchen_conf_open:hover,
#qodef-woo-page .button:hover,
#qodef-woo-page .added_to_cart:hover,
.qodef-woo-shortcode .button:hover,
.woocommerce a.button:hover,
.full-btn:hover,
.main_cta > a:hover .qodef-menu-item-text,
.secondary_cta > a:hover .qodef-menu-item-text {
	color: var(--bull-white) !important;
	background-color: transparent !important;
}

.bull-btn:hover::before, .bull-btn:focus::before,
.qodef-button.qodef-layout--filled:hover::before,
.qodef-button.qodef-layout--outlined:hover::before,
.qodef-button.qodef-layout--textual:hover::before,
.qodef-qi-button:hover::before,
.qodef-e-read-more .qodef-qi-button.qodef-layout--filled:hover::before,
.elementor-button:hover::before,
.recipe-btn:hover::before,
.findadealer-cont a:hover::before,
.product-pdfs-cont p a:hover::before,
.single_schdule_btn:hover::before,
.single-feat-product-inner-btn:hover::before,
.product-warranty-btn:hover::before,
a.export-csv.button:hover::before,
.kitchen_conf_open:hover::before,
#qodef-woo-page .button:hover::before,
#qodef-woo-page .added_to_cart:hover::before,
.qodef-woo-shortcode .button:hover::before,
.woocommerce a.button:hover::before,
.full-btn:hover::before,
.main_cta > a:hover .qodef-menu-item-text::before,
.secondary_cta > a:hover .qodef-menu-item-text::before {
	background-color: var(--bull-red-brown);
}

/* Qode's underline pseudo on buttons/links — the US site has none. */
.qodef-button.qodef-layout--textual::after,
.qodef-qi-button::after,
.elementor-button::after,
#qodef-woo-page .button::after,
.qodef-woo-shortcode .button::after {
	display: none !important;
}

/* --- Variants ------------------------------------------------------------ */

/* Black — the US site's secondary action ("Become A Dealer", "Find A Dealer") */
.bull-btn--black::before,
.secondary_cta > a .qodef-menu-item-text::before,
.product-warranty-btn::before,
.findadealer-cont a::before {
	background-color: var(--bull-black);
}
.bull-btn--black:hover::before,
.secondary_cta > a:hover .qodef-menu-item-text::before,
.product-warranty-btn:hover::before,
.findadealer-cont a:hover::before {
	background-color: var(--bull-dark-gray);
}

/* Outline — transparent face, 2px rule, inherits the current text colour */
.bull-btn--outline,
.qodef-button.qodef-layout--outlined,
.product-pdfs-cont p a,
.single_schdule_btn,
.single-feat-product-inner-btn {
	color: var(--bull-black) !important;
}
.bull-btn--outline::before,
.qodef-button.qodef-layout--outlined::before,
.product-pdfs-cont p a::before,
.single_schdule_btn::before,
.single-feat-product-inner-btn::before {
	background-color: transparent;
	border: 2px solid currentColor;
}
.bull-btn--outline:hover,
.qodef-button.qodef-layout--outlined:hover,
.product-pdfs-cont p a:hover,
.single_schdule_btn:hover,
.single-feat-product-inner-btn:hover {
	color: var(--bull-white) !important;
}
.bull-btn--outline:hover::before,
.qodef-button.qodef-layout--outlined:hover::before,
.product-pdfs-cont p a:hover::before,
.single_schdule_btn:hover::before,
.single-feat-product-inner-btn:hover::before {
	background-color: var(--bull-red);
	border-color: var(--bull-red);
}

/* Outline on a dark/photographic background */
.qodef-skin--light .bull-btn--outline,
.bull-btn--outline-light {
	color: var(--bull-white) !important;
}

/* Real form controls — clip-path instead of a pseudo shell */
.gform_body .gform_button,
.gform_wrapper .gform_button,
input[type="submit"],
button[type="submit"],
.wpcf7-submit,
.widget.woocommerce .price_slider_amount button,
#qodef-woo-page button.button,
.woocommerce button.button {
	padding: 12px 38px !important;
	font-family: var(--bull-font-body) !important;
	font-size: var(--bull-fs-x-small) !important;
	font-weight: 600 !important;
	line-height: 1.3 !important;
	text-transform: none !important;
	letter-spacing: 0.01em !important;
	color: var(--bull-white) !important;
	background-color: var(--bull-red) !important;
	border: 0 !important;
	border-radius: 0 !important;
	cursor: pointer;
	clip-path: polygon(14px 0, 100% 0, calc(100% - 14px) 100%, 0 100%);
	transition: background-color .2s ease-out;
}

.gform_body .gform_button:hover,
.gform_wrapper .gform_button:hover,
input[type="submit"]:hover,
button[type="submit"]:hover,
.wpcf7-submit:hover,
.widget.woocommerce .price_slider_amount button:hover,
#qodef-woo-page button.button:hover,
.woocommerce button.button:hover {
	background-color: var(--bull-red-brown) !important;
	color: var(--bull-white) !important;
}

/* Gravity Forms "previous" step button reads as the quieter black action */
.gform_wrapper .gform_previous_button {
	background-color: var(--bull-dark-gray) !important;
}
.gform_wrapper .gform_previous_button:hover {
	background-color: var(--bull-black) !important;
}


/* ===========================================================================
   4. ANGLED PANELS & DIVIDERS
   ---------------------------------------------------------------------------
   .com's signature: a colour panel whose inner edge is cut at 15°, sitting
   against a photo. Add .bull-angle-left / .bull-angle-right to any Elementor
   column, section or inner container to reproduce it.
   ======================================================================== */

.bull-angle-left,
.bull-angle-right,
.bull-angle-both {
	position: relative;
	z-index: 1;
	padding: clamp(28px, 4vw, 56px) clamp(28px, 4vw, 64px);
}

.bull-angle-left::before,
.bull-angle-both::before {
	content: '';
	position: absolute;
	top: 0;
	left: -100px;
	z-index: -1;
	width: calc(100% + 100px);
	height: 100%;
	transform: skewX(var(--bull-angle));
}

.bull-angle-right::after,
.bull-angle-both::after {
	content: '';
	position: absolute;
	top: 0;
	right: -100px;
	z-index: -1;
	width: calc(100% + 100px);
	height: 100%;
	transform: skewX(var(--bull-angle));
}

/* Fill colours — set on the element, painted by the skewed pseudo only. */
.bull-fill-red   { --bull-fill: var(--bull-red); }
.bull-fill-brown { --bull-fill: var(--bull-red-brown); }
.bull-fill-black { --bull-fill: var(--bull-black); }
.bull-fill-dark  { --bull-fill: var(--bull-dark-gray); }
.bull-fill-gray  { --bull-fill: var(--bull-light-gray); }
.bull-fill-white { --bull-fill: var(--bull-white); }

.bull-angle-left::before,
.bull-angle-right::after,
.bull-angle-both::before,
.bull-angle-both::after {
	background-color: var(--bull-fill, var(--bull-red));
}

.bull-fill-red, .bull-fill-brown, .bull-fill-black, .bull-fill-dark { color: var(--bull-white); }
.bull-fill-gray, .bull-fill-white { color: var(--bull-black); }

.bull-fill-red h1, .bull-fill-red h2, .bull-fill-red h3, .bull-fill-red h4, .bull-fill-red p,
.bull-fill-brown h1, .bull-fill-brown h2, .bull-fill-brown h3, .bull-fill-brown h4, .bull-fill-brown p,
.bull-fill-black h1, .bull-fill-black h2, .bull-fill-black h3, .bull-fill-black h4, .bull-fill-black p,
.bull-fill-dark h1, .bull-fill-dark h2, .bull-fill-dark h3, .bull-fill-dark h4, .bull-fill-dark p {
	color: var(--bull-white) !important;
}

/* Small skewed rule used as a heading accent */
.bull-rule::after,
.qodef-section-title .qodef-m-title::after {
	content: '';
	display: block;
	width: 46px;
	height: 4px;
	margin-top: 14px;
	background-color: var(--bull-red);
	transform: skewX(var(--bull-angle));
}


/* ===========================================================================
   5. HEADER
   ---------------------------------------------------------------------------
   bullbbq.com: solid white, sticky, thin black uppercase nav, red hover,
   red + black angled CTAs on the right. No transparent-over-hero treatment.
   ======================================================================== */

.qodef-header--standard #qodef-page-header,
#qodef-page-header,
.single #qodef-page-header,
.search-results #qodef-page-header,
.tax-product_cat.qodef-header--standard #qodef-page-header {
	background: var(--bull-white) !important;
	background-color: var(--bull-white) !important;
	box-shadow: 0 1px 0 rgba(0, 0, 0, .08);
}

#qodef-page-header-inner,
.qodef-header-sticky-inner {
	background-color: var(--bull-white) !important;
}

/* The hero no longer slides under the header.
   The live site runs Qode's "content behind header" option, which pulls the
   page up by the header height. bullbbq.com has a solid header with the
   content starting below it, so we cancel the pull and reserve the header's
   height instead. If you switch "Content behind header" OFF in
   Qode Options > Header, this block becomes a no-op and can stay as is.
   Tune --bull-header-h to the header height set in Qode Options. */
.qodef-header-standard--center #qodef-page-outer,
body.qodef-content-behind-header #qodef-page-outer,
body.qodef-content--behind-header #qodef-page-outer {
	margin-top: 0 !important;
	padding-top: var(--bull-header-h) !important;
}

.qodef-header-logo-link img,
#qodef-page-header .qodef-header-logo-link.qodef-height--not-set img {
	width: 180px !important;
	max-height: 70% !important;
	object-fit: contain;
}

.qodef-header--sticky-display #qodef-page-header .qodef-header-logo-link.qodef-height--not-set img {
	max-height: 100% !important;
}

/* Navigation */
.qodef-header-navigation > ul > li > a,
.qodef-header-sticky .qodef-header-navigation > ul > li > a {
	font-family: var(--bull-font-head) !important;
	font-size: 17px !important;
	font-weight: 700 !important;
	font-style: normal !important;
	letter-spacing: 0.02em !important;
	text-transform: uppercase !important;
	color: var(--bull-black) !important;
	transition: color .2s ease-out;
}

.qodef-header-navigation > ul > li { margin: 0 13px; }

.qodef-header-navigation > ul > li > a:hover,
#qodef-page-header-inner.qodef-skin--dark nav > ul > li > a:hover,
.qodef-custom-header-layout.qodef-skin--dark nav > ul > li > a:hover,
#qodef-page-header-inner.qodef-skin--dark nav > ul > li.current-menu-ancestor > a,
#qodef-page-header-inner.qodef-skin--dark nav > ul > li.current-menu-item > a,
.qodef-custom-header-layout.qodef-skin--dark nav > ul > li.current-menu-ancestor > a,
.qodef-custom-header-layout.qodef-skin--dark nav > ul > li.current-menu-item > a,
.qodef-header--sticky-display .current-menu-item a {
	color: var(--bull-red) !important;
}

/* Qode's animated underline — kept, squared off and in Bull red */
.qodef-header-navigation > ul > li > a::after {
	background-color: var(--bull-red) !important;
	height: 3px !important;
}

/* Drop-downs: white card, condensed uppercase items */
.qodef-header-navigation ul li.qodef-menu-item--narrow ul,
.qodef-header-navigation .qodef-drop-down-second-inner {
	background-color: var(--bull-white) !important;
	border-top: 3px solid var(--bull-red);
	box-shadow: 0 12px 30px rgba(0, 0, 0, .12);
}

.qodef-header-navigation > ul > li.qodef-menu-item--narrow ul:not(.qodef-drop-down--right) li > a,
.qodef-header-navigation .qodef-drop-down-second-inner li > a {
	font-family: var(--bull-font-head) !important;
	font-size: 15px !important;
	font-weight: 700 !important;
	letter-spacing: 0.02em !important;
	text-transform: uppercase !important;
	color: var(--bull-black) !important;
}

.qodef-header-navigation > ul > li.qodef-menu-item--narrow ul:not(.qodef-drop-down--right) li > a:hover,
.qodef-header-navigation > ul > li.qodef-menu-item--narrow ul:not(.qodef-drop-down--right) li.current-menu-item > a {
	color: var(--bull-red) !important;
}

/* Header CTAs */
.main_cta > a,
.secondary_cta > a {
	padding: 0 !important;
}

.qodef-mobile-header-navigation .main_cta .qodef-menu-item-text,
.qodef-mobile-header-navigation .secondary_cta .qodef-menu-item-text {
	margin-left: 0;
}

/* Search & opener icons */
.qodef-search-opener,
#qodef-page-header .qodef-opener-icon {
	color: var(--bull-black) !important;
}
.qodef-search-opener:hover,
#qodef-page-header .qodef-opener-icon:hover {
	color: var(--bull-red) !important;
}
.qodef-search-cover-form .qodef-m-inner {
	background-color: rgba(255, 255, 255, .97) !important;
}

/* the legacy sheet tinted every .qodef-m-inner — keep that off everything
   except the search overlay above */
.qodef-page-title .qodef-m-inner,
.qodef-woo-dropdown-cart .qodef-m-inner,
#qodef-page-header .qodef-m-inner:not(.qodef-search-cover-form .qodef-m-inner) {
	background-color: transparent !important;
}
.qodef-search-cover-form .qodef-m-form-field {
	font-family: var(--bull-font-head) !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	color: var(--bull-black) !important;
}

/* Utility strip above the header (Distributors / Dealers Area / Log out) */
a.topheaderitem {
	font-family: var(--bull-font-head) !important;
	font-size: 14px !important;
	font-weight: 700 !important;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--bull-white) !important;
}
a.topheaderitem:hover,
a.loggedarealink:hover * {
	color: var(--bull-red) !important;
}

/* Mobile header */
#qodef-page-mobile-header,
#qodef-page-mobile-header .qodef-mobile-header-inner {
	background-color: var(--bull-white) !important;
}
#qodef-page-mobile-header .qodef-opener-icon,
#qodef-page-mobile-header .qodef-mobile-header-opener {
	color: var(--bull-black) !important;
}
.qodef-mobile-header-navigation ul li a {
	font-family: var(--bull-font-head) !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	color: var(--bull-black) !important;
}
.qodef-mobile-header-navigation ul li a:hover {
	color: var(--bull-red) !important;
}


/* ===========================================================================
   6. PAGE TITLES / BANNERS
   ---------------------------------------------------------------------------
   .com: photograph with a red panel cut at 15° carrying the uppercase title.
   ======================================================================== */

.qodef-page-title {
	height: 340px !important;
	display: flex;
	align-items: center;
}

.single .qodef-page-title { height: 0 !important; }

.qodef-page-title .qodef-m-content {
	display: flex;
	justify-content: flex-start;
}

.qodef-page-title .qodef-m-title,
.tax-product_cat .qodef-breadcrumbs-current {
	position: relative;
	isolation: isolate;
	display: inline-block;
	width: fit-content;
	padding: 14px 44px 16px !important;
	font-family: var(--bull-font-head) !important;
	font-weight: 700 !important;
	font-style: normal !important;
	text-transform: uppercase !important;
	font-size: clamp(28px, 1.4rem + 2.4vw, 54px) !important;
	line-height: 1.05 !important;
	color: var(--bull-white) !important;
}

.qodef-page-title .qodef-m-title::before,
.tax-product_cat .qodef-breadcrumbs-current::before {
	content: '';
	position: absolute;
	inset: 0;
	z-index: -1;
	background-color: var(--bull-red);
	transform: skewX(var(--bull-angle));
}

.tax-product_cat .qodef-page-title { margin-top: 0 !important; }

/* Slider Revolution headlines follow the same rules */
.rs-layer {
	font-family: var(--bull-font-head) !important;
	font-weight: 700 !important;
	font-style: normal !important;
	text-transform: uppercase !important;
	letter-spacing: 0 !important;
}


/* ===========================================================================
   7. LINKS & LISTS
   ======================================================================== */

a { color: var(--bull-red); text-decoration: none; transition: color .2s ease-out; }

a:hover, a:focus,
p a:hover, p a:focus {
	color: var(--bull-red-brown) !important;
}

/* Content lists use the skewed red dash the US site uses */
.qodef-tabs-content ul:not(.qodef-shortcode-list) li,
.single-recipe-desc ul li,
.elementor-widget-text-editor ul li,
.entry-content ul:not(.products):not(.menu):not(.gallery) li {
	position: relative;
	list-style: none;
	padding-left: 24px;
	border-left: 0 !important;
	margin: 8px 0;
}

.qodef-tabs-content ul:not(.qodef-shortcode-list) li::before,
.single-recipe-desc ul li::before,
.elementor-widget-text-editor ul li::before,
.entry-content ul:not(.products):not(.menu):not(.gallery) li::before {
	content: '';
	position: absolute;
	top: 0.62em;
	left: 0;
	width: 12px;
	height: 3px;
	background-color: var(--bull-red);
	transform: skewX(var(--bull-angle));
}

/* Downloadable spec sheets / manuals */
.media_file_title { color: var(--bull-black); }
.media_file_row:hover .media_file_title { color: var(--bull-red); }


/* ===========================================================================
   8. FORMS
   ---------------------------------------------------------------------------
   .com uses underline-only fields with a red focus rule and red accents.
   ======================================================================== */

input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="button"]),
textarea,
select,
.gform_wrapper.gravity-theme input:not([type="submit"]),
.gform_wrapper.gravity-theme textarea,
.gform_wrapper.gravity-theme select {
	font-family: var(--bull-font-body) !important;
	font-size: var(--bull-fs-x-small) !important;
	color: var(--bull-black) !important;
	background: transparent !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: inset 0 -2px 0 var(--bull-black) !important;
	padding: 0.55em 0.4em !important;
	transition: box-shadow .2s ease;
}

input:focus, textarea:focus, select:focus {
	outline: 0 !important;
	box-shadow: inset 0 -3px 0 var(--bull-red) !important;
}

input[type="checkbox"],
input[type="radio"],
input[type="range"],
input[type="date"],
progress {
	accent-color: var(--bull-red);
}

label,
.gform_wrapper.gravity-theme .gfield_label {
	font-family: var(--bull-font-head) !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.02em;
	color: var(--bull-black) !important;
}

.gsection_title {
	font-family: var(--bull-font-head) !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	color: var(--bull-red) !important;
}

.gform_wrapper.gravity-theme .gf_progressbar_percentage,
.gform_wrapper.gravity-theme .gf_progressbar_percentage.percentbar_blue {
	background-color: var(--bull-red) !important;
	border-radius: 0 !important;
}
.gform_wrapper.gravity-theme .gf_progressbar {
	background-color: var(--bull-light-gray) !important;
	border-radius: 0 !important;
}

.gform_wrapper .validation_message,
.wpcf7-not-valid-tip {
	font-family: var(--bull-font-body) !important;
	color: var(--bull-red) !important;
}


/* ===========================================================================
   9. WOOCOMMERCE
   ---------------------------------------------------------------------------
   .com product card: light-gray tile, contained image, centred black
   condensed title, red angled "View Product". No prices (catalogue mode).
   ======================================================================== */

.qodef-woo-product-list ul.products > .product,
#qodef-woo-page ul.products > .product,
.related-festured-cont,
.single-feat-product-inner {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: center;
	background-color: var(--bull-light-gray);
	padding: 26px 22px 30px !important;
	text-align: center;
	transition: background-color .25s ease;
}

.qodef-woo-product-list ul.products > .product:hover,
#qodef-woo-page ul.products > .product:hover {
	background-color: #dedcd7;
}

.qodef-woo-product-list .qodef-woo-product-image img,
.related-festured-img {
	mix-blend-mode: multiply;
}

.qodef-woo-product-title,
.qodef-woo-product-title a,
.qodef-woo-product-title-link,
h5.qodef-woo-product-title a,
.qodef-e-title-link,
.related-festured-inner .qodef-woo-product-title span {
	font-family: var(--bull-font-head) !important;
	font-weight: 700 !important;
	font-style: normal !important;
	text-transform: uppercase !important;
	font-size: var(--bull-fs-large) !important;
	line-height: 1.15 !important;
	color: var(--bull-black) !important;
	transition: color .2s ease-out;
}

.product:hover .qodef-woo-product-title-link,
.product:hover .qodef-woo-product-title a,
.related li:hover .qodef-woo-product-title *,
h5.qodef-woo-product-title a:hover,
.qodef-e-title-link:hover,
.single-feat-product-cont .qodef-e-title-link:hover,
.related-festured-cont:hover .qodef-woo-product-title span {
	color: var(--bull-red) !important;
}

.qodef-woo-product-categories,
.cat-name,
.qodef-e-info > * {
	font-family: var(--bull-font-body) !important;
	font-size: 13px !important;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--bull-mid-gray) !important;
}

/* Single product */
#qodef-woo-page.qodef--single .qodef-woo-product-title,
.single-furniture .qodef-woo-product-title {
	font-size: var(--bull-fs-h2) !important;
}

#qodef-woo-page.qodef--single .product_meta,
.single-furniture .product_meta {
	font-family: var(--bull-font-body) !important;
	font-size: 14px;
	color: var(--bull-mid-gray);
}

#qodef-woo-page.qodef--single .price,
.qodef-woo-product-list .price {
	font-family: var(--bull-font-head) !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	color: var(--bull-red) !important;
}

/* Product tabs — the US site uses a flat red-marked tab bar */
#qodef-woo-page.qodef--single .woocommerce-tabs .wc-tabs li a,
.qodef-tabs.qodef-layout--simple .qodef-tabs-navigation li a {
	font-family: var(--bull-font-head) !important;
	font-weight: 700 !important;
	font-style: normal !important;
	text-transform: uppercase !important;
	font-size: var(--bull-fs-small) !important;
	letter-spacing: 0.02em !important;
	color: var(--bull-black) !important;
}

#qodef-woo-page.qodef--single .woocommerce-tabs .wc-tabs li.active a,
#qodef-woo-page.qodef--single .woocommerce-tabs .wc-tabs li a:hover,
.qodef-tabs.qodef-layout--simple .qodef-tabs-navigation li.ui-tabs-active a,
.ui-tabs-active a {
	color: var(--bull-red) !important;
}

.qodef-tabs-content strong {
	font-family: var(--bull-font-head) !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	color: var(--bull-red) !important;
}

/* Related products heading */
#qodef-woo-page.qodef--single .related > h2,
.other-recipes-cont h3,
.qodef-shortcode h2 a {
	color: var(--bull-black) !important;
	font-size: var(--bull-fs-h2) !important;
}
.qodef-shortcode h2 a:hover { color: var(--bull-red) !important; }

/* Warranty badge button keeps its logo, gains the Bull slant */
.product-warranty-btn {
	padding-left: 76px !important;
	font-family: var(--bull-font-head) !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
}

/* Pagination */
#qodef-woo-page .woocommerce-pagination .page-numbers.current,
#qodef-woo-page .woocommerce-pagination .page-numbers:hover,
.qodef-m-pagination .qodef-m-pagination-item.current {
	color: var(--bull-red) !important;
}

/* Sidebar / filter widgets */
.qodef-grid.qodef-layout--template > .qodef-grid-inner > .qodef-grid-item.qodef-col--3 {
	background-color: var(--bull-light-gray);
}

.widget .qodef-widget-title,
.widget h4,
.widget h5 {
	font-family: var(--bull-font-head) !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	color: var(--bull-black) !important;
}

.widget.woocommerce.widget_price_filter .price_slider_wrapper .ui-widget-content .ui-slider-range,
.widget.woocommerce.widget_price_filter .price_slider_wrapper .ui-widget-content .ui-slider-handle {
	background-color: var(--bull-red) !important;
}


/* ===========================================================================
   10. RECIPES
   ======================================================================== */

.recipe-title {
	font-size: clamp(20px, 1.1rem + 0.8vw, 30px) !important;
	color: var(--bull-white) !important;
}

.recipe-title strong { color: var(--bull-red) !important; }

.recipe-title::after {
	background-color: var(--bull-red);
	height: 3px;
	transform: skewX(var(--bull-angle));
}

.bull-sep { background-color: var(--bull-red); }

.single-recipe-cont {
	background-image: linear-gradient(0deg, rgba(0, 0, 0, .78) 0%, rgba(0, 0, 0, 0) 62%);
}

.single-detail {
	font-family: var(--bull-font-body) !important;
	font-size: 13px;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.single-recipe .qodef-woo-meta-label,
.single-recipe .qodef-social-title {
	font-family: var(--bull-font-head) !important;
	font-weight: 700 !important;
	font-size: 14px !important;
	letter-spacing: 0.04em !important;
	text-transform: uppercase !important;
	color: var(--bull-black) !important;
}

.recipe-btn {
	font-size: 14px !important;
	padding: 9px 26px !important;
}


/* ===========================================================================
   11. BLOG / NEWS
   ======================================================================== */

.qodef-blog .qodef-blog-item .qodef-e-title,
.qodef-addons-blog-list .qodef-e-title,
.qodef-e-title a {
	font-family: var(--bull-font-head) !important;
	font-weight: 700 !important;
	font-style: normal !important;
	text-transform: uppercase !important;
	color: var(--bull-black) !important;
}

.qodef-blog .qodef-blog-item .qodef-e-title a:hover,
.qodef-addons-blog-list .qodef-e-title a:hover {
	color: var(--bull-red) !important;
}

.qodef-blog .qodef-blog-item.format-quote .qodef-e-quote::before {
	color: var(--bull-red);
}

.qodef-blog .qodef-blog-item .qodef-e-info,
.qodef-addons-blog-list .qodef-e-info {
	font-family: var(--bull-font-body) !important;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--bull-mid-gray) !important;
}


/* ===========================================================================
   12. DEALER, DISTRIBUTOR & MEDIA AREAS
   ======================================================================== */

.accordion-header {
	border-bottom: 2px solid var(--bull-light-gray);
}

.accordion-header h4 {
	font-family: var(--bull-font-head) !important;
	font-weight: 700 !important;
	font-style: normal !important;
	text-transform: uppercase !important;
}

.accordion-header:hover,
.accordion-header.active {
	border-color: var(--bull-red) !important;
}

.accordion-header:hover h4,
.accordion-header.active h4 {
	color: var(--bull-red) !important;
}

.dealers-cont .qodef-accordion-mark span {
	font-family: var(--bull-font-head) !important;
	font-weight: 700 !important;
	font-style: normal !important;
	color: var(--bull-red) !important;
}

.dealer-title {
	font-size: var(--bull-fs-h4) !important;
}

/* Media library grid */
.clientmedia_folder {
	border: 1px solid var(--bull-light-gray);
	background-color: var(--bull-white);
	transition: background-color .2s ease, border-color .2s ease, transform .2s ease;
}
.clientmedia_folder:hover {
	background-color: var(--bull-light-gray);
	border-color: var(--bull-red);
}
.clientmedia_foldername {
	font-family: var(--bull-font-head) !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
}
.mediacat_breadcrumbs {
	background-color: var(--bull-light-gray);
	font-family: var(--bull-font-head) !important;
	text-transform: uppercase;
}
.mediacat_breadcrumbs strong { color: var(--bull-red) !important; }
.media_file_row { border-bottom: 1px solid var(--bull-light-gray); }
.media_file_row:hover { background-color: var(--bull-light-gray); }
a.media_file_download:hover { color: var(--bull-red) !important; }

.restricted_area {
	font-family: var(--bull-font-head) !important;
	text-transform: uppercase !important;
	color: var(--bull-black);
}

table.dist_table th {
	font-family: var(--bull-font-head) !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	background-color: var(--bull-light-gray);
}


/* ===========================================================================
   13. FOOTER — solid black, white type, red hover
   ======================================================================== */

#qodef-page-footer {
	background-color: var(--bull-black) !important;
	color: var(--bull-white);
}

#qodef-page-footer::after { display: none !important; }

#qodef-page-footer,
#qodef-page-footer p,
#qodef-page-footer li,
#qodef-page-footer .widget {
	font-family: var(--bull-font-body) !important;
	color: var(--bull-white);
}

#qodef-page-footer a { color: var(--bull-white) !important; }
#qodef-page-footer a:hover { color: var(--bull-red) !important; }

#qodef-page-footer .qodef-widget-title,
#qodef-page-footer h1, #qodef-page-footer h2,
#qodef-page-footer h3, #qodef-page-footer h4,
#qodef-page-footer h5, #qodef-page-footer h6 {
	font-family: var(--bull-font-head) !important;
	font-weight: 700 !important;
	font-style: normal !important;
	text-transform: uppercase !important;
	letter-spacing: 0.02em !important;
	color: var(--bull-white) !important;
}

#qodef-page-footer-bottom-area {
	border-top: 1px solid rgba(255, 255, 255, .15);
	font-size: 14px;
}

.social_icon:hover {
	filter: brightness(0) saturate(100%) invert(18%) sepia(72%) saturate(5000%) hue-rotate(350deg) brightness(92%) contrast(96%);
}


/* ===========================================================================
   14. ELEMENTOR & MISC COMPONENTS
   ======================================================================== */

.elementor-widget-heading .elementor-heading-title {
	font-family: var(--bull-font-head) !important;
	font-weight: 700 !important;
	font-style: normal !important;
	text-transform: uppercase !important;
	line-height: 1.1 !important;
}

.elementor-widget-text-editor,
.elementor-widget-text-editor p {
	font-family: var(--bull-font-body) !important;
}

/* Qi / Qode accents that were maroon-red before */
.qodef-testimonials-list .qodef-e-static-holder .qodef-e-static-subtitle,
.qodef-testimonials-list .qodef-e-static-holder::before,
body .draft_status_text {
	color: var(--bull-red) !important;
}

/* Kitchen configurator entry banner */
a.kitchen_config_banner {
	border: 0;
	font-family: var(--bull-font-head) !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	color: var(--bull-white) !important;
	box-shadow: inset 0 0 0 9999px rgba(0, 0, 0, .45);
}
a.kitchen_config_banner:hover {
	box-shadow: inset 0 0 0 9999px rgba(209, 29, 35, .55);
}

.kitchen_conf_open {
	width: fit-content !important;
	height: auto !important;
	border-radius: 0 !important;
}

/* Region redirect overlay (markup printed by functions.php) */
#region-overlay .overlay-content {
	background: var(--bull-dark-gray);
	border-radius: 0;
	border-top: 5px solid var(--bull-red);
}
#region-overlay h2 {
	font-family: var(--bull-font-head) !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	color: var(--bull-red) !important;
}

/* Back to top */
#qodef-back-to-top,
#qodef-back-to-top > span,
.qodef-back-to-top {
	border-radius: 0 !important;
	background-color: var(--bull-red) !important;
	color: var(--bull-white) !important;
}


/* ===========================================================================
   15. RESPONSIVE
   ======================================================================== */

@media only screen and (max-width: 1400px) {
	.qodef-header-navigation > ul > li { margin: 0 10px; }
	.qodef-header-logo-link img { width: 160px !important; }
}

@media only screen and (max-width: 1250px) {
	.qodef-header-navigation > ul > li > a { font-size: 15px !important; }
}

@media only screen and (max-width: 1100px) {
	.qodef-header-navigation > ul > li { margin: 0 7px; }
	.qodef-header-navigation > ul > li > a { font-size: 14px !important; }
	.qodef-header-logo-link img { width: 140px !important; }
}

@media only screen and (max-width: 1024px) {
	:root { --bull-header-h: 80px; }
	.qodef-page-title { height: 260px !important; }
}

@media only screen and (max-width: 767px) {
	.bull-angle-left::before,
	.bull-angle-right::after,
	.bull-angle-both::before,
	.bull-angle-both::after {
		transform: none;
		left: 0;
		right: 0;
		width: 100%;
	}

	.bull-angle-left, .bull-angle-right, .bull-angle-both {
		padding: 28px 24px;
	}

	.qodef-page-title { height: 220px !important; }

	.qodef-page-title .qodef-m-title,
	.tax-product_cat .qodef-breadcrumbs-current {
		padding: 10px 26px 12px !important;
		font-size: 30px !important;
	}

	.bull-btn,
	.qodef-button.qodef-layout--filled,
	.qodef-button.qodef-layout--outlined,
	.elementor-button,
	.recipe-btn,
	#qodef-woo-page .button {
		padding: 10px 26px !important;
		font-size: 15px !important;
	}
}