/*
 * ETB Reservas — layout fixes for the site's own Elementor design on tablets
 * and small laptops (iPad portrait and landscape, 1024–1280 px screens), plus
 * the flag-only language choice in the header (8).
 * Loaded on every page only when the "site_fixes" setting is on, so it can be
 * switched off from WordPress at any time.
 */

/*
 * 1. Side margins. The sections are 1140 px wide with no side padding, so on
 * screens narrower than about 1180 px their content touches the screen edges.
 * Keep at least 20 px on each side.
 */
@media (min-width: 768px) {
	.elementor > .e-con-boxed > .e-con-inner {
		max-width: min(var(--content-width, 1140px), calc(100% - 40px));
	}
}

/*
 * Blocks placed side by side with fixed widths may get narrower instead of
 * pushing past the screen edge (e.g. /vehiculos-y-necesidades/ at 1440 px).
 */
.e-con > .e-con.e-child,
.e-con > .e-con-inner > .e-con.e-child {
	flex-shrink: 1 !important;
}

/*
 * 2. Header on screens from 1025 px (iPad landscape, laptops). Logo, menu and
 * the right-hand group did not fit side by side up to 1280 px, so the page
 * scrolled sideways and the logo was cut off on the left; on every desktop
 * width the word "Español" dropped below the language box.
 */
@media (min-width: 1025px) {
	.elementor-element.elementor-element-857ce98 {
		padding-right: 0 !important;
		width: 150px !important;
	}

	.elementor-element.elementor-element-cb5cadc,
	.elementor-element.elementor-element-947e677 {
		width: auto !important;
	}

	.elementor-element.elementor-element-0c842a8,
	.elementor-element.elementor-element-f2e5ad5 {
		flex: 1 1 auto !important;
		width: auto !important;
		min-width: 0 !important;
	}

	.elementor-element-f2e5ad5 .elementor-nav-menu--main .elementor-item {
		padding-left: 8px !important;
		padding-right: 8px !important;
	}

	/* The language selector is wider than the box it sits in. */
	.elementor-element.elementor-element-85e3315 {
		width: auto !important;
	}
}

@media (min-width: 768px) {
	/* 3. Footer bottom bar: copyright and "Políticas de Privacidad" wrap instead of overflowing. */
	.elementor-element.elementor-element-07f3a25 > .e-con-inner {
		flex-wrap: wrap !important;
		row-gap: 8px;
	}

	.elementor-element.elementor-element-0a5b89a,
	.elementor-element.elementor-element-e74cd94 {
		flex: 1 1 auto !important;
		width: auto !important;
		min-width: 0 !important;
	}
}

/*
 * 4. Footer columns on tablets: the logo takes its own line so the four link
 * columns get enough room (the email address no longer sticks out).
 */
@media (min-width: 768px) and (max-width: 1024px) {
	.elementor-element.elementor-element-d374dc7 > .e-con-inner {
		flex-wrap: wrap !important;
		row-gap: 24px;
	}

	.elementor-element.elementor-element-5e76a37 {
		flex: 0 0 100% !important;
	}

	.elementor-element.elementor-element-deea3f5,
	.elementor-element.elementor-element-00fb66f,
	.elementor-element.elementor-element-6ee7175,
	.elementor-element.elementor-element-2e3ceb8 {
		flex: 1 1 140px !important;
		min-width: 0 !important;
	}

	.elementor-element-d27e9ec .elementor-icon-list-text {
		overflow-wrap: anywhere;
	}
}

/*
 * 5. Phones: the 5-6 seat page title ("Monovolumen…", 48 px) was wider than
 * a 360 px screen, so that page scrolled sideways on small phones.
 */
@media (max-width: 420px) {
	.elementor-element-d328c19 .elementor-heading-title {
		font-size: 38px !important;
	}
}
/*
 * 6. Very small phones (320 px, e.g. first iPhone SE): page titles and the
 * line with the email address under the home form were wider than the screen.
 */
@media (max-width: 359px) {
	.elementor-widget-heading h1.elementor-heading-title {
		font-size: clamp(26px, 10vw, 48px) !important;
	}

	.elementor-widget-heading .elementor-heading-title {
		overflow-wrap: break-word;
	}

	.elementor-element-26edaa9 .elementor-heading-title {
		overflow-wrap: anywhere;
	}
}
/* 7. Home hero on tablets: the form card uses the full width, centred. */
@media (min-width: 768px) and (max-width: 1024px) {
	.elementor-element.elementor-element-8f6b0bb,
	.elementor-element.elementor-element-153d6a3 {
		width: 100% !important;
		max-width: 100% !important;
	}
}

/*
 * 8. Language choice in the header (desktop and phone header): flags only,
 * both always visible, Spanish first, the current one ringed in navy; one
 * click on the other flag switches. The language names stay in the page for
 * screen readers (font size 0, not hidden), and the Weglot settings, which
 * the live site shares, are not touched.
 */
.elementor-location-header .country-selector.weglot-dropdown {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 3px;
	border: 1px solid rgba(2, 1, 1, 0.1);
	border-radius: 999px;
	background: #fff;
}

.elementor-location-header .country-selector.weglot-dropdown > label.wg-en {
	order: 2;
}

.elementor-location-header .country-selector.weglot-dropdown .wgcurrent {
	border: 0;
}

.elementor-location-header .country-selector.weglot-dropdown .wgcurrent::after {
	display: none;
}

.elementor-location-header .country-selector.weglot-dropdown ul {
	display: flex !important;
	position: static;
	min-width: 0;
	border: 0;
	background: none;
}

.elementor-location-header .country-selector.weglot-dropdown li {
	width: auto;
}

.elementor-location-header .country-selector.weglot-dropdown a,
.elementor-location-header .country-selector.weglot-dropdown span.wglanguage-name {
	display: block;
	width: auto;
	height: auto;
	padding: 3px !important;
	border-radius: 50%;
	font-size: 0;
	line-height: 0;
	transition: background-color 0.15s ease;
}

.elementor-location-header .country-selector.weglot-dropdown .weglot-flags.flag-3 > a::before,
.elementor-location-header .country-selector.weglot-dropdown .weglot-flags.flag-3 > span::before {
	display: block;
	width: 28px !important;
	height: 28px !important;
	margin: 0 !important;
	border-radius: 50% !important;
	background-size: 28px 28px !important;
	box-shadow: 0 0 0 1px rgba(2, 1, 1, 0.12);
	transition: opacity 0.15s ease, transform 0.15s ease, filter 0.15s ease;
}

/* The language you are not on: softer until pointed at. */
.elementor-location-header .country-selector.weglot-dropdown li > a::before {
	opacity: 0.55;
	filter: saturate(0.6);
}

.elementor-location-header .country-selector.weglot-dropdown li > a:hover::before,
.elementor-location-header .country-selector.weglot-dropdown li > a:focus-visible::before {
	opacity: 1;
	filter: none;
	transform: scale(1.08);
}

.elementor-location-header .country-selector.weglot-dropdown li > a:focus-visible {
	outline: 2px solid #ffbf00;
	outline-offset: 1px;
}

/* The language you are on. */
.elementor-location-header .country-selector.weglot-dropdown .wgcurrent > span.wglanguage-name {
	background: #204a63; /* the logo's navy */
	cursor: default;
}