.wp-block-tenup-accordion {
	border-bottom: 1px solid var(--wp--custom--color--primary--primary);
	padding-bottom: var(--wp--custom--spacing--24);

	&.is-style-alternative {
		background-color: var(--wp--custom--color--neutral--lightest);
		border: 1px solid var(--wp--custom--color--primary--darker);
		border-radius: var(--wp--custom--radius--16);
		padding: 0;
	}
}

.wp-block-tenup-accordion-content {

	& > *:first-child {
		margin-top: var(--wp--custom--spacing--24);
	}

	& > *:last-child {
		margin-bottom: 0;
	}

	.is-style-alternative & {
		padding-inline: var(--wp--custom--spacing--16);

		& > *:first-child {
			margin-top: 0;
		}

		& > *:last-child {
			margin-bottom: var(--wp--custom--spacing--16);
		}
	}
}

.wp-block-tenup-accordion-item__title {
	color: var(--wp--custom--color--text--heading-1);
	font-size: var(--wp--custom--font--size--21);
	font-weight: var(--wp--custom--font--weight--bold);
	line-height: 1.4;
	transition: all var(--wp--custom--transition--duration--base) var(--wp--custom--transition--timing--custom);

	.wp-block-tenup-accordion-header:hover &,
	.wp-block-tenup-accordion-header:focus-within & {
		color: var(--wp--custom--color--primary--primary);
	}

	& img {
		max-height: 4ch;
	}
}

.wp-block-tenup-accordion-item__icon {
	align-items: center;
	background-color: var(--wp--custom--color--neutral--lightest);
	border-radius: 999px;
	color: var(--wp--custom--color--primary--darker);
	display: flex;
	height: var(--wp--custom--spacing--40);
	justify-content: center;
	min-width: var(--wp--custom--spacing--40);
	order: -1;
	transition: all var(--wp--custom--transition--duration--base) var(--wp--custom--transition--timing--custom);

	& svg {
		height: var(--wp--custom--spacing--20);
		width: var(--wp--custom--spacing--20);
	}

	.wp-block-tenup-accordion-header:hover &,
	.wp-block-tenup-accordion-header:focus-within & {
		background-color: var(--wp--custom--color--primary--primary);
		color: var(--wp--custom--color--neutral--lightest);
	}

	.is-style-alternative & {
		border: 1px solid var(--wp--custom--color--primary--darker);
		height: var(--wp--custom--spacing--24);
		width: var(--wp--custom--spacing--24);

		& svg {
			height: var(--wp--custom--spacing--8);
			width: var(--wp--custom--spacing--8);

			& path {
				stroke-width: 4px;
			}
		}
	}
}

.wp-block-tenup-accordion-header {

	@mixin focus-visible-styles;

	display: flex;
	flex-direction: row;
	gap: var(--wp--custom--spacing--32) !important;
	justify-content: flex-start !important;

	.is-style-alternative & {
		gap: var(--wp--custom--spacing--16) !important;
		padding: var(--wp--custom--spacing--16);
	}
}