/* =========================================================================
   Fooppers Quick PDP — Delivery check card (v2.8.0)
   Booking-template look: white surface, flat red, hairline greys.
   Everything is scoped to .fqp-dc / .fqp-dc-sheet so the theme can't
   repaint it and it can't leak out.
   ========================================================================= */

.fqp-dc,
.fqp-dc-sheet {
	--dc-red: #D6312B;
	--dc-red-dk: #A8221D;
	--dc-red-wash: #FFF5F4;
	--dc-ink: #2B2B2B;
	--dc-ink-2: #555;
	--dc-muted: #8D8D8D;
	--dc-line: #ECECEC;
	--dc-soft: #F6F6F6;
	--dc-ok: #1F8A4C;
	font-family: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	color: var(--dc-ink);
	-webkit-tap-highlight-color: transparent;
}

.fqp-dc *,
.fqp-dc-sheet * {
	box-sizing: border-box;
}

.fqp-dc svg,
.fqp-dc-sheet svg {
	fill: none;
	stroke: currentColor;
	stroke-width: 1.8;
	stroke-linecap: round;
	stroke-linejoin: round;
	display: block;
}

.fqp-dc button,
.fqp-dc-sheet button {
	font-family: inherit;
	-webkit-appearance: none;
	appearance: none;
	margin: 0;
	text-transform: none;
	letter-spacing: normal;
	box-shadow: none;
	min-height: 0;
	line-height: 1.2;
}

/* ── Card ────────────────────────────────────────────────────────────── */

.fqp-dc {
	background: #fff;
	margin: 0 10px var(--fqp-gap, 12px);
	padding: 16px 16px 14px;
	border-radius: 14px;
	border: 1px solid var(--dc-line);
}

.fqp-dc-head {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 12px;
}

.fqp-dc .fqp-dc-title,
.fqp-dc-sheet .fqp-dc-title {
	margin: 0 !important;
	padding: 0;
	font-family: inherit !important;
	font-size: 15px !important;
	line-height: 1.2 !important;
	font-weight: 700 !important;
	letter-spacing: .03em !important;
	text-transform: uppercase;
	color: var(--dc-red) !important;
}

.fqp-dc-sub {
	margin: 3px 0 0 !important;
	font-size: 11.5px;
	line-height: 1.3;
	color: var(--dc-muted);
}

.fqp-dc button.fqp-dc-icon,
.fqp-dc-sheet button.fqp-dc-icon {
	flex: none;
	width: 32px;
	height: 32px;
	margin: -6px -6px 0 0;
	padding: 7px;
	border: 0 !important;
	border-radius: 50%;
	background: transparent !important;
	color: #6b6b6b !important;
	cursor: pointer;
}

.fqp-dc button.fqp-dc-icon:active,
.fqp-dc-sheet button.fqp-dc-icon:active {
	background: var(--dc-soft) !important;
}

.fqp-dc-icon svg {
	width: 18px;
	height: 18px;
}

.fqp-dc-icon.is-spin svg {
	animation: fqp-dc-spin .7s linear infinite;
}

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

/* Location row */
.fqp-dc button.fqp-dc-loc {
	display: flex;
	align-items: center;
	gap: 8px;
	width: 100%;
	margin-top: 12px;
	padding: 10px 0;
	border: 0 !important;
	border-bottom: 1px solid var(--dc-line) !important;
	border-radius: 0;
	background: transparent !important;
	color: var(--dc-ink) !important;
	text-align: left;
	cursor: pointer;
}

.fqp-dc-loc-pin {
	width: 18px;
	height: 18px;
	flex: none;
	color: var(--dc-red);
}

