/**
 * Neon Alisa — composable address picker widgets.
 * Colours follow Elementor Global Colors via the same CSS variables as the rest
 * of the plugin, so these widgets match the site theme out of the box.
 */

:root {
	--dsec-pick-accent: var(--e-global-color-accent, var(--e-global-color-primary, #2f6bff));
	--dsec-pick-primary: var(--e-global-color-primary, #0f1115);
	--dsec-pick-text: var(--e-global-color-text, #475467);
	--dsec-pick-line: var(--e-global-color-text, rgba(0, 0, 0, .16));
	--dsec-pick-radius: 12px;
}

/* ===== Map ===== */
.dsec-map {
	width: 100%;
	height: 360px;
	border-radius: var(--dsec-pick-radius);
	overflow: hidden;
	background: color-mix(in srgb, var(--dsec-pick-text) 10%, transparent);
}
.dsec-map--placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	padding: 24px;
	color: var(--dsec-pick-text);
	font-size: 14px;
	line-height: 1.5;
}

/* ===== Address search =====
   Spacing and rounding are expressed in em and driven by custom properties, so
   the widget follows the global typography of the Elementor kit and can be
   retuned site-wide from Site Settings without touching each instance. */
.dsec-addr {
	--dsec-addr-radius: 0.65em;
	--dsec-addr-pad-y: 0.75em;
	--dsec-addr-pad-x: 0.9em;
	--dsec-addr-gap: 0.55em;

	position: relative;
	width: 100%;
	font-size: inherit;
}
.dsec-addr__row {
	display: flex;
	gap: var(--dsec-addr-gap);
	align-items: stretch;
}
.dsec-addr__input {
	flex: 1;
	min-width: 0;
	padding: var(--dsec-addr-pad-y) var(--dsec-addr-pad-x);
	border: 1px solid var(--dsec-pick-line);
	border-radius: var(--dsec-addr-radius);
	background: #fff;
	font: inherit;
	color: inherit;
}
.dsec-addr__input:focus {
	outline: none;
	border-color: var(--dsec-pick-accent);
	box-shadow: 0 0 0 0.2em color-mix(in srgb, var(--dsec-pick-accent) 18%, transparent);
}
/* Low specificity on purpose: the kit's Theme Style button rules (and any value
   set on the widget itself) override these fallbacks. */
.dsec-addr__btn {
	flex: none;
	padding: var(--dsec-addr-pad-y) calc(var(--dsec-addr-pad-x) * 1.3);
	border: none;
	border-radius: var(--dsec-addr-radius);
	background: var(--dsec-pick-accent);
	color: var(--e-global-color-primary, #fff);
	font: inherit;
	line-height: 1.2;
	cursor: pointer;
}
.dsec-addr__btn:hover { filter: brightness( .96 ); }

.dsec-addr__suggest {
	position: absolute;
	top: calc(100% + 0.35em);
	left: 0;
	right: 0;
	z-index: 30;
	margin: 0;
	padding: 0.3em;
	list-style: none;
	background: #fff;
	border: 1px solid var(--dsec-pick-line);
	border-radius: calc(var(--dsec-addr-radius) * 1.2);
	box-shadow: 0 14px 34px rgba(16, 24, 40, .16);
	max-height: 20em;
	overflow-y: auto;
}
.dsec-addr__suggest[hidden] { display: none; }
.dsec-addr__suggest-item {
	padding: calc(var(--dsec-addr-pad-y) * 0.85) calc(var(--dsec-addr-pad-x) * 0.85);
	border-radius: calc(var(--dsec-addr-radius) * 0.8);
	cursor: pointer;
	line-height: 1.35;
	color: var(--dsec-pick-text);
}
.dsec-addr__suggest-item:hover { background: #f2f4f7; }

/* ===== Delivery zone output ===== */
.dsec-zoneout {
	font-weight: 600;
	line-height: 1.4;
	min-height: 1.4em;
}
.dsec-zoneout[data-dsec-state="ok"] { color: #12805c; }
.dsec-zoneout[data-dsec-state="none"] { color: #d92d20; }
.dsec-zoneout[data-dsec-state="empty"] { color: var(--dsec-pick-text); font-weight: 500; }
.dsec-zoneout[data-dsec-state="loading"] { opacity: .6; }
.dsec-zoneout[data-dsec-state="loading"]::after { content: '…'; }

/* ===== Composable checkout widgets ===== */

/* Order type segmented control */
.dsec-seg {
	display: inline-flex;
	width: 100%;
	padding: 5px;
	background: color-mix(in srgb, var(--dsec-pick-text) 12%, transparent);
	border-radius: 999px;
	gap: 4px;
}
.dsec-seg__btn {
	flex: 1;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 10px 16px;
	border: none;
	border-radius: 999px;
	background: transparent;
	font: inherit;
	font-weight: 600;
	color: var(--dsec-pick-text);
	cursor: pointer;
	transition: background .15s, color .15s;
}
.dsec-seg__btn.is-active {
	background: var(--dsec-pick-primary);
	color: #fff;
}
.dsec-seg__ic, .dsec-checkout__ic, .dsec-clearw__ic {
	display: inline-flex;
	align-items: center;
	line-height: 0;
}
.dsec-seg__ic svg, .dsec-checkout__ic svg, .dsec-clearw__ic svg {
	width: 1em;
	height: 1em;
}

/* Totals */
.dsec-totals { width: 100%; }
.dsec-totals__row {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 8px;
	color: var(--dsec-pick-text);
}
.dsec-totals__row--grand {
	margin-top: 10px;
	padding-top: 12px;
	border-top: 1px solid var(--dsec-pick-line);
	font-weight: 700;
	font-size: 1.15em;
	color: var(--dsec-pick-primary);
}

/* Customer field */
.dsec-field { width: 100%; }
.dsec-field__control {
	width: 100%;
	padding: 14px 18px;
	border: 1px solid var(--dsec-pick-line);
	border-radius: 999px;
	background: #fff;
	font: inherit;
	color: inherit;
}
.dsec-field textarea.dsec-field__control {
	border-radius: 18px;
	min-height: 110px;
	resize: vertical;
}
.dsec-field__control:focus {
	outline: none;
	border-color: var(--dsec-pick-accent);
}

/* Checkout button */
.dsec-checkout {
	display: flex;
	flex-direction: column;
	width: 100%;
}
.dsec-checkout__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 16px 24px;
	border: none;
	border-radius: 999px;
	background: var(--dsec-pick-primary);
	color: #fff;
	font: inherit;
	font-weight: 700;
	cursor: pointer;
}
.dsec-checkout__btn:disabled { opacity: .6; cursor: default; }
.dsec-checkout__msg { margin-top: 10px; text-align: center; }

/* Clear cart */
.dsec-clearw { display: flex; justify-content: center; }
.dsec-clearw__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	border: none;
	background: none;
	font: inherit;
	color: var(--dsec-pick-text);
	text-decoration: underline;
	cursor: pointer;
}
.dsec-clearw__btn:hover { color: var(--dsec-pick-primary); }

/* ===== Cart Items widget — button alignment for icons/borders ===== */
.dsec-items-widget .dsec-cart__minus,
.dsec-items-widget .dsec-cart__plus,
.dsec-items-widget .dsec-cart__rm {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: background .15s, color .15s, border-color .15s;
}
.dsec-items-widget .dsec-cart__rm svg,
.dsec-items-widget .dsec-cart__minus svg,
.dsec-items-widget .dsec-cart__plus svg {
	width: 1em;
	height: 1em;
}

/* ===== Delivery Time widget ===== */
.dsec-timew {
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.dsec-timew__closed {
	padding: 10px 12px;
	border-radius: 10px;
	background: rgba(180, 35, 24, .08);
	color: #b42318;
	font-size: 14px;
}
.dsec-timew .dsec-seg {
	width: 100%;
}
.dsec-timew__pick {
	display: flex;
	flex-direction: column;
	gap: 6px;
}
.dsec-timew__lbl {
	font-size: 13px;
	font-weight: 600;
	color: var(--e-global-color-text, #101828);
}
.dsec-timew__row {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
}
.dsec-timew__sel {
	flex: 1 1 130px;
	min-width: 110px;
	padding: 10px 12px;
	border: 1px solid rgba(16, 24, 40, .14);
	border-radius: 10px;
	background: #fff;
	color: var(--e-global-color-text, #101828);
	font-size: 14px;
	line-height: 1.3;
}
.dsec-timew__sel:focus {
	outline: none;
	border-color: var(--e-global-color-accent, #7c3aed);
}

/* ===== Promo code widget ===== */
.dsec-promo { display: flex; flex-direction: column; gap: 8px; }
.dsec-promo__row { display: flex; gap: 8px; align-items: stretch; }
.dsec-promo__input {
	flex: 1;
	min-width: 0;
	padding: 0.75em 0.9em;
	border: 1px solid var(--dsec-pick-line);
	border-radius: 0.65em;
	background: #fff;
	font: inherit;
	color: inherit;
}
.dsec-promo__input:focus {
	outline: none;
	border-color: var(--dsec-pick-accent);
}
.dsec-promo__input:disabled { background: #f6f7f9; color: var(--dsec-pick-text); }
.dsec-promo__btn {
	flex: none;
	padding: 0.75em 1.2em;
	border: none;
	border-radius: 0.65em;
	background: var(--dsec-pick-accent);
	color: var(--e-global-color-primary, #fff);
	font: inherit;
	line-height: 1.2;
	cursor: pointer;
}
.dsec-promo__btn:hover { filter: brightness( .96 ); }
.dsec-promo__btn:disabled { opacity: .6; cursor: default; }
.dsec-promo__msg:empty { display: none; }
.dsec-promo__msg { font-size: .92em; line-height: 1.4; }
.dsec-totals__row--discount span:last-child { color: #067647; }

/* ===== Product options (variants + add-ons) ===== */
.dsec-opts { display: flex; flex-direction: column; gap: 1em; }
.dsec-opts__seg {
	display: flex;
	gap: 0.25em;
	padding: 0.3em;
	border-radius: 999px;
	background: #f2f4f7;
}
.dsec-opts__btn {
	flex: 1;
	padding: 0.7em 0.9em;
	border: 0;
	border-radius: 999px;
	background: transparent;
	color: var(--dsec-pick-text);
	font: inherit;
	line-height: 1.2;
	cursor: pointer;
	transition: background .15s, color .15s, box-shadow .15s;
}
.dsec-opts__btn.is-active {
	background: #fff;
	color: var(--e-global-color-primary, #101828);
	box-shadow: 0 1px 3px rgba(16, 24, 40, .12);
	font-weight: 600;
}
.dsec-opts__title { margin: 0; font-size: 1.15em; line-height: 1.3; }
.dsec-opts__addons {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 0.7em;
}
.dsec-addon {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.4em;
	padding: 0.8em 0.6em;
	border: 1px solid rgba(16, 24, 40, .08);
	border-radius: 16px;
	background: #fff;
	font: inherit;
	text-align: center;
	cursor: pointer;
	transition: border-color .15s, box-shadow .15s, transform .1s;
}
.dsec-addon:hover { transform: translateY(-1px); }
.dsec-addon__img { display: block; width: 100%; aspect-ratio: 1 / 1; }
.dsec-addon__img img { width: 100%; height: 100%; object-fit: contain; }
.dsec-addon__name { font-size: .92em; line-height: 1.3; color: var(--dsec-pick-text); }
.dsec-addon__price { font-weight: 700; }
.dsec-addon__tick {
	position: absolute;
	top: 0.5em; right: 0.5em;
	width: 1.15em; height: 1.15em;
	border-radius: 50%;
	background: var(--dsec-pick-accent);
	opacity: 0;
	transform: scale(.6);
	transition: opacity .15s, transform .15s;
}
.dsec-addon__tick::after {
	content: '';
	position: absolute;
	left: 34%; top: 16%;
	width: 25%; height: 50%;
	border: solid #fff;
	border-width: 0 2px 2px 0;
	transform: rotate(45deg);
}
.dsec-addon.is-on .dsec-addon__tick { opacity: 1; transform: scale(1); }
.dsec-cart__tmeta { display: block; margin-top: 2px; font-size: .85em; opacity: .7; }

/* ===== Payment method widget ===== */
.dsec-payw .dsec-seg { width: 100%; }

/* ===== Shared field polish =====
   Applied last so every text control the plugin renders on the front end
   reacts the same way, while each widget keeps its own Elementor overrides. */
.dsec-addr__input,
.dsec-promo__input,
.dsec-timew__sel,
.dsec-mapmodal__input,
.dsec-field__control {
	box-shadow: 0 1px 2px rgba(16, 24, 40, .04);
	transition: border-color .15s, box-shadow .15s, background .15s;
	-webkit-appearance: none;
	appearance: none;
}
.dsec-addr__input::placeholder,
.dsec-promo__input::placeholder,
.dsec-mapmodal__input::placeholder,
.dsec-field__control::placeholder { color: #98a2b3; }

.dsec-addr__input:hover,
.dsec-promo__input:hover,
.dsec-timew__sel:hover,
.dsec-mapmodal__input:hover,
.dsec-field__control:hover { border-color: rgba(16, 24, 40, .28); }

.dsec-addr__input:focus,
.dsec-promo__input:focus,
.dsec-timew__sel:focus,
.dsec-mapmodal__input:focus,
.dsec-field__control:focus {
	box-shadow: 0 0 0 0.22em color-mix(in srgb, var(--dsec-pick-accent) 20%, transparent);
}

/* Native select arrow is suppressed above, so draw our own. */
.dsec-timew__sel {
	padding-right: 2.4em;
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%23667085' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round' d='M1 1.5 6 6.5l5-5'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 0.9em center;
	cursor: pointer;
}

/* ===== Product title widget ===== */
.dsec-ptitle {
	--dsec-title-color: inherit;
	--dsec-title-transition: 200ms;
	--dsec-affix-gap: 6px;
	--dsec-anim-duration: 500ms;
	--dsec-anim-delay: 0ms;

	display: flex;
	align-items: baseline;
	flex-wrap: wrap;
	gap: var(--dsec-affix-gap);
	margin: 0;
	color: var(--dsec-title-color);
	transition: color var(--dsec-title-transition) ease;
}
.dsec-ptitle__link {
	color: inherit;
	text-decoration: none;
}
.dsec-ptitle__link:hover { color: inherit; }
.dsec-ptitle__affix {
	display: inline-flex;
	align-items: center;
	gap: 0.35em;
	line-height: 1;
}
.dsec-ptitle__affix svg { width: 1em; height: 1em; fill: currentColor; }
.dsec-ptitle__affix svg *:not([fill="none"]) { fill: currentColor; }
.dsec-ptitle__affix svg *[stroke]:not([stroke="none"]) { stroke: currentColor; }
.dsec-ptitle--empty { opacity: .7; }

/* Entrance animations. Respect a reduced-motion preference. */
@keyframes dsec-fade-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes dsec-slide-up { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }

.dsec-anim {
	animation-duration: var(--dsec-anim-duration);
	animation-delay: var(--dsec-anim-delay);
	animation-fill-mode: both;
	animation-timing-function: ease-out;
}
.dsec-anim--fade { animation-name: dsec-fade-in; }
.dsec-anim--slide { animation-name: dsec-slide-up; }

@media ( prefers-reduced-motion: reduce ) {
	.dsec-anim { animation: none; }
}

/* ===== Product price widget ===== */
.dsec-price {
	--dsec-price-gap: 10px;
	display: flex;
	align-items: baseline;
	flex-wrap: wrap;
	gap: var(--dsec-price-gap);
}
.dsec-price__current { font-weight: 700; line-height: 1.2; }
.dsec-price__old {
	text-decoration: line-through;
	opacity: .75;
	line-height: 1.2;
}
.dsec-price__badge {
	display: inline-block;
	padding: 0.15em 0.55em;
	font-size: .7em;
	font-weight: 700;
	line-height: 1.6;
	white-space: nowrap;
}
.dsec-price__affix,
.dsec-price__unit { font-size: .8em; opacity: .85; }
.dsec-price--empty { opacity: .7; }

/* A restrained pulse: enough to draw the eye, not enough to annoy. */
@keyframes dsec-price-pulse {
	0%, 100% { transform: scale(1); }
	50%      { transform: scale(1.05); }
}
.dsec-price--pulse .dsec-price__current {
	display: inline-block;
	animation: dsec-price-pulse 1.8s ease-in-out infinite;
	transform-origin: center;
}
@media ( prefers-reduced-motion: reduce ) {
	.dsec-price--pulse .dsec-price__current { animation: none; }
}

/* ===== Product image widget ===== */
.dsec-pimg {
	--dsec-img-scale: 1.08;
	--dsec-img-speed: 350ms;
	--dsec-img-overlay: 0.35;
	--dsec-badge-offset: 10px;

	position: relative;
	margin: 0;
	max-width: 100%;
}
.dsec-pimg__frame {
	position: relative;
	display: block;
	overflow: hidden;
	line-height: 0;
}
.dsec-pimg__img {
	width: 100%;
	height: 100%;
	display: block;
	object-fit: cover;
	transition: transform var(--dsec-img-speed) ease, filter var(--dsec-img-speed) ease, opacity var(--dsec-img-speed) ease;
}
.dsec-pimg__overlay {
	position: absolute;
	inset: 0;
	opacity: 0;
	pointer-events: none;
	transition: opacity var(--dsec-img-speed) ease;
}
.dsec-pimg__frame:hover .dsec-pimg__overlay { opacity: var(--dsec-img-overlay); }

/* Hover effects */
.dsec-pimg--fx-zoom .dsec-pimg__frame:hover .dsec-pimg__img { transform: scale(var(--dsec-img-scale)); }
.dsec-pimg--fx-darken .dsec-pimg__frame:hover .dsec-pimg__img { filter: brightness(.75); }
.dsec-pimg--fx-bright .dsec-pimg__frame:hover .dsec-pimg__img { filter: brightness(1.12); }
.dsec-pimg--fx-gray .dsec-pimg__img { filter: grayscale(1); }
.dsec-pimg--fx-gray .dsec-pimg__frame:hover .dsec-pimg__img { filter: grayscale(0); }

/* Second photo on hover */
.dsec-pimg__img--swap {
	position: absolute;
	inset: 0;
	opacity: 0;
}
.dsec-pimg--has-swap .dsec-pimg__frame:hover .dsec-pimg__img--swap { opacity: 1; }

/* Badges */
.dsec-pimg__badges {
	position: absolute;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 6px;
	pointer-events: none;
}
.dsec-pimg__badge {
	padding: 0.25em 0.7em;
	font-size: .8em;
	font-weight: 700;
	line-height: 1.5;
	white-space: nowrap;
}
.dsec-pimg--badge-top-start .dsec-pimg__badges { top: var(--dsec-badge-offset); inset-inline-start: var(--dsec-badge-offset); }
.dsec-pimg--badge-top-end .dsec-pimg__badges { top: var(--dsec-badge-offset); inset-inline-end: var(--dsec-badge-offset); align-items: flex-end; }
.dsec-pimg--badge-bottom-start .dsec-pimg__badges { bottom: var(--dsec-badge-offset); inset-inline-start: var(--dsec-badge-offset); }
.dsec-pimg--badge-bottom-end .dsec-pimg__badges { bottom: var(--dsec-badge-offset); inset-inline-end: var(--dsec-badge-offset); align-items: flex-end; }

.dsec-pimg__caption { line-height: 1.4; }
.dsec-pimg--empty { opacity: .7; }

@media ( prefers-reduced-motion: reduce ) {
	.dsec-pimg__img, .dsec-pimg__overlay { transition: none; }
}

/* ===== Product gallery widget ===== */
.dsec-gallery {
	--dsec-gal-gap: 10px;
	--dsec-gal-radius: 14px;
	--dsec-gal-ratio: 1/1;
	--dsec-gal-speed: 400ms;
	--dsec-thumb-size: 80px;
	--dsec-thumb-dim: 0.6;
	--dsec-thumb-active: #2f6bff;
	--dsec-thumb-border: 2px;
	--dsec-arrow-size: 40px;
	--dsec-dot: rgba(16, 24, 40, .25);
	--dsec-dot-active: #2f6bff;

	position: relative;
}
.dsec-gallery__cell {
	display: block;
	overflow: hidden;
	border-radius: var(--dsec-gal-radius);
	line-height: 0;
	aspect-ratio: var(--dsec-gal-ratio);
	background: rgba(16, 24, 40, .04);
}
.dsec-gallery img { width: 100%; height: 100%; object-fit: cover; display: block; }
.dsec-gallery--empty { opacity: .7; }

/* Grid */
.dsec-gallery__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--dsec-gal-gap);
}

/* Slider */
.dsec-gallery__viewport { position: relative; overflow: hidden; border-radius: var(--dsec-gal-radius); }
.dsec-gallery__track { display: flex; transition: transform var(--dsec-gal-speed) ease; }
.dsec-gallery--slider .dsec-gallery__cell { flex: 0 0 100%; border-radius: 0; }

.dsec-gallery--fx-fade .dsec-gallery__track,
.dsec-gallery--fx-none .dsec-gallery__track { display: block; position: relative; transform: none !important; }
.dsec-gallery--fx-fade .dsec-gallery__cell,
.dsec-gallery--fx-none .dsec-gallery__cell {
	position: absolute;
	inset: 0;
	opacity: 0;
	pointer-events: none;
}
.dsec-gallery--fx-fade .dsec-gallery__cell { transition: opacity var(--dsec-gal-speed) ease; }
.dsec-gallery--fx-fade .dsec-gallery__cell.is-active,
.dsec-gallery--fx-none .dsec-gallery__cell.is-active { opacity: 1; pointer-events: auto; position: relative; }

.dsec-gallery__arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: var(--dsec-arrow-size);
	height: var(--dsec-arrow-size);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: 0;
	border-radius: 50%;
	box-shadow: 0 2px 10px rgba(16, 24, 40, .18);
	font-size: calc(var(--dsec-arrow-size) * .55);
	line-height: 1;
	cursor: pointer;
	z-index: 2;
}
.dsec-gallery__arrow--prev { inset-inline-start: 10px; }
.dsec-gallery__arrow--next { inset-inline-end: 10px; }
.dsec-gallery__arrow:disabled { opacity: .35; cursor: default; }

.dsec-gallery__dots {
	display: flex;
	justify-content: center;
	gap: 8px;
	margin-top: var(--dsec-gal-gap);
}
.dsec-gallery__dot {
	width: 8px;
	height: 8px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: var(--dsec-dot);
	cursor: pointer;
	transition: background .15s, transform .15s;
}
.dsec-gallery__dot.is-active { background: var(--dsec-dot-active); transform: scale(1.3); }

/* Main image + thumbnails */
.dsec-gallery--thumbs { display: flex; gap: var(--dsec-gal-gap); }
.dsec-gallery--thumbs-bottom { flex-direction: column; }
.dsec-gallery--thumbs-start { flex-direction: row-reverse; }
.dsec-gallery--thumbs-end { flex-direction: row; }

.dsec-gallery__main { position: relative; flex: 1 1 auto; min-width: 0; }
.dsec-gallery__main .dsec-gallery__cell { display: none; }
.dsec-gallery__main .dsec-gallery__cell.is-active { display: block; }

.dsec-gallery__thumbs { display: flex; gap: var(--dsec-gal-gap); flex-wrap: wrap; }
.dsec-gallery--thumbs-start .dsec-gallery__thumbs,
.dsec-gallery--thumbs-end .dsec-gallery__thumbs {
	flex-direction: column;
	flex: 0 0 var(--dsec-thumb-size);
	flex-wrap: nowrap;
	overflow-y: auto;
}
.dsec-gallery__thumb {
	width: var(--dsec-thumb-size);
	height: var(--dsec-thumb-size);
	padding: 0;
	border: var(--dsec-thumb-border) solid transparent;
	background: none;
	overflow: hidden;
	cursor: pointer;
	opacity: var(--dsec-thumb-dim);
	transition: opacity .15s, border-color .15s;
	line-height: 0;
	flex: 0 0 auto;
}
.dsec-gallery__thumb:hover { opacity: 1; }
.dsec-gallery__thumb.is-active { opacity: 1; border-color: var(--dsec-thumb-active); }

@media ( prefers-reduced-motion: reduce ) {
	.dsec-gallery__track, .dsec-gallery__cell { transition: none; }
}

/* ===== Product variations widget ===== */
.dsec-var {
	--dsec-var-gap: 18px;
	--dsec-swatch-size: 36px;
	--dsec-swatch-color: #e6eaf0;

	display: flex;
	flex-direction: column;
	gap: var(--dsec-var-gap);
}
.dsec-var--empty { opacity: .7; }
.dsec-var__title { margin: 0; font-size: 1.05em; line-height: 1.3; }
.dsec-var__options { display: flex; flex-wrap: wrap; gap: 8px; }

.dsec-var__btn {
	position: relative;
	border: 1px solid rgba(16, 24, 40, .14);
	background: transparent;
	font: inherit;
	line-height: 1.2;
	cursor: pointer;
	transition: border-color .15s, background .15s, color .15s, box-shadow .15s, opacity .15s;
}
.dsec-var__btn--text { padding: 0.6em 1.1em; }
.dsec-var__btn--swatch {
	width: var(--dsec-swatch-size);
	height: var(--dsec-swatch-size);
	padding: 0;
	border-radius: 50%;
	background: var(--dsec-swatch-color);
	background-clip: padding-box;
}
.dsec-var__btn--swatch.is-active { box-shadow: 0 0 0 2px #fff inset; }

/* Unavailable variants stay visible but clearly struck out. */
.dsec-var__btn.is-out {
	opacity: .45;
	cursor: not-allowed;
	text-decoration: line-through;
}
.dsec-var__btn--swatch.is-out {
	text-decoration: none;
	background-image: linear-gradient(
		to top left,
		transparent calc(50% - 1px),
		rgba(180, 35, 24, .9) 50%,
		transparent calc(50% + 1px)
	);
}
.dsec-var__sr {
	position: absolute;
	width: 1px; height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

.dsec-var__select {
	width: 100%;
	padding: 0.75em 2.4em 0.75em 0.9em;
	border: 1px solid var(--dsec-pick-line);
	border-radius: 0.65em;
	background-color: #fff;
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%23667085' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round' d='M1 1.5 6 6.5l5-5'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 0.9em center;
	font: inherit;
	-webkit-appearance: none;
	appearance: none;
	cursor: pointer;
}

.dsec-var__stock { margin: 0; font-size: .92em; }
.dsec-var__stock:empty { display: none; }

.dsec-var__reset {
	align-self: flex-start;
	padding: 0;
	border: 0;
	background: none;
	font: inherit;
	font-size: .9em;
	color: var(--dsec-pick-text);
	text-decoration: underline;
	cursor: pointer;
}

/* Add-on cards */
.dsec-var__addons { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.dsec-var__addon {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.4em;
	padding: 0.8em 0.6em;
	border: 1px solid rgba(16, 24, 40, .08);
	background: #fff;
	font: inherit;
	text-align: center;
	cursor: pointer;
	transition: border-color .15s, box-shadow .15s, transform .1s;
}
.dsec-var__addon:hover { transform: translateY(-1px); }
.dsec-var__addon-img { display: block; width: 100%; aspect-ratio: 1 / 1; }
.dsec-var__addon-img img { width: 100%; height: 100%; object-fit: contain; }
.dsec-var__addon-name { font-size: .92em; line-height: 1.3; }
.dsec-var__addon-price { font-weight: 700; }
.dsec-var__tick {
	position: absolute;
	top: 0.5em;
	inset-inline-end: 0.5em;
	width: 1.15em;
	height: 1.15em;
	border-radius: 50%;
	background: var(--dsec-pick-accent);
	opacity: 0;
	transform: scale(.6);
	transition: opacity .15s, transform .15s;
}
.dsec-var__tick::after {
	content: '';
	position: absolute;
	left: 34%; top: 16%;
	width: 25%; height: 50%;
	border: solid #fff;
	border-width: 0 2px 2px 0;
	transform: rotate(45deg);
}
.dsec-var__addon.is-on .dsec-var__tick { opacity: 1; transform: scale(1); }

@media ( prefers-reduced-motion: reduce ) {
	.dsec-var__btn, .dsec-var__addon, .dsec-var__tick { transition: none; }
}

/* ===== Variations: segmented view =====
   One continuous track with the selected option lifted out of it, the pattern
   food delivery apps use for sizes and dough types. */
.dsec-var--segmented .dsec-var__options {
	display: flex;
	flex-wrap: nowrap;
	gap: 4px;
	padding: 5px;
	border-radius: 999px;
	background: #f2f4f7;
	width: 100%;
}
.dsec-var__btn--seg {
	flex: 1 1 0;
	min-width: 0;
	padding: 0.7em 1em;
	border: 0;
	border-radius: 999px;
	background: transparent;
	text-align: center;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.dsec-var__btn--seg.is-active {
	background: #fff;
	font-weight: 600;
	box-shadow: 0 1px 4px rgba(16, 24, 40, .14);
}
.dsec-var__btn--seg.is-out {
	opacity: .4;
	text-decoration: line-through;
}

/* On narrow screens a long list should wrap instead of squeezing. */
@media ( max-width: 480px ) {
	.dsec-var--segmented .dsec-var__options { flex-wrap: wrap; }
	.dsec-var__btn--seg { flex: 1 1 40%; }
}

/* ===== Add to cart widget ===== */
.dsec-atc {
	display: flex;
	flex-direction: column;
	gap: 8px;
}
/* Quantity and button share one row; wrapping is off so a full-width button
   cannot push the stepper onto a line of its own. */
.dsec-atc__row {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: nowrap;
}
.dsec-atc--empty { opacity: .7; }

.dsec-atc__btn {
	--dsec-atc-pad-top: 14px;
	--dsec-atc-pad-bottom: 14px;
	flex: 1 1 auto;
	min-width: 0;
	box-sizing: border-box;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 14px;
	height: calc(1em + var(--dsec-atc-pad-top) + var(--dsec-atc-pad-bottom));
	height: calc(1lh + var(--dsec-atc-pad-top) + var(--dsec-atc-pad-bottom));
	border: 0;
	border-radius: 999px;
	background: var(--dsec-pick-accent);
	color: #fff;
	font: inherit;
	font-weight: 600;
	line-height: 1.2;
	cursor: pointer;
	transition: background .15s, color .15s, transform .15s, box-shadow .15s;
}
.dsec-atc__btn:disabled { cursor: not-allowed; transform: none; }
.dsec-atc__ic { display: inline-flex; align-items: center; }
.dsec-atc__ic svg { width: 1.1em; height: 1.1em; fill: currentColor; }
.dsec-atc__ic svg *:not([fill="none"]) { fill: currentColor; }
.dsec-atc__ic svg *[stroke]:not([stroke="none"]) { stroke: currentColor; }

/* Quantity */
.dsec-atc__qty {
	--dsec-atc-pad-top: 14px;
	--dsec-atc-pad-bottom: 14px;
	display: inline-flex;
	align-items: center;
	justify-content: space-between;
	box-sizing: border-box;
	padding: 14px;
	height: calc(1em + var(--dsec-atc-pad-top) + var(--dsec-atc-pad-bottom));
	height: calc(1lh + var(--dsec-atc-pad-top) + var(--dsec-atc-pad-bottom));
	border: 1px solid rgba(16, 24, 40, .14);
	border-radius: 999px;
	background: #fff;
	font: inherit;
	line-height: 1;
	text-align: center;
	flex: 0 0 auto;
}
input.dsec-atc__qty { padding: 0 12px; -moz-appearance: textfield; }
input.dsec-atc__qty::-webkit-outer-spin-button,
input.dsec-atc__qty::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

.dsec-atc__qbtn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 0;
	min-height: 0;
	padding: 0 0.7em;
	box-sizing: border-box;
	border: 0;
	border-radius: 50%;
	background: transparent;
	font: inherit;
	font-size: 1.1em;
	line-height: 1;
	cursor: pointer;
	color: inherit;
}
.dsec-atc__qbtn:hover { background: rgba(16, 24, 40, .06); }
.dsec-atc__qnum {
	width: 40px;
	border: 0;
	background: none;
	font: inherit;
	text-align: center;
	color: inherit;
}
.dsec-atc__qnum:focus { outline: none; }

.dsec-atc__msg { width: 100%; }
.dsec-atc__msg:empty { display: none; }

@media ( prefers-reduced-motion: reduce ) {
	.dsec-atc__btn { transition: none; }
}

/* ===== Cart summary widget ===== */
.dsec-sum { display: flex; flex-direction: column; gap: 18px; }

.dsec-sum__ot {
	display: flex;
	border: 1px solid var(--dsec-pick-accent);
	border-radius: 10px;
	overflow: hidden;
}
.dsec-sum__ot-btn {
	flex: 1 1 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 0.85em 1em;
	border: 0;
	background: transparent;
	font: inherit;
	line-height: 1.2;
	cursor: pointer;
	transition: background .15s, color .15s;
}
.dsec-sum__ot-ic { display: inline-flex; align-items: center; }
.dsec-sum__ot-ic svg { width: 1.1em; height: 1.1em; fill: currentColor; }
.dsec-sum__ot-btn.is-active { background: var(--dsec-pick-accent); color: #fff; }

.dsec-sum__rows { display: flex; flex-direction: column; gap: 12px; }
.dsec-sum__row { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.dsec-sum__row[hidden] { display: none; }
.dsec-sum__row--total {
	padding-top: 12px;
	border-top: 1px solid rgba(16, 24, 40, .10);
	font-weight: 700;
}
.dsec-sum__row--discount span:last-child { color: #067647; }

.dsec-sum__btn {
	width: 100%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 0.9em 1.4em;
	border: 0;
	border-radius: 10px;
	background: var(--dsec-pick-accent);
	color: #fff;
	font: inherit;
	font-weight: 600;
	cursor: pointer;
	transition: background .15s, opacity .15s;
}
.dsec-sum__btn:disabled { opacity: .6; cursor: not-allowed; }
.dsec-sum__ic { display: inline-flex; align-items: center; }
.dsec-sum__ic svg { width: 1.1em; height: 1.1em; fill: currentColor; }
.dsec-sum__ic svg *:not([fill="none"]) { fill: currentColor; }
.dsec-sum__ic svg *[stroke]:not([stroke="none"]) { stroke: currentColor; }
.dsec-sum__msg { margin-top: 8px; }
.dsec-sum__msg:empty { display: none; }

/* Items widget: empty state and header toggle */
.dsec-cart__empty { margin: 0; padding: 24px 0; text-align: center; opacity: .7; }
.dsec-items-widget--nohead .dsec-cart__th { display: none; }

@media ( prefers-reduced-motion: reduce ) {
	.dsec-sum__ot-btn, .dsec-sum__btn { transition: none; }
}

/* ===== Delivery map widget ===== */
.dsec-mapw {
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.dsec-mapw__hint { margin: 0; }
.dsec-mapw .dsec-map {
	width: 100%;
	min-height: 160px;
	overflow: hidden;
}
/* Yandex injects its own copyright block; keep it inside the rounded frame. */
.dsec-mapw .dsec-map .ymaps-2-1-79-map,
.dsec-mapw .dsec-map ymaps { border-radius: inherit; }

/* ===== Confirm address button ===== */
.dsec-confirm { display: flex; flex-direction: column; gap: 6px; }
.dsec-confirm__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 100%;
	padding: 0.8em 1.4em;
	border: 0;
	border-radius: 0.65em;
	background: var(--dsec-pick-accent);
	color: var(--e-global-color-primary, #fff);
	font: inherit;
	font-weight: 600;
	cursor: pointer;
	transition: background .15s, opacity .15s;
}
.dsec-confirm__btn:disabled,
.dsec-confirm__btn.is-disabled { opacity: .5; cursor: not-allowed; }
.dsec-confirm__ic { display: inline-flex; align-items: center; }
.dsec-confirm__ic svg { width: 1.1em; height: 1.1em; fill: currentColor; }
.dsec-confirm__ic svg *:not([fill="none"]) { fill: currentColor; }
.dsec-confirm__ic svg *[stroke]:not([stroke="none"]) { stroke: currentColor; }
.dsec-confirm__msg { font-size: .92em; line-height: 1.4; }
.dsec-confirm__msg:empty { display: none; }
.dsec-confirm__msg.is-ok { color: #067647; }
.dsec-confirm__msg.is-error { color: #b42318; }

@media ( prefers-reduced-motion: reduce ) {
	.dsec-confirm__btn { transition: none; }
}

/* ===== Order fields widget ===== */
.dsec-fields {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}
.dsec-field {
	--dsec-label-gap: 6px;
	display: flex;
	flex-direction: column;
	gap: var(--dsec-label-gap);
	min-width: 0;
}
.dsec-field[hidden] { display: none; }
.dsec-field--w100 { flex: 1 1 100%; }
.dsec-field--w50 { flex: 1 1 calc(50% - 6px); }
.dsec-field--w33 { flex: 1 1 calc(33.333% - 8px); }

.dsec-field__label { line-height: 1.3; }
.dsec-field__mark { font-weight: 700; }

.dsec-field__wrap { position: relative; display: block; }
.dsec-field__control {
	width: 100%;
	box-sizing: border-box;
	padding: 0.75em 0.9em;
	border: 1px solid rgba(16, 24, 40, .14);
	border-radius: 10px;
	background: #fff;
	font: inherit;
	line-height: 1.35;
	transition: border-color .15s, box-shadow .15s;
	-webkit-appearance: none;
	appearance: none;
}
.dsec-field__control:focus { outline: none; }
textarea.dsec-field__control { min-height: 96px; resize: vertical; }
.dsec-field__control[type="number"] { -moz-appearance: textfield; }

/* Icon sits inside the field, so the text needs room for it. */
.dsec-field__ic {
	position: absolute;
	top: 50%;
	inset-inline-start: 0.8em;
	transform: translateY(-50%);
	display: inline-flex;
	align-items: center;
	pointer-events: none;
	opacity: .65;
}
.dsec-field__ic svg { width: 1.1em; height: 1.1em; fill: currentColor; }
.dsec-field__ic svg *:not([fill="none"]) { fill: currentColor; }
.dsec-field__ic svg *[stroke]:not([stroke="none"]) { stroke: currentColor; }
.dsec-field__wrap.has-icon .dsec-field__control { padding-inline-start: 2.6em; }
.dsec-field__wrap.has-icon textarea.dsec-field__control { padding-inline-start: 0.9em; }

@media ( max-width: 480px ) {
	.dsec-field--w50,
	.dsec-field--w33 { flex: 1 1 100%; }
}
@media ( prefers-reduced-motion: reduce ) {
	.dsec-field__control { transition: none; }
}

/* ===== Add to cart: quantity placement and the confirmation icon ===== */
/* Elementor writes flex-direction into its own stylesheet, so the stacked
   layouts are handled by the "stretch" control rather than by sniffing an
   inline style that is never there. */
.dsec-atc__row { align-items: center; }

/* Both icons are in the markup; only one is visible at a time. */
/* Only one icon is visible at a time; qualified so ordering cannot break it. */
/* Three icons live in the markup; exactly one is shown at a time. The rules are
   qualified so a later single-class rule cannot undo the swap. */
.dsec-atc__btn .dsec-atc__ic--added,
.dsec-atc__btn .dsec-atc__ic--out { display: none; }

.dsec-atc__btn.is-added .dsec-atc__ic--idle { display: none; }
.dsec-atc__btn.is-added .dsec-atc__ic--added { display: inline-flex; }

/* Out of stock wins over the confirmation state: a disabled button never
   reaches it anyway. The usual icon is only hidden when a replacement was
   actually chosen, otherwise the button would lose its icon entirely. */
.dsec-atc__btn:disabled .dsec-atc__ic--added,
.dsec-atc__btn.is-out .dsec-atc__ic--added { display: none; }

.dsec-atc__btn:disabled:has(.dsec-atc__ic--out) .dsec-atc__ic--idle,
.dsec-atc__btn.is-out:has(.dsec-atc__ic--out) .dsec-atc__ic--idle { display: none; }

.dsec-atc__btn:disabled .dsec-atc__ic--out,
.dsec-atc__btn.is-out .dsec-atc__ic--out { display: inline-flex; }

/* ===== Click-to-add trigger on any element ===== */
.dsec-click-add { position: relative; }
.dsec-click-add:focus-visible {
	outline: 2px solid var(--dsec-pick-accent);
	outline-offset: 2px;
}
/* Mobile browsers paint their own grey overlay on anything tappable; on a whole
   card that reads as a stuck background. */
.dsec-click-add { -webkit-tap-highlight-color: transparent; }

/* Optional flash. Uses its own colour rather than currentColor, which turned
   into a dull grey wash on dark text, and fades out completely. */
.dsec-click-add.is-flash::after {
	content: '';
	position: absolute;
	inset: 0;
	background: var(--dsec-flash-color, rgba(47, 107, 255, .18));
	pointer-events: none;
	border-radius: inherit;
	animation: dsec-flash .45s ease-out forwards;
}
@keyframes dsec-flash {
	from { opacity: 1; }
	to   { opacity: 0; }
}
@media ( prefers-reduced-motion: reduce ) {
	.dsec-click-add.is-flash::after { animation: none; opacity: 0; }
}

/* Icon-only button: no label, so the icon should not be pushed off-centre. */
.dsec-atc__btn:not(:has(.dsec-atc__label)) { gap: 0; }

/* Quantity that appears only once the item is in the cart. */
.dsec-atc__qty--after[hidden] { display: none; }
.dsec-atc__qty--after .dsec-atc__qnum {
	min-width: 2ch;
	text-align: center;
}

/* Stepper that takes the button's place once the item is in the cart. */
.dsec-atc__btn[hidden] { display: none; }
.dsec-atc--qty-replace .dsec-atc__qty--after { flex: 1 1 auto; width: 100%; }

/* Vertical centring inside the button.
   The label is an inline span and the icon an inline-flex box, so the two sat
   on different baselines and the text drifted off centre. Giving both the same
   flex treatment and a neutral line height lines them up. */
.dsec-atc__label {
	display: inline-flex;
	align-items: center;
	/* A line box taller than the glyphs is what pushes text off centre in fonts
	   with uneven vertical metrics, so keep it tight and let padding do the
	   spacing. */
	line-height: 1;
}
/* Alignment only — declaring display here would override the icon swap below. */
.dsec-atc__ic { align-items: center; line-height: 1; }
.dsec-atc__btn { align-content: center; line-height: 1; }

/* ===== Optical centring of button text =====
   With line-height 1 the line box is one em tall, but the glyphs hang from the
   baseline: capitals occupy the upper part while the descender space below
   stays empty, so the text reads as sitting high. text-box-trim removes that
   empty space — and it has to be declared on the element that actually holds
   the text, not on the flex container around it. */
.dsec-atc__label,
.dsec-sum__btn > span,
.dsec-payw__btn > span,
.dsec-time__mode-btn,
.dsec-var__btn--text,
.dsec-var__btn--seg,
.dsec-promo__btn,
.dsec-clear__btn > span,
.dsec-cartbtn__label {
	text-box-trim: trim-both;
	text-box-edge: cap alphabetic;
}

/* Browsers without text-box-trim: nudge the text down by half the descender,
   which is what the trim would have removed. */
@supports not (text-box-trim: trim-both) {
	.dsec-atc__label,
	.dsec-sum__btn > span,
	.dsec-payw__btn > span,
	.dsec-time__mode-btn,
	.dsec-var__btn--text,
	.dsec-var__btn--seg,
	.dsec-promo__btn,
	.dsec-clear__btn > span,
	.dsec-cartbtn__label {
		transform: translateY(0.055em);
	}
}

/* ===== Cart button (header indicator) ===== */
.dsec-cartbtn {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	border: 0;
	background: none;
	font: inherit;
	color: inherit;
	text-decoration: none;
	cursor: pointer;
	line-height: 1;
}
.dsec-cartbtn[hidden] { display: none; }
.dsec-cartbtn__ic { display: inline-flex; align-items: center; }
.dsec-cartbtn__ic svg { width: 1.5em; height: 1.5em; fill: currentColor; }
.dsec-cartbtn__ic svg *:not([fill="none"]) { fill: currentColor; }
.dsec-cartbtn__ic svg *[stroke]:not([stroke="none"]) { stroke: currentColor; }
.dsec-cartbtn__count {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 18px;
	min-height: 18px;
	padding: 0 5px;
	box-sizing: border-box;
	font-size: .72em;
	font-weight: 700;
	line-height: 1;
}
/* Badge sitting on the icon rather than in the row. */
.dsec-cartbtn--badge-corner .dsec-cartbtn__count {
	position: absolute;
	top: -0.35em;
	inset-inline-start: 1em;
}
.dsec-cartbtn__total { white-space: nowrap; }

/* ===== Promo, payment and delivery time ===== */
.dsec-promo { display: flex; flex-direction: column; gap: 8px; }
.dsec-promo__title { font-weight: 600; }

.dsec-payw,
.dsec-time { display: flex; flex-direction: column; gap: 8px; }
.dsec-payw__title,
.dsec-time__title { font-weight: 600; }

.dsec-payw__row,
.dsec-time__mode {
	display: flex;
	gap: 8px;
	padding: 4px;
	border-radius: 999px;
	background: rgba(16, 24, 40, .05);
}
.dsec-payw__btn,
.dsec-time__mode-btn {
	flex: 1 1 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 0.6em 1em;
	border: 0;
	border-radius: 999px;
	background: transparent;
	font: inherit;
	line-height: 1;
	cursor: pointer;
	transition: background .15s, color .15s;
}
.dsec-payw__ic { display: inline-flex; align-items: center; }
.dsec-payw__ic svg { width: 1.1em; height: 1.1em; fill: currentColor; }
.dsec-payw__ic svg *:not([fill="none"]) { fill: currentColor; }
.dsec-payw__ic svg *[stroke]:not([stroke="none"]) { stroke: currentColor; }

.dsec-time__pick { display: flex; gap: 8px; flex-wrap: wrap; }
.dsec-time__pick[hidden] { display: none; }
.dsec-time__select {
	flex: 1 1 140px;
	padding: 0.6em 2.2em 0.6em 0.9em;
	border: 1px solid rgba(16, 24, 40, .14);
	border-radius: 10px;
	background-color: #fff;
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%23667085' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round' d='M1 1.5 6 6.5l5-5'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 0.8em center;
	font: inherit;
	-webkit-appearance: none;
	appearance: none;
	cursor: pointer;
}
.dsec-time__notice { margin: 0; font-size: .92em; }
.dsec-time__notice:empty { display: none; }

@media ( prefers-reduced-motion: reduce ) {
	.dsec-payw__btn, .dsec-time__mode-btn { transition: none; }
}

/* Clear cart */
.dsec-clear { display: flex; flex-direction: column; }
.dsec-clear[hidden] { display: none; }
.dsec-clear__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	padding: 0.5em 0.9em;
	border: 0;
	background: none;
	font: inherit;
	cursor: pointer;
}
.dsec-clear__ic { display: inline-flex; align-items: center; }
.dsec-clear__ic svg { width: 1em; height: 1em; fill: currentColor; }
.dsec-clear__ic svg *:not([fill="none"]) { fill: currentColor; }
.dsec-clear__ic svg *[stroke]:not([stroke="none"]) { stroke: currentColor; }

/* Icon inside the cart button: its own box so a background, size and radius
   from the panel have something to apply to. */
.dsec-atc__ic {
	flex: 0 0 auto;
	transition: color .15s, background .15s;
}
.dsec-atc__ic svg { transition: fill .15s; }

@media ( prefers-reduced-motion: reduce ) {
	.dsec-atc__ic, .dsec-atc__ic svg { transition: none; }
}

/* "Not me" reset for remembered details */
.dsec-fields__forget {
	align-self: flex-start;
	padding: 0;
	border: 0;
	background: none;
	font: inherit;
	font-size: .9em;
	color: inherit;
	opacity: .7;
	text-decoration: underline;
	cursor: pointer;
}
.dsec-fields__forget[hidden] { display: none; }
.dsec-fields__forget:hover { opacity: 1; }

/* ===== Order minimum progress ===== */
.dsec-min { display: flex; flex-direction: column; gap: 8px; }
.dsec-min[hidden] { display: none; }
.dsec-min__text { margin: 0; line-height: 1.4; }
.dsec-min__text:empty { display: none; }
.dsec-min__bar {
	position: relative;
	height: 8px;
	border-radius: 999px;
	background: rgba(16, 24, 40, .10);
	overflow: hidden;
}
.dsec-min__fill {
	display: block;
	height: 100%;
	width: 0;
	border-radius: 999px;
	background: var(--dsec-pick-accent);
	transition: width .25s ease, background .2s ease;
}
@media ( prefers-reduced-motion: reduce ) {
	.dsec-min__fill { transition: none; }
}