@mixin flex {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
}

@mixin hover {
	position: relative;
	display: inline-block;

	&::after {
		content: '';
		position: absolute;
		bottom: -2px;
		left: 0;
		width: 0;
		height: 1px;
		background-color: var(--default-color);
		transition: width 0.3s;
	}

	&:hover,
	&:focus {
		&::after {
			width: 100%;
		}
	}
}