:where(.events-accordion-list *) {
	margin-top: 0;
}

.events-accordion-list {
	--event-table-columns: 14.375rem 1fr 1fr 3.75rem;
	container: events / inline-size;
	interpolate-size: allow-keywords;
}

.events-accordion-list__legend {
	display: grid;
	gap: 1.25rem 0;
	grid-template-columns: var(--event-table-columns);
	background-color: var(--color-black);
	color: var(--color-white);
}

	.events-accordion-list__legend > * {
		padding-inline-start: 1.25rem;
		padding-block: 0.625rem;
		font-weight: 700;
	}

.events-accordion-list__details {
	padding-block: 1.25rem;
	padding-inline: 1.25rem;
	border-block-start: solid 1px currentColor;
}

	.events-accordion-list__details:last-child {
		border-block-end: solid 1px currentColor;
	}

.events-accordion-list__details__summary {
	list-style: none;
	display: grid;
	gap: 0.25rem 0;
	grid-template-columns: var(--event-table-columns);
	cursor: pointer;
}

	.events-accordion-list__details__summary > * {
		padding-inline-start: 1.25rem;
		text-wrap: pretty;
		transition: opacity 0.25s ease-in-out;
	}

	.events-accordion-list__details__summary:has(:hover) > *:not(:last-child) {
		opacity: 0.7;
	}

.events-accordion-list__details__summary__cal {
	transition: color 0.2s ease-in-out;
}

	.events-accordion-list__details__summary__cal:hover {
		color: var(--color-black);
	}

	.events-accordion-list__details__summary__cal svg {
		width: 1.5rem;
	}

@media (width < 37.5rem) {
	.events-accordion-list {
		--event-table-columns: 200px 1fr 60px;
	}

	.events-accordion-list__legend {
		display: none;
	}


	.events-accordion-list__details__summary > :nth-child(3) {
		grid-row: 2;
		grid-column: 2;
	}
}

@media (width < 30rem) {
	.events-accordion-list {
		--event-table-columns: 1fr;
	}

	.events-accordion-list__details__summary > :nth-child(3) {
		grid-row: auto;
		grid-column: auto;
	}
}