/*--------------------------------------------------------------
 * QuickFORM Design System
 *--------------------------------------------------------------*/

:root {
	/* Theme colour — overridden inline via wp_add_inline_style */
	--qf-theme: #6389CB;
	--qf-theme-15: rgba(99, 137, 203, 0.15);
	--qf-theme-40: rgba(99, 137, 203, 0.40);

	/* Borders */
	--qf-border-color: #E2E8F0;
	--qf-border-width: 1.5px;
	--qf-radius: 12px;
	--qf-icon-radius: 9px;

	/* Spacing */
	--qf-field-gap: 16px;
	--qf-field-padding: 6px;
	--qf-box-padding: 24px;

	/* Icons */
	--qf-icon-size: 20px;
	--qf-icon-pad: 10px;
	/* 20 + 8*2 = 36 */
	--qf-icon-box: 44px;

	/* Typography */
	--qf-font: inherit;
	--qf-text: #1E293B;
	--qf-placeholder: #94A3B8;
	--qf-label: #334155;
	--qf-font-size: 14px;

	/* Surfaces */
	--qf-bg: #FFFFFF;
	--qf-field-bg: #FFFFFF;

	/* Shadow — from Figma: X-2 Y5 B12.9 S-9  #9D9D9D 81 % */
	--qf-shadow: -2px 5px 12.9px -9px rgba(157, 157, 157, 0.81);
}

/* Base RTL utility */
[dir="rtl"] .qf-form,
.qf-form[dir="rtl"] {
	direction: rtl;
	text-align: right;
}

/*--------------------------------------------------------------
 * Form container
 *--------------------------------------------------------------*/
.qf-form {
	font-family: var(--qf-font);
	font-size: var(--qf-font-size);
	color: var(--qf-text);
	background: var(--qf-bg);
	margin: 0 auto;
	width: -webkit-fill-available;
	box-sizing: border-box;
}

.qf-form *,
.qf-form *::before,
.qf-form *::after {
	box-sizing: border-box;
}

/*--------------------------------------------------------------
 * Form title
 *--------------------------------------------------------------*/
.qf-title {
	text-align: right;
	font-size: 18px;
	font-weight: 700;
	color: var(--qf-text);
	margin: 20px 0;
	display: flex;
	align-items: start;
	justify-content: start;
	gap: 6px;
	padding-top: 24px;
	border-top: dashed 2px;
	border-top-color: var(--qf-border-color);
}

.qf-title svg {
	color: var(--qf-theme);
}

/*--------------------------------------------------------------
 * Fields
 *--------------------------------------------------------------*/
.qf-fields {
	display: flex;
	flex-direction: column;
	gap: var(--qf-field-gap);
}

.qf-field {
	position: relative;
	display: flex;
	align-items: center;
	gap: 8px;
	background: var(--qf-field-bg);
	border: var(--qf-border-width) solid var(--qf-border-color);
	border-radius: var(--qf-radius);
	padding: 4px;
	box-shadow: var(--qf-shadow);
	transition: border-color 0.1s ease, box-shadow 0.1s ease;
	min-height: 54px;
	max-height: 54px;
	min-width: 14;
}

.qf-field-wrap.qf-error .qf-field,
.qf-error .qf-field,
.qf-field.qf-error {
	border-color: #DC2626 !important;
}

.qf-field:focus-within {
	border-color: var(--qf-theme);
	box-shadow: 0 0 0 0.5px var(--qf-theme), var(--qf-shadow);
}

/* Icon container */
.qf-field-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: var(--qf-icon-box);
	height: var(--qf-icon-box);
	min-width: var(--qf-icon-box);
	background: var(--qf-theme-15);
	border-radius: var(--qf-icon-radius);
	color: var(--qf-theme);
	flex-shrink: 0;
}

.qf-field-icon svg {
	width: var(--qf-icon-size);
	height: var(--qf-icon-size);
	stroke: var(--qf-theme) !important;
	fill: none;
}

