/*
Theme Name: Lalita Mua
Theme URI: https://lalitamua.vikapp.dev
Author: Lookup Co.
Author URI: https://lookup.co
Description: Tema de bloques (Full Site Editing) para el ecommerce de Lalita Mua — body piercing y joyería de titanio grado implante. Madreselva Studio, Envigado.
Version: 0.1.0
Requires at least: 6.5
Tested up to: 7.0
Requires PHP: 8.1
WC requires at least: 8.0
WC tested up to: 10.9
Text Domain: lalita-mua
*/

/*
Todos los design tokens (color, tipografía, espaciado, radios) viven en theme.json.
Este archivo se mantiene intencionalmente mínimo: solo detalles que theme.json no puede expresar.
*/

/* Nav: resaltar el item de la página actual (patrón "pill" del prototipo) */
.wp-block-navigation .current-menu-item > .wp-block-navigation-item__content {
	background-color: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--ink);
	border-radius: var(--wp--custom--radius--pill);
}

/* Hero: tarjeta "glass" sobre la imagen de fondo */
.lalita-glass-card {
	backdrop-filter: blur(var(--wp--custom--blur--card));
	-webkit-backdrop-filter: blur(var(--wp--custom--blur--card));
}

/* Dual-path / trust cards: hover sutil */
.lalita-hover-card {
	transition: border-color .2s ease, background-color .2s ease;
}
.lalita-hover-card:hover {
	border-color: var(--wp--preset--color--accent);
	background-color: var(--wp--preset--color--surface);
}

/* Categorías: la flecha se desliza en hover/focus de la fila */
.lalita-cat-row:hover .lalita-cat-arrow,
.lalita-cat-row:focus-within .lalita-cat-arrow {
	transform: translateX(6px);
}
.lalita-cat-arrow {
	display: inline-block;
	transition: transform .2s ease;
}

/* Marquee: cinta con scroll horizontal infinito */
.lalita-marquee {
	overflow: hidden;
}
.lalita-marquee__track {
	display: flex;
	width: max-content;
	gap: var(--wp--preset--spacing--lg);
	white-space: nowrap;
	animation: lalita-marquee-scroll var(--wp--custom--motion--marquee) linear infinite;
}
@keyframes lalita-marquee-scroll {
	from { transform: translateX(0); }
	to { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce) {
	.lalita-marquee__track {
		animation: none;
	}
}