/* =====================================================================
   XPC · VERSIÓN MÓVIL — xpc_movil.css
   ---------------------------------------------------------------------
   Reglas:
   - Se carga DESPUÉS del CSS propio de cada página.
   - Todo lo móvil vive en @media (max-width: 767px). Escritorio intacto.
   - Cada pantalla se aísla con una clase en <html>: .xpc-<pantalla>
	 (ej. <html class="xpc-login">), para que sus reglas no se crucen.
   - Colores: variables en :root (sección 00). El backoffice las
	 sobrescribe imprimiendo DESPUÉS de este archivo:
	   <style>:root{ --xpc-primario:#xxxxxx; ... }</style>
	 Originales: naranja #ffa602 · azul #2d3e52 · verde #147b76 · negro #111111

   Índice
	00. Variables de color (:root)
	 0. Global — bloqueo de rotación
	 1. Login de Agencias (.xpc-login)
		1.B Login tipo solapa (.columna_login) + registro en hoja
	 2. Páginas internas (.xpc-interna)
		2.1 Barra de administrador (#admin-topbar)
		2.2 Buscadores: Hoteles · Traslados · Tours
		2.3 Barra inferior estilo app (tab bar)
		2.4 Vencimientos de Tiempo Límite (lightbox)
		2.5 Footer: oficinas en carrusel
		2.6 Header: logo centrado + separación
		2.7 Autocompletar (destino, hotel, aeropuerto)
		2.8 Loader de búsqueda (nubes / fotos)
		2.9 Calendario (jQuery UI datepicker)
	 3. Resultados de Hoteles
		3.1 Barra de admin con más opciones
		3.2 Título / detalles de búsqueda
		3.3 Pestañas de cotizaciones
		3.4 Filtros (hoja completa, ✕, Limpiar/Aplicar) + chips
		3.5 Tarjeta de hotel
		3.6 Habitaciones (1 a 4, selección por habitación)
		3.7 Paginado
		3.8 Detalle en hoja (#details-modal)
		3.9 Contenido del detalle (fotos, pestañas, tarifas, amenidades)
	 4. Resultados: selector Hoteles | Tours y tarjeta de tour
	 5. Resultados de Traslados (tarjeta, itinerario, ordenar)
	 6. Detalle de Traslado y de Tour (orden, resumen, formulario, pie fijo)
	 7. Avisos del sitio (notifyBox) en páginas internas
	 8. Carrito (pasos por servicio, agregar más, resumen y pago)
	 9. Resumen de compra (reserva hecha)
   ===================================================================== */


/* =====================================================================
   00. VARIABLES DE COLOR
   Valores por omisión (cliente original). Cada cliente las sobrescribe
   desde el backoffice con un <style>:root{…}</style> posterior.
   Las sombras y transparencias del primario se derivan solas
   (color-mix), no hay que configurarlas.
   ===================================================================== */
:root{
	--xpc-primario:        #ffa602;   /* botones, activos, bordes, íconos */
	--xpc-primario-claro:  #ffbe3d;   /* arriba del degradado de botones */
	--xpc-primario-oscuro: #f29400;   /* abajo del degradado / presionado */
	--xpc-primario-texto:  #e08a00;   /* texto primario sobre fondo claro */
	--xpc-primario-suave:  #fff3dc;   /* fondos de aviso / resaltado */
	--xpc-primario-tenue:  #fffaf0;   /* fondos muy claros (seleccionado) */
	--xpc-sobre-primario:  #ffffff;   /* texto encima del primario */
	--xpc-secundario:      #2d3e52;   /* títulos, barras oscuras */
	--xpc-acento:          #147b76;   /* verde de ligas / detalles */
	--xpc-oscuro:          #111111;   /* fondo negro (login, footer) */
	--xpc-texto:           #333333;
	--xpc-texto-suave:     #8a8a8a;
	--xpc-peligro:         #c0392b;   /* cerrar sesión, errores */
	--xpc-logo-alto:       38px;      /* alto del logo en el header móvil */
	--xpc-loader-logo:     100px;     /* alto máximo del logo en el loader */
	/* --xpc-loader-fondo / --xpc-loader-texto: opcionales (loader con color propio) */

	--xpc-degradado: linear-gradient(180deg, var(--xpc-primario-claro) 0%, var(--xpc-primario) 55%, var(--xpc-primario-oscuro) 100%);
}



/* =====================================================================
   0. GLOBAL — BLOQUEO DE ROTACIÓN (teléfono en horizontal)
   ===================================================================== */
@media (orientation: landscape) and (max-height: 500px) and (pointer: coarse) {

	html, body{ overflow: hidden !important; }
	body > *{ visibility: hidden !important; }

	body::before{
		content: var(--xpc-t-girar, 'Gira tu teléfono a vertical\A para continuar');
		white-space: pre;
		position: fixed;
		top: 0; right: 0; bottom: 0; left: 0;
		display: flex;
		align-items: center;
		justify-content: center;
		padding-top: 110px;
		background: var(--xpc-oscuro);
		color: var(--xpc-primario);
		font: 600 16px/1.5 Helvetica, Arial, sans-serif;
		text-align: center;
		visibility: visible;
		z-index: 2147483646;
	}

	body::after{
		content: '';
		position: fixed;
		top: 50%;
		left: 50%;
		width: 34px;
		height: 58px;
		margin: -64px 0 0 -20px;
		border: 3px solid var(--xpc-primario);
		border-radius: 8px;
		visibility: visible;
		z-index: 2147483647;
		animation: xpcGirar 2.2s ease-in-out infinite;
	}
}

@keyframes xpcGirar{
	0%, 20%   { transform: rotate(-90deg); }
	50%, 100% { transform: rotate(0deg); }
}

@keyframes xpcBajar{
	0%, 100% { transform: translateY(0) rotate(45deg); opacity: 1; }
	50%      { transform: translateY(6px) rotate(45deg); opacity: .5; }
}


/* =====================================================================
   1. LOGIN DE AGENCIAS — <html class="xpc-login">
   Página con scroll: Login (1a pantalla) → Registro abajo → Footer.
   ===================================================================== */
@media (max-width: 767px) {

	/* ---------- Base: se libera el scroll ---------- */
	html.xpc-login{
		width: auto;
		height: auto;
		overflow-x: hidden;
		overflow-y: auto;
		background-attachment: scroll;        /* iOS no soporta fixed + cover */
		background-size: auto 100vh;          /* la foto ocupa solo la 1a pantalla */
		background-size: auto 100svh;
		background-position: top center;
		background-color: var(--xpc-oscuro);            /* mismo negro del footer */
	}

	.xpc-login body{
		height: auto;
		min-height: 100vh;
		overflow: visible;
		padding: 0;
		-webkit-text-size-adjust: 100%;
	}

	/* ---------- 1a pantalla: tarjeta Login / Recuperar ---------- */
	.xpc-login #formContainer{
		width: calc(100vw - 32px);
		max-width: 360px;
		height: 390px;
		margin: 0 auto;
		margin-top: max(24px, calc((100vh - 490px) / 2));
		margin-top: max(24px, calc((100svh - 490px) / 2));   /* tarjeta + indicador = 1a pantalla exacta */
	}

	.xpc-login #formContainer form{
		display: flex;
		flex-direction: column;
		padding: 0 24px 20px;
		box-sizing: border-box;
		border-radius: 0 0 14px 14px;
	}

	.xpc-login #formContainer #login{
		padding-top: 132px;
		background-size: 220px;
		background-position-y: 36px;
	}

	.xpc-login #formContainer #recover{
		padding-top: 96px;
		background-size: 150px;
		background-position-y: 24px;
	}

	.xpc-login #login:after{ display: none; }   /* tooltip "click here" se sale de pantalla */

	.xpc-login #formContainer input[type="text"],
	.xpc-login #formContainer input[type="password"]{
		position: static;
		width: 100%;
		height: 50px;
		box-sizing: border-box;
		padding: 0 16px;
		text-indent: 0;
		font-size: 16px;                      /* <16px = iOS hace zoom al enfocar */
		-webkit-appearance: none;
		appearance: none;
	}

	.xpc-login #loginEmail{ margin-bottom: 1px; }
	.xpc-login #recoverEmail{ border-radius: 10px; }

	.xpc-login #formContainer input[type="submit"]{
		position: static;
		width: 100%;
		height: 48px;
		margin-top: 16px;
		font-size: 16px;
		line-height: 48px;
		-webkit-appearance: none;
		appearance: none;
	}

	.xpc-login #login .flipLink,
	.xpc-login #recover .flipLink{
		position: static;
		order: 10;                            /* el link va debajo del botón */
		width: 100%;
		height: 44px;
		margin-top: 8px;
		font-size: 15px;
	}

	.xpc-login .recuperar_txt{
		top: auto;
		padding: 0 4px 16px;
		font-size: 14px;
		line-height: 1.4;
	}

	/* ---------- Registro: panel lateral → sección debajo del login ---------- */
	.xpc-login .registro{
		position: static;
		width: auto;
		height: auto;
		margin: 0;
		right: auto !important;               /* el JS de escritorio escribe "right" inline */
		transition: none;
	}

	/* La pestaña se vuelve indicador "REGISTRO ⌄" al pie de la 1a pantalla */
	.xpc-login .registro .tab{
		transform: none;
		width: auto;
		height: 100px;
		margin: 0;
		margin-top: max(24px, calc((100vh - 490px) / 2));
		margin-top: max(24px, calc((100svh - 490px) / 2));
		padding: 34px 0 0;
		box-sizing: border-box;
		background: linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,.55)); /* funde la foto con el registro */
		box-shadow: none;
		border-radius: 0;
		opacity: 1;
		color: rgba(255,255,255,.85);
		font-size: 11px;
		font-weight: 600;
		letter-spacing: 4px;
		text-transform: uppercase;
		text-shadow: 0 1px 3px rgba(0,0,0,.6);
	}

	.xpc-login .registro .tab::after{
		content: '';
		display: block;
		width: 9px;
		height: 9px;
		margin: 10px auto 0;
		border-right: 2px solid var(--xpc-primario);
		border-bottom: 2px solid var(--xpc-primario);
		transform: rotate(45deg);
		animation: xpcBajar 1.8s ease-in-out infinite;
	}

	.xpc-login .registro .formRegistro{
		float: none;
		width: auto;
		height: auto;
		min-height: 0;
		margin: 0;
		padding: 36px 20px 40px;
		background-color: rgba(0,0,0,.7);
		border-top: 4px solid var(--xpc-primario);
	}

	.xpc-login .registro .row{
		margin: 0;
		max-height: none;
		overflow: visible;
	}

	.xpc-login .registro #register{
		float: none;
		width: auto;
		margin: 0;
		padding: 0;
	}

	.xpc-login .registro .signup-heading{
		font-size: 24px;
		line-height: 1.25;
		text-transform: none;
		margin: 0 0 24px;
	}

	.xpc-login .registro .signup-heading::before{   /* eyebrow "ALTA DE AGENCIAS" */
		content: var(--xpc-t-alta, 'Alta de agencias');
		display: block;
		margin-bottom: 10px;
		color: var(--xpc-primario);
		font: 600 11px/1 Helvetica, Arial, sans-serif;
		letter-spacing: 4px;
		text-transform: uppercase;
	}

	.xpc-login .registro .input-field{
		float: none;
		padding: 0;
		margin-bottom: 12px;
	}

	.xpc-login .registro .input-field br{ display: none; }

	.xpc-login .registro .input-field input[type="text"]{
		width: 100%;
		height: 50px;
		box-sizing: border-box;
		margin: 0;
		padding: 0 14px;
		text-indent: 0;
		font-size: 16px;
		background-color: rgba(255,255,255,.06);
		border: 1px solid rgba(255,255,255,.18);
		border-radius: 10px;
	}

	.xpc-login .registro .input-field input[type="text"]:focus{
		border-color: var(--xpc-primario);
		box-shadow: 0 0 0 3px color-mix(in srgb, var(--xpc-primario) 20%, transparent);
	}

	.xpc-login .registro .ErrorLabel{
		margin-top: 6px;
		font-size: 12px;
		line-height: 1.3;
	}

	.xpc-login .registro .div-btn-primary{
		width: 100%;
		height: 52px;
		margin: 24px 0 0;
		border-radius: 10px;
		font-size: 15px;
		line-height: 52px;
		letter-spacing: 2px;
		text-transform: uppercase;
	}
	.xpc-login .registro .div-btn-primary a{ display: block; }

	/* ---------- Footer: al final de la página ---------- */
	.xpc-login footer{
		position: static;
		height: auto;
	}

	.xpc-login footer h2{
		position: static;
		line-height: 52px;
		font-size: 13px;
	}

	/* ---------- Notificaciones ---------- */
	/* El original oscurece con opacity:.7 y el aviso de "Recuperar" vive
	   DENTRO de #loader-container → heredaba la transparencia.
	   Se oscurece con rgba() para que el cuadro quede 100% sólido. */
	.xpc-login .overlayNotify{
		opacity: 1;
		background: rgba(0,0,0,.7);
	}

	.xpc-login .notifyBox{
		left: 50%;
		top: 50%;
		width: calc(100% - 48px);
		max-width: 360px;
		margin: 0;
		padding: 28px 24px 24px;
		box-sizing: border-box;
		transform: translate(-50%, -50%);
		background: #ffffff;
		border-top: 6px solid var(--xpc-primario);
		border-radius: 14px;
		box-shadow: 0 12px 40px rgba(0,0,0,.45);
		opacity: 1;
	}

	.xpc-login .notifyConten{
		padding-bottom: 20px;
		color: var(--xpc-texto);
		font-size: 15px;
		line-height: 1.45;
	}

	.xpc-login .btn-search4{
		min-height: 46px;
		min-width: 140px;
		font-size: 16px;
		-webkit-appearance: none;
		appearance: none;
	}

	/* Mientras se muestra el aviso de Recuperar, se ocultan los puntos del loader */
	.xpc-login #loader-container:has(#login-message:not(.none)) .lds-ellipsis{ display: none; }

	/* Con cualquier aviso abierto, la página de atrás no hace scroll */
	html.xpc-login:has(.overlayNotify:not(.none)){ overflow: hidden; }

	/* ---------- Restablecer contraseña (#restablish) ---------- */
	/* Misma página base del login, pero sin sección de Registro:
	   la tarjeta se centra y el footer se va al fondo. */
	.xpc-login body:has(#restablish){
		display: flex;
		flex-direction: column;
		min-height: 100vh;
		min-height: 100svh;
	}

	.xpc-login body:has(#restablish) #formContainer{
		margin: auto;                          /* centrado vertical */
		margin-top: max(24px, calc((100svh - 390px - 52px) / 2));
		margin-bottom: 24px;
	}

	.xpc-login body:has(#restablish) footer{ margin-top: auto; }

	.xpc-login #formContainer #restablish{
		padding-top: 110px;
		font-size: 0;                          /* anula los <br>&nbsp; de relleno */
		background-color: rgba(255,255,255,.9);
		background-size: 150px;
		background-position-y: 28px;
	}

	.xpc-login #restablish br{ display: none; }

	.xpc-login #restablish .welcome_text{
		width: auto;
		margin: 0 0 16px;
		font: 600 15px/1.4 Helvetica, Arial, sans-serif;
		color: var(--xpc-acento);
	}

	.xpc-login #restablish #loginPass2{
		margin-bottom: 1px;
		border-radius: 10px 10px 0 0;
	}

	/* ---------- Botones: color primario con degradado suave ---------- */
	.xpc-login #formContainer input[type="submit"],
	.xpc-login .registro .div-btn-primary,
	.xpc-login .btn-search4{
		background-image: var(--xpc-degradado);
		border-radius: 10px;
		box-shadow: 0 6px 16px color-mix(in srgb, var(--xpc-primario) 35%, transparent), inset 0 1px 0 rgba(255,255,255,.35);
		color: var(--xpc-sobre-primario);
		font-weight: 700;
		letter-spacing: .5px;
		text-shadow: 0 1px 1px rgba(0,0,0,.15);
		opacity: 1;
	}

	.xpc-login #formContainer input[type="submit"]:active,
	.xpc-login .registro .div-btn-primary:active,
	.xpc-login .btn-search4:active{
		transform: translateY(1px);
		box-shadow: 0 3px 8px color-mix(in srgb, var(--xpc-primario) 30%, transparent);
	}
}


/* =====================================================================
   1.B LOGIN TIPO SOLAPA — skins con .columna_login (ej. Expert in Destination)
   En escritorio: columna lateral + registro en cajón (drawer) a la derecha.
   En móvil: la columna ocupa la pantalla (logo, campos y ligas en la 1a
   vista, con scroll si no caben) y el registro abre como hoja completa.
   Todo se aísla con :has(.columna_login) para no tocar el login clásico.
   ===================================================================== */
@media (max-width: 767px) {

	/* ---------- Base: el tema bloquea el scroll (body.login 100vh) ---------- */
	html.xpc-login:has(.columna_login){
		height: auto;
		background: var(--xpc-oscuro);
	}
	html.xpc-login body.login:has(.columna_login){
		height: auto !important;
		min-height: 100vh !important;
		min-height: 100svh !important;
		padding: 0 !important;
		overflow-x: hidden !important;
		overflow-y: auto !important;
	}
	.xpc-login body:has(.columna_login) > .row{
		height: auto !important;
		margin: 0;
	}
	.xpc-login body:has(.columna_login) #background-video{
		position: fixed;
		inset: 0;
		width: 100%;
		height: 100%;
		object-fit: cover;
	}

	/* ---------- Solapa: pantalla completa, contenido centrado ---------- */
	.xpc-login .columna_login{
		position: relative;
		float: none;
		display: flex;
		flex-direction: column;
		justify-content: center;
		width: 100% !important;
		min-width: 0 !important;
		height: auto !important;
		min-height: 100vh;
		min-height: 100svh;
		padding: 72px 24px calc(28px + env(safe-area-inset-bottom));
		box-sizing: border-box;
		margin: 0 !important;                  /* skins con la solapa flotante (margin/float/radio) */
		border-right: 0 !important;
		border-radius: 0 !important;
		box-shadow: none !important;
	}

	.xpc-login .columna_login #formContainer{
		width: 100%;
		max-width: 360px;
		height: auto;
		margin: 0 auto;
		padding: 0;
		perspective: none;
	}

	/* Sin volteo 3D: se muestra solo el formulario activo */
	.xpc-login .columna_login #formContainer form{
		position: static;
		height: auto;
		padding: 0 !important;             /* el login clásico pone 132px */
		transform: none !important;
		transition: none;
		opacity: 1;
		background: none !important;
		border-radius: 0;
	}
	.xpc-login .columna_login #formContainer:not(.flipped) #recover,
	.xpc-login .columna_login #formContainer.flipped #login{ display: none; }

	/* Logo más compacto y pegado a los campos */
	.xpc-login .columna_login .input_group{ margin-top: 0 !important; }
	.xpc-login .columna_login .input_group:has(> img){
		margin: 0 0 28px !important;
		text-align: center;
	}
	.xpc-login .columna_login .input_group > img{
		max-height: 96px !important;
		max-width: 220px !important;
	}

	/* Campos */
	.xpc-login .columna_login .signin_label{ margin: 0 0 6px; }
	.xpc-login .columna_login .input_group + .pass_group,
	.xpc-login .columna_login .input_group + .input_group{ margin-top: 16px; }
	.xpc-login .columna_login #formContainer input[type="text"],
	.xpc-login .columna_login #formContainer input[type="password"]{
		max-width: none;
		border-radius: 12px !important;
	}
	.xpc-login .columna_login #loginEmail{ margin-bottom: 0; }
	.xpc-login .columna_login .toggle_password{
		right: 6px;
		bottom: 0;
		width: 44px;
		height: 50px;
	}

	/* Botón: mismo radio que escritorio */
	.xpc-login .columna_login #formContainer input[type="submit"]{
		max-width: none;
		margin-top: 8px;
		border-radius: 14px !important;
	}

	/* Ligas legibles (escritorio las oculta con text-indent) */
	.xpc-login .columna_login .pass_group{ text-align: center; }
	.xpc-login .columna_login .pass_group br{ display: none; }
	.xpc-login .columna_login #login .flipLink,
	.xpc-login .columna_login #recover .flipLink{
		display: flex !important;
		align-items: center;
		justify-content: center;
		height: 44px !important;
		margin-top: 8px;
		text-indent: 0 !important;
		font-size: 14px;
		text-transform: none;
		color: inherit !important;             /* toma el color del texto de la solapa (clara u oscura) */
		opacity: .8;
	}
	.xpc-login .columna_login a#Register.tab,
	.xpc-login .columna_login a#DMCRegister.tab2{
		display: flex;
		width: 100%;
		align-items: center;
		justify-content: center;
		min-height: 46px;
		margin-top: 4px;
		box-sizing: border-box;
		font-size: 14px;
		text-align: center;
	}
	/* Forma de botón por omisión (baja especificidad: si la skin ya lo estiliza, gana la skin) */
	:where(.xpc-login .columna_login) a#Register.tab,
	:where(.xpc-login .columna_login) a#DMCRegister.tab2{
		padding: 0 16px;
		border: 1px solid currentColor;
		border-radius: 999px;
	}

	.xpc-login .columna_login .recuperar_txt{
		margin: 0 0 16px;
		padding: 0;
		text-transform: none;
	}

	/* ---------- Registro: cajón → hoja a pantalla completa ---------- */
	/* Se fija aquí (no todas las skins lo hacen; sin custom.js la hoja quedaba en el flujo) */
	.xpc-login .registro,
	.xpc-login .DMCRegistro{
		position: fixed !important;
		top: 0 !important;
		bottom: 0;
		z-index: 200000 !important;
		margin: 0 !important;
		-webkit-backdrop-filter: blur(16px);
		backdrop-filter: blur(16px);            /* fondos translúcidos: no se lee el login de atrás */
		left: 0 !important;
		right: auto !important;
		width: 100% !important;
		height: 100% !important;
		transform: translateX(100%);
		visibility: hidden;
		transition: transform .35s cubic-bezier(.2,.9,.2,1), visibility 0s .35s !important;
	}
	.xpc-login .registro.is-open,
	.xpc-login .DMCRegistro.is-open{
		right: auto !important;
		transform: none;
		visibility: visible;
		transition: transform .35s cubic-bezier(.2,.9,.2,1) !important;
	}
	.xpc-login .registro .formRegistro,
	.xpc-login .DMCRegistro .formRegistro2{
		height: 100% !important;
		padding: 64px 20px calc(32px + env(safe-area-inset-bottom)) !important;
		border: 0 !important;
		box-sizing: border-box;
		overflow-y: auto !important;
		-webkit-overflow-scrolling: touch;
	}
	.xpc-login body:has(.columna_login) .registro .signup-heading{
		margin: 0 0 20px;
		font-size: 22px;
	}
	.xpc-login body:has(.columna_login) .registro .signup-heading::before{ display: none; }   /* eyebrow fijo en español del login clásico */
	.xpc-login .registro .input-field input[type="text"],
	.xpc-login .registro .input-field select{
		width: 100% !important;
		height: 50px !important;
		box-sizing: border-box;            /* el país se salía de la hoja */
		font-size: 16px;
	}
	.xpc-login .registro .div-btn-primary{ box-sizing: border-box; max-width: none; padding: 0 !important; }
	/* Botón ✕ (lo pone custom.js o xpc_movil.js): look por omisión de baja especificidad */
	:where(.xpc-login .registro, .xpc-login .DMCRegistro) :is(.drawer-close, .xpc-hoja-cerrar){
		border: 1px solid rgba(255,255,255,.3);
		border-radius: 50%;
		background: rgba(0,0,0,.25);
		color: #ffffff;
	}
	.xpc-login .registro :is(.drawer-close, .xpc-hoja-cerrar),
	.xpc-login .DMCRegistro :is(.drawer-close, .xpc-hoja-cerrar){
		display: flex;
		align-items: center;
		justify-content: center;
		z-index: 2;
		position: fixed;
		top: 12px;
		right: 12px;
		width: 44px;
		height: 44px;
		font-size: 18px;
	}

	/* Con la hoja abierta, la página de atrás no se mueve */
	html.xpc-login:has(.registro.is-open, .DMCRegistro.is-open),
	html.xpc-login:has(.registro.is-open, .DMCRegistro.is-open) body{ overflow: hidden !important; }
	html.xpc-login:has(.registro.is-open, .DMCRegistro.is-open) a.whatsapp-link{ display: none !important; }
	.xpc-login :is(.registro, .DMCRegistro):has(.drawer-close) .xpc-hoja-cerrar{ display: none; }
}

