/* * Custom Styles - MechatronicStore
 * Version: 2.1 - Optimizada
 * Última actualización: 2024
 */

/* =========================
   VARIABLES GLOBALES
   ========================= */
:root {
  --brand: #6017b1;
  --brand-dark: #5a0bb5;
  --brand-light: #7d21c7;
  --on-dark: #ffffff;
  --on-light: #2e2e2e;
  --border-lite: rgba(255,255,255,.9);
  --shadow: 0 4px 18px rgba(0,0,0,.14);
  --shadow-hover: 0 8px 26px rgba(0,0,0,.22);
  --banner-h: 44px;
  --velocidad-carrusel: 60s;
}

/* =========================
   TIPOGRAFÍA
   ========================= */
@font-face {
  font-family: 'Montserrat';
  src: url('/wp-content/fonts/montserrat/montserrat-v29-latin-regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root, body, button, input, select, textarea {
  font-family: 'Montserrat', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
}

/* =========================
   HEADER / TOPBAR
   ========================= */
#top-bar.header-top {
  background: var(--brand);
  color: var(--on-dark);
  border: 0;
  box-shadow: none;
  margin-top: 0;
  position: relative;
  z-index: 1000;
}

#top-bar .nav a,
#top-bar .button,
#top-bar .icon {
  color: var(--on-dark);
}

#top-bar h1, #top-bar h2, #top-bar h3,
#top-bar h4, #top-bar h5, #top-bar h6 {
  color: #fff;
}

.header, .header-wrapper, .header-top {
  border-top: 0;
}

/* Nav contacto */
.nav.nav-divided.nav-uppercase.header-contact {
  margin-left: 65px;
  margin-right: 45px;
}

#header-contact .nav-divided > li {
  margin: 0 .9em;
}

/* Search */
.search-field.mb-0 {
  background: #fff;
  border: 1px solid #ddd;
  border-radius: 12px 0 0 12px;
  box-shadow: inset 0 1px 5px 0 rgba(248,244,28,.18),
              0 0 8px rgba(106,13,173,.12);
  color: #333;
  font-size: .97em;
  height: 2.507em;
  width: 100%;
  padding: 0 .75em;
  transition: box-shadow .2s ease, border .2s ease;
}

.search-field.mb-0:focus {
  border-color: var(--brand);
  box-shadow: 0 0 0 3px rgba(106,13,173,.15);
}

.searchform .button.icon {
  margin: 0;
  border-radius: 12px;
}

/* =========================
   BOTONES UNIFICADOS
   ========================= */
#top-bar .header-button .button,
#top-bar .topbar .slide {
  --h: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: var(--h);
  padding: 0 18px;
  border-radius: 9999px;
  font-weight: 700;
  letter-spacing: .3px;
  line-height: 1;
  text-transform: uppercase;
  color: #fff;
  background: var(--brand);
  border: 1.5px solid var(--border-lite);
  box-shadow: var(--shadow);
  transition: transform .12s ease,
              box-shadow .12s ease,
              background .2s ease;
}

#top-bar .header-button .button:hover,
#top-bar .topbar .slide:hover {
  transform: translateY(-1px);
  box-shadow: var(--shadow-hover);
  background: var(--brand-dark);
}

/* Iconos sociales */
.html .social-icons .button {
  margin: 0 5px;
}

#top-bar .social-icons .button.is-outline {
  border-color: rgba(255,255,255,.7);
  color: #fff;
}

#top-bar .social-icons .button.is-outline:hover {
  border-color: #fff;
}

/* Badge "NUEVO" visible en botón SOLICITAR COTIZACIÓN */
#top-bar .topbar {
  position: relative;
}

#top-bar .topbar .slide {
  position: relative;
  overflow: visible !important;
}

#top-bar .topbar .slide::after {
  position: absolute !important;
  top: -4px !important;
  right: 0 !important;
  left: auto !important;
  bottom: auto !important;
  transform: none !important;
  z-index: 1 !important;
  font-size: 9px !important;
  padding: 2px 6px !important;
  border-radius: 8px !important;
  background: #FFD700 !important;
  color: #1a1a1a !important;
  font-weight: 700 !important;
  white-space: nowrap;
  line-height: 1;
  box-shadow: 0 2px 4px rgba(0,0,0,0.3);
}

/* =========================
   CHIPS SUBCATEGORÍAS
   ========================= */
.fl-category-button-container,
.subcat-buttons,
.fl-category-buttons,
.botones-subcategorias {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 10px 12px;
  margin-bottom: 28px;
}

