/**
 * Add To Cart Toggle.
 * The quantity state consumes the same compact-control contract as Quantity.
 */
.uff-cart-toggle,
.uff-cart-toggle * { box-sizing: border-box !important; }

.uff-cart-toggle {
	display: inline-block;
	position: relative;
	width: var(--uff-control-width);
	height: var(--uff-control-height);
	vertical-align: middle;
}

.uff-cart-toggle__action-add,
.uff-cart-toggle__action-qty { width: 100%; height: 100%; }

.uff-cart-toggle__action-add .uff-button,
.uff-cart-toggle__native-btn {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 100% !important;
	height: 100% !important;
	padding: 0 var(--uff-space-3) !important;
	border-radius: var(--uff-control-radius) !important;
	font: var(--uff-font-semibold) var(--uff-text-xs)/1 var(--uff-font-body) !important;
	letter-spacing: .02em;
	text-transform: uppercase;
}

.uff-cart-toggle__qty-track {
	display: grid !important;
	grid-template-columns: var(--uff-control-button-size) var(--uff-control-center-width) var(--uff-control-button-size) !important;
	align-items: center !important;
	justify-content: center !important;
	width: var(--uff-control-width) !important;
	height: var(--uff-control-height) !important;
	padding: var(--uff-control-padding) !important;
	border: var(--uff-control-border) !important;
	border-radius: var(--uff-control-radius) !important;
	background: var(--uff-control-background) !important;
	box-shadow: var(--uff-control-shadow) !important;
	overflow: hidden !important;
	user-select: none;
}

.uff-cart-toggle__adjust {
	display: grid !important;
	place-items: center !important;
	width: var(--uff-control-button-size) !important;
	height: var(--uff-control-button-size) !important;
	min-width: var(--uff-control-button-size) !important;
	min-height: var(--uff-control-button-size) !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: var(--uff-radius-full) !important;
	background: var(--uff-control-background) !important;
	box-shadow: var(--uff-control-button-shadow) !important;
	color: var(--uff-color-primary) !important;
	font: var(--uff-font-bold) var(--uff-text-lg)/1 var(--uff-font-body) !important;
	cursor: pointer !important;
	transition: background var(--uff-transition-fast), transform var(--uff-transition-fast) !important;
}
.uff-cart-toggle__adjust:hover { background: var(--uff-control-hover-background) !important; }
.uff-cart-toggle__adjust:active { transform: scale(.95) !important; }
.uff-cart-toggle__adjust:disabled { opacity: var(--uff-opacity-disabled) !important; cursor: not-allowed !important; }
.uff-cart-toggle__adjust:focus-visible { outline: 0 !important; box-shadow: var(--uff-control-focus-ring) !important; }

.uff-cart-toggle__qty-center {
	display: grid !important;
	place-items: center !important;
	width: var(--uff-control-center-width) !important;
	height: var(--uff-control-button-size) !important;
	min-width: var(--uff-control-center-width) !important;
	padding: 0 !important;
}

.uff-cart-toggle__qty-input {
	display: block !important;
	width: var(--uff-control-center-width) !important;
	height: var(--uff-control-button-size) !important;
	min-width: var(--uff-control-center-width) !important;
	min-height: var(--uff-control-button-size) !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	outline: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	color: var(--uff-color-text) !important;
	-webkit-text-fill-color: var(--uff-color-text) !important;
	text-align: center !important;
	font: var(--uff-font-bold) var(--uff-text-sm)/var(--uff-control-button-size) var(--uff-font-body) !important;
	appearance: textfield !important;
	-moz-appearance: textfield !important;
	-webkit-appearance: none !important;
	opacity: 1 !important;
}
.uff-cart-toggle__qty-input::-webkit-outer-spin-button,
.uff-cart-toggle__qty-input::-webkit-inner-spin-button { margin: 0 !important; -webkit-appearance: none !important; }

.uff-cart-toggle__action-qty { display: none; }
.uff-cart-toggle__action-add { display: block; }
.uff-cart-toggle.is-in-cart .uff-cart-toggle__action-add { display: none; }
.uff-cart-toggle.is-in-cart .uff-cart-toggle__action-qty { display: block; }
.uff-cart-toggle[data-action="configure"] .uff-cart-toggle__action-add { display: block !important; }
.uff-cart-toggle[data-action="configure"] .uff-cart-toggle__action-qty { display: none !important; }
.uff-cart-toggle__plus { display: inline-block; margin-left: var(--uff-space-1); font-size: var(--uff-text-sm); font-weight: var(--uff-font-bold); line-height: 1; }