/* Input / select — fills remaining space */
.qf-field input,
.qf-field select {
	flex: 1;
	border: none !important;
	outline: none !important;
	background: transparent;
	font-family: inherit;
	font-size: var(--qf-font-size);
	color: var(--qf-text);
	padding: 8px 12px;
	min-width: 0;
	-webkit-appearance: none;
	appearance: none;
}

.qf-field input::placeholder {
	color: var(--qf-placeholder);
}

/* Select chevron */
.qf-field-chevron {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	min-width: 24px;
	color: var(--qf-placeholder);
	pointer-events: none;
}

.qf-field-chevron svg {
	width: 16px;
	height: 16px;
}

/* Error text styling */
.qf-field-wrap {
	display: flex;
	flex-direction: column;
	gap: 4px;
	flex: 1;
	min-width: 100px;
}

.qf-error-message {
	color: #DC2626;
	font-size: 11px;
	font-weight: 500;
	margin: 0 4px;
	display: none;
	text-align: right;
}

.qf-field-wrap.qf-error .qf-error-message,
.qf-attribute.qf-error .qf-error-message,
.qf-error .qf-error-message,
.qf-field.qf-error+.qf-error-message {
	display: block !important;
}

/*--------------------------------------------------------------
 * Variation Swatches
 *--------------------------------------------------------------*/
.qf-variations {
	margin-bottom: 5px;
}

.qf-attribute {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin-bottom: 12px;
}

.qf-attr-label {
	font-weight: 500;
	color: var(--qf-label);
	font-size: 13px;
}

.qf-selected-val {
	font-weight: 500;
	color: var(--qf-text);
}

