.fraction {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.numerator,
.denominator {
	padding-inline: 0.3rem;
	font-size: 1.5rem;
}

.numerator {
	border-bottom: 2px solid var(--clr-black);
}

.buttons-container {
	display: flex;
	justify-content: center;
	gap: 0.8rem;
	margin-block-start: 0.5rem;
}

.button-op {
	background-color: var(--clr-purple-90);
	border: none;
	color: var(--clr-white);
	width: 35px;
	aspect-ratio: 1;
	font-size: 1.5rem;
	border-radius: 3px;
}

.flex-item {
	display: grid;
	place-content: center;
}

.reset-button {
	background-color: var(--clr-black);
	border: none;
	color: var(--clr-white);
	padding: 0.5rem 1rem;
	border-radius: 3px;
	font-weight: 600;
	display: flex;
	align-items: center;
	gap: 0.3rem;
}