/**
 * Feldman Quote Products — multi-product quote basket.
 *
 * Self-contained and strictly scoped: every rule lives under an fqp-basket*
 * class (plus the secondary add button inside our own quote card), so no
 * Woodmart, WooCommerce or Elementor component is ever restyled.
 *
 * Design tokens follow the established FQP language: Feldman blue #0b5fa5,
 * ink #242424, soft #5d6771, radius scale 8/10/14/18.
 */

/* ---------------------------------------- Secondary add (product card) -- */

.fqp-card__actions .fqp-basket-add {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 7px;
	width: 100%;
	margin-top: 10px;
	min-height: 44px;
	padding: 9px 18px;
	background: #fff;
	border: 1px solid #c8d6e2;
	border-radius: 10px;
	color: #0b5fa5;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
	transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease;
}

.fqp-card__actions .fqp-basket-add:hover {
	background: #eef4fa;
	border-color: #0b5fa5;
	color: #094b82;
}

.fqp-card__actions .fqp-basket-add:focus-visible {
	outline: 2px solid rgba( 11, 95, 165, 0.4 );
	outline-offset: 2px;
}

.fqp-card__actions .fqp-basket-add.is-busy {
	opacity: 0.6;
	cursor: wait;
}

.fqp-basket-add__error {
	display: block;
	margin-top: 6px;
	color: #b32d2e;
	font-size: 12.5px;
}

/* --------------------------------------------------- Floating indicator -- */

.fqp-basket-fab {
	position: fixed;
	inset-inline-end: 18px;
	bottom: 84px;
	z-index: 9990;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 10px 16px;
	background: #0b5fa5;
	border-radius: 999px;
	color: #fff;
	font-size: 13.5px;
	font-weight: 600;
	text-decoration: none;
	box-shadow: 0 8px 22px rgba( 9, 75, 130, 0.32 );
	transition: background-color 0.18s ease, transform 0.18s ease;
}

.fqp-basket-fab:hover {
	background: #094b82;
	color: #fff;
	transform: translateY( -2px );
	text-decoration: none;
}

.fqp-basket-fab:focus-visible {
	outline: 2px solid #fff;
	outline-offset: 2px;
}

.fqp-basket-fab__count {
	display: grid;
	place-items: center;
	min-width: 22px;
	height: 22px;
	padding: 0 6px;
	background: #fff;
	border-radius: 999px;
	color: #0b5fa5;
	font-size: 12.5px;
	font-weight: 700;
	font-variant-numeric: tabular-nums;
}

/* ---------------------------------------------------------------- Toast -- */

.fqp-basket-toast {
	position: fixed;
	inset-inline-end: 18px;
	bottom: 140px;
	z-index: 9991;
	width: min( 340px, calc( 100vw - 36px ) );
	padding: 18px;
	background: #fff;
	border: 1px solid #dbe2e9;
	border-radius: 14px;
	box-shadow: 0 14px 34px rgba( 16, 42, 67, 0.2 );
	text-align: center;
	opacity: 0;
	transform: translateY( 8px );
	transition: opacity 0.2s ease, transform 0.2s ease;
}

.fqp-basket-toast.is-open {
	opacity: 1;
	transform: translateY( 0 );
}

.fqp-basket-toast__badge {
	display: grid;
	place-items: center;
	width: 40px;
	height: 40px;
	margin: 0 auto 8px;
	background: #eef8f0;
	border-radius: 999px;
	color: #1d6b32;
}

.fqp-basket-toast__title {
	margin: 0 0 4px;
	color: #242424;
	font-size: 15px;
	font-weight: 700;
}

.fqp-basket-toast__sub {
	margin: 0 0 14px;
	color: #5d6771;
	font-size: 13px;
	line-height: 1.5;
}

