/* Réservation Premium – frontend styles */
.rp-booking {
	--rp-bg: #16161a;
	--rp-panel: #1e1e24;
	--rp-border: #2e2e36;
	--rp-gold: #c9a227;
	--rp-gold-soft: #e3c565;
	--rp-text: #f4f2ec;
	--rp-muted: #a6a29a;
	--rp-radius: 14px;
	max-width: 720px;
	margin: 0 auto;
	background: var(--rp-bg);
	color: var(--rp-text);
	border-radius: 20px;
	padding: 36px 32px 32px;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	box-shadow: 0 24px 60px rgba(0, 0, 0, 0.35);
	box-sizing: border-box;
}
.rp-booking *,
.rp-booking *::before,
.rp-booking *::after { box-sizing: border-box; }

.rp-header { text-align: center; margin-bottom: 28px; }
.rp-header-eyebrow {
	color: var(--rp-gold);
	font-size: 12px;
	letter-spacing: 4px;
	text-transform: uppercase;
	margin-bottom: 8px;
}
.rp-header-title {
	margin: 0;
	color: var(--rp-text);
	font-size: 28px;
	font-weight: 600;
	font-family: Georgia, "Times New Roman", serif;
}

/* Steps */
.rp-steps {
	display: flex;
	justify-content: space-between;
	gap: 8px;
	list-style: none;
	margin: 0 0 28px;
	padding: 0;
	counter-reset: step;
}
.rp-step {
	flex: 1;
	text-align: center;
	font-size: 12px;
	color: var(--rp-muted);
	position: relative;
	padding-top: 34px;
}
.rp-step span {
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 28px;
	height: 28px;
	line-height: 26px;
	border-radius: 50%;
	border: 1px solid var(--rp-border);
	background: var(--rp-panel);
	color: var(--rp-muted);
	font-size: 12px;
}
.rp-step.is-active { color: var(--rp-gold-soft); }
.rp-step.is-active span,
.rp-step.is-done span {
	border-color: var(--rp-gold);
	background: var(--rp-gold);
	color: #141414;
	font-weight: 700;
}

/* Panels */
.rp-panel { display: none; animation: rp-fade 0.25s ease; }
.rp-panel.is-active { display: block; }
@keyframes rp-fade {
	from { opacity: 0; transform: translateY(6px); }
	to { opacity: 1; transform: none; }
}

.rp-subtitle {
	font-size: 13px;
	letter-spacing: 2px;
	text-transform: uppercase;
	color: var(--rp-gold);
	margin: 24px 0 12px;
	font-weight: 600;
}
.rp-panel .rp-subtitle:first-child { margin-top: 0; }

