/**
 * TourFlow Frontend Styles
 * 
 * These styles are minimal and designed to work with any theme.
 * Most styling should come from the active theme.
 */

/* Typography - General Defaults */
/* Single-product title: keep the semantic <h1> but size it to match Astra's
   GLOBAL H2 typography (Customizer → Typography → Headings → H2 = 42/34/28px
   desktop/tablet/mobile). Astra exposes no font-size CSS variable, so these px
   values mirror the current global H2 — change them here if you change H2 in the
   Customizer. The responsive steps live in the hero media queries below. */
:root {
	--tf-single-title-size: 42px;        /* Astra global H2 desktop */
	--tf-single-title-size-tablet: 34px; /* Astra global H2 tablet  */
	--tf-single-title-size-mobile: 28px; /* Astra global H2 mobile  */
}

.product_title, h1.entry-title {
	font-size: var(--tf-single-title-size);
	margin-bottom: 10px;
}

/* --- HERO LAYOUT (2-ROW HEADER + BODY) --- */

/* Wrapper */
.tourflow-hero-wrapper {
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-webkit-flex-direction: column;
	    -ms-flex-direction: column;
	        flex-direction: column;
	gap: 60px;
	margin-bottom: 50px;
	width: 100%;
    
    /* Enforce aspect ratio correctly if user adds background image via Theme/Elementor */
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
}

/* --- ROW 1: HEADER (Image + Title/Price) --- */
.tourflow-hero-header {
	display: -ms-grid;
	display: grid;
	grid-template-columns: 350px 1fr; /* Fixed Image Col, Fluid Title */
	-ms-grid-columns: 350px 1fr;
	gap: 40px;
	-webkit-box-align: center;
	-webkit-align-items: center;
	    -ms-flex-align: center;
	        align-items: center;
}

.tourflow-header-left {
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
	-webkit-justify-content: center;
	    -ms-flex-pack: center;
	        justify-content: center; /* Center image in its column */
	-webkit-box-align: center;
	-webkit-align-items: center;
	    -ms-flex-align: center;
	        align-items: center;
}

.tourflow-hero-image {
	width: 300px !important;
	max-width: 100% !important;
	height: auto !important;
	aspect-ratio: 1 / 1 !important;
	border-radius: 50% !important;
	object-fit: cover !important;
	object-position: center !important;
	box-shadow: 0 10px 30px rgba(0,0,0,0.2) !important;
	display: block;
	-webkit-transition: -webkit-transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	transition: -webkit-transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.tourflow-hero-image:hover {
	-webkit-transform: scale(1.02);
	    -ms-transform: scale(1.02);
	        transform: scale(1.02);
}

.tourflow-gallery-badge {
	position: absolute;
	bottom: -15px; /* Extend slightly outside the circle */
	left: 50%;
	transform: translateX(-50%);
	background: rgba(18, 18, 18, 0.6);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	border: 1px solid rgba(255, 255, 255, 0.2);
	border-radius: 30px;
	padding: 8px 16px;
	display: -webkit-flex;
	display: flex;
	-webkit-align-items: center;
	align-items: center;
	-webkit-justify-content: center;
	justify-content: center;
	gap: 6px;
	color: #fff;
	font-size: 0.85rem;
	font-weight: 600;
	line-height: 1;
	box-shadow: 0 4px 15px rgba(0,0,0,0.4);
	transition: all 0.3s ease;
	z-index: 10;
	white-space: nowrap;
}

.tourflow-gallery-badge:hover {
	background: rgba(18, 18, 18, 0.9);
	transform: translateX(-50%) translateY(-2px);
	box-shadow: 0 6px 20px rgba(0,0,0,0.5);
	border-color: rgba(255, 255, 255, 0.4);
}

.tourflow-gallery-badge svg {
	width: 16px !important;
	height: 16px !important;
	flex-shrink: 0;
	opacity: 0.9;
	display: block;
}

.tourflow-gallery-badge span {
	line-height: 1;
	display: block;
	margin-top: 1px;
}

.tourflow-header-right {
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-webkit-flex-direction: column;
	    -ms-flex-direction: column;
	        flex-direction: column;
	-webkit-box-pack: center;
	-webkit-justify-content: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	-webkit-box-align: start;
	-webkit-align-items: flex-start !important;
	    -ms-flex-align: start;
	        align-items: flex-start !important; /* Force Left Align */
	text-align: left !important;
}

/* Typography Overrides for Header */
.tourflow-header-right .product_title.entry-title {
	font-size: var(--tf-single-title-size); /* Astra global H2 desktop (42px) */
	line-height: 1.1;
	margin-bottom: 15px !important;
	margin-top: 0 !important;
	text-align: left !important;
}

.tourflow-header-right .tourflow-tour-subtitle {
	font-size: 1.3rem;
	font-weight: 600;
	opacity: 0.9;
	margin-top: -5px;
	margin-bottom: 10px;
	text-align: left;
	line-height: 1.4;
}

.tourflow-header-right .tourflow-tour-subtitle p {
	margin: 0;
}

.tourflow-header-right .price {
	font-size: 2rem !important;
	font-weight: 700 !important;
	opacity: 0.9;
	margin-bottom: 0 !important;
	text-align: left !important;
}

/* --- ROW 2: BODY (Description + Booking) --- */
.tourflow-hero-body {
	display: -ms-grid;
	display: grid;
	grid-template-columns: 3fr 2fr; /* Ratio: 60% Desc, 40% Form */
	-ms-grid-columns: 3fr 2fr;
	gap: 60px;
	-webkit-box-align: start;
	-webkit-align-items: start;
	    -ms-flex-align: start;
	        align-items: start;
}

/* Force Hide Short Description (if hooks fail) */
.woocommerce-product-details__short-description {
	display: none !important;
}

.tourflow-body-left {
	/* Description Content */
	font-size: 1.1rem;
	line-height: 1.7;
	opacity: 0.9;
}

.tourflow-body-left ul {
	margin-top: 20px;
	margin-bottom: 20px;
}

.tourflow-body-right {
	/* Booking Form Container */
	display: block;
	width: 100%;
}

/* --- BOUTIQUE COMMAND CENTER (Header) --- */
/* position:sticky removed — breaks Safari stacking context inside overflow:auto overlay */
.tourflow-sticky-header {
	position: relative;
	z-index: 2;
	width: 100%;
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
	-webkit-justify-content: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	padding: 15px 20px;
	background: rgba(20, 20, 20, 0.30); /* Dark semi-transparent */
	backdrop-filter: blur(15px); /* Glassmorphism */
	-webkit-backdrop-filter: blur(15px);
	border-radius: 12px;
	border: 1px solid rgba(255, 255, 255, 0.1);
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
	margin-top: 10px; /* Slight top margin so it floats */
}

.tourflow-sticky-header .tf-header-content {
	width: 100%;
	max-width: 800px;
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-webkit-justify-content: space-between;
	    -ms-flex-pack: justify;
	        justify-content: space-between;
	-webkit-box-align: center; /* Vertical center for the whole row (details vs price) */
	-webkit-align-items: center;
	    -ms-flex-align: center;
	        align-items: center;
}

.tourflow-sticky-header .tf-header-details {
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-webkit-flex-direction: column;
	    -ms-flex-direction: column;
	        flex-direction: column;
	-webkit-box-align: start;
	-webkit-align-items: flex-start;
	    -ms-flex-align: start;
	        align-items: flex-start;
}

.tourflow-sticky-header .tf-tour-name {
	font-size: 2.2rem !important; /* Mandatory 2.2rem */
	font-weight: 700;
	color: #ffffff;
	margin: 0 0 5px 0; /* Slight bottom margin for separation */
	letter-spacing: -0.02em;
	line-height: 1;
}

.tourflow-sticky-header .tf-header-meta {
	font-size: 0.9rem;
	color: rgba(255, 255, 255, 0.7);
	margin-left: 0; /* Reset */
	margin-right: auto;
}

.tourflow-sticky-header .tourflow-sticky-total {
	font-size: 1.5rem;
	font-weight: 600;
	color: var(--ast-global-color-0); /* Teal Accent */
	text-shadow: 0 0 10px rgba(80, 227, 194, 0.3);
}

/* --- BOUTIQUE ALERTS AS FULL-SCREEN MODAL OVERLAYS --- */
.tourflow-summary-page.tourflow-boutique-alert,
.tourflow-boutique-wizard.tourflow-boutique-alert {
	position: fixed !important;
	top: 0 !important;
	left: 0 !important;
	right: 0 !important;
	bottom: 0 !important;
	width: 100vw !important;
	height: 100vh !important;
	max-height: none !important;
	overflow: hidden !important;
	z-index: 100002 !important; /* Top-most z-index to overlay sticky header/other elements */
	background: rgba(0, 0, 0, 0.85) !important; /* Semi-transparent black screen */
	backdrop-filter: blur(8px) !important;
	-webkit-backdrop-filter: blur(8px) !important;
	display: -webkit-box !important;
	display: -ms-flexbox !important;
	display: flex !important;
	-webkit-box-orient: horizontal !important;
	-webkit-box-direction: normal !important;
	    -ms-flex-direction: row !important;
	        flex-direction: row !important;
	-webkit-box-pack: center !important;
	    -ms-flex-pack: center !important;
	        justify-content: center !important;
	-webkit-box-align: center !important;
	    -ms-flex-align: center !important;
	        align-items: center !important;
	padding: 20px !important;
	box-sizing: border-box !important;
	opacity: 0;
	pointer-events: none;
	-webkit-transition: opacity 0.4s ease !important;
	transition: opacity 0.4s ease !important;
	border: none !important;
	border-radius: 0 !important;
	box-shadow: none !important;
}

.tourflow-summary-page.tourflow-boutique-alert.is-visible,
.tourflow-boutique-wizard.tourflow-boutique-alert.is-visible {
	opacity: 1 !important;
	pointer-events: auto !important;
}

/* Modal Content Box */
.tourflow-summary-page.tourflow-boutique-alert .tourflow-boutique-alert-content,
.tourflow-boutique-wizard.tourflow-boutique-alert .tourflow-boutique-alert-content {
	background: #1a1a1a !important;
	background: linear-gradient(145deg, rgba(30, 30, 30, 0.95), rgba(20, 20, 20, 0.98)) !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	box-shadow: 0 15px 40px rgba(0, 0, 0, 0.6) !important;
	border-radius: 12px !important;
	width: 100% !important;
	max-width: 400px !important;
	padding: 30px !important;
	position: relative !important;
	color: #fff !important;
	text-align: center !important;
	-webkit-transform: scale(0.9) !important;
	    -ms-transform: scale(0.9) !important;
	        transform: scale(0.9) !important;
	-webkit-transition: -webkit-transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important;
	transition: -webkit-transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important;
	transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important;
	transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), -webkit-transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important;
}

.tourflow-summary-page.tourflow-boutique-alert.is-visible .tourflow-boutique-alert-content,
.tourflow-boutique-wizard.tourflow-boutique-alert.is-visible .tourflow-boutique-alert-content {
	-webkit-transform: scale(1) !important;
	    -ms-transform: scale(1) !important;
	        transform: scale(1) !important;
}

