/**
 * Viextory — Estilos Frontend del Itinerario
 *
 * Paleta de identidad Viextory:
 *   Navy    : #093247
 *   Dorado  : #C18726
 *   Fondo   : #f8f9fc
 *   Blanco  : #ffffff
 *   Texto   : #2d2d2d
 *   Sutil   : #6b7280
 *
 * Compatible con Blocksy + Elementor.
 * La clase .vx-itinerary toma ancho completo independientemente del tema.
 *
 * @package ViextoryItinerary
 */

/* ── Reset de contexto ──────────────────────────────────────────────────── */

.vx-itinerary *,
.vx-itinerary *::before,
.vx-itinerary *::after {
	box-sizing: border-box;
}

.vx-itinerary {
	--vx-navy    : #093247;
	--vx-red     : #C18726;
	--vx-red-h   : #F4ECE1;
	--vx-bg      : #f8f9fc;
	--vx-white   : #ffffff;
	--vx-text    : #2d2d2d;
	--vx-muted   : #6b7280;
	--vx-border  : #e5e7eb;
	--vx-radius  : 12px;
	--vx-shadow  : 0 2px 12px rgba(0,0,0,.08);
	--vx-max-w   : 900px;

	font-family : 'Segoe UI', Arial, sans-serif;
	color       : var(--vx-text);
	line-height : 1.6;
	background  : var(--vx-bg);
}

/* ── Compatibilidad con Blocksy ─────────────────────────────────────────── */

/* Dentro de Blocksy el .entry-content puede tener max-width; lo anulamos.
   Acotamos al .site-main / article para no afectar el header ni el footer. */
body.single-viextory_itinerary .site-main,
body.single-viextory_itinerary .entry-content,
body.single-viextory_itinerary article {
	max-width : none !important;
	padding   : 0 !important;
	margin    : 0 !important;
}

/* Solo el contenedor del contenido principal, no el del footer/header */
body.single-viextory_itinerary .site-main > .ct-container,
body.single-viextory_itinerary .entry-content > .ct-container {
	max-width : none !important;
	padding   : 0 !important;
	margin    : 0 !important;
}

/* ── Hero ───────────────────────────────────────────────────────────────── */

.vx-hero {
	position            : relative;
	width               : 100%;
	min-height          : 400px;
	background-color    : var(--vx-navy);
	background-size     : cover;
	background-position : center;
	display             : flex;
	align-items         : flex-end;
}

.vx-hero__zoom-btn {
	position        : absolute;
	top             : 16px;
	right           : 16px;
	z-index         : 2;
	width           : 40px;
	height          : 40px;
	border-radius   : 50%;
	background      : rgba(0,0,0,.35);
	color           : #fff;
	border          : 1px solid rgba(255,255,255,.40);
	font-size       : 20px;
	cursor          : zoom-in;
	display         : flex;
	align-items     : center;
	justify-content : center;
	transition      : background .15s, opacity .15s;
	line-height     : 1;
	opacity         : .70;
}

.vx-hero__zoom-btn:hover {
	background : rgba(0,0,0,.60);
	opacity    : 1;
}

.vx-hero__overlay {
	position   : absolute;
	inset      : 0;
	background : linear-gradient(
		to bottom,
		rgba(26,26,46,.25) 0%,
		rgba(26,26,46,.80) 100%
	);
}

.vx-hero__content {
	position : relative;
	z-index  : 1;
	padding  : 40px 32px;
	max-width: var(--vx-max-w);
	width    : 100%;
	margin   : 0 auto;
}

.vx-hero__eyebrow {
	display        : flex;
	align-items    : center;
	gap            : 10px;
	flex-wrap      : wrap;
	font-size      : 12px;
	letter-spacing : 2px;
	text-transform : uppercase;
	color          : rgba(255,255,255,.75);
	margin         : 0 0 8px;
}

.vx-hero__status {
	display         : inline-block;
	padding         : 2px 10px;
	border-radius   : 20px;
	font-size       : 10px;
	font-weight     : 700;
	letter-spacing  : 1px;
	text-transform  : uppercase;
	vertical-align  : middle;
	background      : rgba(255,255,255,.15);
	color           : #fff;
	border          : 1px solid rgba(255,255,255,.35);
}

/* Variantes por estatus */
.vx-hero__status--confirmacion {
	background  : rgba(39,174,96,.25);
	border-color: rgba(39,174,96,.6);
	color       : #a8ffcc;
}

.vx-hero__status--cotizacion {
	background  : rgba(193,135,38,.30);
	border-color: rgba(193,135,38,.7);
	color       : #f4d48a;
}

.vx-hero__status--pendiente {
	background  : rgba(255,255,255,.12);
	border-color: rgba(255,255,255,.35);
	color       : rgba(255,255,255,.9);
}

.vx-hero__status--no_vendida,
.vx-hero__status--perdida {
	background  : rgba(220,53,69,.20);
	border-color: rgba(220,53,69,.5);
	color       : #ffb3bb;
}

.vx-hero__title {
	font-size   : clamp(28px, 5vw, 48px);
	font-weight : 800;
	color       : #fff;
	margin      : 0 0 8px;
	line-height : 1.15;
}

