/*
 Theme Name:   Blocksy Child
 Theme URI:    https://todoluces.com.ar
 Description:  Child mínimo. Preferir Customizer Blocksy; aquí solo catálogo/swatches.
 Author:       Todo Luces
 Template:     blocksy
 Version:      1.4.2
 Text Domain:  blocksy-child
*/

:root {
	--tdl-fine-text: #4b5563;
	--tdl-fine-muted: #6b7280;
	--tdl-card-title-lines: 2;
	--tdl-card-title-line-height: 1.3;
	--tdl-card-title-size: 12px;
	--tdl-swatch-slot: 18px;
}

/* --- Loop cards: grilla compacta / catálogo --- */

[data-products],
.woocommerce ul.products {
	--grid-columns-gap: 18px;
	gap: 18px;
}

/* Caja 1:1 fija; foto completa (contain), sin recorte duro */
[data-products] .product > figure,
.woocommerce ul.products li.product > figure {
	margin: 0 0 0.45rem;
	aspect-ratio: 1 / 1;
	width: 100%;
	background: #ffffff;
	overflow: hidden;
}

[data-products] .product .ct-media-container,
.woocommerce ul.products li.product .ct-media-container {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	aspect-ratio: 1 / 1;
	background: #ffffff;
}

[data-products] .product .ct-media-container img,
.woocommerce ul.products li.product .ct-media-container img,
.woocommerce ul.products li.product img.wp-post-image {
	width: 100% !important;
	height: 100% !important;
	max-height: none !important;
	object-fit: contain;
	object-position: center;
	aspect-ratio: auto !important; /* anula style inline de Blocksy/Woo */
}

/* Título: compacto, uppercase, 2 líneas fijas */
[data-products] .product .woocommerce-loop-product__title,
.woocommerce ul.products li.product .woocommerce-loop-product__title {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: var(--tdl-card-title-lines);
	line-clamp: var(--tdl-card-title-lines);
	overflow: hidden;
	margin: 0.25rem 0 0;
	min-height: calc(var(--tdl-card-title-size) * var(--tdl-card-title-line-height) * var(--tdl-card-title-lines));
	font-size: var(--tdl-card-title-size);
	font-weight: 600;
	line-height: var(--tdl-card-title-line-height);
	letter-spacing: 0.02em;
	text-transform: uppercase;
	color: #1a1a1a;
}

/* Swatches: slot fijo (cuadraditos sin cambios de estilo) */
.tdl-loop-swatches {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	gap: 0.25rem;
	margin: 0 0 0.15rem;
	min-height: var(--tdl-swatch-slot);
}
.tdl-loop-swatches__items {
	display: flex;
	flex-wrap: wrap;
	gap: 0.28rem;
	align-items: center;
	min-height: var(--tdl-swatch-slot);
}
.tdl-swatch {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	border: 1px solid rgba(0, 0, 0, 0.16);
	border-radius: 3px;
}
.tdl-swatch--color,
.tdl-swatch--image {
	width: 14px;
	height: 14px;
}
.tdl-swatch--image {
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}
.tdl-swatch--label,
.tdl-swatch--more {
	min-width: 22px;
	height: 18px;
	padding: 0 5px;
	font-size: 0.625rem;
	font-weight: 600;
	color: #374151;
	background: #f3f4f6;
}

/* Single: contain sin forzar cuadrado */
body.single-product .woocommerce-product-gallery__image img,
body.single-product .ct-product-gallery-container img {
	max-height: 420px;
	width: auto;
	max-width: 100%;
	object-fit: contain;
	margin-inline: auto;
}

/* Listas de widgets del footer (HTML custom) */
.ct-footer .ct-widget ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

/*
 * Sticky inmediato (antes de sticky.js):
 * - El HTML ya trae data-sticky="fixed:…" (functions.php)
 * - Reservar alto del contenedor solo si NO es transparente (evita salto)
 */
body[data-header*="sticky"] #header .ct-sticky-container {
	min-height: calc(var(--header-height, 88px) * (1 - var(--has-transparent-header, 0)));
}

/*
 * Header home translúcido:
 * - Standard / sticky: rgba 0.78 (antes era el hover)
 * - Hover: un poco más oscuro (0.90)
 */
body.home #header.ct-header [data-transparent-row="yes"][data-row*="middle"],
body.home #header.ct-header [data-sticky*="yes"] [data-row*="middle"] {
	transition: background-color 0.25s ease;
	background-color: rgba(0, 0, 0, 0.78) !important;
}
body.home #header.ct-header:hover [data-row*="middle"],
body.home #header.ct-header:focus-within [data-row*="middle"],
body.home #header.ct-header.is-header-hovered [data-row*="middle"] {
	background-color: rgba(0, 0, 0, 0.90) !important;
}

/* Expandir al hover mientras está sticky (data-sticky*=yes) */
#header.ct-header [data-sticky*="yes"] [data-row*="middle"] > div {
	transition: min-height 0.25s ease;
}
#header.ct-header:hover [data-sticky*="yes"] [data-row*="middle"],
#header.ct-header.is-header-hovered [data-sticky*="yes"] [data-row*="middle"],
#header.ct-header:focus-within [data-sticky*="yes"] [data-row*="middle"] {
	--shrink-height: var(--height) !important;
}
#header.ct-header [data-sticky*="yes"] .site-logo-container {
	transition: height 0.25s ease;
}
#header.ct-header:hover [data-sticky*="yes"] .site-logo-container,
#header.ct-header.is-header-hovered [data-sticky*="yes"] .site-logo-container,
#header.ct-header:focus-within [data-sticky*="yes"] .site-logo-container {
	--logo-shrink-height: var(--logo-max-height) !important;
	height: var(--logo-max-height) !important;
}

/* --- FABs: WhatsApp + scroll-to-top --- */
.tdl-whatsapp-fab {
	position: fixed;
	z-index: 111;
	right: calc(var(--theme-frame-size, 0px) + 22px);
	bottom: calc(var(--theme-frame-size, 0px) + 22px);
	display: flex;
	align-items: center;
	justify-content: center;
	width: 52px;
	height: 52px;
	border-radius: 50%;
	background: #25d366;
	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.22);
	transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}
.tdl-whatsapp-fab:hover {
	background: #1ebe57;
	transform: translateY(-2px);
	box-shadow: 0 8px 22px rgba(0, 0, 0, 0.28);
}
.tdl-whatsapp-fab svg {
	display: block;
}
.ct-back-to-top {
	/* Ya lo eleva Blocksy vía topButtonOffset; refuerzo visual */
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.16);
}
@media (max-width: 689.98px) {
	.tdl-whatsapp-fab {
		right: calc(var(--theme-frame-size, 0px) + 16px);
		bottom: calc(var(--theme-frame-size, 0px) + 16px);
		width: 48px;
		height: 48px;
	}
}