/* ==========================================================================
   Carnival Meat Lab — D3 global: barra superior, cabecera y tarjetas de la tienda (2026-10-21).
   Se encola solo con los interruptores "cabecera" o "tarjetas" encendidos (o en la home D3).
   ========================================================================== */
.cml-d3 {
	--cml-granate: #630d16;
	--cml-granate-osc: #4d0a11;
	--cml-negro: #1a1a1a;
	--cml-gris: #6b6560;
	--cml-linea: #e6e1da;
	--cml-crema: #f6f1ea;
}

/* ---- Cabecera nueva: la de OceanWP y la que arma el JS viejo quedan ocultas, sin el margen que reservaban ---- */
body.cml-cab-d3 { padding-top: 0 !important; }
body.cml-cab-d3 #site-header,
body.cml-cab-d3 #ag-mobile-header,
body.cml-cab-d3 .ag-cat-container,
body.cml-cab-d3 .ag-subcat-container,
body.cml-cab-d3 .ag-desktop-search-toggle,
body.cml-cab-d3 #top-bar-wrap,
body.cml-cab-d3 .xoo-wsc-basket { display: none !important; } /* el carrito ya está en la cabecera */

.cml-barra {
	min-height: 32px;
	padding: 7px 12px;
	background: var(--cml-granate);
	text-align: center;
	font: 600 12px/1.5 Montserrat, system-ui, sans-serif;
}
.cml-barra a { color: #fff; text-decoration: none; }
.cml-barra a:hover { text-decoration: underline; text-underline-offset: 3px; }

.cml-cab {
	position: sticky;
	top: 0;
	z-index: 999;
	background: #fff;
	border-bottom: 1px solid var(--cml-linea);
	font-family: Montserrat, system-ui, sans-serif;
}
.admin-bar .cml-cab { top: 46px; }
@media (min-width: 783px) { .admin-bar .cml-cab { top: 32px; } }
.cml-cab__in {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	max-width: 1100px;
	height: 58px;
	margin: 0 auto;
	padding: 0 16px;
}
.cml-cab__i {
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 2px;
	background: none;
	color: var(--cml-negro);
	cursor: pointer;
}
.cml-cab__i:hover { background: var(--cml-crema); color: var(--cml-negro); }
.cml-cab a:focus-visible, .cml-cab button:focus-visible { outline: 2px solid var(--cml-granate); outline-offset: 2px; }
.cml-cab__menu { justify-self: start; }
.cml-cab__logo { display: block; line-height: 0; }
.cml-cab__logo img { width: auto; height: 36px; }
.cml-cab__ic { display: flex; justify-content: flex-end; align-items: center; }
.cml-cab__envios { display: none; padding: 12px 8px; font-weight: 600; font-size: 13px; color: var(--cml-negro); text-decoration: none; }
.cml-cab__carrito { position: relative; }
.cml-cab__n {
	position: absolute;
	top: 4px;
	right: 2px;
	min-width: 18px;
	height: 18px;
	padding: 0 5px;
	border-radius: 9px;
	background: var(--cml-granate);
	color: #fff;
	font: 700 11px/18px Montserrat, sans-serif;
	text-align: center;
}
.cml-cab__n[hidden] { display: none; }

.cml-cab__cats {
	display: flex;
	overflow-x: auto;
	border-top: 1px solid var(--cml-linea);
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
}
.cml-cab__cats::-webkit-scrollbar { display: none; }
.cml-cab__cats a {
	flex: 0 0 auto;
	padding: 14px 10px;
	font: 800 14px/1 "CML Saira Semi Condensed", "Saira Semi Condensed", "Arial Narrow", sans-serif;
	text-transform: uppercase;
	letter-spacing: .03em;
	color: var(--cml-negro);
	text-decoration: none;
}
.cml-cab__cats a.is-of { color: var(--cml-granate); }
.cml-cab__cats a.is-actual { box-shadow: inset 0 -2px 0 currentColor; }
.cml-cab__cats a:focus-visible { outline-offset: -2px; }

.cml-cab__buscar { display: flex; gap: 8px; max-width: 1100px; margin: 0 auto; padding: 0 16px 12px; }
.cml-cab__buscar[hidden] { display: none; }
.cml-cab__buscar input[type="search"] {
	flex: 1;
	min-width: 0;
	min-height: 44px;
	padding: 0 12px;
	border: 1px solid var(--cml-negro);
	border-radius: 2px;
	font: 400 16px Montserrat, sans-serif; /* 16 px: Safari no hace zoom al tocar */
}
.cml-cab__buscar .cml-btn {
	display: flex;
	align-items: center;
	min-height: 44px;
	padding: 0 18px;
	border: 0;
	border-radius: 2px;
	background: var(--cml-granate);
	color: #fff;
	font: 600 13px Montserrat, sans-serif;
	cursor: pointer;
}

.cml-cab__panel {
	display: grid;
	max-width: 1100px;
	margin: 0 auto;
	padding: 4px 16px 12px;
	border-top: 1px solid var(--cml-linea);
}
.cml-cab__panel[hidden] { display: none; }
.cml-cab__panel a {
	display: block;
	padding: 12px 0;
	border-bottom: 1px solid var(--cml-linea);
	font-weight: 600;
	font-size: 15px;
	color: var(--cml-negro);
	text-decoration: none;
}
.cml-cab__panel a:last-child { border-bottom: 0; }

@media (min-width: 600px) {
	.cml-cab__envios { display: inline-block; }
}
@media (min-width: 900px) {
	.cml-cab__in { height: 70px; }
	.cml-cab__logo img { height: 44px; }
	.cml-cab__cats { justify-content: center; }
}

/* ---- Tarjetas de producto D3 (home siempre; tienda, categorías y búsqueda con el interruptor "tarjetas") ---- */
/* Tarjetas: se pisan las reglas de la grilla de la tienda solo dentro de .cml-d3-cards */
body .cml-d3-cards.cml-d3-cards ul.products:not(#cml-grid) {
	display: grid !important;
	grid-template-columns: 1fr 1fr !important;
	gap: 20px 12px !important;
	margin: 16px 0 0 !important;
	padding: 0 !important;
	text-align: left;
}
body .cml-d3-cards.cml-d3-cards ul.products:not(#cml-grid)::before, body .cml-d3-cards.cml-d3-cards ul.products:not(#cml-grid)::after { display: none !important; }
body .cml-d3-cards.cml-d3-cards ul.products:not(#cml-grid) > li.product {
	display: flex !important;
	flex-direction: column !important;
	width: auto !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	float: none !important;
	text-align: left !important;
}
body .cml-d3-cards.cml-d3-cards ul.products:not(#cml-grid) > li.product .woocommerce-LoopProduct-link,
body .cml-d3-cards.cml-d3-cards ul.products:not(#cml-grid) > li.product .product-inner,
body .cml-d3-cards.cml-d3-cards ul.products:not(#cml-grid) > li.product .woo-entry-inner { display: flex !important; flex-direction: column !important; flex: 1 1 auto; padding: 0 !important; border: 0 !important; background: none !important; box-shadow: none !important; text-decoration: none; }
body .cml-d3-cards.cml-d3-cards ul.products:not(#cml-grid) > li.product img {
	display: block !important;
	width: 100% !important;
	height: auto !important;
	aspect-ratio: 1 / 1;
	margin: 0 !important;
	object-fit: cover;
	object-position: 50% 50%;
	border-radius: 0 !important;
	background: #f1eeea;
}
/* Fotos que no son de estudio cuadrado: encuadre sobre la pieza (provoleta y chimichurri). */
body .cml-d3-cards.cml-d3-cards ul.products:not(#cml-grid) > li.post-1589 img { object-position: 50% 62%; }
/* La foto va en su cuadro (span.cml-d3-foto): el zoom del chimichurri no se sale ni tapa el título. */
body .cml-d3-cards.cml-d3-cards ul.products:not(#cml-grid) > li.product .cml-d3-foto { display: block; position: relative; overflow: hidden; aspect-ratio: 1 / 1; background: #f1eeea; }
body .cml-d3-cards.cml-d3-cards ul.products:not(#cml-grid) > li.product .cml-nowrap { white-space: nowrap; }
body .cml-d3-cards.cml-d3-cards ul.products:not(#cml-grid) > li.post-4773 img { transform: scale(1.35); transform-origin: 50% 62%; }
body .cml-d3-cards.cml-d3-cards ul.products:not(#cml-grid) > li.product .onsale { display: none !important; }
body .cml-d3-cards.cml-d3-cards ul.products:not(#cml-grid) > li.product .woocommerce-loop-product__title {
	margin: 10px 0 0 !important;
	padding: 0 !important;
	font: 800 15px/1.15 "CML Saira Semi Condensed", "Saira Semi Condensed", "Arial Narrow", sans-serif !important;
	text-transform: uppercase;
	letter-spacing: .01em;
	color: var(--cml-negro) !important;
	border: 0 !important;
}
body .cml-d3-cards.cml-d3-cards ul.products:not(#cml-grid) > li.product .cml-d3-nota { margin: 2px 0 0 !important; font-size: 12px !important; line-height: 1.4; color: var(--cml-gris) !important;
	display: -webkit-box !important; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden; }
body .cml-d3-cards.cml-d3-cards ul.products:not(#cml-grid) > li.product .price.cml-d3-precio {
	display: block !important;
	margin: auto 0 10px !important; /* pegado abajo: precios alineados en cada fila */
	padding: 4px 0 0 !important;
	border: 0 !important;
	font: 600 15px/1.3 Montserrat, sans-serif !important;
	color: var(--cml-negro) !important;
}
body .cml-d3-cards.cml-d3-cards ul.products:not(#cml-grid) > li.product .price.cml-d3-precio .amount { font: inherit !important; color: inherit !important; }
body .cml-d3-cards.cml-d3-cards ul.products:not(#cml-grid) > li.product .price.cml-d3-precio .cml-price-unit { font-size: 12px !important; font-weight: 400 !important; color: var(--cml-gris) !important; }
body .cml-d3-cards.cml-d3-cards ul.products:not(#cml-grid) > li.product .cml-price-piece,
body .cml-d3-cards.cml-d3-cards ul.products:not(#cml-grid) > li.product .cml-unit-prefix,
body .cml-d3-cards.cml-d3-cards ul.products:not(#cml-grid) > li.product .star-rating { display: none !important; }
body .cml-d3-cards.cml-d3-cards ul.products:not(#cml-grid) > li.product a.button.cml-btn,
body .cml-d3-cards.cml-d3-cards ul.products:not(#cml-grid) > li.product .button.cml-btn {
	display: flex !important;
	align-items: center;
	justify-content: center;
	width: 100% !important;
	min-height: 44px !important;
	margin: auto 0 0 !important;
	padding: 0 10px !important;
	border: 0 !important;
	border-radius: 2px !important;
	background: var(--cml-granate) !important;
	color: #fff !important;
	font: 600 13px/1.2 Montserrat, sans-serif !important;
	text-transform: none !important;
	letter-spacing: 0 !important;
	box-shadow: none !important;
}
body .cml-d3-cards.cml-d3-cards ul.products:not(#cml-grid) > li.product a.button.cml-btn:hover { background: var(--cml-granate-osc) !important; }
body .cml-d3-cards.cml-d3-cards ul.products:not(#cml-grid) > li.product .added_to_cart { display: none !important; }


/* Orden fijo dentro de la tarjeta (la grilla de la tienda reordena con "order"). */
body .cml-d3-cards.cml-d3-cards ul.products:not(#cml-grid) > li.product .woocommerce-LoopProduct-link > img,
body .cml-d3-cards.cml-d3-cards ul.products:not(#cml-grid) > li.product .woocommerce-LoopProduct-link > .cml-d3-foto { order: 1 !important; }
body .cml-d3-cards.cml-d3-cards ul.products:not(#cml-grid) > li.product .woocommerce-LoopProduct-link > .woocommerce-loop-product__title { order: 2 !important; }
body .cml-d3-cards.cml-d3-cards ul.products:not(#cml-grid) > li.product .woocommerce-LoopProduct-link > .cml-d3-nota { order: 3 !important; }
body .cml-d3-cards.cml-d3-cards ul.products:not(#cml-grid) > li.product .woocommerce-LoopProduct-link > .price { order: 4 !important; }
body .cml-d3-cards.cml-d3-cards ul.products:not(#cml-grid) > li.product .woocommerce-LoopProduct-link { overflow: hidden; border-radius: 0 !important; }

@media (min-width: 600px) {
	body .cml-d3-cards.cml-d3-cards ul.products:not(#cml-grid) { grid-template-columns: repeat(4, 1fr) !important; }
}
@media (min-width: 900px) {
	body .cml-d3-cards.cml-d3-cards ul.products:not(#cml-grid) { gap: 24px 22px !important; }
}
body .cml-d3-cards.cml-d3-cards ul.products:not(#cml-grid) > li.product .price.cml-d3-precio del { margin-right: 4px; font-size: 12px !important; font-weight: 400 !important; color: var(--cml-gris) !important; }
body .cml-d3-cards.cml-d3-cards ul.products:not(#cml-grid) > li.product .price.cml-d3-precio del .amount { font-size: 12px !important; font-weight: 400 !important; color: var(--cml-gris) !important; }
body .cml-d3-cards.cml-d3-cards ul.products:not(#cml-grid) > li.product .price.cml-d3-precio ins { text-decoration: none; color: var(--cml-granate) !important; }
body .cml-d3-cards.cml-d3-cards ul.products:not(#cml-grid) > li.product .price.cml-d3-precio ins .amount { color: var(--cml-granate) !important; }
body .cml-d3-cards.cml-d3-cards ul.products:not(#cml-grid) > li.product .cml-d3-desde { font-size: 12px; font-weight: 400; color: var(--cml-gris); }

/* Con sesión, en móvil (≤ 600 px) WordPress pone la barra de administrador en position: absolute y tapa la
   barra de envío gratis: se baja la barra debajo de ella. Solo afecta a usuarios con sesión. */
@media screen and (max-width: 600px) {
	body.admin-bar .cml-d3.cml-barra { margin-top: 46px; }
}