/* ══════════════════════════════════════════════════════════════════════
   Sidebar "CATEGORÍAS" (widget_product_categories dentro de
   sidebar-woocommerce-left) — SOLO en esta página (is_page(842), ver
   inc/sobre-nosotros-sidebar.php), sin tocar woo-left-sidebar-page.css
   (compartido con las 19 fichas de producto y Servicio Técnico, que ya
   tienen su propio look aprobado con bullets simples).
   Replica EXACTA del patrón ya usado y aprobado en el sidebar de Academia
   (.widget-categoria-academia / .widget_product_categories en
   academia-sidebar-page.css): caja gris clara, línea fucsia corta bajo
   el título, filas sin bullets separadas por líneas divisorias finas.
   ══════════════════════════════════════════════════════════════════════ */
body.page-id-842 .oz-woo-left-layout__sidebar .widget_product_categories {
	background: #f7f7f7;
	padding: 18px 20px;
	margin-bottom: 22px;
}

body.page-id-842 .oz-woo-left-layout__sidebar .widget_product_categories .widget-title {
	margin: 0 0 12px;
	padding: 0 0 10px;
	border-bottom: 2px solid #ff0047;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	color: #111827;
}

body.page-id-842 .oz-woo-left-layout__sidebar .widget_product_categories ul.product-categories {
	list-style: none;
	margin: 0;
	padding-left: 0;
}

body.page-id-842 .oz-woo-left-layout__sidebar .widget_product_categories ul.product-categories li {
	margin-bottom: 0;
	padding: 9px 0;
	border-bottom: 1px solid #e0e0e0;
}

body.page-id-842 .oz-woo-left-layout__sidebar .widget_product_categories ul.product-categories li:last-child {
	border-bottom: 0;
}

body.page-id-842 .oz-woo-left-layout__sidebar .widget_product_categories ul.product-categories li a {
	font-size: 14px;
	color: #374151;
	text-decoration: none;
}

body.page-id-842 .oz-woo-left-layout__sidebar .widget_product_categories ul.product-categories li a:hover {
	color: #ff0047;
}

body.page-id-842 .oz-woo-left-layout__sidebar .widget_product_categories ul.product-categories li a::before {
	content: none;
}

/* ══════════════════════════════════════════════════════════════════════
   Título "NUESTROS DISTRIBUIDORES" del carrusel (post 5330, único uso:
   página Sobre Nosotros, ID único #oz-slider-5330-1) — el CSS global
   "unificado" (oz-sliders.css) fuerza font-size clamp(2rem,3vw,3.25rem)
   !important + font serif en TODOS los .ozs__title del sitio, pensado
   para carruseles con header grande tipo hero. Acá, según la referencia
   real, el título debe verse compacto: "NUESTROS" en fucsia + peso
   normal, "DISTRIBUIDORES" en negro, sin el guión bajo azul (::after)
   que trae el header por defecto en otros carruseles.
   El span .ozs__title-hl (para "NUESTROS") es un mecanismo NATIVO del
   plugin (format_header_title_highlight(), activado con *asteriscos* en
   el campo title del preset) — no requirió tocar HTML/PHP del plugin,
   solo el propio texto del título en el preset 5330.
   ══════════════════════════════════════════════════════════════════════ */
#oz-slider-5330-1 .ozs__title {
	font-family: inherit !important;
	font-size: 20px !important;
	font-weight: 700 !important;
	line-height: 1.3 !important;
	letter-spacing: normal !important;
	color: #111111 !important;
}
#oz-slider-5330-1 .ozs__title::after {
	display: none !important;
}
#oz-slider-5330-1 .ozs__title-hl {
	color: #ff0047;
}

/* Línea divisoria fina bajo el header completo (título + flechas), como
   en la referencia real. */
#oz-slider-5330-1 .ozs__header {
	border-bottom: 1px solid #1f1f1f;
	padding-bottom: 12px;
}

/* Tarjetas: cada logo dentro de una caja con borde propio, separadas
   entre sí — hoy .ozs__slide no tiene ningún borde/fondo (confirmado
   con getComputedStyle), el logo flota suelto sobre blanco. */
#oz-slider-5330-1 .ozs__media {
	border: 1px solid #d0d0d0;
	box-sizing: border-box;
}

/* Cada logo tiene una proporción natural distinta (176x100, 300x100,
   200x100, etc.) y .ozs__media no traía altura fija: la caja tomaba la
   altura de CADA imagen (51px a 87px según el logo) y object-fit:cover
   recortaba el resto — por eso unos logos se veían "llenos" y otros
   chicos con recorte. Fix: altura uniforme + contain (logo completo,
   centrado, sin recortar) + padding para que no toque el borde. */
#oz-slider-5330-1 .ozs__media {
	height: 80px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 10px;
}
#oz-slider-5330-1 .ozs__media img {
	width: 100% !important;
	height: 100% !important;
	object-fit: contain !important;
}

/* Flechas: mismo patrón chevron fucsia simple ya usado en el carrusel de
   marcas del Homepage (.oz-marcas-compact) — sin fondo/botón/círculo,
   solo el trazo en color de marca. Acá las flechas ya están bien
   posicionadas (van dentro de .ozs__header, modo "con header" nativo
   del plugin), solo cambia su apariencia. */
html body #oz-slider-5330-1 .ozs__nav-btn--prev,
html body #oz-slider-5330-1 .ozs__nav-btn--next {
	background: transparent !important;
	border: none !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	width: 32px !important;
	height: 32px !important;
}
html body #oz-slider-5330-1 .ozs__nav-btn--prev:hover,
html body #oz-slider-5330-1 .ozs__nav-btn--prev:focus-visible,
html body #oz-slider-5330-1 .ozs__nav-btn--next:hover,
html body #oz-slider-5330-1 .ozs__nav-btn--next:focus-visible {
	background: transparent !important;
	opacity: 0.7;
}
html body #oz-slider-5330-1 .ozs__nav-btn--prev::before,
html body #oz-slider-5330-1 .ozs__nav-btn--next::before {
	content: '' !important;
	display: block !important;
	width: 20px !important;
	height: 20px !important;
	margin: 0 auto !important;
	border: none !important;
	background-color: transparent !important;
	background-repeat: no-repeat !important;
	background-position: center !important;
	background-size: 20px 20px !important;
	filter: none !important;
	transform: none !important;
}
html body #oz-slider-5330-1 .ozs__nav-btn--prev::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M15 5l-7 7 7 7' stroke='%23ff0047' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
}
html body #oz-slider-5330-1 .ozs__nav-btn--next::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M9 5l7 7-7 7' stroke='%23ff0047' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
}