.qf-swatches {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.qf-swatch {
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	min-height: 40px;
	padding: 6px 10px;
	border: var(--qf-border-width) solid var(--qf-border-color);
	border-radius: 8px;
	cursor: pointer;
	font-size: 14px;
	font-weight: 400;
	transition: all 0.2s ease;
	background: #fff;
	color: var(--qf-text);
	user-select: none;
}

.qf-swatch:hover {
	border-color: var(--qf-theme-40);
}

.qf-swatch.qf-swatch-color,
.qf-swatch.qf-swatch-image {
	padding: 0;
	width: 38px;
	height: 38px;
	border-radius: 8px;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

.qf-swatch.selected {
	border-color: var(--qf-theme);
	background-color: var(--qf-theme-15);
	color: var(--qf-theme);
	box-shadow: 0 0 0 0.5px var(--qf-theme), var(--qf-shadow);
}

.qf-swatch.qf-swatch-color.selected,
.qf-swatch.qf-swatch-image.selected {
	outline: auto;
	outline-offset: 0.35rem;
	outline-width: 0.01rem;
	background-color: transparent;
	box-shadow: 0 0 0 1px var(--qf-theme), var(--qf-shadow);
}

.qf-swatch.out-of-stock {
	opacity: 0.5;
	position: relative;
	cursor: not-allowed;
	pointer-events: none;
	background: #f9f9f9;
}

.qf-swatch.out-of-stock::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 0;
	width: 100%;
	height: 1px;
	background: #999;
	transform: rotate(-15deg);
}

/* Error state for swatches */
.qf-attribute.qf-error .qf-swatch {
	border-color: #DC2626;
}

.qf-attribute.qf-error .qf-error-message {
	display: block;
}

/*--------------------------------------------------------------
 * Stock availability (pulse + status) below attributes
 *--------------------------------------------------------------*/
.qf-out-of-stock-msg {
	display: inline-block;
	margin: 8px 0;
	padding: 10px 16px;
	background: #fff1f1;
	border: 1px solid #fca5a5;
	border-radius: 10px;
	color: #dc2626;
	font-size: 0.9rem;
	font-weight: 600;
	text-align: center;
	width: 100%;
	box-sizing: border-box;
}

.qf-availability {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	margin-top: -1rem;
	margin-bottom: 0.25rem;
	font-size: 0.9rem;
	color: var(--qf-text);
}

.qf-availability-dot {
	display: inline-block;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	flex-shrink: 0;
}

/* In stock: green pulse */
.qf-availability.in-stock .qf-availability-dot {
	background: #16a34a;
	animation: qf-pulse-green 2.5s ease-in-out infinite;
}

/* Low stock: yellow/amber pulse */
.qf-availability.low-stock .qf-availability-dot {
	background: #ca8a04;
	animation: qf-pulse-yellow 2.5s ease-in-out infinite;
}

/* Out of stock: no pulse, dot hidden */
.qf-availability.out-of-stock .qf-availability-dot {
	display: none;
}

.qf-availability-status.in-stock {
	color: #16a34a;
	font-weight: 500;
}

.qf-availability-status.low-stock {
	color: #b45309;
	font-weight: 500;
}

.qf-availability-status.out-of-stock {
	color: #991b1b;
	font-weight: 500;
}

@keyframes qf-pulse-green {

	0%,
	100% {
		opacity: 1;
		box-shadow: 0 0 0 0 rgba(22, 163, 74, 0.5);
	}

	50% {
		opacity: 0.95;
		box-shadow: 0 0 0 8px rgba(22, 163, 74, 0);
	}
}

@keyframes qf-pulse-yellow {

	0%,
	100% {
		opacity: 1;
		box-shadow: 0 0 0 0 rgba(202, 138, 4, 0.5);
	}

	50% {
		opacity: 0.95;
		box-shadow: 0 0 0 8px rgba(202, 138, 4, 0);
	}
}

@media (prefers-reduced-motion: reduce) {

	.qf-availability.in-stock .qf-availability-dot,
	.qf-availability.low-stock .qf-availability-dot {
		animation: none;
	}
}

/*--------------------------------------------------------------
 * Two-up row (wilaya + commune side by side)
 *--------------------------------------------------------------*/
.qf-row {
	display: flex;
	gap: var(--qf-field-gap);
	flex-wrap: wrap;
}

.qf-row .qf-field {
	flex: 1;
	min-width: 0;
}

/*--------------------------------------------------------------
 * Quantity controls
 *--------------------------------------------------------------*/
.qf-qty {
	display: flex;
	align-items: center;
	border: var(--qf-border-width) solid var(--qf-border-color);
	border-radius: var(--qf-radius);
	overflow: hidden;
	box-shadow: var(--qf-shadow);
}

.qf-qty button {
	width: 36px !important;
	height: 48px !important;
	padding: 0 !important;
	margin: 0 !important;
	border: none !important;
	background: transparent;
	font-size: 18px;
	cursor: pointer;
	color: var(--qf-text);
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background 0.15s;
}

.qf-qty button:hover {
	background: var(--qf-theme-15);
}

.qf-qty button:disabled {
	opacity: 0.3;
	cursor: not-allowed;
	background: transparent !important;
}

.qf-qty button svg {
	width: 18px;
	height: 18px;
	stroke: currentColor;
	fill: none;
	display: block;
}

.qf-form .qf-qty input[type="number"] {
	width: 36px !important;
	height: 48px !important;
	line-height: 48px !important;
	padding: 0 !important;
	margin: 0 !important;
	border: none !important;
	text-align: center !important;
	font-size: var(--qf-font-size) !important;
	font-family: inherit !important;
	color: var(--qf-text) !important;
	outline: none !important;
	-moz-appearance: textfield !important;
	-webkit-appearance: none !important;
	appearance: none !important;
	background: transparent !important;
	box-shadow: none !important;
}

.qf-qty input::-webkit-inner-spin-button,
.qf-qty input::-webkit-outer-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

/*--------------------------------------------------------------
 * Shipping methods (radio cards)
 *--------------------------------------------------------------*/
.qf-shipping-methods {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.qf-shipping-option {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 12px 14px;
	border: var(--qf-border-width) solid var(--qf-border-color);
	border-radius: var(--qf-radius);
	cursor: pointer;
	transition: border-color 0.2s, background 0.2s;
	box-shadow: var(--qf-shadow);
}

.qf-shipping-option:hover {
	border-color: var(--qf-theme-40);
}

.qf-shipping-option.selected {
	border-color: var(--qf-theme);
	background: var(--qf-theme-15);
}

.qf-shipping-option input[type="radio"] {
	display: none;
}

.qf-shipping-radio {
	width: 18px;
	height: 18px;
	min-width: 18px;
	border: 2px solid var(--qf-border-color);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: border-color 0.2s;
}

.qf-shipping-option.selected .qf-shipping-radio {
	border-color: var(--qf-theme);
}

.qf-shipping-option.selected .qf-shipping-radio::after {
	content: '';
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--qf-theme);
}

.qf-shipping-label {
	flex: 1;
	font-size: var(--qf-font-size);
}

.qf-shipping-cost {
	font-weight: 600;
	white-space: nowrap;
}

/*--------------------------------------------------------------
 * Coupon
 *--------------------------------------------------------------*/

.qf-coupon-toggle {
	font-size: 13px;
	color: var(--qf-label);
	display: flex;
	align-items: center;
	gap: 6px;
}

.qf-coupon-field .qf-field {
	justify-content: space-between;
	padding: 0px 8px;
}

#qf-coupon-toggle-btn {
	color: var(--qf-theme);
	font-weight: 600;
	cursor: pointer;
	text-decoration: none;
	transition: opacity 0.2s;
}