.single-product .fl-category-button-container,
.single-product .botones-subcategorias {
  justify-content: flex-start;
  display: none;
}

.fl-category-button,
.boton-subcategoria,
.subcat-buttons a,
.rel-cats-chips a {
  display: inline-block;
  padding: 6px 14px;
  border-radius: 12px;
  background: var(--brand);
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  border: none;
  transition: box-shadow .2s ease,
              transform .12s ease,
              background .2s ease;
}

.fl-category-button:hover,
.boton-subcategoria:hover,
.subcat-buttons a:hover,
.rel-cats-chips a:hover {
  background: var(--brand-dark);
  color: #fff;
  box-shadow: 0 3px 10px rgba(0,0,0,.2);
  transform: translateY(-1px);
}

/* Categorías en single product */
.single-product .rel-cats-row {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin: 10px 0 18px;
}

.single-product .rel-cats-label {
  font-weight: 700;
  margin-right: 6px;
}

.single-product .rel-cats-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 12px;
}

/* =========================
   CATEGORÍAS Y PRODUCTOS MÁS VENDIDOS
   ========================= */

/* Centrar títulos de sección */
.cat-section-title {
  text-align: center;
  margin-bottom: 20px;
  font-size: 20px;
  font-weight: 700;
}

/* Sección de categorías relacionadas */
.related-cats {
  text-align: center;
  margin-bottom: 30px;
}

/* Contenedor productos más vendidos */
.productos-mas-vendidos {
  margin-bottom: 40px;
  text-align: center;
}

/* Lista de productos más vendidos - en fila */
.productos-mas-vendidos-lista {
  display: flex;
  justify-content: center;
  gap: 20px;
  list-style: none;
  padding: 0;
  margin: 0 auto;
  flex-wrap: wrap;
  max-width: 1200px;
}

/* Item individual */
.productos-mas-vendidos-item {
  flex: 0 1 calc(25% - 15px);
  max-width: 200px;
  text-align: center;
  margin: 0;
}

/* Enlaces */
.productos-mas-vendidos-item a {
  text-decoration: none;
  color: inherit;
  display: block;
  transition: transform .2s ease;
}

.productos-mas-vendidos-item a:hover {
  transform: translateY(-3px);
}

/* Imagen de productos más vendidos */
.productos-mas-vendidos-imagen {
  width: 100%;
  height: auto;
  display: block;
  margin-bottom: 10px;
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0,0,0,.1);
  transition: box-shadow .2s ease;
}

.productos-mas-vendidos-item a:hover .productos-mas-vendidos-imagen {
  box-shadow: 0 4px 12px rgba(0,0,0,.2);
}

/* Título de producto más vendido */
.productos-mas-vendidos-titulo-producto {
  display: block;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.3;
  color: #333;
  margin-top: 8px;
}

.productos-mas-vendidos-item a:hover .productos-mas-vendidos-titulo-producto {
  color: var(--brand);
}

/* Centrar título "Todos los productos" */
.cat-container {
  text-align: center;
  margin: 30px 0;
}

/* =========================
   PRODUCTOS GRID
   ========================= */
.product-category {
  display: none;
}

.box-image {
  aspect-ratio: 1/1;
  overflow: hidden;
}

.box-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* =========================
   TÍTULO DE PRODUCTO MEJORADO
   ========================= */
/* Barra morada del título de producto */
.product-page-title.featured-title {
  min-height: 72px !important;
  background: var(--brand) !important;
  padding: 26px 0 22px !important;
  margin-bottom: 0 !important;
  box-shadow: inset 0 -1px 0 rgba(255,255,255,.18);
}

/* Fondo interno no se usa */
.product-page-title .page-title-bg {
  display: none !important;
}

/* Centrar contenido */
.product-page-title .page-title-inner {
  justify-content: center !important;
  padding: 0 !important;
}

/* Ocultar columnas vacías */
.product-page-title .page-title-inner .flex-col:first-child,
.product-page-title .page-title-inner .flex-col.flex-right {
  display: none !important;
}

/* Columna central */
.product-page-title .page-title-inner .flex-col.flex-center {
  flex: 0 0 100% !important;
  max-width: 100% !important;
  text-align: center !important;
}

/* Título del producto */
.product-page-title h1.product-title {
  font-size: 26px !important;
  font-weight: 700 !important;
  margin: 0 0 6px !important;
  color: #fff !important;
  text-align: center !important;
}

/* Breadcrumbs */
.product-page-title .woocommerce-breadcrumb {
  justify-content: center !important;
  text-align: center !important;
  font-size: 13px !important;
  margin: 0 !important;
  color: rgba(255,255,255,.88) !important;
}