/* Fields */
.rp-field { margin-bottom: 16px; }
.rp-field label {
	display: block;
	font-size: 13px;
	color: var(--rp-muted);
	margin-bottom: 6px;
}
.rp-field label small { color: var(--rp-gold-soft); }
.rp-booking input[type="text"],
.rp-booking input[type="email"],
.rp-booking input[type="tel"],
.rp-booking input[type="date"],
.rp-booking input[type="time"],
.rp-booking select,
.rp-booking textarea {
	width: 100%;
	background: var(--rp-panel);
	border: 1px solid var(--rp-border);
	border-radius: 10px;
	color: var(--rp-text);
	padding: 12px 14px;
	font-size: 15px;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
	appearance: none;
	-webkit-appearance: none;
}
.rp-booking input:focus,
.rp-booking select:focus,
.rp-booking textarea:focus {
	outline: none;
	border-color: var(--rp-gold);
	box-shadow: 0 0 0 3px rgba(201, 162, 39, 0.18);
}
.rp-booking input.rp-invalid,
.rp-booking select.rp-invalid { border-color: #d64545; }
.rp-booking ::placeholder { color: #6e6a63; }
.rp-booking input[type="date"],
.rp-booking input[type="time"] { color-scheme: dark; }

.rp-grid-2 {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 14px;
}
@media (max-width: 560px) {
	.rp-booking { padding: 26px 18px; }
	.rp-grid-2 { grid-template-columns: 1fr; gap: 0; }
	.rp-step { font-size: 10px; }
}

/* Honeypot */
.rp-hp {
	position: absolute !important;
	left: -9999px !important;
	opacity: 0;
	height: 0;
	pointer-events: none;
}

/* Service toggle */
.rp-service-toggle {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px;
	margin-bottom: 20px;
}
.rp-service {
	border: 1px solid var(--rp-border);
	background: var(--rp-panel);
	border-radius: var(--rp-radius);
	padding: 16px;
	cursor: pointer;
	text-align: center;
	transition: border-color 0.15s ease, background 0.15s ease;
}
.rp-service input { position: absolute; opacity: 0; }
.rp-service strong { display: block; font-size: 15px; }
.rp-service small { color: var(--rp-muted); font-size: 12px; }
.rp-service.is-selected {
	border-color: var(--rp-gold);
	background: rgba(201, 162, 39, 0.08);
}
.rp-service.is-selected strong { color: var(--rp-gold-soft); }

/* Checkboxes */
.rp-check {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin: 14px 0;
	cursor: pointer;
	font-size: 14px;
	color: var(--rp-text);
}
.rp-check input {
	width: 18px;
	height: 18px;
	margin-top: 1px;
	accent-color: var(--rp-gold);
	flex: none;
}
.rp-check small { color: var(--rp-gold-soft); }
.rp-check a { color: var(--rp-gold-soft); }

/* Autocomplete */
.rp-autocomplete { position: relative; }
.rp-suggestions {
	position: absolute;
	z-index: 40;
	top: calc(100% + 4px);
	left: 0;
	right: 0;
	margin: 0;
	padding: 6px;
	list-style: none;
	background: #23232a;
	border: 1px solid var(--rp-border);
	border-radius: 10px;
	box-shadow: 0 16px 40px rgba(0, 0, 0, 0.45);
	max-height: 240px;
	overflow: auto;
}
.rp-suggestions li {
	padding: 10px 12px;
	border-radius: 8px;
	cursor: pointer;
	font-size: 13px;
	color: var(--rp-text);
}
.rp-suggestions li:hover,
.rp-suggestions li.is-focused { background: rgba(201, 162, 39, 0.14); }

/* Vehicles */
.rp-vehicles { display: grid; gap: 12px; }
.rp-vehicles-hint {
	text-align: center;
	color: var(--rp-muted);
	font-size: 13px;
	margin: 0 0 16px;
}
.rp-vehicle {
	position: relative;
	display: grid;
	grid-template-columns: 110px minmax(0, 1fr) auto;
	gap: 16px;
	align-items: center;
	border: 1px solid var(--rp-border);
	background: var(--rp-panel);
	border-radius: var(--rp-radius);
	padding: 14px 16px;
	cursor: pointer;
	transition: border-color 0.15s ease, background 0.15s ease, opacity 0.15s ease;
}
.rp-vehicle input { position: absolute; opacity: 0; }
.rp-vehicle.is-selected {
	border-color: var(--rp-gold);
	background: rgba(201, 162, 39, 0.08);
}
.rp-vehicle.is-disabled { opacity: 0.35; pointer-events: none; }
.rp-vehicle-media {
	width: 110px;
	height: 74px;
	border-radius: 10px;
	overflow: hidden;
	background: #101014;
	display: flex;
	align-items: center;
	justify-content: center;
}
.rp-vehicle-media img { width: 100%; height: 100%; object-fit: cover; }
.rp-vehicle-icon { font-size: 34px; line-height: 1; }
.rp-vehicle-icon[data-icon="sedan"]::before { content: "🚗"; }
.rp-vehicle-icon[data-icon="luxury"]::before { content: "🚘"; }
.rp-vehicle-icon[data-icon="van"]::before { content: "🚐"; }
.rp-vehicle-icon[data-icon="suv"]::before { content: "🚙"; }
.rp-vehicle-icon[data-icon="maybach"]::before { content: "✨"; }
.rp-vehicle-icon[data-icon="moto"]::before { content: "🏍️"; }
.rp-vehicle-cat {
	display: block;
	font-size: 10px;
	letter-spacing: 2px;
	text-transform: uppercase;
	color: var(--rp-gold);
}
.rp-vehicle-name {
	display: block;
	font-size: 16px;
	font-weight: 600;
	margin: 2px 0;
}
.rp-vehicle-desc {
	display: block;
	font-size: 12px;
	color: var(--rp-muted);
}
.rp-vehicle-caps {
	display: flex;
	gap: 12px;
	font-size: 12px;
	color: var(--rp-muted);
	margin-top: 6px;
}
.rp-vehicle-side {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 8px;
	min-width: 92px;
}
.rp-vehicle-price {
	font-family: Georgia, serif;
	font-size: 20px;
	font-weight: 700;
	color: var(--rp-gold-soft);
	white-space: nowrap;
	line-height: 1.1;
}
.rp-vehicle-price small {
	display: block;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 10px;
	font-weight: 400;
	color: var(--rp-muted);
	letter-spacing: 1px;
	text-transform: uppercase;
	margin-top: 2px;
}
.rp-price-skeleton {
	display: block;
	width: 76px;
	height: 20px;
	border-radius: 5px;
	background: linear-gradient(90deg, #26262e 25%, #33333d 50%, #26262e 75%);
	background-size: 200% 100%;
	animation: rp-shimmer 1.2s infinite;
}
@keyframes rp-shimmer {
	from { background-position: 200% 0; }
	to { background-position: -200% 0; }
}
.rp-vehicle-check {
	width: 26px;
	height: 26px;
	border-radius: 50%;
	border: 1px solid var(--rp-border);
	display: flex;
	align-items: center;
	justify-content: center;
	color: transparent;
	font-size: 14px;
	transition: all 0.15s ease;
	flex: none;
}
.rp-vehicle.is-selected .rp-vehicle-check {
	background: var(--rp-gold);
	border-color: var(--rp-gold);
	color: #141414;
	font-weight: 700;
}
@media (max-width: 560px) {
	.rp-vehicle {
		/* minmax(0,…) : sans lui, la colonne centrale refuse de retrecir sous
		   la largeur de son contenu et la carte depassait de 23 px sur un
		   iPhone — defaut anterieur, corrige ici. */
		grid-template-columns: 84px minmax(0, 1fr) auto;
		gap: 12px;
		padding: 12px;
	}
	.rp-vehicle-media { width: 84px; height: 58px; }
	.rp-vehicle-price { font-size: 17px; }
	.rp-vehicle-side { min-width: 78px; }
}

/* Payments */
.rp-payments { display: grid; gap: 10px; }
.rp-payment {
	display: flex;
	align-items: center;
	gap: 14px;
	border: 1px solid var(--rp-border);
	background: var(--rp-panel);
	border-radius: var(--rp-radius);
	padding: 13px 16px;
	cursor: pointer;
	transition: border-color 0.15s ease, background 0.15s ease;
}
.rp-payment input { position: absolute; opacity: 0; }
.rp-payment.is-selected {
	border-color: var(--rp-gold);
	background: rgba(201, 162, 39, 0.08);
}
.rp-payment-icon { font-size: 22px; }
.rp-payment strong { display: block; font-size: 14px; }
.rp-payment small { color: var(--rp-muted); font-size: 12px; }

/* Summary */
.rp-summary {
	background: var(--rp-panel);
	border: 1px solid var(--rp-border);
	border-radius: var(--rp-radius);
	padding: 20px 22px;
	margin-bottom: 16px;
}
.rp-summary-loading { color: var(--rp-muted); text-align: center; padding: 12px 0; }
.rp-summary h4 {
	margin: 0 0 12px;
	font-size: 13px;
	letter-spacing: 2px;
	text-transform: uppercase;
	color: var(--rp-gold);
}
.rp-summary-row {
	display: flex;
	justify-content: space-between;
	gap: 16px;
	padding: 7px 0;
	font-size: 14px;
	border-bottom: 1px dashed rgba(255, 255, 255, 0.06);
}
.rp-summary-row .rp-k { color: var(--rp-muted); }
.rp-summary-row .rp-v { text-align: right; }
.rp-summary-total {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	margin-top: 14px;
	padding-top: 14px;
	border-top: 2px solid var(--rp-gold);
	font-size: 15px;
}
.rp-summary-total .rp-amount {
	font-size: 26px;
	font-weight: 700;
	color: var(--rp-gold-soft);
	font-family: Georgia, serif;
}
.rp-reassure {
	text-align: center;
	color: var(--rp-muted);
	font-size: 13px;
	margin: 14px 0 0;
}

/* Buttons */
.rp-nav {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	margin-top: 24px;
}
.rp-btn {
	appearance: none;
	border: none;
	border-radius: 999px;
	padding: 14px 30px;
	font-size: 15px;
	font-weight: 600;
	cursor: pointer;
	background: linear-gradient(135deg, var(--rp-gold), #a8841a);
	color: #141414;
	transition: transform 0.12s ease, box-shadow 0.12s ease, opacity 0.12s ease;
	margin-left: auto;
	text-decoration: none;
	display: inline-block;
}
.rp-btn:hover { transform: translateY(-1px); box-shadow: 0 8px 22px rgba(201, 162, 39, 0.3); }
.rp-btn:disabled { opacity: 0.6; cursor: wait; transform: none; }
.rp-btn-ghost {
	background: transparent;
	border: 1px solid var(--rp-border);
	color: var(--rp-muted);
	margin-left: 0;
	margin-right: auto;
}
.rp-btn-ghost:hover { box-shadow: none; color: var(--rp-text); }
.rp-btn-whatsapp { background: #25d366; color: #06281a; margin: 18px auto 0; }

/* Error / success */
.rp-error {
	background: rgba(214, 69, 69, 0.12);
	border: 1px solid rgba(214, 69, 69, 0.5);
	color: #ffb3b3;
	border-radius: 10px;
	padding: 12px 16px;
	font-size: 14px;
	margin-top: 16px;
}
.rp-success { text-align: center; padding: 24px 8px; }
.rp-success-icon {
	width: 64px;
	height: 64px;
	margin: 0 auto 16px;
	border-radius: 50%;
	background: var(--rp-gold);
	color: #141414;
	font-size: 30px;
	font-weight: 700;
	display: flex;
	align-items: center;
	justify-content: center;
}
.rp-success h3 {
	color: var(--rp-text);
	font-family: Georgia, serif;
	font-size: 24px;
	margin: 0 0 6px;
}
.rp-success p { color: var(--rp-muted); font-size: 14px; }
.rp-success-ref {
	color: var(--rp-gold-soft) !important;
	font-size: 16px !important;
	font-weight: 600;
}

/* ---------------- Convoy note on a range card ---------------- */
.rp-vehicle-fleet {
	display: block;
	font-size: 11.5px;
	line-height: 1.4;
	margin-top: 6px;
	color: var(--rp-muted);
}
.rp-vehicle-fleet:empty { display: none; }
.rp-vehicle-fleet.is-support,
.rp-vehicle-fleet.is-multi {
	color: var(--rp-gold-soft);
}
.rp-vehicle-fleet.is-support::before { content: "🧳 "; }
.rp-vehicle-fleet.is-multi::before { content: "🚘 "; }
.rp-vehicle-fleet.is-unavailable { color: #d98a8a; }

/* ---------------- Options ---------------- */
.rp-option-hero {
	position: relative;
	display: flex;
	align-items: center;
	gap: 16px;
	border: 1px solid var(--rp-gold);
	background: linear-gradient(135deg, rgba(201, 162, 39, 0.14), rgba(201, 162, 39, 0.04));
	border-radius: var(--rp-radius);
	padding: 18px 20px;
	margin-bottom: 18px;
	cursor: pointer;
	transition: box-shadow 0.15s ease, transform 0.12s ease;
}
.rp-option-hero:hover { transform: translateY(-1px); }
.rp-option-hero input { position: absolute; opacity: 0; }
.rp-option-hero.is-selected {
	box-shadow: 0 0 0 3px rgba(201, 162, 39, 0.25);
	background: linear-gradient(135deg, rgba(201, 162, 39, 0.24), rgba(201, 162, 39, 0.08));
}
.rp-option-hero-body { flex: 1; }
.rp-option-hero-head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 12px;
	flex-wrap: wrap;
}
.rp-option-hero-name {
	font-family: Georgia, "Times New Roman", serif;
	font-size: 19px;
	font-weight: 600;
	color: var(--rp-gold-soft);
	letter-spacing: 0.5px;
}
.rp-option-hero-price {
	font-size: 17px;
	font-weight: 700;
	color: var(--rp-text);
	white-space: nowrap;
}
.rp-option-hero-desc {
	display: block;
	margin-top: 6px;
	font-size: 12.5px;
	line-height: 1.55;
	color: var(--rp-muted);
}
.rp-option-hero-check {
	flex: none;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	border: 1px solid var(--rp-border);
	display: flex;
	align-items: center;
	justify-content: center;
	color: transparent;
	font-size: 15px;
	transition: all 0.15s ease;
}
.rp-option-hero.is-selected .rp-option-hero-check {
	background: var(--rp-gold);
	border-color: var(--rp-gold);
	color: #141414;
	font-weight: 700;
}

.rp-options { display: grid; gap: 10px; }
.rp-option {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	border: 1px solid var(--rp-border);
	background: var(--rp-panel);
	border-radius: var(--rp-radius);
	padding: 13px 16px;
}
.rp-option-text { min-width: 0; }
.rp-option-name {
	display: block;
	font-size: 14.5px;
	color: var(--rp-text);
}
.rp-option-name small {
	color: var(--rp-gold-soft);
	font-size: 12px;
	margin-left: 6px;
}
.rp-option-desc {
	display: block;
	font-size: 12px;
	color: var(--rp-muted);
	margin-top: 3px;
	line-height: 1.45;
}
.rp-option-auto-note {
	display: none;
	margin-top: 5px;
	font-size: 11px;
	color: var(--rp-gold-soft);
}
.rp-option.is-auto-on {
	border-color: rgba(201, 162, 39, 0.55);
	background: rgba(201, 162, 39, 0.07);
}
.rp-option.is-auto-on .rp-option-auto-note { display: block; }
.rp-option-control { flex: none; }
.rp-option-control select { width: auto; min-width: 74px; }

/* Switch */
.rp-switch {
	position: relative;
	display: inline-block;
	width: 46px;
	height: 26px;
	cursor: pointer;
	margin: 0;
}
.rp-switch input { position: absolute; opacity: 0; width: 0; height: 0; }
.rp-switch span {
	position: absolute;
	inset: 0;
	background: #34343d;
	border: 1px solid var(--rp-border);
	border-radius: 999px;
	transition: background 0.18s ease, border-color 0.18s ease;
}
.rp-switch span::after {
	content: "";
	position: absolute;
	top: 3px;
	left: 3px;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	background: var(--rp-muted);
	transition: transform 0.18s ease, background 0.18s ease;
}
.rp-switch input:checked + span {
	background: rgba(201, 162, 39, 0.35);
	border-color: var(--rp-gold);
}
.rp-switch input:checked + span::after {
	transform: translateX(20px);
	background: var(--rp-gold);
}
.rp-switch input:focus-visible + span {
	box-shadow: 0 0 0 3px rgba(201, 162, 39, 0.25);
}

/* ---------------- Summary refinements ---------------- */
.rp-summary-sep {
	height: 1px;
	background: rgba(255, 255, 255, 0.08);
	margin: 14px 0 8px;
}
.rp-summary-row.is-luggage .rp-v,
.rp-summary-row.is-luggage .rp-k { color: var(--rp-gold-soft); }

@media (max-width: 560px) {
	/* Keep the label and its control side by side — stacking them made the
	   selector overlap the description. */
	.rp-option { gap: 12px; padding: 12px 14px; }
	.rp-option-text { flex: 1 1 auto; }
	.rp-option-control { flex: 0 0 auto; }
	.rp-option-control select { min-width: 62px; padding: 10px 8px; }
	.rp-option-hero { padding: 16px; gap: 12px; }
	.rp-option-hero-name { font-size: 17px; }
	.rp-option-hero-head { gap: 4px; }
}

.rp-summary-row.is-detail .rp-k {
	padding-left: 14px;
	font-size: 12.5px;
	opacity: 0.85;
}

/* ---------------- Detailed option block (Pack VIP…) ---------------- */
.rp-vip-block {
	border: 1px solid rgba(201, 162, 39, 0.45);
	background: linear-gradient(135deg, rgba(201, 162, 39, 0.12), rgba(201, 162, 39, 0.03));
	border-radius: var(--rp-radius);
	padding: 16px 18px;
	margin: 16px 0 4px;
}
.rp-vip-name {
	font-family: Georgia, "Times New Roman", serif;
	font-size: 17px;
	font-weight: 600;
	color: var(--rp-gold-soft);
	letter-spacing: 0.5px;
	margin-bottom: 8px;
}
.rp-vip-includes {
	list-style: none;
	margin: 0 0 12px;
	padding: 0;
}
.rp-vip-includes li {
	font-size: 12.5px;
	color: var(--rp-muted);
	line-height: 1.6;
	padding-left: 14px;
	position: relative;
}
.rp-vip-includes li::before {
	content: "·";
	position: absolute;
	left: 3px;
	color: var(--rp-gold);
}
.rp-vip-row {
	display: flex;
	justify-content: space-between;
	gap: 14px;
	font-size: 13.5px;
	padding: 4px 0;
	color: var(--rp-text);
}
.rp-vip-row span:first-child { color: var(--rp-muted); }
.rp-vip-row span:last-child { white-space: nowrap; }
.rp-vip-included {
	font-size: 12px;
	color: #8a8371;
	margin: 2px 0 8px;
}
.rp-vip-row.is-total {
	margin-top: 8px;
	padding-top: 10px;
	border-top: 1px solid rgba(201, 162, 39, 0.35);
	font-weight: 700;
}
.rp-vip-row.is-total span:first-child { color: var(--rp-text); }
.rp-vip-row.is-total span:last-child { color: var(--rp-gold-soft); }

/* ---------------- Time picker ---------------- */
.rp-timepicker {
	display: flex;
	align-items: center;
	gap: 8px;
}
.rp-timepicker select {
	flex: 1 1 0;
	min-width: 0;
	text-align: center;
	text-align-last: center;
	font-variant-numeric: tabular-nums;
	font-size: 16px; /* 16px prevents iOS from zooming the page on focus. */
	padding: 12px 8px;
	background-image: none;
}
.rp-timepicker-sep {
	color: var(--rp-muted);
	font-size: 18px;
	font-weight: 600;
	flex: none;
}
.rp-timepicker.rp-invalid select { border-color: #d64545; }

/* Free numeric fields: no browser spinner, wide enough for any figure. */
.rp-booking input[type="number"] {
	width: 100%;
	background: var(--rp-panel);
	border: 1px solid var(--rp-border);
	border-radius: 10px;
	color: var(--rp-text);
	padding: 12px 14px;
	font-size: 16px;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
	appearance: textfield;
	-moz-appearance: textfield;
}
.rp-booking input[type="number"]::-webkit-outer-spin-button,
.rp-booking input[type="number"]::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}
.rp-booking input[type="number"]:focus {
	outline: none;
	border-color: var(--rp-gold);
	box-shadow: 0 0 0 3px rgba(201, 162, 39, 0.18);
}

/* ---------------- Help bubble + dialog ---------------- */
.rp-help {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 19px;
	height: 19px;
	margin-left: 7px;
	padding: 0;
	border: 1px solid var(--rp-gold);
	border-radius: 50%;
	background: transparent;
	color: var(--rp-gold);
	font-family: inherit;
	font-size: 12px;
	font-weight: 700;
	line-height: 1;
	cursor: pointer;
	vertical-align: middle;
	transition: background 0.15s ease, color 0.15s ease, transform 0.12s ease;
}
.rp-help:hover {
	background: var(--rp-gold);
	color: #141414;
	transform: scale(1.1);
}
.rp-help:focus-visible {
	outline: 2px solid var(--rp-gold-soft);
	outline-offset: 2px;
}

body.rp-modal-open { overflow: hidden; }

.rp-modal {
	position: fixed;
	inset: 0;
	z-index: 9999;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px;
}
.rp-modal[hidden] { display: none; }
.rp-modal-backdrop {
	position: absolute;
	inset: 0;
	background: rgba(8, 8, 10, 0.78);
	backdrop-filter: blur(3px);
}
.rp-modal-panel {
	position: relative;
	width: 100%;
	max-width: 560px;
	max-height: 86vh;
	overflow-y: auto;
	background: var(--rp-bg, #16161a);
	border: 1px solid var(--rp-border, #2e2e36);
	border-radius: 18px;
	padding: 30px 32px 26px;
	color: var(--rp-text, #f4f2ec);
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	box-shadow: 0 30px 80px rgba(0, 0, 0, 0.55);
	animation: rp-modal-in 0.2s ease;
}
@keyframes rp-modal-in {
	from { opacity: 0; transform: translateY(10px) scale(0.99); }
	to { opacity: 1; transform: none; }
}
.rp-modal-close {
	position: absolute;
	top: 14px;
	right: 16px;
	width: 32px;
	height: 32px;
	border: none;
	background: transparent;
	color: var(--rp-muted, #a6a29a);
	font-size: 26px;
	line-height: 1;
	cursor: pointer;
	border-radius: 50%;
}
.rp-modal-close:hover { color: var(--rp-text, #f4f2ec); background: rgba(255, 255, 255, 0.06); }
.rp-modal-eyebrow {
	display: block;
	font-size: 10px;
	letter-spacing: 3px;
	text-transform: uppercase;
	color: var(--rp-gold, #c9a227);
}
.rp-modal-title {
	margin: 6px 0 18px;
	font-family: Georgia, "Times New Roman", serif;
	font-size: 24px;
	font-weight: 600;
	color: var(--rp-text, #f4f2ec);
}
.rp-modal-panel h4 {
	margin: 18px 0 6px;
	font-size: 12px;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	color: var(--rp-gold, #c9a227);
	font-weight: 600;
}
.rp-modal-panel p {
	margin: 0;
	font-size: 14px;
	line-height: 1.65;
	color: var(--rp-muted, #a6a29a);
}
.rp-modal-list { margin: 6px 0 0; padding: 0; list-style: none; }
.rp-modal-list li {
	position: relative;
	padding-left: 18px;
	font-size: 13.5px;
	line-height: 1.7;
	color: var(--rp-muted, #a6a29a);
}
.rp-modal-list li::before {
	content: "✓";
	position: absolute;
	left: 0;
	color: var(--rp-gold, #c9a227);
	font-size: 11px;
}
.rp-modal-more { margin-top: 20px !important; }
.rp-modal-more a {
	color: var(--rp-gold-soft, #e3c565);
	font-size: 14px;
	text-decoration: none;
	font-weight: 600;
}
.rp-modal-more a:hover { text-decoration: underline; }

@media (max-width: 560px) {
	.rp-modal { padding: 12px; }
	.rp-modal-panel { padding: 26px 20px 20px; max-height: 90vh; }
	.rp-modal-title { font-size: 21px; }
}

.rp-modal-notice {
	margin-top: 8px !important;
	padding: 10px 12px;
	border-left: 2px solid var(--rp-gold, #c9a227);
	background: rgba(201, 162, 39, 0.07);
	border-radius: 0 8px 8px 0;
	font-size: 12.5px !important;
	line-height: 1.6 !important;
}


.rp-summary-badge {
	display: inline-block;
	margin: 10px 0 4px;
	padding: 6px 14px;
	border-radius: 999px;
	background: rgba(201, 162, 39, 0.16);
	border: 1px solid rgba(201, 162, 39, 0.45);
	color: var(--rp-gold-soft);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 1.5px;
	text-transform: uppercase;
}
.rp-vehicle-fleet.is-support {
	display: inline-block;
	margin-top: 7px;
	padding: 3px 9px;
	border-radius: 999px;
	background: rgba(201, 162, 39, 0.14);
	border: 1px solid rgba(201, 162, 39, 0.4);
	color: var(--rp-gold-soft);
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 1px;
	text-transform: uppercase;
}
.rp-vehicle-fleet.is-support::before { content: ""; }

/* Hold and cabin share the cell under the pickup time. */
.rp-luggage-pair {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px;
}
.rp-luggage-pair .rp-field { margin-bottom: 16px; }
.rp-luggage-pair label {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.rp-luggage-pair input[type="number"] { padding-left: 12px; padding-right: 12px; }

/* ---------------------------------------------------------------------------
   BARRE D'ACTIONS SUR PETIT ECRAN (11/08/2026)

   .rp-nav est un flex sans retour a la ligne. Sur un iPhone (375 px), le
   bouton « Confirmer ma réservation » et ses 30 px de marge interne de chaque
   cote sortaient du cadre : le bouton principal etait coupe, donc inatteignable
   pour une partie des clients (signale par l'exploitant).

   En dessous de 520 px, les boutons passent en pleine largeur et s'empilent.
   L'action principale est placee AU-DESSUS du retour : sur mobile, le pouce
   trouve d'abord ce qui fait avancer.
   ------------------------------------------------------------------------ */
.rp-btn { max-width: 100%; box-sizing: border-box; }

@media (max-width: 520px) {
	.rp-nav { flex-wrap: wrap; }
	.rp-nav .rp-btn {
		flex: 1 1 100%;
		margin-left: 0;
		margin-right: 0;
		padding-left: 18px;
		padding-right: 18px;
		text-align: center;
		white-space: normal;
	}
	.rp-nav .rp-next,
	.rp-nav .rp-submit { order: 1; }
	.rp-nav .rp-prev { order: 2; }
}

/* ---------------------------------------------------------------------------
   DETAIL DES POSTES SUR LA CARTE VEHICULE (11/08/2026)

   Quand la course demande plusieurs voitures, ou un van dedie aux bagages, le
   client voyait un total unique sans savoir ce qu'il recouvrait. Le moteur
   calculait pourtant deja une ligne par vehicule : elle n'etait simplement
   jamais montree a cet endroit.

   Le total reste a droite, la ou l'oeil le cherche pour comparer les gammes.
   Le detail s'inscrit sous le nom, en retrait, pour expliquer sans distraire.
   ------------------------------------------------------------------------ */
.rp-vehicle-detail {
	grid-column: 1 / -1;
	display: block;
	margin-top: 2px;
	padding-top: 12px;
	border-top: 1px solid var(--rp-border);
}
.rp-vehicle-detail[hidden] { display: none; }
.rp-detail-line {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 16px;
	font-size: 12.5px;
	line-height: 1.7;
	color: var(--rp-muted);
}
.rp-detail-line b { font-weight: 600; white-space: nowrap; }
.rp-detail-line.is-van { color: var(--rp-gold); }
.rp-detail-line.is-total {
	margin-top: 6px;
	padding-top: 6px;
	border-top: 1px solid var(--rp-border);
	color: inherit;
	font-weight: 600;
}

/* Gammes ecartees : la phrase doit se lire comme une information de service,
   jamais comme une erreur — rien n'a ete mal saisi. */
.rp-vehicles-retires {
	margin: 14px 2px 0;
	font-size: 12.5px;
	line-height: 1.6;
	color: var(--rp-muted);
}
.rp-vehicles-retires[hidden] { display: none; }