/* Categories */
.wp-block-categories {
	--svg-close: url('data:image/svg+xml,<svg height="14" viewBox="0 0 14 14" width="14" xmlns="http://www.w3.org/2000/svg"><path d="m1.61289944.20970461.09420734.08318861 5.29289322 5.29210678 5.2928932-5.29210678c.3905243-.39052429 1.0236893-.39052429 1.4142136 0 .3604839.36048396.3882135.92771502.0831886 1.32000622l-.0831886.09420734-5.2931068 5.29289322 5.2931068 5.2928932c.3905243.3905243.3905243 1.0236893 0 1.4142136-.360484.3604839-.927715.3882135-1.3200062.0831886l-.0942074-.0831886-5.2928932-5.2931068-5.29289322 5.2931068c-.39052429.3905243-1.02368927.3905243-1.41421356 0-.36048396-.360484-.3882135-.927715-.08318861-1.3200062l.08318861-.0942074 5.29210678-5.2928932-5.29210678-5.29289322c-.39052429-.39052429-.39052429-1.02368927 0-1.41421356.33044363-.33044363.83461225-.38128111 1.21850973-.15251245z" /></svg>');
}

.wp-block-categories {
	display: none;
	list-style: none;
	margin: 0;
	padding: 0;
	gap: 1.5rem;
}

.wp-block-categories:has(.current-cat) {
	display: block;
}

.wp-block-categories .cat-item {
	display: inline-block;
	margin: 0;
	padding: 0 1.5rem 1.5rem 0;
}

.wp-block-categories .cat-item a {
	padding: 0.5em;
	border-bottom: 2px solid var(--wp--preset--color--white);
	text-decoration: none;
}

.wp-block-categories .cat-item a:hover {
	color: var(--wp--preset--color--green);
	border-color: var(--wp--preset--color--green);
}

.wp-block-categories .cat-item.current-cat a {
	color: var(--wp--preset--color--green);
	border-color: var(--wp--preset--color--green);
}


.wp-block-categories .cat-item.current-cat a {
	position: relative;
	padding-right: 2.7rem !important;
	transition: all 0.2s ease-in-out;
}

.wp-block-categories .cat-item.current-cat a:after {
	position: absolute;
	margin-left: 1.0em;
	top: 0;
	bottom: 0;
	display: inline-block;
	content: '';
	width: 17px;
	-webkit-mask: var(--svg-close) no-repeat center;
	mask: var(--svg-close) no-repeat center;
	background-color:var(--wp--preset--color--green);
	transition: all 0.2s ease-in-out;
}

.wp-block-categories .cat-item.current-cat:hover a:after {
	transform: rotate(90deg);
}