#qf-coupon-toggle-btn:hover {
	opacity: 0.8;
}

.qf-coupon-field {
	margin-top: 10px;
}

.qf-coupon-field .qf-field {
	display: flex;
	gap: 8px;
}

.qf-coupon-field input {
	flex: 1;
	width: -webkit-fill-available!important;
}
input#qf-coupon-code {
    width: -webkit-fill-available !important;
}
#qf-apply-coupon {
	background: var(--qf-theme);
	color: #fff;
	border: none;
	border-radius: 8px;
	padding: 0 16px;
	height: 38px;
	font-weight: 600;
	font-size: 13px;
	cursor: pointer;
	transition: opacity 0.2s;
}

#qf-apply-coupon:hover {
	opacity: 0.9;
}

#qf-coupon-msg {
	font-size: 12px;
	margin-top: 6px;
	padding: 0 4px;
}

#qf-coupon-msg.success {
	color: #16A34A;
}

#qf-coupon-msg.error {
	color: #DC2626;
}

/* Order Summary */
.qf-order-summary {
	background: #F8FAFC;
	border: 1px solid #E2E8F0;
	border-radius: 12px;
	padding: 20px;
	margin: 20px 0;
}



.qf-summary-row {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 10px;
	font-size: 14px;
	color: var(--qf-label);
}

.qf-summary-row span:last-child {
	font-weight: 500;
	color: var(--qf-text);
}

.qf-summary-divider {
	border: none;
	border-top: 1px solid #E2E8F0;
	margin: 15px 0;
}

.qf-summary-total {
	margin-bottom: 0 !important;
	font-size: 18px;
	color: var(--qf-text);
	font-weight: 500;
}

.qf-summary-total span:last-child {
	font-size: 20px;
	color: var(--qf-theme);
}

.qf-shipping-loading {
	text-align: center;
	padding: 12px;
	color: var(--qf-placeholder);
	font-size: 13px;
}

.qf-submit-row {
	display: flex;
	gap: var(--qf-field-gap);
	align-items: stretch;
	flex-wrap: wrap;
}

.qf-submit-row .qf-qty {
	flex-shrink: 0;
}

.qf-submit {
	flex: 1;
	width: 100%;
	min-width: 150px;
	min-height: 48px;
	padding: 0 20px;
	border: none;
	border-radius: var(--qf-radius) !important;
	background: var(--qf-theme) !important;
	color: #FFFFFF !important;
	font-family: inherit !important;
	font-size: 16px;
	font-weight: 600;
	cursor: pointer;
	transition: opacity 0.2s;
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
	overflow: hidden;
	animation: 5s infinite qf-shake-every-5s;
}

@keyframes qf-shake-every-5s {

	0%,
	100%,
	90% {
		transform: translateX(0);
	}

	92% {
		transform: translateX(-6px);
	}

	94% {
		transform: translateX(6px);
	}

	96% {
		transform: translateX(-4px);
	}

	98% {
		transform: translateX(4px);
	}
}