.vx-hero__subtitle {
	font-size  : 18px;
	color      : rgba(255,255,255,.85);
	margin     : 0 0 16px;
}

.vx-hero__meta {
	font-size  : 14px;
	color      : rgba(255,255,255,.80);
	margin     : 4px 0 0;
}

/* ── Navegación anclaje ─────────────────────────────────────────────────── */

.vx-nav {
	background    : var(--vx-navy);
	padding       : 0;
	position      : sticky;
	top           : 0;
	z-index       : 100;
	border-bottom : 2px solid var(--vx-red);
}

.vx-nav__inner {
	max-width  : var(--vx-max-w);
	margin     : 0 auto;
	display    : flex;
	overflow-x : auto;
	scrollbar-width: none;
}

.vx-nav__inner::-webkit-scrollbar { display: none; }


.vx-expediente {
	display     : flex;
	align-items : center;
	gap         : 12px;
	flex-wrap   : wrap;
}

.vx-expediente__btn {
	display         : inline-block;
	padding         : 3px 12px;
	font-size       : 12px;
	font-weight     : 600;
	color           : var(--vx-navy) !important;
	background      : transparent;
	border          : 1px solid var(--vx-navy);
	border-radius   : 4px;
	text-decoration : none !important;
	white-space     : nowrap;
	transition      : background .15s, color .15s;
}

.vx-expediente__btn:hover {
	background : var(--vx-navy) !important;
	color      : #fff !important;
}

.vx-nav__link {
	display     : inline-block;
	padding     : 14px 20px;
	color       : #F4ECE1;
	font-size   : 13px;
	font-weight : 600;
	text-decoration: none;
	white-space : nowrap;
	transition  : color .15s, background .15s;
	letter-spacing: .3px;
}

.vx-nav__link:hover {
	color           : #F4ECE1;
	background      : rgba(244,236,225,.10);
	text-decoration : none;
}

/* ── Contenedor central ─────────────────────────────────────────────────── */

.vx-wrap {
	max-width : var(--vx-max-w);
	margin    : 0 auto;
	padding   : 32px 20px 48px;
}

/* ── Tarjeta del Cliente ────────────────────────────────────────────────── */

.vx-client-card {
	background    : var(--vx-white);
	border        : 1px solid var(--vx-border);
	border-radius : var(--vx-radius);
	padding       : 24px;
	margin-bottom : 28px;
	box-shadow    : var(--vx-shadow);
	border-top    : 3px solid var(--vx-red);
}

.vx-client-card__grid {
	display               : grid;
	grid-template-columns : repeat(auto-fill, minmax(200px, 1fr));
	gap                   : 16px;
}

.vx-client-card__item {
	display        : flex;
	flex-direction : column;
	gap            : 4px;
}

.vx-client-card__label {
	font-size      : 10px;
	font-weight    : 700;
	letter-spacing : 1px;
	text-transform : uppercase;
	color          : var(--vx-muted);
}

.vx-client-card__value {
	font-size   : 15px;
	font-weight : 500;
	color       : var(--vx-navy);
}

/* ── Secciones generales ────────────────────────────────────────────────── */

.vx-section {
	margin-bottom : 40px;
	scroll-margin-top: 56px; /* compensar la nav sticky */
}

.vx-section__header {
	display      : flex;
	align-items  : center;
	gap          : 10px;
	margin-bottom: 20px;
	padding-bottom: 12px;
	border-bottom: 2px solid var(--vx-border);
}

.vx-section__icon {
	font-size : 22px;
	line-height: 1;
}

.vx-section__title {
	font-size   : 22px;
	font-weight : 700;
	color       : var(--vx-navy);
	margin      : 0;
	flex        : 1;
}

/* ── Botón toggle de sección ──────────────────────────────────────────────── */

.vx-section__toggle-btn {
	margin-left     : auto;
	flex-shrink     : 0;
	background      : none;
	border          : none;
	padding         : 0;
	cursor          : pointer;
	line-height     : 1;
}

.vx-section__toggle-btn:focus-visible {
	outline        : 2px solid var(--vx-red);
	outline-offset : 3px;
	border-radius  : 50%;
}

.vx-section__toggle-icon {
	display      : block;
	width        : 26px;
	height       : 26px;
	border-radius: 50%;
	background   : var(--vx-navy);
	position     : relative;
	transition   : transform .2s, background .15s;
}

.vx-section__toggle-icon::before,
.vx-section__toggle-icon::after {
	content      : '';
	position     : absolute;
	background   : var(--vx-white);
	border-radius: 2px;
	top          : 50%;
	left         : 50%;
	transform    : translate(-50%, -50%);
}

.vx-section__toggle-icon::before {
	width  : 12px;
	height : 2px;
}

.vx-section__toggle-icon::after {
	width     : 2px;
	height    : 12px;
	transition: transform .2s;
	/* Default (expanded): rotado 90° → barra horizontal → ícono "−" */
	transform : translate(-50%, -50%) rotate(90deg);
}

/* Collapsed: ::after vuelve a vertical → ícono "+" */
.vx-section__toggle-btn[aria-expanded="false"] .vx-section__toggle-icon {
	background : var(--vx-red);
}