/* =====================================================================
   2. PÁGINAS INTERNAS — <html class="xpc-interna">
   Header y footer compartidos (theme Travelo + Bootstrap 3).
   ===================================================================== */
@media (max-width: 767px) {

	/* ---------- 2.1 Barra de administrador (#admin-topbar) ----------
	   Llega por JS y le pone al body un padding-top igual a su altura
	   (offsetHeight) al cargar: si la barra mide menos, el header sube solo. */
	.xpc-interna #admin-topbar{
		width: 100%;
		min-height: 44px;
		font-size: 12px;
	}

	.xpc-interna #admin-topbar .bar-container{
		align-items: center;
		padding: 4px 0 4px 12px;
		box-sizing: border-box;
	}

	/* Bienvenida: máximo 2 líneas, el resto con "…" */
	.xpc-interna #bar-welcome{
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 2;
		overflow: hidden;
		min-width: 0;
		font-size: 11px;
		line-height: 1.35;
		color: var(--admin-text-secondary);
	}

	.xpc-interna #bar-menu-items{
		flex-shrink: 0;
		align-items: center;
	}

	/* Items vacíos (hoteles bloqueados sin datos, separador final) no ocupan lugar */
	.xpc-interna #admin-topbar .bar-menu-item:not(:has(*)){ display: none; }

	.xpc-interna #admin-topbar .bar-menu-item{
		padding: 0 12px;
		align-items: center;
	}

	/* "Mostrar duplicados" → "Duplicados" para que quepa en una línea */
	.xpc-interna #n-bar-show_all_brokers label[for="duplicate-switch"]{
		font-size: 0 !important;
		margin-right: 8px !important;
	}
	.xpc-interna #n-bar-show_all_brokers label[for="duplicate-switch"]::before{
		content: var(--xpc-t-duplicados, 'Duplicados');
		font-size: 12px;
		color: var(--admin-text);
	}

	/* Switch un poco más grande para el dedo */
	.xpc-interna #admin-topbar .n-switch{ --h: 24px; }

	/* Menús desplegables de la barra: dentro de la pantalla */
	.xpc-interna #admin-topbar .n-dropdown{ right: 0; }
	.xpc-interna #admin-topbar .n-dropdown-container{
		max-width: calc(100vw - 24px);
		box-sizing: border-box;
	}

	/* ---------- 2.2 Buscadores: Hoteles · Traslados · Tours ----------
	   Reglas comunes en ".search-tab-content form"; las de acomodo
	   específico van con el id de cada formulario. */

	/* style.css redefine .hidden como display:block + width:0, y lo oculto
	   seguía ocupando alto (habitaciones 2-4, edades de niños) → hueco grande
	   antes de "Buscar". En móvil, oculto = no existe. */
	.xpc-interna .search-tab-content form .hidden{ display: none !important; }

	/* Campos de 44px y texto de 16px (iOS hace zoom si es menor) */
	.xpc-interna .search-tab-content form input.input-text,
	.xpc-interna .search-tab-content form select,
	.xpc-interna .search-tab-content form span.custom-select{
		height: 44px;
		font-size: 16px;
	}
	.xpc-interna .search-tab-content form span.custom-select{
		line-height: 44px;
		font-size: 15px;
		padding-right: 34px;
		text-overflow: ellipsis;
	}
	.xpc-interna .search-tab-content form .selector{ min-width: 0; }
	.xpc-interna .search-tab-content form .selector span.custom-select:before{ width: 30px; }
	.xpc-interna .search-tab-content form .selector span.custom-select:after{ right: 12px; top: 20px; }

	/* Calendario: el botón naranja a la altura del campo */
	.xpc-interna .search-tab-content form .datepicker-wrap:after{
		height: 44px;
		line-height: 44px;
	}
	.xpc-interna .search-tab-content form .datepicker-wrap input.input-text{
		padding-left: 10px;
		padding-right: 32px;
		font-size: 16px;                       /* con 15px iOS hacía zoom al tocar la fecha */
	}

	/* Títulos y etiquetas */
	.xpc-interna .search-tab-content form h4.title{
		font-size: 17px;
		margin-bottom: 8px;
	}
	.xpc-interna .search-tab-content form label{
		font-size: 11px;
		letter-spacing: .5px;
		margin-bottom: 4px;
	}
	.xpc-interna .search-tab-content form .form-group{ margin-bottom: 14px; }

	/* Fechas: Entrada | Salida al 50% (la fecha completa cabe) y Noches abajo
	   (antes Noches se salía de la tarjeta) */
	.xpc-interna #busqueda_hotel .col-xs-5{ width: 50%; padding-right: 6px; }
	.xpc-interna #busqueda_hotel .col-xs-5 + .col-xs-5{ padding-left: 6px; padding-right: 10px; }
	.xpc-interna #busqueda_hotel .col-xs-5 + .col-xs-5 + .col-xs-2{
		width: 33.333%;
		margin-top: 12px;
		padding-left: 10px;
		padding-right: 6px;
		clear: left;
	}

	/* Contenedor de habitaciones: en escritorio es una caja de 195px con
	   scroll (inline style); en móvil crece con su contenido */
	.xpc-interna #busqueda_hotel .rooms{
		height: auto !important;
		overflow: visible !important;
	}

	/* Nacionalidad a todo lo ancho */
	.xpc-interna #busqueda_hotel .col-xs-10{ width: 100%; }

	/* Habitaciones / Adultos / Niños: 3 columnas con separación pareja */
	.xpc-interna #busqueda_hotel .paxes{ padding-left: 4px; padding-right: 4px; }
	.xpc-interna #busqueda_hotel .paxes > [class*="col-xs-4"]{ padding-left: 6px; padding-right: 6px; }

	/* Edades de niños: 4 por fila */
	.xpc-interna #busqueda_hotel .ages > .col-xs-2{ width: 25%; }

	/* Posición del buscador: en escritorio se encima al banner con márgenes
	   negativos (-150px / -80px). En móvil eso dejaba las pestañas
	   Hoteles · Traslados · Tours escondidas DETRÁS del header (no se podían
	   usar). Ahora el buscador empieza 16px debajo del header. */
	.xpc-interna .movil-fullwidthbanner:not(:has(*)){ display: none; }   /* banner vacío de 50px */
	.xpc-interna #content{ padding-top: 16px !important; }
	.xpc-interna #content .search-box-wrapper{ margin-top: 0 !important; }
	.xpc-interna #content .search-box{ margin-top: 0 !important; }

	/* Pestañas Hoteles · Traslados · Tours: icono + texto, activa en naranja */
	.xpc-interna .search-box ul.search-tabs{
		display: flex;
		margin: 0;
		padding: 0;
		background: #ffffff;
		border-radius: 12px 12px 0 0;
		overflow: hidden;
		box-shadow: 0 1px 0 #ececec;
	}
	.xpc-interna .search-box ul.search-tabs::before,
	.xpc-interna .search-box ul.search-tabs::after{ display: none; }
	.xpc-interna .search-box ul.search-tabs li{
		flex: 1 1 0;
		float: none;
		margin: 0;
		padding: 0;
		border: 0;
	}
	.xpc-interna .search-box ul.search-tabs li a{
		display: flex !important;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 3px;
		height: 54px;
		padding: 0 !important;
		background: #ffffff !important;
		color: #7a7a7b !important;
		font-size: 20px !important;
		line-height: 1 !important;
		border-bottom: 3px solid transparent;
	}
	.xpc-interna .search-box ul.search-tabs li a .tab-txt{
		display: block !important;                /* responsive.css lo oculta ≤480px */
		font-size: 12px;
		font-weight: 600;
	}
	.xpc-interna .search-box ul.search-tabs li.active a{
		color: var(--xpc-primario) !important;
		border-bottom-color: var(--xpc-primario);
	}
	.xpc-interna .search-box .search-tab-content{ border-radius: 0 0 12px 12px; }

	/* Botón Buscar */
	.xpc-interna .search-tab-content form button.icon-check{
		height: 50px;
		line-height: 50px;
		font-size: 16px;
		font-weight: 700;
		letter-spacing: .5px;
		border-radius: 10px;
		overflow: hidden;
		background-image: var(--xpc-degradado);
		box-shadow: 0 6px 16px color-mix(in srgb, var(--xpc-primario) 35%, transparent);
		color: var(--xpc-sobre-primario);
	}
	.xpc-interna .search-tab-content form button.icon-check:after{ height: 50px; line-height: 50px; width: 44px; }

	/* --- Traslados (form#busqueda_transfer) --- */
	/* Columnas anidadas (.col-md-6 dentro de .col-md-4) metían 10px de más */
	.xpc-interna #busqueda_transfer .col-md-4 > .col-md-6{ padding-left: 0; padding-right: 0; }
	/* Título vacío de relleno (" ") antes de las horas: dejaba un hueco */
	.xpc-interna #busqueda_transfer .col-md-6 + .col-md-6 > h4.title{ display: none; }
	/* Aire entre campos (las etiquetas quedaban pegadas al campo de arriba) */
	.xpc-interna #busqueda_transfer .row > [class*="col-"],
	.xpc-interna #busqueda_tour .row > [class*="col-"]{ margin-bottom: 12px; }
	.xpc-interna #busqueda_transfer .form-group,
	.xpc-interna #busqueda_tour .form-group{ margin-bottom: 0; }

	/* --- "Quién" de Traslados y Tours: el botón Buscar siempre al final ---
	   En escritorio el botón va junto a Adultos; en móvil quedaba ENTRE
	   Adultos y Niños (y las edades de los niños aparecían después del botón). */
	.xpc-interna #busqueda_transfer .col-md-4:has(> h4.title):has(#submitTransfers),
	.xpc-interna #busqueda_tour .col-md-4:has(> h4.title):has(#submitTours){
		display: flex;
		flex-wrap: wrap;
		padding-left: 0;
		padding-right: 0;
	}
	.xpc-interna #busqueda_transfer .col-md-4:has(> h4.title):has(#submitTransfers) > .row,
	.xpc-interna #busqueda_tour .col-md-4:has(> h4.title):has(#submitTours) > .row{ display: contents; }
	.xpc-interna #busqueda_transfer .col-md-4:has(> h4.title):has(#submitTransfers) > h4.title,
	.xpc-interna #busqueda_tour .col-md-4:has(> h4.title):has(#submitTours) > h4.title{ width: 100%; padding: 0 10px; }
	.xpc-interna #busqueda_transfer .col-md-4:has(> h4.title):has(#submitTransfers) [class*="col-"],
	.xpc-interna #busqueda_tour .col-md-4:has(> h4.title):has(#submitTours) [class*="col-"]{ float: none; }
	.xpc-interna #busqueda_transfer [class*="col-"]:has(> #submitTransfers),
	.xpc-interna #busqueda_tour [class*="col-"]:has(> #submitTours){
		order: 99;
		width: 100%;
		margin-top: 8px;
	}
	/* La etiqueta vacía que va arriba del botón (alineación de escritorio) */
	.xpc-interna #busqueda_transfer [class*="col-"]:has(> #submitTransfers) > label,
	.xpc-interna #busqueda_tour [class*="col-"]:has(> #submitTours) > label{ display: none; }

	/* Menos espacio gris entre el buscador y las ofertas (antes 80px) */
	.xpc-interna .search-box-wrapper + .section{ padding-top: 24px; }

	/* ---------- 2.3 Barra inferior estilo app (tab bar) ----------
	   Se arma con el .topnav de escritorio (oculto por el tema en móvil):
	   Inicio · Vencimientos · Reportes · Más
	   "Más" y su hoja (Contacto, Cerrar HotDeals, Cerrar sesión) los crea xpc_movil.js */

	/* Fuera: menú hamburguesa y su lista roja */
	.xpc-interna #header .mobile-menu-toggle,
	.xpc-interna #mobile-menu-01{ display: none !important; }

	/* Espacio para que la barra no tape el final de la página */
	.xpc-interna body{ padding-bottom: calc(62px + env(safe-area-inset-bottom)); }

	/* Un backdrop-filter en el header (skins "glass") vuelve a #header el
	   contenedor de lo fijo y la barra se iba arriba: se quita en móvil */
	.xpc-interna #header,
	.xpc-interna #header .topnav{
		-webkit-backdrop-filter: none !important;
		backdrop-filter: none !important;
	}

	.xpc-interna #header .topnav{
		display: block !important;
		position: fixed;
		top: auto !important;
		left: 0; right: 0; bottom: 0;
		z-index: 9000;
		height: auto;
		padding: 0 0 env(safe-area-inset-bottom);
		background: #ffffff;
		border-top: 1px solid #e6e6e6;
		box-shadow: 0 -4px 16px rgba(0,0,0,.08);
	}

	/* Se aplanan contenedores: todos los <li> quedan en una sola fila */
	/* Rejilla fija de 4 columnas: cada pestaña tiene su lugar asignado y
	   cualquier otro elemento (clearfix, ligas ocultas) cae en una 2a fila
	   que no se ve. Así no hay "huecos" sin importar el navegador. */
	.xpc-interna #header .topnav .container{
		border-radius: 0 !important;          /* skins que redondean la barra de escritorio */
		background: transparent !important;
		display: grid !important;
		grid-template-columns: repeat(4, 1fr);
		grid-template-rows: 60px;
		grid-auto-rows: 0;
		height: 60px;
		overflow: hidden;
		width: auto;
		padding: 0;
	}
	.xpc-interna #header .topnav #main-menu,
	.xpc-interna #header .topnav #main-menu ul.menu,
	.xpc-interna #header .topnav ul.quick-menu{
		display: contents;
		float: none !important;
	}

	/* Los clearfix de Bootstrap (::before/::after) se volverían "pestañas"
	   invisibles dentro del flex y empujan la barra (se nota en Firefox) */
	.xpc-interna #header .topnav .container::before,
	.xpc-interna #header .topnav .container::after,
	.xpc-interna #header .topnav nav::before,
	.xpc-interna #header .topnav nav::after,
	.xpc-interna #header .topnav ul::before,
	.xpc-interna #header .topnav ul::after{
		display: none !important;
		content: none !important;
	}

	.xpc-interna #header .topnav li{
		flex: 1 1 0;
		float: none;
		list-style: none;
		margin: 0 !important;                 /* el tema da margin-left: 20px a .quick-menu li */
		padding: 0 !important;
		border: 0;
		background: none;
		position: relative;
	}
	.xpc-interna #header .topnav li::before,
	.xpc-interna #header .topnav li::after{ display: none; }

	/* Orden: Inicio · Vencimientos · Reportes · Más */
	.xpc-interna #header .topnav #main-menu li:first-child{ grid-area: 1 / 1; }
	.xpc-interna #header .topnav li:has([title*="Vencimientos"]){ grid-area: 1 / 2; }
	.xpc-interna #header .topnav li:has(a[href*="reportes"]){ grid-area: 1 / 3; }
	.xpc-interna #header .topnav li.xpc-mas{ grid-area: 1 / 4; display: block; }

	/* Sin campana de Vencimientos (ej. Expert in Destination): 3 pestañas */
	.xpc-interna #header .topnav .container:not(:has([title*="Vencimientos"])){ grid-template-columns: repeat(3, 1fr); }
	.xpc-interna #header .topnav .container:not(:has([title*="Vencimientos"])) li:has(a[href*="reportes"]){ grid-area: 1 / 2; }
	.xpc-interna #header .topnav .container:not(:has([title*="Vencimientos"])) li.xpc-mas{ grid-area: 1 / 3; }

	/* Pasan a la hoja "Más" (el idioma también: ahí va como botones) */
	.xpc-interna #header .topnav li.language,
	.xpc-interna #header .topnav #main-menu li:nth-child(2),
	.xpc-interna #header .topnav li:has(a[href*="hotdeals_logout"]),
	.xpc-interna #header .topnav li:has(a[href="/logout"]){ display: none; }

	/* Botón de cada pestaña: icono arriba, texto abajo */
	.xpc-interna #header .topnav li > a{
		display: flex !important;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 4px;
		height: 60px !important;             /* el tema fuerza 50px */
		padding: 0 !important;
		margin: 0;
		background: none !important;
		border: 0 !important;
		color: #7a7a7b !important;
		font-size: 0 !important;             /* el texto original se reemplaza */
		line-height: 1 !important;           /* el tema fuerza line-height: 50px */
		text-transform: none !important;
		text-decoration: none !important;
		-webkit-tap-highlight-color: transparent;
	}
	.xpc-interna #header .topnav li > a::before{
		font-family: "Font Awesome 5 Free";
		font-weight: 900;
		font-size: 20px;
		line-height: 1;
		color: #7a7a7b;
	}
	.xpc-interna #header .topnav li > a::after{
		line-height: 1.2;
		text-transform: none;
		font-size: 11px;
		font-weight: 600;
		letter-spacing: .2px;
		color: #7a7a7b;
	}

	.xpc-interna #header .topnav #main-menu li:first-child > a::before{ content: '\f002'; }   /* buscar */
	.xpc-interna #header .topnav #main-menu li:first-child > a::after{ content: var(--xpc-t-buscar, 'Buscar'); }

	.xpc-interna #header .topnav li:has([title*="Vencimientos"]) > a::before{ content: '\f0f3'; } /* campana */
	.xpc-interna #header .topnav li:has([title*="Vencimientos"]) > a::after{ content: var(--xpc-t-vencimientos, 'Vencimientos'); }

	.xpc-interna #header .topnav li:has(a[href*="reportes"]) > a::before{ content: '\f080'; }   /* gráfica */
	.xpc-interna #header .topnav li:has(a[href*="reportes"]) > a::after{ content: var(--xpc-t-reportes, 'Reportes'); }

	.xpc-interna #header .topnav li.xpc-mas > a::before{ content: '\f141'; }                    /* ··· */
	.xpc-interna #header .topnav li.xpc-mas > a::after{ content: var(--xpc-t-mas, 'Más'); }

	/* Pestaña activa (Más abierta) en naranja */
	.xpc-interna.xpc-mas-abierto #header .topnav li.xpc-mas > a::before,
	.xpc-interna.xpc-mas-abierto #header .topnav li.xpc-mas > a::after{ color: var(--xpc-primario); }

	/* Campana: se oculta el icono viejo, el contador va como globo rojo */
	.xpc-interna #header .topnav li:has([title*="Vencimientos"]) .fa{ display: none; }
	.xpc-interna #header .topnav li:has([title*="Vencimientos"]) .badge{
		position: absolute;
		top: 7px;
		left: 50%;
		margin: 0 0 0 4px !important;
		min-width: 18px;
		height: 18px;
		padding: 0 5px;
		border-radius: 9px;
		background: #e53935;
		color: #ffffff;
		font-size: 11px;
		line-height: 18px;
	}
	.xpc-interna #header .topnav li.xpc-sin-vencimientos .badge{ display: none; }

	/* Hoja "Más" */
	.xpc-interna .xpc-hoja-mas{
		display: block;
		position: fixed;
		left: 8px; right: 8px;
		bottom: calc(70px + env(safe-area-inset-bottom));
		z-index: 8999;
		background: #ffffff;
		border-radius: 14px;
		box-shadow: 0 10px 40px rgba(0,0,0,.25);
		overflow: hidden;
		transform: translateY(16px);
		opacity: 0;
		pointer-events: none;
		transition: transform .25s ease, opacity .25s ease;
	}
	.xpc-interna.xpc-mas-abierto .xpc-hoja-mas{
		transform: translateY(0);
		opacity: 1;
		pointer-events: auto;
	}
	.xpc-interna .xpc-hoja-mas a{
		display: flex;
		align-items: center;
		gap: 14px;
		height: 54px;
		padding: 0 20px;
		color: var(--xpc-texto);
		font-size: 16px;
		text-decoration: none;
		border-bottom: 1px solid #f0f0f0;
	}
	.xpc-interna .xpc-hoja-mas a:last-child{ border-bottom: 0; }
	.xpc-interna .xpc-hoja-mas a::before{
		font-family: "Font Awesome 5 Free";
		font-weight: 900;
		width: 20px;
		text-align: center;
		color: var(--xpc-primario);
	}
	.xpc-interna #header .topnav li.xpc-en-mas{ display: none; }          /* ligas del cliente: van en "Más" */
	.xpc-interna .xpc-hoja-mas .xpc-hoja-extra::before{ content: '\f0c1'; }            /* liga */
	.xpc-interna .xpc-hoja-mas .xpc-hoja-extra.xpc-externa::before{ content: '\f35d'; } /* abre fuera */
	.xpc-interna .xpc-hoja-mas .xpc-hoja-contacto::before{ content: '\f095'; }
	.xpc-interna .xpc-hoja-mas .xpc-hoja-hotdeals::before{ content: '\f06d'; }
	.xpc-interna .xpc-hoja-mas .xpc-hoja-salir{ color: var(--xpc-peligro); }
	.xpc-interna .xpc-hoja-mas .xpc-hoja-salir::before{ content: '\f2f5'; color: var(--xpc-peligro); }

	/* Idioma dentro de "Más": renglón "Idioma" y abajo los 3 idiomas como
	   botones del mismo tamaño (el actual en color primario) */
	.xpc-interna .xpc-hoja-idiomas{
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		gap: 10px 14px;
		padding: 14px 20px 16px;
		border-bottom: 1px solid #f0f0f0;
	}
	.xpc-interna .xpc-hoja-idiomas > span{
		display: flex;
		align-items: center;
		gap: 14px;
		color: var(--xpc-texto);
		font-size: 16px;
	}
	.xpc-interna .xpc-hoja-idiomas > span::before{
		content: '\f0ac';                       /* globo */
		width: 20px;
		font-family: "Font Awesome 5 Free";
		font-weight: 900;
		font-size: 16px;
		text-align: center;
		color: var(--xpc-primario);
	}
	.xpc-interna .xpc-hoja-idiomas > div{
		display: grid;
		grid-auto-flow: column;
		grid-auto-columns: 1fr;
		gap: 8px;
		flex: 1 1 100%;
		padding-left: 34px;                      /* alineado con el texto, no con el globo */
	}
	.xpc-interna .xpc-hoja-idiomas b,
	.xpc-interna .xpc-hoja-idiomas button{
		display: flex;
		align-items: center;
		justify-content: center;
		height: 36px;
		margin: 0;
		padding: 0 8px;
		border: 0 !important;                    /* algunas skins fuerzan bordes en <button> */
		border-radius: 18px;
		font-family: inherit;
		font-size: 13px;
		font-weight: 600;
		line-height: 1;
		text-transform: none;
		white-space: nowrap;
	}
	.xpc-interna .xpc-hoja-idiomas b{
		background: var(--xpc-primario);
		color: var(--xpc-sobre-primario);
	}
	.xpc-interna .xpc-hoja-idiomas button{
		background: #f5f5f5 !important;
		box-shadow: inset 0 0 0 1px #e3e3e3;
		color: var(--xpc-texto) !important;
	}

	/* WhatsApp flotante (algunas skins): tapaba contenido. En móvil se
	   oculta y xpc_movil.js lo pasa a la barra (pestaña) o a la hoja "Más" */
	.xpc-interna a.whatsapp-link{ display: none !important; }

	/* Con pestaña de WhatsApp vuelven a ser 4: Buscar · WhatsApp · Reportes · Más */
	.xpc-interna #header .topnav .container:has(li.xpc-wa-tab){ grid-template-columns: repeat(4, 1fr); }
	.xpc-interna #header .topnav li.xpc-wa-tab{ grid-area: 1 / 2; display: block; }
	.xpc-interna #header .topnav .container:has(li.xpc-wa-tab) li:has(a[href*="reportes"]){ grid-area: 1 / 3; }
	.xpc-interna #header .topnav .container:has(li.xpc-wa-tab) li.xpc-mas{ grid-area: 1 / 4; }
	.xpc-interna #header .topnav li.xpc-wa-tab > a::before{
		content: '\f232';
		font-family: "Font Awesome 5 Brands";
		font-weight: 400;
		font-size: 22px;
		color: #25d366;
	}
	.xpc-interna #header .topnav li.xpc-wa-tab > a::after{ content: 'WhatsApp'; }

	/* En la hoja "Más" (clientes con campana) */
	.xpc-interna .xpc-hoja-mas .xpc-hoja-wa::before{
		content: '\f232';
		font-family: "Font Awesome 5 Brands";
		font-weight: 400;
		font-size: 20px;
		color: #25d366;
	}

	/* Avisos legales en "Más" (grupo plegable). En el footer se ocultan
	   solo los renglones con ligas; el © se queda. */
	.xpc-interna #footer .bottom .copyright:has(a){ display: none; }
	.xpc-interna .xpc-hoja-legal{ border-bottom: 1px solid #f0f0f0; }
	.xpc-interna .xpc-hoja-legal summary{
		display: flex;
		align-items: center;
		gap: 14px;
		height: 54px;
		padding: 0 20px;
		list-style: none;
		color: var(--xpc-texto);
		font-size: 16px;
		cursor: pointer;
	}
	.xpc-interna .xpc-hoja-legal summary::-webkit-details-marker{ display: none; }
	.xpc-interna .xpc-hoja-legal summary::before{
		content: '\f15c';                       /* documento */
		width: 20px;
		font-family: "Font Awesome 5 Free";
		font-weight: 900;
		text-align: center;
		color: var(--xpc-primario);
	}
	.xpc-interna .xpc-hoja-legal summary::after{
		content: '\f078';                       /* flecha */
		margin-left: auto;
		font-family: "Font Awesome 5 Free";
		font-weight: 900;
		font-size: 12px;
		color: var(--xpc-texto-suave);
		transition: transform .2s;
	}
	.xpc-interna .xpc-hoja-legal[open] summary::after{ transform: rotate(180deg); }
	.xpc-interna .xpc-hoja-legal > div{ padding: 0 20px 10px 54px; }
	.xpc-interna .xpc-hoja-mas .xpc-hoja-legal a{
		height: 40px;
		padding: 0;
		border: 0;
		font-size: 14px;
		color: var(--xpc-texto-suave);
	}
	.xpc-interna .xpc-hoja-mas .xpc-hoja-legal a::before{ content: none; }

	/* Secciones vacías del home (ej. "Destinos destacados" comentado): solo dejaban 130px en blanco */
	.xpc-interna .container.msec:not(:has(img, a, h1, h2, h3, h4, p, li)){ display: none; }

	/* Paquetes / circuitos del home (.grid_paquetes): en escritorio es una
	   rejilla; en móvil eran 80+ tarjetas en columna (página de 30,000px).
	   Pasan a carrusel horizontal con snap. */
	.xpc-interna .update_alico{ padding: 24px 0 16px !important; }
	.xpc-interna #paquetes{ margin: 0 -15px; }
	.xpc-interna .grid_paquetes{
		display: flex !important;
		gap: 12px;
		overflow-x: auto;
		overscroll-behavior-x: contain;
		scroll-snap-type: x mandatory;
		scroll-padding: 0 16px;
		padding: 4px 16px 16px;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
	}
	.xpc-interna .grid_paquetes::-webkit-scrollbar{ display: none; }
	.xpc-interna .grid_paquetes::before,
	.xpc-interna .grid_paquetes::after{ display: none; content: none; }
	.xpc-interna .grid_paquetes > .item_paquetes{
		flex: 0 0 82%;
		width: auto !important;
		margin: 0 !important;
		padding: 0 !important;
		scroll-snap-align: start;
	}
	.xpc-interna .grid_paquetes > .item_paquetes article.box{
		height: 100%;
		margin: 0 !important;
		box-sizing: border-box;
		border-radius: 12px;
		overflow: hidden;
	}

	/* ---------- 2.4 Vencimientos de Tiempo Límite (lightbox) ----------
	   La campana abre una hoja inferior con las reservaciones (xpc_movil.js) */
	.xpc-interna .xpc-tl{ display: block; }

	.xpc-interna .xpc-tl-fondo{
		position: fixed;
		top: 0; right: 0; bottom: 0; left: 0;
		z-index: 100000;                     /* encima de la barra de admin (99999) */
		background: rgba(0,0,0,.5);
		opacity: 0;
		pointer-events: none;
		transition: opacity .25s;
	}

	.xpc-interna .xpc-tl-hoja{
		position: fixed;
		left: 0; right: 0; bottom: 0;
		z-index: 100001;
		max-height: 85vh;
		display: flex;
		flex-direction: column;
		background: #f5f5f5;
		border-radius: 16px 16px 0 0;
		border-top: 4px solid var(--xpc-primario);
		box-shadow: 0 -10px 40px rgba(0,0,0,.3);
		transform: translateY(100%);
		transition: transform .3s cubic-bezier(.2,.8,.2,1);
		padding-bottom: env(safe-area-inset-bottom);
	}

	.xpc-interna.xpc-tl-abierto{ overflow: hidden; }
	.xpc-interna.xpc-tl-abierto .xpc-tl-fondo{ opacity: 1; pointer-events: auto; }
	.xpc-interna.xpc-tl-abierto .xpc-tl-hoja{ transform: translateY(0); }

	.xpc-interna .xpc-tl-cabeza{
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 14px 8px 10px 20px;
		background: #ffffff;
		border-radius: 12px 12px 0 0;
		font-size: 16px;
		font-weight: 700;
		color: var(--xpc-texto);
	}
	.xpc-interna .xpc-tl-cabeza span::before{
		content: '\f0f3';
		font-family: "Font Awesome 5 Free";
		font-weight: 900;
		color: var(--xpc-primario);
		margin-right: 10px;
	}
	.xpc-interna .xpc-tl-cerrar{
		width: 44px;
		height: 44px;
		border: 0;
		background: none;
		font-size: 30px;
		line-height: 1;
		color: #7a7a7b;
	}

	.xpc-interna .xpc-tl-cuerpo{
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
		overscroll-behavior: contain;
		padding: 4px 16px 20px;
	}

	.xpc-interna .xpc-tl-grupo{
		margin: 16px 0 8px;
		font-size: 13px;
		font-weight: 700;
		letter-spacing: .5px;
		text-transform: uppercase;
		color: #d12e67;                      /* mismo tono de la plantilla de vencimientos */
	}

	.xpc-interna .xpc-tl-card{
		background: #ffffff;
		border-radius: 12px;
		border-left: 4px solid var(--xpc-primario);
		padding: 12px 14px;
		margin-bottom: 10px;
		box-shadow: 0 2px 8px rgba(0,0,0,.06);
		font-size: 13px;
		color: #666666;
	}
	.xpc-interna .xpc-tl-fila{
		display: flex;
		justify-content: space-between;
		align-items: baseline;
		gap: 10px;
	}
	.xpc-interna .xpc-tl-fila b{ font-size: 16px; color: var(--xpc-texto); }
	.xpc-interna .xpc-tl-total{ font-size: 15px; font-weight: 700; color: var(--xpc-texto); white-space: nowrap; }
	.xpc-interna .xpc-tl-hotel{ margin: 6px 0 4px; font-size: 14px; color: #444444; }
	.xpc-interna .xpc-tl-meta{
		display: flex;
		justify-content: space-between;
		gap: 10px;
		font-size: 12px;
		color: var(--xpc-texto-suave);
	}

	.xpc-interna .xpc-tl-cargando,
	.xpc-interna .xpc-tl-vacio{
		padding: 40px 0;
		text-align: center;
		font-size: 15px;
		color: var(--xpc-texto-suave);
	}

	.xpc-interna .xpc-tl-completa{
		display: block;
		margin-top: 8px;
		padding: 12px;
		text-align: center;
		font-size: 14px;
		color: var(--xpc-acento);
	}

	/* ---------- 2.7 Autocompletar (destino, hotel, aeropuerto) ----------
	   Menú de jQuery UI: texto de 15px y renglones de 44px para el dedo.
	   La opción resaltada usa el naranja claro de la marca (no el azul de jQuery UI). */
	.xpc-interna .ui-autocomplete{
		max-height: 50vh;
		overflow-y: auto;
		overflow-x: hidden;
		padding: 4px 0;
		background: #ffffff;
		border: 1px solid #e3e3e3;
		border-top: 0;
		border-radius: 0 0 12px 12px;
		box-shadow: 0 10px 24px rgba(0,0,0,.15);
	}
	.xpc-interna .ui-autocomplete .ui-menu-item a,
	.xpc-interna .ui-autocomplete .ui-menu-item-wrapper{
		display: flex;
		align-items: center;
		min-height: 44px;
		margin: 0 !important;
		padding: 10px 16px;
		font-family: Lato, Arial, Helvetica, sans-serif;   /* misma letra que el sitio */
		font-size: 15px;
		line-height: 1.3;
		color: var(--xpc-texto);
		border: 0;
		border-bottom: 1px solid #f0f0f0;
		border-radius: 0;
		background: none;
		font-weight: normal;
	}
	.xpc-interna .ui-autocomplete .ui-menu-item:last-child a,
	.xpc-interna .ui-autocomplete .ui-menu-item:last-child .ui-menu-item-wrapper{ border-bottom: 0; }
	.xpc-interna .ui-autocomplete .ui-state-focus,
	.xpc-interna .ui-autocomplete .ui-state-active{
		background: var(--xpc-primario-suave) !important;
		color: var(--xpc-texto) !important;
		border-color: #f0f0f0 !important;
	}

	/* ---------- 2.6 Header: logo centrado + separación ----------
	   Sin menú hamburguesa, el logo va al centro (patrón de apps con barra
	   inferior). Línea naranja fina y sombra suave marcan el fin del header. */
	.xpc-interna #header .main-header{
		height: calc(var(--xpc-logo-alto, 38px) + 18px);
		position: relative;
		z-index: 2;
		border-bottom: 2px solid var(--xpc-primario);
		box-shadow: 0 4px 12px rgba(0,0,0,.06);
	}
	/* Alto del logo configurable (variable "logo-alto" del JSON, ej. 46px
	   para logos cuadrados); el header crece con él */
	.xpc-interna #header .main-header .container{
		height: calc(var(--xpc-logo-alto, 38px) + 16px);
		padding: 0;
	}
	.xpc-interna #header .logo,
	.xpc-interna #header .logo a,
	.xpc-interna #header .logo img{ height: calc(var(--xpc-logo-alto, 38px) + 16px) !important; }
	.xpc-interna #header .logo,
	.xpc-interna #header .logo a{ margin: 0 !important; }   /* algunas skins empujan el logo con margin inline */
	.xpc-interna #header .logo a{
		display: block;
		padding: 0 !important;
		background-position: center center !important;
		background-size: auto var(--xpc-logo-alto, 38px) !important;
		background-repeat: no-repeat !important;
	}

	/* ---------- 2.5 Footer: oficinas en carrusel ----------
	   Cada sucursal es una tarjeta; se desliza con el dedo y se "imanta"
	   (scroll-snap). Se asoma la siguiente tarjeta para invitar a deslizar.
	   xpc_movil.js agrega los puntitos y vuelve los teléfonos tocables. */
	.xpc-interna #footer .footer-wrapper{
		position: relative;
		padding: 24px 0 18px;
		background: #f5f5f5;
	}
	.xpc-interna #footer .footer-wrapper::before{
		content: var(--xpc-t-oficinas, 'Nuestras oficinas');
		display: block;
		padding: 0 20px 14px;
		font-size: 18px;
		font-weight: 700;
		color: var(--xpc-texto);
	}

	/* El contenedor se vuelve la pista del carrusel */
	.xpc-interna #footer .footer-wrapper > .container{
		display: flex;
		gap: 12px;
		width: auto;
		padding: 4px 20px 14px;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		scroll-padding: 0 20px;
		scrollbar-width: none;
	}
	.xpc-interna #footer .footer-wrapper > .container::-webkit-scrollbar{ display: none; }

	/* Las 2 filas de Bootstrap se aplanan: todas las oficinas en una sola pista */
	.xpc-interna #footer .footer-wrapper .row{ display: contents; }
	.xpc-interna #footer .footer-wrapper > .container::before,
	.xpc-interna #footer .footer-wrapper > .container::after,
	.xpc-interna #footer .footer-wrapper .row::before,
	.xpc-interna #footer .footer-wrapper .row::after{ display: none !important; content: none !important; }

	.xpc-interna #footer .footer-wrapper [class*="col-"]{
		display: flex;
		flex: 0 0 82%;
		max-width: 320px;
		width: auto;
		float: none;
		padding: 0;
		scroll-snap-align: start;
	}

	/* Skins con una sola fila (oficina + redes juntas): la columna de redes
	   sube a la derecha del título, igual que cuando viene en fila aparte */
	.xpc-interna #footer .footer-wrapper .row:has(.contact-details) > [class*="col-"]:has(.social-icons li){
		position: absolute;
		top: 18px;
		right: 20px;
		display: block;
		flex: none;
		width: auto;
		max-width: none;
		margin: 0;
		padding: 0;
	}
	.xpc-interna #footer .footer-wrapper .row:has(.contact-details) .social-icons{ display: flex; gap: 8px; }
	/* Renglón de dirección con sangría inline (alineaba con el ícono del teléfono) */
	.xpc-interna #footer .contact-details span[style*="margin-left"]{ display: block !important; margin-left: 0 !important; }

	/* Columnas vacías (skins con menos oficinas o sin redes) no ocupan lugar */
	.xpc-interna #footer .footer-wrapper [class*="col-"]:not(:has(.contact-details, .social-icons li)){ display: none; }

	/* Tarjeta de oficina */
	.xpc-interna #footer .contact-details{
		flex: 1;
		margin: 0;
		padding: 16px;
		background: #ffffff;
		border-radius: 14px;
		border-top: 4px solid var(--xpc-primario);
		box-shadow: 0 4px 14px rgba(0,0,0,.08);
		font-size: 13px;
		line-height: 1.5;
		color: #838383;
	}
	.xpc-interna #footer .contact-details strong{
		display: block;
		margin-bottom: 12px;
		font-size: 13px;
		line-height: 1.35;
		letter-spacing: .3px;
		color: var(--xpc-texto);
	}
	.xpc-interna #footer .contact-details strong + br,
	.xpc-interna #footer .contact-details .contact-phone + br{ display: none; }

	/* Teléfono y WhatsApp como botones (xpc_movil.js los vuelve tel: y wa.me) */
	.xpc-interna #footer .contact-details .contact-phone{
		display: flex;
		align-items: center;
		gap: 10px;
		height: 44px;
		margin: 0 0 8px;
		padding: 0 14px;
		border-radius: 10px;
		background: var(--xpc-primario-suave);
		color: #da251d;
		font-size: 17px;
		font-weight: 600;
		text-decoration: none;
	}
	.xpc-interna #footer .contact-details .contact-phone i{ font-size: 18px; color: var(--xpc-primario); }
	.xpc-interna #footer .contact-details .contact-phone img{ width: 22px; height: 22px; }
	.xpc-interna #footer .contact-details .contact-phone.xpc-wa{ background: #e8f8ee; color: #128c4b; }

	.xpc-interna #footer .contact-details .contact-email{
		display: block;
		margin-top: 10px;
		padding: 0;
		font-size: 13px;
		font-weight: 600;
		text-transform: lowercase;
		word-break: break-all;
		color: var(--xpc-primario);
	}

	/* Facebook: arriba a la derecha, junto al título */
	.xpc-interna #footer .footer-wrapper .row:has(.social-icons):not(:has(.contact-details)){
		display: block;
		position: absolute;
		top: 18px;                            /* centrado con "Nuestras oficinas" */
		right: 20px;
		margin: 0;                            /* Bootstrap da -15px a .row */
	}
	.xpc-interna #footer .footer-wrapper .row:has(.social-icons):not(:has(.contact-details)) [class*="col-"]{
		display: block;
		max-width: none;
		margin: 0;                            /* el tema le da margin-top: 20px */
	}
	.xpc-interna #footer .social-icons{ margin: 0; padding: 0; }
	.xpc-interna #footer .social-icons li{
		margin: 0;
		overflow: visible;                    /* el tema recorta el <li> */
		background: none;
	}
	.xpc-interna #footer .social-icons li a{
		display: flex;
		align-items: center;
		justify-content: center;
		width: 34px;
		height: 34px;
		line-height: 1;
		border-radius: 50%;
		background: #ffffff;
		border: 1px solid #e3e3e3;
		box-shadow: 0 2px 6px rgba(0,0,0,.06);
		color: #1877f2;                       /* azul de Facebook: se lee como botón activo */
		font-size: 16px;
	}
	.xpc-interna #footer .social-icons li a i{ color: #1877f2; }

	/* Puntitos del carrusel (los crea xpc_movil.js) */
	.xpc-interna #footer .xpc-puntos{
		display: flex;
		justify-content: center;
		gap: 6px;
	}
	.xpc-interna #footer .xpc-puntos span{
		width: 7px;
		height: 7px;
		border-radius: 4px;
		background: #d0d0d0;
		transition: width .2s, background .2s;
	}
	.xpc-interna #footer .xpc-puntos span.activo{
		width: 18px;
		background: var(--xpc-primario);
	}

	/* Franja naranja: logo, legales y © centrados; sin flecha "arriba" */
	.xpc-interna #footer .bottom{ height: auto; }
	.xpc-interna #footer .bottom .container{
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 6px;
		padding: 18px 16px;
		text-align: center;
	}
	.xpc-interna #footer .bottom .container::before,
	.xpc-interna #footer .bottom .container::after{ display: none; }
	.xpc-interna #footer .bottom .pull-left,
	.xpc-interna #footer .bottom .pull-right{ float: none !important; margin: 0; }
	.xpc-interna #footer .bottom .pull-right:has(#back-to-top){ display: none; }
	.xpc-interna #footer .bottom .copyright p{ margin: 0; font-size: 12px; }

	/* ---------- 2.8 Loader de búsqueda (nubes / fotos) ----------
	   - El logo medía 547px fijos y se salía de la pantalla.
	   - El loader viejo (.loading-center) quedaba visible DEBAJO y hacía la
		 pantalla del doble de alto (el corte de fondo que se veía al final).
	   - El texto "Buscando / Los mejores hoteles" no cabía en una línea:
		 ahora va en dos renglones, centrado.
	   - Queda encima de la barra inferior para que no se toque durante la búsqueda. */
	.xpc-interna body > div.loading-car{ z-index: 9800; }   /* encima de filtros (9600) y detalle (9700) */
	.xpc-interna .loading-car > .loading-center{ display: none !important; }
	.xpc-interna .cloudsLoader{ position: relative; }
	.xpc-interna .cloudsLoader .logoLoader{
		position: absolute;
		left: 0; right: 0;
		top: 14vh;
	}
	/* Logo proporcional: tope de ancho (logos horizontales) y de alto
	   (logos cuadrados, variable "loader-logo" del JSON). Selector fuerte
	   porque algunas skins fijan max-height con !important y lo aplastaban. */
	html.xpc-interna body .loading-car .cloudsLoader .logoLoader img{
		margin: 0;
		width: auto !important;
		height: auto !important;
		max-width: min(260px, 70vw) !important;
		max-height: var(--xpc-loader-logo, 100px) !important;
	}
	/* Loader con color del cliente (opcional): xpc_movil.js pone
	   .xpc-loader-propio solo si existe --xpc-loader-fondo */
	.xpc-loader-propio .loading-car .cloudsLoader,
	.xpc-loader-propio #details-modal .cloudsLoader{
		background: var(--xpc-loader-fondo) !important;
	}
	.xpc-loader-propio .loading-car .cloudsLoader #Clouds{ opacity: .25; }
	.xpc-loader-propio .cloudsLoader .randomText div{ color: var(--xpc-loader-texto, #ffffff) !important; text-shadow: none !important; }
	.xpc-loader-propio .cloudsLoader .randomText div:last-of-type{ opacity: .75; }

	/* Copia del loader dentro del detalle de hotel (la crea el tema) */
	.xpc-interna #details-modal .cloudsLoader .logoLoader img{
		width: auto !important;
		height: auto !important;
		max-width: min(260px, 70vw) !important;
		max-height: var(--xpc-loader-logo, 100px) !important;
	}
	/* El dato curioso no debe cortarse (algunas skins ponen nowrap) */
	html.xpc-interna body .loading-car .cloudsLoader .randomText div:last-of-type{ white-space: normal !important; }
	.xpc-interna .cloudsLoader .randomText{
		position: absolute;
		transform: none !important;           /* el tema centra con translateX(-50%) y se salía a la izquierda */
		left: 16px; right: 16px;
		top: 66vh;
		margin: 0;
	}
	.xpc-interna .cloudsLoader .randomText div{
		display: block;
		margin: 0 auto;
	}
	.xpc-interna .cloudsLoader .randomText div:first-of-type{
		font-size: 26px;
		color: #555555;
	}
	.xpc-interna .cloudsLoader .randomText div:last-of-type{
		margin-top: 8px;
		font-size: 18px;
		line-height: 1.35;
		color: #888888;
		animation-name: xpcRevelar;            /* la original abría a 355px fijos */
	}

	/* ---------- 2.9 Calendario (jQuery UI datepicker) ----------
	   Sube desde abajo como hoja, días de 42px para el dedo y texto de 15px.
	   (xpc_movil.js evita que se abra el teclado al tocar las fechas) */
	/* Hoja inferior fija: no depende de dónde esté el campo, nunca se sale
	   de la pantalla y no obliga a hacer zoom (jQuery UI lo posiciona con
	   estilos en línea; por eso los !important) */
	.xpc-interna #ui-datepicker-div{
		position: fixed !important;
		top: auto !important;
		bottom: 0 !important;
		left: 0 !important;
		width: 100% !important;
		max-width: none;
		box-sizing: border-box;
		padding: 0 6px calc(12px + env(safe-area-inset-bottom));
		border: 0;
		border-radius: 16px 16px 0 0;
		overflow: hidden;
		box-shadow: 0 -10px 30px rgba(0,0,0,.25);
		font-family: Lato, Arial, Helvetica, sans-serif;
		z-index: 9100 !important;              /* encima de la barra inferior */
	}
	.xpc-interna #ui-datepicker-div table{ table-layout: fixed; width: 100%; }
	.xpc-interna #ui-datepicker-div .ui-datepicker-header{ margin: 0 -6px 4px; padding: 6px 0; border: 0; border-radius: 0; }
	.xpc-interna #ui-datepicker-div .ui-datepicker-title{
		font-size: 17px;
		line-height: 44px;
		font-family: Lato, Arial, Helvetica, sans-serif;
	}
	.xpc-interna #ui-datepicker-div .ui-datepicker-prev,
	.xpc-interna #ui-datepicker-div .ui-datepicker-next{ width: 44px; height: 44px; top: 6px; }
	.xpc-interna #ui-datepicker-div table{ margin: 0; font-size: 15px; }
	.xpc-interna #ui-datepicker-div th{ padding: 10px 0; font-size: 13px; }
	.xpc-interna #ui-datepicker-div td{ padding: 2px; }
	.xpc-interna #ui-datepicker-div td a,
	.xpc-interna #ui-datepicker-div td span{
		height: 42px;
		line-height: 42px;
		padding: 0;
		text-align: center;
		font-size: 15px;
	}
}

