/* Tienda Proinval — re-skin claro con acentos rojos (banner, sidebar de
 * categorías y títulos de widgets). Carga después de shop-archive.css.
 * Se usan prefijos html body + !important para vencer a los estilos del tema. */

html body.woocommerce,
html body.woocommerce-page,
html body.archive {
  --OZ-Shop-Category-Accent: #e2231a !important;
  --OZ-Shop-Filter-Title-Accent: #e2231a !important;
}

/* ===== Contenido de la tienda a ANCHO COMPLETO (no el contenedor ~1320/1440) ===== */
html body .oz-shop-archive__container.oz-shop-layout {
  width: 100% !important;
  max-width: 100% !important;
  margin-inline: 0 !important;
  padding-inline: clamp(1rem, 3vw, 2.5rem) !important;
  box-sizing: border-box !important;
}

/* ===== Banner: ancho completo (full-bleed) + fondo claro + título ROJO centrado ===== */
html body .oz-shop-page-banner {
  background: #f4f5f6 !important;
  color: #374151 !important;
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  padding-block: 1.75rem !important;
}
html body .oz-shop-page-banner__inner {
  grid-template-columns: 1fr !important;
  justify-items: center !important;
  text-align: center !important;
}
html body .oz-shop-page-banner__main,
html body .oz-shop-page-banner__aside { justify-self: center !important; }
html body .oz-shop-page-banner__title { color: #e2231a !important; font-weight: 400 !important; }
html body .oz-shop-page-banner__wc-breadcrumb { justify-content: center !important; }
html body .oz-shop-page-banner__wc-breadcrumb a { color: #6b7280 !important; }
html body .oz-shop-page-banner__wc-breadcrumb a:hover { color: #374151 !important; }
html body .oz-shop-page-banner__crumb-sep { color: #9ca3af !important; }

/* ===== Títulos de widgets del sidebar: subrayado rojo, texto oscuro ===== */
html body .oz-shop-sidebar__widget.widget_product_categories .oz-shop-sidebar__widget-title,
html body .oz-shop-sidebar__widget.widget_products .oz-shop-sidebar__widget-title,
html body .oz-shop-sidebar__widget.widget_layered_nav .oz-shop-sidebar__widget-title,
html body .oz-shop-sidebar__widget .oz-shop-sidebar__widget-title {
  color: #1a1a1a !important;
  border-bottom: 2px solid #e2231a !important;
  padding-bottom: 8px !important;
  margin-bottom: 12px !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  font-size: 1.15rem !important;
  font-weight: 700 !important;
}

/* ===== Widget de Categorías → claro ===== */
html body .oz-shop-sidebar__widget.widget_product_categories {
  background: #ffffff !important;
  border-color: #ececec !important;
  color: #1a1a1a !important;
}
html body .oz-shop-sidebar__widget.widget_product_categories .oz-shop-sidebar__widget-title::before {
  display: none !important;
}
html body .oz-shop-sidebar__widget.widget_product_categories .product-categories > li,
html body .oz-shop-sidebar__widget.widget_product_categories .oz-shop-categories > li {
  border-bottom-color: #eee !important;
}
html body .oz-shop-sidebar__widget.widget_product_categories .product-categories li > a,
html body .oz-shop-sidebar__widget.widget_product_categories .oz-shop-categories li > a {
  color: #374151 !important;
}
html body .oz-shop-sidebar__widget.widget_product_categories .product-categories li > a::before,
html body .oz-shop-sidebar__widget.widget_product_categories .oz-shop-categories li > a::before {
  border-color: #c9ced6 !important;
}
html body .oz-shop-sidebar__widget.widget_product_categories .product-categories li > a::after,
html body .oz-shop-sidebar__widget.widget_product_categories .oz-shop-categories li > a::after {
  border-color: #9aa0a8 !important;
}
html body .oz-shop-sidebar__widget.widget_product_categories .product-categories li a:hover,
html body .oz-shop-sidebar__widget.widget_product_categories .oz-shop-categories li a:hover {
  color: #e2231a !important;
  background: #f7f7f8 !important;
}
html body .oz-shop-sidebar__widget.widget_product_categories .product-categories .current-cat > a,
html body .oz-shop-sidebar__widget.widget_product_categories .product-categories .current-cat-parent > a,
html body .oz-shop-sidebar__widget.widget_product_categories .oz-shop-categories .current-cat > a {
  color: #e2231a !important;
  background: #fdecec !important;
}
html body .oz-shop-sidebar__widget.widget_product_categories .oz-shop-cat-toggle {
  color: #6b7280 !important;
}
html body .oz-shop-sidebar__widget.widget_product_categories .oz-shop-cat-toggle:hover {
  background: #f0f0f0 !important;
}

/* Scrollbar de la lista de categorías → rojo (Chrome usa scrollbar-color,
   por eso hay que sobreescribir esa propiedad, no solo los ::-webkit-*). */
html body .oz-shop-sidebar__widget.widget_product_categories ul.product-categories {
  scrollbar-color: #e2231a #f0f0f0 !important;
}
html body .oz-shop-sidebar__widget.widget_product_categories ul.product-categories::-webkit-scrollbar-thumb {
  background: #e2231a !important;
}
html body .oz-shop-sidebar__widget.widget_product_categories ul.product-categories::-webkit-scrollbar-track {
  background: #f0f0f0 !important;
}

/* ===== Barra de filtros (Características / Colores / Tipos) ===== */
/* Título rojo al abrir o al pasar el mouse (la flecha usa currentColor). */
html body .oz-filters--bar .oz-filter.is-open .oz-filter__title,
html body .oz-filters--bar .oz-filter__title:hover {
  color: #e2231a !important;
}
/* Panel desplegable con borde rojo. */
html body .oz-filters--bar .oz-filter.is-open .oz-filter__content {
  border-color: #e2231a !important;
}
/* Checkbox marcado → rojo. */
html body .oz-filter__item.is-active::before {
  background: #e2231a !important;
  border-color: #e2231a !important;
}
html body .oz-filter__item.is-active {
  background: rgba(226, 35, 26, 0.06) !important;
}
/* Scrollbar del panel → rojo. */
html body .oz-filters--bar .oz-filter__content::-webkit-scrollbar-thumb {
  background: #e2231a !important;
}

/* ===== Colores/Tipos dentro del toolbar de la tienda ===== */
/* El toolbar debe apilarse sobre los productos y no recortar el desplegable. */
html body .oz-shop-toolbar {
  position: relative;
  z-index: 30;
  overflow: visible !important;
}
html body .oz-shop-archive__results { overflow: visible !important; }
html body .oz-shop-toolbar__filters {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
}
/* Cada filtro es su propio contexto → su panel abre DEBAJO de su propio título
   (la regla base .oz-filter{position:relative} está rota en filters-variations.css). */
html body .oz-shop-toolbar__filters .oz-filter {
  position: relative;
}
html body .oz-shop-toolbar__filters .oz-filters {
  border: 0 !important;
  background: transparent !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}
html body .oz-shop-toolbar__filters .oz-filters__inner {
  gap: 18px !important;
}
html body .oz-shop-toolbar__filters .oz-filters__actions { display: none !important; }
html body .oz-shop-toolbar__filters .oz-filter__title {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  font-size: 0.9375rem;
  color: #374151;
  white-space: nowrap;
}
/* Chevron ▾ al lado del título. */
html body .oz-shop-toolbar__filters .oz-filter__title::after {
  content: "";
  width: 8px;
  height: 8px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg);
  margin-left: 2px;
  margin-top: -3px;
  transition: transform 0.2s ease;
}
html body .oz-shop-toolbar__filters .oz-filter.is-open .oz-filter__title::after {
  transform: rotate(-135deg);
  margin-top: 2px;
}
/* Panel del desplegable: por encima del toolbar. */
html body .oz-shop-toolbar__filters .oz-filter__content {
  background: #ffffff !important;
  max-height: 320px;
  overflow: auto;
  padding: 8px 6px !important;
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.12);
  z-index: 50;
}
html body .oz-shop-toolbar__filters .oz-filter__item {
  padding: 6px 8px;
  color: #1f2937;
}
html body .oz-shop-toolbar__filters .oz-filter__label { color: #1f2937; }
html body .oz-shop-toolbar__filters .oz-filter__count { color: #1f7a9c !important; font-weight: 500; }
html body .oz-shop-toolbar__filters .oz-filter__count::before { content: "("; }
html body .oz-shop-toolbar__filters .oz-filter__count::after { content: ")"; }