@charset "UTF-8";

i.icon.close {
	--diameter: 2em;
	--size: 1.5em;
	position: relative;
	width: var(--diameter);
	height: var(--diameter);
	box-sizing: border-box;
	display: block;
	border-radius: 40px;
	border: 0.2em solid transparent;

	&:is(.small) {
		--size: 1.2em;
	}

	&::after,
	&::before {
		top: 0.7em;
		left: 0.2em;
		position: absolute;
		content: "";
		width: var(--size, 1.5em);
		height: 2px;
		box-sizing: border-box;
		display: block;
		border-radius: 5px;
		background-color: currentColor;
		transform: rotate(45deg);
	}

	&::after {
		transform: rotate(-45deg);
	}
}