/* The widget itself is just a positioning wrapper - the actual booking panel
   renders in .book_tour_overlay, fixed on top of the whole page, not inline
   wherever this markup happens to be printed (the hero, see
   caguide_render_tour_hero_box()). No visible launch button of its own any
   more - "Book Now!"/"Choose dates"/"Ask a question" elsewhere on the page
   (hero, sticky nav, mobile bar) already open this same overlay; see
   widgets/book-tour-widget.php's own docblock for why that changed. */
.book_tour_widget {
	display: inline-block;
}

/* ===== Overlay - fixed on top of the page, same fade/scale entrance pattern
   as the comparison view's .tour_compare_overlay, for a consistent feel. ===== */
/* pointer-events:none while closed - the calendar inside is built once with
   flatpickr's "inline" mode (kept alive across every open/close so a date
   already picked survives closing and reopening the panel), and flatpickr's
   OWN default CSS unconditionally sets ".flatpickr-calendar.inline" to
   visibility:visible, regardless of this overlay's own visibility:hidden
   here. That fought this rule and left a genuinely clickable (if invisible)
   calendar sitting in normal document flow, inside this fixed, full-viewport
   overlay, on every tour page - confirmed live as a dead zone that swallowed
   taps meant for whatever the page happened to show underneath it,
   including a "next tour" card's own link (which is what actually opened a
   phone's native month picker instead of navigating). This is a harder stop
   than fixing that one flatpickr quirk directly: it also covers any other
   descendant here that might someday do the same thing. */
.book_tour_overlay {
	display: flex;
	position: fixed;
	inset: 0;
	background-color: rgba(0, 0, 0, 0.35);
	z-index: 99999;
	align-items: center;
	justify-content: center;
	padding: 20px;
	box-sizing: border-box;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: opacity 200ms ease, visibility 0s linear 200ms;
}

.book_tour_overlay.show {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transition: opacity 200ms ease, visibility 0s linear 0s;
}

body.book_tour_overlay_open {
	overflow: hidden;
}