@keyframes qf-shiny-slide {
	0% {
		left: -100%;
		opacity: 0;
	}

	10%,
	90% {
		opacity: 1;
	}

	100% {
		left: 200%;
		opacity: 0;
	}
}

.qf-submit::before {
	content: "" !important;
	display: block !important;
	position: absolute !important;
	top: 0 !important;
	width: 80px !important;
	height: 100% !important;
	background: linear-gradient(120deg, rgba(255, 255, 255, 0) 20%, rgba(255, 255, 255, 0.7) 50%, rgba(255, 255, 255, 0) 80%) !important;
	animation: 1.5s ease-in-out infinite qf-shiny-slide !important;
	pointer-events: none !important;
	z-index: 1 !important;
	visibility: visible !important;
}

.qf-submit:hover {
	opacity: 0.9;
}

.qf-submit:disabled,
.qf-submit[disabled] {
	opacity: 0.65 !important;
	cursor: not-allowed !important;
	pointer-events: none;
	animation: none !important;
}

.qf-submit:disabled::before,
.qf-submit[disabled]::before {
	display: none !important;
}

.qf-submit.qf-btn-success {
	background: #16A34A !important;
	color: #FFFFFF !important;
	opacity: 1 !important;
	cursor: default !important;
	pointer-events: none !important;
	animation: none !important;
}

.qf-submit.qf-btn-success::before {
	display: none !important;
}

.qf-spinner {
	display: inline-block;
	width: 20px;
	height: 20px;
	border: 3px solid rgba(255, 255, 255, 0.3);
	border-radius: 50%;
	border-top-color: #ffffff;
	animation: qf-spin 1s ease-in-out infinite;
}

@keyframes qf-spin {
	to {
		transform: rotate(360deg);
	}
}

/*--------------------------------------------------------------
 * Messages
 *--------------------------------------------------------------*/
.qf-message {
	text-align: center;
	padding: 10px;
	border-radius: var(--qf-radius);
	font-size: 13px;
	margin-top: var(--qf-field-gap);
	display: none;
}

.qf-message.qf-error {
	display: block;
	background: #FEF2F2;
	color: #DC2626;
	border: 1px solid #FECACA;
}

.qf-message.qf-success {
	display: block;
	background: #F0FDF4;
	color: #16A34A;
	border: 1px solid #BBF7D0;
}

.qf-form input[type=text],
.qf-form input[type=email],
.qf-form input[type=url],
.qf-form input[type=password],
.qf-form input[type=search],
.qf-form input[type=number],
.qf-form input[type=tel],
.qf-form input[type=range],
.qf-form input[type=date],
.qf-form input[type=month],
.qf-form input[type=week],
.qf-form input[type=time],
.qf-form input[type=datetime],
.qf-form input[type=datetime-local],
.qf-form input[type=color],
.qf-form textarea {
	all: unset !important;
}


/*--------------------------------------------------------------
 * Upsell cards (Phase 3)
 *--------------------------------------------------------------*/
.qf-upsells-box {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin-bottom: var(--qf-field-gap);
}

.qf-upsell-card {
	position: relative;
	border: var(--qf-border-width) solid var(--qf-border-color);
	border-radius: var(--qf-radius);
	background: var(--qf-field-bg);
	cursor: pointer;
	transition: border-color 0.18s, box-shadow 0.18s;
	overflow: hidden;
}

.qf-upsell-card:hover {
	border-color: var(--qf-theme-40);
}

.qf-upsell-card.selected {
	border-color: var(--qf-theme);
	box-shadow: 0 0 0 1px var(--qf-theme);
}

/* Optional badge ribbon at the top */
.qf-upsell-badge {
	background: var(--qf-theme);
	color: #fff;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-align: center;
	padding: 4px 12px;
}

/* Card body row */
.qf-upsell-card-inner {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 14px 14px;
}

/* Radio circle */
.qf-upsell-radio {
	flex-shrink: 0;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	border: 2px solid var(--qf-border-color);
	display: flex;
	align-items: center;
	justify-content: center;
	transition: border-color 0.18s;
}