.fqp-basket-toast__actions {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.fqp-basket-toast__go,
.fqp-basket-toast__continue {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 42px;
	padding: 8px 16px;
	border-radius: 10px;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
	text-decoration: none;
	transition: background-color 0.18s ease, border-color 0.18s ease;
}

.fqp-basket-toast__go {
	background: #0b5fa5;
	border: 1px solid #0b5fa5;
	color: #fff;
}

.fqp-basket-toast__go:hover {
	background: #094b82;
	color: #fff;
	text-decoration: none;
}

.fqp-basket-toast__continue {
	background: #fff;
	border: 1px solid #c8d6e2;
	color: #0b5fa5;
}

.fqp-basket-toast__continue:hover {
	background: #eef4fa;
}

/* ---------------------------------------------------------- Basket page -- */

.fqp-basket {
	max-width: 720px;
	margin: 0 auto;
	direction: rtl;
}

/* The hidden attribute must always win: several basket blocks set their own
   display (flex/grid), which would otherwise override the UA's [hidden]. */
.fqp-basket [hidden],
.fqp-basket-toast[hidden],
.fqp-basket-fab[hidden] {
	display: none !important;
}

.fqp-basket__title {
	margin: 0 0 18px;
	color: #242424;
	font-size: 26px;
	font-weight: 700;
}

/* Lines: card layout everywhere — no wide desktop table to collapse. */

.fqp-basket__lines {
	list-style: none;
	margin: 0 0 26px;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.fqp-basket__line {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	flex-wrap: wrap;
	padding: 16px 18px;
	background: #fff;
	border: 1px solid #e2e7ec;
	border-radius: 14px;
	transition: border-color 0.18s ease, box-shadow 0.18s ease;
}

.fqp-basket__line:hover {
	border-color: #c8d6e2;
	box-shadow: 0 4px 14px rgba( 16, 42, 67, 0.06 );
}

.fqp-basket__line-name {
	color: #242424;
	font-size: 15px;
	font-weight: 600;
	line-height: 1.45;
}

.fqp-basket__line-controls {
	display: flex;
	align-items: center;
	gap: 14px;
}

/* Quantity stepper — same geometry as the modal stepper, scoped here
   because the shared styles live under .fqp-modal. LTR so minus stays
   left and plus right even inside the RTL card. */

.fqp-basket .fqp-stepper {
	display: inline-grid;
	grid-template-columns: 40px 56px 40px;
	direction: ltr;
	border: 1px solid #ccd5dd;
	border-radius: 10px;
	overflow: hidden;
	background: #fff;
}

.fqp-basket .fqp-stepper:focus-within {
	border-color: #0b5fa5;
	box-shadow: 0 0 0 2px rgba( 11, 95, 165, 0.14 );
}

.fqp-basket .fqp-stepper__btn {
	display: grid;
	place-items: center;
	min-height: 42px;
	border: 0;
	background: #f6f8fa;
	color: #0b5fa5;
	cursor: pointer;
	transition: background-color 0.15s ease;
}

.fqp-basket .fqp-stepper__btn--plus {
	background: #eef4fa;
}

.fqp-basket .fqp-stepper__btn:hover:not( :disabled ) {
	background: #dfeaf4;
}

.fqp-basket .fqp-stepper__btn:disabled {
	color: #c2cad2;
	cursor: not-allowed;
}

.fqp-basket .fqp-stepper__btn:focus-visible {
	outline: 2px solid rgba( 11, 95, 165, 0.4 );
	outline-offset: -2px;
}

.fqp-basket .fqp-stepper__value {
	border: 0;
	border-inline: 1px solid #e2e7ec;
	border-radius: 0;
	min-height: 42px;
	width: 100%;
	text-align: center;
	font-size: 15px;
	font-weight: 700;
	color: #242424;
	font-variant-numeric: tabular-nums;
	-moz-appearance: textfield;
	appearance: textfield;
}

.fqp-basket .fqp-stepper__value::-webkit-inner-spin-button,
.fqp-basket .fqp-stepper__value::-webkit-outer-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

.fqp-basket__remove {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 8px 10px;
	background: transparent;
	border: 0;
	border-radius: 8px;
	color: #5d6771;
	font-size: 13px;
	cursor: pointer;
	transition: background-color 0.15s ease, color 0.15s ease;
}

.fqp-basket__remove:hover {
	background: #fbeeee;
	color: #b32d2e;
}

.fqp-basket__remove:focus-visible {
	outline: 2px solid rgba( 179, 45, 46, 0.4 );
	outline-offset: 2px;
}

/* ------------------------------------------------------------ Empty state */

.fqp-basket__empty {
	padding: 44px 24px;
	background: #fff;
	border: 1px solid #e2e7ec;
	border-radius: 14px;
	text-align: center;
}

.fqp-basket__empty-icon {
	display: grid;
	place-items: center;
	width: 64px;
	height: 64px;
	margin: 0 auto 14px;
	background: #eef4fa;
	border-radius: 999px;
	color: #0b5fa5;
}

.fqp-basket__empty-title {
	margin: 0 0 6px;
	color: #242424;
	font-size: 17px;
	font-weight: 700;
}

.fqp-basket__empty-text {
	margin: 0 auto 18px;
	max-width: 420px;
	color: #5d6771;
	font-size: 14px;
	line-height: 1.6;
}

.fqp-basket__empty-cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	padding: 10px 26px;
	background: #0b5fa5;
	border-radius: 10px;
	color: #fff;
	font-size: 14.5px;
	font-weight: 600;
	text-decoration: none;
	transition: background-color 0.18s ease;
}

.fqp-basket__empty-cta:hover {
	background: #094b82;
	color: #fff;
	text-decoration: none;
}

/* -------------------------------------------------------- Customer form -- */

.fqp-basket__form {
	padding: 24px;
	background: #fff;
	border: 1px solid #e2e7ec;
	border-radius: 14px;
}

.fqp-basket__form-title {
	margin: 0 0 16px;
	color: #242424;
	font-size: 18px;
	font-weight: 700;
}

.fqp-basket__form .fqp-field {
	margin: 0 0 14px;
}

.fqp-basket__form .fqp-field label {
	display: block;
	margin-bottom: 5px;
	color: #242424;
	font-size: 13.5px;
	font-weight: 600;
}

.fqp-basket__form .fqp-field .required {
	color: #b32d2e;
	border: 0;
	text-decoration: none;
}

.fqp-basket__form .fqp-field input,
.fqp-basket__form .fqp-field textarea {
	box-sizing: border-box;
	width: 100%;
	min-height: 48px;
	padding: 10px 14px;
	background: #fff;
	border: 1px solid #ccd5dd;
	border-radius: 8px;
	color: #242424;
	font-size: 14.5px;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.fqp-basket__form .fqp-field textarea {
	min-height: 104px;
	resize: vertical;
}

.fqp-basket__form .fqp-field input:hover,
.fqp-basket__form .fqp-field textarea:hover {
	border-color: #9fb2c2;
}

.fqp-basket__form .fqp-field input:focus,
.fqp-basket__form .fqp-field textarea:focus {
	border-color: #0b5fa5;
	box-shadow: 0 0 0 2px rgba( 11, 95, 165, 0.14 );
	outline: none;
}

.fqp-basket__form .fqp-field__hint {
	display: block;
	margin-top: 4px;
	color: #8a939c;
	font-size: 12px;
}

/* Privacy line above the submit button (1.13.6). #5d6771 on white is 5.8:1. */
.fqp-basket__form .fqp-privacy-note {
	margin: 0 0 14px;
	color: #5d6771;
	font-size: 13px;
	line-height: 1.6;
}

.fqp-basket__form .fqp-privacy-note a {
	color: inherit;
	text-decoration: underline;
	text-underline-offset: 2px;
}

.fqp-basket__form .fqp-privacy-note a:hover,
.fqp-basket__form .fqp-privacy-note a:focus-visible {
	color: #242424;
}

/* Honeypot stays visually gone but form-readable for bots. */
.fqp-basket__form .fqp-hp {
	position: absolute;
	inset-inline-start: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/*
 * Submit button (1.7.1 contrast fix). The old single-class selector
 * (0-1-0) lost the `color` war to theme/builder rules like
 * `.entry-content button` or Woodmart's button styling, leaving dark text
 * on the blue background. The selectors below scope through .fqp-basket
 * with the element name (0-2-1), and the text colour is additionally
 * guarded with !important + -webkit-text-fill-color so no theme rule,
 * fill-color trick, blend mode or inherited colour can darken it. Scoped
 * strictly to our own button — nothing outside .fqp-basket is touched.
 */
.fqp-basket button.fqp-basket__submit {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	width: 100%;
	min-height: 50px;
	padding: 12px 22px;
	background: var( --fqp-primary, #0b5fa5 ) !important;
	border: 1px solid var( --fqp-primary, #0b5fa5 ) !important;
	border-radius: 10px;
	color: #fff !important;
	-webkit-text-fill-color: #fff !important;
	text-shadow: none !important;
	mix-blend-mode: normal !important;
	opacity: 1;
	font-size: 15.5px;
	font-weight: 700;
	cursor: pointer;
	transition: background-color 0.18s ease;
}

/* The label lives in an inner span — force it to follow the button. */
.fqp-basket button.fqp-basket__submit * {
	color: inherit !important;
	-webkit-text-fill-color: inherit !important;
}

.fqp-basket button.fqp-basket__submit:hover:not( :disabled ) {
	background: var( --fqp-primary-hover, #094b82 ) !important;
	border-color: var( --fqp-primary-hover, #094b82 ) !important;
	color: #fff !important;
	-webkit-text-fill-color: #fff !important;
}

.fqp-basket button.fqp-basket__submit:active:not( :disabled ) {
	background: var( --fqp-primary-hover, #094b82 ) !important;
	color: #fff !important;
	-webkit-text-fill-color: #fff !important;
}

.fqp-basket button.fqp-basket__submit:focus {
	color: #fff !important;
	-webkit-text-fill-color: #fff !important;
}

.fqp-basket button.fqp-basket__submit:focus-visible {
	outline: 3px solid rgba( 11, 95, 165, 0.45 );
	outline-offset: 3px;
	box-shadow: 0 0 0 2px #fff;
}

.fqp-basket button.fqp-basket__submit:disabled {
	opacity: 0.65;
	cursor: wait;
	color: #fff !important;
	-webkit-text-fill-color: #fff !important;
}

.fqp-basket__form .fqp-message {
	margin-top: 10px;
	min-height: 1.4em;
	color: #5d6771;
	font-size: 13.5px;
	text-align: center;
}

.fqp-basket__form .fqp-message.is-error {
	color: #b32d2e;
	font-weight: 600;
}

/* -------------------------------------------------------- Success panel -- */

.fqp-basket__success {
	padding: 44px 24px;
	background: #fff;
	border: 1px solid #b7dfc0;
	border-radius: 14px;
	text-align: center;
	outline: none;
}

.fqp-basket__success .fqp-success__badge {
	display: grid;
	place-items: center;
	width: 56px;
	height: 56px;
	margin: 0 auto 12px;
	background: #eef8f0;
	border-radius: 999px;
	color: #1d6b32;
}

.fqp-basket__success .fqp-success__title {
	margin: 0 0 8px;
	color: #242424;
	font-size: 20px;
	font-weight: 700;
}

.fqp-basket__success .fqp-success__text {
	margin: 0 auto;
	max-width: 460px;
	color: #5d6771;
	font-size: 14.5px;
	line-height: 1.6;
}

.fqp-basket__success-ref {
	margin: 12px 0 0;
	color: #0b5fa5;
	font-size: 14px;
	font-weight: 700;
	direction: ltr;
}

/* ----------------------------------------------------------- Responsive -- */

@media ( max-width: 480px ) {
	.fqp-basket__line {
		flex-direction: column;
		align-items: stretch;
	}

	.fqp-basket__line-controls {
		justify-content: space-between;
	}

	.fqp-basket-fab {
		bottom: 68px;
	}

	.fqp-basket-toast {
		inset-inline-end: 50%;
		transform: translate( 50%, 8px );
		bottom: 120px;
	}

	.fqp-basket-toast.is-open {
		transform: translate( 50%, 0 );
	}
}

/* ============================================================= 1.4.0 ==== */

.fqp-basket__summary {
	margin: -8px 0 16px;
	color: #5d6771;
	font-size: 14px;
	font-weight: 600;
}

.fqp-basket__line-info {
	display: flex;
	align-items: center;
	gap: 14px;
	min-width: 0;
}

.fqp-basket__thumb {
	flex: 0 0 auto;
	width: 56px;
	height: 56px;
	object-fit: cover;
	border: 1px solid #e2e7ec;
	border-radius: 10px;
	background: #fff;
}

.fqp-basket__thumb--empty {
	display: grid;
	place-items: center;
	color: #b7c1cb;
	background: #f6f8fa;
}

/* Configurable FAB position (1.5.0): 'start' flips to the other corner. */
.fqp-basket-fab--start.fqp-basket-fab,
.fqp-basket-fab--start.fqp-basket-toast {
	inset-inline-end: auto;
	inset-inline-start: 18px;
}

/* ============================================================ 1.12.3 ==== */

/* Phones: the indicator becomes a round icon-and-number button. The 147px
   pill covered centred first-screen buttons (the home hero's "skip video").
   The visible label is dropped; the link keeps its aria-label. */
@media ( max-width: 480px ) {
	.fqp-basket-fab {
		width: 52px;
		height: 52px;
		padding: 0;
		justify-content: center;
		gap: 0;
	}

	.fqp-basket-fab .fqp-icon {
		width: 22px;
		height: 22px;
	}

	.fqp-basket-fab__label {
		position: absolute !important;
		width: 1px;
		height: 1px;
		margin: -1px;
		padding: 0;
		overflow: hidden;
		clip: rect( 0 0 0 0 );
		clip-path: inset( 50% );
		white-space: nowrap;
		border: 0;
	}

	.fqp-basket-fab__count {
		position: absolute;
		top: -5px;
		inset-inline-end: -5px;
		box-shadow: 0 0 0 2px var( --fqp-primary, #0b5fa5 );
	}
}

/* ------------------------------------ Product card button (1.13.0) ------ */

/*
 * The card's "הוספה להצעת מחיר" is the theme's own loop button, so the site
 * styles it like every other card button. Only the in-flight state is ours;
 * a failed add follows the link to the product page (basket.js).
 */
.fqp-quote-button--add.is-busy {
	opacity: 0.65;
	pointer-events: none;
	cursor: wait;
}

/* ============================================================ 1.13.1 ==== */

/*
 * Phones: centre the add confirmation with physical offsets.
 *
 * The 480px rule above centres it with inset-inline-end: 50% plus
 * translate(50%). That only centres in LTR: in RTL inline-end is the left
 * edge, so the box starts mid-screen and is pushed further right. And with
 * the indicator in the 'start' corner (this site, since 1.12.2) the
 * position modifier replaced the 50% with 18px while the translate stayed.
 * Either way, measured on a 375px phone, the box sat 169px off the screen.
 * left: 50% with translate(-50%) centres in both directions and both
 * corners.
 */
@media ( max-width: 480px ) {
	.fqp-basket-toast,
	.fqp-basket-fab--start.fqp-basket-toast {
		left: 50%;
		right: auto;
		transform: translate( -50%, 8px );
	}

	.fqp-basket-toast.is-open,
	.fqp-basket-fab--start.fqp-basket-toast.is-open {
		transform: translate( -50%, 0 );
	}
}

/* ============================================================ 1.13.3 ==== */

/*
 * Quantity stepper on the quote list, redesigned to match the site's cart
 * (snippet "fds-premium-cart-quantity"): a 150px pill with a violet-to-sky
 * gradient border, a round violet minus and a round blue plus. The quote
 * dialog on the product page carries the same design (frontend.css).
 *
 * Three-class selectors outrank the stepper rules above (0,2,0) and the
 * theme's generic button and input rules; no !important needed.
 */
.fqp-basket .fqp-stepper {
	direction: ltr;
	position: relative;
	isolation: isolate;
	display: grid;
	grid-template-columns: 44px minmax(50px, 1fr) 44px;
	align-items: center;
	box-sizing: border-box;
	inline-size: 150px;
	max-inline-size: 100%;
	block-size: 54px;
	min-block-size: 54px;
	padding: 5px;
	overflow: visible;
	border: 1px solid transparent;
	border-radius: 999px;
	background:
		linear-gradient(90deg, rgba(245, 238, 255, 0.72), #fff 43%, rgba(237, 248, 255, 0.78)) padding-box,
		linear-gradient(110deg, rgba(124, 91, 239, 0.52), rgba(80, 181, 234, 0.42)) border-box;
	box-shadow:
		0 10px 24px rgba(65, 53, 143, 0.1),
		0 3px 9px rgba(64, 168, 224, 0.08),
		inset 0 1px 0 rgba(255, 255, 255, 0.96);
	transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.fqp-basket .fqp-stepper:hover,
.fqp-basket .fqp-stepper:focus-within {
	border-color: transparent;
	box-shadow:
		0 13px 30px rgba(78, 58, 177, 0.15),
		0 5px 14px rgba(48, 158, 220, 0.12),
		inset 0 1px 0 rgba(255, 255, 255, 0.98);
	transform: translateY(-1px);
}

.fqp-basket .fqp-stepper .fqp-stepper__btn {
	--btn-bgcolor: #fff;
	--btn-height: 44px;
	--btn-brd-radius: 50%;
	--btn-padding: 0;

	position: relative;
	z-index: 2;
	display: grid;
	place-items: center;
	box-sizing: border-box;
	inline-size: 44px;
	min-inline-size: 44px;
	block-size: 44px;
	min-block-size: 44px;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.94);
	line-height: 1;
	cursor: pointer;
	transition: transform 0.18s ease, box-shadow 0.18s ease, color 0.18s ease, background-color 0.18s ease, opacity 0.18s ease;
	-webkit-tap-highlight-color: transparent;
}

.fqp-basket .fqp-stepper .fqp-stepper__btn .fqp-icon {
	inline-size: 20px;
	block-size: 20px;
}

.fqp-basket .fqp-stepper .fqp-stepper__btn--minus {
	color: #7a57d8;
	box-shadow: 0 7px 17px rgba(116, 74, 214, 0.2), inset 0 0 15px rgba(180, 142, 247, 0.12);
}

.fqp-basket .fqp-stepper .fqp-stepper__btn--plus {
	color: #168cca;
	box-shadow: 0 7px 17px rgba(39, 153, 213, 0.2), inset 0 0 15px rgba(103, 199, 241, 0.13);
}

.fqp-basket .fqp-stepper .fqp-stepper__btn:hover:not(:disabled) {
	background: #fff;
	transform: translateY(-1px) scale(1.035);
}

.fqp-basket .fqp-stepper .fqp-stepper__btn--minus:hover:not(:disabled) {
	box-shadow: 0 9px 22px rgba(116, 74, 214, 0.28), 0 0 0 5px rgba(121, 84, 224, 0.08);
}

.fqp-basket .fqp-stepper .fqp-stepper__btn--plus:hover:not(:disabled) {
	box-shadow: 0 9px 22px rgba(39, 153, 213, 0.28), 0 0 0 5px rgba(39, 153, 213, 0.08);
}

.fqp-basket .fqp-stepper .fqp-stepper__btn:active:not(:disabled) {
	transform: scale(0.96);
}

.fqp-basket .fqp-stepper .fqp-stepper__btn:focus-visible {
	outline: 3px solid rgba(20, 120, 201, 0.24);
	outline-offset: 2px;
}

/* At the minimum the minus stays visible but quiet, so the range reads. */
.fqp-basket .fqp-stepper .fqp-stepper__btn:disabled {
	background: rgba(255, 255, 255, 0.94);
	box-shadow: none;
	opacity: 0.45;
	cursor: not-allowed;
}

.fqp-basket .fqp-stepper .fqp-stepper__value {
	box-sizing: border-box;
	inline-size: 100%;
	min-inline-size: 0;
	block-size: 44px;
	min-block-size: 44px;
	margin: 0;
	padding: 0 3px;
	border: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
	color: #232239;
	font-size: 20px;
	font-weight: 800;
	line-height: 44px;
	text-align: center;
	font-variant-numeric: tabular-nums;
	appearance: textfield;
	-moz-appearance: textfield;
}

.fqp-basket .fqp-stepper .fqp-stepper__value:focus {
	border: 0;
	box-shadow: none;
	outline: none;
}

@media (max-width: 767px) {
	.fqp-basket .fqp-stepper {
		grid-template-columns: 40px minmax(40px, 1fr) 40px;
		inline-size: 138px;
		block-size: 52px;
		min-block-size: 52px;
	}

	.fqp-basket .fqp-stepper .fqp-stepper__btn {
		inline-size: 40px;
		min-inline-size: 40px;
		block-size: 40px;
		min-block-size: 40px;
	}

	.fqp-basket .fqp-stepper .fqp-stepper__value {
		block-size: 40px;
		min-block-size: 40px;
		font-size: 18px;
		line-height: 40px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.fqp-basket .fqp-stepper,
	.fqp-basket .fqp-stepper .fqp-stepper__btn {
		transition: none;
		transform: none !important;
	}
}

/* ============================================================ 1.13.4 ==== */

/*
 * Every line on one grid (25.09): the name takes the free width and
 * wraps inside it, quantity and remove keep a fixed column on the left. The
 * flex-wrap layout above dropped the controls to a second row whenever a
 * name was long, so lines in the same list looked different. Phones keep
 * the stacked layout from the 480px rule, which is uniform on its own.
 */
.fqp-basket .fqp-basket__line {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: center;
	column-gap: 18px;
}

.fqp-basket .fqp-basket__line-info {
	min-width: 0;
}

.fqp-basket .fqp-basket__line-name {
	min-width: 0;
	overflow-wrap: anywhere;
}

/*
 * Remove: a round × like the cart page's (option 4 of 4).
 * Two classes, so it outranks Woodmart's generic button rule (0,1,0), which
 * painted the old control a grey 42px box.
 */
.fqp-basket .fqp-basket__remove {
	--btn-bgcolor: #fff;
	--btn-height: 38px;
	--btn-brd-radius: 50%;
	--btn-padding: 0;

	display: grid;
	place-items: center;
	flex: none;
	box-sizing: border-box;
	width: 38px;
	min-width: 38px;
	height: 38px;
	min-height: 38px;
	margin: 0;
	padding: 0;
	border: 1px solid #e3e7ef;
	border-radius: 50%;
	background: #fff;
	color: #8a94a6;
	box-shadow: 0 3px 10px rgba(36, 36, 60, 0.06);
	line-height: 1;
	cursor: pointer;
	transition: transform 0.22s ease, background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease, box-shadow 0.18s ease;
	-webkit-tap-highlight-color: transparent;
}

.fqp-basket .fqp-basket__remove .fqp-icon {
	width: 16px;
	height: 16px;
}

.fqp-basket .fqp-basket__remove:hover:not(:disabled),
.fqp-basket .fqp-basket__remove:focus-visible {
	border-color: #e5486a;
	background: #e5486a;
	color: #fff;
	box-shadow: 0 8px 18px rgba(229, 72, 106, 0.3);
	transform: rotate(90deg);
}

.fqp-basket .fqp-basket__remove:focus-visible {
	outline: 3px solid rgba(229, 72, 106, 0.28);
	outline-offset: 2px;
}

.fqp-basket .fqp-basket__remove:disabled {
	opacity: 0.5;
	cursor: wait;
}

@media (max-width: 480px) {
	.fqp-basket .fqp-basket__line {
		display: flex;
		flex-direction: column;
		align-items: stretch;
	}
}

@media (prefers-reduced-motion: reduce) {
	.fqp-basket .fqp-basket__remove {
		transition: none;
	}

	.fqp-basket .fqp-basket__remove:hover:not(:disabled),
	.fqp-basket .fqp-basket__remove:focus-visible {
		transform: none;
	}
}