.vx-section__toggle-btn[aria-expanded="false"] .vx-section__toggle-icon::after {
	transform : translate(-50%, -50%);
}

.vx-section__body {
	display       : flex;
	flex-direction: column;
	gap           : 20px;
}

/* ── Incluye / No Incluye ───────────────────────────────────────────────── */

.vx-includes-grid {
	display               : grid;
	grid-template-columns : 1fr 1fr;
	gap                   : 16px;
}

.vx-includes-col {
	background    : var(--vx-white);
	border        : 1px solid var(--vx-border);
	border-radius : var(--vx-radius);
	overflow      : hidden;
	box-shadow    : var(--vx-shadow);
}

.vx-includes-col__header {
	display     : flex;
	align-items : center;
	gap         : 10px;
	padding     : 14px 20px;
	font-weight : 700;
}

.vx-includes-col--yes .vx-includes-col__header {
	background   : #f0fdf4;
	border-bottom: 2px solid #86efac;
}

.vx-includes-col--no .vx-includes-col__header {
	background   : #fff8f0;
	border-bottom: 2px solid var(--vx-red);
}

.vx-includes-col__icon {
	font-size   : 18px;
	line-height : 1;
}

.vx-includes-col__title {
	font-size  : 15px;
	font-weight: 700;
	color      : var(--vx-navy);
	margin     : 0;
}

.vx-includes-col__body {
	padding : 16px 20px;
}

.vx-includes__list {
	margin     : 0;
	padding    : 0;
	list-style : none;
	display    : flex;
	flex-direction: column;
	gap        : 8px;
}

.vx-includes__list li {
	font-size   : 14px;
	color       : var(--vx-text);
	line-height : 1.5;
	padding-left: 20px;
	position    : relative;
}

.vx-includes-col--yes .vx-includes__list li::before {
	content    : '✓';
	position   : absolute;
	left       : 0;
	color      : #16a34a;
	font-weight: 700;
}

.vx-includes-col--no .vx-includes__list li::before {
	content    : '×';
	position   : absolute;
	left       : 0;
	color      : var(--vx-red);
	font-weight: 700;
	font-size  : 16px;
}

@media (max-width: 640px) {
	.vx-includes-grid {
		grid-template-columns: 1fr;
	}
}

/* ── Tarjeta de Vuelo ───────────────────────────────────────────────────── */

.vx-flight-card {
	background    : var(--vx-white);
	border        : 1px solid var(--vx-border);
	border-radius : var(--vx-radius);
	overflow      : hidden;
	box-shadow    : var(--vx-shadow);
}

.vx-flight-card__route {
	display         : flex;
	align-items     : center;
	justify-content : space-between;
	padding         : 24px 28px;
	background      : var(--vx-navy);
	color           : #fff;
	gap             : 16px;
}

.vx-flight-route__origin,
.vx-flight-route__dest {
	flex       : 1;
	text-align : center;
}

.vx-flight-route__code {
	font-size   : 32px;
	font-weight : 800;
	letter-spacing: 2px;
	line-height : 1;
}

.vx-flight-route__city {
	font-size  : 12px;
	color      : rgba(255,255,255,.70);
	margin-top : 4px;
}

.vx-flight-route__arrow {
	flex         : 1;
	display      : flex;
	flex-direction: column;
	align-items  : center;
	gap          : 4px;
	color        : rgba(255,255,255,.60);
}

.vx-flight-route__plane {
	font-size : 18px;
	color     : var(--vx-red);
}

.vx-flight-route__line {
	width        : 80%;
	height       : 1px;
	background   : rgba(255,255,255,.25);
	margin       : 2px 0;
}

.vx-flight-route__duration {
	font-size  : 11px;
	color      : rgba(255,255,255,.55);
}

.vx-flight-card__details {
	display               : grid;
	grid-template-columns : repeat(auto-fill, minmax(200px, 1fr));
	gap                   : 0;
	padding               : 0;
}

.vx-flight-detail {
	padding    : 14px 20px;
	border-bottom: 1px solid var(--vx-border);
	border-right : 1px solid var(--vx-border);
	display    : flex;
	flex-direction: column;
	gap        : 3px;
}

.vx-flight-detail--full {
	grid-column : 1 / -1;
}

.vx-flight-detail__label {
	font-size      : 10px;
	font-weight    : 700;
	letter-spacing : .8px;
	text-transform : uppercase;
	color          : var(--vx-muted);
}

.vx-flight-detail__value {
	font-size  : 14px;
	color      : var(--vx-text);
}

.vx-flight-card__notes {
	padding    : 16px 20px;
	background : #fafbff;
	font-size  : 13px;
	color      : var(--vx-muted);
	border-top : 1px solid var(--vx-border);
}

.vx-flight-card__notes p { margin: 0 0 8px; }
.vx-flight-card__notes p:last-child { margin-bottom: 0; }

/* ── Tarjeta de Traslado ────────────────────────────────────────────────── */

.vx-transfer-card {
	background    : var(--vx-white);
	border        : 1px solid var(--vx-border);
	border-radius : 10px;
	overflow      : hidden;
	margin-bottom : 20px;
}

