/**
 * Estilos Frontend del Plugin Mabel Tour
 * Diseño Mobile-First, Moderno y Optimizado para Conversión
 *
 * @package Mabel_Tour
 * @author  César L Sard
 */

:root {
	--mt-primary: #d97706; /* Ámbar/Ocre Sevilla cálido */
	--mt-primary-hover: #b45309;
	--mt-primary-light: #fef3c7;
	--mt-dark: #1e293b;
	--mt-text: #334155;
	--mt-text-muted: #64748b;
	--mt-bg-card: #ffffff;
	--mt-border: #e2e8f0;
	--mt-radius: 12px;
	--mt-radius-sm: 8px;
	--mt-shadow: 0 4px 20px -2px rgba(0, 0, 0, 0.08), 0 2px 6px -1px rgba(0, 0, 0, 0.04);
	--mt-transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

/* ==========================================================================
   Catálogo de Tours (Grid de Tarjetas)
   ========================================================================== */

.mt-no-tours {
	margin: 30px 0;
	padding: clamp(24px, 5vw, 48px);
	background: var(--mt-primary-light);
	border: 1px solid var(--mt-primary);
	border-radius: var(--mt-radius);
	color: var(--mt-dark);
	text-align: center;
}

.mt-no-tours .mt-no-tours-title {
	margin: 0 0 16px;
	font-size: clamp(1.5rem, 4vw, 2rem);
	line-height: 1.3;
	color: var(--mt-dark);
}

.mt-no-tours p {
	max-width: 640px;
	margin: 0 auto;
	font-size: 1.0625rem;
	line-height: 1.7;
}

.mt-tours-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr));
	gap: 30px;
	margin: 30px 0;
}

.mt-tour-card {
	min-width: 0;
	background: var(--mt-bg-card);
	border-radius: var(--mt-radius);
	border: 1px solid var(--mt-border);
	overflow: hidden;
	box-shadow: var(--mt-shadow);
	transition: var(--mt-transition);
	display: flex;
	flex-direction: column;
}

.mt-tour-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 12px 28px -4px rgba(0, 0, 0, 0.12);
}

.mt-tour-card-thumb {
	position: relative;
	width: 100%;
	height: 220px;
	overflow: hidden;
	background: #f1f5f9;
}

.mt-tour-card-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.4s ease;
}

.mt-tour-card:hover .mt-tour-card-thumb img {
	transform: scale(1.05);
}

.mt-tour-card-thumb-placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	color: #94a3b8;
	font-size: 48px;
}

.mt-card-badge-free {
	position: absolute;
	top: 14px;
	right: 14px;
	background: rgba(19, 115, 51, 0.92);
	backdrop-filter: blur(4px);
	color: #ffffff;
	font-weight: 700;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	padding: 5px 12px;
	border-radius: 20px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}

.mt-card-badge-available {
	position: absolute;
	top: 14px;
	left: 14px;
	background: rgba(16, 185, 129, 0.95);
	backdrop-filter: blur(4px);
	color: #ffffff;
	font-weight: 700;
	font-size: 11.5px;
	padding: 5px 11px;
	border-radius: 20px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
	display: inline-flex;
	align-items: center;
	gap: 5px;
}

.mt-card-badge-available::before {
	content: '';
	display: inline-block;
	width: 6px;
	height: 6px;
	background: #ffffff;
	border-radius: 50%;
}

.mt-tour-card-body {
	min-width: 0;
	overflow-wrap: anywhere;
	padding: 24px;
	display: flex;
	flex-direction: column;
	flex: 1;
}

.mt-tour-card-title {
	font-size: 20px;
	font-weight: 700;
	margin: 0 0 10px 0;
	line-height: 1.3;
}

.mt-tour-card-title a {
	color: var(--mt-dark);
	text-decoration: none;
	transition: color 0.2s ease;
}

.mt-tour-card-title a:hover {
	color: var(--mt-primary);
}

.mt-tour-card-meta {
	display: flex;
	gap: 14px;
	font-size: 13px;
	color: var(--mt-text-muted);
	font-weight: 500;
	margin-bottom: 14px;
	flex-wrap: wrap;
	align-items: center;
}

