/* ==========================================================================
   Accordion Group Block – accordion-group-block.css  v2
   ========================================================================== */

/* --------------------------------------------------------------------------
   Accordion wrapper – sits flush inside the Group block
   -------------------------------------------------------------------------- */
.agb-accordion {
	margin-top: 1em;
}

/* --------------------------------------------------------------------------
   Toggle button
   -------------------------------------------------------------------------- */
.agb-toggle {
	all: unset;
	box-sizing: border-box;
	display:     inline-flex;
	align-items: center;
	gap:         0.45em;
	cursor:      pointer;

	font-size:   inherit;
	font-weight: 600;
	line-height: 1.4;
	color:       currentColor;

	text-decoration:       underline;
	text-decoration-color: transparent;
	text-underline-offset: 3px;
	transition: text-decoration-color 0.15s ease, opacity 0.15s ease;
}

.agb-toggle:hover,
.agb-toggle:focus-visible {
	text-decoration-color: currentColor;
}

.agb-toggle:focus-visible {
	outline:        2px solid currentColor;
	outline-offset: 3px;
	border-radius:  2px;
}

/* --------------------------------------------------------------------------
   Chevron icon – rotates on expand
   -------------------------------------------------------------------------- */
.agb-toggle__icon {
	display:       inline-block;
	width:         0.5em;
	height:        0.5em;
	border-right:  0.14em solid currentColor;
	border-bottom: 0.14em solid currentColor;
	transform:        rotate(45deg) translateY(-0.12em);   /* ▾ down */
	transition:    transform 0.25s ease;
	flex-shrink:   0;
}

.agb-toggle[aria-expanded="true"] .agb-toggle__icon {
	transform: rotate(-135deg) translateY(0.05em);          /* ▴ up */
}

/* --------------------------------------------------------------------------
   Hidden panel – smooth max-height accordion
   -------------------------------------------------------------------------- */
.agb-panel {
	overflow:   hidden;
	max-height: 0;
	opacity:    0;
	transition:
		max-height 0.35s ease,
		opacity    0.25s ease;
}

/* Override [hidden] so CSS transition can run (JS controls visibility) */
.agb-panel[hidden] {
	display:    block;
	visibility: hidden;
}

.agb-panel.is-open {
	opacity:    1;
	visibility: visible;
}