.vx-transfer-card__title {
	background  : var(--vx-navy);
	color       : var(--vx-white);
	font-weight : 700;
	font-size   : 1rem;
	padding     : 12px 20px;
	letter-spacing: .02em;
}

.vx-transfer-card__route {
	display         : flex;
	align-items     : center;
	gap             : 12px;
	padding         : 14px 20px;
	background      : #f5f7fa;
	border-bottom   : 1px solid var(--vx-border);
	font-size       : .95rem;
}

.vx-transfer-card__point {
	flex       : 1;
	font-weight: 600;
	color      : var(--vx-navy);
}

.vx-transfer-card__arrow {
	font-size  : 1.2rem;
	color      : var(--vx-red);
	flex-shrink: 0;
}

/* ── Tarjeta de Hotel ───────────────────────────────────────────────────── */

.vx-hotel-card {
	background    : var(--vx-white);
	border        : 1px solid var(--vx-border);
	border-radius : var(--vx-radius);
	overflow      : hidden;
	box-shadow    : var(--vx-shadow);
}

.vx-hotel-card__header {
	display         : flex;
	align-items     : center;
	justify-content : space-between;
	padding         : 20px 24px;
	border-bottom   : 1px solid var(--vx-border);
	gap             : 16px;
}

.vx-hotel-card__info {
	flex : 1;
}

.vx-hotel-card__name {
	font-size   : 18px;
	font-weight : 700;
	color       : var(--vx-navy);
	margin      : 0 0 4px;
}

.vx-hotel-card__city {
	font-size : 13px;
	color     : var(--vx-muted);
	margin    : 0;
}

.vx-hotel-card__badges {
	display        : flex;
	flex-direction : column;
	align-items    : flex-end;
	gap            : 8px;
	flex-shrink    : 0;
}

.vx-hotel-status-badge {
	display       : inline-block;
	padding       : 3px 10px;
	border-radius : 20px;
	font-size     : 11px;
	font-weight   : 700;
	letter-spacing: .5px;
	text-transform: uppercase;
	background    : #dbeafe;
	color         : #1e40af;
	white-space   : nowrap;
}

.vx-hotel-card__nights {
	text-align : center;
	background : var(--vx-red);
	color      : #fff;
	border-radius: 8px;
	padding    : 10px 16px;
	flex-shrink: 0;
}

.vx-hotel-nights__num {
	display     : block;
	font-size   : 24px;
	font-weight : 800;
	line-height : 1;
}

.vx-hotel-nights__label {
	font-size : 11px;
	opacity   : .85;
}

.vx-hotel-card__gallery {
	display    : flex;
	gap        : 2px;
	height     : 160px;
	overflow   : hidden;
}

.vx-gallery-thumb {
	flex               : 1;
	background-size    : cover;
	background-position: center;
	min-width          : 0;
	transition         : flex .2s ease;
	border             : none;
	padding            : 0;
	cursor             : pointer;
}

.vx-gallery-thumb:hover {
	flex: 2;
}

.vx-hotel-card__details {
	display               : grid;
	grid-template-columns : repeat(auto-fill, minmax(200px, 1fr));
	padding               : 0;
}

.vx-hotel-detail {
	padding      : 14px 20px;
	border-bottom: 1px solid var(--vx-border);
	border-right : 1px solid var(--vx-border);
	display      : flex;
	flex-direction: column;
	gap          : 3px;
}

.vx-hotel-detail--full {
	grid-column : 1 / -1;
}

.vx-hotel-detail__label {
	font-size      : 10px;
	font-weight    : 700;
	letter-spacing : .8px;
	text-transform : uppercase;
	color          : var(--vx-muted);
}

.vx-hotel-detail__value {
	font-size  : 14px;
	color      : var(--vx-text);
}

.vx-hotel-detail__value a {
	color           : var(--vx-red);
	text-decoration : none;
}

.vx-hotel-card__notes {
	padding    : 14px 20px;
	background : #fafbff;
	font-size  : 13px;
	color      : var(--vx-muted);
	border-top : 1px solid var(--vx-border);
}

.vx-hotel-card__notes p { margin: 0 0 6px; }
.vx-hotel-card__notes p:last-child { margin-bottom: 0; }

.vx-hotel-card__map {
	border-top : 1px solid var(--vx-border);
}

.vx-hotel-card__map iframe {
	display : block;
	width   : 100%;
	height  : 260px;
	border  : none;
}

/* ── Línea de tiempo: Días ──────────────────────────────────────────────── */

.vx-timeline {
	position : relative;
}

.vx-timeline__item {
	display : flex;
	gap     : 20px;
}

.vx-timeline__marker {
	display        : flex;
	flex-direction : column;
	align-items    : center;
	flex-shrink    : 0;
}

.vx-timeline__dot {
	width        : 40px;
	height       : 40px;
	background   : var(--vx-red);
	color        : #fff;
	border-radius: 50%;
	display      : flex;
	align-items  : center;
	justify-content: center;
	font-weight  : 700;
	font-size    : 14px;
	flex-shrink  : 0;
	z-index      : 1;
	box-shadow   : 0 2px 8px rgba(233,69,96,.35);
}