@keyframes xpcRevelar{
	0%   { opacity: 0; width: 0; }
	20%  { opacity: 1; width: 0; }
	30%  { width: 100%; }
	80%  { opacity: 1; }
	100% { opacity: 0; width: 100%; }
}


/* =====================================================================
   3. RESULTADOS DE HOTELES — /busquedas/resultados/.../Hoteles
   (mismas páginas internas: <html class="xpc-interna">)
   En móvil se muestra el contenido "de escritorio" que el tema ocultaba
   (precio, Reservar, cotización, habitaciones) y se reacomoda en tarjetas.
   ===================================================================== */
@media (max-width: 767px) {

	/* ---------- 3.1 Barra de admin con más opciones ----------
	   Aquí trae "Hoteles Removidos" y "Brokers": la bienvenida va en un
	   renglón y las opciones en otro (antes se salían de la pantalla). */
	.xpc-interna #admin-topbar:is(:has(#n-bar-blocked-hotels *), :has(#bar-menu-items > :last-child > *)) .bar-container{ flex-wrap: wrap; padding: 4px 0 0; }
	.xpc-interna #admin-topbar:is(:has(#n-bar-blocked-hotels *), :has(#bar-menu-items > :last-child > *)) #bar-welcome{
		display: block !important;
		width: 100%;
		min-width: 0;
		max-width: 100%;
		box-sizing: border-box;
		height: auto !important;              /* el tema da height:100% a los hijos */
		flex: none;
		padding: 2px 12px 0;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}
	.xpc-interna #admin-topbar:is(:has(#n-bar-blocked-hotels *), :has(#bar-menu-items > :last-child > *)) #bar-menu-items{
		width: 100%;
		height: 34px !important;
		justify-content: space-between;
	}
	.xpc-interna #admin-topbar .bar-menu-item:first-child::before{ display: none; }

	/* ---------- 3.2 Encabezado de resultados ---------- */
	.xpc-interna .page-title-container{
		position: static !important;          /* en escritorio es sticky (top: 92px) y se encimaba */
		padding: 12px 0 4px;
		background: none;
	}
	.xpc-interna .page-title-container .entry-title{ display: none; }
	.xpc-interna .page-title-container .search-details{
		float: none !important;
		margin: 0;
		font-size: 13px;
		line-height: 1.4;
		text-transform: none;
		letter-spacing: 0;
		color: #7a7a7b;
	}

	/* ---------- 3.3 Pestañas de cotización (llegan por JS) ----------
	   Antes empujaban la página a 456px de ancho: ahora en fila, se acomodan
	   en varios renglones si no caben. */
	.xpc-interna .tabquotes{
		display: flex !important;
		flex-wrap: wrap;
		gap: 8px;
		justify-content: flex-start;
		position: static !important;
		width: auto !important;
		margin: 0 0 12px;
	}
	.xpc-interna .tabquotes .quotesTabItem{
		position: relative !important;
		left: auto !important;
		right: auto !important;
		top: auto !important;
		float: none !important;
		flex: 0 0 auto;
		margin: 0;
	}

	/* ---------- 3.4 Botón "Filtrar" flotante ----------
	   El embudo azul de la orilla izquierda (.pestfil) se vuelve una
	   píldora naranja al centro, arriba de la barra inferior. */
	.xpc-interna .pestfil{
		top: auto !important;
		left: 50% !important;
		bottom: calc(74px + env(safe-area-inset-bottom));
		transform: translateX(-50%);
		width: auto !important;
		height: 44px !important;
		padding: 0 20px 0 44px;
		border-radius: 22px !important;
		background-color: var(--xpc-secundario) !important;
		background-position: 16px center !important;
		background-size: 18px !important;
		opacity: 1 !important;
		box-shadow: 0 6px 18px rgba(0,0,0,.25);
		z-index: 8500 !important;
		color: #ffffff;
		font: 600 15px/44px Lato, Arial, Helvetica, sans-serif;
		white-space: nowrap;
	}
	.xpc-interna .pestfil::after{ content: var(--xpc-t-filtrar, 'Filtrar y ordenar'); }

	/* Panel de filtros a pantalla completa */
	.xpc-interna .filtrosb,
	.xpc-interna .filtrosc{ display: none !important; }      /* fondo gris y franja de cierre del tema */
	.xpc-interna .filtrosbus{
		position: fixed !important;
		top: 0 !important;
		left: 0 !important;
		right: 0 !important;
		bottom: 0 !important;
		width: 100% !important;
		height: 100vh !important;              /* el tema anima la altura en línea */
		height: 100dvh !important;
		min-height: 100% !important;
		max-height: none !important;
		max-width: none;
		margin: 0;
		padding: calc(var(--admin-tab, 0px) + 68px) 16px calc(96px + env(safe-area-inset-bottom)) !important;
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
		overscroll-behavior: contain;
		background: #f5f5f5 !important;
		z-index: 9600 !important;               /* encima de la barra inferior */
		box-sizing: border-box;
	}
	.xpc-interna .filtrosbus .search-results-title{
		margin: 0 0 12px;
		font-size: 15px;
		text-align: left !important;
	}
	.xpc-interna .filtrosbus .panel{
		margin: 0 0 8px;
		border-radius: 12px;
		overflow: hidden;
		background: #ffffff;
		box-shadow: 0 2px 8px rgba(0,0,0,.05);
	}
	.xpc-interna .filtrosbus .panel-title a{
		display: block;
		padding: 14px 16px !important;
		font-size: 15px;
	}

	/* Cada bloque traía su propio "Filtrar"; en móvil se aplica todo
	   desde la barra inferior (los bloques son un mismo formulario). */
	.xpc-interna .filtrosbus form.filter_by button.filtrar,
	.xpc-interna .filtrosbus form.filter_by button[type="submit"]{ display: none !important; }

	/* Encabezado fijo del panel: título + ✕ (lo crea xpc_movil.js) */
	.xpc-interna .xpc-filtros-head{
		position: fixed;
		top: var(--admin-tab, 0px);
		left: 0; right: 0;
		z-index: 9601;
		display: flex;
		align-items: center;
		justify-content: space-between;
		height: 56px;
		padding: 0 8px 0 16px;
		background: #ffffff;
		box-shadow: 0 1px 0 #ececec;
		font: 700 17px/56px Lato, Arial, Helvetica, sans-serif;
		color: var(--xpc-texto);
	}
	.xpc-interna .xpc-filtros-x{
		width: 44px; height: 44px;
		border: 0; border-radius: 50%;
		background: #f2f2f2;
		color: var(--xpc-texto);
		font: 400 28px/44px Arial, sans-serif;
		padding: 0;
	}

	/* Barra inferior: Limpiar + Aplicar filtros (la crea xpc_movil.js) */
	.xpc-interna .xpc-filtros-pie{
		position: fixed;
		left: 0; right: 0; bottom: 0;
		z-index: 9601;
		display: none;
		gap: 10px;
		padding: 12px 16px calc(12px + env(safe-area-inset-bottom));
		background: #ffffff;
		box-shadow: 0 -4px 14px rgba(0,0,0,.08);
	}
	.xpc-interna.xpc-filtros-abiertos .xpc-filtros-pie{ display: flex; }
	.xpc-interna .xpc-filtros-pie button{
		height: 50px;
		border-radius: 12px;
		font: 700 16px/1 Lato, Arial, Helvetica, sans-serif;
		padding: 0;
	}
	.xpc-interna .xpc-filtros-limpiar{
		flex: 0 0 36%;
		border: 2px solid var(--xpc-primario);
		background: #ffffff;
		color: var(--xpc-primario);
	}
	.xpc-interna .xpc-filtros-aplicar{
		flex: 1 1 auto;
		border: 0;
		background-image: var(--xpc-degradado);
		color: var(--xpc-sobre-primario);
		box-shadow: 0 6px 16px color-mix(in srgb, var(--xpc-primario) 35%, transparent);
	}
	.xpc-interna.xpc-filtros-abiertos{ overflow: hidden; }
	.xpc-interna.xpc-filtros-abiertos .pestfil{ display: none !important; }

	/* Precio: slider táctil con manijas grandes + campos Mín / Máx */
	.xpc-interna .filtrosbus .ui-slider{
		height: 6px;
		margin: 18px 14px 8px;
		border: 0;
		border-radius: 3px;
		background: #e6e6e6;
		touch-action: none;
	}
	.xpc-interna .filtrosbus .ui-slider .ui-slider-range{ background: var(--xpc-primario); border-radius: 3px; }
	.xpc-interna .filtrosbus .ui-slider .ui-slider-handle{
		top: 50%;
		width: 28px; height: 28px;
		margin: -14px 0 0 -14px;
		border: 3px solid var(--xpc-primario);
		border-radius: 50%;
		background: #ffffff;
		box-shadow: 0 2px 6px rgba(0,0,0,.2);
		outline: 0;
	}
	.xpc-interna .filtrosbus .min-price-label,
	.xpc-interna .filtrosbus .max-price-label{ display: none; }   /* los reemplazan los campos */
	.xpc-interna .filtrosbus .ui-slider ~ br{ display: none; }
	.xpc-interna .xpc-precio{
		display: flex;
		gap: 10px;
		margin: 16px 0 4px;
	}
	.xpc-interna .xpc-precio label{
		flex: 1 1 0;
		margin: 0;
		font-size: 11px;
		letter-spacing: .5px;
		text-transform: uppercase;
		color: var(--xpc-texto-suave);
	}
	.xpc-interna .xpc-precio input{
		display: block;
		width: 100%;
		height: 44px;
		margin-top: 4px;
		padding: 0 10px;
		border: 1px solid #e3e3e3;
		border-radius: 10px;
		background: #ffffff;
		font-size: 16px;                       /* 16px: iOS no hace zoom */
		color: var(--xpc-texto);
		box-sizing: border-box;
	}

	/* Filtros aplicados: chips en una fila deslizable
	   (el tema los ocultaba en móvil con .hidden-xs) */
	.xpc-interna .has-filters{
		display: block !important;
		margin: 0 0 12px;
	}
	.xpc-interna .has-filters > div{ float: none; width: auto; padding: 0; }
	.xpc-interna .has-filters form{
		display: flex;
		gap: 8px;
		overflow-x: auto;
		padding: 2px 0 4px;
		scrollbar-width: none;
	}
	.xpc-interna .has-filters form::-webkit-scrollbar{ display: none; }
	.xpc-interna .has-filters .delete-filter{
		flex: 0 0 auto;
		display: inline-flex;
		align-items: center;
		gap: 4px;
		height: 36px;
		margin: 0;
		padding: 0 4px 0 12px;
		border-radius: 18px;
		background: #ffffff;
		box-shadow: 0 1px 4px rgba(0,0,0,.08);
		white-space: nowrap;
		font-size: 13px;
	}
	.xpc-interna .has-filters .delete-filter > span{ float: none !important; }
	.xpc-interna .has-filters .filter-type{ color: var(--xpc-texto-suave); }
	.xpc-interna .has-filters .filter-name{ font-weight: 700; color: var(--xpc-texto); }
	.xpc-interna .has-filters .filter-icon{
		display: inline-flex !important;
		align-items: center;
		justify-content: center;
		width: 28px; height: 28px;
		margin: 0 !important;
		cursor: pointer;
	}
	.xpc-interna .has-filters .xpc-chip-limpiar{
		display: inline-block;
		flex: 0 0 auto;
		height: 36px;
		padding: 0 14px;
		border: 0;
		border-radius: 18px;
		background: var(--xpc-secundario);
		color: #ffffff;
		font: 700 13px/36px Lato, Arial, Helvetica, sans-serif;
		white-space: nowrap;
	}

	/* ---------- 3.5 Tarjeta de hotel ---------- */
	.xpc-interna .hotel-list .single-hotel-container{
		margin: 0 0 16px;
		border-radius: 14px;
		overflow: hidden;
		overflow: clip;                        /* recorta sin romper la barra sticky */
		background: #ffffff;
		box-shadow: 0 4px 14px rgba(0,0,0,.08);
	}
	.xpc-interna .hotel-list article.box{
		margin: 0 !important;
		padding: 0 !important;
		box-shadow: none;
		background: none;
	}
	.xpc-interna .hotel-list article.box::after{ content: ''; display: table; clear: both; }

	/* Foto a todo lo ancho */
	.xpc-interna .hotel-list figure.figurebox{
		float: none;
		width: 100%;
		height: 190px;
		padding: 0;
		margin: 0;
	}
	.xpc-interna .hotel-list figure.figurebox a,
	.xpc-interna .hotel-list figure.figurebox img{
		display: block;
		width: 100%;
		height: 100% !important;
		object-fit: cover;
	}

	/* La ficha del tema es una tabla de 2 columnas (nombre | detalles,
	   descripción | precio). Se aplana en una sola columna y se ordena:
	   nombre → estrellas → precio → Reservar → Detalles → cotización */
	.xpc-interna .hotel-list .details{
		display: flex !important;
		flex-direction: column;
		float: none;
		width: 100%;
		padding: 14px 16px 16px !important;
		background: none;
	}
	.xpc-interna .hotel-list .details > div,
	.xpc-interna .hotel-list .details > div > .omovil{ display: contents !important; }
	.xpc-interna .hotel-list .details > div:first-child > div:first-child{
		order: 1;
		display: block;
		width: auto;
		padding: 0;
		border: 0;
	}
	.xpc-interna .hotel-list .details .omovil > .five-stars-container{ order: 2; align-self: flex-start; margin: 2px 0 0; }
	.xpc-interna .hotel-list .details .omovil > .price,
	.xpc-interna .hotel-list .details .omovil > .nonRefundable{ order: 3; }
	.xpc-interna .hotel-list .details .omovil > .button-book{ order: 4; }
	.xpc-interna .hotel-list .details .omovil > a[id$="-details"]{ order: 5; }
	.xpc-interna .hotel-list .details .omovil > .btn_addquote{ order: 6; }
	.xpc-interna .hotel-list .details .box-title{ float: none !important; }
	.xpc-interna .hotel-list .details .box-title{
		margin: 0 0 4px;
		font-size: 18px;
		line-height: 1.25;
	}
	.xpc-interna .hotel-list .details .box-title small{
		display: block;
		margin-top: 4px;
		font-size: 12px;
	}

	/* Se muestra el bloque de escritorio (precio, Reservar, cotización,
	   Detalles con lightbox) y se oculta el duplicado móvil del tema */
	.xpc-interna .hotel-list .omovil{ display: block !important; }
	.xpc-interna .hotel-list .mmovil .five-stars-container,
	.xpc-interna .hotel-list .mmovil a[id$="-details"],
	.xpc-interna .hotel-list .mmov-700{ display: none !important; }
	.xpc-interna .hotel-list .mmovil,
	.xpc-interna .hotel-list .mmov-400{ display: block !important; margin: 0; }
	.xpc-interna .hotel-list .listinfo,
	.xpc-interna .hotel-list .details > .mmov-700{ display: none !important; }

	/* "Quitar Hotel" (admin) pequeño, como liga */
	.xpc-interna .hotel-list .n-block-button{
		display: inline-flex !important;
		align-items: center;
		gap: 6px;
		width: auto !important;
		height: 30px;
		margin: 8px 0 0;
		padding: 0 12px !important;
		border-radius: 15px;
		font-size: 12px;
		line-height: 30px;
	}

	/* Precio */
	.xpc-interna .hotel-list .details .price{
		float: none !important;
		display: flex !important;
		align-items: baseline;
		gap: 6px;
		margin: 12px 0 2px;
		text-align: left;
		font-size: 24px;
		font-weight: 700;
		color: var(--xpc-texto);
		white-space: nowrap;
	}
	.xpc-interna .hotel-list .details .price small{
		font-size: 12px;
		font-weight: 400;
		color: var(--xpc-texto-suave);
		text-transform: uppercase;
	}
	.xpc-interna .hotel-list .details .price .amount{ color: var(--xpc-texto); }
	.xpc-interna .hotel-list .nonRefundable{ margin: 0 0 12px; font-size: 12px; text-align: left; }

	/* Botones: Reservar (principal) · Detalles · Agregar a cotización */
	.xpc-interna .hotel-list .details .button{
		display: block;
		width: 100%;
		height: 46px;
		line-height: 46px;
		margin: 0 0 8px;
		padding: 0 !important;
		border-radius: 10px;
		font-size: 15px;
		font-weight: 700;
	}
	.xpc-interna .hotel-list .details .button-book{
		background-image: var(--xpc-degradado);
		color: var(--xpc-sobre-primario);
		box-shadow: 0 6px 16px color-mix(in srgb, var(--xpc-primario) 30%, transparent);
	}
	.xpc-interna .hotel-list .details .omovil > a[id$="-details"]{
		background: #ffffff;
		color: var(--xpc-primario);
		border: 2px solid var(--xpc-primario);
		line-height: 42px;
	}
	.xpc-interna .hotel-list .btn_addquote{
		display: flex !important;
		align-items: center;
		width: 100%;
		margin: 0;
		padding: 0 !important;
		border: 0 !important;
	}
	.xpc-interna .hotel-list .btn_addquote .title_btn_addquote{
		flex: none;
		margin-right: 8px;
		font-size: 12px;
		color: var(--xpc-texto-suave);
	}
	.xpc-interna .hotel-list .btn_addquote > .btn{
		height: 40px;
		line-height: 40px;
		padding: 0 14px;
		border-radius: 10px 0 0 10px;
		font-size: 14px;
	}
	.xpc-interna .hotel-list .btn_addquote > .dropdown-toggle{ border-radius: 0 10px 10px 0; padding: 0 12px; }
	.xpc-interna .hotel-list .btn_addquote .dropdown-menu{ right: 0; left: auto; min-width: 220px; }

	/* ---------- 3.6 Habitaciones (plegadas) ----------
	   La tabla de escritorio se vuelve una lista de tarjetas: nombre/plan,
	   precio y un selector por cada habitación buscada (Hab. 1…4).
	   La etiqueta "Hab. n" la pone xpc_movil.js. */
	.xpc-interna .hotel-list .offset-2.omovil{
		display: block !important;
		padding: 0 12px 12px !important;
		background: #f5f5f5;
	}
	.xpc-interna .hotel-list .room-table,
	.xpc-interna .hotel-list .room-table tbody,
	.xpc-interna .hotel-list .room-table tr,
	.xpc-interna .hotel-list .room-table td{
		display: block;
		width: 100% !important;
	}
	.xpc-interna .hotel-list .room-table{ background: none; }
	.xpc-interna .hotel-list .room-table thead{ display: none; }
	.xpc-interna .hotel-list .room-table tbody tr{
		position: relative;
		margin: 10px 0 0;
		padding: 12px 14px 10px;
		border-radius: 12px;
		background: #ffffff !important;
		box-shadow: 0 1px 4px rgba(0,0,0,.06);
	}
	.xpc-interna .hotel-list .room-table tbody tr td{
		border: 0 !important;
		padding: 0 !important;
		background: none !important;
		font-size: 13px;
	}
	/* Nombre y plan */
	.xpc-interna .hotel-list .room-table tbody tr td:first-child .size11:first-child{ font-size: 15px; font-weight: 700; color: var(--xpc-texto); }
	.xpc-interna .hotel-list .room-table tbody tr td:first-child .size11{ font-size: 12px; }
	/* Precio */
	.xpc-interna .hotel-list .room-table tbody tr td:nth-child(2){
		margin: 6px 0 8px;
		font-size: 17px;
		font-weight: 700;
		color: var(--xpc-texto);
	}
	/* Un selector por habitación, en fila */
	.xpc-interna .hotel-list .room-table tbody tr td:nth-child(n+3){
		display: inline-block;
		width: auto !important;
		margin: 0 8px 4px 0;
		vertical-align: top;
	}
	.xpc-interna .hotel-list .room-table tbody tr td[data-hab]::before{
		content: attr(data-hab);
		display: block;
		margin-bottom: 3px;
		font-size: 11px;
		color: var(--xpc-texto-suave);
	}
	.xpc-interna .hotel-list .room-selector .roombtn{
		display: flex !important;
		align-items: center;
		justify-content: center;
		min-width: 112px;
		width: auto;
		height: 40px;
		margin: 0;
		padding: 0 12px;
		border-radius: 10px;
		cursor: pointer;
	}
	.xpc-interna .hotel-list .room-selector .roombtn .size10x{ margin: 0; font-size: 12px; letter-spacing: .3px; }

	/* Plegado: se ven ~2 habitaciones; el botón "Mostrar más" las despliega */
	.xpc-interna .hotel-list .room-selector.shrinked tbody{
		display: block;
		height: 250px !important;              /* manda sobre el height en línea del tema */
		overflow: hidden;
		-webkit-mask-image: linear-gradient(to bottom, #000 75%, transparent);
		mask-image: linear-gradient(to bottom, #000 75%, transparent);
	}
	/* Desplegado (lo controla xpc_movil.js: el tema decidía por altura <150px
	   y en móvil la primera vez "plegaba" en lugar de abrir) */
	.xpc-interna .hotel-list .room-selector.xpc-abiertas tbody{
		height: auto !important;
		-webkit-mask-image: none;
		mask-image: none;
	}

	/* Barra fija de la tarjeta mientras se ven sus habitaciones:
	   resumen de lo elegido + Plegar + Reservar (la crea xpc_movil.js) */
	.xpc-interna .xpc-hab-barra{ display: none; }
	.xpc-interna .room-selector.xpc-abiertas .xpc-hab-barra{
		position: -webkit-sticky;
		position: sticky;
		bottom: calc(74px + env(safe-area-inset-bottom));   /* encima de la barra inferior */
		z-index: 20;
		display: block;
		margin: 12px -12px 0;
		padding: 10px 12px 12px;
		border-radius: 14px;
		background: var(--xpc-secundario);
		color: #ffffff;
		box-shadow: 0 -6px 18px rgba(0,0,0,.18);
	}
	.xpc-interna .xpc-hab-resumen{
		display: flex;
		align-items: baseline;
		justify-content: space-between;
		gap: 10px;
		margin-bottom: 8px;
	}
	.xpc-interna .xpc-hab-lista{
		flex: 1 1 auto;
		min-width: 0;
		font-size: 12px;
		line-height: 1.45;
		color: rgba(255,255,255,.8);
	}
	.xpc-interna .xpc-hab-lista span{ display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
	.xpc-interna .xpc-hab-lista b{ color: var(--xpc-primario); font-weight: 700; }
	.xpc-interna .xpc-hab-total{ flex: none; font-size: 17px; font-weight: 700; white-space: nowrap; }
	.xpc-interna .xpc-hab-botones{ display: flex; gap: 8px; }
	.xpc-interna .xpc-hab-botones button{
		height: 44px;
		padding: 0;
		border-radius: 10px;
		font: 700 15px/1 Lato, Arial, Helvetica, sans-serif;
	}
	.xpc-interna .xpc-hab-plegar{
		flex: 0 0 38%;
		border: 1px solid rgba(255,255,255,.5);
		background: transparent;
		color: #ffffff;
	}
	.xpc-interna .xpc-hab-reservar{
		flex: 1 1 auto;
		border: 0;
		background-image: var(--xpc-degradado);
		color: var(--xpc-sobre-primario);
	}
	.xpc-interna.xpc-hab-visible .pestfil{ display: none !important; }   /* no encimar "Filtrar" */
	.xpc-interna .hotel-list .room-selector.shrinked tr{ display: block; table-layout: auto; }
	.xpc-interna .hotel-list .room-selector a.toggle-rooms{
		display: block;
		height: 44px;
		margin: 10px 0 0;
		padding: 0 !important;
		line-height: 44px;
		border-radius: 10px;
		font-size: 14px;
		background: #ffffff;
		color: var(--xpc-secundario);
		border: 1px solid #e3e3e3;
	}

	/* ---------- 3.7 Paginado ----------
	   En medio de la lista el tema pinta « 1 … 12 13 14 15 16 … 21 »
	   y no cabe. En móvil: « 1 … 13 14 15 … 21 » (actual ±1). */
	.xpc-interna .pagination{
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		gap: 4px;
		max-width: 100%;
		margin: 8px 0 24px;
	}
	.xpc-interna .pagination > li{ float: none; display: block; height: auto; margin: 0 !important; }
	.xpc-interna .pagination > li:not(.active):not(.disabled):not(.prev):not(.next):not(:first-child):not(:last-child):not(.prev + li):not(:has(+ li.next)):not(:has(+ li.active)):not(li.active + li){
		display: none;
	}
	.xpc-interna .pagination > li > a,
	.xpc-interna .pagination > li > span{
		float: none;
		display: flex;
		align-items: center;
		justify-content: center;
		min-width: 36px;
		height: 40px;
		margin: 0 !important;
		padding: 0 6px;
		border-radius: 10px !important;
		border: 0;
		font-size: 15px;
	}
	.xpc-interna .pagination > li.disabled > span{ min-width: 24px; padding: 0; background: none; color: var(--xpc-texto-suave); }
	.xpc-interna .pagination > li.active > a{ background: var(--xpc-primario); color: var(--xpc-sobre-primario); }

	/* ---------- 3.8 Detalle del hotel (lightbox de escritorio) ----------
	   El botón "Detalles" de escritorio ya abre #details-modal; en móvil se
	   vuelve una hoja que sube casi a pantalla completa. Arriba queda una
	   franja del listado (tocarla cierra) y xpc_movil.js agrega la ✕. */
	.xpc-interna #details-modal{
		z-index: 9700 !important;              /* encima de la barra inferior */
		align-items: flex-end !important;
		justify-content: center;
		padding: 0 !important;
	}
	.xpc-interna #details-modal .modal-content{
		position: relative;
		width: 100% !important;
		max-width: none !important;
		height: calc(100% - 64px) !important;
		max-height: none !important;
		margin: 0 !important;
		padding: 0 !important;
		border-radius: 16px 16px 0 0;
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
		overscroll-behavior: contain;
		background: #ffffff;
	}
	.xpc-interna #details-modal .modal-inject{ padding: 0 16px 24px; }
	.xpc-interna #details-modal .modal-inject #main{ width: 100% !important; padding: 0; float: none; }

	/* ---------- 3.9 Contenido del detalle dentro de la hoja ----------
	   Encabezado fijo (nombre + ✕) y pie fijo (total + acciones) los crea
	   xpc_movil.js; el resto es el HTML de la página de detalle. */
	.xpc-interna .xpc-modal-cab{
		position: -webkit-sticky;
		position: sticky;
		top: 0;
		z-index: 6;
		display: flex;
		align-items: center;
		gap: 10px;
		height: 60px;
		padding: 0 8px 0 16px;
		background: #ffffff;
		border-bottom: 1px solid #efefef;
	}
	.xpc-interna .xpc-modal-titulo{ flex: 1 1 auto; min-width: 0; line-height: 1.25; }
	.xpc-interna .xpc-modal-titulo b,
	.xpc-interna .xpc-modal-titulo small{ display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
	.xpc-interna .xpc-modal-titulo b{ font-size: 16px; color: var(--xpc-secundario); }
	.xpc-interna .xpc-modal-titulo small{ font-size: 12px; color: var(--xpc-texto-suave); }
	.xpc-interna .xpc-modal-cerrar{
		display: block;
		flex: none;
		width: 40px; height: 40px;
		padding: 0;
		border: 0;
		border-radius: 50%;
		background: #f2f2f2;
		font: 400 26px/40px Arial, sans-serif;
		color: var(--xpc-texto);
	}

	/* Fotos / Mapa / Street View: control segmentado */
	.xpc-interna #details-modal #hotel-main-content{ margin: 12px 0 0; background: none; }
	.xpc-interna #details-modal #hotel-main-content > ul.tabs{
		display: flex;
		gap: 4px;
		height: auto;
		margin: 0 0 10px;
		padding: 4px;
		border: 0;
		border-radius: 12px;
		background: #f2f2f2;
	}
	.xpc-interna #details-modal #hotel-main-content > ul.tabs::before,
	.xpc-interna #details-modal #hotel-main-content > ul.tabs::after{ display: none; }
	.xpc-interna #details-modal #hotel-main-content > ul.tabs li{ flex: 1 1 0; float: none; width: auto; margin: 0; padding: 0; }
	.xpc-interna #details-modal #hotel-main-content > ul.tabs li a{
		display: block;
		height: 34px;
		padding: 0 !important;
		border-radius: 9px;
		background: transparent !important;
		color: #7a7a7b !important;
		font: 700 12px/34px Lato, Arial, Helvetica, sans-serif;
		text-align: center;
		text-transform: uppercase;
		letter-spacing: .3px;
	}
	.xpc-interna #details-modal #hotel-main-content > ul.tabs li.active a{
		background: #ffffff !important;
		color: var(--xpc-primario) !important;
		box-shadow: 0 1px 4px rgba(0,0,0,.1);
	}
	.xpc-interna #details-modal #hotel-main-content .tab-content{ padding: 0; background: none; border: 0; }
	.xpc-interna #details-modal .photo-gallery{ margin: 0; border-radius: 12px; overflow: hidden; }
	.xpc-interna #details-modal .photo-gallery .slides img{ height: 230px !important; object-fit: cover; }
	.xpc-interna #details-modal .photo-gallery .flex-direction-nav{ display: none; }   /* se desliza con el dedo */
	.xpc-interna #details-modal .image-carousel{ margin: 8px 0 0; padding: 0; position: relative; }
	.xpc-interna #details-modal .image-carousel .slides li{ border-radius: 8px; overflow: hidden; }
	.xpc-interna #details-modal .image-carousel .flex-direction-nav a{
		top: 50% !important;
		width: 30px !important; height: 30px !important;
		margin-top: -15px !important;
		border-radius: 50%;
		background-color: rgba(255,255,255,.92) !important;
		box-shadow: 0 1px 6px rgba(0,0,0,.25);
		opacity: 1 !important;
	}
	.xpc-interna #details-modal .image-carousel .flex-direction-nav a::before{
		/* Flecha centrada en el círculo: algunas skins la posicionan con
		   top/margin propios y quedaba abajo a la izquierda */
		position: absolute !important;
		top: 0 !important; left: 0 !important;
		width: 100% !important; height: 100% !important;
		margin: 0 !important;
		text-indent: 0 !important;
		text-align: center !important;
		color: var(--xpc-secundario) !important;
		font-size: 14px !important;
		line-height: 30px !important;
	}
	.xpc-interna #details-modal #map-tab,
	.xpc-interna #details-modal #steet-view-tab{ height: 260px; border-radius: 12px; overflow: hidden; }

	/* Descripción / Disponibilidad / Amenidades: pestañas con texto, fijas
	   debajo del encabezado (mismo estilo que las del buscador) */
	.xpc-interna #details-modal #hotel-features{ margin: 18px 0 0; background: none; }
	.xpc-interna #details-modal #hotel-features > ul.tabs{
		position: -webkit-sticky;
		position: sticky;
		top: 60px;
		z-index: 5;
		display: flex;
		height: auto;
		margin: 0 -16px 14px;
		padding: 0;
		border: 0;
		background: #ffffff;
		box-shadow: 0 1px 0 #ececec;
	}
	.xpc-interna #details-modal #hotel-features > ul.tabs::before,
	.xpc-interna #details-modal #hotel-features > ul.tabs::after{ display: none; }
	.xpc-interna #details-modal #hotel-features > ul.tabs li{ flex: 1 1 0; float: none; width: auto !important; margin: 0; padding: 0; }
	.xpc-interna #details-modal #hotel-features > ul.tabs li a{
		display: flex !important;
		flex-direction: column-reverse;
		align-items: center;
		justify-content: center;
		gap: 3px;
		height: 54px;
		padding: 0 !important;
		background: #ffffff !important;
		color: #7a7a7b !important;
		border-bottom: 3px solid transparent;
		font-size: 18px !important;
		line-height: 1 !important;
	}
	.xpc-interna #details-modal #hotel-features > ul.tabs li a .tacocx{
		display: block !important;
		width: auto !important; height: auto !important;
		font: 600 12px/1 Lato, Arial, Helvetica, sans-serif;
		text-indent: 0 !important;
		overflow: visible !important;
		position: static !important;
	}
	.xpc-interna #details-modal #hotel-features > ul.tabs li a [class*="soap-icon"]{ color: inherit !important; font-size: 18px; }
	.xpc-interna #details-modal #hotel-features > ul.tabs li.active a{ color: var(--xpc-primario) !important; border-bottom-color: var(--xpc-primario); }
	.xpc-interna #details-modal #hotel-features .tab-content{ padding: 0; background: none; border: 0; }
	.xpc-interna #details-modal #hotel-features .tab-pane{ padding: 0 !important; }
	.xpc-interna #details-modal #hotel-features h2{
		margin: 0 0 12px;
		font-size: 18px;
		font-weight: 700;
		color: var(--xpc-secundario);
		text-transform: none;
	}

	/* Descripción: dirección en tarjeta + texto legible */
	.xpc-interna #details-modal .intro{ display: block !important; margin: 0 0 16px; padding: 0 !important; background: none !important; border: 0 !important; box-shadow: none !important; }
	.xpc-interna #details-modal .intro .features{ display: block; width: auto; padding: 12px 14px !important; border-radius: 12px; background: #f7f7f7; }
	.xpc-interna #details-modal .intro .features ul{ margin: 0; padding: 0; }
	.xpc-interna #details-modal .intro .features li{ margin: 0; padding: 0; font-size: 14px; line-height: 1.45; color: #444444; text-transform: none; text-align: left; }
	.xpc-interna #details-modal .intro .features label{
		display: block;
		width: auto;
		margin: 0 0 3px;
		font-size: 11px;
		letter-spacing: .5px;
		text-transform: uppercase;
		color: var(--xpc-primario);
		text-align: left;
	}
	.xpc-interna #details-modal .long-description p{ font-size: 15px; line-height: 1.6; color: #555555; }

	/* Disponibilidad: cada tarifa como tarjeta */
	.xpc-interna #details-modal .room-list article.box{
		display: block;
		margin: 0 0 10px !important;
		padding: 12px 14px !important;
		border: 1px solid #ececec;
		border-radius: 12px;
		background: #ffffff;
		box-shadow: none;
	}
	.xpc-interna #details-modal .room-list .details{ float: none; width: 100%; padding: 0 !important; border: 0 !important; }
	.xpc-interna #details-modal .room-list .details > div:first-child{ display: flex !important; align-items: flex-start; justify-content: space-between; gap: 12px; }
	.xpc-interna #details-modal .room-list .details > div:first-child > div{ display: block !important; width: auto !important; padding: 0 !important; border: 0 !important; }
	.xpc-interna #details-modal .room-list .box-title{ flex: 1 1 auto; min-width: 0; margin: 0; }
	.xpc-interna #details-modal .room-list .box-title br{ display: none; }
	.xpc-interna #details-modal .room-list .box-title h4{
		margin: 0 0 4px;
		font-size: 15px;
		font-weight: 700;
		line-height: 1.3;
		color: var(--xpc-texto) !important;
		text-transform: none !important;
		letter-spacing: 0;
	}
	.xpc-interna #details-modal .room-list .box-title h3{ margin: 0; font-size: 12px; font-weight: 400; color: var(--xpc-texto-suave); text-transform: none; }
	.xpc-interna #details-modal .room-list .price-section{ flex: none; text-align: right; padding: 0 !important; border: 0 !important; }
	.xpc-interna #details-modal .room-list .price{ display: block; font-size: 18px; font-weight: 700; color: var(--xpc-texto) !important; line-height: 1.2; }
	.xpc-interna #details-modal .room-list .price small{ display: block; font-size: 10px; font-weight: 400; letter-spacing: .5px; text-transform: uppercase; color: var(--xpc-texto-suave); }
	.xpc-interna #details-modal .room-list .details > div + div p{ width: auto !important; margin: 6px 0 0; font-size: 12px; color: var(--xpc-texto-suave); }
	.xpc-interna #details-modal .room-list .xpc-repetido{ display: none; }

	/* Amenidades: dos columnas con palomita discreta */
	.xpc-interna #details-modal ul.amenities{ display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 0; padding: 0; }
	.xpc-interna #details-modal ul.amenities::before,
	.xpc-interna #details-modal ul.amenities::after{ display: none; }
	.xpc-interna #details-modal ul.amenities li{ float: none; width: auto; margin: 0; padding: 0; }
	.xpc-interna #details-modal ul.amenities .icon-box{
		display: flex;
		align-items: flex-start;
		gap: 8px;
		height: 100%;
		margin: 0;
		padding: 10px !important;
		border-radius: 10px;
		background: #f7f7f7 !important;
		font-size: 13px;
		line-height: 1.35;
		color: #444444;
		text-transform: none;
		box-sizing: border-box;
	}
	.xpc-interna #details-modal ul.amenities .icon-box i{
		position: static !important;
		flex: none;
		width: auto !important; height: auto !important;
		margin: 1px 0 0 !important;
		padding: 0 !important;
		background: none !important;
		color: var(--xpc-acento) !important;
		font-size: 13px !important;
		line-height: 1.35 !important;
	}

	/* Pie fijo: total + Elegir habitaciones + Reservar */
	.xpc-interna .xpc-modal-pie{
		position: -webkit-sticky;
		position: sticky;
		bottom: 0;
		z-index: 6;
		display: flex;
		align-items: center;
		gap: 8px;
		padding: 10px 12px calc(10px + env(safe-area-inset-bottom));
		background: #ffffff;
		box-shadow: 0 -4px 14px rgba(0,0,0,.08);
	}
	.xpc-interna .xpc-modal-pie[hidden]{ display: none; }
	.xpc-interna .xpc-modal-total{ flex: 1 1 auto; min-width: 0; line-height: 1.15; }
	.xpc-interna .xpc-modal-total small{ display: block; font-size: 11px; color: var(--xpc-texto-suave); text-transform: uppercase; letter-spacing: .5px; }
	.xpc-interna .xpc-modal-total b{ display: block; font-size: 17px; color: var(--xpc-texto); white-space: nowrap; }
	.xpc-interna .xpc-modal-pie button{
		flex: none;
		height: 46px;
		padding: 0 14px;
		border-radius: 10px;
		font: 700 14px/1 Lato, Arial, Helvetica, sans-serif;
	}
	.xpc-interna .xpc-modal-habs{ border: 2px solid var(--xpc-primario); background: #ffffff; color: var(--xpc-primario); }
	.xpc-interna .xpc-modal-reservar{
		border: 0;
		background-image: var(--xpc-degradado);
		color: var(--xpc-sobre-primario);
	}
	/* Con el detalle abierto, sin botón flotante de filtros */
	html.xpc-interna:has(#details-modal-trigger:checked) .pestfil{ display: none !important; }
}


/* =====================================================================
   4. RESULTADOS — SELECTOR DE PRODUCTO Y TOURS
   xpc_movil.js marca <html> con .xpc-resultados y .xpc-res-<tipo>
   (xpc-res-hoteles, xpc-res-tours…) según la URL de resultados.
   ===================================================================== */
@media (max-width: 767px) {

	/* "Resultados" va en otro elemento (oculto): que inicie con mayúscula */
	.xpc-interna .page-title-container .search-details::first-letter{ text-transform: uppercase; }
	.xpc-interna .page-title-container .page-title{ float: none !important; }
	.xpc-interna .page-title-container{ height: auto !important; min-height: 0 !important; }

	/* ---------- 4.1 Hoteles | Tours (sale del menú de escritorio) ---------- */
	.xpc-interna .xpc-productos{
		display: flex;
		gap: 4px;
		margin: 12px 0 4px;
		padding: 4px;
		border-radius: 12px;
		background: #ffffff;
		box-shadow: 0 1px 4px rgba(0,0,0,.06);
	}
	.xpc-interna .xpc-productos a{
		flex: 1 1 0;
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 6px;
		height: 40px;
		border-radius: 9px;
		color: #555555;
		font: 700 14px/1 Lato, Arial, Helvetica, sans-serif;
		text-decoration: none;
	}
	.xpc-interna .xpc-productos a span{
		min-width: 22px;
		padding: 3px 6px;
		border-radius: 10px;
		background: #f2f2f2;
		color: #7a7a7b;
		font-size: 11px;
		text-align: center;
	}
	.xpc-interna .xpc-productos a.activo{ background: var(--xpc-primario); color: var(--xpc-sobre-primario); }
	.xpc-interna .xpc-productos a.activo span{ background: rgba(255,255,255,.25); color: #ffffff; }

	/* ---------- 4.2 Tarjeta de tour ----------
	   Usa el mismo contenedor que hoteles (.hotel-list), así que aquí se
	   deshace el acomodo de la tarjeta de hotel (3.5) y se arma el propio. */
	/* Cada tour es una tarjeta separada (igual que hoteles) */
	.xpc-interna.xpc-res-tours .hotel-list article.box{
		margin: 0 0 16px !important;
		border-radius: 14px;
		overflow: hidden;
		overflow: clip;
		background: #ffffff;
		box-shadow: 0 4px 14px rgba(0,0,0,.08);
	}
	.xpc-interna.xpc-res-tours .hotel-list .details,
	.xpc-interna.xpc-res-tours .hotel-list .details *{ border: 0 !important; }
	.xpc-interna.xpc-res-tours .hotel-list .details{
		display: block !important;
		padding: 14px 16px 16px !important;
	}
	.xpc-interna.xpc-res-tours .hotel-list .details > div,
	.xpc-interna.xpc-res-tours .hotel-list .details [class*="col-"]{
		display: block !important;
		float: none !important;
		width: auto !important;
		padding: 0 !important;
		margin: 0;
	}
	.xpc-interna.xpc-res-tours .hotel-list .details .box-title{
		width: auto !important;
		margin: 0;
		padding: 0 !important;
		font-size: 18px;
		line-height: 1.25;
	}
	.xpc-interna.xpc-res-tours .hotel-list .details .box-title small{
		display: block;
		margin-top: 4px;
		font-size: 12px;
		text-transform: uppercase;
		letter-spacing: .3px;
		color: var(--xpc-texto-suave);
	}
	.xpc-interna.xpc-res-tours .hotel-list .cdescription{
		display: -webkit-box !important;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 3;
		overflow: hidden;
		margin: 8px 0 0 !important;
		font-size: 14px;
		line-height: 1.45;
		color: #666666;
	}
	/* Precio a la izquierda, "Detalles" a la derecha */
	.xpc-interna.xpc-res-tours .hotel-list .details .cdescription + div{ margin-top: 14px !important; }
	.xpc-interna.xpc-res-tours .hotel-list .details .cdescription + div > .row{
		display: flex !important;
		align-items: flex-end;
		justify-content: space-between;
		gap: 12px;
		margin: 0;
	}
	.xpc-interna.xpc-res-tours .hotel-list .details .row::before,
	.xpc-interna.xpc-res-tours .hotel-list .details .row::after{ display: none; }
	.xpc-interna.xpc-res-tours .hotel-list .details .omovil{
		position: static !important;
		width: auto !important;
		margin: 0 !important;
		padding: 0 !important;
		background: none !important;
		box-shadow: none !important;
		text-align: left !important;
		line-height: 1.15;
	}
	.xpc-interna.xpc-res-tours .hotel-list .omovil #desd,
	.xpc-interna.xpc-res-tours .hotel-list .omovil b{
		display: block;
		font-size: 11px;
		font-weight: 400;
		letter-spacing: .5px;
		text-transform: uppercase;
		color: var(--xpc-texto-suave);
	}
	.xpc-interna.xpc-res-tours .hotel-list .omovil br{ display: none; }
	.xpc-interna.xpc-res-tours .hotel-list .omovil .amount,
	.xpc-interna.xpc-res-tours .hotel-list .omovil .price{
		display: inline !important;
		margin: 0 !important;
		padding: 0 !important;
		background: none !important;
		font-size: 22px !important;
		font-weight: 700;
		color: var(--xpc-texto) !important;
		white-space: nowrap;
	}
	.xpc-interna.xpc-res-tours .hotel-list .omovil .price sup{ top: 0; margin-left: 3px; font-size: 11px; font-weight: 400; color: var(--xpc-texto-suave); text-transform: uppercase; }
	.xpc-interna.xpc-res-tours .hotel-list .omovil .grey{ display: inline; margin-left: 4px; font-size: 12px; color: var(--xpc-texto-suave); }
	.xpc-interna.xpc-res-tours .hotel-list .omovil .xpc-oculto{ display: none !important; }   /* menor en $0 (xpc_movil.js) */
	/* Segundo precio (menor): renglón propio y más discreto */
	.xpc-interna.xpc-res-tours .hotel-list .omovil .amount ~ .amount::before{ content: '\A'; white-space: pre; }
	.xpc-interna.xpc-res-tours .hotel-list .omovil .amount ~ .amount .price{ font-size: 15px !important; font-weight: 700; color: #555555 !important; }
	.xpc-interna.xpc-res-tours .hotel-list .details a.button{
		flex: none;
		display: block;
		width: auto !important;
		height: 46px;
		margin: 0 !important;
		padding: 0 22px !important;
		border: 0;
		border-radius: 10px;
		background-image: var(--xpc-degradado);
		color: var(--xpc-sobre-primario) !important;
		font-size: 15px;
		font-weight: 700;
		line-height: 46px;
		box-shadow: 0 6px 16px color-mix(in srgb, var(--xpc-primario) 30%, transparent);
	}
}


/* =====================================================================
   5. RESULTADOS DE TRASLADOS — .transfers-list
   ===================================================================== */
@media (max-width: 767px) {

	/* ---------- 5.1 Tarjeta ---------- */
	.xpc-interna .transfers-list article.box{
		display: block;
		margin: 0 0 16px !important;
		padding: 0 !important;
		border: 0;
		border-radius: 14px;
		overflow: hidden;
		overflow: clip;
		background: #ffffff;
		box-shadow: 0 4px 14px rgba(0,0,0,.08);
	}
	.xpc-interna .transfers-list figure{
		float: none;
		width: 100%;
		height: 150px;
		margin: 0;
		padding: 12px 16px 0;
		background: #ffffff;
	}
	.xpc-interna .transfers-list figure img{ display: block; width: 100%; height: 100%; object-fit: contain; }
	.xpc-interna .transfers-list .details{
		float: none;
		width: 100%;
		padding: 8px 16px 16px !important;
		border: 0 !important;
	}
	.xpc-interna .transfers-list .details > .clearfix{
		display: flex;
		flex-wrap: wrap;
		align-items: flex-end;
		justify-content: space-between;
		gap: 12px;
	}
	.xpc-interna .transfers-list .details > .clearfix::before,
	.xpc-interna .transfers-list .details > .clearfix::after{ display: none; }
	.xpc-interna .transfers-list .details > .clearfix > [class*="col-"]{
		float: none;
		width: auto;
		padding: 0;
		border: 0 !important;
		text-align: left;
	}
	.xpc-interna .transfers-list .details > .clearfix > [class*="col-"]:first-child{ flex: 0 0 100%; }
	.xpc-interna .transfers-list .box-title{ margin: 0 !important; padding: 0 !important; font-size: 18px; line-height: 1.25; }
	.xpc-interna .transfers-list .box-title small{
		display: block;
		margin-top: 5px;
		font-size: 13px;
		line-height: 1.35;
		letter-spacing: 0;
		text-transform: none;
		color: #666666;
	}
	.xpc-interna .transfers-list .box-title small i{ margin-right: 2px; }
	.xpc-interna .transfers-list .price{ display: block; margin: 0; text-align: left; line-height: 1.15; }
	.xpc-interna .transfers-list .price small{
		display: block;
		font-size: 11px;
		letter-spacing: .5px;
		text-transform: uppercase;
		color: var(--xpc-texto-suave);
	}
	.xpc-interna .transfers-list .price .amount{ font-size: 22px; font-weight: 700; color: var(--xpc-texto); white-space: nowrap; }
	.xpc-interna .transfers-list .button-details a.button{
		display: block;
		width: auto;
		height: 46px;
		margin: 0;
		padding: 0 22px !important;
		border: 0;
		border-radius: 10px;
		background-image: var(--xpc-degradado);
		color: var(--xpc-sobre-primario);
		font-size: 15px;
		font-weight: 700;
		line-height: 46px;
		text-transform: none;
		box-shadow: 0 6px 16px color-mix(in srgb, var(--xpc-primario) 30%, transparent);
	}

	/* "Agregar a: cotización" — renglón completo debajo del precio */
	.xpc-interna .transfers-list .btn_quote_transfers{
		flex: 0 0 100%;
		display: flex !important;
		align-items: center;
		width: 100%;
		margin: 0;
		padding: 0 !important;
		border: 0 !important;
	}
	.xpc-interna .transfers-list .btn_quote_transfers .title_btn_addquote{ flex: none; margin: 0 8px 0 0; font-size: 12px; color: var(--xpc-texto-suave); }
	.xpc-interna .transfers-list .btn_quote_transfers > .btn{ height: 40px; line-height: 40px; padding: 0 14px; border-radius: 10px 0 0 10px; font-size: 14px; }
	.xpc-interna .transfers-list .btn_quote_transfers > .dropdown-toggle{ border-radius: 0 10px 10px 0; padding: 0 12px; }
	.xpc-interna .transfers-list .btn_quote_transfers .dropdown-menu{ right: 0; left: auto; min-width: 220px; }

	/* ---------- 5.2 Itinerario (llegada / salida) ----------
	   En escritorio son 4 columnas; en móvil una tarjeta gris por tramo:
	   PickUp → Destino arriba, fecha y espera abajo. */
	.xpc-interna .transfers-list .segments{ float: none; width: auto; margin: 14px 0 0; padding: 0; }
	.xpc-interna .transfers-list .segment{
		display: grid !important;               /* el tema la pinta como tabla */
		grid-template-columns: 1fr 1fr;
		gap: 10px 12px;
		margin: 0 0 8px;
		padding: 12px;
		border-radius: 12px;
		background: #f7f7f7;
	}
	.xpc-interna .transfers-list .segment::before,
	.xpc-interna .transfers-list .segment::after{ display: none; }
	.xpc-interna .transfers-list .segment > [class*="col-"]{
		display: flex !important;
		align-items: flex-start;
		gap: 6px;
		float: none;
		width: auto;
		min-width: 0;
		padding: 0;
		font-size: 12.5px;
		line-height: 1.35;
		color: var(--xpc-texto);
		text-transform: none;
		text-align: left;
		height: auto !important;
		min-height: 0 !important;
		margin: 0 !important;
	}
	.xpc-interna .transfers-list .segment > [class*="col-"] > div{ width: auto !important; min-width: 0; }
	.xpc-interna .transfers-list .segment .pickup{ order: 1; }
	.xpc-interna .transfers-list .segment .departure{ order: 2; }
	.xpc-interna .transfers-list .segment .date{ order: 3; }
	.xpc-interna .transfers-list .segment .wait-times{ order: 4; }
	.xpc-interna .transfers-list .segment i{
		position: static !important;
		flex: none;
		width: 16px !important;
		margin: 1px 0 0 !important;
		padding: 0 !important;
		font-size: 14px;
		text-align: center;
	}
	.xpc-interna .transfers-list .segment > [class*="col-"] > div{ margin: 0 !important; padding: 0 !important; }
	.xpc-interna .transfers-list .segment .skin-color{
		display: inline-block;
		margin-bottom: 1px;
		font-size: 10.5px;
		letter-spacing: .4px;
		text-transform: uppercase;
		color: var(--xpc-texto-suave) !important;
	}

	/* ---------- 5.3 "Ordenar por" dentro del panel de filtros ----------
	   xpc_movil.js lo mueve de la lista al panel "Filtrar y ordenar". */
	.xpc-interna .filtrosbus .sort-by-section{
		float: none;
		margin: 0 0 8px;
		padding: 14px 16px;
		border: 0;
		border-radius: 12px;
		background: #ffffff;
		box-shadow: 0 2px 8px rgba(0,0,0,.05);
	}
	.xpc-interna .filtrosbus .sort-by-section .sort-by-title{
		float: none;
		width: auto;
		margin: 0 0 10px;
		padding: 0;
		font-size: 15px;
		color: var(--xpc-secundario);
	}
	.xpc-interna .filtrosbus .sort-by-section > .col-xs-4{ display: none; }   /* íconos + / - */
	.xpc-interna .filtrosbus .sort-by-section #order_by_fil{ display: block !important; width: 100%; }
	.xpc-interna .filtrosbus .sort-by-section .sort-bar{ float: none; width: 100%; margin: 0; padding: 0; }
	.xpc-interna .filtrosbus .sort-by-section .sort-bar form{ display: flex; gap: 10px; }
	.xpc-interna .filtrosbus .sort-by-section .sort-bar li{ flex: 1 1 0; float: none; width: auto; margin: 0; padding: 0; list-style: none; }
	.xpc-interna .filtrosbus .sort-by-section select,
	.xpc-interna .filtrosbus .sort-by-section span.custom-select{
		height: 44px !important;
		line-height: 44px !important;
		font-size: 16px !important;                 /* 16px: iOS no hace zoom */
		border-radius: 10px;
	}
}


/* =====================================================================
   6. DETALLE DE TRASLADO Y DE TOUR — /busquedas/detalle/.../(Transfers|Tours)/...
   (misma estructura: fotos + sidebar con formulario + descripción)
   xpc_movil.js marca <html> con .xpc-detalle y .xpc-det-<tipo>.
   En escritorio el formulario de reserva está en la columna derecha;
   en móvil quedaba debajo de ~5,000px de instrucciones. Orden móvil:
   fotos → resumen y formulario → descripción.
   ===================================================================== */
@media (max-width: 767px) {

	/* ---------- 6.1 Orden de bloques ---------- */
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) #main{ display: contents; }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) #main ~ .sidebar,
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) #main{ float: none; width: 100%; }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) .row:has(> #main){
		display: flex;
		flex-direction: column;
		margin: 0;
	}
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) .row:has(> #main)::before,
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) .row:has(> #main)::after{ display: none; }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) .row:has(> #main) > .tabquotes{ order: 0; }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) #hotel-main-content{ order: 1; }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) .row:has(> #main) > .sidebar{ order: 2; padding: 0; }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) #hotel-features{ order: 3; }

	/* ---------- 6.2 Foto del vehículo ---------- */
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) #hotel-main-content{ margin: 0 0 12px; padding: 0; background: none; }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) #hotel-main-content > ul.tabs{ display: none; }   /* solo "Fotos" */
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) #hotel-main-content .tab-content{ padding: 0; border: 0; background: none; }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) .photo-gallery{ border-radius: 14px; overflow: hidden; background: #ffffff; }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) .photo-gallery .slides img{ height: 190px !important; object-fit: contain; background: #ffffff; }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) .photo-gallery .flex-direction-nav,
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) .photo-gallery .flex-control-nav{ display: none; }

	/* ---------- 6.3 Resumen del traslado ---------- */
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) .sidebar article.detailed-logo{
		margin: 0 0 16px;
		padding: 16px !important;
		border: 0;
		border-radius: 14px;
		background: #ffffff;
		box-shadow: 0 4px 14px rgba(0,0,0,.08);
	}
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) .sidebar .details{ padding: 0 !important; }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) .sidebar h2.box-title{
		margin: 0 0 12px !important;
		padding: 0 !important;
		border: 0;
		font-size: 19px;
		line-height: 1.25;
		color: var(--xpc-secundario);
	}
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) .sidebar h2.box-title i{ color: var(--xpc-primario); }
	.xpc-interna.xpc-det-transfers .sidebar .details > .row:not(form){
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 10px 12px;
		margin: 0 0 16px;
		padding: 12px;
		border-radius: 12px;
		background: #f7f7f7;
	}
	.xpc-interna.xpc-det-transfers .sidebar .details > .row:not(form)::before,
	.xpc-interna.xpc-det-transfers .sidebar .details > .row:not(form)::after{ display: none; }
	.xpc-interna.xpc-det-transfers .sidebar .details > .row:not(form) > div{ float: none; width: auto; padding: 0; }
	.xpc-interna.xpc-det-transfers .sidebar .details > .row:not(form) h5{
		margin: 0 !important;
		padding: 0 !important;
		border: 0 !important;
		font-size: 10.5px;
		font-weight: 400;
		letter-spacing: .4px;
		line-height: 1.35;
		text-transform: uppercase;
		color: var(--xpc-texto-suave) !important;
	}
	.xpc-interna.xpc-det-transfers .sidebar .details > .row:not(form) h5 small{
		display: block;
		margin-top: 2px;
		font-size: 13.5px;
		font-weight: 700;
		letter-spacing: 0;
		text-transform: none;
		color: var(--xpc-texto);
	}

	/* ---------- 6.4 Formulario: pasajeros y vuelos ---------- */
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) #dv_form{ margin: 0; }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) #dv_form .hidden{ display: none !important; }   /* el tema deja .hidden con ancho 0 */
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) #dv_form [class*="col-"]{ padding-left: 0 !important; padding-right: 0 !important; }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) #dv_form .row{ margin-left: 0; margin-right: 0; }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) #dv_form #passengers,
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) #dv_form #darrival{ padding: 0 !important; }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) #dv_form h4.box-title{
		margin: 16px 0 8px !important;
		padding: 14px 0 0 !important;
		border: 0 !important;
		border-top: 1px solid #efefef !important;
		font-size: 16px;
		color: var(--xpc-secundario);
	}
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) #dv_form > div:first-of-type h4.box-title{ margin-top: 0 !important; padding-top: 0 !important; border-top: 0 !important; }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) #dv_form h5.box-title{
		margin: 10px 0 4px !important;
		text-align: left;
		padding: 0 !important;
		font-size: 11px;
		font-weight: 400;
		letter-spacing: .5px;
		text-transform: uppercase;
		color: var(--xpc-texto-suave) !important;
	}
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) #dv_form p{ margin: 0 0 4px !important; padding: 0 !important; font-size: 13px; line-height: 1.45; color: #666666; }
	/* Adultos / Menores lado a lado; las edades en fila */
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) #passengers > .row{ display: flex; flex-wrap: wrap; gap: 0 10px; }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) #passengers > .row > .col-md-6{ flex: 1 1 0; width: auto; }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) #passengers > .row > .col-xs-12:not(.col-md-6){ flex: 0 0 100%; }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) #edades > .col-xs-12:not(:first-child){ display: flex; flex-wrap: wrap; gap: 0 10px; }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) #edades [class*="child_"]{ flex: 0 0 calc(33.333% - 7px); width: auto; }
	/* Aerolínea | vuelo y fecha | hora en dos columnas */
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) #dv_form .col-xs-6{ width: calc(50% - 5px); }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) #dv_form .col-xs-6 + .col-xs-6{ margin-left: 10px; }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) #dv_form .col-xs-6 > .col-xs-6{ width: calc(50% - 4px); margin-left: 0; }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) #dv_form .col-xs-6 > .col-xs-6 + .col-xs-6{ margin-left: 8px; }
	/* Campos de 44px y 16px (iOS no hace zoom) */
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) #dv_form select,
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) #dv_form input.input-text,
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) #dv_form span.custom-select{
		height: 44px !important;
		line-height: 44px !important;
		font-size: 16px !important;
		border-radius: 10px;
	}
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) #dv_form input.input-text{ padding: 0 10px; }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) #dv_form .datepicker-wrap:after{ height: 44px; line-height: 44px; }

	/* ---------- 6.5 Precio + Cotizar fijos abajo ----------
	   xpc_movil.js junta el precio y el botón en .xpc-det-pie. */
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) .xpc-det-pie{
		position: -webkit-sticky;
		position: sticky;
		bottom: calc(74px + env(safe-area-inset-bottom));
		z-index: 20;
		display: flex;
		align-items: center;
		flex-wrap: wrap;
		gap: 10px 12px;
		margin: 16px -16px -16px;
		padding: 12px 16px;
		border-radius: 0 0 14px 14px;
		background: #ffffff;
		box-shadow: 0 -4px 14px rgba(0,0,0,.08);
	}
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) .xpc-det-pie > div{ float: none; width: auto !important; margin: 0; padding: 0 !important; }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) .xpc-det-pie > div:first-child{ flex: 1 1 auto; min-width: 110px; }
	/* Si el tema mete "Agregar a: cotización" junto al botón (al cotizar),
	   va en su propio renglón debajo */
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) .xpc-det-pie > .btn_addquote{
		order: 3;
		flex: 0 0 100%;
		display: flex !important;
		align-items: center;
		margin: 0 !important;
		padding: 0 !important;
		border: 0 !important;
	}
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) .xpc-det-pie > .btn_addquote .title_btn_addquote{ flex: none; margin: 0 8px 0 0; font-size: 12px; color: var(--xpc-texto-suave); }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) .xpc-det-pie > .btn_addquote > .btn{ flex: 1 1 auto; height: 38px; line-height: 38px; padding: 0 12px; border-radius: 10px 0 0 10px; font-size: 14px; }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) .xpc-det-pie > .btn_addquote > .dropdown-toggle{ flex: none; border-radius: 0 10px 10px 0; padding: 0 12px; }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) .xpc-det-pie > .btn_addquote .dropdown-menu{ top: auto; bottom: 100%; right: 0; left: auto; min-width: 220px; }   /* abre hacia arriba */
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) .xpc-det-pie .totalDetailPrice{ margin: 0; padding: 0; border: 0; background: none; text-align: left; }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) .xpc-det-pie .price-wrapper{ display: block; margin: 0; line-height: 1.15; text-align: left !important; }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) .xpc-det-pie .price-wrapper *{ text-align: left !important; float: none !important; }
	/* Antes de cotizar el precio viene en $0.00: se muestra una indicación */
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) .xpc-det-pie.xpc-sin-precio .price-wrapper{ display: none; }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) .xpc-det-pie.xpc-sin-precio > div:first-child::before{
		content: var(--xpc-t-completa, 'Completa los datos y presiona Cotizar');
		display: block;
		font-size: 13px;
		line-height: 1.35;
		color: #666666;
	}
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) .xpc-det-pie .totalDetailPriceLabel{ display: block; font-size: 11px; font-weight: 400; letter-spacing: .5px; text-transform: uppercase; color: var(--xpc-texto-suave); }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) .xpc-det-pie .price-per-unit{ font-size: 20px; font-weight: 700; color: var(--xpc-texto); white-space: nowrap; }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) .xpc-det-pie .currency{ margin-left: 3px; font-size: 11px; color: var(--xpc-texto-suave); }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) .xpc-det-pie :is(#transfers_control, #tour_control){ flex: none; position: static; width: auto !important; }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) .xpc-det-pie :is(#transfers_control, #tour_control) a.button{
		display: block;
		width: auto;
		height: 48px;
		margin: 0;
		padding: 0 26px !important;
		border: 0;
		border-radius: 10px;
		background-image: var(--xpc-degradado);
		color: var(--xpc-sobre-primario);
		font-size: 16px;
		font-weight: 700;
		line-height: 48px;
		text-transform: none;
		box-shadow: 0 6px 16px color-mix(in srgb, var(--xpc-primario) 30%, transparent);
	}

	/* ---------- 6.6 Descripción / Ubicación Pickups ---------- */
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) #hotel-features{ margin: 0 0 24px; background: none; }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) #hotel-features > ul.tabs{
		display: flex;
		gap: 4px;
		height: auto;
		margin: 0 0 12px;
		padding: 4px;
		border: 0;
		border-radius: 12px;
		background: #ececec;
	}
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) #hotel-features > ul.tabs::before,
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) #hotel-features > ul.tabs::after{ display: none; }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) #hotel-features > ul.tabs li{ flex: 1 1 0; float: none; width: auto !important; margin: 0; padding: 0; background: none !important; border: 0 !important; }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) #hotel-features > ul.tabs li a{
		display: flex !important;
		align-items: center;
		justify-content: center;
		height: 36px;
		padding: 0 6px !important;
		border-radius: 9px;
		background: transparent !important;
		color: #7a7a7b !important;
		font: 700 13px/1.1 Lato, Arial, Helvetica, sans-serif;
		text-align: center;
		text-transform: none;
	}
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) #hotel-features > ul.tabs li a .maps{ display: none; }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) #hotel-features > ul.tabs li a .hidetext{ display: inline !important; width: auto !important; }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) #hotel-features > ul.tabs li.active a{ background: #ffffff !important; color: var(--xpc-primario) !important; box-shadow: 0 1px 4px rgba(0,0,0,.1); }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) #hotel-features .tab-content{ padding: 0; border: 0; background: none; }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) #hotel-features .tab-pane{ padding: 0 !important; }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) #maps{ height: 300px; border-radius: 14px; overflow: hidden; }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) .long-description{
		padding: 16px !important;
		border-radius: 14px;
		background: #ffffff;
		box-shadow: 0 4px 14px rgba(0,0,0,.08);
	}
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) .long-description > br{ display: none; }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) .long-description > p:empty{ display: none; }
	/* Encabezados sin contenido (p. ej. "Salida Aeropuerto:" vacío) */
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) .long-description > h3:has(+ p:empty){ display: none; }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) .long-description h3{
		margin: 16px 0 6px;
		padding: 0;
		font-size: 16px;
		font-weight: 700;
		color: var(--xpc-secundario);
	}
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) .long-description > h3:first-of-type{ margin-top: 0; }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) .long-description h4{ margin: 12px 0 4px; font-size: 13px; font-weight: 700; color: var(--xpc-primario); text-transform: uppercase; letter-spacing: .3px; }
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) .long-description p{ margin: 0 0 8px; font-size: 14px; line-height: 1.55; color: #555555; }
	/* Textos largos plegados (xpc_movil.js agrega "Ver más") */
	.xpc-interna:is(.xpc-det-transfers, .xpc-det-tours) .long-description p.xpc-plegado{
		max-height: 9.3em;
		overflow: hidden;
		-webkit-mask-image: linear-gradient(to bottom, #000 60%, transparent);
		mask-image: linear-gradient(to bottom, #000 60%, transparent);
	}
	.xpc-interna .xpc-ver-mas{
		display: inline-block;
		margin: 0 0 10px;
		padding: 0;
		border: 0;
		background: none;
		color: var(--xpc-primario);
		font: 700 14px/1.4 Lato, Arial, Helvetica, sans-serif;
	}
}

/* ---------- 6.7 Solo tours ---------- */
@media (max-width: 767px) {
	/* Fotos reales: recortadas a lo ancho + miniaturas */
	.xpc-interna.xpc-det-tours .photo-gallery .slides img{ height: 230px !important; object-fit: cover; }
	.xpc-interna.xpc-det-tours .image-carousel{ margin: 8px 0 0; padding: 0; position: relative; }
	.xpc-interna.xpc-det-tours .image-carousel .slides li{ border-radius: 8px; overflow: hidden; }
	.xpc-interna.xpc-det-tours .image-carousel .flex-direction-nav a{
		top: 50% !important;
		width: 30px !important; height: 30px !important;
		margin-top: -15px !important;
		border-radius: 50%;
		background-color: rgba(255,255,255,.92) !important;
		box-shadow: 0 1px 6px rgba(0,0,0,.25);
		opacity: 1 !important;
	}
	.xpc-interna.xpc-det-tours .image-carousel .flex-direction-nav a::before{
		/* Flecha centrada en el círculo: algunas skins la posicionan con
		   top/margin propios y quedaba abajo a la izquierda */
		position: absolute !important;
		top: 0 !important; left: 0 !important;
		width: 100% !important; height: 100% !important;
		margin: 0 !important;
		text-indent: 0 !important;
		text-align: center !important;
		color: var(--xpc-secundario) !important;
		font-size: 14px !important;
		line-height: 30px !important;
	}

	/* Encabezado: nombre + zona + categoría */
	.xpc-interna.xpc-det-tours .sidebar h2.box-title small{
		display: block;
		margin-top: 6px;
		font-size: 13px;
		font-weight: 400;
		color: #666666;
		text-transform: none;
	}
	.xpc-interna.xpc-det-tours .sidebar h2.box-title small .fourty-space{ margin: 0 !important; padding: 0 !important; }
	.xpc-interna.xpc-det-tours .sidebar h2.box-title > i{ display: none; }

	/* Datos (precios desde, edades, días): mosaico 2×2; lo demás a lo ancho */
	.xpc-interna.xpc-det-tours .sidebar .details > .row:first-of-type{
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 8px;
		margin: 0 0 8px;
	}
	.xpc-interna.xpc-det-tours .sidebar .details > .row::before,
	.xpc-interna.xpc-det-tours .sidebar .details > .row::after{ display: none; }
	.xpc-interna.xpc-det-tours .sidebar .details > .row > div{ grid-column: 1 / -1; float: none; width: auto; padding: 0; }
	.xpc-interna.xpc-det-tours .sidebar .details > .row > div:has(> h5:empty){ display: none; }
	.xpc-interna.xpc-det-tours .sidebar .details > .row:first-of-type > div:has(> h5.box-title > small):not(:has(.soap-icon-phone)){
		grid-column: auto;
		padding: 10px 12px;
		border-radius: 12px;
		background: #f7f7f7;
	}
	.xpc-interna.xpc-det-tours .sidebar .details > .row:first-of-type > div:has(> h5.box-title > small):not(:has(.soap-icon-phone)) h5{
		margin: 0 !important;
		padding: 0 !important;
		border: 0 !important;
		font-size: 10.5px;
		font-weight: 400;
		letter-spacing: .4px;
		line-height: 1.35;
		text-transform: uppercase;
		color: var(--xpc-texto-suave) !important;
	}
	.xpc-interna.xpc-det-tours .sidebar .details > .row:first-of-type > div:has(> h5.box-title > small):not(:has(.soap-icon-phone)) h5 small{
		display: block;
		margin-top: 2px;
		font-size: 13.5px !important;
		font-weight: 700;
		letter-spacing: 0;
		text-transform: none;
		color: var(--xpc-texto) !important;
	}
	/* ¿En qué hotel te hospedas? + teléfono */
	.xpc-interna.xpc-det-tours .sidebar .details h4.box-title{
		margin: 14px 0 8px !important;
		padding: 0 !important;
		border: 0 !important;
		font-size: 16px;
		color: var(--xpc-secundario);
	}
	.xpc-interna.xpc-det-tours .sidebar .details h4.box-title i{ color: var(--xpc-primario); }
	.xpc-interna.xpc-det-tours .sidebar .details .selector{ margin: 0 !important; }
	.xpc-interna.xpc-det-tours .sidebar select,
	.xpc-interna.xpc-det-tours .sidebar span.custom-select{
		height: 44px !important;
		line-height: 44px !important;
		font-size: 16px !important;
		border-radius: 10px;
	}
	.xpc-interna.xpc-det-tours .sidebar .details > .row > div:has(.soap-icon-phone) h5{
		margin: 6px 0 0 !important;
		padding: 0 !important;
		border: 0 !important;
		font-size: 12.5px;
		font-weight: 400;
		line-height: 1.4;
		text-transform: none;
		color: #666666 !important;
	}
	.xpc-interna.xpc-det-tours .sidebar .details > .row > div:has(.soap-icon-phone) h5 small{ display: none; }
	.xpc-interna.xpc-det-tours .sidebar .details > .row > div:has(.soap-icon-phone) h5:last-child{ font-weight: 700; color: var(--xpc-secundario) !important; }
	/* Filtrar por zona (lista de hoteles) */
	.xpc-interna.xpc-det-tours .sidebar .toggle-container .panel{ margin: 10px 0 0; border: 0 !important; border-radius: 12px; background: #f7f7f7; box-shadow: none; }
	.xpc-interna.xpc-det-tours .sidebar .toggle-container .panel-title a{ display: block; padding: 12px 14px !important; font-size: 14px; }
	.xpc-interna.xpc-det-tours .sidebar .toggle-container .panel-content{ margin: 0; padding: 0 14px 10px !important; }
	.xpc-interna.xpc-det-tours .sidebar .toggle-container .panel-content > div{ width: 50%; padding: 0 !important; }

	/* Fechas disponibles: cada fecha es una opción grande; al elegirla se
	   despliegan planes, política, duración y pasajeros */
	.xpc-interna.xpc-det-tours form.t-pases{ padding: 0 !important; }
	.xpc-interna.xpc-det-tours form.t-pases .row{ margin: 0; }
	.xpc-interna.xpc-det-tours form.t-pases [class*="col-"]{ padding-left: 0 !important; padding-right: 0 !important; float: none; width: auto; }
	.xpc-interna.xpc-det-tours form.t-pases > .row{ margin: 0 0 8px; border: 1px solid #ececec; border-radius: 12px; overflow: hidden; }
	.xpc-interna.xpc-det-tours form.t-pases > .row:has(input[name="fechas[]"]:checked){ border-color: var(--xpc-primario); box-shadow: 0 0 0 1px var(--xpc-primario); }
	.xpc-interna.xpc-det-tours form.t-pases label.checkbox{
		display: flex !important;
		align-items: center;
		gap: 10px;
		min-height: 48px;
		margin: 0 !important;
		padding: 0 14px !important;
		border: 0 !important;
		font-size: 15px !important;
		font-weight: 700;
		color: var(--xpc-secundario) !important;
	}
	/* El tema oculta la casilla real (opacity 0) y dibuja un cuadro con
	   ::before desalineado; en móvil se usa la casilla nativa en naranja */
	.xpc-interna.xpc-det-tours form.t-pases label.checkbox::before,
	.xpc-interna.xpc-det-tours form.t-pases label.checkbox::after,
	.xpc-interna.xpc-det-tours form.t-pases .radio::before,
	.xpc-interna.xpc-det-tours form.t-pases .radio::after,
	.xpc-interna.xpc-det-tours form.t-pases .radio label::before,
	.xpc-interna.xpc-det-tours form.t-pases .radio label::after{ display: none !important; }
	.xpc-interna.xpc-det-tours form.t-pases label.checkbox input{ position: static !important; flex: none; width: 20px; height: 20px; margin: 0 !important; opacity: 1 !important; accent-color: var(--xpc-primario); }
	.xpc-interna.xpc-det-tours form.t-pases [id^="info-"]{ padding: 0 14px 12px !important; background: #fafafa; text-align: left; }
	.xpc-interna.xpc-det-tours form.t-pases [id^="info-"] *{ text-align: left !important; }
	.xpc-interna.xpc-det-tours form.t-pases [id^="info-"] > .row{ padding: 0 !important; }
	.xpc-interna.xpc-det-tours form.t-pases h5.box-title{
		margin: 12px 0 4px !important;
		padding: 0 !important;
		border: 0 !important;
		font-size: 11px;
		font-weight: 400;
		letter-spacing: .5px;
		text-transform: uppercase;
		color: var(--xpc-texto-suave) !important;
	}
	.xpc-interna.xpc-det-tours form.t-pases h5.box-title small{ display: block; margin-top: 2px !important; font-size: 14px !important; font-weight: 700; text-transform: none; letter-spacing: 0; color: var(--xpc-texto); }
	.xpc-interna.xpc-det-tours form.t-pases .radio{ margin: 4px 0 !important; }
	.xpc-interna.xpc-det-tours form.t-pases .radio label{ display: flex; align-items: flex-start; gap: 8px; padding: 0 !important; font-size: 14px !important; line-height: 1.35; }
	.xpc-interna.xpc-det-tours form.t-pases .radio{ padding-left: 0 !important; }
	.xpc-interna.xpc-det-tours form.t-pases .radio input{ position: static !important; flex: none; width: 18px; height: 18px; margin: 0 !important; opacity: 1 !important; accent-color: var(--xpc-primario); }
	.xpc-interna.xpc-det-tours form.t-pases .radio .skin-color{ color: var(--xpc-texto) !important; }
	.xpc-interna.xpc-det-tours form.t-pases [id^="info-"] div:not([class]),
	.xpc-interna.xpc-det-tours form.t-pases [id^="info-"] p{ font-size: 13px; line-height: 1.45; color: #555555; }
	/* Adultos / Menores lado a lado, edades en fila */
	.xpc-interna.xpc-det-tours form.t-pases .row:has(> .col-md-6){ display: flex; flex-wrap: wrap; gap: 0 10px; }
	.xpc-interna.xpc-det-tours form.t-pases .row:has(> .col-md-6) > .col-md-6{ flex: 1 1 0; }
	.xpc-interna.xpc-det-tours form.t-pases .row:has(> .col-md-6) > .col-xs-12:not(.col-md-6){ flex: 0 0 100%; }
	.xpc-interna.xpc-det-tours form.t-pases [class*="-edades"]:not(.no-display){ display: flex; flex-wrap: wrap; gap: 0 10px; }
	.xpc-interna.xpc-det-tours form.t-pases [class*="-edades"] > .col-xs-12{ flex: 0 0 100%; }
	.xpc-interna.xpc-det-tours form.t-pases [class*="-edades"] > .col-xs-3{ flex: 0 0 calc(33.333% - 7px); }
	.xpc-interna.xpc-det-tours form.t-pases .no-display{ display: none !important; }
	.xpc-interna.xpc-det-tours form.t-pases select,
	.xpc-interna.xpc-det-tours form.t-pases span.custom-select{
		height: 44px !important;
		line-height: 44px !important;
		font-size: 16px !important;
		border-radius: 10px;
	}

	/* "Agregar a: cotización" */
	.xpc-interna.xpc-det-tours .sidebar .btn_addquote{
		display: flex !important;
		align-items: center;
		width: 100%;
		margin: 16px 0 0;
		padding: 0 !important;
		border: 0 !important;
	}
	.xpc-interna.xpc-det-tours .sidebar .btn_addquote .title_btn_addquote{ flex: none; margin: 0 8px 0 0; font-size: 12px; color: var(--xpc-texto-suave); }
	.xpc-interna.xpc-det-tours .sidebar .btn_addquote > .btn{ height: 40px; line-height: 40px; padding: 0 14px; border-radius: 10px 0 0 10px; font-size: 14px; }
	.xpc-interna.xpc-det-tours .sidebar .btn_addquote > .dropdown-toggle{ border-radius: 0 10px 10px 0; padding: 0 12px; }
	.xpc-interna.xpc-det-tours .sidebar .btn_addquote .dropdown-menu{ right: 0; left: auto; min-width: 220px; }

	/* Descripción: el bloque "intro" solo repite el nombre */
	.xpc-interna.xpc-det-tours #hotel-description .intro{ display: none !important; }
	.xpc-interna.xpc-det-tours .long-description h2{ margin: 0 0 10px; font-size: 18px; font-weight: 700; color: var(--xpc-secundario); }
	.xpc-interna.xpc-det-tours .long-description > p:empty{ display: none; }
}


/* =====================================================================
   7. AVISOS DEL SITIO (showMessage → div.notifyBox) EN PÁGINAS INTERNAS
   Mismo estilo que en el login: tarjeta centrada, línea naranja arriba.
   En móvil el tema le daba la mitad de alto de la pantalla y la pegaba
   abajo; quedaba un cuadro blanco enorme con un texto pequeño.
   ===================================================================== */
@media (max-width: 767px) {
	.xpc-interna div.overlayNotify{
		z-index: 10040 !important;               /* encima de barra inferior y hojas */
		opacity: 1 !important;
		background: rgba(0,0,0,.6) !important;
	}
	.xpc-interna div.notifyBox{
		z-index: 10041 !important;
		top: 50% !important;
		bottom: auto !important;
		left: 50% !important;
		right: auto !important;
		width: calc(100% - 48px) !important;
		max-width: 360px;
		height: auto !important;
		min-height: 0 !important;
		max-height: calc(100% - 120px);
		overflow-y: auto;
		margin: 0 !important;
		padding: 24px 22px 20px !important;
		box-sizing: border-box;
		transform: translate(-50%, -50%);
		background: #ffffff !important;
		border: 0 !important;
		border-top: 6px solid var(--xpc-primario) !important;
		border-radius: 14px;
		box-shadow: 0 12px 40px rgba(0,0,0,.35);
		opacity: 1 !important;
		text-align: left;
	}
	.xpc-interna div.notifyBox .notifyConten{
		margin: 0;
		padding: 0 0 18px !important;
		font-size: 16px;
		line-height: 1.45;
		color: var(--xpc-texto);
		text-align: left;
	}
	.xpc-interna div.notifyBox button{
		float: none !important;
		display: block;
		width: 100%;
		height: 46px;
		margin: 0;
		padding: 0;
		border: 0;
		border-radius: 10px;
		background-image: var(--xpc-degradado);
		color: var(--xpc-sobre-primario);
		font: 700 16px/46px Lato, Arial, Helvetica, sans-serif;
		-webkit-appearance: none;
		appearance: none;
		animation: none !important;              /* sin el rebote del tema */
		opacity: 1 !important;                   /* a veces trae .close de Bootstrap (opacity .2) */
		text-shadow: none !important;
	}
	html.xpc-interna:has(div.notifyBox:not(.no-display)){ overflow: hidden; }
}


/* =====================================================================
   8. CARRITO — /reservas/index/...
   xpc_movil.js agrupa los bloques del tema por servicio y muestra uno a
   la vez (.xpc-visible); el wizard original (Anterior/Siguiente de 14
   pasos) se oculta.
   ===================================================================== */
@media (max-width: 767px) {

	/* ---------- 8.1 Pasos ---------- */
	.xpc-carrito .bloquer{ display: none !important; }
	.xpc-carrito .bloquer.xpc-visible{ display: block !important; }
	/* Envolturas del tema que solo contienen bloques de otros pasos */
	.xpc-carrito .booking-section div:has(.bloquer):not(:has(.xpc-visible)){ display: none !important; }
	.xpc-carrito.xpc-paso-pago #main{ display: none !important; }
	.xpc-carrito .row:has(> #main) > .mmovil{ display: none !important; }   /* wizard del tema */

	.xpc-carrito .xpc-pasos{
		display: flex;
		gap: 4px;
		margin: 0 15px 14px;
		padding: 0;
		list-style: none;
		counter-reset: none;
	}
	.xpc-carrito .xpc-pasos li{
		flex: 1 1 0;
		min-width: 0;
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 4px;
		padding: 0;
		cursor: pointer;
	}
	.xpc-carrito .xpc-pasos li::before{          /* línea de avance */
		content: '';
		display: block;
		width: 100%;
		height: 4px;
		border-radius: 2px;
		background: #e3e3e3;
	}
	.xpc-carrito .xpc-pasos li.hecho::before,
	.xpc-carrito .xpc-pasos li.activo::before{ background: var(--xpc-primario); }
	.xpc-carrito .xpc-pasos li span{ display: none; }
	.xpc-carrito .xpc-pasos li b{
		max-width: 100%;
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
		font: 600 12px/1.2 Lato, Arial, Helvetica, sans-serif;
		color: var(--xpc-texto-suave);
	}
	.xpc-carrito .xpc-pasos li.activo b{ font-weight: 700; color: var(--xpc-secundario); }
	.xpc-carrito .xpc-pasos li.hecho b{ color: var(--xpc-primario); }

	/* Anterior / Siguiente al pie de cada paso (dentro del contenido) */
	.xpc-carrito .xpc-pasos-nav{
		display: flex;
		gap: 10px;
		margin: 16px 0 8px;
	}
	.xpc-carrito .xpc-pasos-nav button{
		height: 50px;
		padding: 0 12px;
		border-radius: 10px;
		font: 700 15px/1 Lato, Arial, Helvetica, sans-serif;
	}
	.xpc-carrito .xpc-pasos-nav .xpc-ant{ flex: 0 0 36%; border: 2px solid #e3e3e3; background: #ffffff; color: #555555; }
	.xpc-carrito .xpc-pasos-nav .xpc-sig{
		flex: 1 1 auto;
		border: 0;
		background-image: var(--xpc-degradado);
		color: var(--xpc-sobre-primario);
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
		box-shadow: 0 6px 16px color-mix(in srgb, var(--xpc-primario) 30%, transparent);
	}
	.xpc-carrito .xpc-pasos-nav [hidden]{ display: none; }
	.xpc-carrito .xpc-pasos-nav .xpc-ant:only-child,
	.xpc-carrito .xpc-pasos-nav:has(.xpc-sig[hidden]) .xpc-ant{ flex: 1 1 auto; }

	/* ---------- 8.2 Tarjeta del servicio ---------- */
	.xpc-carrito #main{ float: none; width: 100%; padding: 0 15px; }
	.xpc-carrito .booking-section.travelo-box{
		margin: 0;
		padding: 16px !important;
		border-radius: 14px;
		background: #ffffff;
		box-shadow: 0 4px 14px rgba(0,0,0,.08);
	}
	.xpc-carrito .booking-section [class*="col-"]{ float: none; width: auto; padding-left: 0 !important; padding-right: 0 !important; border-right: 0 !important; }
	.xpc-carrito .booking-section .row{ margin-left: 0; margin-right: 0; }
	/* Encabezado del servicio (HOTEL ×) */
	.xpc-carrito [id^="blot"] .clearfix{ display: none; }
	.xpc-carrito [id^="blot"] h3{
		display: flex;
		align-items: center;
		justify-content: flex-start;
		margin: 0 0 12px;
		font-size: 17px;
		font-weight: 700;
		color: var(--xpc-secundario);
		text-transform: capitalize;
	}
	.xpc-carrito [id^="blot"] h3 i{ margin-right: 6px; color: var(--xpc-primario); }
	.xpc-carrito [id^="blot"] h3 > span{ margin-left: auto; }
	.xpc-carrito [id^="blot"] a.close{
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 36px; height: 36px;
		border-radius: 50%;
		background: #f2f2f2;
		opacity: 1;
		font-size: 22px;
		color: #555555;
		text-shadow: none;
	}
	.xpc-carrito .booking-section figure.fwimg{ height: 170px; margin: 0 0 12px; border-radius: 12px; overflow: hidden; }
	.xpc-carrito .booking-section figure.fwimg img{ width: 100%; height: 100% !important; object-fit: cover; }
	.xpc-carrito .booking-section h4.box-title{
		margin: 0 0 8px;
		font-size: 16px;
		line-height: 1.3;
		color: var(--xpc-secundario);
		text-transform: none;
	}
	.xpc-carrito .booking-section h4.box-title small{
		display: block;
		margin-top: 4px;
		font-size: 13px;
		text-transform: none;
		color: #666666;
	}
	.xpc-carrito .booking-section .timing{
		display: flex;
		align-items: center;
		justify-content: space-between;
		margin: 8px 0;
		padding: 10px 12px;
		border: 0;
		border-radius: 12px;
		background: #f7f7f7;
	}
	.xpc-carrito .booking-section .timing > div{ float: none; width: auto; padding: 0; text-align: center; }
	.xpc-carrito .booking-section .timing label{ display: block; margin: 0; font-size: 10.5px; letter-spacing: .4px; text-transform: uppercase; color: var(--xpc-texto-suave); }
	.xpc-carrito .booking-section .timing span{ font-size: 12.5px; font-weight: 700; line-height: 1.3; text-transform: none; color: var(--xpc-texto); }
	.xpc-carrito .booking-section .timing .duration span{ display: block; font-weight: 400; color: #666666; }
	.xpc-carrito .booking-section .price{
		display: flex;
		align-items: baseline;
		flex-wrap: wrap;
		gap: 0 6px;
		margin: 8px 0 0;
		padding: 0 !important;
		text-align: left;
	}
	.xpc-carrito .booking-section .price small{ flex: 0 0 100%; font-size: 10.5px; letter-spacing: .4px; text-transform: uppercase; color: var(--xpc-texto-suave); }
	.xpc-carrito .booking-section .price span{ font-size: 20px !important; font-weight: 700; color: var(--xpc-texto); }
	.xpc-carrito .booking-section .price span + br + span{ font-size: 11px !important; font-weight: 400; color: var(--xpc-texto-suave); }
	.xpc-carrito .booking-section .price br{ display: none; }
	/* Cada bloque del paso, separado del anterior */
	.xpc-carrito .booking-section .bloquer.xpc-visible + .bloquer.xpc-visible,
	.xpc-carrito .booking-section .xpc-visible ~ .xpc-visible{ margin-top: 14px; padding-top: 14px; border-top: 1px solid #efefef; }
	.xpc-carrito .booking-section [id^="blot"].xpc-visible + .xpc-visible{ margin-top: 0; padding-top: 0; border-top: 0; }
	.xpc-carrito .booking-section dl{ margin: 0; }
	.xpc-carrito .booking-section .center{ display: flex; gap: 16px; text-align: left; }
	.xpc-carrito .booking-section .center [class*="col-"]{ display: flex; gap: 16px; }
	.xpc-carrito .booking-section dt{ font-size: 10.5px; letter-spacing: .4px; text-transform: uppercase; }
	.xpc-carrito .booking-section dd{ margin: 0; font-size: 15px; font-weight: 700; }
	.xpc-carrito .booking-section h5{ margin: 0 0 4px !important; font-size: 13px; }
	/* Formularios: titulares, pasajeros, comentarios */
	.xpc-carrito .booking-section label{ display: block; margin: 8px 0 4px; font-size: 11px; font-weight: 400; letter-spacing: .5px; text-transform: uppercase; color: var(--xpc-texto-suave); }
	.xpc-carrito .booking-section label.box-title{ margin-top: 10px; font-size: 13px; font-weight: 700; letter-spacing: 0; text-transform: none; color: var(--xpc-secundario); }
	.xpc-carrito .booking-section input.input-text,
	.xpc-carrito .booking-section select,
	.xpc-carrito .booking-section span.custom-select{
		height: 44px !important;
		line-height: 44px !important;
		font-size: 16px !important;
		border-radius: 10px;
	}
	.xpc-carrito .booking-section input.input-text{ width: 100%; padding: 0 12px; }
	.xpc-carrito .booking-section textarea{ width: 100%; min-height: 80px; padding: 10px 12px; font-size: 16px; border-radius: 10px; }
	.xpc-carrito .booking-section .col-md-6 + .col-md-6{ margin-top: 0; }
	.xpc-carrito .booking-section .clearfix:has(> .col-md-6 + .col-md-6){ display: flex; gap: 10px; }
	.xpc-carrito .booking-section .clearfix:has(> .col-md-6 + .col-md-6) > .col-md-6{ flex: 1 1 0; min-width: 0; }
	/* Itinerario del traslado: igual que en resultados */
	.xpc-carrito .booking-section .segment{
		display: grid !important;
		grid-template-columns: 1fr 1fr;
		gap: 10px 12px;
		margin: 8px 0;
		padding: 12px !important;
		border-radius: 12px;
		background: #f7f7f7;
	}
	.xpc-carrito .booking-section .segment::before,
	.xpc-carrito .booking-section .segment::after{ display: none; }
	.xpc-carrito .booking-section .segment > div{ display: flex !important; gap: 6px; font-size: 12.5px; line-height: 1.35; }
	.xpc-carrito .booking-section .segment .skin-color{ font-size: 10.5px; letter-spacing: .4px; text-transform: uppercase; color: var(--xpc-texto-suave) !important; }
	.xpc-carrito .booking-section .segments{ border: 0 !important; margin: 0 !important; }

	/* ---------- 8.3 ¿Algo más? ---------- */
	.xpc-carrito .xpc-agregar{
		display: block;
		margin: 14px 0 0;
		padding: 14px 16px;
		border: 1px dashed var(--xpc-primario);
		border-radius: 14px;
		background: var(--xpc-primario-tenue);
	}
	.xpc-carrito.xpc-paso-pago .xpc-agregar{ display: none; }
	.xpc-carrito .xpc-agregar p{ margin: 0 0 10px; font-size: 14px; font-weight: 700; color: var(--xpc-secundario); }
	.xpc-carrito .xpc-agregar div{ display: flex; flex-wrap: wrap; gap: 8px; }
	.xpc-carrito .xpc-agregar a{
		display: inline-flex;
		align-items: center;
		height: 36px;
		padding: 0 14px;
		border-radius: 18px;
		background: #ffffff;
		box-shadow: 0 1px 4px rgba(0,0,0,.08);
		color: var(--xpc-primario);
		font: 700 13px/36px Lato, Arial, Helvetica, sans-serif;
		text-decoration: none;
	}

	/* ---------- 8.4 Pago: resumen + términos + Iniciar proceso ---------- */
	.xpc-carrito .sidebar.bloquer{ float: none; width: 100%; padding: 0 15px; }
	.xpc-carrito .sidebar .booking-details.travelo-box{
		margin: 0;
		padding: 16px !important;
		border-radius: 14px;
		background: #ffffff;
		box-shadow: 0 4px 14px rgba(0,0,0,.08);
	}
	.xpc-carrito .sidebar .booking-details .clearfix[style*="border-bottom"]{ display: none; }   /* solo las líneas separadoras */
	.xpc-carrito .sidebar h3{ margin: 0 0 10px; font-size: 17px; font-weight: 700; color: var(--xpc-secundario); text-transform: none; }
	.xpc-carrito .sidebar h3 i{ color: var(--xpc-primario); }
	.xpc-carrito .sidebar [class*="col-"]{ float: none; width: auto; padding-left: 0 !important; padding-right: 0 !important; }
	.xpc-carrito .sidebar .row{ margin-left: 0; margin-right: 0; }
	.xpc-carrito .xpc-resumen{
		display: block;
		margin: 0 0 14px;
		padding: 16px;
		border-radius: 14px;
		background: #ffffff;
		box-shadow: 0 4px 14px rgba(0,0,0,.08);
	}
	.xpc-carrito .xpc-resumen h4{ margin: 0 0 10px; font-size: 16px; font-weight: 700; color: var(--xpc-secundario); }
	.xpc-carrito .xpc-resumen ul{ margin: 0; padding: 0; list-style: none; }
	.xpc-carrito .xpc-resumen li{
		display: flex;
		align-items: flex-start;
		justify-content: space-between;
		gap: 12px;
		padding: 10px 0;
		border-bottom: 1px solid #efefef;
	}
	.xpc-carrito .xpc-resumen li span{ min-width: 0; }
	.xpc-carrito .xpc-resumen li small{ display: block; font-size: 10.5px; letter-spacing: .4px; text-transform: uppercase; color: var(--xpc-texto-suave); }
	.xpc-carrito .xpc-resumen li b{ display: block; font-size: 14px; line-height: 1.3; color: var(--xpc-texto); }
	.xpc-carrito .xpc-resumen li em{ flex: none; font-style: normal; font-size: 14px; font-weight: 700; color: var(--xpc-texto); white-space: nowrap; }
	.xpc-carrito .xpc-resumen-total{ display: flex; justify-content: space-between; align-items: baseline; padding-top: 12px; }
	.xpc-carrito .xpc-resumen-total span{ font-size: 13px; text-transform: uppercase; letter-spacing: .5px; color: var(--xpc-texto-suave); }
	.xpc-carrito .xpc-resumen-total b{ font-size: 22px; color: var(--xpc-texto); }
	.xpc-carrito .sidebar .checkbox{ margin: 8px 0 0 !important; }
	.xpc-carrito .sidebar .checkbox label{ position: relative; display: block; padding: 0 0 0 34px !important; font-size: 14px; line-height: 1.45; color: #444444; }
	.xpc-carrito .sidebar .checkbox::before,
	.xpc-carrito .sidebar .checkbox label::before{ display: none !important; }
	.xpc-carrito .sidebar .checkbox input{ position: absolute !important; left: 0; top: 0; width: 22px; height: 22px; margin: 0 !important; opacity: 1 !important; accent-color: var(--xpc-primario); }
	.xpc-carrito .sidebar #pay_now{
		height: 50px;
		margin-top: 14px;
		border-radius: 10px;
		background-image: var(--xpc-degradado);
		color: var(--xpc-sobre-primario);
		font-size: 16px;
		font-weight: 700;
		line-height: 50px;
		text-transform: none;
		box-shadow: 0 6px 16px color-mix(in srgb, var(--xpc-primario) 30%, transparent);
	}
	.xpc-carrito .sidebar #pay_now.hidden{ display: none !important; }
	/* Formas de pago (form[name=card_info]): vienen del servidor según la
	   agencia (tiempo límite, crédito/prepago, tarjeta, tarjeta a plazos).
	   Cada grupo trae su título, opciones (radio "pagos", una preseleccionada),
	   notas, la fecha límite y su total. */
	.xpc-carrito form[name="card_info"] > .row{ margin: 0 0 12px; padding: 14px; border: 1px solid #ececec; border-radius: 12px; }
	.xpc-carrito form[name="card_info"] > .row:has(input[name="pagos"]:checked){ border-color: var(--xpc-primario); box-shadow: 0 0 0 1px var(--xpc-primario); background: var(--xpc-primario-tenue); }
	.xpc-carrito form[name="card_info"] > .row:not(:has(input)){ display: none; }   /* separadores vacíos */
	.xpc-carrito form[name="card_info"] [class*="col-"]{ padding: 0 !important; float: none; width: auto; }
	.xpc-carrito form[name="card_info"] h5.box-title{ margin: 0 0 10px !important; font-size: 15px; font-weight: 700; color: var(--xpc-secundario); text-transform: none; }
	.xpc-carrito form[name="card_info"] .radio{ margin: 0 0 8px !important; padding: 0 !important; }
	.xpc-carrito form[name="card_info"] .radio::before,
	.xpc-carrito form[name="card_info"] .radio::after,
	.xpc-carrito form[name="card_info"] .radio label::before,
	.xpc-carrito form[name="card_info"] .radio label::after{ display: none !important; }
	.xpc-carrito form[name="card_info"] .radio label{
		display: flex;
		align-items: center;
		gap: 10px;
		min-height: 46px;
		margin: 0;
		padding: 0 14px !important;
		border: 1px solid #e3e3e3;
		border-radius: 10px;
		background: #ffffff;
		font-size: 15px !important;
		font-weight: 700;
		color: var(--xpc-texto);
		cursor: pointer;
	}
	.xpc-carrito form[name="card_info"] .radio:has(input:checked) label{ border-color: var(--xpc-primario); }
	.xpc-carrito form[name="card_info"] .radio input{ position: static !important; flex: none; width: 20px; height: 20px; margin: 0 !important; opacity: 1 !important; accent-color: var(--xpc-primario); }
	.xpc-carrito form[name="card_info"] .radio .skin-color{ color: var(--xpc-texto) !important; text-transform: none; }
	.xpc-carrito form[name="card_info"] p{ margin: 8px 0 0 !important; }
	.xpc-carrito form[name="card_info"] p label.box-title{
		display: block;
		margin: 0;
		font-size: 13px !important;
		font-weight: 400;
		letter-spacing: 0;
		line-height: 1.45 !important;
		text-transform: none;
		color: #666666;
	}
	/* "Tienes hasta el … para pagar" resaltado */
	.xpc-carrito form[name="card_info"] p:has(strong){
		padding: 10px 12px;
		border-radius: 10px;
		background: var(--xpc-primario-suave);
	}
	.xpc-carrito form[name="card_info"] p:has(strong) label.box-title{ color: #555555; }
	.xpc-carrito form[name="card_info"] p strong{ color: var(--xpc-primario-texto) !important; font-weight: 700; }
	.xpc-carrito form[name="card_info"] .total::before,
	.xpc-carrito form[name="card_info"] .total::after{ display: none !important; }
	.xpc-carrito form[name="card_info"] .total{
		display: flex !important;
		align-items: baseline;
		justify-content: space-between;
		margin: 12px 0 0;
		padding: 10px 0 0 !important;
		border-top: 1px solid #efefef;
	}
	.xpc-carrito form[name="card_info"] .total h5{ margin: 0 !important; font-size: 13px; letter-spacing: .4px; text-transform: uppercase; color: var(--xpc-texto-suave); }
	.xpc-carrito form[name="card_info"] .total .text-right h5{ font-size: 19px; letter-spacing: 0; text-transform: none; color: var(--xpc-texto) !important; }
	.xpc-carrito .sidebar .line3,
	.xpc-carrito .sidebar .padding30{ display: none; }
}


/* =====================================================================
   9. RESUMEN DE COMPRA (reserva hecha) — html.xpc-carrito.xpc-confirmacion
   Reutiliza las tarjetas del carrito (8.2); aquí todo va visible, con los
   datos del pago arriba y los códigos de reservación destacados.
   ===================================================================== */
@media (max-width: 767px) {
	.xpc-confirmacion .page-title-container .entry-title{
		display: block !important;
		float: none !important;
		margin: 0 0 4px;
		font-size: 20px;
		font-weight: 700;
		color: var(--xpc-secundario);
		text-transform: none;
	}
	.xpc-confirmacion .page-title-container .breadcrumbs{ display: none; }
	.xpc-confirmacion #main{ display: flex; flex-direction: column; gap: 16px; }
	.xpc-confirmacion #main > .booking-section{ float: none; width: 100%; }
	.xpc-confirmacion #main > .sidebar{ order: -1; float: none; width: 100%; padding: 0 !important; }   /* pago primero */

	/* Datos del pago */
	.xpc-confirmacion .sidebar .pagecontainer2{ padding: 0; background: none; }
	.xpc-confirmacion .sidebar .row{ margin: 0; }
	.xpc-confirmacion .sidebar .row:has(> .col-xs-12 > h4.box-title){
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 10px 12px;
		margin: 0 0 12px;
		padding: 12px;
		border-radius: 12px;
		background: #f7f7f7;
	}
	.xpc-confirmacion .sidebar .row:has(> .col-xs-12 > h4.box-title)::before,
	.xpc-confirmacion .sidebar .row:has(> .col-xs-12 > h4.box-title)::after{ display: none; }
	.xpc-confirmacion .sidebar .row > .col-xs-12:has(> h4.box-title):first-child{ grid-column: 1 / -1; }
	.xpc-confirmacion .sidebar h4.box-title{
		margin: 0 !important;
		padding: 0 !important;
		border: 0 !important;
		font-size: 10.5px !important;
		font-weight: 400;
		letter-spacing: .4px;
		line-height: 1.35;
		text-transform: uppercase;
		color: var(--xpc-texto-suave) !important;
	}
	.xpc-confirmacion .sidebar h4.box-title small{
		display: block;
		margin: 2px 0 0 !important;
		font-size: 14px !important;
		font-weight: 700;
		letter-spacing: 0;
		text-transform: none;
		color: var(--xpc-texto) !important;
		word-break: break-word;
	}
	.xpc-confirmacion .sidebar .totalDetailPrice{ margin: 0; padding: 0; border: 0; background: none; }
	.xpc-confirmacion .sidebar .price-wrapper{
		display: flex;
		align-items: baseline;
		justify-content: space-between;
		margin: 0;
		padding: 4px 0 0;
		text-transform: none;
	}
	.xpc-confirmacion .sidebar .totalDetailPriceLabel{ font-size: 13px; letter-spacing: .4px; text-transform: uppercase; color: var(--xpc-texto-suave); }
	.xpc-confirmacion .sidebar .price-per-unit{ font-size: 22px; font-weight: 700; color: var(--xpc-texto); white-space: nowrap; }
	.xpc-confirmacion .sidebar .price-per-unit .currency{ margin-left: 4px; font-size: 12px; font-weight: 400; color: var(--xpc-texto-suave); }
	.xpc-confirmacion .sidebar > br{ display: none; }

	/* Códigos / referencias de reservación: lo que más se busca aquí */
	.xpc-confirmacion .booking-section h3.skin-color{
		display: inline-block;
		margin: 4px 0 0 !important;
		padding: 6px 12px;
		border-radius: 10px;
		background: var(--xpc-primario-suave);
		font-size: 18px;
		font-weight: 700;
		letter-spacing: .5px;
		color: var(--xpc-primario-texto) !important;
		user-select: all;                         /* un toque selecciona todo el código */
		-webkit-user-select: all;
	}
	.xpc-confirmacion .booking-section div:has(> h3.skin-color){ margin: 12px 0 0 !important; padding: 12px 0 0 !important; border-top: 1px solid #efefef !important; }

	/* Datos de solo lectura: "Reservado a", pasajeros, contacto */
	.xpc-confirmacion .booking-section label + br{ display: none; }
	.xpc-confirmacion .booking-section strong{ color: var(--xpc-texto); }
	.xpc-confirmacion .booking-section [class*="col-md-6"] > strong{ display: block; font-size: 15px; line-height: 1.3; }
	.xpc-confirmacion .booking-section .clearfix:has(> .col-md-6 + .col-md-6){ flex-wrap: wrap; gap: 10px; }
	.xpc-confirmacion .booking-section .clearfix:has(> .col-md-6 + .col-md-6) > .col-md-6{ flex: 1 1 calc(50% - 5px); }
	.xpc-confirmacion .booking-section form .col-md-6 label.box-title{ margin-top: 6px; }
	.xpc-confirmacion .booking-section form .col-md-6 label:not(.box-title){ display: none; }   /* "Nombre" repetido */
	.xpc-confirmacion .booking-section .center .pull-left{ float: none; width: auto !important; }
	.xpc-confirmacion .booking-section p{ font-size: 13.5px; line-height: 1.5; color: #555555; }

	/* Ajustes tras prueba */
	.xpc-confirmacion [id^="blot"] a.close{ display: none !important; }
	.xpc-confirmacion .booking-section div:has(> h3.skin-color) > h4.box-title{ margin: 0 0 2px; font-size: 10.5px; letter-spacing: .4px; text-transform: uppercase; color: var(--xpc-texto-suave); }
	.xpc-confirmacion .booking-section [class*="col-"][style*="padding-top"]{ padding-top: 6px !important; }
	.xpc-confirmacion .booking-section [class*="col-"][style*="padding-bottom"]{ padding-bottom: 0 !important; }
	.xpc-confirmacion .booking-section dd{ text-transform: none; }

	/* Carrito y resumen: los pseudo clearfix no deben ser items flex */
	.xpc-carrito .booking-section .center::before,
	.xpc-carrito .booking-section .center::after,
	.xpc-carrito .booking-section .center [class*="col-"]::before,
	.xpc-carrito .booking-section .center [class*="col-"]::after,
	.xpc-carrito .booking-section .clearfix:has(> .col-md-6 + .col-md-6)::before,
	.xpc-carrito .booking-section .clearfix:has(> .col-md-6 + .col-md-6)::after{ display: none; }
	.xpc-carrito .booking-section .segment > div{ align-items: flex-start; }
	.xpc-carrito .booking-section .segment > div > i{ flex: none; width: 16px; margin: 1px 0 0 !important; }
	.xpc-carrito .booking-section .segment > div > div{ margin: 0 !important; padding: 0 !important; text-transform: none !important; }
}

/* Elementos creados por xpc_movil.js: no existen en escritorio */
.xpc-hoja-cerrar, .xpc-mas, .xpc-wa-tab, .xpc-hoja-mas, .xpc-tl, .xpc-puntos,
.xpc-filtros-head, .xpc-filtros-pie, .xpc-chip-limpiar, .xpc-modal-cerrar, .xpc-precio, .xpc-hab-barra,
.xpc-modal-cab, .xpc-modal-pie, .xpc-productos, .xpc-ver-mas,
.xpc-pasos, .xpc-pasos-nav, .xpc-agregar, .xpc-resumen{ display: none; }