/**
 * Core Accordion block — styled to match the site's Beaver Builder accordions
 * (see /academics/): light-grey bars, Open Sans 18px light, red icon.
 *
 * Each heading renders as an <h3>, which otherwise picks up the global heading
 * rules (century-gothic 24px red, forced with !important in the Customizer's
 * Additional CSS). Those rules are applied to the <h3> itself, so we style the
 * inner toggle button instead — its own declarations beat inherited ones.
 *
 * The :not() guards let colours / font sizes an editor picks in the block
 * sidebar win over these defaults.
 */

.wp-block-accordion > .wp-block-accordion-item + .wp-block-accordion-item,
.wp-block-accordion + .wp-block-accordion {
	margin-top: 10px;
}

.wp-block-accordion-heading {
	margin: 0;
}

.wp-block-accordion-heading .wp-block-accordion-heading__toggle,
.wp-block-accordion-heading .wp-block-accordion-heading__toggle:hover,
.wp-block-accordion-heading .wp-block-accordion-heading__toggle:focus {
	/* The BB theme styles every <button> with a border that appears on hover
	   (rows jumped by 2px) and rounded corners — neutralise both. */
	border: 0;
	border-radius: 0;
	box-shadow: none;
}

.wp-block-accordion-heading .wp-block-accordion-heading__toggle {
	gap: 16px;
	padding: 15px 20px;
	font-family: "Open Sans", sans-serif;
	font-weight: 300;
	line-height: 1.4;
	text-align: left;
}

.wp-block-accordion-heading:not([class*="-font-size"]):not([style*="font-size"]) .wp-block-accordion-heading__toggle {
	font-size: 18px;
}

.wp-block-accordion-heading:not(.has-text-color) .wp-block-accordion-heading__toggle {
	color: #0a0a0a;
}

.wp-block-accordion-heading:not(.has-background) .wp-block-accordion-heading__toggle {
	background-color: #ededed;
}

.wp-block-accordion-heading .wp-block-accordion-heading__toggle:hover .wp-block-accordion-heading__toggle-title {
	text-decoration: none;
}

.wp-block-accordion-heading:not(.has-background) .wp-block-accordion-heading__toggle:hover,
.wp-block-accordion-item.is-open > .wp-block-accordion-heading:not(.has-background) .wp-block-accordion-heading__toggle {
	background-color: #e2e2e2;
}

/*
 * Beaver Builder adds a site-wide focus ring on :focus (so also on mouse
 * clicks) with a 2px outer offset. On the accordion that left a ring around a
 * row after clicking it. Show the ring for keyboard focus only, drawn inside
 * the bar. The extra .wp-block-accordion prefix outranks BB's selector.
 */
.wp-block-accordion .wp-block-accordion-heading .wp-block-accordion-heading__toggle:focus:not(:focus-visible) {
	outline: none;
}

.wp-block-accordion .wp-block-accordion-heading .wp-block-accordion-heading__toggle:focus-visible {
	outline: 2px solid #bd2330;
	outline-offset: -2px;
}

.wp-block-accordion-heading__toggle-icon {
	color: #bd2330;
	font-size: 22px;
	font-weight: 400;
}

.wp-block-accordion-panel {
	padding: 15px 20px 5px;
}