.fqp-dc-loc-text {
	flex: 1;
	min-width: 0;
	font-size: 13px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.fqp-dc-loc-text b {
	font-weight: 600;
}

.fqp-dc-loc-text span {
	font-size: 12px;
	color: var(--dc-muted);
}

.fqp-dc-loc-text--empty {
	color: var(--dc-red);
	font-weight: 600;
}

.fqp-dc-change {
	flex: none;
	font-size: 12px;
	font-weight: 600;
	color: var(--dc-red);
	text-decoration: underline;
	text-underline-offset: 2px;
}

.fqp-dc-chev {
	width: 16px;
	height: 16px;
	color: var(--dc-red);
	flex: none;
}

/* Availability box */
.fqp-dc-av {
	margin-top: 14px;
	border: 1px solid var(--dc-line);
	border-radius: 8px;
	overflow: hidden;
	animation: fqp-dc-in .28s ease both;
}

@keyframes fqp-dc-in {
	from { opacity: 0; transform: translateY(4px); }
	to   { opacity: 1; transform: none; }
}

.fqp-dc-avh {
	display: flex;
	align-items: center;
	gap: 11px;
	padding: 12px;
}

.fqp-dc-avh > div {
	flex: 1;
	min-width: 0;
}

.fqp-dc-avh b {
	display: block;
	font-size: 13.5px;
	font-weight: 600;
	line-height: 1.25;
}

.fqp-dc-avh small {
	display: block;
	margin-top: 1px;
	font-size: 11px;
	color: var(--dc-muted);
}

.fqp-dc-dot {
	flex: none;
	display: grid;
	place-items: center;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	color: #fff;
	background: var(--dc-muted);
}

.fqp-dc-dot svg {
	width: 15px;
	height: 15px;
	stroke-width: 2.6;
}

.fqp-dc-av--ok .fqp-dc-dot { background: var(--dc-ok); }
.fqp-dc-av--wait .fqp-dc-dot { background: var(--dc-red); }
.fqp-dc-av--no .fqp-dc-dot { background: #9A9A9A; }
.fqp-dc-av--ask .fqp-dc-dot { background: var(--dc-red-wash); color: var(--dc-red); }
.fqp-dc-av--ask .fqp-dc-dot svg { stroke-width: 2; }

.fqp-dc button.fqp-dc-check {
	flex: none;
	height: 32px;
	padding: 0 16px;
	border: 1px solid var(--dc-red) !important;
	border-radius: 4px;
	background: #fff !important;
	color: var(--dc-red) !important;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .04em;
	text-transform: uppercase;
	cursor: pointer;
}

.fqp-dc-row {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 10px 12px;
	border-top: 1px solid var(--dc-line);
	font-size: 12.5px;
}

.fqp-dc-row svg {
	width: 16px;
	height: 16px;
	flex: none;
	color: #9a9a9a;
}

.fqp-dc-k {
	flex: none;
	width: 92px;
	color: #777;
}

.fqp-dc-v {
	min-width: 0;
	font-weight: 600;
}

.fqp-dc-v i {
	margin-left: 6px;
	font-style: normal;
	font-weight: 500;
	font-size: 11.5px;
	color: var(--dc-ok);
}

/* Notice — red rule on the left, like the booking template */
.fqp-dc-note {
	margin: 14px 0 0 !important;
	padding: 11px 13px;
	border-left: 3px solid var(--dc-red);
	background: var(--dc-red-wash);
	font-size: 12.5px;
	line-height: 1.5;
	color: #444;
}

.fqp-dc-note b {
	font-weight: 600;
	color: var(--dc-red);
}

.fqp-dc-note--muted {
	border-left-color: #9A9A9A;
	background: var(--dc-soft);
}

.fqp-dc-note--muted b {
	color: var(--dc-ink);
}

.fqp-dc button.fqp-dc-link {
	padding: 0;
	border: 0 !important;
	background: none !important;
	color: var(--dc-red) !important;
	font-weight: 600;
	text-decoration: underline;
	cursor: pointer;
}

.fqp-dc-est {
	margin: 9px 0 0 !important;
	font-size: 10.5px;
	color: #A0A0A0;
}

/* Loading skeleton */
.fqp-dc-skel {
	margin-top: 12px;
}

.fqp-dc-skel i {
	display: block;
	height: 12px;
	margin-top: 10px;
	border-radius: 4px;
	background: linear-gradient(90deg, #f1f1f1 25%, #f8f8f8 50%, #f1f1f1 75%) 0 0 / 200% 100%;
	animation: fqp-dc-sh 1.2s linear infinite;
}

.fqp-dc-skel i:nth-child(1) { width: 62%; height: 16px; }
.fqp-dc-skel i:nth-child(2) { height: 52px; border-radius: 8px; }
.fqp-dc-skel i:nth-child(3) { width: 84%; }

@keyframes fqp-dc-sh {
	to { background-position: -200% 0; }
}

.fqp-dc-shake {
	animation: fqp-dc-shake .42s ease;
}

@keyframes fqp-dc-shake {
	20%, 60% { transform: translateX(-5px); }
	40%, 80% { transform: translateX(5px); }
}

/* Add to cart locked */
.fqp-dc-blocked #fqp-buy .fqa-atc,
.fqp-dc-blocked #fqp-bar .fqa-atc {
	filter: grayscale(1);
	opacity: .55;
}

.fqp-dc-blocked #fqp-bar .fqa-add,
.fqp-dc-blocked #fqp-bar .fqp-cta--scroll {
	background: #E3E3E3 !important;
	border-color: #E3E3E3 !important;
	color: #8f8f8f !important;
	box-shadow: none !important;
}

.fqp-dc-blocked #fqp-bar .fqa-atc {
	filter: none;
	opacity: 1;
}