/* Modal Title */
.tourflow-summary-page.tourflow-boutique-alert .tourflow-boutique-alert-title,
.tourflow-boutique-wizard.tourflow-boutique-alert .tourflow-boutique-alert-title {
	margin-top: 0 !important;
	margin-bottom: 12px !important;
	font-size: 1.3rem !important;
	font-weight: 600 !important;
	color: var(--ast-global-color-0, #14abc4) !important; /* Teal Accent */
	text-transform: uppercase !important;
	letter-spacing: 0.05em !important;
}

/* Close Button */
.tourflow-summary-page.tourflow-boutique-alert .tourflow-boutique-alert-close,
.tourflow-boutique-wizard.tourflow-boutique-alert .tourflow-boutique-alert-close {
	position: absolute !important;
	top: 10px !important;
	right: 15px !important;
	background: none !important;
	border: none !important;
	color: rgba(255, 255, 255, 0.7) !important;
	font-size: 1.6rem !important;
	line-height: 1 !important;
	cursor: pointer !important;
	padding: 4px 8px !important;
	-webkit-transition: color 0.2s ease !important;
	transition: color 0.2s ease !important;
	z-index: 1 !important;
}

.tourflow-summary-page.tourflow-boutique-alert .tourflow-boutique-alert-close:hover,
.tourflow-boutique-wizard.tourflow-boutique-alert .tourflow-boutique-alert-close:hover {
	color: #ffffff !important;
}

.tourflow-summary-page.tourflow-boutique-alert .tourflow-boutique-alert-message,
.tourflow-boutique-wizard.tourflow-boutique-alert .tourflow-boutique-alert-message {
	color: #eee !important;
	line-height: 1.6 !important;
	margin: 0 !important;
	font-size: 1rem !important;
	white-space: normal !important;
}



/* --- RESPONSIVE --- */
/* --- RESPONSIVE --- */
@media (max-width: 1024px) { /* Stack sooner on tablets */
	.tourflow-hero-header {
		grid-template-columns: 300px 1fr;
		-ms-grid-columns: 300px 1fr;
		gap: 30px;
	}
	.tourflow-hero-body {
		grid-template-columns: 1fr !important; /* Stack Body earlier */
		-ms-grid-columns: 1fr !important;
		gap: 30px;
	}
	/* Ensure correct order on tablet/mobile */
	.tourflow-body-left { order: 2; }
	.tourflow-body-right { order: 1; }

	/* Title tracks Astra's global H2 tablet size (34px). */
	.tourflow-header-right .product_title.entry-title {
		font-size: var(--tf-single-title-size-tablet);
	}
}

@media (max-width: 768px) {
	.tourflow-hero-header,
	.tourflow-hero-body {
		grid-template-columns: 1fr !important; /* Stack Everything */
		-ms-grid-columns: 1fr !important;
		gap: 30px;
	}

	.tourflow-header-left {
		margin-bottom: 20px;
	}

	.tourflow-header-right {
		text-align: center;
		-webkit-box-align: center;
		-webkit-align-items: center !important;
		    -ms-flex-align: center;
		        align-items: center !important;
	}
	
	.tourflow-header-right .product_title.entry-title {
		font-size: var(--tf-single-title-size-mobile); /* Astra global H2 mobile (28px) */
	}
	
	.tourflow-body-left {
		order: 2; /* Description below on mobile? */
	}
	
	.tourflow-body-right {
		order: 1; /* Booking form first? Or standard order? Standard is fine. I'll remove orders. */
		order: 0;
	}
}

/* Ensure standard gallery is hidden if it accidentally loads */
.woocommerce-product-gallery {
	display: none !important;
}

/* Hide potentially duplicate title/price if theme outputs them elsewhere */
.single-product .summary.entry-summary .product_title,
.single-product .summary.entry-summary .price {
	display: none !important; 
}

/* Ensure container doesn't clip the image and allows centering */
.woocommerce-product-gallery, 
.woocommerce-product-gallery .flex-viewport, 
.woocommerce-product-gallery .woocommerce-product-gallery__image {
	overflow: visible !important;
	text-align: center !important; /* Center inline/inline-block children */
	margin: 0 auto !important; /* Center the container itself if possible */
}

/* Layout Wrapper */
.tourflow-product-layout-wrapper {
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: row;
	flex-direction: row;
	gap: 40px; /* Increased gap */
	-webkit-align-items: flex-start;
	align-items: flex-start;
	margin-bottom: 50px; /* Astra spacing */
	width: 100%; /* Ensure full width */
	max-width: 1200px; /* Max constraint */
	margin-left: auto;
	margin-right: auto;
}

.tourflow-description-content {
	width: 60%;
	-webkit-flex: 1;
	flex: 1;
	font-size: 1.1em; /* Slight prose increase */
}

/* Booking Form */
/* Booking Form */
.tourflow-booking-form {
	/* Width controlled by Grid/Flex parent */
	margin-bottom: 2em;
	padding: 2em; /* More padding */
	background-color: var(--ast-global-color-5, #1c224b); /* Dark background from screenshot */
	color: #ffffff; /* White text for dark bg */
	border-radius: 8px; /* Softer corners */
	box-shadow: 0 4px 15px rgba(0,0,0,0.1); /* Subtle shadow */
}

/* Hide Astra Payment Icons */
.ast-single-product-payments {
	display: none !important;
}

/* Text colors inside dark booking form */
.tourflow-booking-form h3,
.tourflow-booking-form label,
.tourflow-booking-form .tourflow-payment-legend h4,
.tourflow-booking-form .tourflow-payment-legend legend {
	color: #ffffff !important;
}

/* Responsive */
@media (max-width: 921px) { /* Astra tablet breakpoint */
	.tourflow-product-layout-wrapper {
		flex-direction: column;
	}
	.tourflow-description-content,
	.tourflow-booking-form {
		width: 100%;
		flex: none;
		-webkit-flex: none;
	}
	
	.woocommerce-product-gallery .woocommerce-product-gallery__image img {
		width: 300px !important; /* Smaller on mobile */
		max-width: 100% !important;
		height: auto !important;
		aspect-ratio: 1 / 1 !important;
	}
}

/* Payment Legend Styling */
/* Payment Legend Styling */
/* .tourflow-payment-legend styles removed (empty) */

.tourflow-booking-form h3 {
	margin-top: 0;
	color: var(--ast-global-color-3, inherit); /* Theme text color */
}

/* Form Fields */
.tourflow-booking-form .form-row {
	margin-bottom: 1em;
}

.tourflow-booking-form label {
	display: block;
	font-weight: 600;
	margin-bottom: 0.5em;
	color: var(--ast-global-color-3, inherit); /* Theme text color */
}

.tourflow-booking-form input[type="text"],
.tourflow-booking-form input[type="number"],
.tourflow-booking-form input[type="date"],
.tourflow-booking-form select,
.tourflow-booking-form textarea {
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
	background-color: var(--ast-global-color-4, #ffffff); /* Theme input background */
	color: var(--ast-global-color-3, #333333); /* Theme text color */
	border: 1px solid var(--ast-border-color, #e0e0e0); /* Theme border */
}

.tourflow-booking-summary input[type="text"],
.tourflow-booking-summary input[type="number"],
.tourflow-booking-summary textarea {
	background-color: var(--ast-global-color-4, #ffffff); /* Theme input background */
	color: var(--ast-global-color-3, #333333); /* Theme text color */
	border: 1px solid var(--ast-border-color, #e0e0e0); /* Theme border */
}

/* Price Breakdown */
#tourflow-price-breakdown {
	margin: 1.5em 0;
	padding: 1em;
	background-color: var(--ast-global-color-4, #ffffff); /* Theme background */
	border: 1px solid var(--ast-border-color, #e0e0e0); /* Theme border */
	border-radius: 4px;
}

.tourflow-price-part {
	display: flex;
	justify-content: space-between;
	margin-bottom: 0.5em;
	color: var(--ast-global-color-3, inherit); /* Theme text color */
}

.tourflow-price-total {
	display: flex;
	justify-content: space-between;
	font-size: 1.2em;
	padding-top: 0.75em;
	margin-top: 0.75em;
	border-top: 2px solid var(--ast-border-color, #333); /* Theme border */
	color: var(--ast-global-color-3, inherit); /* Theme text color */
}

/* Book Now Button - inherits theme button styles */
#tourflow-book-now-button {
	width: 100%;
}

#tourflow-book-now-button.loading {
	opacity: 0.6;
	cursor: wait;
}

#tourflow-book-now-button.tourflow-contact-mode {
	background-color: #0073aa;
	border-color: #0073aa;
}

#tourflow-book-now-button.tourflow-contact-mode:hover {
	background-color: #005177;
	border-color: #005177;
}

/* Blackout Period Notice */
.tourflow-blackout-notice {
	text-align: center;
	padding: 2em 1em;
}

.tourflow-blackout-notice .woocommerce-info {
	margin-bottom: 1.5em;
	font-size: 1.05em;
	background-color: var(--ast-global-color-5, #f0f7ff); /* Theme info background */
	color: var(--ast-global-color-3, inherit); /* Theme text color */
	border-left-color: var(--ast-global-color-0, #0073aa); /* Theme accent color */
}

.tourflow-contact-button {
	width: 100%;
	max-width: 300px;
	display: inline-block;
	text-align: center;
}

/* Timeslot Container */
#tourflow-timeslot-container {
	margin-bottom: 1em;
}

#tourflow-timeslot-container label {
	display: block;
	margin-bottom: 0.5em;
}

#tourflow_timeslot {
	width: 100%;
	max-width: 100%;
}

/* Summary Page — Fixed-frame "Command Center" */
.tourflow-summary-page {
	max-width: 1000px;
	margin: 0 auto;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: column;
	flex-direction: column;
}

.tourflow-summary-page h2 {
	margin-bottom: 1em;
	color: var(--ast-global-color-3, inherit); /* Theme text color */
}

.tourflow-booking-summary {
	margin-bottom: 1.5em;
	padding: 1em;
	background-color: var(--ast-global-color-5, #f9f9f9);
	border-radius: 4px;
}

.tourflow-booking-summary h3 {
	margin-top: 0;
	margin-bottom: 0.75em;
	font-size: 1.1em;
	color: var(--ast-global-color-3, inherit); /* Theme text color */
}

.tourflow-booking-summary ul {
	list-style: none;
	padding: 0;
	margin: 0.5em 0 0 0;
}

.tourflow-booking-summary li {
	margin-bottom: 0.4em;
	padding: 0.4em 0;
	border-bottom: 1px solid var(--ast-border-color, #e0e0e0); /* Theme border */
	color: var(--ast-global-color-3, inherit); /* Theme text color */
}

.tourflow-booking-summary li:last-child {
	border-bottom: none;
	margin-bottom: 0;
}

/* Passenger Details */
#tourflow-passenger-details,
#tourflow-extras-details {
	margin-top: 5px; /* Reduced from 10px */
	padding: 0.5em 0; /* Reduced from 1em */
	/* Force Transparency to reveal Aviation Background */
	background: transparent !important;
	box-shadow: none !important;
	border: none !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}

#tourflow-passenger-details h3,
#tourflow-extras-details h3 {
	margin-top: 0;
	margin-bottom: 10px; /* Reduced from 0.75em */
	font-size: 1.1em;
	color: var(--ast-global-color-3, inherit); /* Theme text color */
}

#tourflow-passenger-details label,
#tourflow-extras-details label {
	color: var(--ast-global-color-3, inherit); /* Theme text color */
}

#tourflow-passenger-details input[type="text"],
#tourflow-passenger-details textarea,
#tourflow-extras-details input[type="text"],
#tourflow-extras-details select,
#tourflow-extras-details textarea {
	background-color: rgba(0,0,0,0.25) !important; /* Glass Dark */
	color: #ffffff !important; /* White Text */
	border: 1px solid rgba(255,255,255,0.2) !important; /* Glass Border */
	border-radius: 6px;
	padding: 8px 12px; /* Reduced padding */
	width: 100% !important;
	max-width: 100% !important;
	box-sizing: border-box !important; /* Prevent Overflow */
}

#tourflow-passenger-details .form-row {
	margin-bottom: 10px; /* Reduced from 0.75em */
}

/* Extra Groups */
.tourflow-extra-group {
	margin-bottom: 1em;
	padding: 0.75em;
	background-color: var(--ast-global-color-4, #ffffff); /* Theme background */
	border: 1px solid var(--ast-border-color, #e0e0e0); /* Theme border */
	border-radius: 4px;
}

.tourflow-extra-group h4 {
	margin-top: 0;
	margin-bottom: 0.5em;
	font-size: 1em;
	color: var(--ast-global-color-3, inherit); /* Theme text color */
}

.tourflow-extra-group p {
	margin-bottom: 0.5em;
	color: var(--ast-global-color-3, inherit); /* Theme text color */
}

.tourflow-extra-group p:last-child {
	margin-bottom: 0;
}

.tourflow-extra-group label {
	color: var(--ast-global-color-3, inherit); /* Theme text color */
}

/* Conditional Input Fields */
.tourflow-extra-conditional-field {
	margin-left: 0; /* Removed 1.5em — was causing overflow with width:100% children */
	margin-top: 0.25em; /* Reduced from 0.5em */
}

.tourflow-extra-conditional-field input[type="text"],
.tourflow-extra-conditional-field textarea,
.tourflow-extra-conditional-field select {
	background-color: var(--ast-global-color-4, #ffffff); /* Theme input background */
	color: var(--ast-global-color-3, #333333); /* Theme text color */
	border: 1px solid var(--ast-border-color, #e0e0e0); /* Theme border */
}

.tourflow-extra-conditional-field label {
	color: var(--ast-global-color-3, inherit); /* Theme text color */
}

.tourflow-char-counter {
	display: block;
	margin-top: 0.25em;
	font-size: 0.9em;
	color: var(--ast-global-color-2, #666); /* Theme muted text */
}

/* Required Field Indicator */
abbr.required {
	color: #d00;
	text-decoration: none;
	border: none;
}

/* Radio Button Labels - Theme aware */
.tourflow-radio-option,
.tourflow-radio-option span {
	color: var(--ast-global-color-3, inherit); /* Theme text color */
}

/* Voucher Section - Theme aware */
.tourflow-voucher-info,
.tourflow-voucher-code-container {
	color: var(--ast-global-color-3, inherit); /* Theme text color */
}

/* Per-product "Additional Terms" acceptance gate (only rendered when a
   product has _tourflow_require_terms='yes' + non-empty terms text). Styled
   to stand out against the dark .tourflow-booking-form background as an
   important notice, not a routine form row. */
.tourflow-product-terms-block {
	margin: 1.5em 0;
	padding: 1em 1.2em;
	border: 2px solid #e0b429;
	border-radius: 6px;
	background: rgba(224, 180, 41, 0.08);
}

.tourflow-product-terms-heading {
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	font-size: 0.85rem;
	color: #e0b429;
	margin-bottom: 0.6em;
}

.tourflow-product-terms-text {
	max-height: 220px;
	overflow-y: auto;
	margin-bottom: 1em;
	line-height: 1.5;
	color: #ffffff;
	font-size: 0.95rem;
}

.tourflow-product-terms-text p:last-child {
	margin-bottom: 0;
}

.tourflow-product-terms-checkbox-label {
	display: flex !important; /* .tourflow-booking-form label sets display:block at higher specificity */
	align-items: flex-start;
	gap: 0.6em;
	font-weight: 600;
	color: #ffffff !important; /* override .tourflow-booking-form label color rule */
	cursor: pointer;
	margin-bottom: 0;
}

.tourflow-product-terms-checkbox-label input[type="checkbox"] {
	width: auto;
	margin-top: 0.2em;
	flex: 0 0 auto;
}

.tourflow-product-terms-error {
	color: #ff6b6b;
	font-weight: 600;
	margin: 0.6em 0 0;
}

#tourflow-book-now-button:disabled,
#tourflow-book-now-button.tourflow-terms-blocked {
	opacity: 0.5;
	cursor: not-allowed;
}

/* Input Focus States */
.tourflow-booking-form input:focus,
.tourflow-booking-form select:focus,
.tourflow-booking-form textarea:focus,
.tourflow-booking-summary input:focus,
.tourflow-booking-summary textarea:focus,
#tourflow-passenger-details input:focus,
#tourflow-passenger-details textarea:focus,
#tourflow-extras-details input:focus,
#tourflow-extras-details select:focus,
#tourflow-extras-details textarea:focus {
	border-color: var(--ast-global-color-0, #0073aa); /* Theme accent/link color */
	outline: none;
}

/* RC7: Multi-Tour Checkout Fields - Theme aware */
.tourflow-checkout-tours {
	color: var(--ast-global-color-3, inherit); /* Theme text color */
}

.tourflow-checkout-tours h3 {
	color: var(--ast-global-color-3, inherit); /* Theme text color */
}

.tourflow-checkout-tours p {
	color: var(--ast-global-color-3, inherit); /* Theme text color */
}

.tourflow-checkout-tour-section {
	background: var(--ast-global-color-5, #f9f9f9); /* Theme background */
	border-color: var(--ast-border-color, #ddd); /* Theme border */
}

.tourflow-tour-header h4 {
	color: var(--ast-global-color-0, #14abc4); /* Theme accent color */
}

.tourflow-tour-header p {
	color: var(--ast-global-color-2, #666); /* Theme secondary text */
}

.tourflow-tour-details h5 {
	color: var(--ast-global-color-3, inherit); /* Theme text color */
}

.tourflow-tour-details label {
	color: var(--ast-global-color-3, inherit); /* Theme text color */
}

.tourflow-tour-details input[type="text"] {
	background-color: var(--ast-global-color-4, #ffffff); /* Theme input background */
	color: var(--ast-global-color-3, #333333); /* Theme text color */
	border: 1px solid var(--ast-border-color, #e0e0e0); /* Theme border */
}

.tourflow-tour-details input[type="text"]:focus {
	border-color: var(--ast-global-color-0, #0073aa); /* Theme accent color */
	outline: none;
}

.tourflow-toggle-icon {
	color: var(--ast-global-color-2, #999); /* Theme muted color */
}

/* Collapsible tour details hidden state */
.tourflow-tour-details.hidden {
	display: none;
}

/* ===== CART PAGE STYLING ===== */

/* Cart totals section - full container background - main-bg (#1c224b) */
.woocommerce-cart .cart_totals,
.woocommerce-cart .cart-collaterals .cart_totals,
.woocommerce-cart .cart_totals .cart-subtotal,
.woocommerce-cart .cart_totals .order-total,
.woocommerce-cart .cart_totals > div,
.woocommerce-cart .cart_totals .woocommerce-shipping-totals {
	background-color: var(--ast-global-color-4, #1c224b) !important;
}

/* Cart totals heading - main-bg (#1c224b) */
.woocommerce-cart .cart_totals h2,
.woocommerce-cart .cart-collaterals .cart_totals > h2 {
	background-color: var(--ast-global-color-4, #1c224b) !important;
	color: var(--ast-global-color-2, #ffffff) !important;
	padding: 15px 20px;
	margin: 0;
}

/* Cart totals table - main-bg (#1c224b) */
.woocommerce-cart .cart_totals table,
.woocommerce-cart .cart_totals .shop_table,
.woocommerce-cart .cart_totals table tbody,
.woocommerce-cart .cart_totals table tr {
	background-color: var(--ast-global-color-4, #1c224b) !important;
}

/* Cart totals table cells - text color */
.woocommerce-cart .cart_totals table th,
.woocommerce-cart .cart_totals table td {
	background-color: var(--ast-global-color-4, #1c224b) !important;
	color: var(--ast-global-color-3, #ecf1fe) !important;
	border-color: var(--ast-border-color, #2e3666) !important;
}

/* Cart totals - Order Total row - header text */
.woocommerce-cart .cart_totals .order-total th,
.woocommerce-cart .cart_totals .order-total td {
	background-color: var(--ast-global-color-4, #1c224b) !important;
	color: var(--ast-global-color-2, #ffffff) !important;
	font-weight: 600;
}

/* Cart shipping row — the flat-rate label ("Precio fijo: $700.00"), price amount,
   and "Enviar a ..." text. The theme colors the rate label/amount darker than the
   cell default, so force them to the light cart text color. */
.woocommerce-cart .cart_totals .woocommerce-shipping-totals td,
.woocommerce-cart .cart_totals .woocommerce-shipping-totals td *,
.woocommerce-cart .cart_totals .shipping td,
.woocommerce-cart .cart_totals .shipping td *,
.woocommerce-cart .cart_totals tr.shipping .woocommerce-Price-amount,
.woocommerce-cart .cart_totals tr.shipping .woocommerce-Price-amount bdi,
.woocommerce-cart .cart_totals .shipping ul#shipping_method li,
.woocommerce-cart .cart_totals .shipping ul#shipping_method label {
	color: var(--ast-global-color-3, #ecf1fe) !important;
}

/* Cart totals wc-proceed-to-checkout wrapper */
.woocommerce-cart .wc-proceed-to-checkout {
	background-color: var(--ast-global-color-4, #1c224b) !important;
}

/* Cart shipping calculator fields — match the dark/white input styling used on
   checkout. The .woocommerce-checkout-scoped input rules don't reach the cart
   page, so the calculator inputs/selects otherwise render with default black
   text on the dark background. Targeted by the calc_shipping_* field ids (stable
   across WC versions) plus the calculator wrapper, so it works regardless of the
   exact wrapper class name (.shipping-calculator-form vs .woocommerce-shipping-calculator). */

/* Calculator field labels — white, like the rest of the site (default is dark). */
.woocommerce-cart .woocommerce-shipping-calculator label,
.woocommerce-cart .shipping-calculator-form label,
.woocommerce-cart .woocommerce-shipping-calculator .form-row label {
	color: var(--ast-global-color-2, #ffffff) !important;
}

.woocommerce-cart .woocommerce-shipping-calculator input.input-text,
.woocommerce-cart .woocommerce-shipping-calculator select,
.woocommerce-cart .woocommerce-shipping-calculator .select2-container--default .select2-selection--single,
.woocommerce-cart #calc_shipping_state,
.woocommerce-cart #calc_shipping_city,
.woocommerce-cart #calc_shipping_postcode,
.woocommerce-cart #calc_shipping_country {
	background-color: var(--ast-global-color-5, #131739) !important;
	color: var(--ast-global-color-2, #ffffff) !important;
	border-color: var(--ast-border-color, #2e3666) !important;
	-webkit-text-fill-color: var(--ast-global-color-2, #ffffff) !important; /* Safari fix */
}

/* Select2 rendered value (country dropdown closed state) */
.woocommerce-cart .woocommerce-shipping-calculator .select2-container--default .select2-selection--single .select2-selection__rendered {
	color: var(--ast-global-color-2, #ffffff) !important;
}

/* Placeholder text */
.woocommerce-cart .woocommerce-shipping-calculator input.input-text::placeholder {
	color: var(--ast-global-color-3, #ecf1fe) !important;
	opacity: 0.6;
}

/* "Calcular envío" / Update link styling to match teal accents */
.woocommerce-cart .woocommerce-shipping-calculator .shipping-calculator-button {
	color: var(--ast-global-color-0, #14abc4) !important;
}

/* Cart shipping notice — "full address required at checkout" legend. */
.woocommerce-cart .tourflow-cart-shipping-notice {
	margin: 8px 0 0;
	font-size: 0.82rem;
	line-height: 1.4;
	color: var(--ast-global-color-3, #ecf1fe);
	opacity: 0.8;
}

/* Cart quantity counter — default renders as a white box with a dark number;
   match the site's dark-box / white-text input styling. */
.woocommerce-cart td.product-quantity input.qty,
.woocommerce-cart .quantity input.qty {
	background-color: var(--ast-global-color-5, #131739) !important;
	color: var(--ast-global-color-2, #ffffff) !important;
	border-color: var(--ast-border-color, #2e3666) !important;
	-webkit-text-fill-color: var(--ast-global-color-2, #ffffff) !important; /* Safari fix */
}

/* Continue Shopping button (cart) — sits in the cart actions row on the right,
   beside the "Update cart" button. */
.woocommerce-cart td.actions .tourflow-continue-shopping {
	float: right;
	background-color: var(--ast-global-color-0, #14abc4) !important;
	color: #ffffff !important;
	border: none;
	text-decoration: none;
}

.woocommerce-cart td.actions .tourflow-continue-shopping:hover {
	opacity: 0.9;
}

/* Consistent sizing for all cart-action buttons: Apply coupon, Continue
   shopping, Update cart. Same padding / font so they read as one toolbar. */
.woocommerce-cart td.actions .coupon .button,
.woocommerce-cart td.actions button[name="update_cart"],
.woocommerce-cart td.actions input[name="update_cart"],
.woocommerce-cart td.actions .tourflow-continue-shopping {
	padding: 0.75em 1.5em !important;
	font-weight: 600 !important;
	border-radius: 6px !important;
	font-size: 0.95rem !important;
	line-height: 1.2 !important;
}

/* Space between Continue shopping and Update cart on the right. */
.woocommerce-cart td.actions .tourflow-continue-shopping {
	margin-right: 10px;
}

/* Mobile: the desktop layout floats Continue shopping + Update cart to the right,
   which collapses on narrow screens — they don't line up and labels sit
   off-centre. Stack ONLY those two full-width, centred, with vertical spacing.
   The coupon row is left exactly as it was (not touched here). */
@media (max-width: 768px) {
	.woocommerce-cart td.actions button[name="update_cart"],
	.woocommerce-cart td.actions input[name="update_cart"],
	.woocommerce-cart td.actions .tourflow-continue-shopping {
		float: none !important;
		display: block;
		width: 100%;
		margin: 0 0 10px 0 !important;
		text-align: center !important;
	}
}

/* Cart table header - main-bg (#1c224b) */
.woocommerce-cart .shop_table thead,
.woocommerce-cart .shop_table_responsive thead,
.woocommerce-cart .woocommerce-cart-form__contents thead,
.woocommerce-cart .cart thead {
	background-color: var(--ast-global-color-4, #1c224b) !important;
}

.woocommerce-cart .shop_table thead th,
.woocommerce-cart .shop_table_responsive thead th,
.woocommerce-cart .woocommerce-cart-form__contents thead th,
.woocommerce-cart .cart thead th {
	background-color: var(--ast-global-color-4, #1c224b) !important;
	color: var(--ast-global-color-2, #ffffff) !important;
}

/* Cart products table: cleaner list. Drop the "grid" separators between rows,
   center the quantity column so plain qty numbers line up with the stepper, and
   hide the WooCommerce placeholder image for products with no real image. Scoped
   to the cart-form (products) table so the cart-totals table is untouched. */
.woocommerce-cart table.woocommerce-cart-form__contents,
.woocommerce-cart table.woocommerce-cart-form__contents td,
.woocommerce-cart table.woocommerce-cart-form__contents th {
	border: 0 !important;
}

.woocommerce-cart table.woocommerce-cart-form__contents th.product-quantity,
.woocommerce-cart table.woocommerce-cart-form__contents td.product-quantity {
	text-align: center !important;
	vertical-align: middle !important;
}

.woocommerce-cart td.product-thumbnail img.woocommerce-placeholder {
	display: none !important;
}

/* Cart item meta - labels and values */
.woocommerce-cart-form .product-name dl.variation,
.woocommerce-cart-form .product-name .wc-item-meta {
	color: var(--ast-global-color-3, #ecf1fe);
}

.woocommerce-cart-form .product-name dl.variation dt,
.woocommerce-cart-form .product-name .wc-item-meta dt {
	color: var(--ast-global-color-2, #ffffff);
	font-weight: 600;
}

.woocommerce-cart-form .product-name dl.variation dd,
.woocommerce-cart-form .product-name .wc-item-meta dd,
.woocommerce-cart-form .product-name .wc-item-meta p {
	color: var(--ast-global-color-3, #ecf1fe);
}

/* ===== CHECKOUT PAGE STYLING ===== */

/* Checkout section headings - header (#ffffff) */
.woocommerce-checkout h3,
.woocommerce-checkout h2 {
	color: var(--ast-global-color-2, #ffffff) !important;
}

/* Checkout field labels - header (#ffffff) */
.woocommerce-checkout label,
.woocommerce-checkout .form-row label {
	color: var(--ast-global-color-2, #ffffff) !important;
}

/* Checkout input fields - secondary-bg (#131739) */
.woocommerce-checkout input.input-text,
.woocommerce-checkout textarea,
.woocommerce-checkout select {
	background-color: var(--ast-global-color-5, #131739) !important;
	color: var(--ast-global-color-2, #ffffff) !important;
	border-color: var(--ast-border-color, #2e3666) !important;
	-webkit-text-fill-color: var(--ast-global-color-2, #ffffff) !important; /* Safari fix */
}

/* Checkout input placeholder text - text (#ecf1fe) */
.woocommerce-checkout input.input-text::placeholder,
.woocommerce-checkout textarea::placeholder {
	color: var(--ast-global-color-3, #ecf1fe) !important;
	opacity: 0.6;
}

/* Checkout item meta in order review */
.woocommerce-checkout .product-name dl.variation,
.woocommerce-checkout .product-name .wc-item-meta {
	color: var(--ast-global-color-3, #ecf1fe);
}

.woocommerce-checkout .product-name dl.variation dt,
.woocommerce-checkout .product-name .wc-item-meta dt {
	color: var(--ast-global-color-2, #ffffff);
	font-weight: 600;
}

.woocommerce-checkout .product-name dl.variation dd,
.woocommerce-checkout .product-name .wc-item-meta dd,
.woocommerce-checkout .product-name .wc-item-meta p {
	color: var(--ast-global-color-3, #ecf1fe);
}

/* Tour details labels in checkout - header (#ffffff) */
.tourflow-checkout-tours h3,
.tourflow-checkout-tours h5,
.tourflow-checkout-tours h6 {
	color: var(--ast-global-color-2, #ffffff) !important;
}

.tourflow-checkout-tours label {
	color: var(--ast-global-color-2, #ffffff) !important;
}

/* Tour details input fields - secondary-bg (#131739) */
.tourflow-checkout-tours input.input-text,
.tourflow-checkout-tours textarea,
.tourflow-checkout-tours select {
	background-color: var(--ast-global-color-5, #131739) !important;
	color: var(--ast-global-color-2, #ffffff) !important;
	border-color: var(--ast-border-color, #2e3666) !important;
	-webkit-text-fill-color: var(--ast-global-color-2, #ffffff) !important; /* Safari fix */
}

.tourflow-checkout-tours input.input-text::placeholder,
.tourflow-checkout-tours textarea::placeholder {
	color: var(--ast-global-color-3, #ecf1fe) !important;
	opacity: 0.6;
}

/* Extras selection - checkbox/radio inline with label */
.tourflow-extras-selection .form-row p {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0;
}

.tourflow-extras-selection input[type="checkbox"],
.tourflow-extras-selection input[type="radio"] {
	margin: 0;
	flex-shrink: 0;
}

/* Extras selection labels - text color (#ecf1fe) */
.tourflow-extras-selection label {
	color: var(--ast-global-color-3, #ecf1fe) !important;
	margin: 0;
	display: inline;
}

/* Extras conditional input fields - secondary-bg (#131739) */
.tourflow-extra-conditional-field input.input-text,
.tourflow-extra-conditional-field textarea,
.tourflow-extra-conditional-field select {
	background-color: var(--ast-global-color-5, #131739) !important;
	color: var(--ast-global-color-2, #ffffff) !important;
	border-color: var(--ast-border-color, #2e3666) !important;
	-webkit-text-fill-color: var(--ast-global-color-2, #ffffff) !important; /* Safari fix */
}

.tourflow-extra-conditional-field input.input-text::placeholder,
.tourflow-extra-conditional-field textarea::placeholder {
	color: var(--ast-global-color-3, #ecf1fe) !important;
	opacity: 0.6;
}

/* Extras conditional field labels - text color */
.tourflow-extra-conditional-field label {
	color: var(--ast-global-color-3, #ecf1fe) !important;
}

/* ===== CHECKOUT PAGE LAYOUT ===== */

/* Override Astra theme max-width constraint to allow full-width checkout */
.woocommerce-checkout .entry-content[data-ast-blocks-layout] > form.checkout,
.woocommerce-checkout .entry-content > form.checkout,
.woocommerce-checkout form.checkout {
	max-width: none !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	width: 100%;
}

/* Use CSS Grid for 2-column checkout layout — tour wizard only */
body.tourflow-has-booking-details .woocommerce-checkout form.checkout {
	display: grid;
	grid-template-columns: 54% 44%;
	gap: 2%;
	align-items: start;
}

/* Left column - Tour details (row 1, col 1) */
body.tourflow-has-booking-details .woocommerce-checkout .tourflow-checkout-tours {
	grid-column: 1;
	grid-row: 1;
}

/* Left column - Billing details (row 2, col 1) */
body.tourflow-has-booking-details .woocommerce-checkout .col2-set {
	grid-column: 1;
	grid-row: 2;
}

/* Right column - Order review heading and content span both rows */
body.tourflow-has-booking-details .woocommerce-checkout #order_review_heading {
	grid-column: 2;
	grid-row: 1 / 3;
	margin: 0 0 15px 0;
}

body.tourflow-has-booking-details .woocommerce-checkout #order_review {
	grid-column: 2;
	grid-row: 1 / 3;
	margin-top: 50px;
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
}

/* Ensure order review table uses full width of container */
body.tourflow-has-booking-details .woocommerce-checkout #order_review table {
	width: 100%;
	box-sizing: border-box;
}

/* Add spacing between header and table */
body.tourflow-has-booking-details .woocommerce-checkout table.shop_table.woocommerce-checkout-review-order-table {
	margin-top: 15px;
}

/* Desktop layout adjustments — tour wizard only */
@media (min-width: 922px) {
	body.tourflow-has-booking-details .woocommerce.woocommerce-checkout form #order_review,
	body.tourflow-has-booking-details .woocommerce.woocommerce-checkout form #order_review_heading,
	body.tourflow-has-booking-details .woocommerce-page.woocommerce-checkout form #order_review,
	body.tourflow-has-booking-details .woocommerce-page.woocommerce-checkout form #order_review_heading {
		width: 100%;
		float: right;
		margin-right: 0;
		clear: right;
	}

	body.tourflow-has-booking-details .woocommerce.woocommerce-checkout form #customer_details.col2-set .col-1,
	body.tourflow-has-booking-details .woocommerce.woocommerce-checkout form #customer_details.col2-set .col-2,
	body.tourflow-has-booking-details .woocommerce-page.woocommerce-checkout form #customer_details.col2-set .col-1,
	body.tourflow-has-booking-details .woocommerce-page.woocommerce-checkout form #customer_details.col2-set .col-2 {
		float: none;
		width: 150%;
	}
}

/* Product-only checkout: field and table theming for dark background */
body.tourflow-product-checkout .woocommerce-checkout #order_review td,
body.tourflow-product-checkout .woocommerce-checkout #order_review th {
	color: #ecf1fe !important;
	border-color: rgba(255, 255, 255, 0.1) !important;
	background: transparent !important;
}

body.tourflow-product-checkout .woocommerce-checkout #order_review .order-total td,
body.tourflow-product-checkout .woocommerce-checkout #order_review .order-total th {
	color: #ffffff !important;
	font-weight: 700;
}

body.tourflow-product-checkout .woocommerce-checkout #order_review .woocommerce-Price-amount {
	color: #ffffff !important;
}

/* Payment gateway labels and descriptions */
body.tourflow-product-checkout .woocommerce-checkout .payment_methods label,
body.tourflow-product-checkout .woocommerce-checkout .payment_box {
	color: #ecf1fe !important;
}

body.tourflow-product-checkout .woocommerce-checkout .payment_methods li {
	border-color: rgba(255, 255, 255, 0.1) !important;
	background: rgba(255, 255, 255, 0.04) !important;
}

/* Place order button */
body.tourflow-product-checkout .woocommerce-checkout #place_order {
	background: #50e3c2 !important;
	color: #0d1b3e !important;
	font-weight: 700 !important;
	border: none !important;
	border-radius: 8px !important;
	width: 100% !important;
	padding: 14px !important;
	font-size: 1rem !important;
	letter-spacing: 0.05em !important;
	cursor: pointer !important;
}

body.tourflow-product-checkout .woocommerce-checkout #place_order:hover {
	background: #3dd4b2 !important;
}

/* Terms checkbox text */
body.tourflow-product-checkout .woocommerce-checkout .woocommerce-terms-and-conditions-wrapper,
body.tourflow-product-checkout .woocommerce-checkout .woocommerce-privacy-policy-text {
	color: rgba(255, 255, 255, 0.6) !important;
	font-size: 0.8rem !important;
}

body.tourflow-product-checkout .woocommerce-checkout .woocommerce-terms-and-conditions-wrapper a {
	color: #50e3c2 !important;
}

/* Product-only checkout: 2-column layout via named grid areas.
   WC source order: #customer_details → #order_review_heading → #order_review
   Named areas pin each element regardless of source order or implicit row creation.
   High-specificity selectors mirror Astra's own rules to guarantee display:grid wins. */
/* Product-only checkout: 2-column grid — copied from wizard step 4 (tourflow-shortcodes.css L1502).
   Pattern: scope to the overlay container, target .woocommerce-checkout (the class WC puts on
   the form itself), and place direct children explicitly. */
.tourflow-product-checkout-container .woocommerce-checkout {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
	gap: 0 8% !important;
	align-items: start !important;
	box-sizing: border-box !important;
	width: 100% !important;
	max-width: 100% !important;
}

/* Customer details — flat, no card container */
.tourflow-product-checkout-container #customer_details {
	background: none !important;
	border: none !important;
	border-radius: 0 !important;
	padding: 0 !important;
	box-sizing: border-box !important;
	width: 100% !important;
	max-width: 100% !important;
}

/* Big white headings for both columns — "Datos del Cliente" and "Tu pedido" */
.tourflow-product-checkout-container #customer_details h3,
body.tourflow-product-checkout .tourflow-product-checkout-container #order_review_heading,
body.tourflow-product-checkout .tf-product-review-col #order_review_heading {
	font-size: 1.6rem !important;
	font-weight: 700 !important;
	color: #ffffff !important;
	margin: 0 0 16px !important;
	padding: 0 !important;
	border: none !important;
	letter-spacing: 0 !important;
	text-transform: none !important;
}

/* Place Order button — use brand blue (var --ast-global-color-0) instead of teal */
body.tourflow-product-checkout .woocommerce-checkout #place_order,
.tourflow-product-checkout-container #place_order {
	background: var(--ast-global-color-0) !important;
	color: #ffffff !important;
}

body.tourflow-product-checkout .woocommerce-checkout #place_order:hover,
.tourflow-product-checkout-container #place_order:hover {
	background: var(--ast-global-color-0) !important;
	filter: brightness(1.1);
}

/* BACS bank transfer box — dark background with white text */
.tourflow-product-checkout-container .payment_box,
.tourflow-product-checkout-container .payment_box.payment_method_bacs,
.tourflow-product-checkout-container ul.payment_methods .payment_box {
	background: rgba(0, 0, 0, 0.35) !important;
	color: #ffffff !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

.tourflow-product-checkout-container .payment_box *,
.tourflow-product-checkout-container .payment_box p,
.tourflow-product-checkout-container .payment_box li,
.tourflow-product-checkout-container .payment_box strong {
	color: #ffffff !important;
}

/* MercadoPago "Checkout Pro" (basic gateway) renders its OWN white content panels
   (.mp-checkout-pro-content / .mp-checkout-pro-redirect). The blanket white-text
   rule above was painting that text white-on-white — invisible. Restore MP's
   native DARK text on those white panels so the product-only checkout reads the
   same as the tour/hybrid checkout (where no blanket override applies). */
.tourflow-product-checkout-container .payment_box.payment_method_woo-mercado-pago-basic .mp-checkout-pro-content,
.tourflow-product-checkout-container .payment_box.payment_method_woo-mercado-pago-basic .mp-checkout-pro-content *,
.tourflow-product-checkout-container .payment_box.payment_method_woo-mercado-pago-basic .mp-checkout-pro-redirect,
.tourflow-product-checkout-container .payment_box.payment_method_woo-mercado-pago-basic .mp-checkout-pro-redirect * {
	color: var(--andes-gray-900, #1a1a1a) !important;
	-webkit-text-fill-color: var(--andes-gray-900, #1a1a1a) !important;
}

/* The little arrow tip that points up from the payment box — match dark bg */
.tourflow-product-checkout-container .payment_box::before,
.tourflow-product-checkout-container ul.payment_methods .payment_box::before {
	border-bottom-color: rgba(0, 0, 0, 0.35) !important;
}

/* Form inputs — match the BACS box (rgba(0,0,0,0.35) with white text and subtle border) */
body.tourflow-product-checkout .tourflow-product-checkout-container input.input-text,
body.tourflow-product-checkout .tourflow-product-checkout-container input[type="text"],
body.tourflow-product-checkout .tourflow-product-checkout-container input[type="email"],
body.tourflow-product-checkout .tourflow-product-checkout-container input[type="tel"],
body.tourflow-product-checkout .tourflow-product-checkout-container input[type="password"],
body.tourflow-product-checkout .tourflow-product-checkout-container input[type="number"],
body.tourflow-product-checkout .tourflow-product-checkout-container textarea,
body.tourflow-product-checkout .tourflow-product-checkout-container select,
body.tourflow-product-checkout .tourflow-product-checkout-container .select2-container--default .select2-selection--single,
body.tourflow-product-checkout .tourflow-product-checkout-container .select2-container--default .select2-selection--multiple {
	background-color: rgba(0, 0, 0, 0.35) !important;
	color: #ffffff !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	-webkit-text-fill-color: #ffffff !important;
}

/* Select2 dropdown trigger text */
body.tourflow-product-checkout .tourflow-product-checkout-container .select2-container--default .select2-selection--single .select2-selection__rendered {
	color: #ffffff !important;
}

/* Select2 dropdown panel itself */
.select2-dropdown.select2-dropdown--below,
.select2-dropdown.select2-dropdown--above {
	background-color: rgba(20, 20, 24, 0.98) !important;
	border-color: rgba(255, 255, 255, 0.1) !important;
}

.select2-results__option {
	color: #ffffff !important;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
	background-color: var(--ast-global-color-0) !important;
}

body.tourflow-product-checkout .tourflow-product-checkout-container input.input-text::placeholder,
body.tourflow-product-checkout .tourflow-product-checkout-container textarea::placeholder {
	color: rgba(255, 255, 255, 0.5) !important;
}

body.tourflow-product-checkout .tourflow-product-checkout-container input.input-text:focus,
body.tourflow-product-checkout .tourflow-product-checkout-container input[type="text"]:focus,
body.tourflow-product-checkout .tourflow-product-checkout-container input[type="email"]:focus,
body.tourflow-product-checkout .tourflow-product-checkout-container input[type="tel"]:focus,
body.tourflow-product-checkout .tourflow-product-checkout-container textarea:focus,
body.tourflow-product-checkout .tourflow-product-checkout-container select:focus {
	background-color: rgba(0, 0, 0, 0.5) !important;
	border-color: var(--ast-global-color-0) !important;
	outline: none !important;
}

/* Hide the tour-booking summary section — only relevant for tour checkouts, not product-only */
body.tourflow-product-checkout .tourflow-checkout-tours {
	display: none !important;
}

/* Customer Details → left column. min-width: 0 prevents content from blowing out the column. */
.tourflow-product-checkout-container #customer_details {
	grid-column: 1 !important;
	grid-row: 1 !important;
	min-width: 0 !important;
}

/* Right column wrapper (heading + order review) injected by PHP */
.tourflow-product-checkout-container .tf-product-review-col {
	grid-column: 2 !important;
	grid-row: 1 / -1 !important;
	margin-top: 0 !important;
	min-width: 0 !important;
	width: 100% !important;
}

/* Cascade neutralization — kill any global rules that try to grid-place .col2-set */
.tourflow-product-checkout-container .col2-set {
	grid-column: unset !important;
	grid-row: unset !important;
}

/* Force col-1 and col-2 inside customer_details to stack full width */
.tourflow-product-checkout-container #customer_details .col-1,
.tourflow-product-checkout-container #customer_details .col-2 {
	width: 100% !important;
	float: none !important;
	max-width: 100% !important;
	flex: 0 0 100% !important;
	min-width: 0 !important;
}

/* Form rows must also fill full width, not the WC default 48% */
.tourflow-product-checkout-container #customer_details .form-row {
	width: 100% !important;
	max-width: 100% !important;
	float: none !important;
	clear: both !important;
}

/* But name+last-name (and similar paired fields) can stay side by side */
.tourflow-product-checkout-container #customer_details .form-row-first,
.tourflow-product-checkout-container #customer_details .form-row-last {
	width: 48% !important;
	float: none !important;
	display: inline-block !important;
}

.tourflow-product-checkout-container #customer_details .form-row-first {
	margin-right: 4% !important;
}

/* Order summary heading — layout only; typography is set above (big white). */
body.tourflow-product-checkout .tourflow-product-checkout-container #order_review_heading,
body.tourflow-product-checkout .tf-product-review-col #order_review_heading {
	display: block !important;
	float: none !important;
	width: 100% !important;
	max-width: 100% !important;
	clear: both !important;
	box-sizing: border-box !important;
}

body.tourflow-product-checkout .tourflow-product-checkout-container #order_review,
body.tourflow-product-checkout .tf-product-review-col #order_review {
	display: block !important;
	float: none !important;
	width: 100% !important;
	max-width: 100% !important;
	clear: both !important;
	background: none !important;
	border: none !important;
	border-radius: 0 !important;
	padding: 0 !important;
	box-sizing: border-box !important;
}

/* Remove all dividers between rows in the order review table */
body.tourflow-product-checkout .tourflow-product-checkout-container #order_review table,
body.tourflow-product-checkout .tourflow-product-checkout-container #order_review table thead,
body.tourflow-product-checkout .tourflow-product-checkout-container #order_review table tbody,
body.tourflow-product-checkout .tourflow-product-checkout-container #order_review table tfoot,
body.tourflow-product-checkout .tourflow-product-checkout-container #order_review table tr,
body.tourflow-product-checkout .tourflow-product-checkout-container #order_review table th,
body.tourflow-product-checkout .tourflow-product-checkout-container #order_review table td {
	border: none !important;
	border-top: none !important;
	border-bottom: none !important;
	border-left: none !important;
	border-right: none !important;
	box-shadow: none !important;
	background: transparent !important;
}

/* Remove form row separators in the customer details card */
body.tourflow-product-checkout .tourflow-product-checkout-container #customer_details .form-row,
body.tourflow-product-checkout .tourflow-product-checkout-container #customer_details p,
body.tourflow-product-checkout .tourflow-product-checkout-container #customer_details fieldset,
body.tourflow-product-checkout .tourflow-product-checkout-container #customer_details legend,
body.tourflow-product-checkout .tourflow-product-checkout-container #customer_details .woocommerce-billing-fields,
body.tourflow-product-checkout .tourflow-product-checkout-container #customer_details .woocommerce-shipping-fields {
	border: none !important;
	border-top: none !important;
	border-bottom: none !important;
	box-shadow: none !important;
}

/* Remove dividers around payment methods list too */
body.tourflow-product-checkout .tourflow-product-checkout-container ul.payment_methods {
	border: none !important;
	box-shadow: none !important;
}

body.tourflow-product-checkout .tourflow-product-checkout-container ul.payment_methods li {
	border: none !important;
	border-bottom: none !important;
	box-shadow: none !important;
}

.tourflow-product-checkout-container #order_review table {
	width: 100%;
	box-sizing: border-box;
}

.tourflow-product-checkout-container table.shop_table.woocommerce-checkout-review-order-table {
	margin-top: 8px;
}

/* Mobile: stack to single column */
@media (max-width: 768px) {
	.tourflow-product-checkout-container .woocommerce-checkout {
		grid-template-columns: 1fr !important;
	}

	.tourflow-product-checkout-container #customer_details,
	.tourflow-product-checkout-container .tf-product-review-col {
		grid-column: 1 !important;
		grid-row: auto !important;
	}
}

/* Ensure tour sections don't overflow */
.woocommerce-checkout .tourflow-checkout-tour-section {
	max-width: 100%;
	box-sizing: border-box;
}

/* Compact padding and spacing */
.woocommerce-checkout .tourflow-tour-details {
	padding: 15px !important;
}

.woocommerce-checkout .tourflow-passenger-names .form-row {
	margin-bottom: 10px;
}

.woocommerce-checkout .tourflow-extras-selection {
	margin-top: 15px;
}

.woocommerce-checkout .tourflow-extras-selection .form-row {
	margin-bottom: 10px;
}

/* ========================================
   BOOKING DETAILS PAGE STYLES (Multi-tour)
   ======================================== */

/* Override Astra theme wrapper styles using body class (more reliable than :has()) */
/* Target article element */
body.tourflow-has-booking-details article,
body.tourflow-has-booking-details .ast-article-single {
	background: var(--ast-global-color-5, #131739) !important;
	background-color: var(--ast-global-color-5, #131739) !important;
}

/* Target entry-content - use dark background */
body.tourflow-has-booking-details .entry-content,
body.tourflow-has-booking-details .entry-content.clear,
body.tourflow-has-booking-details article .entry-content {
	background: var(--ast-global-color-5, #131739) !important;
	background-color: var(--ast-global-color-5, #131739) !important;
	text-align: left !important;
	padding: 20px !important;
}

/* More specific selectors for the booking details container */
body.tourflow-has-booking-details .entry-content .tourflow-booking-details-page,
body.tourflow-has-booking-details article .entry-content .tourflow-booking-details-page,
body.tourflow-has-booking-details .ast-article-single .entry-content .tourflow-booking-details-page {
	background: transparent !important;
	background-color: transparent !important;
	text-align: left !important;
}

/* Main container */
.tourflow-booking-details-page {
	max-width: 100%;
	margin: 0;
	padding: 0;
	background: transparent;
	font-family: inherit;
	text-align: left;
}

.tourflow-booking-details-page * {
	text-align: left !important;
	font-family: inherit !important;
}

.tourflow-booking-details-page h2,
.tourflow-booking-details-page h3 {
	color: var(--ast-global-color-2, #ffffff);
	margin-bottom: 8px;
	margin-top: 0;
	font-family: inherit;
	text-align: left;
}

/* Tour sections */
.tourflow-booking-details-page .tourflow-tour-section {
	background-color: var(--ast-global-color-5, #131739);
	border: 1px solid var(--ast-border-color, #2e3666);
	border-radius: 4px;
	margin-bottom: 10px;
	overflow: hidden;
}

/* Tour headers (collapsible) */
.tourflow-booking-details-page .tourflow-tour-header {
	background-color: var(--ast-global-color-4, #1c224b);
	color: var(--ast-global-color-2, #ffffff);
	padding: 8px 12px;
	margin: 0;
	font-size: 1em;
	font-weight: 600;
	cursor: pointer;
	border-bottom: 1px solid var(--ast-border-color, #2e3666);
	font-family: inherit;
	text-align: left;
}

.tourflow-booking-details-page .tourflow-tour-header:hover {
	background-color: var(--ast-global-color-5, #131739);
}

/* Tour content */
.tourflow-booking-details-page .tourflow-tour-content {
	padding: 10px 12px;
	background-color: var(--ast-global-color-5, #131739);
}

/* Booking info text */
.tourflow-booking-details-page .tourflow-tour-content p {
	color: var(--ast-global-color-3, #ecf1fe);
	margin-bottom: 4px;
	font-family: inherit;
	text-align: left;
}

.tourflow-booking-details-page .tourflow-tour-content p strong {
	color: var(--ast-global-color-2, #ffffff);
}

/* Section headings inside tour content */
.tourflow-booking-details-page .tourflow-tour-content h4,
.tourflow-booking-details-page .tourflow-tour-content h5,
.tourflow-booking-details-page .tourflow-tour-content h6 {
	color: var(--ast-global-color-2, #ffffff);
	margin-top: 8px;
	margin-bottom: 4px;
	font-size: 1em;
	font-family: inherit;
	text-align: left;
}

/* Labels */
.tourflow-booking-details-page label {
	color: var(--ast-global-color-2, #ffffff);
	font-weight: 500;
	margin-bottom: 3px;
	display: block;
	font-family: inherit;
	text-align: left;
}

/* Input fields */
.tourflow-booking-details-page input[type="text"],
.tourflow-booking-details-page input[type="email"],
.tourflow-booking-details-page input[type="tel"],
.tourflow-booking-details-page input[type="number"],
.tourflow-booking-details-page textarea,
.tourflow-booking-details-page select {
	background-color: var(--ast-global-color-5, #131739);
	color: var(--ast-global-color-2, #ffffff);
	border: 1px solid var(--ast-border-color, #2e3666);
	padding: 6px 8px;
	border-radius: 4px;
	width: 100%;
	margin-bottom: 8px;
	font-family: inherit;
	text-align: left;
	-webkit-text-fill-color: var(--ast-global-color-2, #ffffff); /* Safari fix */
}

.tourflow-booking-details-page input::placeholder,
.tourflow-booking-details-page textarea::placeholder {
	color: rgba(236, 241, 254, 0.5); /* Semi-transparent light text */
}

.tourflow-booking-details-page input:focus,
.tourflow-booking-details-page textarea:focus,
.tourflow-booking-details-page select:focus {
	border-color: var(--ast-global-color-0, #14abc4);
	outline: none;
	box-shadow: 0 0 0 2px rgba(20, 171, 196, 0.2);
}

/* Passenger name fields */
.tourflow-booking-details-page .tourflow-passenger-fields {
	margin-top: 8px;
}

.tourflow-booking-details-page .tourflow-passenger-fields .form-row {
	margin-bottom: 6px;
}

/* Extras selection */
.tourflow-booking-details-page .tourflow-extras-selection {
	margin-top: 8px;
}

.tourflow-booking-details-page .tourflow-extras-selection h6 {
	color: var(--ast-global-color-2, #ffffff);
	margin-bottom: 6px;
	font-size: 1em;
	font-family: inherit;
	text-align: left;
}

/* Checkbox and radio styles */
.tourflow-booking-details-page .tourflow-extra-item {
	margin-bottom: 6px;
	display: flex;
	align-items: flex-start;
	gap: 8px;
}

.tourflow-booking-details-page .tourflow-extra-item input[type="checkbox"],
.tourflow-booking-details-page .tourflow-extra-item input[type="radio"] {
	width: auto;
	margin: 4px 0 0 0;
	flex-shrink: 0;
}

.tourflow-booking-details-page .tourflow-extra-item label {
	margin: 0;
	flex: 1;
	color: var(--ast-global-color-3, #ecf1fe);
	font-weight: normal;
	cursor: pointer;
	font-family: inherit;
	text-align: left;
}

.tourflow-booking-details-page .tourflow-extra-item label strong {
	color: var(--ast-global-color-2, #ffffff);
	display: block;
	margin-bottom: 3px;
}

.tourflow-booking-details-page .tourflow-extra-item label .price {
	color: var(--ast-global-color-0, #14abc4);
	font-weight: 600;
}

/* Conditional input fields for extras */
.tourflow-booking-details-page .tourflow-extra-conditional-input {
	margin-top: 8px;
	padding-left: 30px;
}

.tourflow-booking-details-page .tourflow-extra-conditional-input input,
.tourflow-booking-details-page .tourflow-extra-conditional-input textarea,
.tourflow-booking-details-page .tourflow-extra-conditional-input select {
	background-color: var(--ast-global-color-4, #1c224b);
}

/* Submit button */
.tourflow-booking-details-page .tourflow-submit-button {
	margin-top: 15px;
	text-align: center;
}

.tourflow-booking-details-page button[type="submit"],
.tourflow-booking-details-page input[type="submit"] {
	background-color: var(--ast-global-color-0, #14abc4);
	color: var(--ast-global-color-2, #ffffff);
	border: none;
	padding: 12px 30px;
	font-size: 1em;
	font-weight: 600;
	border-radius: 4px;
	cursor: pointer;
	transition: background-color 0.3s ease;
	font-family: inherit;
}

.tourflow-booking-details-page button[type="submit"]:hover,
.tourflow-booking-details-page input[type="submit"]:hover {
	background-color: var(--ast-global-color-1, #108a9e);
}

/* Error messages.
   NOTE: this booking-details-scoped rule predates the global WooCommerce notice
   styling (see "GLOBAL WooCommerce notices" near the end of this file). It is
   higher specificity (0,2,0) than the global (0,1,0), so it intentionally keeps
   this page's existing flat-box look (no radius/shadow) rather than inheriting
   the global glass card. Left in place deliberately to avoid changing a page
   that was already styled. */
.tourflow-booking-details-page .woocommerce-error,
.tourflow-booking-details-page .woocommerce-info,
.tourflow-booking-details-page .woocommerce-message {
	background-color: var(--ast-global-color-5, #131739);
	color: var(--ast-global-color-3, #ecf1fe);
	border-left: 4px solid var(--ast-global-color-0, #14abc4);
	padding: 12px;
	margin-bottom: 15px;
	font-family: inherit;
	text-align: left;
}

/* ===== ORDER CONFIRMATION PAGE ===== */

/* Fix white headers on order confirmation (Thank You) page */
/* Order-details section — neutral glass card + step-3 table look.
   Single source of truth (tourflow-my-account.css mirrors these; this file
   wins via table.* specificity + load order, so the canonical styles live here). */
/* Note: .tourflow-boutique-account h2 (shortcodes.css) sets a teal !important
   color at specificity (0,1,1); we scope with .tourflow-boutique-account here to
   reach (0,2,0) and win. The plain selectors keep checkout/order-confirmation
   pages (outside the account body class) styled too. */
.tourflow-boutique-account .woocommerce-order-details__title,
.tourflow-boutique-account .woocommerce-column__title,
.woocommerce-order-details__title,
.woocommerce-column__title {
	background: transparent !important;
	background-color: transparent !important;
	color: #ffffff !important;
	padding: 0 0 12px 0 !important;
	margin: 0 0 1.25em 0 !important;
	border-radius: 0 !important;
	border-bottom: 1px solid rgba(255, 255, 255, 0.12) !important;
	font-size: 1.1rem !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.15em !important;
}

/* Order details section card — neutral grey glass. A flat dark-grey fill (rather
   than white-alpha) keeps the card neutral instead of picking up a blue cast from
   the sky background bleeding through the translucent outer pane. */
.woocommerce-order-details {
	background: rgba(38, 40, 46, 0.55) !important;
	backdrop-filter: blur(8px) !important;
	-webkit-backdrop-filter: blur(8px) !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	border-radius: 12px !important;
	margin: 0 0 2em 0 !important;
	padding: 1.75em 2em !important;
	box-shadow: none !important;
	width: 100% !important;
	max-width: none !important;
	box-sizing: border-box !important;
}

/* Order Details Table — transparent, no grid. */
table.woocommerce-table--order-details,
table.shop_table.order_details {
	background: transparent !important;
	background-color: transparent !important;
	margin: 1.25em 0 0 0 !important;
	border-radius: 0 !important;
	border: none !important;
	width: 100% !important;
}

/* Cells: airy rows, faint horizontal separators only — NO vertical divider. */
table.woocommerce-table--order-details thead,
table.woocommerce-table--order-details tbody,
table.woocommerce-table--order-details tfoot,
table.woocommerce-table--order-details tr,
table.woocommerce-table--order-details th,
table.woocommerce-table--order-details td,
table.shop_table.order_details thead,
table.shop_table.order_details tbody,
table.shop_table.order_details tfoot,
table.shop_table.order_details tr,
table.shop_table.order_details th,
table.shop_table.order_details td {
	background: transparent !important;
	background-color: transparent !important;
	color: var(--ast-global-color-3, #ecf1fe) !important;
	border: none !important;
	border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
	padding: 0.9em 0 !important;
}

/* Right-align the Total column. */
table.woocommerce-table--order-details th:last-child,
table.woocommerce-table--order-details td:last-child,
table.shop_table.order_details th:last-child,
table.shop_table.order_details td:last-child {
	text-align: right !important;
	white-space: nowrap;
}

/* Product name link + nested meta rows. */
table.woocommerce-table--order-details .product-name a,
table.shop_table.order_details .product-name a {
	color: #ffffff !important;
	font-weight: 600 !important;
}

/* Column headers (PRODUCTO / TOTAL) — teal accent. */
table.woocommerce-table--order-details thead th,
table.shop_table.order_details thead th {
	color: var(--ast-global-color-0, #14abc4) !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.15em !important;
	font-size: 0.85rem !important;
	border-bottom: 1px solid rgba(255, 255, 255, 0.12) !important;
}

table.woocommerce-table--order-details tbody tr:last-child th,
table.woocommerce-table--order-details tbody tr:last-child td,
table.shop_table.order_details tbody tr:last-child th,
table.shop_table.order_details tbody tr:last-child td {
	border-bottom: none !important;
}

/* Footer totals — label/value rhythm. */
table.woocommerce-table--order-details tfoot,
table.shop_table.order_details tfoot {
	border-top: 1px solid rgba(255, 255, 255, 0.12) !important;
}

table.woocommerce-table--order-details tfoot th,
table.shop_table.order_details tfoot th {
	color: rgba(255, 255, 255, 0.7) !important;
	font-weight: 600 !important;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	font-size: 0.85rem !important;
	border-bottom: none !important;
}

table.woocommerce-table--order-details tfoot td,
table.shop_table.order_details tfoot td {
	color: #ffffff !important;
	border-bottom: none !important;
}

/* Grand-total row emphasis. */
table.woocommerce-table--order-details tfoot tr:last-child th,
table.woocommerce-table--order-details tfoot tr:last-child td,
table.shop_table.order_details tfoot tr:last-child th,
table.shop_table.order_details tfoot tr:last-child td {
	color: var(--ast-global-color-0, #14abc4) !important;
	font-weight: 700 !important;
	font-size: 1.05rem !important;
	padding-top: 0.9em !important;
}

/* Hide the WooCommerce customer/billing-details block on the order view. */
.woocommerce-customer-details {
	display: none !important;
}

/* Responsive Design */
@media (max-width: 768px) {
	/* Switch to single column on mobile — tour wizard only */
	body.tourflow-has-booking-details .woocommerce-checkout form.checkout {
		display: block !important;
	}

	/* All elements full width and stacked */
	body.tourflow-has-booking-details .woocommerce-checkout .tourflow-checkout-tours,
	body.tourflow-has-booking-details .woocommerce-checkout .col2-set,
	body.tourflow-has-booking-details .woocommerce-checkout #order_review_heading,
	body.tourflow-has-booking-details .woocommerce-checkout #order_review {
		flex: 0 0 100% !important;
		max-width: 100% !important;
	}

	body.tourflow-has-booking-details .woocommerce-checkout #order_review {
		margin-top: 20px !important;
	}

	.tourflow-booking-form,
	.tourflow-booking-summary,
	#tourflow-passenger-details,
	#tourflow-extras-details {
		padding: 0.75em;
	}

	.tourflow-summary-page {
		padding: 0 0.5em;
	}

	.tourflow-summary-page h2 {
		font-size: 1.3em;
		margin-bottom: 0.75em;
	}

	#tourflow-passenger-details,
	#tourflow-extras-details {
		margin-top: 1em;
	}
}

/* ==========================================================================
   PRODUCT GALLERY MODAL (SKY MODAL) - RC8
   ========================================================================== */

/**
 * Sky Modal Gallery Navigation - Custom Modal System
 * Style the arrows and close button with brand color for better visibility
 */

/* Navigation arrows (left/right) */
.sky-modal-nav,
.sky-modal-prev,
.sky-modal-next {
	color: var(--ast-global-color-0, #14abc4) !important;
	background: none !important;
	background-color: transparent !important;
	opacity: 0.9 !important;
	border: none !important;
	box-shadow: none !important;
	transition: all 0.3s ease !important;
}

.sky-modal-nav:hover,
.sky-modal-prev:hover,
.sky-modal-next:hover {
	color: var(--ast-global-color-1, #108a9e) !important;
	background: none !important;
	background-color: transparent !important;
	opacity: 1 !important;
}

/* Close button */
.sky-modal-close {
	color: var(--ast-global-color-0, #14abc4) !important;
	background: none !important;
	background-color: transparent !important;
	opacity: 0.9 !important;
	border: none !important;
	box-shadow: none !important;
	transition: all 0.3s ease !important;
}

.sky-modal-close:hover {
	color: var(--ast-global-color-1, #108a9e) !important;
	background: none !important;
	background-color: transparent !important;
	opacity: 1 !important;
}

/**
 * Product Page Thumbnails Display (RC8)
 * Show thumbnails below the main product image
 */

/* Thumbnail container */
.ast-single-product-thumbnails,
.woocommerce-product-gallery-thumbnails__wrapper,
#ast-vertical-thumbnail-wrapper {
	display: flex !important;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 15px;
	justify-content: flex-start;
}

/* Individual thumbnail wrapper */
.ast-single-product-thumbnails .ast-woocommerce-product-gallery__image,
.woocommerce-product-gallery-thumbnails__wrapper .ast-woocommerce-product-gallery__image,
#ast-vertical-slider-inner .ast-woocommerce-product-gallery__image {
	flex: 0 0 auto;
	width: 80px;
	height: 80px;
	cursor: pointer;
	border: 2px solid transparent;
	border-radius: 4px;
	overflow: hidden;
	transition: all 0.3s ease;
	opacity: 0.6;
}

/* Thumbnail images */
.ast-single-product-thumbnails .ast-woocommerce-product-gallery__image img,
.woocommerce-product-gallery-thumbnails__wrapper .ast-woocommerce-product-gallery__image img,
#ast-vertical-slider-inner .ast-woocommerce-product-gallery__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

/* Hover state */
.ast-single-product-thumbnails .ast-woocommerce-product-gallery__image:hover,
.woocommerce-product-gallery-thumbnails__wrapper .ast-woocommerce-product-gallery__image:hover,
#ast-vertical-slider-inner .ast-woocommerce-product-gallery__image:hover {
	opacity: 0.9;
	border-color: var(--ast-global-color-0, #14abc4);
	transform: scale(1.05);
}

/* Active/selected thumbnail */
.ast-single-product-thumbnails .ast-woocommerce-product-gallery__image.flex-active-slide,
.woocommerce-product-gallery-thumbnails__wrapper .ast-woocommerce-product-gallery__image.flex-active-slide,
#ast-vertical-slider-inner .ast-woocommerce-product-gallery__image.flex-active-slide {
	opacity: 1;
	border-color: var(--ast-global-color-0, #14abc4);
	box-shadow: 0 0 0 1px var(--ast-global-color-0, #14abc4);
}

/* Vertical layout adjustments */
#ast-vertical-thumbnail-wrapper {
	flex-direction: column;
	max-height: 400px;
	overflow-y: auto;
}

#ast-vertical-thumbnail-wrapper .ast-woocommerce-product-gallery__image {
	width: 100%;
	max-width: 100px;
}

/* Mobile responsive */
@media (max-width: 768px) {
	.ast-single-product-thumbnails .ast-woocommerce-product-gallery__image,
	.woocommerce-product-gallery-thumbnails__wrapper .ast-woocommerce-product-gallery__image {
		width: 60px;
		height: 60px;
	}
}

/* ==========================================================================
   CART PAGE NAVIGATION BUTTONS - RC8
   ========================================================================== */

/**
 * Custom navigation buttons for cart page
 * Two buttons: "Browse Tours" and "Visit Sky Shop"
 */
.tourflow-cart-navigation {
	display: flex;
	gap: 15px;
	margin: 20px 0;
	flex-wrap: wrap;
}

.tourflow-cart-navigation .button,
.tourflow-cart-navigation a.button {
	flex: 1 1 calc(50% - 8px);
	min-width: 200px;
	padding: 12px 24px;
	font-size: 16px;
	font-weight: 600;
	text-align: center;
	text-decoration: none;
	border-radius: 4px;
	transition: all 0.3s ease;
	border: none;
	cursor: pointer;
}

.tourflow-cart-navigation .button.button-tours,
.tourflow-cart-navigation .button.button-shop {
	background-color: var(--ast-global-color-0, #14abc4);
	color: var(--ast-global-color-2, #ffffff);
	border: none;
}

.tourflow-cart-navigation .button.button-tours:hover,
.tourflow-cart-navigation .button.button-shop:hover {
	background-color: var(--ast-global-color-1, #108a9e);
}

/* Mobile responsive */
@media (max-width: 768px) {
	.tourflow-cart-navigation .button,
	.tourflow-cart-navigation a.button {
		flex: 1 1 100%;
		min-width: 100%;
	}
}

/* Hide default WooCommerce "Return to shop" button on empty cart */
.woocommerce-cart .cart-empty + .return-to-shop,
.woocommerce-cart .return-to-shop,
.cart-empty + .return-to-shop {
	display: none !important;
}

/* ========================================
   FLATPICKR CALENDAR UI POLISH
   ======================================== */

/* 1. Month/Year Visibility & Contrast */
/* Target the month dropdown and current year input to ensure text is contrasting (#131739) against white header */
.flatpickr-current-month .flatpickr-monthDropdown-months,
.flatpickr-current-month .numInputWrapper .numInput.cur-year {
    color: #131739 !important;
    font-weight: 600 !important;
}

/* Ensure dropdown options have white background and dark text */
.flatpickr-monthDropdown-months option {
    background-color: #ffffff;
    color: #131739;
}

/* 2. WebKit/Safari Compatibility */
/* Add -webkit-appearance to ensure arrow renders correctly in Safari */
.flatpickr-monthDropdown-months {
    -webkit-appearance: menulist !important;
    appearance: menulist !important;
}

/* Prevent flickering on iOS/Safari */
.flatpickr-calendar {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
}

/* 3. Widget Centering */
/* Center the inline calendar within the tourflow-booking-form container */
.flatpickr-calendar.inline {
    margin: 15px auto !important; /* Visual centering */
    display: block !important; /* Ensure block model for auto margins */
    max-width: 100%; /* Prevent overflow */
}

/* 4. Astra Theme Overrides & Cleanup */
/* Ensure input fields inside flatpickr don't inherit transparent backgrounds from global theme styles if they conflict */
.flatpickr-current-month input.cur-year {
    background: transparent !important;
}

/* ========================================
   BOOKING WIZARD PROGRESS BAR - Phase 2 Sprint B
   ======================================== */

/**
 * Progress bar for Direct Flow wizard
 * Steps: 1. Pasajeros, 2. Extras, 3. Pago
 */
.tourflow-progress-bar {
    margin-bottom: 30px;
    padding: 0;
}

.tourflow-progress-bar ul {
    display: flex;
    justify-content: space-between;
    list-style: none;
    padding: 0;
    margin: 0;
    position: relative;
}

/* Connecting line between steps */
.tourflow-progress-bar ul::before {
    content: '';
    position: absolute;
    top: 18px;
    left: 50px;
    right: 50px;
    height: 3px;
    background: var(--ast-border-color, #2e3666);
    z-index: 1;
}

.tourflow-progress-bar .tourflow-step {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    z-index: 2;
    flex: 1;
    text-align: center;
}

/* Step number circle */
.tourflow-progress-bar .step-number {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background-color: var(--ast-global-color-5, #131739);
    border: 3px solid var(--ast-border-color, #2e3666);
    color: var(--ast-global-color-3, #ecf1fe);
    font-weight: 700;
    font-size: 16px;
    margin-bottom: 8px;
    transition: all 0.3s ease;
}

/* Step label */
.tourflow-progress-bar .step-label {
    color: var(--ast-global-color-3, #ecf1fe);
    font-size: 14px;
    font-weight: 500;
    opacity: 0.7;
    transition: all 0.3s ease;
}

/* Active step */
.tourflow-progress-bar .tourflow-step.active .step-number {
    background-color: var(--ast-global-color-0, #14abc4);
    border-color: var(--ast-global-color-0, #14abc4);
    color: #ffffff;
    box-shadow: 0 0 12px rgba(20, 171, 196, 0.4);
}

.tourflow-progress-bar .tourflow-step.active .step-label {
    color: var(--ast-global-color-0, #14abc4);
    opacity: 1;
    font-weight: 600;
}

/* Completed step (optional - for future use) */
.tourflow-progress-bar .tourflow-step.completed .step-number {
    background-color: var(--ast-global-color-1, #108a9e);
    border-color: var(--ast-global-color-1, #108a9e);
    color: #ffffff;
}

.tourflow-progress-bar .tourflow-step.completed .step-label {
    color: var(--ast-global-color-1, #108a9e);
    opacity: 1;
}

/* Responsive adjustments */
@media (max-width: 480px) {
    .tourflow-progress-bar .step-number {
        width: 30px;
        height: 30px;
        font-size: 14px;
    }

    .tourflow-progress-bar .step-label {
        font-size: 12px;
    }

    .tourflow-progress-bar ul::before {
        left: 30px;
        right: 30px;
        top: 15px;
    }
}

/* =========================================
   Using Standard CSS for Wizard Styling
   ========================================= */

/* --- Wizard Container & Progress Bar --- */
.tourflow-wizard-wrapper {
	max-width: 1000px; /* Increased from 800px per user request */
	margin: 0 auto;
	padding: 20px 0;
}

.tourflow-wizard-steps {
	display: flex;
	justify-content: space-between;
	margin-bottom: 15px; /* Reduced from 30px */
	position: relative;
}

/* Progress Bar Connector Line */
.tourflow-wizard-steps::before {
	content: '';
	position: absolute;
	top: 15px; /* Half of circle height */
	left: 0;
	width: 100%;
	height: 2px;
	background: #e0e0e0;
	z-index: 0;
}

.tourflow-step {
	position: relative;
	z-index: 1;
	background: transparent; /* Changed from #fff to handle bad overlaps if necessary */
	padding: 0 10px;
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
	flex: 1;
}

/* Step Circle */
.tourflow-step-number {
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background: #e0e0e0;
	color: #666;
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: bold;
	font-size: 14px;
	transition: all 0.3s ease;
	position: relative; /* Ensure it sits on top if needed */
	z-index: 2;
    background-color: #fff; /* Ensure it covers the line */
    border: 2px solid #e0e0e0; /* Match line color or make distinct */
    box-sizing: border-box;
}

/* Step Label */
.tourflow-step-label {
	font-size: 14px;
	color: #999;
	font-weight: 500;
	transition: color 0.3s ease;
}

/* --- Active State (SkyBlue) --- */
.tourflow-step.is-active .tourflow-step-number {
	background: #87CEEB; /* SkyBlue */
	color: #fff;
	border-color: #87CEEB;
	box-shadow: 0 0 0 4px rgba(135, 206, 235, 0.2);
}

.tourflow-step.is-active .tourflow-step-label {
	color: #333;
	font-weight: 700;
}

/* --- Completed State --- */
.tourflow-step.is-completed .tourflow-step-number {
	background: #4CAF50; /* Green */
	color: #fff;
	border-color: #4CAF50;
}

/* --- Wizard Content Sections --- */
.tourflow-wizard-content {
	background: #fff;
	border-radius: 8px;
	padding: 25px;
	box-shadow: 0 5px 15px rgba(0,0,0,0.05);
	margin-bottom: 20px;
}

/* Hide inactive steps */
.tourflow-wizard-step-content {
	display: none;
	animation: fadeIn 0.4s ease-in-out;
}

.tourflow-wizard-step-content.is-active {
	display: block;
}

@keyframes fadeIn {
	from { opacity: 0; transform: translateY(10px); }
	to { opacity: 1; transform: translateY(0); }
}

/* --- Navigation Buttons --- */
.tourflow-wizard-actions {
	display: flex;
	justify-content: space-between;
	margin-top: 20px;
	border-top: 1px solid #eee;
	padding-top: 20px;
}

.tourflow-wizard-btn {
	padding: 12px 24px;
	border-radius: 4px;
	border: none;
	font-size: 16px;
	font-weight: 600;
	cursor: pointer;
	transition: all 0.2s ease;
	text-decoration: none; /* Just in case it's an anchor */
}

.tourflow-wizard-back {
	background: #f5f5f5;
	color: #666;
}

.tourflow-wizard-back:hover {
	background: #e0e0e0;
	color: #333;
}

.tourflow-wizard-next {
	background: #87CEEB; /* SkyBlue */
	color: #fff;
}

.tourflow-wizard-next:hover {
	background: #5fb8e3; /* Darker SkyBlue */
	transform: translateY(-1px);
	box-shadow: 0 4px 8px rgba(135, 206, 235, 0.3);
}

.tourflow-wizard-next:disabled {
	background: #ccc;
	cursor: not-allowed;
	transform: none;
	box-shadow: none;
}

/* Loading State */
.tourflow-wizard-next.loading {
	opacity: 0.7;
	cursor: wait;
	position: relative;
}

/* --- Alignment Utilities --- */
.tourflow-align-left .tourflow-wizard-steps {
	justify-content: flex-start;
	gap: 40px;
}
.tourflow-align-left .tourflow-step {
	flex: 0 0 auto;
}

.tourflow-align-center .tourflow-wizard-steps {
	justify-content: center;
	gap: 60px;
}
.tourflow-align-center .tourflow-step {
	flex: 0 0 auto;
}

.tourflow-align-right .tourflow-wizard-steps {
	justify-content: flex-end;
	gap: 40px;
}
.tourflow-align-right .tourflow-step {
	flex: 0 0 auto;
}

/* --- Header Styling --- */
.tourflow-wizard-header {
	text-align: center;
	margin-bottom: 30px;
}

.tourflow-wizard-title {
	font-size: 24px;
	margin-bottom: 5px;
	color: #333;
}

.tourflow-wizard-date {
	font-size: 16px;
	color: #666;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
}

/* --- FIXED BOUTIQUE ALERT & STICKY HEADER --- */

/* 1. Header - static block in the form flow */
.tourflow-sticky-header {
	position: relative;
	z-index: 2;
	margin-bottom: 20px;
}

/* Fixed-frame: header is pinned via flex-shrink: 0 (not sticky) */
.tourflow-summary-page .tourflow-sticky-header {
	flex-shrink: 0;
}

/* 2. Boutique Alert Toast - Redundant Styles Removed */


/* --- INLINE VALIDATION ERRORS --- */
.tourflow-inline-error {
	color: #d93025; /* Standard Error Red */
	font-size: 0.85rem;
	margin-top: 6px;
	font-weight: 500;
	display: flex;
	align-items: center;
	gap: 5px;
	animation: tfFadeIn 0.3s ease-out;
}

.tourflow-inline-error .dashicons {
	font-size: 16px;
	width: 16px;
	height: 16px;
}

/* Error Input State */
.tourflow-input-error {
	border-color: #d93025 !important;
	box-shadow: 0 0 0 1px rgba(217, 48, 37, 0.2) !important;
	background-color: #fff8f8 !important;
}

@keyframes tfFadeIn {
	from { opacity: 0; transform: translateY(-5px); }
	to { opacity: 1; transform: translateY(0); }
}

/* ==========================================================================
   PHASE 2, STEP 2: COMPACT 3-COLUMN DASHBOARD & COMMAND CENTER
   ========================================================================== */

/* --- Fixed-Frame Form Layout --- */
.tourflow-summary-page #tourflow-passenger-form {
	-webkit-flex: none;
	flex: none;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: column;
	flex-direction: column;
	overflow: visible;
	min-height: auto;
}

/* Progress bar pinned */
.tourflow-summary-page .tourflow-wizard-progress {
	-webkit-flex-shrink: 0;
	flex-shrink: 0;
}

/* Scrollable Step Content (DISABLED - We want Native Flow) */
.tourflow-extras-details-section,
.tourflow-passenger-details-section,
#tourflow-step-4-content {
	-webkit-flex: none;
	flex: none;
	overflow-y: visible;
	min-height: auto;
}

/* Webkit Minimalist Scrollbar */
.tourflow-extras-details-section::-webkit-scrollbar,
.tourflow-passenger-details-section::-webkit-scrollbar,
#tourflow-step-4-content::-webkit-scrollbar {
	width: 4px;
}
.tourflow-extras-details-section::-webkit-scrollbar-thumb,
.tourflow-passenger-details-section::-webkit-scrollbar-thumb,
#tourflow-step-4-content::-webkit-scrollbar-thumb {
	background: rgba(255,255,255,0.15);
	border-radius: 2px;
}
.tourflow-extras-details-section::-webkit-scrollbar-track,
.tourflow-passenger-details-section::-webkit-scrollbar-track,
#tourflow-step-4-content::-webkit-scrollbar-track {
	background: transparent;
}

/* Step 3 Crystal Backdrop (visual parity with Steps 1 & 2) */
#tourflow-step-4-content {
	background: rgba(255, 255, 255, 0.04);
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
	border-radius: 16px;
	padding: 20px;
}

/* Navigation Footer Pinned */
.tourflow-summary-page .tourflow-wizard-actions {
	-webkit-flex-shrink: 0;
	flex-shrink: 0;
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	-webkit-align-items: center;
	align-items: center;
	padding: 20px 0;
	margin-top: 0;
	border-top: 1px solid rgba(255,255,255,0.1);
}

/* Item containers within the scrollable area */
.tourflow-wizard-item-container {
	-webkit-flex: 1;
	flex: 1;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: column;
	flex-direction: column;
	min-height: 0;
}

/* --- 3-COLUMN EXTRAS GRID --- */
/* --- 3-COLUMN EXTRAS GRID (Aviation Manifest - Fixed) --- */
.tourflow-extras-grid {
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: column;
	flex-direction: column;
	gap: 0;
	width: 100%;
	/* FORCE TRANSPARENCY per Architect Directive */
	background: transparent !important;
	box-shadow: none !important;
	border: none !important;
	backdrop-filter: none !important;
	-webkit-backdrop-filter: none !important;
}

/* Individual Row (Grid Container) */
.tourflow-extra-grid-item {
	display: -ms-grid;
	display: grid;
	grid-template-columns: 3.5fr 0.8fr 1.7fr; /* Adjusted: Name (wider), Details (smaller), Price/Action (wider) */
	-ms-grid-columns: 3.5fr 0.8fr 1.7fr;
	width: 100%;
	-webkit-align-items: center;
	align-items: center;
	/* Compact Vertical Padding */
	/* Combined with .is-child-of-group logic for border */
	-webkit-transition: background-color 0.2s ease;
	transition: background-color 0.2s ease;
}

/* Remove border from absolute last item */
.tourflow-extra-grid-item:last-child {
	border-bottom: none; 
}

/* Row Hover Effect */
.tourflow-extra-grid-item:hover {
	background-color: rgba(255,255,255,0.05); /* Subtle highlight guideway */
}

/* Column 1: Name */
.tourflow-extra-grid-item .tf-extra-col-name {
	padding: 6px 12px;
	border-bottom: none; 
	display: -webkit-flex;
	display: flex;
	-webkit-align-items: center;
	align-items: center;
	gap: 8px;
	color: #fff;
	font-weight: 500;
	text-align: left;
	-webkit-justify-self: start;
	justify-self: start;
}

/* Column 2: Ver Detalles */
.tourflow-extra-grid-item .tf-extra-col-details {
	padding: 6px 8px;
	border-bottom: none;
	text-align: center;
	display: -webkit-flex;
	display: flex;
	-webkit-align-items: center;
	align-items: center;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-justify-self: center;
	justify-self: center;
}

/* Column 3: Price + Toggle */
.tourflow-extra-grid-item .tf-extra-col-action {
	padding: 6px 12px;
	border-bottom: none;
	display: -webkit-flex;
	display: flex;
	-webkit-align-items: flex-end;
	align-items: flex-end;
	-webkit-justify-content: flex-end;
	justify-content: flex-end;
	gap: 12px;
	min-height: 30px; /* Reduced from 44px */
	-webkit-justify-self: end;
	justify-self: end;
	text-align: right;
	white-space: nowrap; /* Force single line */
}

/* --- GROUP VISUAL SEPARATOR (Targeting the LAST item of a group) --- */
/* Matches item followed by header OR followed by ungrouped item OR end of list */
.tourflow-extra-grid-item.is-child-of-group:has(+ .tourflow-extra-group-header),
.tourflow-extra-grid-item.is-child-of-group:has(+ .tourflow-extra-grid-item:not(.is-child-of-group)) {
    border-bottom: 1px solid rgba(255,255,255,0.2) !important; /* Brighter separator */
    margin-bottom: 6px !important; /* Reduced from 12px */
}

/* --- TEAL SET: Restore & Center --- */
.tourflow-extra-grid-item.is-child-of-group .tf-extra-col-name {
	position: relative; /* Ensure anchor */
	padding-left: 40px; /* Hierarchy indentation */
}
.tourflow-extra-grid-item.is-child-of-group .tf-extra-col-name::before {
	display: block !important;
	content: '';
	position: absolute;
	left: 24px; /* Precise indentation alignment */
	top: 50%;
	transform: translateY(-50%); /* True Vertical Center */
	height: 16px !important; /* Fixed half-height visual */
	width: 4px; /* Thick short line */
	background: var(--ast-global-color-0);
}

/* --- Conditional Input: Full-Width Row --- */
.tourflow-extra-custom-input {
	width: 100%; /* Flex adjustment */
	/* grid-column: 1 / -1; Removed for Flex parent */
	padding: 6px 12px 10px; /* Reduced from 10px 16px 14px */
	border-bottom: 1px solid rgba(255,255,255,0.08); /* Matched 0.08 */
	background: rgba(255,255,255,0.03);
	box-sizing: border-box;
}
/* --- Booking Type Selector Redesign --- */
/* --- Booking Type Selector Redesign (Horizontal Pill) --- */
.tf-booking-type-wrapper {
	margin-bottom: 25px;
}

.tf-field-label {
	display: block;
	font-weight: 700;
	font-size: 1.1em;
	color: #fff;
	margin-bottom: 12px;
}

.tf-booking-type-options {
	display: flex;
	flex-direction: row;
	background: rgba(255, 255, 255, 0.05);
	border: 1px solid rgba(255, 255, 255, 0.1);
	border-radius: 8px; /* Container rounded pill */
	padding: 5px;
	gap: 5px;
}

.tf-booking-type-btn {
	display: block;
	cursor: pointer;
	position: relative;
	width: 100%;
	flex: 1; /* Equal 50/50 width */
	margin: 0;
}

.tf-booking-type-btn input[type="radio"] {
	position: absolute;
	opacity: 0;
	width: 0;
	height: 0;
}

.tf-btn-visual {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 14px 15px;
	border-radius: 6px; /* Inner rounded effect */
	background: transparent;
	color: rgba(255, 255, 255, 0.7); /* Dimmer unselected */
	font-size: 1.05em;
	font-weight: 600;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	text-align: center;
	height: 100%;
	box-sizing: border-box;
}

/* Hover State (Unselected) */
.tf-booking-type-btn:hover input[type="radio"]:not(:checked) + .tf-btn-visual {
	background: rgba(255, 255, 255, 0.05);
	color: #fff;
}

/* Checked State - Active Pill */
.tf-booking-type-btn input[type="radio"]:checked + .tf-btn-visual {
	background: var(--ast-global-color-0, #17a2b8); /* Teal accent */
	color: #fff;
	box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
}

/* Adjust for mobile to stack pills if screen very small */
@media (max-width: 480px) {
	.tf-booking-type-options {
		flex-direction: column;
	}
}

.tourflow-extra-custom-input .tourflow-custom-field {
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
	padding: 8px 12px; /* Slightly reduced */
	border: 1px solid rgba(255,255,255,0.15);
	border-radius: 6px;
	background: rgba(0,0,0,0.25);
	color: #fff;
	font-size: 0.95em;
	min-height: 42px; /* Fix for letters being eaten */
	line-height: 1.5; /* Fix for letters being eaten */
	-webkit-transition: border-color 0.2s ease;
	transition: border-color 0.2s ease;
}
select.tourflow-custom-field {
	appearance: auto !important; /* Ensure the dropdown arrow is visible */
	-webkit-appearance: menulist !important;
	-moz-appearance: menulist !important;
	cursor: pointer;
}
.tourflow-extra-custom-input .tourflow-custom-field:focus {
	border-color: var(--ast-global-color-0);
	outline: none;
	box-shadow: 0 0 0 2px rgba(80,227,194,0.15);
}

/* --- Group Headers: Full-Width Row --- */
.tourflow-extra-group-header {
	width: 100%; /* Flex adjustment */
	/* grid-column: 1 / -1; Removed */
	display: -webkit-flex;
	display: flex;
	-webkit-align-items: center;
	align-items: center;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	padding: 16px 12px 8px; /* Increased top padding for separation */
	border-bottom: 1px solid rgba(255,255,255,0.08);
	background: linear-gradient(to right, rgba(80,227,194,0.05), transparent); /* Subtle teal anchor */
}

.tf-group-title {
	font-weight: 700;
	color: var(--ast-global-color-0); /* High Contrast Teal per directive */
	font-size: 1.05em;
	text-transform: uppercase;
	letter-spacing: 0.05em;
}

/* --- Ver Detalles Link: Clean, Elegant, No Brackets --- */
.tourflow-view-details {
	color: rgba(255,255,255,0.6);
	text-decoration: underline;
	font-size: 0.8em;
	-webkit-transition: color 0.2s ease;
	transition: color 0.2s ease;
	border: none;
	background: none;
}
.tourflow-view-details:hover {
	color: var(--ast-global-color-0);
	text-decoration: underline;
}

/* --- Price & Toggle Visual --- */
.tf-extra-price {
	color: var(--ast-global-color-0);
	font-weight: 600;
	font-size: 0.9em;
	white-space: nowrap;
	margin-right: 12px;
	display: inline-block;
}

.tf-included {
	color: rgba(255,255,255,0.5);
	font-style: italic;
	font-weight: 400;
}

/* --- Toggle Switch Styling --- */
.tf-toggle-switch {
	position: relative;
	display: inline-block;
	width: 40px;
	height: 22px;
	-webkit-flex-shrink: 0;
	flex-shrink: 0;
}
.tf-toggle-switch input {
	opacity: 0;
	width: 0;
	height: 0;
}
.tf-slider {
	position: absolute;
	cursor: pointer;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: rgba(255,255,255,0.15);
	-webkit-transition: 0.3s;
	transition: 0.3s;
}
.tf-slider.round {
	border-radius: 22px;
}
.tf-slider::before {
	position: absolute;
	content: '';
	height: 16px;
	width: 16px;
	left: 3px;
	bottom: 3px;
	background-color: white;
	-webkit-transition: 0.3s;
	transition: 0.3s;
	border-radius: 50%;
}
.tf-toggle-switch input:checked + .tf-slider {
	background-color: var(--ast-global-color-0);
}
.tf-toggle-switch input:checked + .tf-slider::before {
	-webkit-transform: translateX(18px);
	transform: translateX(18px);
}
.tf-toggle-switch input:disabled + .tf-slider {
	opacity: 0.5;
	cursor: not-allowed;
}

/* --- SPEC CARD MODAL (Ver Detalles) --- */
.tourflow-details-content.tourflow-summary-page {
	max-width: 450px !important;
	max-height: 90vh;
	padding: 16px !important;
	border-radius: 12px;
	background: rgba(20, 20, 20, 0.95);
	-webkit-backdrop-filter: blur(15px);
	backdrop-filter: blur(15px);
	overflow-y: auto;
	/* Reset fixed-frame flex for modal */
	display: block;
	overflow: visible;
}
.tourflow-details-content img {
	border-radius: 8px;
	margin-bottom: 12px;
	width: 100%;
	height: auto;
}

/* --- T&C MODAL (RC14) --- */
.tourflow-terms-modal-overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 10001;
	background: rgba(0, 0, 0, 0.6);
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-align-items: center;
	align-items: center;
	padding: 20px;
}

.tourflow-terms-modal-content.tourflow-summary-page {
	position: relative;
	max-width: 600px;
	width: 100%;
	max-height: 80vh;
	overflow-y: auto;
	padding: 24px !important;
	border-radius: 12px;
	background: rgba(20, 20, 20, 0.95);
	-webkit-backdrop-filter: blur(15px);
	backdrop-filter: blur(15px);
	border: 1px solid rgba(255, 255, 255, 0.1);
	box-shadow: 0 10px 40px rgba(0, 0, 0, 0.5);
	color: var(--ast-global-color-3, #ecf1fe);
	/* Reset flex from .tourflow-summary-page */
	display: block;
}

.tourflow-terms-modal-close {
	position: absolute;
	top: 12px;
	right: 12px;
	background: none;
	border: none;
	color: rgba(255, 255, 255, 0.7);
	font-size: 1.8rem;
	line-height: 1;
	cursor: pointer;
	padding: 4px 8px;
	-webkit-transition: color 0.2s ease;
	transition: color 0.2s ease;
	z-index: 1;
}

.tourflow-terms-modal-close:hover {
	color: #ffffff;
}

.tourflow-terms-modal-title {
	color: var(--ast-global-color-0, #14abc4);
	font-size: 1.3rem;
	font-weight: 600;
	margin: 0 0 16px 0;
	padding-bottom: 12px;
	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.tourflow-terms-body-content {
	font-size: 0.95rem;
	line-height: 1.7;
	color: var(--ast-global-color-3, #ecf1fe);
}

/* Override page builder colors inside the dark modal */
.tourflow-terms-body-content p,
.tourflow-terms-body-content li,
.tourflow-terms-body-content span,
.tourflow-terms-body-content div {
	color: var(--ast-global-color-3, #ecf1fe) !important;
	background: transparent !important;
}

.tourflow-terms-body-content h1,
.tourflow-terms-body-content h2,
.tourflow-terms-body-content h3,
.tourflow-terms-body-content h4 {
	color: #ffffff !important;
	background: transparent !important;
}

.tourflow-terms-body-content a {
	color: var(--ast-global-color-0, #14abc4) !important;
}

/* --- STEP 3: REVIEW SUMMARY (RC14) --- */
.tourflow-review-step {
	padding: 16px;
}

.tourflow-review-title {
	color: var(--ast-global-color-0, #14abc4) !important;
	font-size: 1.3rem;
	font-weight: 600;
	margin: 0 0 20px 0;
	padding-bottom: 12px;
	border-bottom: 2px solid var(--ast-global-color-0, #14abc4) !important;
}

.tourflow-review-card {
	background: rgba(255, 255, 255, 0.04);
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
	border: 1px solid rgba(255, 255, 255, 0.08);
	border-radius: 12px;
	padding: 20px;
	margin-bottom: 20px;
}

.tourflow-review-card-title {
	color: #ffffff !important;
	font-size: 1.15rem;
	font-weight: 600;
	margin: 0 0 16px 0;
	padding-bottom: 10px;
	border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
}

.tourflow-review-row {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 8px 0;
	border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.tourflow-review-row:last-child {
	border-bottom: none;
}

.tourflow-review-label {
	font-weight: 600;
	color: rgba(255, 255, 255, 0.7);
	font-size: 0.9rem;
	text-transform: uppercase;
	letter-spacing: 0.5px;
}

.tourflow-review-value {
	color: var(--ast-global-color-3, #ecf1fe);
	font-size: 0.95rem;
}

.tourflow-review-extras {
	margin-top: 12px;
	padding-top: 12px;
	border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.tourflow-review-extra-row {
	padding: 6px 0;
	font-size: 0.9rem;
}

.tourflow-review-terms {
	margin-top: 24px;
	padding: 16px;
	background: rgba(255, 255, 255, 0.04);
	border: 1px solid rgba(255, 255, 255, 0.1);
	border-radius: 8px;
	text-align: center;
	-webkit-transition: border-color 0.3s ease;
	transition: border-color 0.3s ease;
}

.tourflow-review-terms-label {
	display: inline-flex;
	align-items: center;
	cursor: pointer;
	font-size: 0.9em;
	color: var(--ast-global-color-3, #ecf1fe);
}

/* --- RESPONSIVE: Stack Grid on Mobile --- */
@media (max-width: 600px) {
	.tourflow-extras-grid {
		grid-template-columns: 1fr;
		-ms-grid-columns: 1fr;
	}

	.tourflow-extra-grid-item .tf-extra-col-name,
	.tourflow-extra-grid-item .tf-extra-col-details,
	.tourflow-extra-grid-item .tf-extra-col-action {
		padding: 6px 12px;
	}

	.tourflow-extra-grid-item .tf-extra-col-details {
		text-align: left;
	}

	.tourflow-extra-grid-item .tf-extra-col-action {
		-webkit-justify-content: flex-start;
		justify-content: flex-start;
		padding-bottom: 12px;
		border-bottom: 1px solid rgba(255,255,255,0.1);
	}

	.tourflow-extra-custom-input {
		padding-left: 12px;
	}

	/* No height cap: the card holds all wizard content and must grow to its full height.
	   A max-height here capped the card at 85vh and pushed overflow OUTSIDE the box,
	   leaving form rows floating over the background. The fixed overlay scrolls instead. */
	.tourflow-summary-page {
		max-height: none;
	}
}


/* =========================================
   Response Grid Adjustments (Tablet & Mobile)
   ========================================= */

@media (max-width: 768px) {
    /* Safety net to prevent full page horizontal scroll */
    .tourflow-wizard-wrapper {
        max-width: 1000px;
        padding: 20px 15px;
        overflow-x: hidden; 
    }
    
    /* Wizard Steps UX: Hide inactive steps to prevent header crunch */
    .tourflow-step:not(.is-active) {
        display: none !important;
    }
    .tourflow-wizard-steps::before {
        display: none !important;
    }
    .tourflow-step.is-active {
        width: 100%;
        flex-direction: row;
        justify-content: center;
        background: rgba(255,255,255,0.05);
        padding: 10px;
        border-radius: 8px;
        border: 1px solid rgba(255,255,255,0.1);
        gap: 15px;
    }
    
    /* Option 2: Card-Based Accordion Layout */
    .tourflow-extra-grid-item {
        display: flex;
        flex-direction: column;
        background: rgba(255,255,255,0.03);
        border-radius: 8px;
        border: 1px solid rgba(255, 255, 255, 0.05) !important;
        gap: 10px;
        padding: 15px !important;
        margin-bottom: 15px;
        min-width: 0; /* Grid blowout fix */
    }
    
    .tf-extra-col-name, 
    .tf-extra-col-details {
        width: 100%;
        text-align: left !important;
        padding: 0 !important;
        white-space: normal;
        word-break: break-word;
    }
    
    .tourflow-extra-grid-item.is-child-of-group .tf-extra-col-name {
        padding-left: 0 !important; 
    }
    .tourflow-extra-grid-item.is-child-of-group .tf-extra-col-name::before {
        display: none !important;
    }
    
    /* Footer Action Row within the Card */
    .tf-extra-col-action {
        width: 100%;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        margin-top: 10px;
        padding-top: 10px;
        border-top: 1px dashed rgba(255, 255, 255, 0.1);
        white-space: normal;
        word-break: break-word;
    }
    
    .tf-extra-price {
        white-space: normal;
        word-break: break-word;
        order: 1;
        margin-right: 0;
    }
    
    .tf-manifest-check-container {
        order: 2;
    }
}

/* Remove border from checkout review order */
.woocommerce-checkout-review-order,
.woocommerce-checkout-review-order table.shop_table {
	border: none !important;
}

/* Hide duplicate add to cart buttons injected by theme or other plugins */
.single-product form.cart:not(.tourflow-booking-form form.cart):not(.tourflow-boutique-wizard form.cart) {
	display: none !important;
}

/* =========================================
   Boutique My Account Dashboard Redesign
   ========================================= */

/* Hide native navigation */
.woocommerce-MyAccount-navigation {
display: none !important;
}

/* Make content take full width since nav is hidden */
.woocommerce-MyAccount-content {
	width: 100% !important;
	float: none !important;
}

/* Hide the default WooCommerce greeting paragraphs */
.woocommerce-MyAccount-content > p:first-of-type,
.woocommerce-MyAccount-content > p:nth-of-type(2) {
	display: none !important;
}

/* Dashboard Grid Layout (2x2) */
.tourflow-account-dashboard-grid {
	display: -ms-grid;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 20px;
	margin-top: 30px;
	max-width: 800px;
	margin-left: auto;
	margin-right: auto;
}

@media (max-width: 600px) {
	.tourflow-account-dashboard-grid {
		grid-template-columns: 1fr;
	}
}

/* Reusing abstract widget styling (similar to gallery badge/glassmorphism) */
.tourflow-dashboard-card {
	background: rgba(255, 255, 255, 0.03) !important;
	background-color: rgba(255, 255, 255, 0.03) !important;
	backdrop-filter: none !important;
	-webkit-backdrop-filter: none !important;
	border: 1px solid rgba(255, 255, 255, 0.18);
	border-radius: 12px;
	padding: 40px 20px;
	text-align: center;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: column;
	flex-direction: column;
	-webkit-align-items: center;
	align-items: center;
	-webkit-justify-content: center;
	justify-content: center;
	transition: all 0.3s ease;
	text-decoration: none !important;
	color: #fff !important;
	box-shadow: 0 4px 15px rgba(0,0,0,0.05);
}

.tourflow-dashboard-card:hover {
	background: rgba(255, 255, 255, 0.06) !important;
	background-color: rgba(255, 255, 255, 0.06) !important;
	transform: translateY(-3px);
	border-color: rgba(255, 255, 255, 0.25);
	box-shadow: 0 8px 25px rgba(0,0,0,0.15);
}

.tf-card-icon {
margin-bottom: 15px;
color: var(--ast-global-color-1, #666); /* Primary theme color or fallback */
transition: color 0.3s ease;
}

.tf-card-icon svg {
width: 40px;
height: 40px;
display: block;
}

.tourflow-dashboard-card:hover .tf-card-icon {
color: #fff; /* Highlight on hover */
}

.tourflow-dashboard-card .tf-card-title,
.tourflow-dashboard-card h3.tf-card-title,
h3.tf-card-title {
	font-size: 1.1rem;
	font-weight: 600;
	margin: 0;
	line-height: 1.2;
	background: transparent !important;
	background-color: transparent !important;
	color: #fff !important;
}

/* Force transparent background on all children to prevent theme overrides */
.tourflow-dashboard-card *,
.tourflow-dashboard-card .tf-card-icon,
.tourflow-dashboard-card .tf-card-icon svg {
	background: transparent !important;
	background-color: transparent !important;
}

/* Logout row — centered below the 2-card grid */
.tourflow-logout-row {
	display: flex;
	justify-content: center;
	margin-top: 20px;
}

.tourflow-logout-row .tourflow-dashboard-card {
	max-width: 300px;
	width: 100%;
}

/* Greeting Adjustments */
.tourflow-account-greeting {
text-align: center;
margin-bottom: 40px;
}

/* =========================================
   My Account Sub-Pages Styling (Addresses, Edit Account, Orders)
   ========================================= */

.tourflow-back-btn-wrapper a:hover {
	opacity: 0.7;
}

/* Base Glassmorphism Container for Subpages */
.woocommerce-MyAccount-content > .u-columns.woocommerce-Addresses,
.woocommerce-MyAccount-content > form.woocommerce-EditAccountForm,
.woocommerce-MyAccount-content > table.woocommerce-orders-table,
.woocommerce-MyAccount-content > .woocommerce-notices-wrapper + p {
	background: transparent; /* Removed dark background to stop box-within-box */
	padding: 10px 0;
	margin-bottom: 40px;
	color: #fff;
}

/* Specific Address Columns (Direcciones) */
.u-columns.woocommerce-Addresses {
	display: -ms-grid;
	display: grid;
	grid-template-columns: 1fr; /* Only 1 column since we removed billing */
	gap: 30px;
}

@media (max-width: 768px) {
	.u-columns.woocommerce-Addresses {
		grid-template-columns: 1fr;
	}
}

.u-columns.woocommerce-Addresses .u-column1,
.u-columns.woocommerce-Addresses .u-column2 {
	width: 100%;
	float: none;
	background: rgba(255, 255, 255, 0.02) !important;
	backdrop-filter: blur(16px) !important;
	-webkit-backdrop-filter: blur(16px) !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	border-radius: 12px !important;
	padding: 30px !important;
}

/* Hard reset for the blue text backgrounds from Astra */
.woocommerce-MyAccount-content h1,
.woocommerce-MyAccount-content h2,
.woocommerce-MyAccount-content h3,
.woocommerce-MyAccount-content p,
.woocommerce-MyAccount-content address,
.woocommerce-MyAccount-content mark,
.woocommerce-MyAccount-content span:not(.flag),
.woocommerce-MyAccount-content label,
.woocommerce-MyAccount-content strong {
	background-color: transparent !important;
	background: transparent !important;
}

/* Address Headers */
.woocommerce-Address-title h2 {
	font-size: 1.2rem;
	font-weight: 600;
	margin-bottom: 25px;
	color: #fff;
	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
	padding-bottom: 10px;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

/* Re-style "Edit" link inside Addresses */
.woocommerce-Address-title a.edit {
	font-size: 0.85rem;
	color: var(--ast-global-color-0, #14abc4);
	text-decoration: none;
	background: rgba(20, 171, 196, 0.1);
	padding: 4px 12px;
	border-radius: 20px;
	transition: background 0.2s;
}

.woocommerce-Address-title a.edit:hover {
	background: rgba(20, 171, 196, 0.2);
}

/* Address Content Text */
.woocommerce-Address address {
	font-style: normal;
	line-height: 1.6;
	color: rgba(255, 255, 255, 0.8);
	margin-top: 15px;
}

/* Fix Input styles in Edit Account & Addresses forms */
.woocommerce-MyAccount-content form .woocommerce-Input {
	background: rgba(255, 255, 255, 0.05);
	border: 1px solid rgba(255, 255, 255, 0.1);
	color: #fff;
	border-radius: 6px;
	padding: 12px;
	width: 100%;
}

.woocommerce-MyAccount-content form .woocommerce-Input:focus {
	border-color: var(--ast-global-color-0, #14abc4);
	outline: none;
}

.woocommerce-MyAccount-content form label {
	color: rgba(255, 255, 255, 0.9);
	font-weight: 500;
	margin-bottom: 6px;
	display: block;
}

/* ==========================================================================
   PHASE 3c: PRODUCT-ONLY CHECKOUT OVERLAY (SkyShop glassmorphism experience)
   Applied when body has .tourflow-product-checkout class
   ========================================================================== */

/* Background lives on body so the page scrolls naturally */
body.tourflow-product-checkout {
	background-color: #131739;
	background-size: cover;
	background-position: center;
	background-attachment: fixed;
}

/* Scrim overlay: pseudo-element on body so it never traps scroll */
body.tourflow-product-checkout::before {
	content: '';
	position: fixed;
	inset: 0;
	background: rgba(0, 0, 0, 0.55);
	z-index: 0;
	pointer-events: none;
}

/* Overlay wrapper is now a plain block — no fixed positioning */
.tourflow-product-checkout-overlay {
	position: relative;
	z-index: 1;
}

.tourflow-product-checkout-overlay .tourflow-product-checkout-scrim {
	display: none; /* scrim is now handled by body::before */
}

.tourflow-product-checkout-overlay .tourflow-product-checkout-container {
	position: relative;
	z-index: 1;
	max-width: 960px;
	margin: 0 auto;
	padding: 40px 20px 60px;
}

/* The native WC checkout form sits inside the container */
.tourflow-product-checkout .woocommerce {
	position: relative;
	z-index: 1;
}

/* Header bar: "Payment Method" legend + coupon link + login link */
.tourflow-product-checkout-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding-bottom: 10px;
	margin-bottom: 8px;
	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.tourflow-product-checkout-legend {
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.7);
}

.tourflow-product-checkout-coupon-trigger {
	font-size: 0.8rem;
	color: #50e3c2;
	text-decoration: none;
	border-bottom: 1px dashed #50e3c2;
}

.tourflow-product-checkout-login {
	font-size: 0.85rem;
	color: rgba(255, 255, 255, 0.7);
	margin-bottom: 16px;
}

.tourflow-product-checkout-login-link {
	color: #50e3c2;
	text-decoration: none;
	border-bottom: 1px dashed #50e3c2;
}

/* Suppress native WC login/coupon banner toggles and login form entirely */
.tourflow-product-checkout .woocommerce-form-login-toggle,
.tourflow-product-checkout .woocommerce-form-coupon-toggle,
.tourflow-product-checkout .woocommerce-form-login {
	display: none !important;
}

/* Coupon form: hidden by default, toggled by JS */
.tourflow-product-checkout .woocommerce-form-coupon {
	display: none;
	background: rgba(255, 255, 255, 0.05) !important;
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
	border-radius: 8px !important;
	padding: 16px !important;
	margin-bottom: 16px !important;
}

/* Glassmorphism form wrapper */
.tourflow-product-checkout form.checkout {
	background: rgba(255, 255, 255, 0.07) !important;
	backdrop-filter: blur(12px) !important;
	-webkit-backdrop-filter: blur(12px) !important;
	border: 1px solid rgba(255, 255, 255, 0.04) !important;
	border-radius: 16px !important;
	padding: 32px !important;
}

/* Step badge pseudo-elements — labels come from PHP via data-* attributes */
.tourflow-product-checkout #customer_details::before {
	content: attr(data-tf-step-label);
	display: block;
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: #50e3c2;
	margin-bottom: 16px;
}

.tourflow-product-checkout #order_review_heading::before {
	content: attr(data-tf-step-label);
	display: block;
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: #50e3c2;
	margin-bottom: 8px;
}

/* Wizard step 4 — same pattern, independent strings */
.tourflow-has-booking-details #customer_details::before {
	content: attr(data-tf-step-label);
	display: block;
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: #50e3c2;
	margin-bottom: 16px;
}

.tourflow-has-booking-details #order_review_heading::before {
	content: attr(data-tf-step-label);
	display: block;
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: #50e3c2;
	margin-bottom: 8px;
}

/* Shipping row: make it visually prominent with teal accent */
.tourflow-product-checkout .woocommerce-shipping-totals th,
.tourflow-product-checkout .woocommerce-shipping-totals td,
.tourflow-product-checkout .cart-subtotal.woocommerce-shipping-totals th {
	color: #50e3c2 !important;
	font-weight: 600;
}

.tourflow-product-checkout #shipping_method li label {
	color: rgba(255, 255, 255, 0.9) !important;
}

/* ==========================================================================
   PHASES 4 & 5: ORDER CONFIRMATION BLOCK (Tour + Product Thank You pages)
   ========================================================================== */

.tourflow-order-confirmation {
	font-family: 'Inter', sans-serif;
	max-width: 720px;
	margin: 32px auto;
	border-radius: 16px;
	overflow: hidden;
	background: rgba(255, 255, 255, 0.08);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	border: 1px solid rgba(255, 255, 255, 0.15);
	color: #ecf1fe;
}

.tf-confirmation-header {
	background: linear-gradient(135deg, #0d1b3e 0%, #1c224b 100%);
	text-align: center;
	padding: 36px 24px 28px;
	border-bottom: 1px solid rgba(80, 227, 194, 0.3);
}

.tf-print-logo { display: none; }

.tf-confirmation-icon {
	font-size: 2.5rem;
	margin-bottom: 12px;
}

.tf-confirmation-title {
	font-size: 1.6rem;
	font-weight: 700;
	color: #ffffff !important;
	margin: 0 0 8px !important;
}

.tf-confirmation-ref {
	font-size: 0.85rem;
	color: #50e3c2;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	margin: 0;
}

/* Unpaid BACS alert */
.tf-confirmation-alert {
	margin: 0;
	padding: 20px 24px;
	border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.tf-alert-warning {
	background: rgba(255, 165, 0, 0.12);
	border-left: 4px solid #ffa500;
}

.tf-alert-warning > strong {
	color: #ffc966;
	display: block;
	margin-bottom: 8px;
	font-size: 0.95rem;
}

.tf-alert-warning p {
	color: rgba(255, 255, 255, 0.8);
	font-size: 0.88rem;
	margin: 0 0 12px;
}

.tf-alert-warning p strong {
	display: inline !important;
	color: inherit;
	font-size: inherit;
	margin: 0;
}

.tf-bacs-details h4 {
	color: #50e3c2;
	font-size: 0.85rem;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	margin: 12px 0 8px;
}

.tf-bacs-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 0.85rem;
}

.tf-bacs-table th,
.tf-bacs-table td {
	padding: 6px 10px;
	border-bottom: 1px solid rgba(255, 255, 255, 0.07);
	color: rgba(255, 255, 255, 0.85);
}

.tf-bacs-table th {
	font-weight: 600;
	color: rgba(255, 255, 255, 0.55);
	text-align: left;
	width: 42%;
}

/* Order-confirmation callouts (page). Email uses matching inline styles built
   from the same palette — see TourFlow_Settings::callout_inline_style(). */
.tf-callout {
	border-radius: 8px;
	padding: 12px 16px;
	margin: 12px 0;
	border: 1px solid transparent;
}

.tf-callout--warning {
	background: rgba(255, 193, 7, 0.12);
	border-color: rgba(255, 193, 7, 0.5);
	color: #ffc107;
}

.tf-callout--info {
	background: rgba(20, 171, 196, 0.12);
	border-color: rgba(20, 171, 196, 0.5);
	color: #14abc4;
}

.tf-callout--success {
	background: rgba(40, 167, 69, 0.12);
	border-color: rgba(40, 167, 69, 0.5);
	color: #28a745;
}

/* Content cards */
.tf-confirmation-card {
	padding: 20px 24px;
	border-bottom: 1px solid rgba(255, 255, 255, 0.07);
}

.tf-confirmation-card h3 {
	font-size: 1rem;
	font-weight: 600;
	color: #ffffff !important;
	margin: 0 0 14px !important;
}

.tf-confirmation-tour-name {
	color: #50e3c2 !important;
}

/* Detail rows (date / time / passengers) */
.tf-confirmation-details {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.tf-detail-row {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	font-size: 0.88rem;
	gap: 8px;
}

.tf-detail-label {
	color: rgba(255, 255, 255, 0.55);
	flex-shrink: 0;
}

.tf-detail-value {
	color: rgba(255, 255, 255, 0.9);
	text-align: right;
}

/* Shipping row highlight */
.tf-shipping-row .tf-detail-label,
.tf-shipping-row .tf-detail-value {
	color: #50e3c2;
	font-weight: 600;
}

/* Items table (product confirmation) */
.tf-order-items-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 0.88rem;
	margin-bottom: 16px;
}

.tf-order-items-table th {
	text-align: left;
	padding: 6px 8px;
	color: rgba(255, 255, 255, 0.5);
	font-weight: 600;
	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
	font-size: 0.75rem;
	text-transform: uppercase;
	letter-spacing: 0.06em;
}

.tf-order-items-table td {
	padding: 8px;
	color: rgba(255, 255, 255, 0.85);
	border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.tf-order-totals {
	margin-top: 12px;
	padding-top: 12px;
	border-top: 1px solid rgba(255, 255, 255, 0.1);
	display: flex;
	flex-direction: column;
	gap: 8px;
}

/* Shipping address */
.tf-shipping-address {
	font-style: normal;
	font-size: 0.88rem;
	color: rgba(255, 255, 255, 0.8);
	line-height: 1.6;
}

/* Grand total footer */
.tf-confirmation-total {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 18px 24px;
	background: rgba(80, 227, 194, 0.08);
	border-top: 1px solid rgba(80, 227, 194, 0.2);
	font-size: 1rem;
	font-weight: 700;
}

.tf-confirmation-total span {
	color: rgba(255, 255, 255, 0.7);
}

.tf-confirmation-total strong {
	color: #50e3c2;
	font-size: 1.2rem;
}

/* Print / actions bar */
.tf-confirmation-actions {
	display: flex;
	justify-content: center;
	padding: 20px 24px;
	gap: 12px;
}

.tf-print-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 10px 24px;
	background: transparent;
	border: 1.5px solid rgba(80, 227, 194, 0.5);
	border-radius: 8px;
	color: #50e3c2;
	font-size: 0.88rem;
	font-weight: 600;
	cursor: pointer;
	transition: background 0.2s, border-color 0.2s;
}

.tf-print-btn:hover {
	background: rgba(80, 227, 194, 0.1);
	border-color: #50e3c2;
}

/* Thank You page: make it not look cut off on the order-received page */
.woocommerce-order-received .tourflow-order-confirmation {
	margin-top: 0;
}

/* Thank You page: hide WC's redundant native elements — our block covers everything */
.tourflow-boutique-wizard.woocommerce-order-received h1.entry-title,
.tourflow-boutique-wizard.woocommerce-order-received .entry-header h1,
.tourflow-boutique-wizard.woocommerce-order-received .uagb-heading-text {
	visibility: hidden !important;
}

.tourflow-boutique-wizard.woocommerce-order-received .woocommerce-notice,
.tourflow-boutique-wizard.woocommerce-order-received .woocommerce-thankyou-order-received,
.tourflow-boutique-wizard.woocommerce-order-received .woocommerce-order-overview,
.tourflow-boutique-wizard.woocommerce-order-received .woocommerce-customer-details,
.tourflow-boutique-wizard.woocommerce-order-received .woocommerce-order-details,
.tourflow-boutique-wizard.woocommerce-order-received .woocommerce-bacs-bank-details,
.tourflow-boutique-wizard.woocommerce-order-received .wc-bacs-bank-details,
.tourflow-boutique-wizard.woocommerce-order-received .woocommerce > p:not(.tourflow-order-confirmation),
.tourflow-boutique-wizard.woocommerce-order-received .woocommerce > ul:not(.tourflow-order-confirmation),
.tourflow-boutique-wizard.woocommerce-order-received .woocommerce > section:not(.tourflow-order-confirmation) {
	display: none !important;
}

/* BACS instructions text inside the alert */
.tf-bacs-instructions {
	margin-top: 12px;
	padding-top: 10px;
	border-top: 1px solid rgba(255, 255, 255, 0.1);
	font-size: 0.83rem;
	color: rgba(255, 255, 255, 0.75);
	line-height: 1.6;
}

.tf-bacs-instructions p {
	margin: 0 0 6px;
}


/* ==========================================================================
   PRINT STYLES — targeted hide, block stays in normal flow (multi-page safe)
   ========================================================================== */

@media print {
	/* ---- Hide site chrome ---- */
	header, footer, nav,
	.site-header, .site-footer,
	#wpadminbar,
	.ast-masthead-custom-menu-items,
	.ast-above-header-wrap,
	.ast-below-header-wrap,
	.main-navigation,
	.tourflow-print-btn,
	.tf-print-btn,
	.tf-confirmation-actions { display: none !important; }

	/* ---- Hide floating widgets (WhatsApp, Social Networks, etc) ---- */
	.joinchat,
	.wp-socializer,
	[class*="joinchat"],
	[class*="wp-socializer"],
	[class*="wpsr-"] { display: none !important; }

	/* ---- Hide WC page boilerplate that sits above our block ---- */
	h1.entry-title,
	p.woocommerce-thankyou-order-received,
	.woocommerce-order-overview,
	.woocommerce-order-details,
	.woocommerce-customer-details,
	/* WC BACS native bank details box (belt-and-suspenders; also removed via PHP) */
	.wc-bacs-bank-details,
	.woocommerce-bacs-bank-details { display: none !important; }

	/* ---- Our block: stay in normal flow, plain page styles ---- */
	#tourflow-order-confirmation {
		display: block !important;
		position: static !important;   /* CRITICAL: static = multi-page pagination works */
		width: 100% !important;
		max-width: 100% !important;
		margin: 0 !important;
		padding: 0 !important;
		background: #fff !important;
		color: #000 !important;
		border: none !important;
		border-radius: 0 !important;
		box-shadow: none !important;
		backdrop-filter: none !important;
		-webkit-backdrop-filter: none !important;
		font-family: Georgia, 'Times New Roman', serif !important;
		font-size: 11pt !important;
		line-height: 1.5 !important;
	}

	/* Reset all link colours inside our block */
	#tourflow-order-confirmation a,
	#tourflow-order-confirmation a:visited {
		color: #000 !important;
		text-decoration: none !important;
	}

	/* Header */
	.tf-confirmation-header {
		background: none !important;
		border-bottom: 2px solid #000 !important;
		padding: 12pt 0 8pt !important;
		text-align: left !important;
		position: relative !important;
	}

	.tf-confirmation-icon { display: none !important; }

	.tf-print-logo {
		display: block !important;
		position: absolute !important;
		top: 0 !important;
		right: 0 !important;
	}

	.tf-print-logo img {
		display: block !important;
		height: 48pt !important;
		width: auto !important;
		max-width: 160pt !important;
	}

	.tf-confirmation-title {
		font-size: 16pt !important;
		font-weight: bold !important;
		color: #000 !important;
		margin: 0 0 4pt !important;
	}

	.tf-confirmation-ref {
		font-size: 10pt !important;
		color: #000 !important;
		letter-spacing: 0 !important;
		text-transform: none !important;
		font-style: italic !important;
	}

	/* Cards */
	.tf-confirmation-card {
		border: 1px solid #999 !important;
		border-radius: 0 !important;
		padding: 8pt 10pt !important;
		margin-bottom: 8pt !important;
		background: none !important;
		page-break-inside: avoid;
		break-inside: avoid;
	}

	.tf-confirmation-card h3 {
		font-size: 11pt !important;
		font-weight: bold !important;
		color: #000 !important;
		border-bottom: 1px solid #ccc !important;
		padding-bottom: 4pt !important;
		margin-bottom: 6pt !important;
	}

	.tf-confirmation-tour-name { color: #000 !important; }

	/* Detail rows */
	.tf-detail-row {
		border-bottom: 1px dotted #ccc !important;
		padding: 3pt 0 !important;
	}

	.tf-detail-label { color: #444 !important; font-size: 10pt !important; }
	.tf-detail-value { color: #000 !important; font-size: 10pt !important; }

	/* BACS alert */
	.tf-confirmation-alert {
		border: 1.5px solid #000 !important;
		background: none !important;
		padding: 8pt 10pt !important;
		margin-bottom: 8pt !important;
		page-break-inside: avoid;
		break-inside: avoid;
	}

	.tf-alert-warning { border-left: none !important; background: none !important; }
	.tf-alert-warning > strong { color: #000 !important; font-size: 11pt !important; }
	.tf-alert-warning p    { color: #000 !important; font-size: 10pt !important; }
	.tf-alert-warning p strong { display: inline !important; color: inherit !important; font-size: inherit !important; }

	/* Callout box (TourFlow_Settings::render_callout()). The screen palette's
	   rgba background + colored text (e.g. #ffc107 yellow) either doesn't
	   print (browsers omit background graphics by default) or reads as
	   low-contrast on white paper, so print gets the same plain
	   border/no-fill treatment as .tf-confirmation-alert above. */
	.tf-callout {
		background: none !important;
		border: 1.5px solid #000 !important;
		color: #000 !important;
		padding: 8pt 10pt !important;
		font-size: 10pt !important;
	}

	/* BACS table */
	.tf-bacs-details h4 {
		color: #000 !important;
		font-size: 10pt !important;
		text-transform: none !important;
		letter-spacing: 0 !important;
		font-weight: bold !important;
		margin-top: 8pt !important;
	}

	.tf-bacs-table {
		width: 100% !important;
		border-collapse: collapse !important;
	}

	.tf-bacs-table th,
	.tf-bacs-table td {
		border: 1px solid #999 !important;
		padding: 4pt 6pt !important;
		color: #000 !important;
		font-size: 9.5pt !important;
		background: none !important;
	}

	.tf-bacs-table th {
		font-weight: bold !important;
		background: #efefef !important;
		-webkit-print-color-adjust: exact;
		print-color-adjust: exact;
	}

	.tf-bacs-instructions {
		color: #000 !important;
		font-size: 10pt !important;
		border-top: 1px solid #ccc !important;
		margin-top: 6pt !important;
		padding-top: 6pt !important;
	}

	/* Items table */
	.tf-order-items-table {
		width: 100% !important;
		border-collapse: collapse !important;
		margin-bottom: 6pt !important;
	}

	.tf-order-items-table th {
		border: 1px solid #999 !important;
		padding: 4pt 6pt !important;
		font-size: 9pt !important;
		font-weight: bold !important;
		color: #000 !important;
		background: #efefef !important;
		text-transform: none !important;
		letter-spacing: 0 !important;
		-webkit-print-color-adjust: exact;
		print-color-adjust: exact;
	}

	.tf-order-items-table td {
		border: 1px solid #ccc !important;
		padding: 4pt 6pt !important;
		font-size: 10pt !important;
		color: #000 !important;
		background: none !important;
	}

	/* Totals */
	.tf-order-totals {
		border-top: 1px solid #ccc !important;
		padding-top: 4pt !important;
		margin-top: 4pt !important;
	}

	.tf-shipping-row .tf-detail-label,
	.tf-shipping-row .tf-detail-value {
		color: #000 !important;
		font-weight: bold !important;
	}

	/* Grand total */
	.tf-confirmation-total {
		background: none !important;
		border-top: 2px solid #000 !important;
		padding: 8pt 0 !important;
		font-size: 12pt !important;
	}

	.tf-confirmation-total span,
	.tf-confirmation-total strong { color: #000 !important; }

	/* Shipping address */
	.tf-shipping-address { color: #000 !important; font-size: 10pt !important; }

	@page {
		margin: 1.5cm;
		size: A4 portrait;
	}
}

/* =============================================================================
   MERCADO PAGO PAYMENT BOX OVERRIDES (Path A)
   --------------------------------------------------------------------------
   Lets MP's custom-checkout form render with its own native input styling
   inside our dark TourFlow booking-details / checkout wrapper. Without these
   rules, our slim-checkout color/background cascade paints MP's inputs
   white-on-white and the labels stay invisible.

   Anchored on `.payment_method_woo-mercado-pago-custom` (MP gateway's own
   payment_box <li>) so it works under both body.tourflow-has-booking-details
   AND .tourflow-booking-details-page wrappers without relying on either.

   PCI iframes (card #, expiration, security code) remain MP-default light —
   that's by design; parent CSS cannot reach iframe content (PCI sandbox).
   ========================================================================== */

/* 1. MP labels / helpers / privacy text — readable WHITE on the dark wrapper.
      We give MP labels a strong selector that beats both our generic
      slim-checkout color cascades and MP's own `mp-input-label{color:gray}`. */
.payment_box.payment_method_woo-mercado-pago-custom input-label,
.payment_box.payment_method_woo-mercado-pago-custom input-label *,
.payment_box.payment_method_woo-mercado-pago-custom .mp-input-label,
.payment_box.payment_method_woo-mercado-pago-custom .mp-input-label *,
.payment_box.payment_method_woo-mercado-pago-custom input-helper,
.payment_box.payment_method_woo-mercado-pago-custom input-helper *,
.payment_box.payment_method_woo-mercado-pago-custom .mp-checkout-custom-installments-select-container label,
.payment_box.payment_method_woo-mercado-pago-custom .mp-checkout-custom-installments-select-container label *,
.payment_box.payment_method_woo-mercado-pago-custom .mp-privacy-policy-footer,
.payment_box.payment_method_woo-mercado-pago-custom .mp-privacy-policy-footer *,
.payment_box.payment_method_woo-mercado-pago-custom .mp-wallet-button-title,
.payment_box.payment_method_woo-mercado-pago-custom .mp-wallet-button-title * {
	color: #ffffff !important;
	-webkit-text-fill-color: #ffffff !important;
}

/* 2. MP native inputs (cardholder name) and selects (installments, issuer):
      restore MP's native white background and dark text. Without this, our
      generic `.tourflow-booking-details-page input[type="text"]` rule paints
      them dark-on-dark. ID selectors give us a clean specificity win. */
.payment_box.payment_method_woo-mercado-pago-custom #form-checkout__cardholderName,
.payment_box.payment_method_woo-mercado-pago-custom #form-checkout__installments,
.payment_box.payment_method_woo-mercado-pago-custom #form-checkout__issuer,
.payment_box.payment_method_woo-mercado-pago-custom .mp-checkout-custom-card-input,
.payment_box.payment_method_woo-mercado-pago-custom .mp-custom-checkout-select-input {
	background-color: #ffffff !important;
	color: var(--andes-gray-900, #1a1a1a) !important;
	border: 1px solid #d4d4d4 !important;
	-webkit-text-fill-color: var(--andes-gray-900, #1a1a1a) !important;
	height: 48px !important;
	padding: 0 12px !important;
	margin-bottom: 8px !important;
}

/* Placeholder inside MP cardholder field — muted gray, not our light white. */
.payment_box.payment_method_woo-mercado-pago-custom #form-checkout__cardholderName::placeholder {
	color: #999 !important;
	-webkit-text-fill-color: #999 !important;
	opacity: 1 !important;
}

/* 3. PCI iframe containers — leave the iframe alone; give the wrapper a clean
      white surface so the iframe sits on a matched background. */
.payment_box.payment_method_woo-mercado-pago-custom #form-checkout__cardNumber-container,
.payment_box.payment_method_woo-mercado-pago-custom #form-checkout__expirationDate-container,
.payment_box.payment_method_woo-mercado-pago-custom #form-checkout__securityCode-container {
	background-color: #ffffff !important;
	border: 1px solid #d4d4d4 !important;
	border-radius: 6px !important;
	height: 48px !important;
	padding: 0 !important;
}

/* 4. Security-code "?" tooltip — give it a visible chip so it doesn't sit as
      a stray ASCII glyph next to the security-code field. */
.payment_box.payment_method_woo-mercado-pago-custom #mp-security-code-info {
	color: #ffffff !important;
	background: rgba(255, 255, 255, 0.18);
	border-radius: 50%;
	width: 20px;
	height: 20px;
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	font-size: 12px !important;
	line-height: 1 !important;
	margin-left: 8px;
	cursor: help;
	flex-shrink: 0;
}

/* 5. Card-flag icons row — slight bottom margin. */
.payment_box.payment_method_woo-mercado-pago-custom .mp-checkout-custom-card-flags {
	margin-bottom: 12px;
}

/* 6. Spinner — let MP's JS control visibility entirely. Forcing display:block
      here prevents MP from collapsing the spinner after init, leaving
      invisible blank height above the card form fields. */

/* 7. Required-asterisks (b style="color: red") inside MP installments label —
      keep MP's red color, not our white. */
.payment_box.payment_method_woo-mercado-pago-custom .mp-checkout-custom-installments-select-container label b {
	color: #ff6b6b !important;
	-webkit-text-fill-color: #ff6b6b !important;
}

/* 8. Booking-summary grid column-width recovery.
      The wizard's checkout uses `grid-template-columns: 54% 44%`, but MP's
      PCI iframes have intrinsic min widths that blow out the grid and steal
      space from the left column. Re-assert widths with !important.

      SCOPED to >= 922px (the same desktop breakpoint already in use for the
      checkout grid). On smaller viewports the form stacks naturally into one
      column and we don't fight it — the MP iframes flow vertically below the
      customer details. */
@media (min-width: 922px) {
	body.tourflow-has-booking-details .woocommerce-checkout form.checkout {
		display: grid !important;
		grid-template-columns: 54% 44% !important;
		gap: 2% !important;
		width: 100% !important;
		box-sizing: border-box !important;
	}
	body.tourflow-has-booking-details .woocommerce-checkout form.checkout > * {
		min-width: 0 !important;
		max-width: 100% !important;
		box-sizing: border-box !important;
	}
	body.tourflow-has-booking-details .woocommerce-checkout #customer_details,
	body.tourflow-has-booking-details .woocommerce-checkout .col2-set {
		grid-column: 1 !important;
		width: 100% !important;
	}
	body.tourflow-has-booking-details .woocommerce-checkout #order_review,
	body.tourflow-has-booking-details .woocommerce-checkout #order_review_heading {
		grid-column: 2 !important;
		width: 100% !important;
		overflow-x: hidden !important;
	}

	/* Cancel the legacy `.col-1, .col-2 { width: 150% }` rule (lines 1119-1125)
	   that was blowing the left column out earlier. Inside our grid, we want
	   the col-1/col-2 wrappers to fill their parent .col2-set. */
	body.tourflow-has-booking-details .woocommerce.woocommerce-checkout form #customer_details.col2-set .col-1,
	body.tourflow-has-booking-details .woocommerce.woocommerce-checkout form #customer_details.col2-set .col-2,
	body.tourflow-has-booking-details .woocommerce-page.woocommerce-checkout form #customer_details.col2-set .col-1,
	body.tourflow-has-booking-details .woocommerce-page.woocommerce-checkout form #customer_details.col2-set .col-2 {
		width: 100% !important;
	}
}

/* 9. MP form: clamp to fit its grid column. The PCI iframes will use their
      natural width (up to container width); container has horizontal scroll
      only if absolutely necessary (it shouldn't be on normal desktop). */
.payment_box.payment_method_woo-mercado-pago-custom .mp-checkout-container,
.payment_box.payment_method_woo-mercado-pago-custom .mp-checkout-custom-container,
.payment_box.payment_method_woo-mercado-pago-custom #mp-checkout-custom-root,
.payment_box.payment_method_woo-mercado-pago-custom #mp-custom-checkout-form-container,
.payment_box.payment_method_woo-mercado-pago-custom .mp-checkout-custom-card-form,
.payment_box.payment_method_woo-mercado-pago-custom .mp-checkout-custom-card-row {
	max-width: 100% !important;
	width: 100% !important;
	box-sizing: border-box !important;
}

/* MP container's default padding `20px 24px 40px` wastes a lot of column
   width. Tighten it. */
.payment_box.payment_method_woo-mercado-pago-custom .mp-checkout-custom-container {
	padding: 12px 14px 20px !important;
}

/* PCI iframe containers fit their column width. */
.payment_box.payment_method_woo-mercado-pago-custom #form-checkout__cardNumber-container,
.payment_box.payment_method_woo-mercado-pago-custom #form-checkout__expirationDate-container,
.payment_box.payment_method_woo-mercado-pago-custom #form-checkout__securityCode-container {
	max-width: 100% !important;
	width: 100% !important;
	min-width: 0 !important;
}

/* MP iframes carry hardcoded width attributes set by their JS init that
   ignore parent max-width. Forcing width: 100% makes the iframe content
   reflow to fit its container at any viewport. */
.payment_box.payment_method_woo-mercado-pago-custom iframe {
	width: 100% !important;
	max-width: 100% !important;
	min-width: 0 !important;
	box-sizing: border-box !important;
}

/* 10. Dual-column row (MM/AA + CVV side by side): make it a real flex row so
       each column shrinks together as the container narrows. Without this,
       MP's `mp-checkout-custom-dual-column-row{flex-direction:row}` rule has
       no flex-basis on the children and one column hogs space. */
.payment_box.payment_method_woo-mercado-pago-custom .mp-checkout-custom-dual-column-row {
	display: flex !important;
	flex-direction: row !important;
	gap: 8px !important;
	width: 100% !important;
	max-width: 100% !important;
	flex-wrap: nowrap !important;
}
.payment_box.payment_method_woo-mercado-pago-custom .mp-checkout-custom-card-column {
	flex: 1 1 0 !important;
	min-width: 0 !important;
	max-width: 100% !important;
}
.payment_box.payment_method_woo-mercado-pago-custom .mp-checkout-custom-security-code-container {
	display: flex !important;
	align-items: center !important;
	gap: 6px !important;
	width: 100% !important;
}
.payment_box.payment_method_woo-mercado-pago-custom .mp-checkout-custom-security-code-input {
	flex: 1 1 0 !important;
	min-width: 0 !important;
}

/* 11. Mobile: tighten MP container padding so cards/iframes have more usable
       width inside the column. */
@media (max-width: 600px) {
	.payment_box.payment_method_woo-mercado-pago-custom .mp-checkout-custom-container {
		padding: 10px 8px 16px !important;
	}
	.payment_box.payment_method_woo-mercado-pago-custom .mp-checkout-custom-card-input,
	.payment_box.payment_method_woo-mercado-pago-custom #form-checkout__cardholderName,
	.payment_box.payment_method_woo-mercado-pago-custom #form-checkout__installments,
	.payment_box.payment_method_woo-mercado-pago-custom #form-checkout__issuer {
		padding: 0 10px !important;
	}
}

/* 12. The "Notes/Helper" elements (input-helper) sometimes overflow when MP
       renders error states. Keep them clipped to their column. */
.payment_box.payment_method_woo-mercado-pago-custom input-helper {
	display: block !important;
	max-width: 100% !important;
	word-break: break-word !important;
}

/* 13. Mobile checkout — wizard card content overflow recovery.
       On mobile, the wizard renders the WC checkout inside a card that has
       internal padding. WC's customer-details inputs and the payment_methods
       list both default to widths that don't respect the card's padding,
       causing overflow on the right edge and the visible misalignment
       between Datos del Cliente fields and the payment radios below.
       Forcing border-box + width:100% on every form descendant clamps them
       to the card's content box. */
@media (max-width: 921px) {
	body.tourflow-has-booking-details .woocommerce-checkout form.checkout {
		display: block !important;
		width: 100% !important;
		max-width: 100% !important;
		box-sizing: border-box !important;
	}
	body.tourflow-has-booking-details .woocommerce-checkout form.checkout > *,
	body.tourflow-has-booking-details .woocommerce-checkout #customer_details,
	body.tourflow-has-booking-details .woocommerce-checkout .col2-set,
	body.tourflow-has-booking-details .woocommerce-checkout #customer_details .col-1,
	body.tourflow-has-booking-details .woocommerce-checkout #customer_details .col-2,
	body.tourflow-has-booking-details .woocommerce-checkout #order_review,
	body.tourflow-has-booking-details .woocommerce-checkout #order_review_heading,
	body.tourflow-has-booking-details .woocommerce-checkout .woocommerce-billing-fields,
	body.tourflow-has-booking-details .woocommerce-checkout .woocommerce-additional-fields,
	body.tourflow-has-booking-details .woocommerce-checkout #payment,
	body.tourflow-has-booking-details .woocommerce-checkout ul.payment_methods,
	body.tourflow-has-booking-details .woocommerce-checkout ul.payment_methods > li,
	body.tourflow-has-booking-details .woocommerce-checkout .payment_box {
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
		box-sizing: border-box !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
		float: none !important;
	}

	/* Customer-details inputs/selects/textareas — clamp to card width. */
	body.tourflow-has-booking-details .woocommerce-checkout #customer_details input.input-text,
	body.tourflow-has-booking-details .woocommerce-checkout #customer_details input[type="text"],
	body.tourflow-has-booking-details .woocommerce-checkout #customer_details input[type="email"],
	body.tourflow-has-booking-details .woocommerce-checkout #customer_details input[type="tel"],
	body.tourflow-has-booking-details .woocommerce-checkout #customer_details input[type="password"],
	body.tourflow-has-booking-details .woocommerce-checkout #customer_details input[type="number"],
	body.tourflow-has-booking-details .woocommerce-checkout #customer_details textarea,
	body.tourflow-has-booking-details .woocommerce-checkout #customer_details select,
	body.tourflow-has-booking-details .woocommerce-checkout #customer_details .form-row,
	body.tourflow-has-booking-details .woocommerce-checkout #customer_details .form-row-first,
	body.tourflow-has-booking-details .woocommerce-checkout #customer_details .form-row-last,
	body.tourflow-has-booking-details .woocommerce-checkout #customer_details .form-row-wide {
		width: 100% !important;
		max-width: 100% !important;
		box-sizing: border-box !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
		float: none !important;
	}

	/* #order_review has margin-top: 50px from the desktop grid rule.
	   On mobile that creates a large blank gap above the payment section
	   and also makes the block narrower inside a block-level context.
	   Zero it out. */
	body.tourflow-has-booking-details .woocommerce-checkout #order_review,
	body.tourflow-has-booking-details .woocommerce-checkout #order_review_heading {
		margin-top: 0 !important;
		padding: 0 !important;
	}

	/* MP white container fills its parent payment_box cleanly. */
	.payment_box.payment_method_woo-mercado-pago-custom,
	.payment_box.payment_method_woo-mercado-pago-custom > *,
	.payment_box.payment_method_woo-mercado-pago-custom #mp-checkout-custom-root,
	.payment_box.payment_method_woo-mercado-pago-custom .mp-checkout-custom-container,
	.payment_box.payment_method_woo-mercado-pago-custom #mp-custom-checkout-form-container,
	.payment_box.payment_method_woo-mercado-pago-custom .mp-checkout-custom-card-form,
	.payment_box.payment_method_woo-mercado-pago-custom .mp-checkout-custom-card-row {
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
		box-sizing: border-box !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
	}

	/* Wallet button container — remove its excess vertical margin that creates
	   the blank space between the test-mode warning and the Mercado Pago button. */
	.payment_box.payment_method_woo-mercado-pago-custom .mp-wallet-button-container-wrapper,
	.payment_box.payment_method_woo-mercado-pago-custom .mp-wallet-button-container {
		padding: 0 !important;
		margin: 0 0 8px 0 !important;
	}
	.payment_box.payment_method_woo-mercado-pago-custom .mp-wallet-button-title {
		margin-bottom: 6px !important;
	}
	.payment_box.payment_method_woo-mercado-pago-custom .mp-privacy-policy-footer {
		margin-top: 6px !important;
	}
	/* Reduce top padding on the white container itself on mobile. */
	.payment_box.payment_method_woo-mercado-pago-custom .mp-checkout-custom-container {
		padding: 8px 8px 12px !important;
	}
}

/* 14. Payment methods width recovery (ALL viewports).
       Chain that creates the alignment problem:
         #order_review > div#payment > ul.wc_payment_methods > li > .payment_box
       - WC ships `#payment` with `background: #ebe9eb; padding: 1em` defaults
         that push children ~16px in on every side.
       - The ul has the browser default ~40px left padding for list bullets.
       - Each <li> can also carry list-style padding.
       Strip every layer so the radios and payment-boxes flush-align with
       .col-1 (and the Datos del Cliente fields above on mobile). */
body.tourflow-has-booking-details .woocommerce-checkout #payment,
body.tourflow-has-booking-details .woocommerce-checkout div#payment.woocommerce-checkout-payment {
	width: 100% !important;
	max-width: 100% !important;
	padding: 0 !important;
	margin: 0 !important;
	background: transparent !important;
	border: 0 !important;
	box-sizing: border-box !important;
}
body.tourflow-has-booking-details .woocommerce-checkout ul.wc_payment_methods.payment_methods.methods,
body.tourflow-has-booking-details .woocommerce-checkout ul.payment_methods {
	width: 100% !important;
	max-width: 100% !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
	margin: 0 !important;
	list-style: none !important;
	box-sizing: border-box !important;
}
body.tourflow-has-booking-details .woocommerce-checkout ul.wc_payment_methods.payment_methods.methods > li,
body.tourflow-has-booking-details .woocommerce-checkout ul.payment_methods > li {
	width: 100% !important;
	max-width: 100% !important;
	box-sizing: border-box !important;
	list-style: none !important;
	margin-left: 0 !important;
	padding-left: 0 !important;
}
body.tourflow-has-booking-details .woocommerce-checkout ul.wc_payment_methods.payment_methods.methods > li .payment_box,
body.tourflow-has-booking-details .woocommerce-checkout ul.payment_methods > li .payment_box {
	width: 100% !important;
	max-width: 100% !important;
	box-sizing: border-box !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
}

/* ==========================================================================
   Single-product page: out-of-stock badge, related products, qty stepper
   ========================================================================== */

/* --- Out-of-stock pill (replaces WC's bare <p class="stock">) --- */
.tourflow-stock-badge--out {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 0;
	padding: 12px 22px;
	border-radius: 999px;
	background: rgba(220, 53, 69, 0.15);
	border: 1px solid rgba(220, 53, 69, 0.55);
	color: #ff6b7a;
	font-weight: 700;
	font-size: 16px;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.tourflow-stock-badge__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: rgba(220, 53, 69, 0.55);
	color: #fff;
	font-size: 14px;
	line-height: 1;
}

@media (max-width: 768px) {
	.tourflow-stock-badge--out {
		font-size: 14px;
		padding: 10px 18px;
	}
}

/* --- Related products section (SkyShop cards via shared renderer) --- */
.tourflow-related-products {
	margin-top: 48px;
}

.tourflow-related-products__title {
	margin: 0 0 24px 0;
	font-weight: 700;
}

@media (max-width: 768px) {
	.tourflow-related-products {
		margin-top: 32px;
	}

	/* Match the card grid's mobile side padding for the heading too. */
	.tourflow-related-products__title {
		padding-left: 16px;
		padding-right: 16px;
	}
}

/* --- Quantity stepper ( [ - ] [ n ] [ + ] ) --- */
.tourflow-booking-form .tourflow-qty-stepper {
	display: inline-flex;
	align-items: stretch;
	gap: 0;
	border-radius: 8px;
	overflow: hidden;
}

.tourflow-booking-form .tourflow-qty-btn {
	width: 44px;
	min-height: 44px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	border: 1px solid var(--ast-global-color-0, #14abc4);
	background: var(--ast-global-color-0, #14abc4);
	color: #fff;
	font-size: 20px;
	font-weight: 700;
	line-height: 1;
	cursor: pointer;
	-webkit-user-select: none;
	user-select: none;
	transition: background 0.2s ease;
}

.tourflow-booking-form .tourflow-qty-btn:hover {
	background: var(--ast-global-color-1, #108a9e);
	border-color: var(--ast-global-color-1, #108a9e);
}

.tourflow-booking-form .tourflow-qty-btn--minus {
	border-radius: 8px 0 0 8px;
}

.tourflow-booking-form .tourflow-qty-btn--plus {
	border-radius: 0 8px 8px 0;
}

/* The number input sits between the buttons; flatten its corners and hide the
   native spinners (we provide our own - / + controls). */
.tourflow-booking-form .tourflow-qty-stepper input.qty {
	width: 56px;
	min-height: 44px;
	text-align: center;
	border-radius: 0;
	border-left: 0;
	border-right: 0;
	-moz-appearance: textfield;
	appearance: textfield;
}

.tourflow-booking-form .tourflow-qty-stepper input.qty::-webkit-outer-spin-button,
.tourflow-booking-form .tourflow-qty-stepper input.qty::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

/* Cart variant of the quantity stepper: physical SkyShop products in the cart
   get the same [ - ] [ n ] [ + ] control, but the number sits flush with no box
   (Astra's bordered qty input is stripped). Scoped to .woocommerce-cart so the
   single-product hero rules above are untouched. */
.woocommerce-cart .tourflow-qty-stepper {
	display: inline-flex;
	align-items: stretch;
	justify-content: center;
	border-radius: 8px;
}

.woocommerce-cart .tourflow-qty-btn {
	width: 40px;
	min-height: 40px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	border: 1px solid var(--ast-global-color-0, #14abc4);
	background: var(--ast-global-color-0, #14abc4);
	color: #fff;
	font-size: 20px;
	font-weight: 700;
	line-height: 1;
	cursor: pointer;
	-webkit-user-select: none;
	user-select: none;
	transition: background 0.2s ease;
}

.woocommerce-cart .tourflow-qty-btn:hover {
	background: var(--ast-global-color-1, #108a9e);
	border-color: var(--ast-global-color-1, #108a9e);
}

.woocommerce-cart .tourflow-qty-btn--minus {
	border-radius: 8px 0 0 8px;
}

.woocommerce-cart .tourflow-qty-btn--plus {
	border-radius: 0 8px 8px 0;
}

.woocommerce-cart .tourflow-qty-stepper input.qty {
	width: 48px;
	min-height: 40px;
	text-align: center;
	border: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	border-radius: 0;
	-moz-appearance: textfield;
	appearance: textfield;
	color: inherit;
}

.woocommerce-cart .tourflow-qty-stepper input.qty::-webkit-outer-spin-button,
.woocommerce-cart .tourflow-qty-stepper input.qty::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

/* ==========================================================================
   GLOBAL WooCommerce notices (added-to-cart, info, errors) — TourFlow glass look
   --------------------------------------------------------------------------
   Single, site-wide source of truth for the standard Woo notice boxes so they
   stop rendering as plain white Astra/WC bars (cart, checkout, my-account, shop,
   single-product, etc.). Intentionally LOW specificity (0,1,0): pages that
   already style their notices with a more specific selector keep winning, e.g.
     - .tourflow-blackout-notice .woocommerce-info        (blackout dates)
     - .tourflow-boutique-account ... .woocommerce-info a (account link colors)
   so this rule only fills the previously-unstyled (white) notices and cannot
   override existing intentional styling. This supersedes the old per-page copies
   (single-product + .tourflow-booking-details-page) which have been removed.
   ========================================================================== */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 12px;
	background-color: var(--ast-global-color-5, #131739);
	color: var(--ast-global-color-3, #ecf1fe);
	border: 1px solid rgba(255, 255, 255, 0.12);
	border-left: 4px solid var(--ast-global-color-0, #14abc4);
	border-radius: 10px;
	padding: 14px 18px;
	margin: 0 0 20px;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.25);
	font-family: inherit;
	text-align: left;
}

/* Error notices get a red accent instead of teal. */
.woocommerce-error {
	border-left-color: #dc3545;
}

/* In-notice action buttons ("Ver carrito", "Ver el pedido", etc.) → brand pill,
   pushed to the end of the row. */
.woocommerce-message > .button,
.woocommerce-info > .button,
.woocommerce-error > .button {
	margin-left: auto;
	background-color: var(--ast-global-color-0, #14abc4);
	color: var(--ast-global-color-2, #ffffff);
	border: none;
	border-radius: 6px;
	padding: 8px 18px;
	font-weight: 600;
	transition: background-color 0.2s ease;
}

.woocommerce-message > .button:hover,
.woocommerce-info > .button:hover,
.woocommerce-error > .button:hover {
	background-color: var(--ast-global-color-1, #108a9e);
}

/* WC's default success checkmark (::before) — keep it on-brand. */
.woocommerce-message::before {
	color: var(--ast-global-color-0, #14abc4);
}

@media (max-width: 768px) {
	.woocommerce-message > .button,
	.woocommerce-info > .button,
	.woocommerce-error > .button {
		margin-left: 0;
		width: 100%;
		text-align: center;
	}
}

/* --------------------------------------------------------------------
   Single-product page font-size pass (2026-07-14)
   - Heading (H1 product title)     -> 30px
   - Subheading (short description) -> 14px
   - Body/description text          -> 14px cap
   Appended at end of file so these rules win the cascade over the ones
   above. Scoped to the hero header/body containers only, so the booking
   form column (.tourflow-body-right — buttons, inputs, price) is untouched.
   ------------------------------------------------------------------ */

/* Heading: the product title reuses the shared --tf-single-title-size
   custom properties (see :root near the top of this file), so overriding
   them here cascades to the hero title at all breakpoints and to the
   generic .product_title/h1.entry-title fallback used elsewhere. */
:root {
	--tf-single-title-size: 30px;
	--tf-single-title-size-tablet: 30px;
	--tf-single-title-size-mobile: 30px;
}

/* Subheading: product short description rendered under the title */
.tourflow-header-right .tourflow-tour-subtitle,
.tourflow-header-right .tourflow-tour-subtitle p {
	font-size: 14px !important;
}

/* Body text: full description column (left side of the body row). */
.tourflow-body-left,
.tourflow-body-left p,
.tourflow-body-left li,
.tourflow-body-left span,
.tourflow-body-left div,
.tourflow-body-left h1,
.tourflow-body-left h2,
.tourflow-body-left h3,
.tourflow-body-left h4,
.tourflow-body-left h5,
.tourflow-body-left h6 {
	font-size: 14px !important;
}