/* =====================================================
   WOOCOMMERCE.CSS - MR CONSTRUCTOR
   Sobrescribir estilos de WooCommerce para adaptarlo al tema premium
   ===================================================== */

/* Botones de WooCommerce */
.woocommerce #respond input#submit, 
.woocommerce a.button, 
.woocommerce button.button, 
.woocommerce input.button,
.woocommerce #respond input#submit.alt, 
.woocommerce a.button.alt, 
.woocommerce button.button.alt, 
.woocommerce input.button.alt {
  background: linear-gradient(135deg, var(--color-brown), var(--color-brown-dark));
  color: var(--color-white);
  border: none;
  border-radius: var(--border-radius-full);
  padding: 12px 24px;
  font-weight: var(--font-weight-semibold);
  transition: var(--transition-normal);
  box-shadow: var(--shadow-brown);
  cursor: pointer;
}

.woocommerce #respond input#submit:hover, 
.woocommerce a.button:hover, 
.woocommerce button.button:hover, 
.woocommerce input.button:hover,
.woocommerce #respond input#submit.alt:hover, 
.woocommerce a.button.alt:hover, 
.woocommerce button.button.alt:hover, 
.woocommerce input.button.alt:hover {
  background: linear-gradient(135deg, var(--color-brown-dark), var(--color-brown));
  color: var(--color-white);
  transform: translateY(-2px);
  box-shadow: var(--shadow-brown-lg);
}

/* Cards de productos de WooCommerce */
.woocommerce ul.products li.product, 
.woocommerce-page ul.products li.product {
  background: var(--color-white);
  border-radius: var(--border-radius-xl);
  overflow: hidden;
  box-shadow: var(--shadow-md);
  transition: var(--transition-bounce);
  border: 1px solid var(--color-gray-bg);
  padding: 15px;
  position: relative;
}

.woocommerce ul.products li.product:hover, 
.woocommerce-page ul.products li.product:hover {
  transform: translateY(-5px);
  box-shadow: var(--shadow-xl);
  border-color: var(--color-brown-light);
}

.woocommerce ul.products li.product .woocommerce-loop-product__title, 
.woocommerce-page ul.products li.product .woocommerce-loop-product__title {
  color: var(--color-gray-dark);
  font-weight: var(--font-weight-bold);
  font-size: var(--font-size-base);
  margin-top: 10px;
  margin-bottom: 5px;
}

.woocommerce ul.products li.product .price, 
.woocommerce-page ul.products li.product .price {
  color: var(--color-brown);
  font-weight: var(--font-weight-bold);
  font-size: var(--font-size-lg);
}

/* Rating de estrellas */
.woocommerce .star-rating, 
.woocommerce-page .star-rating {
  color: var(--color-brown);
}

.woocommerce p.stars a, 
.woocommerce-page p.stars a {
  color: var(--color-brown);
}

/* Breadcrumbs de WooCommerce */
.woocommerce-breadcrumb {
  background: var(--color-gray-bg);
  padding: 12px 20px;
  border-radius: var(--border-radius-lg);
  margin-bottom: 25px;
  color: var(--color-gray);
  font-weight: var(--font-weight-medium);
}

.woocommerce-breadcrumb a {
  color: var(--color-brown);
  text-decoration: none;
}

.woocommerce-breadcrumb a:hover {
  color: var(--color-brown-dark);
  text-decoration: underline;
}

/* Widgets y filtros de barra lateral */
.woocommerce .widget_price_filter .ui-slider .ui-slider-range, 
.woocommerce-page .widget_price_filter .ui-slider .ui-slider-range {
  background-color: var(--color-brown);
}

.woocommerce .widget_price_filter .ui-slider .ui-slider-handle, 
.woocommerce-page .widget_price_filter .ui-slider .ui-slider-handle {
  background-color: var(--color-brown);
  border-color: var(--color-brown-dark);
}

/* Paginación de WooCommerce */
.woocommerce nav.woocommerce-pagination ul, 
.woocommerce-page nav.woocommerce-pagination ul {
  border: none;
  display: flex;
  gap: 8px;
  justify-content: center;
}

.woocommerce nav.woocommerce-pagination ul li, 
.woocommerce-page nav.woocommerce-pagination ul li {
  border: none;
  float: none;
}

.woocommerce nav.woocommerce-pagination ul li a, 
.woocommerce-page nav.woocommerce-pagination ul li a, 
.woocommerce nav.woocommerce-pagination ul li span, 
.woocommerce-page nav.woocommerce-pagination ul li span {
  color: var(--color-brown-dark);
  border: 1px solid var(--color-gray-lighter);
  background: var(--color-white);
  padding: 8px 12px;
  min-width: 44px;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--border-radius-md);
  text-decoration: none;
}

.woocommerce nav.woocommerce-pagination ul li a:hover,
.woocommerce nav.woocommerce-pagination ul li span.current,
.woocommerce-page nav.woocommerce-pagination ul li span.current {
  background-color: var(--color-brown);
  color: var(--color-white);
  border-color: var(--color-brown);
}

/* Badge de oferta */
.woocommerce span.onsale, 
.woocommerce-page span.onsale {
  background-color: var(--color-brown);
  color: var(--color-white);
  font-weight: var(--font-weight-bold);
  border-radius: var(--border-radius-full);
}
