/*
 * mobile.css — Ajuste fino para celular. La mayoría de las compras entran por
 * móvil, así que este archivo se carga en todas las páginas y afina lo que las
 * hojas por sección no cubren: espaciados, tamaños de texto, áreas táctiles,
 * tablas que se vuelven tarjetas, barras fijas, etc.
 *
 * Mobile-first ya está en el resto del CSS; aquí solo van CORRECCIONES para
 * pantallas ≤ 768px y ≤ 480px.
 */

@media (max-width: 768px) {

	:root {
		/* Sección "2xl" de 6rem es demasiado en móvil */
		--espacio-2xl: 3.25rem;
		--espacio-xl: 2.5rem;
		--contenedor-padding: 1.1rem;
	}

	/* ─── Barra de anuncio + header ─── */
	.gn-anuncio p { font-size: .72rem; line-height: 1.35; }
	.gn-header__utilidades { height: 60px; }
	.gn-header__logo img { max-height: 30px; }
	.gn-header__icono, .gn-header__hamburguesa { width: 42px; height: 42px; } /* área táctil */

	/* ─── Hero / slider ─── */
	/* En móvil el alto del hero lo marca el contenido de la slide activa
	   (nada de min-height fijo que dejaba una franja verde vacía debajo). */
	.gn-home-hero__slides { height: auto; min-height: 0; }
	.gn-home-hero__slide { position: relative; }
	.gn-home-hero__slide:not(.gn-home-hero__slide--activo) { display: none; }
	.gn-home-hero__slide--activo { display: flex; }
	.gn-home-hero__overlay { position: relative; width: 100%; padding-block: 4rem 3.5rem; }
	.gn-home-hero__titulo { font-size: clamp(1.7rem, 8vw, 2.3rem); }
	.gn-home-hero__desc { font-size: 1rem; }
	.gn-home-hero__acciones { flex-direction: column; }
	.gn-home-hero__acciones .boton { width: 100%; padding: .95rem 1rem; }
	.gn-home-hero__dots { bottom: .6rem; }

	/* ─── Secciones genéricas ─── */
	.gn-seccion-titulo { font-size: clamp(1.4rem, 6vw, 1.9rem); }
	.gn-seccion-header { flex-direction: column; align-items: flex-start; gap: .3rem; }

	/* ─── Tienda ─── */
	.gn-tienda__header { text-align: left; }
	.gn-tienda h1, .gn-tienda__titulo { font-size: 1.6rem; }
	ul.products { grid-template-columns: repeat(2, 1fr) !important; gap: 1.1rem .7rem; }
	.gn-tarjeta-producto__nombre { font-size: .8rem; line-height: 1.25; }
	.gn-tarjeta-producto__precio { font-size: .95rem; }
	.gn-tabs-categorias { gap: 1rem; padding-bottom: .3rem; }
	.gn-tabs-categorias a { font-size: .74rem; }

	/* Toolbar de tienda: el filtro de precio va colapsado tras un botón */
	.gn-tienda__toolbar {
		flex-wrap: wrap;
		gap: .5rem;
		align-items: center;
	}
	.gn-tienda__toolbar .gn-tienda__conteo { order: 1; font-size: .8rem; flex: 1; }
	.gn-tienda__toolbar .woocommerce-ordering { order: 4; flex-basis: 100%; }
	.gn-tienda__toolbar .gn-filtro-precio {
		order: 3;
		flex-basis: 100%;
		max-width: none;
		display: none;               /* se muestra al tocar "Filtrar precio" (main.js) */
	}
	.gn-tienda__toolbar.gn-filtro-abierto .gn-filtro-precio { display: block; }
	.gn-filtro-precio-toggle {
		order: 2;
		background: none;
		border: 1px solid var(--color-borde);
		border-radius: var(--radio-full);
		padding: .35rem .9rem;
		font-size: .78rem;
		font-weight: 600;
		color: var(--color-secundario);
		cursor: pointer;
	}

	/* ─── Ficha de producto ─── */
	.woocommerce-tabs ul.tabs { flex-wrap: wrap; gap: .5rem; }
	.gn-ficha-envio-gratis, .gn-ficha-cod { font-size: .85rem; }

	/* Barra fija de compra en móvil (la crea main.js) */
	.gn-barra-movil {
		position: fixed;
		left: 0; right: 0; bottom: 0;
		z-index: 450;
		background: #fff;
		border-top: 1px solid var(--color-borde);
		box-shadow: 0 -4px 16px rgba(10,15,20,.1);
		padding: .6rem var(--contenedor-padding) calc(.6rem + env(safe-area-inset-bottom));
		display: flex;
		align-items: center;
		gap: .7rem;
		transform: translateY(120%);
		transition: transform .25s ease;
	}
	.gn-barra-movil.gn-visible { transform: translateY(0); }
	.gn-barra-movil__precio { font-weight: 800; color: var(--color-secundario); font-family: var(--fuente-titulos); }
	.gn-barra-movil__boton {
		flex: 1;
		background: var(--color-primario);
		color: #fff;
		border: none;
		border-radius: var(--radio-md);
		padding: .85rem 1rem;
		font-weight: 700;
		text-transform: uppercase;
		letter-spacing: .03em;
		font-size: .85rem;
	}

	/* El WhatsApp flotante sube cuando aparece la barra fija de compra */
	body:has(.gn-barra-movil.gn-visible) .gn-whatsapp-flotante { bottom: calc(64px + env(safe-area-inset-bottom)); }

	/* ─── Carrito ─── */
	.woocommerce-cart table.shop_table,
	.woocommerce-cart table.shop_table thead { border: none; }
	.woocommerce-cart table.shop_table thead { display: none; }
	.woocommerce-cart table.shop_table tr {
		display: block;
		border: 1px solid var(--color-borde);
		border-radius: var(--radio-md);
		padding: .8rem;
		margin-bottom: .8rem;
	}
	.woocommerce-cart table.shop_table td {
		display: flex;
		justify-content: space-between;
		align-items: center;
		border: none;
		padding: .35rem 0;
		text-align: right;
	}
	.woocommerce-cart table.shop_table td::before {
		content: attr(data-title);
		font-weight: 600;
		color: var(--color-texto-suave);
		font-size: .8rem;
		text-align: left;
	}
	.woocommerce-cart td.product-remove::before,
	.woocommerce-cart td.product-thumbnail::before { display: none; }
	.woocommerce-cart .cart-collaterals .cart_totals { width: 100%; }

	/* ─── Checkout (estilo Shopify, ver checkout.css) ─── */
	.woocommerce-checkout .form-row-first,
	.woocommerce-checkout .form-row-last { width: 100%; float: none; margin-right: 0; }
	#place_order { width: 100%; padding: 1rem; font-size: 1rem; }

	/* ─── Mi cuenta ─── */
	.woocommerce-MyAccount-navigation ul { gap: .8rem 1rem; }
	.woocommerce-MyAccount-navigation li a { font-size: .78rem; }
	.woocommerce-account .woocommerce-MyAccount-content table.shop_table thead { display: none; }
	.woocommerce-account .woocommerce-MyAccount-content table.shop_table tr { display: block; border: 1px solid var(--color-borde); border-radius: var(--radio-md); padding: .7rem; margin-bottom: .7rem; }
	.woocommerce-account .woocommerce-MyAccount-content table.shop_table td { display: flex; justify-content: space-between; border: none; padding: .3rem 0; }
	.woocommerce-account .woocommerce-MyAccount-content table.shop_table td::before { content: attr(data-title); font-weight: 600; color: var(--color-texto-suave); font-size: .8rem; }

	/* ─── Footer ─── */
	.gn-footer { margin-top: var(--espacio-xl); padding-top: var(--espacio-lg); }
	.gn-footer__grid { gap: var(--espacio-md); }

	/* ─── Acceso brandeado ─── */
	.gn-acceso-hero { padding: var(--espacio-xl) var(--contenedor-padding) var(--espacio-lg); }
	.gn-acceso-hero__ventajas { flex-direction: column; gap: .4rem; text-align: left; }

	/* ─── Barra de envío gratis: pegada arriba mientras se navega la tienda ─── */
	.gn-envio-gratis-barra[data-ctx="cart"] { font-size: .85rem; }
}

@media (max-width: 480px) {
	.gn-home-hero__titulo { font-size: clamp(1.5rem, 8.5vw, 2rem); }
	.gn-seccion-titulo { font-size: 1.35rem; }
	ul.products { gap: .9rem .55rem; }
	.gn-tarjeta-producto__accion .add_to_cart_button,
	ul.products li.product .button { font-size: .74rem !important; padding: .65rem .5rem !important; }
	.gn-anuncio { padding-block: .45rem; }
}

/* Área táctil mínima en todos los enlaces/botones de navegación */
@media (max-width: 768px) and (pointer: coarse) {
	.gn-menu-movil__lista li a,
	.woocommerce-MyAccount-navigation li a,
	.gn-footer__col ul li a { min-height: 40px; display: flex; align-items: center; }
}