/* =========================================================================
   Codeora Vision Blocks — compatibility / hardening layer.
   MUST load LAST (after tokens.css and widgets.css). Neutralizes WordPress
   theme + Elementor interference, then re-asserts every intentional fill.
   ========================================================================= */

/* ---- 1. Elementor structural wrappers -------------------------------- */
.cvb .elementor-widget-container { margin: 0; padding: 0; }

/* ---- 2. Flex/grid overflow from long words --------------------------- */
.cvb * { min-width: 0; }
.cvb h1, .cvb h2, .cvb h3, .cvb h4, .cvb p {
	overflow-wrap: anywhere;
	word-break: break-word;
}

/* ---- 3. Theme button/link colour bleed (the pink hover/active on nav)
   !important REQUIRED: themes apply a customizer accent colour WITH
   !important, which beats any specificity fix. ------------------------- */
.cvb button,
.cvb a.cvb-btn,
.cvb [role="tab"],
.cvb [role="button"] {
	background-color: transparent !important;
	background-image: none !important;
	border-color: transparent !important;
}
.cvb button:hover, .cvb button:focus, .cvb button:active, .cvb button:visited,
.cvb a:hover, .cvb a:focus, .cvb a:active, .cvb a:visited,
.cvb [role="tab"]:hover, .cvb [role="tab"]:focus, .cvb [role="tab"]:active,
.cvb .is-open, .cvb .is-active,
.cvb button[aria-expanded="true"] {
	background-color: transparent !important;
	background-image: none !important;
	border-color: transparent !important;
	box-shadow: none !important;
	outline: none !important;
}

/* ---- 4. ⚠ RE-ASSERT every intentional fill / border rule 3 just stripped.
   Add new filled buttons / tabs / dots / hovered cards HERE. ----------- */

/* 4.1 Primary + ghost buttons.
   Uses `a.cvb-btn` (0,2,1) so it beats the rule-3 neutralizer `.cvb a.cvb-btn`
   (also 0,2,1) on source order — `.cvb .cvb-btn` (0,2,0) would LOSE and the
   gradient fill would be stripped (the "ghost/outline button" bug). */
.cvb a.cvb-btn {
	background-image: var(--cvb-grad-brand) !important;
	background-color: transparent !important;
	color: #fff !important;
	box-shadow: var(--cvb-shadow-luxe);
}
.cvb a.cvb-btn--ghost {
	background-image: none !important;
	border-color: var(--cvb-border-strong) !important;
	color: var(--cvb-fg) !important;
	box-shadow: none !important;
}
.cvb a.cvb-btn--ghost:hover { border-color: var(--cvb-secondary) !important; }

/* 4.2 Hero slider dots */
.cvb .cvb-hero__dot {
	background-color: var(--cvb-border-strong) !important;
	background-image: none !important;
}
.cvb .cvb-hero__dot.is-active {
	background-color: transparent !important;
	background-image: var(--cvb-grad-brand) !important;
}

/* 4.3 Pricing outline button */
.cvb .cvb-pcard__btn { border-color: var(--cvb-border-strong) !important; }
.cvb .cvb-pcard__btn:hover { border-color: var(--cvb-secondary) !important; }

/* 4.4 Footer social + card hover borders */
.cvb .cvb-footer__social:hover {
	background-color: var(--cvb-primary) !important;
	border-color: var(--cvb-primary) !important;
	color: #fff !important;
}
.cvb .cvb-recog__item:hover { border-color: rgba(255, 144, 52, 0.5) !important; }
.cvb .cvb-arch__item:hover  { border-color: rgba(255, 144, 52, 0.4) !important; }

/* 4.5 Case-study tab text colour (underline is a ::after, unaffected) */
.cvb .cvb-cases__tab.is-active,
.cvb .cvb-cases__tab:hover { color: var(--cvb-fg) !important; }

/* 4.6 Cards that ARE <a>/stateful and lose their gradient border on hover/open */
.cvb .cvb-icard:hover,
.cvb .cvb-faq__item.is-open {
	background-image:
		var(--cvb-grad-card) padding-box,
		var(--cvb-grad-border-soft) border-box !important;
}

/* 4.6b Mobile drawer keeps a SOLID (opaque) background when open — rule 3's
   `.cvb .is-open` (0,2,0) was stripping it to transparent, so the page showed
   through. `.cvb .cvb-drawer.is-open` (0,3,0) wins. */