.mt-meta-available {
	color: #047857;
	font-weight: 700;
	background: #ecfdf5;
	padding: 2px 8px;
	border-radius: 4px;
	border: 1px solid #a7f3d0;
	font-size: 12px;
	display: inline-flex;
	align-items: center;
	gap: 4px;
}

.mt-meta-pax {
	color: #475569;
	font-weight: 600;
	background: #f8fafc;
	padding: 2px 8px;
	border-radius: 4px;
	border: 1px solid #e2e8f0;
	font-size: 12px;
}

/* Barra de idiomas con código de colores del calendario (Opción 2) */
.mt-card-langs-section {
	background: #f8fafc;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	padding: 10px 12px;
	margin-bottom: 16px;
}

.mt-card-langs-label {
	display: block;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	color: #64748b;
	margin-bottom: 6px;
}

.mt-card-langs-badges {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin-bottom: 6px;
}

.mt-card-lang-chip {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-size: 11.5px;
	font-weight: 700;
	padding: 3px 8px;
	border-radius: 20px;
	border: 1px solid #cbd5e1;
	background: #ffffff;
	color: #334155;
	line-height: 1.2;
	transition: transform 0.15s ease;
}

.mt-card-lang-chip:hover {
	transform: translateY(-1px);
}

.mt-chip-dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	display: inline-block;
	flex-shrink: 0;
}