.vx-timeline__line {
	flex       : 1;
	width      : 2px;
	background : var(--vx-border);
	margin     : 4px 0;
}

.vx-timeline__item:last-child .vx-timeline__line {
	display : none;
}

.vx-timeline__content {
	flex          : 1;
	padding-bottom: 28px;
}

.vx-timeline__item:last-child .vx-timeline__content {
	padding-bottom: 0;
}

.vx-day-card {
	background    : var(--vx-white);
	border        : 1px solid var(--vx-border);
	border-radius : var(--vx-radius);
	overflow      : hidden;
	box-shadow    : var(--vx-shadow);
}

.vx-day-card__header {
	padding    : 16px 20px;
	background : linear-gradient(135deg, var(--vx-navy), #0d4a6e);
	display    : flex;
	flex-wrap  : wrap;
	align-items: center;
	gap        : 8px 16px;
}

.vx-day-card__number {
	font-size      : 11px;
	font-weight    : 700;
	letter-spacing : 1px;
	text-transform : uppercase;
	color          : var(--vx-red);
	background     : rgba(233,69,96,.15);
	padding        : 2px 10px;
	border-radius  : 20px;
}

.vx-day-card__date {
	font-size  : 13px;
	color      : rgba(255,255,255,.65);
}

.vx-day-card__title {
	width       : 100%;
	font-size   : 17px;
	font-weight : 700;
	color       : #fff;
	margin      : 4px 0 0;
}

.vx-day-card__activities {
	padding    : 20px;
	font-size  : 14px;
	line-height: 1.7;
	color      : var(--vx-text);
}

.vx-day-card__activities p {
	margin : 0 0 10px;
}

.vx-day-card__activities p:last-child {
	margin-bottom : 0;
}

/* ── Tarjeta de Actividad ───────────────────────────────────────────────── */

.vx-activity-card {
	background    : var(--vx-white);
	border        : 1px solid var(--vx-border);
	border-radius : var(--vx-radius);
	overflow      : hidden;
	box-shadow    : var(--vx-shadow);
}

.vx-activity-card__header {
	display         : flex;
	align-items     : flex-start;
	justify-content : space-between;
	padding         : 20px 24px;
	border-bottom   : 1px solid var(--vx-border);
	gap             : 16px;
	background      : linear-gradient(135deg, var(--vx-navy), #0d4a6e);
}

.vx-activity-card__info {
	flex : 1;
}

.vx-activity-card__name {
	font-size   : 18px;
	font-weight : 700;
	color       : #fff;
	margin      : 0 0 4px;
}

.vx-activity-card__location {
	font-size : 13px;
	color     : rgba(255,255,255,.70);
	margin    : 0;
}

.vx-activity-card__meta {
	display        : flex;
	flex-direction : column;
	align-items    : flex-end;
	gap            : 6px;
	flex-shrink    : 0;
}

.vx-activity-card__date {
	font-size  : 12px;
	color      : rgba(255,255,255,.70);
	white-space: nowrap;
}

.vx-activity-badge {
	display       : inline-block;
	padding       : 3px 10px;
	border-radius : 20px;
	font-size     : 11px;
	font-weight   : 700;
	letter-spacing: .5px;
	text-transform: uppercase;
	white-space   : nowrap;
}

.vx-activity-badge--pending  { background: #fef9c3; color: #854d0e; }
.vx-activity-badge--reserved { background: #dbeafe; color: #1e40af; }
.vx-activity-badge--paid     { background: #dcfce7; color: #166534; }
.vx-activity-badge--optional { background: #f3f4f6; color: #374151; }

.vx-activity-card__gallery {
	display : flex;
	gap     : 2px;
	height  : 150px;
	overflow: hidden;
}

.vx-activity-card__description {
	padding    : 16px 24px;
	font-size  : 14px;
	line-height: 1.7;
	color      : var(--vx-text);
	border-bottom: 1px solid var(--vx-border);
}

.vx-activity-card__description p { margin: 0 0 8px; }
.vx-activity-card__description p:last-child { margin-bottom: 0; }

.vx-activity-card__details {
	display               : grid;
	grid-template-columns : repeat(auto-fill, minmax(160px, 1fr));
	padding               : 0;
}

.vx-activity-detail {
	padding       : 12px 20px;
	border-bottom : 1px solid var(--vx-border);
	border-right  : 1px solid var(--vx-border);
	display       : flex;
	flex-direction: column;
	gap           : 3px;
}

.vx-activity-detail--total {
	background  : rgba(193,135,38,.08);
	font-weight : 700;
}

.vx-activity-detail__label {
	font-size      : 10px;
	font-weight    : 700;
	letter-spacing : .8px;
	text-transform : uppercase;
	color          : var(--vx-muted);
}

.vx-activity-detail__value {
	font-size  : 14px;
	color      : var(--vx-text);
}

.vx-activity-card__includes {
	display : grid;
	grid-template-columns: 1fr 1fr;
	gap     : 0;
}

.vx-activity-includes-col {
	padding      : 14px 20px;
	border-top   : 1px solid var(--vx-border);
}

.vx-activity-includes-col + .vx-activity-includes-col {
	border-left : 1px solid var(--vx-border);
}

.vx-activity-includes-col__header {
	display     : flex;
	align-items : center;
	gap         : 6px;
	font-size   : 13px;
	font-weight : 700;
	color       : var(--vx-navy);
	margin-bottom: 8px;
}

.vx-activity-includes-col__body {
	font-size  : 13px;
	color      : var(--vx-text);
	line-height: 1.6;
}

.vx-activity__list {
	margin     : 0;
	padding    : 0;
	list-style : none;
	display    : flex;
	flex-direction: column;
	gap        : 4px;
}

.vx-activity__list li {
	padding-left: 16px;
	position    : relative;
}

.vx-activity-includes-col--yes .vx-activity__list li::before {
	content    : '✓';
	position   : absolute;
	left       : 0;
	color      : #16a34a;
	font-weight: 700;
}

.vx-activity-includes-col--no .vx-activity__list li::before {
	content    : '×';
	position   : absolute;
	left       : 0;
	color      : var(--vx-red);
	font-weight: 700;
	font-size  : 15px;
}

.vx-activity-card__notes {
	padding    : 14px 20px;
	background : #fafbff;
	font-size  : 13px;
	color      : var(--vx-muted);
	border-top : 1px solid var(--vx-border);
}

.vx-activity-card__notes p { margin: 0 0 6px; }
.vx-activity-card__notes p:last-child { margin-bottom: 0; }

@media (max-width: 640px) {
	.vx-activity-card__includes {
		grid-template-columns: 1fr;
	}
	.vx-activity-includes-col + .vx-activity-includes-col {
		border-left : none;
		border-top  : 1px solid var(--vx-border);
	}
}

/* ── Tabla de Pagos ─────────────────────────────────────────────────────── */

.vx-total-banner {
	display         : flex;
	align-items     : center;
	justify-content : space-between;
	background      : var(--vx-navy);
	color           : #fff;
	border-radius   : var(--vx-radius);
	padding         : 20px 28px;
	margin-bottom   : 20px;
}

.vx-total-banner__label {
	font-size  : 14px;
	opacity    : .75;
}

.vx-total-banner__amount {
	font-size   : 26px;
	font-weight : 800;
	letter-spacing: 1px;
}

.vx-payments-wrap {
	overflow-x    : auto;
	border-radius : var(--vx-radius);
	border        : 1px solid var(--vx-border);
	box-shadow    : var(--vx-shadow);
}

.vx-payments-table {
	width          : 100%;
	border-collapse: collapse;
	background     : var(--vx-white);
	font-size      : 14px;
}

.vx-payments-table thead th {
	background     : var(--vx-navy);
	color          : #fff;
	padding        : 12px 16px;
	text-align     : left;
	font-size      : 11px;
	letter-spacing : .8px;
	text-transform : uppercase;
	font-weight    : 600;
}

.vx-payments-table tbody tr {
	border-bottom : 1px solid var(--vx-border);
}

.vx-payments-table tbody tr:last-child {
	border-bottom : none;
}

.vx-row--even {
	background : #f9fafb;
}

.vx-payments-table td {
	padding        : 12px 16px;
	vertical-align : middle;
}

.vx-cell--num {
	color       : var(--vx-muted);
	font-weight : 700;
	width       : 40px;
	text-align  : center;
}

.vx-cell--amount {
	font-weight : 700;
	color       : var(--vx-navy);
}

.vx-status-badge {
	display       : inline-block;
	padding       : 3px 10px;
	border-radius : 20px;
	font-size     : 12px;
	font-weight   : 600;
}

.vx-status--paid    { background: #dcfce7; color: #166534; }
.vx-status--pending { background: #fef9c3; color: #854d0e; }
.vx-status--overdue { background: #fee2e2; color: #991b1b; }

.vx-payment-note {
	margin-top : 16px;
	font-size  : 12px;
	color      : var(--vx-muted);
	font-style : italic;
}

.vx-payment-note p { margin: 0; }

.vx-pricing-note {
	margin-top : 16px;
	font-size  : 12px;
	color      : var(--vx-muted);
	font-style : italic;
}

/* ── Utilidades ─────────────────────────────────────────────────────────── */

.vx-mono {
	font-family : 'Courier New', Courier, monospace;
}

.vx-badge {
	display       : inline-block;
	padding       : 3px 10px;
	border-radius : 20px;
	font-size     : 12px;
	font-weight   : 600;
}

/* ── Footer ─────────────────────────────────────────────────────────────── */

.vx-footer {
	background : var(--vx-navy);
	color      : rgba(255,255,255,.55);
	text-align : center;
	padding    : 40px 20px;
}

.vx-footer__logo {
	font-size      : 28px;
	font-weight    : 800;
	color          : var(--vx-red);
	letter-spacing : 3px;
	text-transform : uppercase;
	margin-bottom  : 6px;
}

.vx-footer__tagline {
	font-size  : 13px;
	color      : rgba(255,255,255,.45);
	margin     : 0 0 16px;
	letter-spacing: 1px;
}

.vx-footer__contact {
	font-size  : 13px;
	color      : rgba(255,255,255,.60);
	margin     : 0 0 8px;
}

.vx-footer__disclaimer {
	font-size  : 11px;
	color      : rgba(255,255,255,.35);
	margin     : 0;
	font-style : italic;
}

/* ── Shortcode wrapper ──────────────────────────────────────────────────── */

.vx-itinerary-shortcode .vx-hero {
	min-height  : 280px;
	border-radius: var(--vx-radius) var(--vx-radius) 0 0;
}

.vx-itinerary-shortcode .vx-nav {
	position : static;
	border-radius: 0;
}

.vx-itinerary-shortcode .vx-wrap {
	background    : var(--vx-bg);
	border-radius : 0 0 var(--vx-radius) var(--vx-radius);
}

.vx-itinerary-shortcode .vx-footer {
	border-radius: 0 0 var(--vx-radius) var(--vx-radius);
}

/* ── FAQs ───────────────────────────────────────────────────────────────── */

.vx-faq-list {
	display        : flex;
	flex-direction : column;
	gap            : 0;
	border         : 1px solid var(--vx-border);
	border-radius  : var(--vx-radius);
	overflow       : hidden;
}

.vx-faq-item {
	border-bottom : 1px solid var(--vx-border);
}

.vx-faq-item:last-child {
	border-bottom : none;
}

.vx-faq-question {
	display         : flex;
	align-items     : center;
	justify-content : space-between;
	width           : 100%;
	padding         : 18px 20px;
	background      : var(--vx-white);
	border          : none;
	cursor          : pointer;
	text-align      : left;
	gap             : 12px;
	transition      : background .15s;
}

.vx-faq-question:hover {
	background : var(--vx-red-h);
}

.vx-faq-question[aria-expanded="true"] {
	background    : var(--vx-red-h);
	border-bottom : 1px solid var(--vx-border);
}

.vx-faq-question__text {
	font-size   : 15px;
	font-weight : 600;
	color       : var(--vx-navy);
	line-height : 1.4;
}

.vx-faq-question__icon {
	flex-shrink  : 0;
	width        : 20px;
	height       : 20px;
	border-radius: 50%;
	background   : var(--vx-navy);
	position     : relative;
	transition   : transform .2s, background .15s;
}

.vx-faq-question__icon::before,
.vx-faq-question__icon::after {
	content    : '';
	position   : absolute;
	background : var(--vx-white);
	border-radius: 2px;
	top        : 50%;
	left       : 50%;
	transform  : translate(-50%, -50%);
}

.vx-faq-question__icon::before {
	width  : 10px;
	height : 2px;
}

.vx-faq-question__icon::after {
	width     : 2px;
	height    : 10px;
	transition: transform .2s;
}

.vx-faq-question[aria-expanded="true"] .vx-faq-question__icon {
	background : var(--vx-red);
}

.vx-faq-question[aria-expanded="true"] .vx-faq-question__icon::after {
	transform : translate(-50%, -50%) rotate(90deg);
}

.vx-faq-answer {
	background : var(--vx-white);
}

.vx-faq-answer__inner {
	padding     : 16px 20px 20px;
	font-size   : 14px;
	color       : var(--vx-text);
	line-height : 1.7;
}

.vx-faq-answer__inner p  { margin: 0 0 10px; }
.vx-faq-answer__inner p:last-child { margin-bottom: 0; }
.vx-faq-answer__inner ul { padding-left: 20px; margin: 0 0 10px; }
.vx-faq-answer__inner li { margin-bottom: 4px; }
.vx-faq-answer__inner a  { color: var(--vx-navy); text-decoration: underline; }

/* ── FAQ Embed externo ──────────────────────────────────────────────────── */

.vx-faq-embed {
	display         : flex;
	justify-content : center;
	align-items     : center;
	padding         : 20px 0 4px;
}

.vx-faq-embed iframe {
	display      : block;
	max-width    : 100%;
	border-radius: 6px;
}

/* ── Sección Embed (Viaje) ──────────────────────────────────────────────── */

.vx-embed-wrap {
	display         : flex;
	justify-content : center;
	align-items     : center;
	padding         : 8px 0;
	width           : 100%;
}

.vx-embed-wrap iframe {
	display      : block;
	max-width    : 100%;
	width        : 100%;
	border-radius: 6px;
}

/* ── Reel de Imágenes (Viaje) ───────────────────────────────────────────── */

.vx-viaje-reel {
	display  : flex;
	height   : 260px;
	gap      : 3px;
	overflow : hidden;
}

.vx-viaje-reel__thumb {
	flex               : 1;
	min-width          : 0;
	background-size    : cover;
	background-position: center;
	transition         : flex .3s ease;
	cursor             : zoom-in;
	border             : none;
	padding            : 0;
	position           : relative;
}

.vx-viaje-reel__thumb::after {
	content    : '⤢';
	position   : absolute;
	inset      : 0;
	display    : flex;
	align-items: center;
	justify-content: center;
	font-size  : 28px;
	color      : #fff;
	background : rgba(9,50,71,.0);
	transition : background .2s;
	pointer-events: none;
}

.vx-viaje-reel__thumb:hover {
	flex : 3;
}

.vx-viaje-reel__thumb:hover::after {
	background : rgba(9,50,71,.35);
}

/* Ajuste para shortcode */
.vx-itinerary-shortcode .vx-viaje-reel {
	height : 200px;
}

/* ── Lightbox ────────────────────────────────────────────────────────────── */

.vx-lightbox {
	position  : fixed;
	inset     : 0;
	z-index   : 9999;
	display   : flex;
	align-items: center;
	justify-content: center;
}

.vx-lightbox[hidden] {
	display : none;
}

.vx-lightbox__overlay {
	position   : absolute;
	inset      : 0;
	background : rgba(0,0,0,.88);
	cursor     : zoom-out;
}

.vx-lightbox__stage {
	position        : relative;
	z-index         : 1;
	display         : flex;
	align-items     : center;
	justify-content : center;
	gap             : 12px;
	width           : 100%;
	height          : 100%;
	padding         : 60px 16px 48px;
	box-sizing      : border-box;
}

.vx-lightbox__img {
	max-width    : calc(100% - 120px);
	max-height   : 100%;
	object-fit   : contain;
	border-radius: 4px;
	box-shadow   : 0 8px 40px rgba(0,0,0,.6);
	display      : block;
	transition   : opacity .2s;
}

.vx-lightbox__img.is-loading {
	opacity : 0;
}

.vx-lightbox__close {
	position     : absolute;
	top          : 16px;
	right        : 16px;
	width        : 40px;
	height       : 40px;
	border-radius: 50%;
	background   : rgba(255,255,255,.15);
	color        : #fff;
	border       : 1px solid rgba(255,255,255,.3);
	font-size    : 18px;
	cursor       : pointer;
	display      : flex;
	align-items  : center;
	justify-content: center;
	transition   : background .15s;
	line-height  : 1;
}

.vx-lightbox__close:hover {
	background : rgba(255,255,255,.30);
}

.vx-lightbox__prev,
.vx-lightbox__next {
	flex-shrink    : 0;
	width          : 48px;
	height         : 48px;
	border-radius  : 50%;
	background     : rgba(255,255,255,.15);
	color          : #fff;
	border         : 1px solid rgba(255,255,255,.25);
	font-size      : 28px;
	cursor         : pointer;
	display        : flex;
	align-items    : center;
	justify-content: center;
	transition     : background .15s;
	line-height    : 1;
	user-select    : none;
}

.vx-lightbox__prev:hover,
.vx-lightbox__next:hover {
	background : rgba(255,255,255,.28);
}

.vx-lightbox__prev[hidden],
.vx-lightbox__next[hidden] {
	visibility : hidden;
	pointer-events: none;
}

.vx-lightbox__counter {
	position   : absolute;
	bottom     : 16px;
	left       : 50%;
	transform  : translateX(-50%);
	font-size  : 13px;
	color      : rgba(255,255,255,.65);
	white-space: nowrap;
}

@media (max-width: 640px) {
	.vx-lightbox__img {
		max-width: calc(100% - 80px);
	}
	.vx-lightbox__prev,
	.vx-lightbox__next {
		width  : 36px;
		height : 36px;
		font-size: 22px;
	}
}

/* ── Tabla de Condiciones del Viaje ─────────────────────────────────────── */

.vx-pricing-table {
	width           : 100%;
	border-collapse : collapse;
	border-radius   : var(--vx-radius);
	overflow        : hidden;
	box-shadow      : var(--vx-shadow);
}

.vx-pricing-table__th {
	background  : var(--vx-red);
	color       : #fff;
	font-size   : 15px;
	font-weight : 700;
	padding     : 14px 20px;
	text-align  : left;
	letter-spacing: .3px;
}

.vx-pricing-table__th:first-child { width: 62%; }
.vx-pricing-table__th:last-child  { width: 38%; }

.vx-pricing-table__row {
	border-bottom : 1px solid var(--vx-border);
}

.vx-pricing-table__row:last-child {
	border-bottom : none;
}

.vx-pricing-table__conditions,
.vx-pricing-table__cost {
	background  : var(--vx-red-h);
	padding     : 14px 20px;
	vertical-align: top;
	font-size   : 14px;
	line-height : 1.65;
	color       : var(--vx-text);
}

.vx-pricing-table__conditions p {
	margin : 0 0 4px;
}

.vx-pricing-table__conditions p:last-child {
	margin-bottom : 0;
}

.vx-pricing-table__cost {
	font-weight : 600;
	white-space : nowrap;
}

/* ── Responsive ─────────────────────────────────────────────────────────── */

@media (max-width: 640px) {
	.vx-hero__content         { padding: 28px 16px; }
	.vx-wrap                  { padding: 20px 12px 40px; }
	.vx-flight-card__route    { flex-direction: column; padding: 20px 16px; }
	.vx-flight-route__arrow   { flex-direction: row; width: 100%; }
	.vx-hotel-card__gallery   { height: 120px; }
	.vx-total-banner          { flex-direction: column; gap: 4px; text-align: center; }
	.vx-total-banner__amount  { font-size: 22px; }
	.vx-client-card__grid     { grid-template-columns: 1fr 1fr; }
}

@media print {
	.vx-nav  { display: none; }
	.vx-hero { min-height: 180px; }
	.vx-hotel-card__gallery { height: 100px; }
	.vx-timeline__line { display: none; }
}