/**
 * Hercules Core blocks — front-end colour overrides for the Bootstrap accordion/tabs.
 * Neutralises Bootstrap's default (blue) active/focus colours and lets each block's
 * colour controls drive them via CSS custom properties. Scoped to the block wrappers
 * (higher specificity than Bootstrap's single-class rules), so other Bootstrap
 * accordions/tabs on the site are unaffected.
 */

/* ---- Accordion ---- */
/* The terminal fallback of every chain is the theme's own Bootstrap property, so a
   block with no colour set renders exactly as it did before these rules existed. */
.wp-block-lazyblock-accordion .accordion-button {
	color: var(--bb-acc-text, var(--buzz-accordion-btn-color));
	background-color: var(--bb-acc-bg, var(--buzz-accordion-btn-bg));
}
.wp-block-lazyblock-accordion .accordion-button:not(.collapsed) {
	color: var(--bb-acc-active-text, var(--bb-acc-text, var(--buzz-accordion-active-color)));
	background-color: var(--bb-acc-active-bg, var(--bb-acc-bg, var(--buzz-accordion-active-bg)));
}
.wp-block-lazyblock-accordion .accordion-button:focus {
	border-color: transparent;
	box-shadow: none;
	outline: none;
}
/* Recolour the chevron via CSS mask so its colour is controllable (--bb-acc-arrow),
   and keep the same icon (rotated) when open instead of Bootstrap's active icon.
   Gated on the inline custom property, which the render callback only emits when the
   colour is actually set — otherwise the theme's own chevron must stay untouched.
   The theme ships a rebranded Bootstrap build whose properties are prefixed --buzz-;
   --bs- is the fallback for stock Bootstrap. The chain ends in a literal chevron so the
   mask can never fail to resolve — an unresolved mask would leave the coloured
   background painting the whole box as a solid square. background-image must stay none:
   it paints on top of the background colour, inside the same mask, so keeping an image
   there would hide the chosen colour instead of degrading to it. */
.wp-block-lazyblock-accordion[style*="--bb-acc-arrow"] .accordion-button::after,
.wp-block-lazyblock-accordion[style*="--bb-acc-arrow"] .accordion-button:not(.collapsed)::after {
	--bb-acc-arrow-icon: var(--buzz-accordion-btn-icon, var(--bs-accordion-btn-icon, url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e")));
	background-image: none;
	background-color: var(--bb-acc-arrow, currentColor);
	-webkit-mask: var(--bb-acc-arrow-icon) no-repeat center / contain;
	mask: var(--bb-acc-arrow-icon) no-repeat center / contain;
}

/* ---- Tabs ---- */
.wp-block-lazyblock-tabs .nav-tabs .nav-link {
	color: var(--bb-tab-text, var(--buzz-nav-link-color));
}
.wp-block-lazyblock-tabs .nav-tabs .nav-link:hover,
.wp-block-lazyblock-tabs .nav-tabs .nav-link:focus {
	box-shadow: none;
	outline: none;
}
.wp-block-lazyblock-tabs .nav-tabs .nav-link.active {
	color: var(--bb-tab-active-text, var(--buzz-nav-tabs-link-active-color));
	background-color: var(--bb-tab-active-bg, var(--buzz-nav-tabs-link-active-bg));
}
