/*
Theme Name: Inti Paradise
Theme URI: https://intiparadise.com/
Author: Inti Paradise
Description: Theme Full Site Editing (FSE) de lujo editorial andino para descubrir y reservar experiencias en Perú con WP Travel Engine y compatibilidad nativa con WPML.
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 7.4
Version: 3.33.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: inti-paradise
Domain Path: /languages
Tags: full-site-editing, block-patterns, block-styles, custom-logo, custom-menu, featured-images, wide-blocks, translation-ready
*/

/* ==========================================================================
   1. INTI PARADISE DESIGN SYSTEM TOKENS & BACKWARD-COMPATIBLE ALIASES
   ========================================================================== */
:root {
	/* Brand & Semantic Color Tokens */
	--inti-color-background: #F7F3EC;
	--inti-color-surface: #FFFFFF;
	--inti-color-foreground: #3F3F3F;
	--inti-color-muted: #F7F3EC;
	--inti-color-muted-foreground: #6B6B6B;
	--inti-color-primary: #C23917;
	--inti-color-primary-hover: #A83012;
	--inti-color-primary-foreground: #FFFFFF;
	--inti-color-accent: #EFA118;
	--inti-color-accent-foreground: #3F3F3F;
	--inti-color-border: #EFEBE4;
	--inti-color-success: #A5CD63;
	--inti-color-success-foreground: #FFFFFF;
	--inti-color-info: #1C97C9;
	--inti-color-info-foreground: #FFFFFF;
	--inti-color-danger: #DF465E;
	--inti-color-danger-foreground: #FFFFFF;
	--inti-color-warning: #EFA118;
	--inti-color-warning-foreground: #3F3F3F;
	--inti-color-neutral: #AE8CB4;
	--inti-color-neutral-foreground: #FFFFFF;

	/* Backward-Compatible Legacy Slug Aliases */
	--wp--preset--color--paper: var(--wp--preset--color--background, #F7F3EC);
	--wp--preset--color--white: var(--wp--preset--color--surface, #FFFFFF);
	--wp--preset--color--forest: var(--wp--preset--color--foreground, #3F3F3F);
	--wp--preset--color--ink: var(--wp--preset--color--foreground, #3F3F3F);
	--wp--preset--color--coral: var(--wp--preset--color--primary, #C23917);
	--wp--preset--color--sun: var(--wp--preset--color--accent, #EFA118);
	--wp--preset--color--leaf: var(--wp--preset--color--success, #A5CD63);
	--wp--preset--color--lagoon: var(--wp--preset--color--info, #1C97C9);

	/* Typography Tokens */
	--inti-font-sans: var(--wp--preset--font-family--sans, Inter, system-ui, -apple-system, sans-serif);
	--inti-font-serif: var(--wp--preset--font-family--serif, 'Playfair Display', Georgia, serif);

	/* Radius Tokens */
	--inti-radius-none: 0px;
	--inti-radius-sm: 0.25rem;
	--inti-radius-md: 0.5rem;
	--inti-radius-lg: 0.75rem;
	--inti-radius-xl: 1rem;       /* 16px - Standard Controls & Badges */
	--inti-radius-2xl: 1.25rem;   /* 20px */
	--inti-radius-3xl: 1.5rem;    /* 24px - Standard Cards & Search Matrix */
	--inti-radius-4xl: 2.5rem;    /* 40px - Hero / Feature Containers */
	--inti-radius-full: 9999px;

	/* Elevation / Shadow Tokens */
	--inti-shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, 0.06), 0 1px 2px 0 rgba(0, 0, 0, 0.04);
	--inti-shadow-md: 0 4px 12px 0 rgba(0, 0, 0, 0.08);
	--inti-shadow-lg: 0 10px 25px -5px rgba(0, 0, 0, 0.1);
	--inti-shadow-xl: 0 20px 30px -10px rgba(0, 0, 0, 0.12);
	--inti-shadow: var(--inti-shadow-lg);

	/* Sizing & Motion */
	--inti-control-height: 48px;
	--inti-tap-target: 44px;
	--inti-transition-fast: all 200ms ease-in-out;
	--inti-transition-panel: all 300ms ease-out;

	/* WP Travel Engine Global CSS Variable Overrides */
	--wte-primary-color: #C23917;
	--primary-color: #C23917;
	--primary-color-rgb: 194, 57, 23;
	--secondary-color: #EFA118;
	--secondary-color-rgb: 239, 161, 24;
	--fc-primary-color: #C23917;
}

/* Legacy Utility Class Compatibility */
.has-paper-background-color { background-color: var(--inti-color-background) !important; }
.has-white-background-color { background-color: var(--inti-color-surface) !important; }
.has-forest-background-color { background-color: var(--inti-color-foreground) !important; }
.has-coral-background-color { background-color: var(--inti-color-primary) !important; }
.has-sun-background-color { background-color: var(--inti-color-accent) !important; }
.has-leaf-background-color { background-color: var(--inti-color-success) !important; }

.has-paper-color { color: var(--inti-color-background) !important; }
.has-white-color { color: var(--inti-color-surface) !important; }
.has-forest-color { color: var(--inti-color-foreground) !important; }
.has-coral-color { color: var(--inti-color-primary) !important; }
.has-sun-color { color: var(--inti-color-accent) !important; }
.has-leaf-color { color: var(--inti-color-success) !important; }
.has-muted-color { color: var(--inti-color-muted-foreground) !important; }

/* ==========================================================================
   2. BASE & ACCESSIBILITY (TOUCH & FOCUS-VISIBLE FIRST)
   ========================================================================== */
html {
	scroll-behavior: smooth;
}

body {
	background-color: var(--inti-color-background);
	color: var(--inti-color-foreground);
	font-family: var(--inti-font-sans);
	line-height: 1.5;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

a {
	text-underline-offset: 0.2em;
	transition: var(--inti-transition-fast);
}

/* Explicit focus ring per Design System: focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2 */
:focus-visible,
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
.wp-element-button:focus-visible {
	outline: 2px solid var(--inti-color-primary) !important;
	outline-offset: 2px !important;
	box-shadow: 0 0 0 4px rgba(194, 57, 23, 0.18);
}

/* Disabled State */
[disabled],
.is-disabled,
button:disabled,
input:disabled,
select:disabled {
	opacity: 0.4 !important;
	cursor: not-allowed !important;
	pointer-events: none;
}

/* ==========================================================================
   3. BUTTONS, CONTROLS & FORM ELEMENTS (48px height, rounded-xl 16px)
   ========================================================================== */
.wp-block-button__link,
.wp-element-button,
.inti-btn,
button[type="submit"],
input[type="submit"] {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	min-height: var(--inti-control-height);
	min-width: var(--inti-tap-target);
	padding: 0.75rem 1.5rem;
	border-radius: var(--inti-radius-xl) !important;
	font-family: var(--inti-font-sans);
	font-size: 1rem;
	font-weight: 600;
	line-height: 1.5;
	text-decoration: none !important;
	cursor: pointer;
	transition: var(--inti-transition-fast);
	border: 1px solid transparent;
	box-shadow: var(--inti-shadow-sm);
}

.wp-block-button__link:hover,
.wp-element-button:hover,
.inti-btn:hover,
button[type="submit"]:hover,
input[type="submit"]:hover {
	transform: translateY(-2px);
	box-shadow: var(--inti-shadow-md);
	filter: brightness(0.95);
}

.wp-block-button__link:active,
.wp-element-button:active,
.inti-btn:active,
button[type="submit"]:active,
input[type="submit"]:active {
	transform: scale(0.95);
}

/* Button Variants */
.wp-block-button.is-style-outline .wp-block-button__link,
.inti-btn--outline {
	background-color: transparent !important;
	border: 2px solid currentColor !important;
	box-shadow: none;
}

.wp-block-button.is-style-outline .wp-block-button__link:hover,
.inti-btn--outline:hover {
	background-color: rgba(255, 255, 255, 0.14) !important;
}

.wp-block-button.is-style-secondary .wp-block-button__link,
.inti-btn--secondary {
	background-color: var(--inti-color-accent) !important;
	color: var(--inti-color-accent-foreground) !important;
}

.wp-block-button.is-style-soft .wp-block-button__link,
.inti-btn--soft {
	background-color: var(--inti-color-background) !important;
	color: var(--inti-color-primary) !important;
	border: 1px solid var(--inti-color-border) !important;
	box-shadow: none;
}

.wp-block-button.is-style-ghost .wp-block-button__link,
.inti-btn--ghost {
	background-color: transparent !important;
	color: var(--inti-color-foreground) !important;
	box-shadow: none;
}

.wp-block-button.is-style-ghost .wp-block-button__link:hover,
.inti-btn--ghost:hover {
	background-color: var(--inti-color-muted) !important;
}

/* Standard Form Inputs, Dropdowns, Textareas */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="number"],
input[type="date"],
input[type="search"],
input[type="url"],
input[type="password"],
select,
textarea,
.inti-input {
	min-height: var(--inti-control-height);
	padding: 0.75rem 1rem;
	background-color: var(--inti-color-surface);
	color: var(--inti-color-foreground);
	border: 1px solid var(--inti-color-border);
	border-radius: var(--inti-radius-xl);
	font-family: var(--inti-font-sans);
	font-size: 1rem;
	line-height: 1.5;
	transition: var(--inti-transition-fast);
}

input[type="text"]:hover,
input[type="email"]:hover,
input[type="tel"]:hover,
input[type="number"]:hover,
input[type="date"]:hover,
input[type="search"]:hover,
select:hover,
textarea:hover {
	border-color: var(--inti-color-muted-foreground);
}

input::placeholder,
textarea::placeholder {
	color: var(--inti-color-muted-foreground);
}

/* ==========================================================================
   4. TYPOGRAPHY, BADGES & EDITORIAL SURFACES
   ========================================================================== */
.inti-eyebrow,
.inti-badge {
	display: inline-flex;
	align-items: center;
	gap: 0.375rem;
	font-family: var(--inti-font-sans);
	font-size: 0.75rem !important;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	line-height: 1.2;
}

.inti-badge {
	padding: 0.375rem 0.875rem;
	border-radius: var(--inti-radius-xl);
	background-color: var(--inti-color-primary);
	color: var(--inti-color-primary-foreground);
}

.inti-badge--accent,
.inti-badge--warning {
	background-color: var(--inti-color-accent);
	color: var(--inti-color-accent-foreground);
}

.inti-badge--success {
	background-color: var(--inti-color-success);
	color: var(--inti-color-success-foreground);
}

.inti-badge--info {
	background-color: var(--inti-color-info);
	color: var(--inti-color-info-foreground);
}

.inti-badge--danger {
	background-color: var(--inti-color-danger);
	color: var(--inti-color-danger-foreground);
}

.inti-badge--neutral {
	background-color: var(--inti-color-neutral);
	color: var(--inti-color-neutral-foreground);
}

/* Cards & Editorial Containers */
.inti-card {
	background-color: var(--inti-color-surface);
	border: 1px solid var(--inti-color-border);
	border-radius: var(--inti-radius-3xl);
	box-shadow: var(--inti-shadow-md);
	padding: 2.5rem;
	transition: var(--inti-transition-fast);
}

.inti-card:hover {
	box-shadow: var(--inti-shadow-lg);
}

.inti-card--hero {
	border-radius: var(--inti-radius-4xl);
}

/* ==========================================================================
   5. HEADER & MEGA MENU: estilos en src/input.css (Tailwind CSS) -> assets/css/tailwind.css
   ========================================================================== */

/* ==========================================================================
   6. HERO, FLOATING SEARCH MATRIX & DESTINATION CARDS
   ========================================================================== */
.inti-hero {
	position: relative;
	min-height: min(780px, 85vh) !important;
	background-color: var(--inti-color-foreground);
}

.inti-hero .wp-block-cover__image-background {
	object-position: center 48%;
}

.inti-hero .wp-block-cover__inner-container {
	width: min(100% - 48px, 1320px);
}

.inti-hero-copy {
	max-width: 740px;
	padding-top: 128px;
	padding-bottom: 96px;
}

.inti-hero h1 {
	max-width: 720px;
	text-wrap: balance;
	font-family: var(--inti-font-serif);
	line-height: 1.15;
}

.inti-hero-accent {
	color: var(--inti-color-accent);
	font-style: italic;
}

.inti-hero-location {
	position: absolute;
	right: max(24px, calc((100vw - 1320px) / 2));
	bottom: 36px;
	width: auto;
	padding: 0.5rem 1rem;
	border-radius: var(--inti-radius-full);
	background: rgba(63, 63, 63, 0.78);
	backdrop-filter: blur(8px);
	border: 1px solid rgba(255, 255, 255, 0.2);
	color: var(--inti-color-surface);
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.inti-search-band {
	position: relative;
	z-index: 10;
	margin-top: -64px;
	padding: 0 24px;
}

.inti-search-band > .wp-block-group {
	background-color: var(--inti-color-surface) !important;
	border: 1px solid var(--inti-color-border);
	border-radius: var(--inti-radius-3xl) !important;
	box-shadow: var(--inti-shadow-lg);
}

.inti-destination-card {
	min-height: 380px;
	overflow: hidden;
	border-radius: var(--inti-radius-3xl) !important;
	box-shadow: var(--inti-shadow-md);
	transition: var(--inti-transition-fast);
}

.inti-destination-card:hover {
	transform: translateY(-4px);
	box-shadow: var(--inti-shadow-xl);
}

.inti-destination-card .wp-block-cover__image-background {
	transition: transform 500ms ease-out;
}

.inti-destination-card:hover .wp-block-cover__image-background {
	transform: scale(1.05);
}

/* ==========================================================================
   7. WP TRAVEL ENGINE BLOCKS & TEMPLATES (FSE COMPATIBILITY)
   ========================================================================== */
.wp-block-wptravelengine-trip-search,
.wp-block-wptravelengine-trips,
.wp-block-wptravelengine-destinations,
.wp-block-wptravelengine-activities,
.wp-block-wptravelengine-trip-types,
.wp-block-wptravelenginepagesblocks-archive-trip,
.wp-block-wptravelenginepagesblocks-taxonomy,
.wp-block-wptravelenginepagesblocks-trip-search,
.wp-block-wptravelenginepagesblocks-trip-checkout,
[class*="wp-block-wptravelenginetripblocks-"] {
	--primary-color: var(--inti-color-primary);
	--primary-color-rgb: 194, 57, 23;
	--secondary-color: var(--inti-color-accent);
	--secondary-color-rgb: 239, 161, 24;
	font-family: var(--inti-font-sans);
}

/* Search Form Controls inside WP Travel Engine */
.wpte-trip-search-fields,
.wpte-search-form-wrapper {
	gap: 1rem;
}

.wpte-trip-search-fields select,
.wpte-trip-search-fields input,
.wpte-trip-search-fields .wpte-trip__search-field {
	border-radius: var(--inti-radius-xl) !important;
	border-color: var(--inti-color-border) !important;
}

.wpte-trip-search-fields input[type="submit"],
.wpte-trip-search-fields button[type="submit"],
.wpte-trip__search-submit {
	min-height: var(--inti-control-height) !important;
	border-radius: var(--inti-radius-xl) !important;
	background-color: var(--inti-color-primary) !important;
	color: var(--inti-color-primary-foreground) !important;
	font-weight: 600 !important;
	padding: 0.75rem 1.75rem !important;
	transition: var(--inti-transition-fast) !important;
}

.wpte-trip-search-fields input[type="submit"]:hover,
.wpte-trip-search-fields button[type="submit"]:hover,
.wpte-trip__search-submit:hover {
	background-color: var(--inti-color-primary-hover) !important;
	transform: translateY(-2px);
	box-shadow: var(--inti-shadow-md);
}

/* Trip Listing Cards */
.wpte-trip-list-wrapper {
	gap: 2rem;
}

.wpte-trip-list-wrapper .wpte-trip-single,
.category-trips-single,
.wpte-card {
	background-color: var(--inti-color-surface) !important;
	border: 1px solid var(--inti-color-border) !important;
	border-radius: var(--inti-radius-3xl) !important;
	box-shadow: var(--inti-shadow-md) !important;
	overflow: hidden;
	transition: var(--inti-transition-fast);
}

.wpte-trip-list-wrapper .wpte-trip-single:hover,
.category-trips-single:hover,
.wpte-card:hover {
	transform: translateY(-4px);
	box-shadow: var(--inti-shadow-xl) !important;
}

.category-trips-single .category-feat-ribbon,
.wpte-trip-single .wpte-badge,
.wpte-bf-discount-tag {
	border-radius: var(--inti-radius-xl) !important;
	font-family: var(--inti-font-sans) !important;
	font-size: 0.75rem !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.08em !important;
}

.category-trips-single .category-trip-title,
.wpte-trip-single .wpte-trip-title,
.wpte-gblock-title-wrap .wpte-gblock-title {
	font-family: var(--inti-font-serif) !important;
	color: var(--inti-color-foreground) !important;
	font-weight: 700 !important;
	line-height: 1.25 !important;
}

/* Single Trip Components: TourFeatureBar, Itinerary, InclusionMatrix, BookingSidebarWidget */
.inti-tour-feature-bar {
	background-color: var(--inti-color-surface);
	border: 1px solid var(--inti-color-border);
	border-radius: var(--inti-radius-3xl);
	box-shadow: var(--inti-shadow-sm);
	padding: 1.5rem 2rem;
}

.inti-single-trip-card,
.inti-inclusion-matrix {
	background-color: var(--inti-color-surface);
	border: 1px solid var(--inti-color-border);
	border-radius: var(--inti-radius-3xl);
	box-shadow: var(--inti-shadow-sm);
	padding: 2rem;
}

/* Itinerary Numbers in Playfair Display Serif per Design System */
.wp-block-wptravelenginetripblocks-itinerary .itinerary-row {
	border-bottom: 1px solid var(--inti-color-border) !important;
	padding-bottom: 1.25rem;
	margin-bottom: 1.25rem !important;
	transition: var(--inti-transition-panel);
}

.wp-block-wptravelenginetripblocks-itinerary .wte-itinerary-head-wrap .title {
	font-family: var(--inti-font-serif) !important;
	font-weight: 700 !important;
	color: var(--inti-color-primary) !important;
}

.wp-block-wptravelenginetripblocks-itinerary .wte-itinerary-head-wrap .itinerary-title {
	font-family: var(--inti-font-serif) !important;
	font-weight: 600 !important;
	color: var(--inti-color-foreground) !important;
}

/* Booking Sidebar Widget (Sticky) */
.inti-booking-sidebar {
	position: sticky;
	top: 100px;
}

.inti-booking-sidebar .wp-block-wptravelenginetripblocks-booking,
.wpte-bf-outer {
	background-color: var(--inti-color-surface) !important;
	border: 1px solid var(--inti-color-border) !important;
	border-radius: var(--inti-radius-3xl) !important;
	box-shadow: var(--inti-shadow-lg) !important;
	padding: 2rem !important;
}

.wpte-bf-btn,
.wte-book-now-btn {
	min-height: var(--inti-control-height) !important;
	border-radius: var(--inti-radius-xl) !important;
	background-color: var(--inti-color-primary) !important;
	color: var(--inti-color-primary-foreground) !important;
	font-family: var(--inti-font-sans) !important;
	font-weight: 600 !important;
	transition: var(--inti-transition-fast) !important;
}

.wpte-bf-btn:hover,
.wte-book-now-btn:hover {
	background-color: var(--inti-color-primary-hover) !important;
	transform: translateY(-2px);
	box-shadow: var(--inti-shadow-md);
}

/* Floating Bottom Conversion Bar for Detail Pages (Mobile/Tablet) */
.inti-floating-booking-bar {
	display: none;
	position: fixed;
	bottom: 1rem;
	left: 1rem;
	right: 1rem;
	z-index: 45;
	background-color: var(--inti-color-surface);
	border: 1px solid var(--inti-color-border);
	border-radius: var(--inti-radius-3xl);
	box-shadow: var(--inti-shadow-lg);
	padding: 0.875rem 1.25rem;
}

/* TrustScoreBadges */
.inti-trust-badges {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 1.5rem;
}

.inti-trust-badge-card {
	background-color: var(--inti-color-surface);
	border: 1px solid var(--inti-color-border);
	border-radius: var(--inti-radius-3xl);
	padding: 1.5rem;
	box-shadow: var(--inti-shadow-sm);
}

/* ==========================================================================
   8. FOOTER
   ========================================================================== */
.inti-site-footer {
	background-color: var(--inti-color-foreground) !important;
	color: var(--inti-color-surface) !important;
}

.inti-site-footer a {
	color: inherit;
	transition: var(--inti-transition-fast);
}

.inti-site-footer a:hover {
	color: var(--inti-color-accent) !important;
}

.inti-site-footer .wp-block-navigation a {
	text-decoration: none;
	min-height: 36px;
	display: inline-flex;
	align-items: center;
}

/* ==========================================================================
   9. RESPONSIVE BREAKPOINTS & REDUCED MOTION
   ========================================================================== */
@media (max-width: 960px) {
	.inti-floating-booking-bar {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 1rem;
	}
}

@media (max-width: 781px) {
	.inti-hero {
		min-height: 620px !important;
	}

	.inti-hero .wp-block-cover__inner-container {
		width: calc(100% - 32px);
	}

	.inti-hero-copy {
		padding-top: 96px;
		padding-bottom: 96px;
	}

	.inti-hero-location {
		right: 16px;
		bottom: 18px;
	}

	.inti-search-band {
		margin-top: -36px;
		padding: 0 16px;
	}

	.inti-card,
	.inti-single-trip-card,
	.inti-inclusion-matrix {
		padding: 1.5rem !important;
	}

	.inti-destination-card {
		min-height: 300px;
	}
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	*,
	*::before,
	*::after {
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
	}
}