/* ── Sheet ───────────────────────────────────────────────────────────── */

html.fqp-dc-lock,
html.fqp-dc-lock body {
	overflow: hidden !important;
}

.fqp-dc-sheet {
	position: fixed;
	inset: 0;
	z-index: 100000;
}

.fqp-dc-sheet[hidden] {
	display: none;
}

.fqp-dc-scrim {
	position: absolute;
	inset: 0;
	background: rgba(30, 30, 30, .42);
	opacity: 0;
	transition: opacity .2s ease;
}

.fqp-dc-panel {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	max-height: 88vh;
	overflow-y: auto;
	padding: 20px 18px calc(18px + env(safe-area-inset-bottom));
	background: #fff;
	border-radius: 20px 20px 0 0;
	transform: translateY(100%);
	transition: transform .26s cubic-bezier(.22, 1, .36, 1);
}

.fqp-dc-sheet.is-open .fqp-dc-scrim { opacity: 1; }
.fqp-dc-sheet.is-open .fqp-dc-panel { transform: none; }

@media (min-width: 640px) {
	.fqp-dc-panel {
		left: 50%;
		right: auto;
		bottom: auto;
		top: 50%;
		width: 420px;
		border-radius: 14px;
		transform: translate(-50%, -46%);
		opacity: 0;
		transition: transform .22s ease, opacity .22s ease;
	}
	.fqp-dc-sheet.is-open .fqp-dc-panel {
		transform: translate(-50%, -50%);
		opacity: 1;
	}
}

.fqp-dc-field {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 18px 0 0;
	padding: 4px 0;
	border-bottom: 1.5px solid #cfcfcf;
	transition: border-color .15s ease;
}

.fqp-dc-field:focus-within {
	border-bottom-color: var(--dc-red);
}

.fqp-dc-field > svg {
	width: 20px;
	height: 20px;
	flex: none;
	color: var(--dc-red);
}

.fqp-dc-sheet input#fqp-dc-pin {
	flex: 1;
	min-width: 0;
	height: 42px;
	margin: 0;
	padding: 0 !important;
	border: 0 !important;
	outline: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	font-family: inherit;
	font-size: 17px !important;
	font-weight: 600;
	letter-spacing: .14em;
	color: var(--dc-ink);
}

.fqp-dc-sheet input#fqp-dc-pin::placeholder {
	font-size: 14px;
	font-weight: 400;
	letter-spacing: 0;
	color: #aaa;
}

.fqp-dc-sheet button.fqp-dc-clear {
	width: 26px;
	height: 26px;
	padding: 5px;
	border: 0 !important;
	border-radius: 50%;
	background: #e9e9e9 !important;
	color: #666 !important;
	cursor: pointer;
}

.fqp-dc-sheet button.fqp-dc-clear[hidden] {
	display: none;
}

.fqp-dc-err {
	margin: 8px 0 0 !important;
	font-size: 12px;
	color: var(--dc-red);
}