.book_tour_overlay_inner {
	position: relative;
	background-color: var(--card, #ffffff);
	border: 1px solid var(--border, #e6ddd0);
	border-radius: 0;
	padding: 28px;
	width: 100%;
	max-width: 960px;
	max-height: 88vh;
	overflow-y: auto;
	box-sizing: border-box;
	transform: scale(0.97);
	transition: transform 200ms ease;
}

.book_tour_overlay.show .book_tour_overlay_inner {
	transform: scale(1);
}

@media (prefers-reduced-motion: reduce) {
	.book_tour_overlay,
	.book_tour_overlay_inner {
		transition-duration: 0ms;
	}
}

.book_tour_close {
	position: absolute;
	top: 16px;
	right: 16px;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	padding: 0;
	border: none;
	border-radius: 50%;
	background-color: #f1f1f1;
	color: #3f444b;
	cursor: pointer;
	transition: background-color 200ms, color 200ms;
}

.book_tour_close svg {
	width: 14px;
	height: 14px;
	fill: currentColor;
	display: block;
}

.book_tour_close:hover {
	background-color: var(--pink-action, #e8334f) !important;
	color: #fff !important;
}

/* ===== Header - the tour name and step tabs, banner-style over the tour's
   featured image when it has one (bleeds to the edges of the overlay card).
   Falls back to a plain white banner with dark text when the tour has no
   featured image. ===== */
.book_tour_header {
	position: relative;
	margin: -28px -28px 22px;
	padding: 40px 60px 20px 28px;
	border-radius: 0;
	background-color: #fff;
	background-size: cover;
	background-position: center;
	/* A CSS background-image, not a real <img> - without this, click-dragging
	   across it (or the tour name/step tabs on top of it, which inherit this)
	   shows a "not-allowed"/no-drop cursor, same fix as .tour_hero_box in
	   tour-hero-widget.css. */
	user-select: none;
	cursor: default;
}

.book_tour_header_has_image {
	background-color: #2b2b2b;
}

.book_tour_header_has_image::before {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0.7) 100%);
}

.book_tour_header > * {
	position: relative;
	z-index: 1;
}

.book_tour_heading {
	margin: 0 0 16px;
	font-size: 20px;
	font-weight: 600;
	color: #151515;
}

.book_tour_header_has_image .book_tour_heading {
	color: #fff;
}

/* Only shown when the visitor's chosen currency isn't offered on this tour
   and the widget fell back to whichever one it does offer - see
   caguide_resolve_tour_currency() and Book_Tour_Widget::render(). */
.book_tour_currency_note {
	margin: -8px 0 16px;
	font-size: 13px;
	font-style: italic;
	color: #7a7a7a;
}

.book_tour_header_has_image .book_tour_currency_note {
	color: rgba( 255, 255, 255, 0.8 );
}

.book_tour_subheading {
	margin: 0 0 10px;
	font-size: 15px;
	font-weight: 600;
}

/* ===== Step indicator ===== */
.book_tour_steps {
	display: flex;
	gap: 8px;
}

.book_tour_step_indicator {
	flex: 1;
	text-align: center;
	padding: 8px 6px;
	border-radius: 0;
	background-color: #f1f1f1;
	color: #7a7a7a;
	font-size: 12px;
	font-weight: 600;
	transition: background-color 150ms, color 150ms;
}

.book_tour_step_indicator_reachable {
	cursor: pointer;
}

.book_tour_step_indicator_reachable:hover:not(.book_tour_step_indicator_active) {
	background-color: #e9e9e9;
	color: #3f444b;
}

.book_tour_step_indicator_active {
	background-color: #fdeaef;
	color: var(--pink-action, #e8334f);
}

.book_tour_panel {
	display: none;
}

.book_tour_panel_active {
	display: block;
}

/* ===== Layout: wizard on the left, a persistent running-total sidebar on the
   right (desktop) - moves below the wizard on narrow screens, see the media
   query at the bottom of this file. ===== */
.book_tour_layout {
	display: flex;
	align-items: flex-start;
	gap: 28px;
}

.book_tour_main {
	flex: 1 1 560px;
	min-width: 0;
}

.book_tour_sidebar {
	flex: 0 0 260px;
	background-color: #f7f6f4;
	border-radius: 0;
	padding: 18px;
	box-sizing: border-box;
	position: sticky;
	top: 0;
}

.book_tour_sidebar_heading {
	margin: 0 0 14px;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0.04em;
	color: var(--ink, #2b2420);
}

.book_tour_sidebar_row {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 10px;
	padding: 6px 0;
	font-size: 12.5px;
	color: #7a7a7a;
}

.book_tour_sidebar_date {
	font-weight: 600;
	color: #3f444b;
	text-align: right;
}

.book_tour_sidebar_lines {
	margin-bottom: 4px;
	border-bottom: 1px solid #e6e4e0;
}

.book_tour_sidebar .book_tour_summary {
	margin-bottom: 0;
}

.book_tour_sidebar .book_tour_summary_row {
	border-bottom-color: #e6e4e0;
}

/* ===== Step 1: package + calendar ===== */
.book_tour_controls {
	display: flex;
	flex-wrap: wrap;
	gap: 18px 32px;
	margin-bottom: 22px;
	padding-bottom: 22px;
	border-bottom: 1px solid #eeeeee;
}

.book_tour_control_group {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

/* Full-width row (like .book_tour_accommodation_group), with a divider above
   it - same gray as .book_tour_controls' own bottom border - to set the
   Payment option apart from the room package selectors visually, rather
   than the two just running together. */
.book_tour_payment_type_group {
	flex: 1 1 100%;
	padding-top: 18px;
	border-top: 1px solid #eeeeee;
}

/* Always its own full-width row, label and star buttons on one line - saves
   the vertical space two stacked lines used to take, and keeps it from
   sharing a row with whichever control happens to come right after it
   (previously just however .book_tour_controls' own flex-wrap happened to
   pack them). */
.book_tour_accommodation_group {
	flex: 1 1 100%;
	flex-direction: row;
	align-items: center;
	gap: 12px;
}

/* Double/Twin and Single at the same level, side by side, rather than
   Double/Twin sharing a row with Accommodation while Single wraps alone
   underneath. flex-basis matches so they read as two equal columns instead
   of each sized to its own content. */
.book_tour_room_package_group {
	flex: 1 1 280px;
}

.book_tour_label {
	font-weight: 600;
	font-size: 13px;
	color: #3f444b;
}

.book_tour_label strong {
	color: var(--pink-action, #e8334f);
}

.book_tour_package_hint {
	margin: 0;
	font-size: 11.5px;
	color: #7a7a7a;
}

/* Accommodation toggle - only rendered at all when a tour has 2 options to
   choose between (see caguide_get_accommodation_options()); labels are
   whatever the admin set them to (star grade, "Guesthouse", "Yurt camp", ...),
   so this is a plain pill toggle rather than a star-rating widget. */
.book_tour_accommodation_selector,
.book_tour_payment_type_selector,
.book_tour_type_selector {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
}

.book_tour_accommodation_option,
.book_tour_payment_type_option,
.book_tour_type_option {
	padding: 7px 16px;
	border: 1px solid #c1c1c1;
	border-radius: 0;
	background-color: #fff;
	color: #3f444b;
	font-family: inherit;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
	transition: background-color 150ms, border-color 150ms, color 150ms;
}

.book_tour_accommodation_option.active,
.book_tour_payment_type_option.active,
.book_tour_type_option.active {
	background-color: var(--pink-action, #e8334f);
	border-color: var(--pink-action, #e8334f);
	color: #fff;
}

/* background-color: #fff !important - the theme applies its own default
   hover background to every <button> (same fight as every other custom
   button in this plugin, see .tour_hero_cta_btn's own comment in
   tour-hero-widget.css). Confirmed live: this rule previously only set
   border-color, so an unselected option's hover painted the theme's solid
   crimson straight over it instead of the intended plain-white-with-pink-
   border look. */
.book_tour_accommodation_option:hover:not(.active),
.book_tour_payment_type_option:hover:not(.active):not(:disabled),
.book_tour_type_option:hover:not(.active) {
	background-color: #fff !important;
	border-color: var(--e-global-color-48147da, #f28f9e);
}

.book_tour_payment_type_option:disabled {
	background-color: #f1f1f1;
	border-color: #e0e0e0;
	color: #b7b7b7;
	cursor: not-allowed;
}

/* A plain dropdown, not the old dot/ball selector - that one couldn't
   represent 0 for Double/Twin at all (dots started at 1), which made
   booking a single solo traveler (Single = 1, Double/Twin = 0) impossible. */
.book_tour_double_twin_selector,
.book_tour_single_selector {
	width: 90px;
}

.book_tour_package_error {
	margin: 0 0 14px;
	padding: 10px 14px;
	background-color: #fdeded;
	border-radius: 0;
	color: #b32d2e;
	font-size: 13px;
}

.book_tour_calendar_wrap {
	margin-bottom: 22px;
}

.book_tour_calendar {
	display: flex;
	justify-content: center;
}

/* Plain underlined-text link, not a styled button - a quick shortcut next to
   the calendar, not competing with any of the widget's real CTAs. background:
   none !important on hover - the theme applies its own default hover
   background to every <button> (same fight as every other custom button in
   this plugin, see .tour_hero_cta_btn's own comment in tour-hero-widget.css),
   which would otherwise paint a solid block behind this text on hover. */
.book_tour_next_available_link {
	display: block;
	margin: 0 auto 10px;
	background: none;
	border: none;
	padding: 0;
	font-family: "Noto Sans", sans-serif;
	font-size: 13px;
	font-weight: 600;
	color: var(--pink-action, #e8334f);
	text-decoration: underline;
	text-align: center;
	cursor: pointer;
}

.book_tour_next_available_link:hover,
.book_tour_next_available_link:focus-visible {
	background: none !important;
	color: var(--e-global-color-e352649, #ca2c45);
}

/* flatpickr's own inline calendar loses its usual drop shadow/border when
   embedded inline like this - give it a light frame so it doesn't look like
   it's floating loose in the page. */
.book_tour_widget .flatpickr-calendar {
	box-shadow: none;
	border: 1px solid #eeeeee;
	border-radius: 0;
	width: 100%;
	max-width: 600px;
}

/* The departure date itself and every day the tour actually runs (start date
   plus its full duration, day 1 included) are marked identically - the same
   solid brand colour used for the site's own buttons, so the whole span reads
   as one clearly-marked block rather than singling out just the start date. */
.book_tour_widget .flatpickr-day.selected,
.book_tour_widget .flatpickr-day.book_tour_duration_day {
	background: var(--pink-action, #e8334f);
	border-color: var(--pink-action, #e8334f);
	color: #fff;
}

.book_tour_widget .flatpickr-day.selected:hover,
.book_tour_widget .flatpickr-day.book_tour_duration_day:hover {
	background: #e8334fd9;
	border-color: #e8334fd9;
}

.book_tour_calendar_hint {
	margin: 10px 0 0;
	font-size: 12.5px;
	color: #7a7a7a;
	text-align: center;
}

.book_tour_summary {
	margin-bottom: 18px;
}

.book_tour_summary_row {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 12px;
	padding: 8px 0;
	border-bottom: 1px solid #f1f1f1;
	font-size: 13px;
	color: #7a7a7a;
}

.book_tour_summary_row strong {
	font-variant-numeric: tabular-nums;
	color: #3f444b;
}

.book_tour_summary_deposit {
	font-weight: 600;
	color: #3f444b;
}

.book_tour_summary_deposit strong {
	font-size: 16px;
	color: var(--pink-action, #e8334f);
}

/* ===== Buttons (shared primary look) ===== */
.book_tour_next_btn,
.book_tour_participants_next_btn,
.book_tour_additions_next_btn,
.book_tour_pay_btn {
	display: block;
	width: 100%;
	box-sizing: border-box;
	/* !important - same sitewide line-height shrink fight as
	   .tour_hero_cta_btn (tour-hero-widget.css). */
	line-height: 1 !important;
	padding: 12px 16px;
	background-color: var(--pink-action, #e8334f);
	border: none;
	color: #fff;
	font-family: inherit;
	font-size: 14px;
	font-weight: 600;
	border-radius: 0;
	cursor: pointer;
	transition: background-color 200ms;
}

.book_tour_next_btn:hover:not(:disabled),
.book_tour_participants_next_btn:hover:not(:disabled),
.book_tour_additions_next_btn:hover:not(:disabled),
.book_tour_pay_btn:hover:not(:disabled) {
	background-color: #e8334fd9 !important;
}

.book_tour_next_btn:disabled,
.book_tour_pay_btn:disabled {
	background-color: #d8d8d8;
	color: #7a7a7a;
	cursor: not-allowed;
}

/* ===== Step 2: participant info ===== */
.book_tour_buyer_block {
	margin-bottom: 22px;
	padding-bottom: 22px;
	border-bottom: 1px solid #eeeeee;
}

.book_tour_notes_block {
	margin: 22px 0;
}

.book_tour_loi_block {
	margin: 22px 0;
	padding-top: 22px;
	border-top: 1px solid #eeeeee;
}

.book_tour_traveler {
	border: 1px solid #eeeeee;
	border-radius: 0;
	padding: 16px;
	margin-bottom: 16px;
}

.book_tour_traveler_heading {
	margin: 0 0 14px;
	font-size: 14px;
}

.book_tour_traveler_package {
	font-weight: 400;
	color: #7a7a7a;
}

.book_tour_traveler_grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px 16px;
}

.book_tour_field {
	display: flex;
	flex-direction: column;
	gap: 4px;
	font-size: 12.5px;
	font-weight: 600;
	color: #3f444b;
}

.book_tour_field_wide {
	grid-column: 1 / -1;
}

.book_tour_input {
	box-sizing: border-box;
	height: 38px;
	font-family: inherit;
	font-size: 13px;
	font-weight: 400;
	padding: 7px 10px;
	border: 1px solid #c1c1c1;
	border-radius: 0;
	color: #151515;
	background-color: #fff;
}

.book_tour_input:focus {
	outline: none;
	border-color: var(--pink-action, #e8334f);
}

.book_tour_input_error {
	border-color: #d32f2f;
	background-color: #fdeded;
}

textarea.book_tour_input {
	height: auto;
	resize: vertical;
	font-family: inherit;
}

.book_tour_field_bed {
	flex-direction: row;
	align-items: center;
	flex-wrap: wrap;
	gap: 14px;
	grid-column: 1 / -1;
}

.book_tour_field_bed > span {
	width: 100%;
}

.book_tour_radio {
	display: flex;
	align-items: center;
	gap: 5px;
	font-weight: 400;
	cursor: pointer;
}

.book_tour_radio input {
	accent-color: var(--pink-action, #e8334f);
	cursor: pointer;
}

.book_tour_file {
	font-size: 12px;
}

.book_tour_loi_row {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px;
}

.book_tour_loi_download {
	font-size: 12px;
	font-weight: 600;
	color: var(--pink-action, #e8334f);
	text-decoration: underline;
	white-space: nowrap;
}

.book_tour_loi_download:hover {
	color: #c8123f;
}

.book_tour_submit_error {
	margin: 0 0 14px;
	padding: 10px 14px;
	background-color: #fdeded;
	border-radius: 0;
	color: #b32d2e;
	font-size: 13px;
}

/* ===== Step 4: accepted payment methods (visual reassurance before the
   redirect to Stripe Checkout - simplified, stylised marks rather than exact
   brand logos, since which additional methods are enabled is Stripe-account
   config this plugin can't read). ===== */
.book_tour_payment_methods {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px;
	margin: 4px 0 18px;
}

.book_tour_payment_method_icon {
	box-sizing: border-box;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 2px;
	width: 42px;
	height: 27px;
	border-radius: 0;
	border: 1px solid #e0e0e0;
	background-color: #fff;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 9px;
	font-weight: 700;
	letter-spacing: 0.02em;
}

.book_tour_payment_method_visa {
	color: #1a1f71;
	font-style: italic;
}

.book_tour_payment_method_amex {
	color: #016fd0;
}

.book_tour_payment_method_mastercard i {
	display: inline-block;
	width: 14px;
	height: 14px;
	border-radius: 50%;
}

.book_tour_payment_method_mastercard i:first-child {
	background-color: #eb001b;
	margin-right: -6px;
}

.book_tour_payment_method_mastercard i:last-child {
	background-color: #f79e1b;
	mix-blend-mode: multiply;
}

.book_tour_payment_methods_note {
	font-size: 11.5px;
	color: #7a7a7a;
}

/* ===== Step 4: Terms and Conditions confirmation ===== */
.book_tour_terms_row {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin: 18px 0;
	font-size: 13px;
	color: #3f444b;
	cursor: pointer;
}

.book_tour_terms_row input[type="checkbox"] {
	flex: 0 0 auto;
	margin-top: 3px;
	width: 16px;
	height: 16px;
	accent-color: var(--pink-action, #e8334f);
	cursor: pointer;
}

.book_tour_terms_row a {
	color: var(--pink-action, #e8334f);
	text-decoration: underline;
}

.book_tour_participant_actions {
	display: flex;
	gap: 10px;
}

.book_tour_back_btn {
	flex: 0 0 auto;
	padding: 12px 18px;
	/* !important - same sitewide line-height shrink fight as
	   .tour_hero_cta_btn (tour-hero-widget.css); keeps this aligned with the
	   pink "next" button beside it. */
	line-height: 1 !important;
	background: none;
	border: 1px solid #c1c1c1;
	color: #3f444b;
	font-family: inherit;
	font-size: 14px;
	font-weight: 600;
	border-radius: 0;
	cursor: pointer;
	transition: background-color 200ms;
}

.book_tour_back_btn:hover {
	background-color: #f1f1f1 !important;
}

.book_tour_participant_actions .book_tour_pay_btn,
.book_tour_participant_actions .book_tour_participants_next_btn,
.book_tour_participant_actions .book_tour_additions_next_btn {
	flex: 1 1 auto;
}

/* ===== Nationality / phone country code (independent selectors) ===== */
.book_tour_phone_row {
	display: flex;
	gap: 8px;
}

.book_tour_phone_country {
	flex: 0 0 150px;
	min-width: 0;
}

.book_tour_phone_number {
	flex: 1 1 auto;
	min-width: 0;
}

select.book_tour_input {
	appearance: auto;
}

/* ===== select2 theming - searchable Nationality / phone country-code
   dropdowns. Flags are rendered as <img> (flagcdn.com), not emoji: Windows
   doesn't ship colour flag glyphs in its default emoji font, so emoji flags
   silently show as plain letter pairs there instead of an actual flag. ===== */
.book_tour_phone_row > .select2-container {
	flex: 0 0 150px;
}

.book_tour_field > .select2-container {
	width: 100% !important;
}

.book_tour_widget .select2-container--default .select2-selection--single {
	box-sizing: border-box;
	height: 38px;
	border: 1px solid #c1c1c1;
	border-radius: 0;
	display: flex;
	align-items: center;
	padding: 0 8px;
}

.book_tour_widget .select2-container--default .select2-selection--single .select2-selection__rendered {
	padding: 0;
	line-height: normal;
	color: #151515;
	font-size: 13px;
}

.book_tour_widget .select2-container--default .select2-selection--single .select2-selection__placeholder {
	color: #7a7a7a;
}

.book_tour_widget .select2-container--default .select2-selection--single .select2-selection__arrow {
	height: 36px;
}

.book_tour_widget .select2-container--default.select2-container--focus .select2-selection--single,
.book_tour_widget .select2-container--default.select2-container--open .select2-selection--single {
	border-color: var(--pink-action, #e8334f);
}

/* .select2-container--open (not ".book_tour_widget ...") from here down -
   select2 appends the open dropdown itself to <body>, not inside
   .book_tour_widget (see initCountrySelects() in book-tour-widget.js for
   why: no dropdownParent), so a .book_tour_widget-scoped selector would
   never match it. .select2-container--open only exists on this widget's own
   dropdowns (the only select2 usage on the site) while they're open - the
   exact moment these rules need to apply - and matches select2's own
   built-in ".select2-container--default ..." rules' specificity closely
   enough that book-tour-widget.css, loaded after select2.min.css (see the
   'select2.min' dependency on its wp_enqueue_style() call), still wins. */
.select2-container--open .select2-results__option--highlighted[aria-selected] {
	background-color: var(--pink-action, #e8334f);
}

.select2-container--open .select2-dropdown {
	border-color: #c1c1c1;
	font-size: 13px;
	/* Above .book_tour_overlay's own z-index (99999, see book-tour-widget.css
	   further up) - needed now that the dropdown is a body-level element
	   rather than a descendant of the overlay, so it isn't stacked below it. */
	z-index: 100000;
	/* The phone country-code control is narrow by design (it only shows a
	   flag + dial code once closed), but its dropdown list shows the full
	   flag + country name + code per row - min-width (not width) keeps it
	   wide enough for that to fit on one line without fighting select2's own
	   inline width, which otherwise just matches the narrow closed control. */
	min-width: 280px;
}

.select2-container--open .select2-search--dropdown .select2-search__field {
	border: 1px solid #c1c1c1;
	border-radius: 0;
	padding: 4px 8px;
	font-family: inherit;
}

.book_tour_select_error .select2-selection--single {
	border-color: #d32f2f !important;
	background-color: #fdeded;
}

.book_tour_select_option {
	display: flex;
	align-items: center;
	gap: 6px;
}

.book_tour_flag_icon {
	display: inline-block;
	flex: 0 0 auto;
	border-radius: 0;
	/* A plain <img> is natively draggable in every browser - the smallest
	   accidental mouse movement while clicking near one (these appear
	   throughout the nationality/phone-country select2 dropdowns, so there
	   are many of them close together) starts a native image drag, showing
	   the browser's own "not-allowed" cursor over the rest of the page.
	   Same fix as .tour_overview_flag_icon/.tour_compare_flag_icon in the
	   other two stylesheets - nothing here is meant to be dragged. */
	-webkit-user-drag: none;
	user-drag: none;
	user-select: none;
}

/* ===== Step 3: additions ===== */
.book_tour_additions_list {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin-bottom: 22px;
}

.book_tour_addition_row {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 12px 14px;
	border: 1px solid #eeeeee;
	border-radius: 0;
	cursor: pointer;
	transition: border-color 150ms;
}

.book_tour_addition_row:hover {
	border-color: var(--e-global-color-48147da, #f28f9e);
}

.book_tour_addition_row input[type="checkbox"] {
	accent-color: var(--pink-action, #e8334f);
	cursor: pointer;
	flex: 0 0 auto;
}

.book_tour_addition_label {
	flex: 1 1 auto;
	font-size: 13px;
	font-weight: 600;
	color: #3f444b;
}

.book_tour_addition_price {
	flex: 0 0 auto;
	font-variant-numeric: tabular-nums;
	color: var(--pink-action, #e8334f);
}

@media only screen and (max-width: 544px) {
	.book_tour_overlay {
		padding: 0;
	}
	.book_tour_overlay_inner {
		max-width: 100%;
		max-height: 100%;
		height: 100%;
		border-radius: 0;
		padding: 18px;
	}
	.book_tour_header {
		margin: -18px -18px 22px;
		padding: 30px 46px 16px 18px;
		border-radius: 0;
	}
	.book_tour_traveler_grid {
		grid-template-columns: 1fr;
	}
	.book_tour_phone_row {
		flex-direction: column;
	}
	.book_tour_phone_country {
		flex-basis: auto;
	}
	.book_tour_phone_row > .select2-container {
		flex-basis: auto;
	}
	.book_tour_layout {
		flex-direction: column;
	}
	.book_tour_sidebar {
		flex-basis: auto;
		width: 100%;
		position: static;
		order: 2;
	}
}