.product-page-title .woocommerce-breadcrumb a {
  color: #fff !important;
  text-decoration: underline;
  text-underline-offset: 3px;
  opacity: .95;
  transition: opacity .2s ease;
}

.product-page-title .woocommerce-breadcrumb a:hover {
  opacity: 1;
}

/* =========================
   SINGLE PRODUCT LAYOUT
   ========================= */

/* Ajustar espaciado principal */
.product-main {
  padding-top: 20px !important;
}

/* Ocultar sidebar */
#product-sidebar {
  display: none !important;
}

/* Galería optimizada */
.single-product .product-gallery.col.large-7 {
  flex: 0 0 60% !important;
  max-width: 60% !important;
}

/* Info producto optimizada */
.single-product .product-info.summary.col-fit {
  flex: 0 0 40% !important;
  max-width: 40% !important;
  padding-left: 40px !important;
}

/* Galería de imágenes */
.woocommerce-product-gallery__image {
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  aspect-ratio: 1/1;
  border-radius: 8px;
  overflow: hidden;
}

.woocommerce-product-gallery__image img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

/* Info summary */
.product-info.summary {
  content-visibility: auto;
  contain-intrinsic-size: 160px;
}

/* SKU tooltip */
.sku_wrapper {
  position: relative;
  cursor: pointer;
  display: inline-block;
}

.sku_wrapper::after {
  content: 'Haz clic para copiar el SKU';
  position: absolute;
  left: 50%;
  bottom: 110%;
  transform: translateX(-50%);
  background: #7c7c7c;
  color: #fff;
  padding: 4px 8px;
  font-size: 11px;
  border-radius: 4px;
  opacity: 0;
  pointer-events: none;
  transition: transform .2s ease-out, opacity .2s ease-out;
  white-space: nowrap;
}

.sku_wrapper:hover::after {
  opacity: 1;
  transform: translateX(-50%) translateY(-2px);
}

.sku_wrapper.copied::after {
  content: '¡Copiado!';
  background-color: #3b3b3b;
  animation: fadeOut 1.5s forwards;
}

/* =========================
   CARRUSELES MARCAS Y CLIENTES HOME
   ========================= */

@keyframes scroll-infinito {
  0% { 
    transform: translateX(0); 
  }
  100% { 
    /* Al usar margin en vez de gap, el 50% exacto funciona a la perfección */
    transform: translateX(-50%); 
  }
}

/* =========================================
   CARRUSEL MARCAS
   ========================================= */