.qf-upsell-card.selected .qf-upsell-radio {
	border-color: var(--qf-theme);
}

.qf-upsell-radio-dot {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: var(--qf-theme);
	transform: scale(0);
	transition: transform 0.18s;
}

.qf-upsell-card.selected .qf-upsell-radio-dot {
	transform: scale(1);
}

/* Label + free-ship tag */
.qf-upsell-text {
	flex: 1;
	min-width: 0;
}

.qf-upsell-label {
	font-size: 13px;
	font-weight: 600;
	color: var(--qf-text);
	line-height: 1.4;
}

.qf-upsell-free-ship {
	display: inline-block;
	margin-top: 4px;
	font-size: 11px;
	font-weight: 600;
	color: #16a34a;
	background: #dcfce7;
	border-radius: 4px;
	padding: 2px 6px;
}

/* Prices */
.qf-upsell-prices {
	flex-shrink: 0;
	text-align: end;
}

.qf-upsell-price-now {
	font-size: 15px;
	font-weight: 700;
	color: var(--qf-theme);
}

.qf-upsell-price-was {
	font-size: 11px;
	color: var(--qf-placeholder);
	text-decoration: line-through;
}

/* Variation selects area (shown when card selected on variable product) */
.qf-upsell-variations {
	padding: 0 14px 14px;
	display: flex;
	flex-direction: column;
	gap: 10px;
	border-top: 1px solid var(--qf-border-color);
	margin-top: 0;
}

.qf-upsell-item-label {
	font-size: 12px;
	font-weight: 600;
	color: var(--qf-label);
	margin-bottom: 6px;
	padding-top: 10px;
}

.qf-upsell-item-selects {
	display: flex;
	flex-direction: row;
	gap: 8px;
}

.qf-upsell-select-wrap {
	margin: 0 !important;
	width: -webkit-fill-available;
}

.qf-upsell-select-with-chevron {
	display: flex;
	align-items: center;
	background: var(--qf-field-bg);
	border: var(--qf-border-width) solid var(--qf-border-color);
	border-radius: var(--qf-radius);
	box-shadow: var(--qf-shadow);
	overflow: hidden;
}

.qf-upsell-select-with-chevron .qf-upsell-attr-select {
	flex: 1;
	min-width: 0;
	border: none;
	box-shadow: none;
	border-radius: 0;
}

.qf-upsell-chevron {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	min-width: 36px;
	color: var(--qf-placeholder);
	pointer-events: none;
	flex-shrink: 0;
}

.qf-upsell-chevron svg {
	width: 16px;
	height: 16px;
}

.qf-upsell-attr-select {
	width: 100%;
	height: 44px;
	border: var(--qf-border-width) solid var(--qf-border-color);
	border-radius: var(--qf-radius);
	padding: 0 12px;
	font-size: var(--qf-font-size);
	color: var(--qf-text);
	background: var(--qf-field-bg);
	cursor: pointer;
	box-shadow: var(--qf-shadow);
}

.qf-upsell-attr-select:focus {
	outline: none;
	border-color: var(--qf-theme);
}

.qf-upsell-attr-select.qf-error {
	border-color: #DC2626;
}

/* Free shipping notice (when upsell has free shipping) */
.qf-free-shipping-notice {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 12px 14px;
	border: var(--qf-border-width) solid #bbf7d0;
	border-radius: var(--qf-radius);
	background: #f0fdf4;
	color: #16a34a;
	font-weight: 600;
	font-size: var(--qf-font-size);
}

.qf-free-ship-dot {
	display: inline-block;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #16a34a;
	flex-shrink: 0;
}

/* Full-width submit when upsells active */
.qf-submit-row--upsell {
	flex-direction: column;
}

.qf-submit--full {
	width: 100% !important;
}

/*--------------------------------------------------------------
 * Responsive
 *--------------------------------------------------------------*/
@media (max-width: 480px) {

	.qf-row,
	.qf-submit-row {
		flex-direction: row;
		gap: var(--qf-field-gap);
		flex-wrap: wrap;
	}
}

/* Hide default WooCommerce form */
.woocommerce-js div.product form.cart {
	display: none !important;
}