/*
Theme Name: Astra Two Child
Theme URI: https://wordpress.org/themes/astra/
Author: the WordPress team
Author URI: https://wordpress.org/
Template: astra
Description: Child Theme of Astra
Version: 1.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: black, blue, gray, pink, purple, white, yellow, dark, light, two-columns, left-sidebar, fixed-layout, responsive-layout, accessibility-ready, custom-background, custom-colors, custom-header, custom-menu, editor-style, featured-images, microformats, post-formats, rtl-language-support, sticky-post, threaded-comments, translation-ready
Text Domain: astra-child
This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/

/* Flecha de los desplegables del menú.
   Es un botón y hereda el borde de 10 px de los botones globales; Astra lo deja
   punteado y lo hace visible al tocarla. Se mantiene transparente, y el indicador
   de foco solo aparece al navegar con teclado (issue #9). */
.ast-menu-toggle,
.ast-menu-toggle:focus,
.ast-menu-toggle:hover {
	border-color: transparent;
}

.ast-menu-toggle:focus:not(:focus-visible) {
	outline: none;
}

/* Aviso de Amelia sin eventos.
   El CSS adicional lo oculta en todo el sitio (.am-ev-empty); dentro de las ventanas de
   reserva se muestra, con el texto del fragmento de WPCode (docs/wpcode/aviso-sin-fechas.js),
   para que no queden vacías. En las listas dentro de la página sigue oculto (issue #4). */
html body .am-dialog-popup .am-ev-empty {
	display: flex !important;
	flex-direction: column;
	align-items: center;
	gap: 24px;
	padding: 40px 24px !important;
	text-align: center;
}

html body .am-dialog-popup .am-ev-empty .am-icon-search-close {
	display: none !important;
}

html body .am-dialog-popup .am-ev-empty p {
	margin: 0;
	font-family: 'Montserrat', sans-serif !important;
	font-size: 18px !important;
	line-height: 1.6 !important;
	color: var(--ast-global-color-2) !important;
}

/* Mismo estilo que los botones del sitio (por ejemplo, «Ver todas las actividades» en la portada). */
html body .am-dialog-popup .am-ev-empty .caneo-aviso-boton {
	display: inline-block !important;
	padding: 12.8px 25.6px !important;
	font-family: 'Montserrat', sans-serif !important;
	font-size: 16px !important;
	font-weight: 600 !important;
	line-height: 1 !important;
	color: #fff !important;
	background: var(--ast-global-color-0);
	border-radius: 0;
	text-decoration: none !important;
	transition: background-color 0.2s;
}

html body .am-dialog-popup .am-ev-empty .caneo-aviso-boton:hover,
html body .am-dialog-popup .am-ev-empty .caneo-aviso-boton:focus-visible {
	background: var(--ast-global-color-1);
}

/* Tarjetas de los carruseles (Spectra).
   El carrusel alinea las tarjetas por arriba y cada una mide según su contenido, así que
   la foto y el nombre de las reseñas, o el precio y el botón, quedan a distinta altura.
   Todas las tarjetas visibles miden lo mismo y el último elemento baja al fondo, salvo que
   sea el único: entonces el contenido queda arriba. Si la tarjeta termina en un botón, baja
   el bloque anterior (el precio) y el botón queda pegado debajo (issue #33).
   Spectra fija la alineación de cada carrusel con su propia clase (.uagb-block-…), por eso
   el selector incluye .uagb-slider-container y .uagb-slides. Solo se estiran los carruseles
   cuyas tarjetas tienen texto; los de solo fotos conservan su alineación (issue #3). */
.wp-block-uagb-slider.uagb-slider-container .uagb-slides .swiper-wrapper:has(.swiper-content :is(h1, h2, h3, h4, h5, h6, p, li, a, button)) {
	align-items: stretch;
}

.wp-block-uagb-slider.uagb-slider-container .uagb-slides .swiper-slide {
	display: flex;
	height: auto;
}

.wp-block-uagb-slider.uagb-slider-container .uagb-slides .swiper-content {
	display: flex;
	flex: 1;
}

.wp-block-uagb-slider.uagb-slider-container .uagb-slides .swiper-content > .wp-block-uagb-container {
	flex: 1;
}

.wp-block-uagb-slider.uagb-slider-container .uagb-slides .swiper-content > .wp-block-uagb-container > :last-child:not(:first-child):not(.wp-block-uagb-buttons),
.wp-block-uagb-slider.uagb-slider-container .uagb-slides .swiper-content > .wp-block-uagb-container > :not(:first-child):has(+ .wp-block-uagb-buttons:last-child) {
	margin-top: auto;
}

/* Tarjetas de carrusel sin texto (p. ej. galería de Viña del Mar).
   Usan la misma tarjeta que las de foto y texto: fondo blanco, altura mínima pensada para el
   texto y solo las esquinas de arriba redondeadas, así que bajo la foto quedaba una franja
   blanca. Si la tarjeta no tiene texto, se ve solo la foto con las cuatro esquinas
   redondeadas (12 px, como las de arriba). Con texto, nada cambia. Las tarjetas cuya foto es
   el fondo de la propia tarjeta (sin bloque interior) conservan su altura (issue #3). */
.wp-block-uagb-slider.uagb-slider-container .uagb-slides .swiper-content > .wp-block-uagb-container:not(:has(h1, h2, h3, h4, h5, h6, p, li, a, button)):has(.wp-block-uagb-container) {
	min-height: 0;
	background: transparent;
}

.wp-block-uagb-slider.uagb-slider-container .uagb-slides .swiper-content > .wp-block-uagb-container:not(:has(h1, h2, h3, h4, h5, h6, p, li, a, button)) .wp-block-uagb-container {
	border-radius: 12px;
}