.cvb .cvb-drawer.is-open {
	background-color: var(--cvb-bg) !important;
	background-image: linear-gradient(180deg, #0b1222 0%, var(--cvb-bg) 55%) !important;
}

/* 4.6c Card hover glow (needs !important to beat the rule-3 `.cvb a:hover`
   box-shadow:none on the <a>-based cards). */
.cvb .cvb-scard:hover,
.cvb .cvb-icard:hover,
.cvb .cvb-mcard:hover,
.cvb .cvb-pcard:hover,
.cvb .cvb-tech__gcard:hover {
	box-shadow: var(--cvb-glow-card) !important;
}

/* 4.7 Menu / drawer hover backgrounds */
.cvb .cvb-mega__item:hover,
.cvb .cvb-drawer__sublink:hover,
.cvb .cvb-drawer__link:hover,
.cvb .cvb-collapse__trigger:hover {
	background-color: var(--cvb-muted) !important;
}
.cvb .cvb-mega__foot:hover { background-color: rgba(3, 6, 13, 0.97) !important; }

/* 4.8 Underline links keep their border transition */
.cvb .cvb-textlink:hover,
.cvb .cvb-rt a:hover { border-color: var(--cvb-fg) !important; }

/* 4.9 Top-level nav: force links (<a>) AND mega triggers (<button>) to the
   SAME colour so the theme can't brighten only the <a> links and make the
   mega items read as "inactive". Bright base, brand-accent on hover. */
.cvb .cvb-nav-link,
.cvb .cvb-nav-trigger { color: var(--cvb-fg) !important; }
.cvb .cvb-nav-link:hover,
.cvb .cvb-nav-trigger:hover { color: var(--cvb-secondary) !important; }

/* 4.10 Keyboard focus stays visible (rule 3 removed :focus outline) */
.cvb a:focus-visible,
.cvb button:focus-visible,
.cvb [role="tab"]:focus-visible {
	outline: 2px solid var(--cvb-primary) !important;
	outline-offset: 2px;
}

/* 4.11 Icon glyphs sitting on gradient badges must be WHITE. Elementor/theme
   default FA glyphs (webfont <i> or inline <svg>) to a dark colour; force both
   `color` and `fill` so it works however Elementor renders the icon. */
.cvb .cvb-mega__ico,   .cvb .cvb-mega__ico i,   .cvb .cvb-mega__ico svg,   .cvb .cvb-mega__ico svg *,
.cvb .cvb-scard__icon, .cvb .cvb-scard__icon i, .cvb .cvb-scard__icon svg, .cvb .cvb-scard__icon svg *,
.cvb .cvb-icard__icon, .cvb .cvb-icard__icon i, .cvb .cvb-icard__icon svg, .cvb .cvb-icard__icon svg *,
.cvb .cvb-arch__icon,  .cvb .cvb-arch__icon i,  .cvb .cvb-arch__icon svg,  .cvb .cvb-arch__icon svg *,
.cvb .cvb-cmeth__icon, .cvb .cvb-cmeth__icon i, .cvb .cvb-cmeth__icon svg, .cvb .cvb-cmeth__icon svg * {
	color: #fff !important;
	fill: #fff !important;
}

/* Method/process icons: orange (reference `text-secondary`). Force `fill` too,
   since FA's glyph fill wasn't following `color` and rendered dark. */
.cvb .cvb-mcard__icon,
.cvb .cvb-mcard__icon i,
.cvb .cvb-mcard__icon svg,
.cvb .cvb-mcard__icon svg *,
.cvb .cvb-cs__sicon,
.cvb .cvb-cs__sicon i,
.cvb .cvb-cs__sicon svg,
.cvb .cvb-cs__sicon svg * {
	color: var(--cvb-secondary) !important;
	fill: var(--cvb-secondary) !important;
}

/* Audio play button keeps its gradient fill (rule 3 neutralizes <button> bg). */
.cvb .cvb-audio__play {
	background-image: var(--cvb-grad-brand) !important;
	background-color: transparent !important;
	color: #fff !important;
}

/* 4.12 Footer social glyphs follow the button colour (light on the dark circle,
   white on hover). FA/theme default them dark → invisible without this. */
.cvb .cvb-footer__social { color: var(--cvb-fg) !important; }
.cvb .cvb-footer__social i { color: currentColor !important; }
.cvb .cvb-footer__social svg,
.cvb .cvb-footer__social svg * { fill: currentColor !important; }

/* ---- 5. Document background — the header bar is translucent navy; without
   a dark page it composites to grey over white. ----------------------- */
html, body.cvb-page { background: var(--cvb-bg); }
body.cvb-page { color: var(--cvb-fg); font-family: var(--cvb-font-body); }