﻿/**
 * Estilos WooCommerce comunes del tema.
 * Incluye piezas compartidas como el banner de tienda.
 */

/* â€”â€” Cross-sells (carrito): grid alineado al archivo + cards OZ Cotizador */
.woocommerce .cross-sells ul.products::before,
.woocommerce .cross-sells ul.products::after {
	content: none !important;
	display: none !important}

.woocommerce .cross-sells ul.products {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 1.25rem;
	
	
	list-style: none;
	clear: both}

@media (max-width: 1199px) {
	.woocommerce .cross-sells ul.products {
		grid-template-columns: repeat(3, minmax(0, 1fr))}
}

@media (max-width: 991px) {
	.woocommerce .cross-sells ul.products {
		grid-template-columns: repeat(2, minmax(0, 1fr))}
}

@media (max-width: 575px) {
	.woocommerce .cross-sells ul.products {
		grid-template-columns: 1fr;
		gap: 1rem}
}

.woocommerce .cross-sells ul.products li.product {
	float: none !important;
	clear: none !important;
	width: auto !important;
	max-width: none !important}

/* Si el Cotizador reemplaza la card, evitamos â€œdoble cajaâ€ en el wrapper <li> */
.woocommerce .cross-sells ul.products li.product:has(.ozc-product-card) {
	
	border: 0;
	background: transparent;
	box-shadow: none}

.woocommerce .cross-sells ul.products li.product .ozc-product-card {
	min-width: 0;
	width: 100%}

.oz-shop-banner {
	width: 100%;
	min-height: clamp(72px, 14vw, 180px);
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat}

/* =========================================================
 * Barra lateral de categorias y productos (.oz-cat-sidebar)
 * Compartida por la tienda (archive-product.php) y la ficha
 * de producto (single-product.php). Definicion unica: vive aqui
 * porque woo-common.css se encola en todas las paginas.
 * ========================================================= */

/* ---------- Columna lateral ---------- */
.oz-cat-sidebar {
	--oz-sp-title: #0f2f63;
	--oz-sp-link: #1e73be;
	--oz-sp-text: #374151;
	--oz-sp-surface: #ffffff;
	--oz-sp-border: #e3e8ef;
	--oz-sp-line: #eceff3;

	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 20px}

.oz-cat-sidebar .oz-shop-sidebar__widget.oz-shop-sidebar__widget {
	margin: 0;
	padding: 18px 20px 20px;
	background: var(--oz-sp-surface);
	border: 1px solid var(--oz-sp-border);
	border-radius: 12px;
	box-shadow: 0 8px 24px rgba(15, 23, 42, .04);
	box-sizing: border-box}

.oz-cat-sidebar .oz-shop-sidebar__widget .oz-shop-sidebar__widget-title.oz-shop-sidebar__widget-title {
	margin: 0 0 12px;
	padding-bottom: 12px;
	border-bottom: 1px solid var(--oz-sp-line);
	color: var(--oz-sp-link);
	font-size: 1.05rem;
	font-weight: 700;
	line-height: 1.3}

/* Lista de categorías (marcado de sidebar/product-categories.php) */
.oz-cat-sidebar .oz-shop-sidebar__widget.widget_product_categories .oz-shop-categories {
	list-style: none;
	max-height: 430px;
	margin: 0;
	padding: 0;
	overflow-y: auto;
	scrollbar-width: thin;
	scrollbar-color: var(--oz-sp-link) rgba(15, 23, 42, .06)}

.oz-cat-sidebar .oz-shop-sidebar__widget.widget_product_categories .oz-shop-categories::-webkit-scrollbar {
	width: 6px}

.oz-cat-sidebar .oz-shop-sidebar__widget.widget_product_categories .oz-shop-categories::-webkit-scrollbar-thumb {
	background: var(--oz-sp-link);
	border-radius: 6px}

.oz-cat-sidebar .oz-shop-sidebar__widget.widget_product_categories .oz-shop-categories > li {
	border-bottom: 1px solid var(--oz-sp-line)}

.oz-cat-sidebar .oz-shop-sidebar__widget.widget_product_categories .oz-shop-categories > li:last-child {
	border-bottom: 0}

.oz-cat-sidebar .oz-shop-sidebar__widget.widget_product_categories .oz-shop-categories li > a {
	display: flex;
	align-items: center;
	gap: 9px;
	padding: 11px 0;
	color: var(--oz-sp-text);
	font-size: .88rem;
	line-height: 1.4;
	text-decoration: none;
	text-transform: uppercase;
	transition: color .2s ease, gap .2s ease}

.oz-cat-sidebar .oz-shop-sidebar__widget.widget_product_categories .oz-shop-categories li > a::before {
	content: "";
	flex: 0 0 auto;
	width: 11px;
	height: 11px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M9 18l6-6-6-6' stroke='%230f2f63' stroke-width='2.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 11px 11px no-repeat}

.oz-cat-sidebar .oz-shop-sidebar__widget.widget_product_categories .oz-shop-categories li > a:hover,
.oz-cat-sidebar .oz-shop-sidebar__widget.widget_product_categories .oz-shop-categories .current-cat > a {
	color: var(--oz-sp-link);
	gap: 13px}

.oz-cat-sidebar .oz-shop-sidebar__widget.widget_product_categories .oz-shop-categories .children {
	display: none}

/* Lista de productos */
.oz-cat-sidebar__side-list {
	list-style: none;
	margin: 0;
	padding: 0}

.oz-cat-sidebar__side-item {
	border-bottom: 1px solid var(--oz-sp-line)}

.oz-cat-sidebar__side-item:last-child {
	border-bottom: 0}

.oz-cat-sidebar__side-link {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 12px 0;
	color: var(--oz-sp-text);
	text-decoration: none;
	transition: color .2s ease}

.oz-cat-sidebar__side-link:hover {
	color: var(--oz-sp-link)}

.oz-cat-sidebar__side-name {
	flex: 1 1 auto;
	min-width: 0;
	font-size: .88rem;
	line-height: 1.4}

.oz-cat-sidebar__side-thumb {
	flex: 0 0 auto;
	width: 64px;
	height: 64px;
	overflow: hidden;
	border-radius: 6px;
	background: #eef2f7;
	line-height: 0}

.oz-cat-sidebar__side-thumb img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	display: block}

@media (prefers-reduced-motion: reduce) {
	.oz-cat-sidebar .oz-shop-sidebar__widget.widget_product_categories .oz-shop-categories li > a,
	.oz-cat-sidebar__side-link {
		transition: none}
}