/* Tarjetas de un solo bloque con foto arriba (p. ej. Puerto Madryn, Costa Rica, Advanced).
   En tablet vertical Spectra les agrega relleno (20 px del carrusel y 25 px de la tarjeta) y
   la foto queda separada del borde; en escritorio va de borde a borde. Se iguala a escritorio
   (issue #33). */
@media (min-width: 767px) and (max-width: 976px) {
	.wp-block-uagb-slider.uagb-slider-container .uagb-slides .swiper-content:has(> .wp-block-uagb-container > .wp-block-uagb-container:only-child),
	.wp-block-uagb-slider.uagb-slider-container .uagb-slides .swiper-content > .wp-block-uagb-container > .wp-block-uagb-container:only-child {
		padding: 0;
	}
}

/* Flechas de los carruseles.
   Promociones las tiene 40 px por fuera del carrusel: en escritorio caben en el margen,
   pero en tablet se salen de la pantalla, quedan cortadas y la página se desplaza hacia el
   costado. Bajo 1280 px de ancho se ubican dentro del carrusel (issue #33). */
@media (max-width: 1279px) {
	.wp-block-uagb-slider.uagb-slider-container .swiper-button-prev {
		left: 0;
	}

	.wp-block-uagb-slider.uagb-slider-container .swiper-button-next {
		right: 0;
	}
}

/* Portada de Juan Fernández (ES) en tablet.
   Tiene una portada con video horizontal (solo escritorio) y otra con video vertical (solo
   móvil); Spectra oculta ambas en tablet (768–1024 px) y la página empezaba sin portada.
   En tablet vertical se muestra la del video vertical, a pantalla completa como en móvil y
   escritorio, y en horizontal la del video horizontal (issue #7). Si se reemplazan estas portadas, hay que actualizar las clases. */
@media (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) {
	html body .uagb-block-c48f1dff.uag-hide-tab {
		display: flex !important;
		min-height: 100vh;
	}
}

@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
	html body .uagb-block-fd9b4096.uag-hide-tab {
		display: flex !important;
	}
}

/* Bajo 1280 px el contenido de esa portada (máximo 1200 px) queda sin margen y el título
   pegado al borde izquierdo. Se completa hasta 40 px, como la portada de Chañaral: 40 px
   hasta 1200 px de ancho y luego menos, a medida que el contenido gana margen (issue #7). */
.uagb-block-fd9b4096 > .uagb-container-inner-blocks-wrap {
	padding-left: clamp(0px, 640px - 50vw, 40px);
	padding-right: clamp(0px, 640px - 50vw, 40px);
}

/* Bolsa de compras del encabezado en línea fina (functions.php). Blanca sobre el encabezado
   transparente y azul en el normal, como el menú; en tablet y celular mide lo mismo que el
   botón del menú (24 px). */
.caneo-icono-linea,
.caneo-icono-linea * {
	fill: none !important;
	stroke: currentColor;
	stroke-width: 1.6;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.site-header .caneo-icono-linea,
.site-header .caneo-icono-linea * {
	stroke: var(--ast-global-color-0);
}

.ast-theme-transparent-header .site-header .caneo-icono-linea,
.ast-theme-transparent-header .site-header .caneo-icono-linea * {
	stroke: var(--ast-global-color-5);
}

.site-header .ast-site-header-cart .caneo-icono-linea {
	width: 26px !important;
	height: 26px !important;
}

@media (max-width: 921px) {
	.site-header .ast-site-header-cart .caneo-icono-linea {
		width: 24px !important;
		height: 24px !important;
	}
}

/* El carrito de Astra usa una línea de 50 px y el ícono queda más arriba que el menú;
   se centra en la fila del encabezado. */
.site-header .ast-site-header-cart,
.site-header .ast-site-header-cart .ast-site-header-cart-li,
.site-header .ast-site-header-cart .cart-container,
.site-header .ast-site-header-cart .ast-addon-cart-wrap,
.site-header .ast-site-header-cart i.astra-icon,
.site-header .ast-site-header-cart .ast-icon.icon-bag {
	display: inline-flex;
	align-items: center;
	line-height: 1;
}

/* Botones del encabezado móvil, del menú y del carrito: sin contorno al tocarlos.
   En pantallas táctiles se quita siempre (Safari de iPhone marca el foco como si fuera de
   teclado). Con mouse se quita al hacer clic y se mantiene con teclado (:focus-visible). */
html body .menu-toggle:focus:not(:focus-visible),
html body .menu-toggle-close:focus:not(:focus-visible),
html body .ast-site-header-cart a:focus:not(:focus-visible),
html body .ast-site-header-cart-li:focus:not(:focus-visible),
html body .astra-cart-drawer-close:focus:not(:focus-visible) {
	outline: none !important;
	border-color: transparent !important;
	box-shadow: none !important;
}

@media (hover: none) and (pointer: coarse) {
	html body .menu-toggle,
	html body .menu-toggle:focus,
	html body .menu-toggle:active,
	html body .menu-toggle-close,
	html body .menu-toggle-close:focus,
	html body .menu-toggle-close:active,
	html body .ast-site-header-cart a,
	html body .ast-site-header-cart a:focus,
	html body .ast-site-header-cart-li:focus,
	html body .astra-cart-drawer-close,
	html body .astra-cart-drawer-close:focus {
		outline: none !important;
		border-color: transparent !important;
		box-shadow: none !important;
	}
}

html body .menu-toggle,
html body .menu-toggle-close,
html body .ast-site-header-cart,
html body .astra-cart-drawer-close {
	-webkit-tap-highlight-color: transparent;
}