//<QUANTITY>
// Снипет (HTML): qa
.quantity {
	width: 88px;
	height: 40px;
	display: flex;
	border: 1px solid rgba(166, 166, 166, 0.45);
	// .quantity__button
	&__button {
		flex: 0 0 30px;
		position: relative;
		cursor: pointer;
		&::before,
		&::after {
			content: "";
			position: absolute;
			top: 50%;
			left: 50%;
			transition: all 0.3s ease 0s;
			margin: 0px 0px 0px -4.5px;
			background-color: #a6a6a6;
			width: 9px;
			height: 1px;
		}
		@media (any-hover: hover) {
			&:hover {
				&::before,
				&::after {
					background-color: rgba(0, 0, 0, 0.5);
				}
			}
		}
		// .quantity__button_plus
		&_plus {
			&::before {
				transform: rotate(-90deg);
			}
		}
		// .quantity__button_minus
		&_minus {
		}
	}
	// .quantity__input
	&__input {
		flex: 1 1 auto;
		input {
			height: 100%;
			color: #a6a6a6;
			font-size: 12px;
			width: 100%;
			text-align: center;
		}
	}
}