.mt-chip-es .mt-chip-dot { background-color: #ef4444; }
.mt-chip-fr .mt-chip-dot { background-color: #3b82f6; }
.mt-chip-en .mt-chip-dot { background-color: #22c55e; }
.mt-chip-lse .mt-chip-dot { background-color: #d946ef; }

.mt-card-langs-hint {
	display: block;
	font-size: 11px;
	color: #64748b;
	line-height: 1.3;
	font-style: italic;
}

.mt-tour-card-excerpt {
	font-size: 14px;
	color: var(--mt-text);
	line-height: 1.6;
	margin-bottom: 20px;
	flex: 1;
}

.mt-tour-card-footer {
	margin-top: auto;
}

.mt-btn-primary {
	display: inline-block;
	width: 100%;
	text-align: center;
	background: var(--mt-primary);
	color: #ffffff !important;
	padding: 12px 20px;
	border-radius: var(--mt-radius-sm);
	font-weight: 600;
	font-size: 15px;
	text-decoration: none !important;
	transition: var(--mt-transition);
	box-shadow: 0 2px 8px rgba(217, 119, 6, 0.25);
}

.mt-btn-primary:hover {
	background: var(--mt-primary-hover);
	transform: translateY(-1px);
	box-shadow: 0 4px 12px rgba(217, 119, 6, 0.35);
}

/* ==========================================================================
   Widget Interactivo de Reservas
   ========================================================================== */

.mt-booking-widget-wrapper {
	background: var(--mt-bg-card);
	border: 1px solid var(--mt-border);
	border-radius: var(--mt-radius);
	box-shadow: var(--mt-shadow);
	padding: 18px 20px;
	margin: 0 0 30px 0;
	position: relative;
	font-family: inherit;
	box-sizing: border-box;
	max-width: 100%;
}

.mt-widget-header {
	text-align: center;
	margin-bottom: 20px;
	padding-bottom: 16px;
	border-bottom: 1px solid var(--mt-border);
}

.mt-widget-header h3 {
	margin: 0 0 6px 0;
	font-size: 22px;
	color: var(--mt-dark);
	font-weight: 700;
}

.mt-widget-subtitle {
	margin: 0;
	font-size: 14px;
	color: #16a34a;
}

/* Barra de Pasos */
.mt-steps-bar {
	display: flex;
	justify-content: space-between;
	margin-bottom: 24px;
	background: #f8fafc;
	padding: 4px;
	border-radius: 30px;
	border: 1px solid var(--mt-border);
}

.mt-step-pill {
	flex: 1;
	text-align: center;
	font-size: 13px;
	font-weight: 600;
	color: var(--mt-text-muted);
	padding: 6px 12px;
	border-radius: 20px;
	transition: var(--mt-transition);
}

.mt-step-pill.is-active {
	background: var(--mt-primary);
	color: #ffffff;
	box-shadow: 0 2px 6px rgba(217, 119, 6, 0.25);
}

/* Botón Volver (Cápsula interactiva) */
.mt-btn-back {
	background: #f8fafc;
	border: 1px solid #cbd5e1;
	color: #475569;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
	padding: 7px 16px;
	margin-bottom: 4px;
	display: inline-flex;
	align-items: center;
	gap: 7px;
	border-radius: 9999px;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
	transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
	line-height: 1;
	user-select: none;
	-webkit-tap-highlight-color: transparent;
	text-decoration: none !important;
}

.mt-btn-back .mt-btn-back-arrow {
	display: inline-block;
	font-size: 14px;
	font-weight: 700;
	transition: transform 0.2s ease;
}

.mt-btn-back:hover {
	background: #fffbeb;
	border-color: #f59e0b;
	color: #b45309;
	box-shadow: 0 2px 6px rgba(217, 119, 6, 0.16);
	text-decoration: none !important;
}

.mt-btn-back:hover .mt-btn-back-arrow {
	transform: translateX(-3px);
}

.mt-btn-back:active {
	transform: scale(0.97);
}

.mt-btn-back:focus-visible {
	outline: 2px solid #d97706;
	outline-offset: 2px;
}

.mt-step-title {
	font-size: 14px;
	color: var(--mt-dark);
	margin: 0 0 16px 0;
	font-weight: 600;
}

/* Calendario Público */
.mt-public-cal-nav {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 14px;
}

.mt-pub-month-label {
	font-weight: 700;
	font-size: 16px;
	color: var(--mt-dark);
	text-transform: capitalize;
}

.mt-cal-btn {
	background: #f1f5f9;
	border: 1px solid var(--mt-border);
	width: 34px;
	height: 34px;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	font-size: 18px;
	color: var(--mt-dark);
	transition: var(--mt-transition);
}

.mt-cal-btn:hover {
	background: var(--mt-primary);
	color: #fff;
	border-color: var(--mt-primary);
}

.mt-cal-btn.is-disabled {
	visibility: hidden !important;
	opacity: 0 !important;
	pointer-events: none !important;
}

/* ==========================================================================
   Nueva Lista de Días Disponibles (Formato Tarjeta / Botón Alargado)
   ========================================================================== */
.mt-avail-days-list {
	display: flex;
	flex-direction: column;
	gap: 10px;
	max-height: 480px;
	overflow-y: auto;
	padding: 4px 2px;
	margin-top: 10px;
	scrollbar-width: thin;
	scrollbar-color: #cbd5e1 transparent;
}

.mt-avail-days-list::-webkit-scrollbar {
	width: 6px;
}
.mt-avail-days-list::-webkit-scrollbar-track {
	background: transparent;
}
.mt-avail-days-list::-webkit-scrollbar-thumb {
	background-color: #cbd5e1;
	border-radius: 4px;
}

/* Tarjeta / Botón Alargado de Día */
.mt-avail-day-card {
	background: #ffffff;
	border: 1.5px solid var(--mt-border);
	border-radius: var(--mt-radius);
	padding: 12px 14px;
	display: flex;
	align-items: center;
	gap: 14px;
	cursor: pointer;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
	transition: all 0.22s cubic-bezier(0.4, 0, 0.2, 1);
	user-select: none;
	-webkit-tap-highlight-color: transparent;
	position: relative;
	text-decoration: none !important;
}

.mt-avail-day-card:hover {
	border-color: var(--mt-primary);
	background: #fffdfa;
	box-shadow: 0 4px 14px rgba(217, 119, 6, 0.14);
	transform: translateY(-2px);
}

.mt-avail-day-card:active {
	transform: scale(0.99);
}

.mt-avail-day-card.is-selected {
	border-color: var(--mt-primary) !important;
	background: #fffbeb !important;
	box-shadow: 0 0 0 2px var(--mt-primary), 0 4px 12px rgba(217, 119, 6, 0.15) !important;
}

/* Bloque Calendario Compacto (Izquierda) */
.mt-day-badge {
	background: #f8fafc;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	padding: 6px 8px;
	min-width: 52px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	transition: all 0.2s ease;
}

.mt-avail-day-card:hover .mt-day-badge {
	background: #fffbeb;
	border-color: #fde68a;
}

.mt-day-badge-name {
	font-size: 10.5px;
	font-weight: 700;
	text-transform: uppercase;
	color: var(--mt-primary);
	letter-spacing: 0.5px;
	line-height: 1;
	margin-bottom: 2px;
}

.mt-day-badge-num {
	font-size: 22px;
	font-weight: 800;
	color: var(--mt-dark);
	line-height: 1.1;
}

.mt-day-badge-month {
	font-size: 10px;
	font-weight: 600;
	text-transform: uppercase;
	color: #64748b;
	line-height: 1;
	margin-top: 2px;
}

/* Contenido Central */
.mt-day-info {
	flex: 1;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 5px;
}

.mt-day-headline {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 6px;
}

.mt-day-title {
	font-size: 14.5px;
	font-weight: 700;
	color: var(--mt-dark);
	text-transform: capitalize;
	line-height: 1.2;
}

/* Plazas disponibles */
.mt-pax-badge {
	font-size: 11px;
	font-weight: 700;
	padding: 2px 7px;
	border-radius: 12px;
	white-space: nowrap;
	display: inline-flex;
	align-items: center;
	gap: 4px;
}
.mt-pax-badge.is-plenty {
	background: #ecfdf5;
	color: #047857;
	border: 1px solid #a7f3d0;
}
.mt-pax-badge.is-warning {
	background: #fffbeb;
	color: #b45309;
	border: 1px solid #fde68a;
}
.mt-pax-badge.is-urgent {
	background: #fef2f2;
	color: #b91c1c;
	border: 1px solid #fecaca;
	animation: mtPulseFast 1.5s infinite;
}

/* Fila de Turnos con Horario e Idioma */
.mt-day-slots-row {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin-top: 2px;
}

.mt-day-slot-pill {
	background: #f1f5f9;
	border: 1px solid #e2e8f0;
	border-radius: 6px;
	padding: 3px 8px;
	font-size: 12px;
	color: #334155;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-weight: 600;
	line-height: 1.2;
}

.mt-avail-day-card:hover .mt-day-slot-pill {
	background: #ffffff;
	border-color: #cbd5e1;
}

.mt-slot-pill-time {
	font-weight: 700;
	color: var(--mt-dark);
}

.mt-slot-pill-lang {
	font-size: 11.5px;
	color: #475569;
}

/* Botón de Acción a la derecha */
.mt-day-action {
	flex-shrink: 0;
	display: flex;
	align-items: center;
}

.mt-day-action-btn {
	background: #f8fafc;
	border: 1px solid #cbd5e1;
	color: var(--mt-primary);
	font-size: 12.5px;
	font-weight: 700;
	padding: 7px 12px;
	border-radius: 20px;
	display: inline-flex;
	align-items: center;
	gap: 4px;
	transition: all 0.2s ease;
	white-space: nowrap;
}

.mt-avail-day-card:hover .mt-day-action-btn {
	background: var(--mt-primary);
	color: #ffffff;
	border-color: var(--mt-primary);
	box-shadow: 0 2px 6px rgba(217, 119, 6, 0.25);
}

.mt-action-arrow {
	font-size: 14px;
	line-height: 1;
	transition: transform 0.2s ease;
}

.mt-avail-day-card:hover .mt-action-arrow {
	transform: translateX(2px);
}

/* Estado Vacío de Mes */
.mt-cal-empty-month {
	background: #f8fafc;
	border: 1.5px dashed #cbd5e1;
	border-radius: var(--mt-radius);
	padding: 30px 20px;
	text-align: center;
	margin: 15px 0;
}

.mt-cal-empty-month .mt-empty-icon {
	font-size: 38px;
	margin-bottom: 10px;
}

.mt-cal-empty-month .mt-empty-title {
	font-size: 16px;
	font-weight: 700;
	color: var(--mt-dark);
	margin: 0 0 6px 0;
}

.mt-cal-empty-month .mt-empty-sub {
	font-size: 13.5px;
	color: var(--mt-text-muted);
	margin: 0 0 16px 0;
	line-height: 1.4;
}

.mt-btn-next-month-cta {
	background: var(--mt-primary);
	color: #ffffff;
	border: none;
	border-radius: 25px;
	padding: 10px 20px;
	font-size: 13.5px;
	font-weight: 700;
	cursor: pointer;
	box-shadow: 0 3px 8px rgba(217, 119, 6, 0.25);
	transition: all 0.2s ease;
}

.mt-btn-next-month-cta:hover {
	background: var(--mt-primary-hover);
	transform: translateY(-1px);
}

/* Selector de Horarios (Paso 2) */
.mt-slots-btn-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
	gap: 12px;
	margin: 20px 0;
}

.mt-slot-btn {
	background: #ffffff;
	border: 2px solid var(--mt-border);
	border-radius: var(--mt-radius-sm);
	padding: 10px 8px;
	text-align: center;
	cursor: pointer;
	transition: var(--mt-transition);
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.mt-slot-btn-top {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	flex-wrap: wrap;
}

.mt-slot-lang-badge {
	font-size: 11px;
	font-weight: 700;
	padding: 1px 5px;
	background: #f1f5f9;
	border: 1px solid #cbd5e1;
	border-radius: 4px;
	color: #334155;
	display: inline-flex;
	align-items: center;
	gap: 3px;
}

.mt-slot-btn strong {
	font-size: 15px;
	color: var(--mt-dark);
}

.mt-slot-btn small {
	font-size: 11px;
	color: #10b981;
	font-weight: 600;
}

.mt-slot-btn:hover {
	border-color: var(--mt-primary);
	background: #fffbeb;
	transform: translateY(-2px);
}

.mt-slot-btn.is-selected {
	border-color: var(--mt-primary);
	background: var(--mt-primary);
}

.mt-slot-btn.is-selected strong,
.mt-slot-btn.is-selected small {
	color: #ffffff;
}

.mt-slot-btn.is-selected .mt-slot-lang-badge {
	background: rgba(255, 255, 255, 0.25);
	color: #ffffff;
	border-color: rgba(255, 255, 255, 0.4);
}

/* Formulario de Reserva (Paso 3) */
.mt-booking-summary-banner {
	background: #f8fafc;
	border-left: 4px solid var(--mt-primary);
	padding: 10px 14px;
	border-radius: 4px;
	margin-bottom: 18px;
	font-size: 14px;
	color: var(--mt-dark);
}

.mt-form-group {
	margin-bottom: 16px;
}

.mt-form-group label {
	display: block;
	font-size: 13px;
	font-weight: 600;
	color: var(--mt-dark);
	margin-bottom: 6px;
}

.mt-input, .mt-select {
	width: 100%;
	padding: 10px 14px;
	border: 1px solid var(--mt-border);
	border-radius: var(--mt-radius-sm);
	font-size: 15px;
	color: var(--mt-dark);
	background: #fff;
	transition: border-color 0.2s;
	box-sizing: border-box;
}

#mt-booking-form .mt-input::placeholder {
	color: #94a3b8;
	opacity: 1;
}

#mt-booking-form #mt_pax {
	-webkit-appearance: none;
	appearance: none;
	padding-right: 40px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath fill='%2364748b' d='M0 1l6 6 6-6z'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 14px center;
	background-size: 12px 8px;
}

.mt-input:focus, .mt-select:focus {
	outline: none;
	border-color: var(--mt-primary);
	box-shadow: 0 0 0 3px rgba(217, 119, 6, 0.15);
}

/* Marco rojo para controles pendientes de interacción o erróneos */
.mt-input.mt-field-attention,
.mt-select.mt-field-attention {
	border-color: #ef4444 !important;
	box-shadow: 0 0 0 2px rgba(239, 68, 68, 0.15) !important;
}

.mt-input.mt-field-attention:focus,
.mt-select.mt-field-attention:focus {
	border-color: #dc2626 !important;
	box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.25) !important;
}

.mt-form-help {
	display: block;
	font-size: 12px;
	color: var(--mt-text-muted);
	margin-top: 4px;
}

.mt-form-checkbox label {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	font-size: 13px;
	font-weight: normal;
	color: var(--mt-text);
	cursor: pointer;
}

.mt-form-checkbox input {
	margin-top: 3px;
}

.mt-form-checkbox a {
	display: inline-block;
}

.mt-btn-submit {
	width: 100%;
	background: var(--mt-primary);
	color: #ffffff;
	border: none;
	padding: 14px 24px;
	font-size: 16px;
	font-weight: 700;
	border-radius: var(--mt-radius-sm);
	cursor: pointer;
	transition: var(--mt-transition);
	margin-top: 10px;
	box-shadow: 0 4px 12px rgba(217, 119, 6, 0.28);
}

.mt-btn-submit:hover:not(:disabled) {
	background: var(--mt-primary-hover);
	transform: translateY(-1px);
}

.mt-btn-submit:disabled {
	opacity: 0.7;
	cursor: not-allowed;
}

.mt-alert {
	padding: 12px;
	border-radius: var(--mt-radius-sm);
	margin-bottom: 14px;
	font-size: 13px;
}

.mt-alert.is-error {
	background: #fef2f2;
	color: #991b1b;
	border: 1px solid #fecaca;
}

/* Pantalla de Éxito (Paso 4) */
.mt-success-card {
	text-align: center;
	padding: 20px 10px;
}

.mt-success-icon {
	width: 60px;
	height: 60px;
	border-radius: 50%;
	background: #10b981;
	color: #ffffff;
	font-size: 32px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto 16px auto;
	box-shadow: 0 4px 14px rgba(16, 185, 129, 0.3);
}

.mt-success-title {
	font-size: 22px;
	color: var(--mt-dark);
	margin: 0 0 6px 0;
	font-weight: 700;
}

.mt-success-subtitle {
	font-size: 14px;
	color: var(--mt-text-muted);
	margin: 0 0 20px 0;
}

.mt-success-code-box {
	background: #f8fafc;
	border: 1.5px dashed #cbd5e1;
	border-radius: var(--mt-radius);
	padding: 16px;
	margin-bottom: 16px;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6px;
}

.mt-success-code-box span {
	font-size: 11px;
	color: var(--mt-text-muted);
	text-transform: uppercase;
	letter-spacing: 0.8px;
	font-weight: 600;
}

.mt-success-code-box strong {
	font-size: 28px;
	color: var(--mt-primary-hover);
	letter-spacing: 2px;
	font-family: monospace, -apple-system, sans-serif;
}

.mt-btn-copy-code {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	background: #ffffff;
	border: 1px solid #cbd5e1;
	color: #334155;
	padding: 6px 14px;
	border-radius: 20px;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
	box-shadow: 0 1px 2px rgba(0,0,0,0.05);
	transition: all 0.2s ease;
	margin-top: 2px;
}

.mt-btn-copy-code:hover, .mt-btn-copy-code:active {
	background: #f1f5f9;
	border-color: #94a3b8;
	transform: scale(1.02);
}

.mt-btn-copy-code.is-copied {
	background: #dcfce7;
	border-color: #86efac;
	color: #166534;
}

.mt-success-email-banner {
	padding: 12px 14px;
	border-radius: var(--mt-radius-sm);
	font-size: 13px;
	line-height: 1.5;
	text-align: left;
	margin-bottom: 16px;
}

.mt-success-email-banner.is-success {
	background: #ecfdf5;
	border-left: 4px solid #10b981;
	color: #065f46;
}

.mt-success-email-banner.is-warning {
	background: #fffbeb;
	border-left: 4px solid #f59e0b;
	color: #92400e;
}

.mt-mobile-screenshot-tip {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	background: #f1f5f9;
	border-radius: var(--mt-radius-sm);
	padding: 12px 14px;
	margin-bottom: 20px;
	text-align: left;
	font-size: 12px;
	color: #475569;
	line-height: 1.45;
}

.mt-mobile-screenshot-tip .mt-tip-icon {
	font-size: 20px;
	line-height: 1;
}

.mt-success-details {
	text-align: left;
	background: #fff;
	border: 1px solid var(--mt-border);
	border-radius: var(--mt-radius-sm);
	padding: 16px;
	margin-bottom: 20px;
	font-size: 14px;
	line-height: 1.6;
}

.mt-success-note {
	font-size: 13px;
	color: var(--mt-text-muted);
	margin: 0;
}

/* ==========================================================================
   Página Individual del Tour (Layout y Elementos Móviles)
   ========================================================================== */

/* Barra Flotante Inferior Móvil (Sticky Bottom Bar) */
.mt-itinerary-start-badge {
	text-decoration: none !important;
}

.mt-itinerary-start-badge:hover,
.mt-itinerary-start-badge:focus-visible {
	outline: 2px solid var(--mt-primary);
	outline-offset: 2px;
}

#mt-meeting-box {
	scroll-margin-top: 160px;
}

