/**
 * Vivero Daliz — Estilos WooCommerce (tienda, categorías, productos)
 *
 * Sobreescribe grid de Storefront para mostrar 4 columnas en desktop
 */

/* Ocultar sidebar de Storefront en páginas de WooCommerce */
.woocommerce #secondary,
.woocommerce-page #secondary {
	display: none !important;
}

/* Contenido principal ocupa todo el ancho sin sidebar */
.woocommerce #primary,
.woocommerce-page #primary,
.woocommerce .site-main,
.woocommerce-page .site-main {
	width: 100% !important;
	max-width: 100% !important;
	float: none !important;
}

/* Col-full de Storefront sin restricción de ancho */
.woocommerce .site-content > .col-full,
.woocommerce-page .site-content > .col-full {
	max-width: 100% !important;
	padding: 0 2rem !important;
}

/* Reducir espacio de breadcrumbs y título de tienda */
.storefront-breadcrumb {
	margin: 0 !important;
	padding: 0.5rem 2rem !important;
}

.woocommerce-breadcrumb {
	margin: 0 !important;
	padding: 0 !important;
}

.woocommerce .page-title,
.woocommerce-products-header__title {
	display: none !important;
}

.woocommerce-products-header {
	margin: 0 !important;
	padding: 0 !important;
}

.woocommerce .storefront-sorting {
	margin: 0 !important;
	padding: 0.25rem 0 !important;
}

/* Eliminar espacios extra de Storefront en páginas de productos */
.woocommerce .site-main {
	padding-top: 0 !important;
	margin-top: 0 !important;
}

.woocommerce .content-area {
	padding-top: 0 !important;
	margin-top: 0 !important;
}

/* Quitar clearfix de Storefront que ocupa celda del grid */
ul.products::before,
ul.products::after {
	display: none !important;
}

/* Título mobile oculto en desktop */
.vivero-mobile-product-title {
	display: none;
}

/* Ocultar SKU, categorías y link editar en producto individual */
.single-product .product_meta,
.single-product .posted_in,
.single-product .sku_wrapper,
.single-product .edit-link,
.single-product a.post-edit-link {
	display: none !important;
}

/* 5 columnas en desktop con espacio entre productos */
ul.products.columns-4 {
	grid-template-columns: repeat(5, 1fr) !important;
	max-width: 1400px;
	margin: 0 auto !important;
	gap: 1.5rem !important;
}

/* Corazón de wishlist en productos de tienda */
ul.products .product {
	position: relative;
}

.vivero-wishlist-btn {
	position: absolute;
	top: 12px;
	right: 12px;
	z-index: 2;
	width: 36px;
	height: 36px;
	background: white;
	border: none;
	color: #4B4B4B;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
	transition: color 0.2s, transform 0.2s;
	padding: 0;
}

.vivero-wishlist-btn:hover {
	color: #e74c3c;
	transform: scale(1.1);
}

.vivero-wishlist-btn.is-active {
	color: #e74c3c;
}

.vivero-wishlist-btn.is-active svg {
	fill: #e74c3c;
	stroke: #e74c3c;
}

.vivero-wishlist-btn.is-loading {
	pointer-events: none;
	opacity: 0.5;
}

/* Productos relacionados en una sola fila */
section.related ul.products {
	display: flex !important;
	justify-content: center !important;
	gap: 2rem !important;
	flex-wrap: nowrap;
}

section.related ul.products li.product {
	flex: 0 0 calc(25% - 2rem);
	max-width: calc(25% - 2rem);
}

section.related ul.products::before,
section.related ul.products::after {
	display: none !important;
}

/* Página de producto individual centrada */
.single-product .site-content > .col-full {
	max-width: 1000px !important;
	margin: 0 auto !important;
	padding: 0 2rem !important;
}

/* Layout del producto individual */
.single-product div.product {
	max-width: 1000px;
	margin: 0 auto;
	display: flex !important;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 2rem;
}

/* Galería de miniaturas a lado de la imagen principal */
.single-product .woocommerce-product-gallery {
	display: flex;
	flex-direction: row-reverse;
	gap: 0.5rem;
	overflow: hidden;
	width: 55% !important;
	float: none !important;
}

.single-product .woocommerce-product-gallery .flex-control-thumbs {
	display: flex !important;
	flex-direction: column !important;
	gap: 0.5rem;
	width: 80px;
	flex-shrink: 0;
}

.single-product .woocommerce-product-gallery .flex-control-thumbs li {
	width: 100% !important;
}

.single-product .woocommerce-product-gallery .woocommerce-product-gallery__wrapper {
	flex: 1;
}

/* Ocultar tabs de Storefront (descripción se mueve al summary) */
.single-product .woocommerce-tabs {
	display: none !important;
}

/* Reordenar elementos del summary con flexbox */
.single-product .entry-summary {
	display: flex !important;
	flex-direction: column !important;
	width: 40% !important;
	float: none !important;
	flex: 1;
}

.single-product .entry-summary .product_title {
	color: #2A4428 !important;
	order: 1;
}

.single-product .entry-summary .price {
	order: 2;
	font-size: 28px !important;
	margin: 0 !important;
	padding: 0 !important;
}

.single-product .entry-summary .vivero-product-description {
	order: 3;
	margin: 1rem 0;
	font-size: 14px;
	line-height: 1.6;
	color: #555;
}

.single-product .entry-summary .yith-wcwl-add-to-wishlist,
.single-product .entry-summary [class*="yith-add-to-wishlist"] {
	order: 4;
}

.single-product .entry-summary .cart {
	order: 5;
}

/* Quitar clearfix de Storefront en producto individual */
.single-product div.product::before,
.single-product div.product::after {
	display: none !important;
}

/* Productos relacionados y navegación ocupan todo el ancho */
.single-product div.product section.related,
.single-product div.product .storefront-product-pagination,
.single-product div.product .woocommerce-tabs {
	width: 100% !important;
	flex-basis: 100% !important;
}

/* 3 columnas en tablet */
@media (max-width: 1024px) {
	ul.products.columns-4 {
		grid-template-columns: repeat(3, 1fr) !important;
	}
}

/* Ocultar título "My wishlist" de YITH */
.wishlist-title {
	display: none !important;
}

/* 2 columnas en mobile */
@media (max-width: 768px) {
	ul.products.columns-4 {
		grid-template-columns: repeat(2, 1fr) !important;
	}

	/* Producto individual en mobile: apilar verticalmente */
	.single-product div.product {
		flex-direction: column !important;
	}

	/* Título mobile antes de la imagen */
	.vivero-mobile-product-title {
		display: block !important;
		order: 1 !important;
		width: 100%;
		color: #2A4428;
	}

	.single-product .woocommerce-product-gallery {
		width: 100% !important;
		order: 2 !important;
	}

	.single-product .entry-summary {
		width: 100% !important;
		order: 3 !important;
	}

	/* Ocultar título original del summary en mobile */
	.single-product .entry-summary .product_title {
		display: none !important;
	}

	.single-product div.product section.related {
		order: 4 !important;
		width: 100% !important;
	}

	.single-product div.product .storefront-product-pagination {
		order: 5 !important;
		width: 100% !important;
	}

	/* Productos relacionados en mobile: 2 columnas */
	section.related ul.products {
		flex-wrap: wrap !important;
	}

	section.related ul.products li.product {
		flex: 0 0 calc(50% - 1rem) !important;
		max-width: calc(50% - 1rem) !important;
	}
}