.fqp-dc-err[hidden] {
	display: none;
}

.fqp-dc-sheet button.fqp-dc-gps {
	display: flex;
	align-items: center;
	gap: 12px;
	width: 100%;
	margin-top: 16px;
	padding: 6px 0;
	border: 0 !important;
	background: none !important;
	color: var(--dc-red) !important;
	font-size: 13.5px;
	font-weight: 600;
	text-align: left;
	cursor: pointer;
}

.fqp-dc-radar {
	position: relative;
	display: grid;
	place-items: center;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	border: 1px solid #F2B9B6;
	box-shadow: 0 0 0 6px #FDF1F0;
}

.fqp-dc-radar i {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: var(--dc-red);
}

.fqp-dc-gps.is-busy .fqp-dc-radar::after {
	content: "";
	position: absolute;
	inset: -1px;
	border-radius: 50%;
	border: 2px solid var(--dc-red);
	animation: fqp-dc-ping 1s ease-out infinite;
}

@keyframes fqp-dc-ping {
	from { transform: scale(1); opacity: .9; }
	to   { transform: scale(1.9); opacity: 0; }
}

.fqp-dc-saved[hidden] {
	display: none;
}

.fqp-dc-label {
	margin: 18px 0 4px !important;
	font-size: 11.5px;
	font-weight: 500;
	color: #666;
}

.fqp-dc-sheet button.fqp-dc-addr {
	display: flex;
	align-items: center;
	gap: 11px;
	width: 100%;
	padding: 12px 0;
	border: 0 !important;
	border-bottom: 1px solid var(--dc-line) !important;
	border-radius: 0;
	background: transparent !important;
	color: var(--dc-ink) !important;
	text-align: left;
	cursor: pointer;
}

.fqp-dc-sheet button.fqp-dc-addr.is-on {
	margin: 0 -18px;
	padding: 12px 18px 12px 15px;
	width: calc(100% + 36px);
	border-left: 3px solid var(--dc-red) !important;
	background: linear-gradient(90deg, var(--dc-red-wash), #fff) !important;
}

.fqp-dc-addr.is-busy {
	opacity: .6;
}

.fqp-dc-addr-ic {
	display: grid;
	place-items: center;
	flex: none;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background: var(--dc-soft);
	color: #777;
}

.fqp-dc-addr-ic svg {
	width: 16px;
	height: 16px;
}

.fqp-dc-addr-tx {
	flex: 1;
	min-width: 0;
}

.fqp-dc-addr-tx b {
	display: block;
	font-size: 13px;
	font-weight: 600;
}

.fqp-dc-addr-tx small {
	display: block;
	margin-top: 1px;
	font-size: 11px;
	color: var(--dc-muted);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.fqp-dc-addr-tag {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	flex: none;
	font-size: 10.5px;
	font-weight: 600;
	color: var(--dc-ok);
}

.fqp-dc-addr-tag i {
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: currentColor;
}

.fqp-dc-addr.is-no .fqp-dc-addr-tag {
	color: #B0B0B0;
}

.fqp-dc-sheet button.fqp-dc-confirm {
	display: block;
	width: 100%;
	height: 48px;
	margin-top: 20px;
	border: 0 !important;
	border-radius: 24px;
	background: var(--dc-red) !important;
	color: #fff !important;
	font-size: 13.5px;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	cursor: pointer;
	transition: background .15s ease, transform .1s ease;
}

.fqp-dc-sheet button.fqp-dc-confirm:active:not(:disabled) {
	transform: scale(.98);
	background: var(--dc-red-dk) !important;
}

.fqp-dc-sheet button.fqp-dc-confirm:disabled {
	background: #E3E3E3 !important;
	color: #A8A8A8 !important;
	cursor: default;
}

.fqp-dc-sheet.is-busy button.fqp-dc-confirm {
	opacity: .7;
}

.fqp-dc button:focus-visible,
.fqp-dc-sheet button:focus-visible {
	outline: 2px solid var(--dc-red);
	outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
	.fqp-dc *,
	.fqp-dc-sheet *,
	.fqp-dc-shake {
		animation: none !important;
		transition: none !important;
	}
}