.mt-mobile-sticky-bar {
	display: none; /* Oculto en escritorio */
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	width: 100%;
	background: rgba(255, 255, 255, 0.96);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	border-top: 1px solid var(--mt-border);
	box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.08);
	z-index: 99999;
	transform: translateY(0);
	opacity: 1;
	transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.35s ease;
	padding: 10px 16px;
	padding-bottom: max(10px, env(safe-area-inset-bottom, 10px));
}

.mt-mobile-sticky-bar.is-hidden {
	transform: translateY(115%);
	opacity: 0;
	pointer-events: none;
}

.mt-mobile-sticky-inner {
	max-width: 600px;
	margin: 0 auto;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
}

.mt-mobile-sticky-info {
	display: flex;
	flex-direction: column;
	gap: 3px;
	min-width: 0;
}

.mt-sticky-badge-row {
	display: flex;
	align-items: center;
	gap: 6px;
}

.mt-sticky-badge {
	background: #137333;
	color: #ffffff;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	padding: 2px 8px;
	border-radius: 12px;
	letter-spacing: 0.3px;
	white-space: nowrap;
}

.mt-sticky-security {
	font-size: 11px;
	color: #15803d;
	font-weight: 600;
	white-space: nowrap;
}

.mt-sticky-note {
	font-size: 12px;
	color: var(--mt-text-muted);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.mt-btn-sticky-reserve {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	background: linear-gradient(135deg, var(--mt-primary) 0%, #b45309 100%);
	color: #ffffff !important;
	text-decoration: none !important;
	font-size: 14px;
	font-weight: 700;
	padding: 11px 18px;
	border-radius: 30px;
	white-space: nowrap;
	box-shadow: 0 4px 12px rgba(217, 119, 6, 0.35);
	transition: all 0.2s ease;
	flex-shrink: 0;
}

.mt-btn-sticky-reserve:active {
	transform: scale(0.97);
}

.mt-sticky-btn-arrow {
	font-size: 14px;
	transition: transform 0.2s ease;
}

.mt-btn-sticky-reserve:hover .mt-sticky-btn-arrow {
	transform: translateX(3px);
}

/* Pulso visual cuando se enfoca el widget tras el scroll */
@keyframes mtWidgetPulse {
	0% {
		box-shadow: 0 0 0 0 rgba(217, 119, 6, 0.5), var(--mt-shadow);
		transform: scale(1);
	}
	50% {
		box-shadow: 0 0 0 8px rgba(217, 119, 6, 0.2), var(--mt-shadow);
		transform: scale(1.01);
	}
	100% {
		box-shadow: 0 0 0 0 rgba(217, 119, 6, 0), var(--mt-shadow);
		transform: scale(1);
	}
}

.mt-widget-pulse {
	animation: mtWidgetPulse 1.2s ease-out;
}

/* Título principal del Tour */
.mt-tour-title,
.mt-tour-header .entry-title {
	font-size: 30px !important;
	font-weight: 800;
	color: var(--mt-dark);
	margin: 0 0 16px 0;
	line-height: 1.25 !important;
}

.mt-title-free-badge {
	color: #16a34a;
	font-weight: 800;
	font-size: 18px !important;
	white-space: nowrap;
}

/* Imagen destacada del Tour */
.mt-tour-featured-image {
	border-radius: var(--mt-radius);
	overflow: hidden;
	margin-bottom: 0 !important;
	box-shadow: var(--mt-shadow);
}

.mt-tour-featured-image img {
	width: 100%;
	height: auto;
	display: block;
}

/* Sección de Itinerario */
.mt-route-section {
	margin-bottom: 3px;
}

/* Separador Información del Tour */
.mt-tour-info-separator {
	margin: 25px 0 15px 0;
	padding-top: 15px;
	border-top: 1px solid var(--mt-border);
}

.mt-tour-info-separator h2 {
	font-size: 20px;
	font-weight: 700;
	color: var(--mt-dark);
	margin: 0;
}

/* Contenido Gutenberg insertado después del punto de encuentro. */
.mt-meeting-extra { margin-bottom: 25px; min-width: 0; }
.mt-meeting-extra img { max-width: 100%; height: auto; }

.mt-tour-sidebar-widget {
	position: sticky;
	top: var(--mt-booking-sticky-top, 30px);
}

/* Responsividad en pantallas <= 860px */
@media (max-width: 860px) {
	body.mt-mobile-reserve-visible #kt-scroll-up {
		bottom: calc(var(--mt-mobile-reserve-height, 80px) + 16px) !important;
	}

	.mt-tour-layout {
		display: flex !important;
		flex-direction: column !important;
		gap: 10px !important;
	}

	.mt-tour-main-content {
		display: contents !important;
	}

	.mt-tour-featured-image {
		order: 1 !important;
	}

	.mt-tour-sidebar-widget {
		position: static !important;
		order: 2 !important;
		margin-top: 0 !important;
		margin-bottom: 10px !important;
	}

	.mt-tour-info-separator {
		order: 3 !important;
		margin-top: 5px !important;
	}

	.mt-route-section {
		order: 4 !important;
	}

	.mt-specs-card {
		order: 5 !important;
	}

	.mt-meeting-box {
		order: 6 !important;
	}
	.mt-meeting-extra {
		order: 7 !important;
		width: 100%;
	}

	.mt-mobile-sticky-bar {
		display: block;
	}

	/* Espacio inferior extra para no tapar el pie de página con la barra flotante */
	.mt-single-tour-container {
		padding-bottom: 80px !important;
	}
}

/* Optimización táctil para móviles estrechos (<= 480px) */
@media (max-width: 480px) {
	.mt-tour-card-body {
		padding: 16px;
	}

	.mt-card-badge-free {
		top: auto;
		bottom: 14px;
	}

	.mt-tour-title,
	.mt-tour-header .entry-title {
		font-size: 24px !important;
		line-height: 1.25 !important;
	}

	.mt-booking-widget-wrapper {
		padding: 14px 10px !important;
		border-radius: 8px;
		margin: 0 0 0 0;
	}

	.mt-steps-bar {
		margin-bottom: 16px;
	}

	.mt-step-pill {
		font-size: 11.5px;
		padding: 4px 6px;
	}

	.mt-avail-day-card {
		padding: 10px 10px;
		gap: 10px;
	}

	.mt-day-badge {
		min-width: 46px;
		padding: 4px 6px;
	}

	.mt-day-badge-num {
		font-size: 19px;
	}

	.mt-day-title {
		font-size: 13px;
	}

	.mt-day-slot-pill {
		font-size: 11px;
		padding: 2px 6px;
	}

	.mt-day-action-btn {
		font-size: 11.5px;
		padding: 5px 8px;
	}
}