.slider-container-marcas {
  width: 100%;
  height: 80px;
  overflow: hidden;
  position: relative;
  display: flex;
  align-items: center;
  -webkit-mask-image: linear-gradient(to right, transparent, #000 5%, #000 95%, transparent);
  mask-image: linear-gradient(to right, transparent, #000 5%, #000 95%, transparent);
  background: #fff;
}

.slide-track-marcas {
  display: flex;
  align-items: center;
  height: 100%;
  /* ELIMINAMOS EL GAP */
  width: max-content;
  animation: scroll-infinito var(--velocidad-carrusel) linear infinite;
  will-change: transform;
}

.slide-marcas {
  height: 50px;
  width: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin-right: 40px; 
}

.slide-marcas img {
  height: 100%;
  width: auto;
  max-width: 140px;
  object-fit: contain;
  transition: transform 0.3s ease;
}

.slide-marcas img:hover {
  transform: scale(1.1);
}

/* =========================================
   CARRUSEL CLIENTES
   ========================================= */
.uni-carrusel-container {
  width: 100%;
  height: 120px;
  overflow: hidden;
  position: relative;
  display: flex;
  align-items: center;
  margin-top: 20px;
  -webkit-mask-image: linear-gradient(to right, transparent, #000 5%, #000 95%, transparent);
  mask-image: linear-gradient(to right, transparent, #000 5%, #000 95%, transparent);
}

.uni-carrusel-track {
  display: flex;
  align-items: center;
  height: 100%;
  gap: 50px;
  width: max-content;
  animation: scroll-infinito var(--velocidad-carrusel) linear infinite;
  will-change: transform;
}

.uni-carrusel-slide {
  height: 70px;
  width: 120px;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
}

.uni-carrusel-slide img {
  max-height: 100%;
  max-width: 100%;
  object-fit: contain;
  /* Color original */
  transition: transform 0.3s;
}

.uni-carrusel-slide img:hover {
  transform: scale(1.1);
}

/* =========================================
   MÓVIL
   ========================================= */
@media (max-width: 767px) {
  .slider-container-marcas {
    height: 60px;
  }
  .slide-track-marcas {
    gap: 25px;
  }
  .slide-marcas {
    height: 35px;
  }

  .uni-carrusel-container {
    height: 90px;
  }
  .uni-carrusel-track {
    gap: 30px;
  }
  .uni-carrusel-slide {
    height: 50px;
    width: 90px;
  }
}
/* =========================
   BADGES
   ========================= */
.badge.callout.badge-circle::before,
.badge.callout.badge-circle::after,
.badge.callout.badge-circle .badge-inner::before,
.badge.callout.badge-circle .badge-inner::after{
  display:none !important;
  content:none !important;
}

.badge.callout.badge-circle .badge-inner{
  background:none !important;
  border:none !important;
  border-radius:0 !important;
  position:static !important;
  padding:0 !important;
  margin:0 !important;
  width:auto !important;
  height:auto !important;
  box-shadow:none !important;
}

.badge-container.absolute.left.top.z-1{
  top:0 !important;
  left:0 !important;
  right:auto !important;
  margin:0 !important;
}

/* Badge NUEVO - Azul con letra blanca */
.badge.callout.badge-circle .badge-inner.new-bubble-auto,
.badge.callout.badge-circle .badge-inner.new-bubble,
.badge.callout.badge-circle .badge-inner.callout-new-bg{
  background-color:#0066cc !important;  /* Azul */
  color:#fff !important;                /* Letra blanca */
  font-size:11px !important;            /* Tamaño pequeño */
  font-weight:600 !important;
  text-transform:uppercase !important;
  padding:4px 10px !important;          /* Padding reducido */
  border-radius:4px !important;         /* Esquinas menos redondeadas */
  position:absolute !important;
  top:10px !important;                  /* Posición superior */
  left:10px !important;                 /* Posición izquierda */
  z-index:9 !important;
  box-shadow:0 2px 4px rgba(0,0,0,.2) !important;
  letter-spacing:0.5px !important;
  display:inline-block !important;
  line-height:1.2 !important;
}

/* Badge OFERTA - Negro */
.badge.callout.badge-circle .badge-inner.onsale-bubble,
.badge.callout.badge-circle .badge-inner.onsale-bubble-auto,
.woocommerce span.onsale, .onsale{
  background-color:rgba(0,0,0,.8) !important;
  color:#fff !important;
  font-size:12px !important;
  text-transform:uppercase !important;
  padding:6px 12px !important;
  border-radius:12px !important;
  position:absolute !important;
  top:40px !important;
  left:10px !important;
  z-index:9 !important;
  box-shadow:0 2px 5px rgba(0,0,0,.3) !important;
  letter-spacing:1px !important;
  display:inline-block !important;
  line-height:normal !important;
}

/* =========================
   BANNER FIJO SUPERIOR
   ========================= */
.banner-container-fixed {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: var(--banner-h);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 16px;
  color: #fff;
  background: linear-gradient(180deg, #121212 -50%, var(--brand) 200%, #000000 250%);
  background-size: 140% 100%;
  animation: bannerShift 22s ease-in-out infinite alternate;
  z-index: 1200;
}

.banner-container-fixed p {
  margin: 0;
  font-weight: 700;
  letter-spacing: .2px;
}

#wrapper {
  margin-top: var(--banner-h);
}
/* preguntas frecuentes*/

/* FAQ MechatronicStore v2: limpio, con acento morado */
.single-product .panel.entry-content details{
  background:#fff;
  border:1px solid #ece6f6;
  border-left:4px solid var(--brand);
  border-radius:12px;
  margin:12px 0 16px 0;
  overflow:hidden;
}

.single-product .panel.entry-content summary{
  display:flex;
  align-items:center;
  gap:10px;
  padding:14px 16px;
  cursor:pointer;
  font-weight:700;
  color:#2e2e2e;
  line-height:1.4;
  list-style:none;
  background:#fff;
}

.single-product .panel.entry-content summary::-webkit-details-marker{display:none;}

.single-product .panel.entry-content summary::after{
  content:"";
  width:10px;
  height:10px;
  border-right:2px solid var(--brand);
  border-bottom:2px solid var(--brand);
  transform:rotate(-45deg);
  transition:transform .2s ease;
  opacity:.9;
  margin-left:auto;
}

.single-product .panel.entry-content details[open]{border-color:var(--brand);}


/* FAQ unificado: producto, categorías y subcategorías */
:where(.single-product .panel.entry-content, .tax-product_cat .term-description) details{
  background:#fff;
  border:1px solid #ece6f6;
  border-left:4px solid var(--brand);
  border-radius:12px;
  margin:12px 0 16px;
  overflow:hidden;
}

:where(.single-product .panel.entry-content, .tax-product_cat .term-description) summary{
  display:flex;
  align-items:center;
  gap:10px;
  padding:14px 16px;
  cursor:pointer;
  font-weight:700;
  color:#2e2e2e;
  line-height:1.4;
  list-style:none;
  background:#fff;
}

:where(.single-product .panel.entry-content, .tax-product_cat .term-description) summary::-webkit-details-marker{display:none;}

:where(.single-product .panel.entry-content, .tax-product_cat .term-description) summary::after{
  content:"";
  width:10px;
  height:10px;
  border-right:2px solid var(--brand);
  border-bottom:2px solid var(--brand);
  transform:rotate(-45deg);
  transition:transform .2s ease;
  opacity:.9;
  margin-left:auto;
}

:where(.single-product .panel.entry-content, .tax-product_cat .term-description) details[open]{border-color:var(--brand);}

:where(.single-product .panel.entry-content, .tax-product_cat .term-description) details[open] summary{
  background:var(--brand);
  color:#fff;
}

:where(.single-product .panel.entry-content, .tax-product_cat .term-description) details[open] summary::after{
  border-right:2px solid #fff;
  border-bottom:2px solid #fff;
  transform:rotate(45deg);
}

:where(.single-product .panel.entry-content, .tax-product_cat .term-description) details[open] summary:hover{
  background:var(--brand-dark);
}

:where(.single-product .panel.entry-content, .tax-product_cat .term-description) details[open] summary:focus{
  outline:3px solid rgba(255,255,255,.45);
  outline-offset:3px;
}

:where(.single-product .panel.entry-content, .tax-product_cat .term-description) details > *:not(summary){padding:0 16px 16px;}
:where(.single-product .panel.entry-content, .tax-product_cat .term-description) p{margin:12px 0;}
:where(.single-product .panel.entry-content, .tax-product_cat .term-description) ul{list-style:disc; margin:8px 0 0 1.2em; padding-left:0;}
:where(.single-product .panel.entry-content, .tax-product_cat .term-description) ul ul{list-style:circle; margin-top:4px;}
:where(.single-product .panel.entry-content, .tax-product_cat .term-description) li{margin:6px 0; line-height:1.55;}
:where(.single-product .panel.entry-content, .tax-product_cat .term-description) a{color:var(--brand); text-decoration:underline; text-underline-offset:3px;}
:where(.single-product .panel.entry-content, .tax-product_cat .term-description) summary:focus{outline:3px solid rgba(96,23,177,.30); outline-offset:3px; border-radius:10px;}

/* Títulos y tablas dentro de descripción en producto y categorías */
:where(.single-product .panel.entry-content, .tax-product_cat .term-description) h2,
:where(.single-product .panel.entry-content, .tax-product_cat .term-description) h3{
  font-weight:700;
  line-height:1.3;
  margin:24px 0 12px;
  font-size:20px;
}

:where(.single-product .panel.entry-content, .tax-product_cat .term-description) table{
  width:100%;
  border-collapse:collapse;
  margin:10px 0 16px;
  font-size:15px;
  line-height:1.45;
  background:#fff;
  border-radius:8px;
  overflow:hidden;
  box-shadow:0 1px 4px rgba(0,0,0,.05);
}
:where(.single-product .panel.entry-content, .tax-product_cat .term-description) table th,
:where(.single-product .panel.entry-content, .tax-product_cat .term-description) table td{
  border:1px solid #e6e6e6;
  padding:10px 12px;
  text-align:left;
  vertical-align:top;
  color:#2e2e2e;
  font-weight:400;
}
:where(.single-product .panel.entry-content, .tax-product_cat .term-description) thead th{
  background:rgba(96,23,177,.10);
  color:#2e2e2e;
  font-weight:600;
}

/* TOC [lwptoc] con acento de marca también en categorías */
:where(.single-product .panel.entry-content, .tax-product_cat .term-description) .lwptoc{
  background:#fff;
  border:1px solid #ece6f6;
  border-left:4px solid var(--brand);
  border-radius:12px;
  padding:12px 14px;
  margin:12px 0 18px;
}
:where(.single-product .panel.entry-content, .tax-product_cat .term-description) .lwptoc_title{color:#333;}
:where(.single-product .panel.entry-content, .tax-product_cat .term-description) .lwptoc_items a{color:#2e2e2e;}
:where(.single-product .panel.entry-content, .tax-product_cat .term-description) .lwptoc_items a:hover{color:var(--brand);}
:where(.single-product .panel.entry-content, .tax-product_cat .term-description) .lwptoc_toggle .lwptoc_toggle_label{color:var(--brand);}





/* Estado abierto: morado sólido y texto blanco */
.single-product .panel.entry-content details[open] summary{
  background:var(--brand);
  color:#fff;
}

/* Flecha blanca cuando está abierto */
.single-product .panel.entry-content details[open] summary::after{
  border-right:2px solid #fff;
  border-bottom:2px solid #fff;
}

/* Hover y focus con buen contraste en el estado abierto */
.single-product .panel.entry-content details[open] summary:hover{
  background:var(--brand-dark);
}
.single-product .panel.entry-content details[open] summary:focus{
  outline:3px solid rgba(255,255,255,.45);
  outline-offset:3px;
}
.single-product .panel.entry-content details[open] summary::after{transform:rotate(45deg);}

.single-product .panel.entry-content details > *:not(summary){padding:0 16px 16px 16px;}
.single-product .panel.entry-content details p{margin:12px 0;}
.single-product .panel.entry-content details ul{list-style:disc; margin:8px 0 0 1.2em; padding-left:0;}
.single-product .panel.entry-content details ul ul{list-style:circle; margin-top:4px;}
.single-product .panel.entry-content details li{margin:6px 0; line-height:1.55;}
.single-product .panel.entry-content details a{color:var(--brand); text-decoration:underline; text-underline-offset:3px;}
.single-product .panel.entry-content summary:focus{outline:3px solid rgba(96,23,177,.30); outline-offset:3px; border-radius:10px;}

/* Títulos y tabla dentro de la descripción, a juego con la marca */
.single-product .panel.entry-content h2,
.single-product .panel.entry-content h3{
  font-weight:700;
  line-height:1.3;
  margin:24px 0 12px;
  font-size:20px;
}

.single-product .panel.entry-content table{
  width:100%;
  border-collapse:collapse;
  margin:10px 0 16px;
  font-size:15px;
  line-height:1.45;
  background:#fff;
  border-radius:8px;
  overflow:hidden;
  box-shadow:0 1px 4px rgba(0,0,0,.05);
}
.single-product .panel.entry-content table th,
.single-product .panel.entry-content table td{
  border:1px solid #e6e6e6;
  padding:10px 12px;
  text-align:left;
  vertical-align:top;
  color:#2e2e2e;
  font-weight:400;
}
.single-product .panel.entry-content table thead th{
  background:rgba(96,23,177,.10);
  color:#2e2e2e;
  font-weight:600;
}

/* Listas normales de la descripción (Contenido del Paquete) */
.single-product .panel.entry-content > ul,
.single-product .panel.entry-content ul{list-style:disc; margin-left:1.2em;}
.single-product .panel.entry-content ol{list-style:decimal; margin-left:1.2em;}
.single-product .panel.entry-content li{margin:6px 0; line-height:1.5; color:#2e2e2e;}

/* Imágenes embebidas de la descripción */
.single-product .panel.entry-content img{
  max-width:100%;
  height:auto;
  border-radius:8px;
  display:inline-block;
  margin:6px 4px 10px 0;
  box-shadow:0 2px 6px rgba(0,0,0,.08);
}

/* Opcional: [lwptoc] con acento de marca para que combine */
.single-product .panel.entry-content .lwptoc{
  background:#fff;
  border:1px solid #ece6f6;
  border-left:4px solid var(--brand);
  border-radius:12px;
  padding:12px 14px;
  margin:12px 0 18px;
}
.single-product .panel.entry-content .lwptoc_title{color:#333;}
.single-product .panel.entry-content .lwptoc_items a{color:#2e2e2e;}
.single-product .panel.entry-content .lwptoc_items a:hover{color:var(--brand);}
.single-product .panel.entry-content .lwptoc_toggle .lwptoc_toggle_label{color:var(--brand);}

/* =========================
   UTILIDADES
   ========================= */
.round {
  border-radius: 12px;
}

.nav-dropdown li a:hover {
  color: #fff;
  text-shadow: 1px 1px 4px rgba(0,0,0,0.7);
}

/* Ocultar elementos específicos */
.woocommerce div.product .posted_in,
.woocommerce div.product .tagged_as,
.single-product .product_meta .posted_in,
.single-product .page-title .flex-col:first-child {
  display: none;
}

/* =========================
   ANIMACIONES
   ========================= */
@keyframes fadeOut {
  0% { opacity: 1; }
  100% { opacity: 0; transform: scale(.9); }
}

@keyframes bannerShift {
  0% { background-position: 0% 0; }
  100% { background-position: 100% 0; }
}

/* Animación del carrusel de marcas */
@keyframes scroll-infinito {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}
@-webkit-keyframes scroll-infinito {
  from { -webkit-transform: translateX(0); }
  to { -webkit-transform: translateX(-50%); }
}
@-moz-keyframes scroll-infinito {
  from { -moz-transform: translateX(0); }
  to { -moz-transform: translateX(-50%); }
}

/* Animación del carrusel de universidades */
@keyframes uni-carrusel-scroll {
  from { transform: translateX(0); }
  to { transform: translateX(calc(-1 * var(--loop-distance))); }
}
@-webkit-keyframes uni-carrusel-scroll {
  from { -webkit-transform: translateX(0); }
  to { -webkit-transform: translateX(calc(-1 * var(--loop-distance))); }
}

/* =========================
   RESPONSIVE
   ========================= */
@media (max-width: 1200px) {
  .single-product .product-gallery.col.large-7 {
    flex: 0 0 55% !important;
    max-width: 55% !important;
  }

  .single-product .product-info.summary.col-fit {
    flex: 0 0 45% !important;
    max-width: 45% !important;
    padding-left: 30px !important;
  }

  /* --- Carrusel Marcas --- */
  .slide-track-marcas {
    --logo-height-general: 40px;
    --logo-width-general: 120px;
  }
  .slide-marcas.logo-arduino {
    width: 140px !important;
  }
  .slide-marcas.logo-volture {
    width: 150px !important;
  }
  .slide-marcas.logo-dfrobot {
    width: 160px !important;
  }
  .slide-marcas.logo-nvidia {
    width: 160px !important;
  }
  .slide-marcas.logo-seeed {
    width: 120px !important;
  }
}

@media (max-width: 1052px) {
  li.html.custom.html_top_right_text {
    display: none;
  }
}

@media (max-width: 1024px) {
  html, body {
    width: 100%;
    overflow-x: hidden;
  }

  .banner-container-fixed {
    position: sticky;
    top: 0;
    z-index: 80;
    padding: 8px;
    font-size: 14px;
  }

  html.mfp-open .banner-container-fixed,
  body.off-canvas .banner-container-fixed,
  html.off-canvas-open .banner-container-fixed,
  html.mm-opened .banner-container-fixed,
  body.nav-open .banner-container-fixed {
    display: none;
  }

  #wrapper {
    margin-top: 0;
  }

  #top-bar .header-button .button,
  #top-bar .topbar .slide {
    height: 38px;
    padding: 0 16px;
  }

  .box-text {
    font-size: 82%;
  }

  .category-filter-row {
    display: none;
  }

  .sku_wrapper::after {
    font-size: 10px;
    bottom: 130%;
    max-width: 85vw;
  }

  /* --- Carrusel Unis --- */
  .uni-carrusel-container {
    height: 140px;
  }
  .uni-carrusel-slide {
    height: 100px;
  }
}

@media (max-width: 849px) {
  /* En móvil: columnas completas con padding lateral */
  .single-product .product-gallery.col.large-7,
  .single-product .product-info.summary.col-fit {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  .product-page-title h1.product-title {
    font-size: 22px !important;
  }

  /* Texto justificado para descripción más prolija */
  .single-product .product-short-description,
  .single-product .product-short-description p,
  .single-product .panel.entry-content p {
    text-align: justify !important;
    line-height: 1.6 !important;
  }

  /* Jerarquía del precio más destacada */
  .single-product .price {
    font-size: 28px !important;
    font-weight: 700 !important;
    margin-bottom: 16px !important;
  }

  .single-product .price .woocommerce-Price-amount {
    font-size: 28px !important;
  }

  /* Espaciado vertical consistente */
  .single-product .product-info > * {
    margin-bottom: 20px !important;
  }

  .single-product .product-short-description {
    margin-bottom: 24px !important;
  }

  .single-product .cart {
    margin-top: 24px !important;
    margin-bottom: 24px !important;
  }

 
  /* Thumbnails de producto más grandes para mejor usabilidad táctil */
  .product-gallery ul li {
    flex: 0 0 60px !important;
    width: 60px !important;
    height: 60px !important;
  }

  .product-gallery ul li img {
    width: 60px !important;
    height: 60px !important;
    object-fit: cover !important;
    border-radius: 4px !important;
  }

  .product-gallery ul {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    justify-content: center !important;
    padding: 12px 0 !important;
  }

  /* Breadcrumbs más sutiles - texto completo visible */
  .single-product .breadcrumb-row,
  .single-product nav.breadcrumb,
  .single-product .breadcrumbs,
  .single-product [aria-label="Breadcrumb"] {
    font-size: 10px !important;
    opacity: 0.85 !important;
    margin-bottom: 8px !important;
  }

  .single-product .breadcrumb-row a,
  .single-product nav.breadcrumb a,
  .single-product .breadcrumbs a,
  .single-product [aria-label="Breadcrumb"] a {
    color: rgba(255, 255, 255, 0.9) !important;
    text-decoration: none !important;
  }
}

@media (max-width: 768px) {
  #top-bar.header-top {
    background: linear-gradient(180deg, var(--brand) 0%, var(--brand-dark) 100%);
  }

  #top-bar .header-button .button {
    box-shadow: 0 3px 12px rgba(0,0,0,.18);
  }

  /* Productos más vendidos responsive */
  .productos-mas-vendidos-item {
    flex: 0 1 calc(50% - 10px);
  }

  .cat-section-title {
    font-size: 18px;
  }

  /* --- Carrusel Marcas --- */
  .slider-container-marcas {
    height: 55px !important;
  }
  .slide-track-marcas {
    --logo-height-general: 36px;
    --logo-width-general: 100px;
  }
  .slide-marcas.logo-arduino {
    width: 140px !important;
    margin-right: 3px !important;
  }
  .slide-marcas.logo-volture {
    width: 130px !important;
    margin-right: 5px !important;
  }
  .slide-marcas.logo-dfrobot {
    width: 140px !important;
    margin-right: 10px !important;
  }
  .slide-marcas.logo-nvidia {
    width: 140px !important;
    margin-right: 20px !important;
  }
  .slide-marcas.logo-seeed {
    width: 110px !important;
    margin-right: 15px !important;
  }
  .slide-marcas.logo-pololu,
  .slide-marcas.logo-fnirsi,
  .slide-marcas.logo-harden,
  .slide-marcas.logo-sunlu {
    width: 130px !important;
    margin-left: 15px !important;
    margin-right: 15px !important;
  }

  /* --- Carrusel Unis --- */
  .uni-carrusel-container {
    height: 110px;
  }
  .uni-carrusel-slide {
    height: 80px;
  }
}


/* Forzar animación de clientes ignorando estilos en línea basura */
.uni-carrusel-track {
    animation: scroll-infinito 60s linear infinite !important;
}

@media (max-width: 480px) {
  /* Productos más vendidos móvil */
  .productos-mas-vendidos-item {
    flex: 0 1 100%;
    max-width: 150px;
  }

  .productos-mas-vendidos-lista {
    gap: 15px;
  }
}

/* Accesibilidad para reducir movimiento */
@media (prefers-reduced-motion: reduce) {
  .uni-carrusel-track {
    animation: none;
    -webkit-animation: none;
    transform: translateX(0);
  }

  /* (Opcional) Pausar también el de marcas si se desea */
  /*
  .slide-track-marcas {
    animation: none !important;
    -webkit-animation: none !important;
  }
  */
}

/* Badge "Nuevo" para botón Solicitar Cotización */
.html_top_right_text .topbar {
  position: relative;
}

.html_top_right_text .topbar .slide {
  position: relative;
}

.html_top_right_text .topbar .slide::after {
  content: "NUEVO";
  position: absolute;
  top: -8px;
  right: -12px;
  background: #FFD700;
  color: #1a1a1a;
  font-size: 9px;
  font-weight: 700;
  padding: 2px 6px;
  border-radius: 8px;
  line-height: 1;
  letter-spacing: 0.5px;
  box-shadow: 0 2px 4px rgba(0,0,0,0.3);
  animation: pulse-badge 2s ease-in-out infinite;
}

@keyframes pulse-badge {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.08); }
}
.rll-youtube-player {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.rll-youtube-player iframe,
.rll-youtube-player > div {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

div[style*="padding-top: 56.25%"] {
  padding-top: 0;
  aspect-ratio: 16 / 9;
}

/* Forzar Montserrat local en formularios de Klaviyo */
div[class^="klaviyo-form"] *, 
div[class*="klaviyo-form"] *,
.klaviyo-form * {
    font-family: 'Montserrat', sans-serif !important;
}