/* ===== Variables globales ===== */
:root {
  --max-width: 1200px;   /* ancho máximo del layout */
  --surface: #0e2a47;    /* azul metálico oscuro */
  --text: #e9f1fb;       /* texto claro */
  --orange: #FB8C00;     /* acento naranja */
  --border: #274563;     /* borde azul más claro */
  --bg: #0b1a2e;         /* fondo general */
  --green: #25D366;      /* WhatsApp */
  --menu: #FB8C00;       /* color del texto de menú */
}

/* ===== Reset y base ===== */
* { box-sizing: border-box; }
html, body { overflow-x: hidden; }
body {
  font-family: 'Montserrat', system-ui, -apple-system, sans-serif;
  background: var(--bg);
  color: var(--text);
  margin-top: 180px; /* suma la altura del header + barra de búsqueda */
}
a { color: inherit; text-decoration: none; }

.container {
  width: var(--max-width);
  max-width: 100%;
  margin: 0 auto;
  padding: 1rem;
}


/* ===== Encabezado ===== */
.site-header {
  background: linear-gradient(to bottom, var(--header-top) 0%, var(--surface) 50%, var(--header-bottom) 100%) !important;
  color: var(--text) !important;
  border-bottom: 1px solid var(--border) !important;
  position: fixed;
  top: 0; left: 0;
  width: 100%;
  z-index: 100;
}

.topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: .35rem 0;
}

.logo img {
  max-height: 120px;
  max-width: 450px;
  height: auto;
  width: auto;
  background-color: transparent;
  filter: drop-shadow(0 0 2px rgba(255, 255, 255, 0.3));
}

.logo .logo-text {
  font-weight: 700;
  letter-spacing: .5px;
  background: var(--orange) !important;
  color: #000 !important;
  padding: .35rem .55rem;
  border-radius: 4px;
}

/* ===== Menú principal ===== */
.main-nav {
  border-top: 2px solid var(--text);
  border-bottom: 2px solid var(--text);
  padding: .6rem 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem; /* espacio entre menú y buscador */
}

.main-nav .menu-h {
  display: flex;
  gap: 1.5rem;
  justify-content: center;
  margin: 0;
  padding: 0;
}
.main-nav .menu-h li { list-style: none; }

.site-header a,
.main-nav .menu-h a {
  color: var(--menu) !important;
}
.main-nav .menu-h a {
  padding: .4rem .6rem;
  border-radius: 6px;
}
.main-nav .menu-h a:hover {
  background: rgba(255,255,255,.08) !important;
  color: var(--text) !important;
}

/* ===== Buscador integrado en menú ===== */
.menu-search {
  margin-left: 1rem; /* separación respecto al último ítem */
}

.menu-search .search-form {
  display: inline-block;
}

#menu-search-input {
  width: 220px;              /* ancho fijo en escritorio */
  padding: .4rem .6rem;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: #fff;
  color: #222;
  font-size: 0.9rem;
}

/* ===== Redes sociales en header ===== */
.social-links { display: flex; gap: .5rem; margin-left: auto; }
.social-links a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #fff;
  color: #000;
  font-size: 16px;
  text-decoration: none;
  border: 1px solid var(--border);
}
.social-links i { font-size: 18px; color: inherit; }
.social-facebook { color: #1877f2; }
.social-instagram { color: #e4405f; }
.social-tiktok { color: #000; }
.social-youtube { color: #ff0000; }

/* ===== Buscador ===== */
.search-wrap {
  background: linear-gradient(to bottom, var(--surface) 0%, #1a3d66 100%);
  padding: .5rem 0;
  position: fixed;
  top: 208px;
  width: 100%;
  z-index: 99;
  border-bottom: 1px solid var(--border);
  display: flex;
  justify-content: center;
}
.search-wrap .container {
  max-width: var(--max-width);
  width: 100%;
  padding: 0 1rem;
}
#ricsu-ajax-search {
  width: 100%;
  padding: .6rem .8rem;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: #fff;
  color: #222;
}
#ricsu-ajax-results {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 6px;
  margin-top: .5rem;
  box-shadow: 0 6px 20px rgba(0,0,0,.08);
  max-height: 400px; 
  overflow-y: auto;
}
#ricsu-ajax-results .result-item {
  display: flex; align-items: center; gap: .6rem;
  padding: .5rem;
  border-bottom: 1px solid var(--border);
  color: #222;
}
#ricsu-ajax-results img {
  max-width: 120px;
  max-height: 100px;
  width: auto;
  height: auto;
  object-fit: contain;
  border-radius: 6px;
  background: #fff;
  flex-shrink: 0;
  display: block;
}


/* ===== Catálogo ===== */
.shop-container {
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 1rem;
  padding: 1rem 0;
}
@media (max-width:768px){ .shop-container { grid-template-columns: 1fr; } }

.filters {
  background: var(--filters);
  color: var(--filters-text);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 1rem;
}

/* Título del catálogo */
.catalog-title {
  color: var(--text);
  font-size: 3rem;      /* más grande */
  font-weight: 700;
  margin-bottom: 0.5rem;
}

/* Estado de página (Pág. 1 de 1) */
#catalog-page-info {
  font-size: 1.6rem;    /* aumenta tamaño */
  font-weight: 600;
  color: var(--text);   /* mantiene color claro */
  margin-bottom: 0.25rem;
}

/* Ruta de filtros aplicados */
#catalog-filters-route {
  font-size: 1rem;
  font-weight: 600;
  color: var(--orange); /* naranja, respeta tu diseño */
  margin-bottom: 1rem;
}



/* ===== Filtros por taxonomía ===== */
.filter-block {
  margin-bottom: 1rem;
  background: var(--filters);       /* fondo personalizable desde WP */
  color: var(--filters-text);       /* texto personalizable desde WP */
  border-radius: 6px;
  padding: .5rem;
}

.filter-block h3 {
  margin: 0 0 .5rem;
  color: var(--filters-text);       /* títulos de filtros */
}

.filter-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.filter-list li {
  margin: .25rem 0;
  color: var(--filters-text);       /* opciones de filtros */
}

.term-image-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: .5rem;
}
.term-card {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: .5rem;
  text-align: center;
  color: #222;
}
.term-card .term-name {
  font-size: 0.65rem; /* antes era ~1rem, ahora casi la mitad */
  line-height: 1.2;
  font-weight: 600;
  word-break: break-word;
  text-align: center;
  max-width: 100%;
  overflow-wrap: break-word;
  white-space: normal;
}


.term-media img { width: 64px; height: 64px; object-fit: contain; }
.term-initial {
  width: 64px;
  height: 64px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #efefef;
  border: 1px solid var(--border);
  border-radius: 8px;
  font-weight: 700;
}

/* ===== Grid de productos ===== */
.product-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 1rem;
}
@media (max-width:768px){ .product-grid { grid-template-columns: repeat(2, minmax(0,1fr)); } }

.product-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 10px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: auto;
  min-height: 360px;
  padding-bottom: 1rem;
  min-width: 0;
}
.product-info {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 0 1rem;
}
.product-thumb img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: #fff;
  padding: .25rem;
  transition: transform .25s ease;
}

.product-title {
  font-size: 1.35rem;
    padding: .75rem 1rem;
  font-weight: 600;
  color: var(--text);
  line-height: 1.2;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  /* Compatibilidad estándar pedida por el linter */
  line-clamp: 2;
  overflow: hidden;
  text-overflow: ellipsis;
  max-height: 3.4em;
}

.price {
  color: var(--orange);
  font-weight: 700;
  padding: 0 1rem .75rem;
  margin-top: auto;
  min-height: 1.5rem;
  font-size: 1.2rem;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: block;
}

.actions {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  padding: 0.5rem 1rem 0.5rem !important;
  margin-top: 0.5rem !important;
  align-items: center !important;
  justify-content: flex-start !important;
}

.actions .button,
.btn-wishlist,
.btn-compare,
.btn-whatsapp {
  padding: .5rem .75rem;
  border-radius: 6px;
  border: 1px solid var(--border);
  cursor: pointer;
  font-weight: 600;
  background: #fff;
  color: #222;
}
.btn-whatsapp {
  background: transparent !important;
  border: none !important;
  text-decoration: none !important;
    display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}


/* ===== Ficha de producto ===== */
.single-product.full-width {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem;
  height: auto !important;       /* deja que el contenido fluya */
  min-height: calc(100vh - 180px); /* opcional: asegura altura mínima */
  overflow: visible !important;
  padding: 1rem 0;
}
@media (max-width:768px){
  .single-product.full-width { grid-template-columns: 1fr; }
}


.single-gallery {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 1rem;
  position: sticky;
  top: 0;   /* antes estaba 280px */
  align-self: start;
}

.single-gallery img { width: 100%; border-radius: 8px; }

/* === Flechas de navegación en la galería === */
.single-gallery {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

.nav-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(0,0,0,0.5);
  color: white;
  border: none;
  font-size: 2rem;
  padding: 0.5rem 1rem;
  cursor: pointer;
  z-index: 2;
}

.nav-arrow.prev {
  left: 10px;
}

.nav-arrow.next {
  right: 10px;
}


.thumbs {
  display: flex;
  gap: .5rem;
  margin-top: .5rem;
  flex-wrap: wrap;
}
.thumbs img {
  width: 60px;
  height: 60px;
  object-fit: cover;
  cursor: pointer;
  border: 1px solid var(--border);
  border-radius: 6px;
}
#main-image { cursor: zoom-in; transition: transform .3s ease; }
#main-image.zoomed { transform: scale(1.5); cursor: zoom-out; }

.single-info h1 { margin: 0 0 .5rem; color: var(--text); }
.single-info {
  overflow: visible !important;
  padding-right: 1rem;
  height: auto !important;
  align-self: start;   /* fuerza a alinearse con la parte superior del grid */
}


.single-actions .button {
  background: #fff;
  color: #222;
  border: 1px solid var(--border);
}

/* ===== Sidebars ===== */
.content-area { width: 100% !important; }
.sidebar, .woocommerce-sidebar { display: none !important; }

/* ===== WhatsApp sidebar ===== */
.whatsapp-sidebar {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 100;
}
.whatsapp-toggle {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: var(--green);
  color: #fff;
  font-size: 24px;
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 2px 6px rgba(0,0,0,0.2);
}
.whatsapp-panel {
  display: none;
  background: var(--surface);
  border: 1px solid var(--border);
  border-right: none;
  padding: .5rem;
}
.whatsapp-panel a {
  display: block;
  padding: .25rem .5rem;
  color: var(--text);
  text-decoration: none;
}

/* ===== Price filter ===== */

.ui-slider-handle {
  z-index: 2;
}


.widget_price_filter .button {
  background: var(--orange);
  color: #000;
  border: none;
  border-radius: 6px;
  padding: .4rem .6rem;
}

/* ===== Modal comparar ===== */
.compare-modal {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.35);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 100;
}
.compare-dialog {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  width: 90%;
  max-width: 600px;
  padding: 1rem;
  color: var(--text);
  position: relative;
}
.compare-close {
  position: absolute;
  right: 16px;
  top: 8px;
  background: none;
  border: none;
  color: var(--text);
  font-size: 24px;
  cursor: pointer;
}
#compare-search {
  width: 100%;
  padding: .6rem .8rem;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: #fff;
  color: #222;
}
.compare-results {
  margin-top: .75rem;
  max-height: 300px;
  overflow: auto;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #fff;
}
.compare-item {
  display: flex;
  align-items: center;
  gap: .6rem;
  padding: .5rem;
  border-bottom: 1px solid var(--border);
  cursor: pointer;
  color: #222;
}
.compare-item.selected { background: #f1f1f1; }
.compare-continue {
  margin-top: .75rem;
  background: var(--orange);
  color: #000;
  border: none;
  border-radius: 8px;
  padding: .5rem .75rem;
  cursor: pointer;
}

/* ===== Footer ===== */
.site-footer {
  background: var(--surface);
  color: var(--text);
  padding: 0.5rem 1rem !important; 
  font-size: 0.8rem !important;
  border-top: 1px solid var(--border);
}
.footer-widgets {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap: 0.5rem !important;
}
.legal a { color: inherit; text-decoration: underline; }

/* ===== Botón overlay para abrir visor ===== */
.open-full-gallery {
  position: absolute;
  right: 12px;
  top: 12px;
  z-index: 5;
  background: rgba(0,0,0,.6);
  color: #fff;
  width: 36px;
  height: 36px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255,255,255,.25);
  text-decoration: none;
  font-size: 18px;
  backdrop-filter: saturate(140%) blur(4px);
}
.open-full-gallery:hover { background: rgba(0,0,0,.8); }

/* ===== Visor a pantalla completa ===== */
.viewer-wrap {
  position: fixed;
  inset: 0;
  background: #000;
  display: grid;
  grid-template-rows: auto 1fr auto;
  row-gap: 8px;
  color: #fff;
  z-index: 999;
}
.viewer-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 16px;
}
.viewer-title { font-weight: 700; }
.viewer-main {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.viewer-main img {
  max-width: 95vw;
  max-height: 80vh;
  object-fit: contain;
  box-shadow: 0 0 20px rgba(0,0,0,.6);
}
.viewer-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
  color: #fff;
  font-size: 36px;
  cursor: pointer;
  opacity: .85;
}
.viewer-prev { left: 16px; }
.viewer-next { right: 16px; }
.viewer-close {
  background: none;
  border: 1px solid #444;
  color: #fff;
  padding: .4rem .65rem;
  border-radius: 8px;
  cursor: pointer;
}
.viewer-bottom {
  padding: 8px 16px;
  overflow-x: auto;
  white-space: nowrap;
}
.viewer-thumb {
  display: inline-block;
  margin-right: 6px;
  border: 2px solid transparent;
  border-radius: 6px;
  cursor: pointer;
}
.viewer-thumb img {
  height: 70px;
  width: auto;
  object-fit: cover;
  border-radius: 4px;
}
.viewer-thumb.active { border-color: var(--orange); }
.viewer-back {
  color: #fff;
  text-decoration: none;
  border: 1px solid #444;
  padding: .4rem .65rem;
  border-radius: 8px;
}

/* ===== Tabs de especificaciones ===== */
.moto-specs-tabs { margin-top: 2rem; }
.moto-specs-tabs h2 { margin-bottom: 1rem; color: var(--orange); }
.tab-nav {
  display: flex; flex-wrap: wrap; gap: .5rem; list-style: none; padding: 0; margin: 0 0 1rem;
}
.tab-nav li {
  padding: .4rem .8rem;
  border: 1px solid var(--border);
  border-radius: 6px;
  cursor: pointer;
  background: #f9f9f9;
}
.tab-nav li.active {
  background: var(--orange);
  color: #000;
  font-weight: 600;
}
.tab-content .tab-pane {
  display: none;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #fff;
  padding: 1rem;
}
.tab-content .tab-pane.active { display: block; }
.tab-content table { width: 100%; border-collapse: collapse; }
.tab-content th {
  text-align: left; padding: .5rem; width: 40%; background: #f9f9f9;
}
.tab-content td { padding: .5rem; }

/* ===== Acordeones de especificaciones ===== */
.specs-accordion { margin-top: 2rem; }
.specs-accordion .acc-item {
  border: 1px solid var(--border);
  border-radius: 8px;
  margin-bottom: .75rem;
  overflow: hidden;
  background: #fff;
}
.specs-accordion .acc-header {
  display: flex; justify-content: space-between; align-items: center;
  padding: .75rem 1rem;
  cursor: pointer;
  background: #f9f9f9;
}
.specs-accordion .acc-title { font-weight: 700; color: #222; }
.specs-accordion .acc-icon { transition: transform .2s ease; color: #666; }
.specs-accordion .acc-item.open .acc-icon { transform: rotate(90deg); color: #000; }
.specs-accordion .acc-content { display: none; padding: 0 1rem 1rem; }
.specs-accordion table { width: 100%; border-collapse: collapse; margin-top: .75rem; }
.specs-accordion th { width: 40%; text-align: left; padding: .45rem; background: #f9f9f9; }
.specs-accordion td { padding: .45rem; }

/* ===== Botones con íconos en todas las vistas ===== */
.actions {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  padding: 0.5rem 0 !important;
  margin-top: 0.5rem !important;
  align-items: center !important;
  justify-content: flex-start !important;
}

.actions .button,
.btn-wishlist,
.btn-compare,
.btn-financiar {
  width: 48px;
  height: 48px;
  font-size: 1.25rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: #fff;
  color: #222;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.btn-financiar {
  width: 48px;
  height: 48px;
  font-size: 1.25rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: #fff;
  color: #222;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* ===== Wishlist UI pequeñas mejoras ===== */
.btn-wishlist { position: relative; }
.btn-wishlist.active, .btn-wishlist.active i { color: red !important; }
.wishlist-title {
  color: var(--text);
  font-size: 2rem;
  font-weight: 700;
  text-align: center;
  margin-bottom: 1rem;
  display: block;
}
.wishlist-tooltip {
  position: absolute;
  top: -20px;
  left: 50%;
  transform: translateX(-50%);
  background: rgba(0,0,0,0.7);
  color: #fff;
  font-size: 0.7rem;
  padding: 2px 6px;
  border-radius: 4px;
  white-space: nowrap;
  z-index: 1000;
  animation: fadeIn 0.2s ease;
}
@keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }

.wishlist-message {
  position: fixed;
  bottom: 80px;
  right: 20px;
  background: var(--orange);
  color: #fff;
  padding: 0.6rem 1rem;
  border-radius: 6px;
  font-weight: 600;
  box-shadow: 0 2px 6px rgba(0,0,0,0.2);
  z-index: 9999;
  animation: fadeIn 0.3s ease;
}

.wishlist-header { margin-top: .5rem; display: flex; justify-content: center; }
.social-links { position: relative; }
.btn-wishlist-header {
  position: absolute;
  top: 100%;
  right: 0;
  margin-top: 4px;
  width: 32px;
  height: 32px;
  font-size: 1.1rem;
  border-radius: 50%;
  background: #fff;
  color: var(--orange);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--border);
  text-decoration: none;
  transition: background 0.3s ease;
}
.btn-wishlist-header:hover { background: var(--orange); color: #fff; }
.wishlist-count {
  position: absolute;
  top: -6px;
  right: -6px;
  background: var(--orange);
  color: #fff;
  font-size: 0.65rem;
  font-weight: 700;
  border-radius: 50%;
  padding: 2px 5px;
  line-height: 1;
  min-width: 16px;
  text-align: center;
}
@keyframes bounce { 0%{transform:scale(1);} 50%{transform:scale(1.4);} 100%{transform:scale(1);} }
.wishlist-count.bounce { animation: bounce 0.3s ease; }

/* ===== Ajustes móviles ===== */

img, .container, .shop-container, .product-grid, .single-product { max-width: 100%; }


/* ===== Notas de precio ===== */
.price-note {
  font-size: 0.75rem;
  color: #777;
  margin: -0.25rem 1rem 0;
  font-weight: 400;
}

/* ===== Ocultar textos redundantes en panel WhatsApp ===== */
.whatsapp-panel h3,
.whatsapp-panel p,
.whatsapp-panel .wsp-title { display: none !important; }

/* Botón flotante sin texto visible */
.whatsapp-toggle { font-size: 0 !important; line-height: 0 !important; }
.whatsapp-toggle i { font-size: 24px !important; }


.result-item {
  position: relative;
}
.result-item:hover::after {
  content: attr(title);
  position: absolute;
  left: 100%;
  top: 0;
  background: rgba(0,0,0,0.8);
  color: #fff;
  padding: .5rem;
  border-radius: 6px;
  white-space: nowrap;
  z-index: 999;
  max-width: 300px;
}

/* Barra blanca dentro del menú */
#search-trigger {
  width: 220px;
  padding: .4rem .6rem;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: #fff;
  color: #222;
  font-size: 0.9rem;
  cursor: pointer;
  text-align: left;
}

/* Buscador emergente */
.search-modal {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.4);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 9999;
}

.search-dialog {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  width: 90%;
  max-width: 600px;
  padding: 1rem;
  color: var(--text);
  position: relative;
}
/* Corrección: evitar scroll horizontal en ventana emergente */
.search-dialog {
  overflow-x: hidden !important;
}

#ricsu-ajax-results {
  width: 100% !important;
  overflow-x: hidden !important;
}

.result-item {
  max-width: 100% !important;
  overflow-x: hidden !important;
}


.search-close {
  position: absolute;
  right: 16px;
  top: 8px;
  background: none;
  border: none;
  color: #222;
  font-size: 24px;
  cursor: pointer;
}

#ricsu-ajax-search {
  width: 100%;
  padding: .6rem .8rem;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: #fff;
  color: #222;
  font-size: 1rem;
}

#ricsu-ajax-results {
  margin-top: .75rem;
  max-height: 400px;
  overflow-y: auto;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 6px 20px rgba(0,0,0,.08);
}

.result-item { 
  display: flex; 
    align-items: center;
    gap: 2rem;  
  padding: .75rem; 
  border-bottom: 1px solid var(--border); 
  
}

.result-item img {
  max-width: 120px !important;
  max-height: 100px !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
}


.result-thumb {
  width: 100px;
  height: auto;
  border-radius: 6px;
  object-fit: contain;
}
.result-info {
  flex: 1;
}
.result-title {
  font-weight: bold;
  font-size: 1rem;
  margin-bottom: .3rem;
  color: #000; /* ← fuerza el texto en negro */
}
.result-price {
  color: var(--orange);
  font-weight: bold;
  margin-bottom: .3rem;
}
.result-motor,
.result-rend {
  font-size: .85rem;
  color: #555;
}
/* Ajuste y orden vertical de especificaciones técnicas */
.result-specs {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.25rem !important;
}

.result-specs div {
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: unset !important;
  word-break: break-word !important;
  font-size: 0.8rem !important;
  line-height: 1.2 !important;
}

.search-title {
  font-size: 1.5rem;
  font-weight: 700;
  margin-bottom: .75rem;
  color: var(--orange);
  text-align: center;
}

.no-results {
  padding: 1rem;
  text-align: left;
  color: #444;
}

.no-results strong {
  display: block;
  font-size: 1.1rem;
  margin-bottom: .5rem;
  color: #000;
}

.search-tips {
  margin-top: .5rem;
  padding-left: 1.2rem;
  font-size: .9rem;
  color: #333;
}

.search-tips li {
  margin-bottom: .3rem;
}

/* Línea de categoría en resultados del buscador */
.result-cat {
  font-size: 0.9rem;
  color: #333;
  margin-bottom: .25rem;
}
.result-cat strong { color: #000; }

.search-icon-wrap {
  position: relative;
  display: block;
  width: 100%;
}

.search-icon-wrap input {
  width: 100%;
  padding-right: 2.2rem;
  padding-left: 0.6rem;
  height: 44px;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: #fff;
  color: #222;
  font-size: 1rem;
}

.search-icon-wrap input::placeholder {
  color: #666;
}

.search-icon {
  position: absolute;
  right: 0.8rem;
  top: 50%;
  transform: translateY(-50%);
  color: #666;
  font-size: 1.2rem;
  pointer-events: none;
}

.result-item {
  display: flex;
  gap: 1rem;
  padding: .75rem;
  border-bottom: 1px solid var(--border);
  align-items: flex-start;
}

.result-thumb {
  width: 120px;
  height: auto;
  border-radius: 6px;
  object-fit: contain;
  flex-shrink: 0;
}

.result-info {
  display: flex;
  justify-content: space-between;
  flex: 1;
  gap: 1rem;
}
/* Corrección: especificaciones en columna y autoajuste */
.result-specs {
  flex: 1 1 100% !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 0.25rem !important;
}

.result-specs div {
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: unset !important;
  word-break: break-word !important;
  font-size: 0.85rem !important;
  line-height: 1.2 !important;
  max-width: 100% !important;
}

.result-left {
  flex: 1;
}

.result-title {
  font-weight: bold;
  font-size: 1rem;
  margin-bottom: .3rem;
  color: #000;
}

.result-price {
  font-weight: bold;
  color: var(--orange);
  margin-top: .25rem;
}

.result-cat {
  font-size: 0.9rem;
  color: #333;
}

.result-specs {
  font-size: 0.85rem;
  color: #444;
  display: flex;
  flex-direction: column;
  gap: .2rem;
  min-width: 160px;
}

/* Ocultar hamburguesa en escritorio */
@media (min-width:769px) {
  .main-nav .menu-toggle { display: none; }
}

/* Autoajuste solo en especificaciones técnicas */
.result-specs,
.result-motor,
.result-rend {
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: unset !important;
  display: block !important;
  word-break: break-word !important;
  line-height: 1.2 !important;
  font-size: 0.75rem !important;
  max-width: 100% !important;
}

/* Barra de búsqueda ajustada al ancho de la ventana emergente */
.search-dialog .search-icon-wrap input,
#ricsu-ajax-search {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  display: block !important;
}


/* Ventana emergente del buscador más compacta */
.search-dialog {
  width: 100% !important;
  max-width: 560px !important; /* aproximadamente la mitad de pantallas grandes */
  margin: 0 auto !important;
  overflow-x: hidden !important;
  border-radius: 12px !important;
}

/* ===== Corrección layout horizontal en resultados del buscador ===== */
@media (min-width: 769px) {
  .result-info {
    display: flex !important;
    flex-direction: row !important;
    justify-content: space-between;
    align-items: flex-start;
    gap: 2rem; /* ← ajusta este valor para controlar el espacio horizontal */
  }

  .result-left {
    flex: 1 1 auto;
    min-width: 0;
  }

  .result-specs {
    flex: 1 1 auto;
    min-width: 160px;
  }
}


/* ===== Aumentar tamaño de título y precio solo en vista individual ===== */
  .single-product.full-width .single-info h1 {
    font-size: 2.2rem !important;
    line-height: 1.3 !important;
  }

  .single-product.full-width .price {
    font-size: 1.6rem !important;
    line-height: 1.3 !important;
  }

/* ===== Buscador: distribución horizontal con separación moderada ===== */
@media (min-width: 769px) {
  #ricsu-ajax-results .result-item {
    align-items: flex-start;
  }

  #ricsu-ajax-results .result-info {
    display: flex !important;
    flex-direction: row !important;
    justify-content: flex-start !important; /* ya no separa al máximo */
    align-items: flex-start !important;
    gap: 1rem !important; /* controla el espacio horizontal */
    width: 100% !important;
  }

  #ricsu-ajax-results .result-left {
    flex: 1 1 auto !important;
    min-width: 0 !important;
  }

  #ricsu-ajax-results .result-specs {
    margin-left: auto !important;  /* empuja al borde derecho */
    max-width: 300px !important;
    text-align: left !important;
    flex: 0 0 auto !important;
  }

   .actions {
    justify-content: center !important;
  }

  /* Alineación precisa de contenido textual en ficha de producto */
  .single-info {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }

  .single-info h1,
  .product-title,
  .price,
  .price-note,
  .moto-specs-tabs,
  .specs-accordion {
    margin-left: 0 !important;
    padding-left: 0 !important;
    text-align: left !important;
  }

  .price-note {
    display: block;
    margin-top: -0.5rem;
    margin-bottom: 1rem;
    font-size: 0.8rem;
    color: #ccc;
  }

/* Vista individual: botones alineados horizontalmente al lado del precio */
.single-product.full-width .price-actions-row {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 1rem !important;
  padding-left: 1rem !important;
  padding-right: 1rem !important;
  margin-bottom: 1rem !important;
}

.single-product.full-width .price-block {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.single-product.full-width .price {
  font-size: 1.6rem !important;
  margin: 0 !important;
  padding: 0 !important;
}

.single-product.full-width .price-note {
  font-size: 0.8rem !important;
  margin-top: 0.25rem !important;
  color: #aaa !important;
}

.single-product.full-width .actions-inline {
  display: flex;
  gap: 0.4rem;
  margin-left: 0.5rem !important; /* más cerca del precio */
}




}

/* ===== Ficha de producto: permitir expansión vertical sin mezcla ===== */
.single-product.full-width {
  height: auto !important;
  min-height: 100vh !important;
  padding-bottom: 5rem !important;
  overflow: visible !important;
}

/* ===== Footer ultra compacto ===== */
.site-footer {
  padding: 0.25rem 0.75rem !important;  /* menos espacio vertical */
  font-size: 0.7rem !important;         /* texto más pequeño */
  line-height: 1.1 !important;          /* menor separación entre líneas */
}

.footer-widgets {
  gap: 0.25rem !important;              /* menos espacio entre columnas internas */
}

.site-footer p,
.site-footer div,
.site-footer span {
  margin: 0 !important;
  padding: 0 !important;
}


/* ===== Bloque relacionados a ancho completo y en fila ===== */
.single-product.full-width {
  display: grid;
  grid-template-columns: 1fr 1fr; /* ya lo tienes */
  gap: 2rem;
}

.related-products-full {
  grid-column: 1 / -1; /* ← ocupa ambas columnas del grid */
  width: 100%;
  background: var(--surface);
  padding: 2rem 0;
  border-top: 1px solid var(--border);
  margin-top: 2rem;
}


.related-products-full .container {
  max-width: var(--max-width);
  margin: 0 auto;
  padding: 0 1rem;
}

.related-title {
  font-size: 1.4rem;
  font-weight: 700;
  color: var(--orange);
  margin-bottom: 0.25rem;
  text-align: left;
}

.related-subtitle {
  font-size: 1rem;
  color: #000; /* ← ahora será negro */
  margin-bottom: 1rem;
  text-align: left;
}


.related-products-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 1rem;
}

.related-card {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 0.5rem;
  text-align: center;
  color: #222;
}

.related-card img {
  width: 100%;
  height: auto;
  object-fit: contain;
  border-radius: 6px;
}

.related-name {
  font-size: 1.7rem;       /* Más grande */
  font-weight: 700;        /* Negrita */
  margin-top: .5rem;
  color: #000;             /* Asegura que sea visible sobre fondo claro */
  line-height: 1.3;
}


/* Placeholder cuando no hay imagen destacada */
.related-thumb-placeholder {
  height: 120px;
  border: 1px dashed var(--border);
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #666;
  background: #fafafa;
}

/* Responsive: 2 por fila en móvil */
@media (max-width: 768px) {
  .related-products-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* ===== Título y botones alineados horizontalmente ===== */
.title-actions-row {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 1rem;
  margin-bottom: 0.75rem;
}

.product-title {
  font-size: 1.35rem;
  font-weight: 700;
  color: var(--text);
  margin: 0;
  line-height: 1.2;
  word-break: break-word;
  overflow-wrap: break-word;
  white-space: normal;
  max-width: 100%;
  display: -webkit-box;
  -webkit-line-clamp: 2;       /* para navegadores WebKit */
  -webkit-box-orient: vertical;
  overflow: hidden;

  /* Compatibilidad estándar */
  line-clamp: 2;
  box-orient: vertical;
}




.actions-inline {
  display: flex;
  gap: 0.4rem;
}


.actions-inline .btn-compare,
.actions-inline .btn-wishlist,
.actions-inline .btn-financiar,
.actions-inline .btn-whatsapp {
  width: 40px;
  height: 40px;
  font-size: 1.1rem;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: #fff;
  color: #222;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.actions-inline .btn-whatsapp {
  background: var(--green);
  color: #fff;
  border: none;
}
/* ===== Título en bloque y botones debajo si no caben ===== */
.title-actions-wrap {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.5rem;
  margin-bottom: 0.75rem;
}

.product-title {
  font-size: 1.35rem;
  font-weight: 700;
  color: var(--text);
  margin: 0;
  line-height: 1.2;
  word-break: break-word;
  overflow-wrap: break-word;
  white-space: normal;
  max-width: 100%;
}

.actions-inline {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}
.actions-inline button {
  width: 40px;
  height: 40px;
  font-size: 1.1rem;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: #fff;
  color: #222;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.actions-inline .btn-whatsapp {
  background: var(--green);
  color: #fff;
  border: none;
}

@media (max-width:768px) {

    /* Layout general móvil */
  body { margin-top: 180px !important; }
  .container,
  .shop-container,
  .product-grid,
  .single-product,
  .filters,
  .catalog {
    background: transparent !important;
  }
  .logo img { max-height: 80px; max-width: 250px; height: auto; width: auto; }
  .topbar { padding: .5rem; }

  /* Cabecera y nav móvil */
  .site-header {
    border-bottom: 1px solid var(--border) !important;
    background: linear-gradient(to bottom, var(--header-top) 0%, var(--surface) 50%, var(--header-bottom) 100%) !important;
    color: var(--text) !important;
    height: auto !important;
    padding: 0 !important;
    margin: 0 !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    z-index: 100 !important;
  }
  .main-nav {
    border: none !important;
    padding: 0.25rem 1rem !important;
    margin: 0 !important;
    height: auto !important;
    min-height: 42px !important;
    background: transparent !important; /* hereda gradiente de .site-header */
    display: block !important;
    position: relative !important;
  }
  .main-nav .menu-toggle {
    display: block !important;
    position: absolute !important;
    right: 12px !important;
    top: 8px !important;
    background: none !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    height: auto !important;
    line-height: 1 !important;
    font-size: 1.8rem !important;
    color: var(--menu) !important;
    z-index: 101 !important;
  }
  .main-nav .menu-h,
  .main-nav .menu-search {
    display: none !important;
    height: 0 !important;
    overflow: hidden !important;
    padding: 0 !important;
    margin: 0 !important;
  }
  .main-nav.open .menu-h {
    display: flex !important;
    flex-direction: column !important;
    gap: .75rem !important;
    padding: 1rem !important;
    background: var(--surface) !important;
    border-radius: 6px !important;
    height: auto !important;
  }
  .main-nav.open .menu-search {
    display: block !important;
    margin-top: .5rem !important;
    width: 100% !important;
    height: auto !important;
  }
  .main-nav .menu-h a { color: var(--menu) !important; }
  .main-nav .menu-h a:hover { background: rgba(255,255,255,.1) !important; }
  .menu-toggle { margin: 0 !important; padding: 0 !important; }

  /* Barra de búsqueda fija bajo header */
  .search-wrap {
    top: 180px !important;
    margin-top: 0 !important;
    background: linear-gradient(to bottom, var(--surface) 0%, #1a3d66 100%) !important;
    border-bottom: 1px solid var(--border) !important;
  }

  /* Catálogo móvil */
  .product-grid { grid-template-columns: repeat(auto-fit, minmax(150px,1fr)); }

  /* Ficha de producto móvil */
  .single-product.full-width {
    display: block !important;
    height: auto !important;
    overflow: visible !important;
    padding: 1rem 0 !important;
  }
  .single-gallery {
    width: 100% !important;
    padding: 0 !important;
    border: none !important;
    position: relative !important;
    top: auto !important;
  }
  #main-image {
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
    border-radius: 0 !important;
    display: block !important;
  }
  .thumbs {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: .5rem !important;
    margin-top: 1rem !important;
  }
  .thumbs img {
    width: 60px !important;
    height: 60px !important;
    object-fit: cover !important;
    border: 1px solid var(--border) !important;
    border-radius: 6px !important;
    cursor: pointer !important;
  }
  .single-info {
    height: auto !important;
    overflow: visible !important;
    padding-right: 0 !important;
    align-self: start !important;
  }
  .product-title,
  .single-info h1 {
    font-size: 1rem !important;
    line-height: 1.2 !important;
    color: var(--text) !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: unset !important;
    display: block !important;
    max-height: none !important;
    font-weight: 700 !important;
    text-align: left !important;
    padding: 0.5rem 0.75rem !important;
  }
  .price {
    padding: 0 0.75rem 0.5rem !important;
    text-align: left !important;
    font-size: 1rem !important;
    line-height: 1.2 !important;
    color: var(--orange) !important;
    font-weight: 600 !important;
    margin-bottom: 0.5rem !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    display: block !important;
  }
  .actions {
    flex-wrap: wrap !important;
    justify-content: center !important;
    padding: 1rem 0 1rem !important;
    gap: .5rem !important;
    overflow: visible !important;
  }
  .actions .button,
  .btn-wishlist,
  .btn-compare,
      .btn-financiar {
    width: 40px !important;
    height: 40px !important;
    font-size: 1rem !important;
    border-radius: 6px !important;
  }
  .btn-whatsapp {
    width: auto !important;
    min-width: 40px !important;
    height: auto !important;
    font-size: 0.9rem !important;
    border-radius: 6px !important;
    padding: 0.4rem 0.6rem !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 1 1 auto !important;
    white-space: nowrap !important;
  }
  .wishlist-tooltip {
    font-size: 0.65rem !important;
    top: -18px !important;
    padding: 2px 5px !important;
  }

  /* Resultados del buscador: tipografía móvil */
  .result-title { font-size: 0.78rem !important; line-height: 1.15 !important; }
  .result-specs,
  .result-motor,
  .result-rend {
    flex: 1 1 100% !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: unset !important;
    word-break: break-word !important;
    font-size: 0.75rem !important;
    line-height: 1.2 !important;
  }
  .result-price { font-size: 0.78rem !important; line-height: 1.15 !important; }
  .result-cat,
  .result-specs,
  .result-motor,
  .result-rend { font-size: 0.7rem !important; line-height: 1.15 !important; }

  /* Ajuste móvil: distribución del bloque de resultados */
  #ricsu-ajax-results .result-info {
    display: block !important;
    width: 100% !important;
  }
  #ricsu-ajax-results .result-specs {
    width: 100% !important;
    max-width: 100% !important;
    word-break: break-word !important;
    overflow-wrap: anywhere !important;
    white-space: normal !important;
    padding-top: 0.5rem !important;
  }
  #ricsu-ajax-results .result-specs div {
    font-size: 0.85rem !important;
    line-height: 1.3 !important;
  }

  .single-info {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }

  .single-info h1,
  .product-title,
  .price,
  .price-note,
  .moto-specs-tabs,
  .specs-accordion {
    text-align: left !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
  }

  .price-note {
    display: block;
    margin-top: -0.5rem;
    margin-bottom: 1rem;
    font-size: 0.8rem;
    color: #ccc;
  }

/* ===== Aumentar tamaño de título y precio solo en vista individual ===== */

  .single-product.full-width .single-info h1 {
    font-size: 2.2rem !important;
    line-height: 1.25 !important;
  }

  .single-product.full-width .price {
    font-size: 1.4rem !important;
    line-height: 1.2 !important;
  }


}

.price-actions-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  margin: 1rem 0;
  padding-left: 1rem;
  padding-right: 1rem;
}

.price-block {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.actions-inline {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
}

/* Aumentar tamaño del ícono WhatsApp dentro de .whatsapp-select */
.whatsapp-select .wsp-icon i::before {
  font-size: 48px !important;
  line-height: 1 !important;
  display: inline-block !important;
}

/* WhatsApp: ocultar el select y hacerlo clickeable desde el ícono */
.whatsapp-select {
  position: relative;
  display: inline-block;
}

.whatsapp-select select {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;              /* invisible */
  cursor: pointer;
  z-index: 2;
}

.whatsapp-select .wsp-icon {
  position: relative;
  z-index: 1;
  display: inline-block;
  color: #25D366 !important; /* verde WhatsApp */
  font-size: 32px !important;
  line-height: 1 !important;
  background: none !important;
  border: none !important;
  padding: 0 !important;
}

/* ===== Aplicar ancho dinámico desde el personalizador ===== */
.container,
.search-wrap .container,
.related-products-full .container,
.footer-widgets,
.shop-container,
.single-product.full-width,
.content-area {
  width: var(--max-width);
  max-width: 100%;
  margin: 0 auto;
}

/* Ocultar el texto "Price:" en el filtro */
.widget_price_filter .price_label {
    display: none !important;
}


/* Capa de ticks: líneas verticales finas cada ~20px */
.widget_price_filter .ui-slider::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  /* Ticks: 1px (#fff con 0.55 de opacidad), repetidos cada 20px */
  background-image:
    repeating-linear-gradient(
      to right,
      rgba(255,255,255,0.55) 0px,
      rgba(255,255,255,0.55) 1px,
      transparent 1px,
      transparent 20px
    );
  border-radius: 4px;
  z-index: 1; /* debajo de la manija y del rango */
}

/* Sin prolongación bajo la manija */
.widget_price_filter .ui-slider-handle::after { display: none !important; }

/* Distribución de mínimos/máximos y botón */
.widget_price_filter .price_slider_amount {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  margin-top: .5rem !important;
  flex-wrap: wrap !important;
}
.widget_price_filter .price_slider_amount .from,
.widget_price_filter .price_slider_amount .to {
  order: 1;
  font-weight: 600;
  color: var(--text);
}
.widget_price_filter .price_slider_amount .button {
  order: 3;
  flex: 1 1 100%;
  margin-top: 1.5rem !important;
  text-align: center;
  background: var(--orange) !important;
  color: #000 !important;
  border: none !important;
  border-radius: 6px !important;
  padding: .4rem .6rem !important;
}

/* Ocultar título redundante del widget */
.widget_price_filter .widgettitle,
.widget_price_filter h2,
.widget_price_filter h3 { display: none !important; }

/* Ocultar “Price:” del widget (ya lo ocultas) */
.widget_price_filter .price_label { display: none !important; }

/* ===== Filtro de precio: barra completa naranja y más gruesa ===== */
.widget_price_filter .ui-slider {
  position: relative !important;
  height: 9px !important;
  border-radius: 4px !important;
  background: var(--orange) !important;
  overflow: visible !important;
}

.widget_price_filter .ui-widget-content {
  background: var(--orange) !important;
  height: 9px !important;
  border-radius: 4px !important;
}

.widget_price_filter .ui-widget-header {
  background: var(--orange) !important;
  height: 9px !important;
  border-radius: 4px !important;
}

/* Rango seleccionado centrado dentro de la barra */
.widget_price_filter .ui-slider-range {
  position: absolute !important;
  background: var(--orange) !important;
  height: 6px !important;
  top: 4px !important;
  border-radius: 4px !important;
  z-index: 2;
}

/* Manija vertical tipo barra */
.widget_price_filter .ui-slider-handle {
  position: absolute !important;
  z-index: 3 !important;
  background: transparent !important; /* ← fondo transparente */
  width: 6px !important;
  height: 28px !important;
  top: -7px !important;
  border: 2px solid #000 !important;      /* borde negro */
  border-radius: 3px !important;
}


/* Etiqueta de precio debajo de la manija */
.widget_price_filter .ui-slider-handle .handle-label {
  position: absolute;
  top: 30px;
  left: 50%;
  transform: translateX(-50%);
  background: transparent !important;
  color: var(--text);
  font-size: 0.8rem;
  font-weight: 600;
  white-space: nowrap;
  pointer-events: none;
  z-index: 3;
  max-width: 80px;
  overflow: hidden;
  text-overflow: ellipsis;
}



.price-label-combined {
  display: none;
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--text);
  white-space: nowrap;
  position: absolute;
  top: 30px; /* ← misma altura que .handle-label */
  left: 50%;
  transform: translateX(-50%);
  background: transparent;
  z-index: 10;
}

/* ===== Price labels externas dentro de .price_slider ===== */
.widget_price_filter .price_slider {
  position: relative; /* permite posicionar hijos por left/top */
}

.widget_price_filter .price_slider .handle-label {
  position: absolute;
  top: 22px;           /* altura visible bajo la barra */
  transform: translateX(-50%);
  background: transparent !important;
  color: var(--text);
  font-size: 0.8rem;
  font-weight: 600;
  white-space: nowrap;
  pointer-events: none;
  z-index: 10;
}

.widget_price_filter .price_slider .price-label-combined {
  position: absolute;
  top: 22px;
  transform: translateX(-50%);
  background: transparent !important;
  color: var(--text);
  font-size: 0.8rem;
  font-weight: 600;
  white-space: nowrap;
  display: none;      /* por defecto oculta */
  z-index: 11;
}

/* Categoría (pa_categoria) y Marca (pa_marca) seleccionados: tarjetas con borde verde */
.filter-block[data-taxonomy="pa_categoria"] .term-card.active,
.filter-block[data-taxonomy="pa_marca"] .term-card.active {
  border: 2px solid #25D366; /* verde WhatsApp */
  border-radius: 6px;
  font-weight: 600;
  background: rgba(37, 211, 102, 0.1);
}

/* Otros filtros con checkbox (li.selected) ya está correcto */
.filter-list input[type="checkbox"]:checked + label,
.filter-list li.selected {
  background: rgba(0,0,0,0.15);
  border-radius: 4px;
  font-weight: 600;
}

/* Tamaño compacto para textos en filtros con checkbox */
.filter-list label {
  font-size: 0.65rem;
  line-height: 1.2;
  font-weight: 600;
  word-break: break-word;
  white-space: normal;
  display: inline-block;
  max-width: 100%;
}

/* Acordeones de filtros */
.filter-accordion {
  margin-bottom: 1rem;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--filters);
  color: var(--filters-text);
}

.accordion-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: .5rem .75rem;
  cursor: pointer;
  font-weight: 600;
  border-bottom: 1px solid var(--border);
}

.accordion-header h3 {
  margin: 0;
  font-size: 0.9rem;
}

.accordion-toggle {
  font-size: 1.2rem;
  color: var(--text);
  transition: transform 0.2s ease;
}

.accordion-content {
  display: none;
  padding: .5rem .75rem;
}

.filter-accordion.open .accordion-content {
  display: block;
}

.filter-accordion.open .accordion-toggle {
  transform: rotate(45deg); /* cambia + a x visualmente */
}

/* Categoría y Marca seleccionados: borde verde limón */
.filter-accordion[data-taxonomy="product_cat"] .term-card.active,
.filter-accordion[data-taxonomy="pa_marca"] .term-card.active,
.filter-accordion[data-taxonomy="pa_categoria"] .term-card.active {
  border: 2px solid #25D366; /* verde WhatsApp */
  border-radius: 6px;
  background: rgba(37, 211, 102, 0.1);
  font-weight: 600;
}

/* Espaciado extra solo para el filtro de precio */
.filter-accordion[data-taxonomy="price"] .accordion-content {
  padding-top: 1rem;
}

.page-indicator {
  margin-top: 1rem;
  font-weight: 600;
  color: var(--text);
}

.filters-route {
  margin-top: 0.5rem;
  font-size: 0.9rem;
  color: var(--orange);
}

.dynamic-count.zero {
  color: #d9534f; /* rojo suave tipo Bootstrap */
  font-weight: bold;
}


.filter-accordion:not(.open) .accordion-header {
  background-color: var(--orange);
  color: #000;
  border-radius: 6px;
  transition: background-color 0.3s ease;
}

.filter-accordion.open .accordion-header {
  background-color: #fff; /* o el color actual */
  color: inherit;
}

.filter-panel-title {
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--text); /* o usa #e9f1fb si prefieres fijo */
}

@media screen and (max-width: 768px) {
  /* Asegurar flujo vertical y altura fija para el precio */
  .product-info {
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    padding: 0 0.5rem !important;
    height: 100% !important;
  }

  .product-title {
    margin-top: 0.3rem !important; /* añade espacio superior */
    font-size: 0.85rem !important;
    line-height: 1.1 !important;
    padding: 0.2rem 0 !important;
    max-height: 2.4em !important;
    -webkit-line-clamp: 2 !important;
    line-clamp: 2 !important;
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .price {
    font-size: 0.85rem !important;
    line-height: 1.1 !important;
    padding: 0 0 0.2rem !important;
    height: 1.2rem !important; /* ← altura fija */
    display: flex !important;
    align-items: center !important;
  }
}

@media screen and (max-width: 768px) {
  /* Parte ploma ultra compacta */
  .product-card {
    min-height: 140px !important; /* antes 160px */
    padding-bottom: 0 !important; /* antes 0.1rem */
  }

  /* Achatar la parte ploma (acciones) */
  .product-card .actions { 
    padding: 1px 2px !important; 
    min-height: 22px !important; /* antes 24px */
    gap: 2px !important; 
  } 
     
  li.product .actions,
  .product .actions {
    padding: 2px 4px !important;
    min-height: 26px !important; /* más bajo que 36px */
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 3px;
  }

  /* Mantener botones compactos */
  .actions .btn-wishlist,
  .actions .btn-compare,
  .actions .btn-financiar,
  .actions .btn-whatsapp {
    width: 24px !important;
    height: 24px !important;
    padding: 2px !important;
    font-size: 0 !important;
    border-radius: 6px !important;
    background: #fff !important;
    border: 1px solid var(--border) !important;
  }

  /* Íconos dentro de botones */
  .actions .btn-wishlist i,
  .actions .btn-compare i,
  .actions .btn-financiar i,
  .actions .btn-whatsapp i {
    font-size: 14px !important;
    line-height: 1 !important;
  }

  /* Forzar WhatsApp compacto */
  .btn-whatsapp {
    width: 24px !important;
    height: 24px !important;
    padding: 2px !important;
    font-size: 0 !important;
    border-radius: 6px !important;
    background: transparent !important;
    border: none !important;
  }

    /* Alineación uniforme */
  .actions a,
  .actions button {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
}

@media screen and (max-width: 768px) {
  .whatsapp-select {
    width: 22px !important;
    height: 22px !important;
    background: transparent !important;
    border-radius: 5px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    position: relative !important;
    overflow: hidden !important;
  }

  .whatsapp-select i {
    font-size: 12px !important;
    color: #fff !important;
    display: inline-block !important;
    line-height: 1 !important;
  }

  .whatsapp-select select {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    opacity: 0 !important;
    cursor: pointer !important;
    z-index: 2 !important;
  }
}

@media screen and (max-width: 768px) {
  .whatsapp-toggle i {
    color: #fff !important;
    font-size: 24px !important;
    line-height: 1 !important;
    display: inline-block !important;
  }
}

/* ===== Fix definitivo: WhatsApp dentro de acciones en móvil como escritorio (ícono verde, sin fondo) ===== */
@media (max-width: 768px) {

  /* Botón WhatsApp en catálogos y ficha (acciones compactas) */
  .actions .btn-whatsapp,
  .actions-inline .btn-whatsapp {
    background: transparent !important;
    border: none !important;
    /* mantenemos tamaño compacto si lo necesitas */
    width: 24px !important;
    height: 24px !important;
    padding: 2px !important;
    /* sin color de texto de botón; solo ícono */
    color: inherit !important;
  }

  .actions .btn-whatsapp i,
  .actions-inline .btn-whatsapp i {
    color: var(--green) !important;  /* ícono verde */
    /* respeta tu escala de ícono compacta en móvil */
    font-size: 14px !important;
    line-height: 1 !important;
  }

  /* Variante con select integrado: que también quede sin fondo */
  .actions .whatsapp-select,
  .actions-inline .whatsapp-select {
    background: transparent !important;
    border: none !important;
  }

  .actions .whatsapp-select .wsp-icon i,
  .actions-inline .whatsapp-select .wsp-icon i {
    color: var(--green) !important; /* ícono verde dentro del select */
  }
}

/* ===== WhatsApp: estilo único y consistente (colocar al final del archivo) ===== */

/* Base: aplica en todas las vistas */
.btn-whatsapp {
  background: transparent !important;
  border: none !important;
  width: 48px !important;
  height: 48px !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
}

.btn-whatsapp i {
  color: var(--green) !important;
  font-size: 22px !important;
  line-height: 1 !important;
  display: inline-block !important;
}

/* Evitar que reglas globales de botones sólidos afecten a WhatsApp */
.actions .button,
.actions .btn-wishlist,
.actions .btn-compare,
.actions .btn-financiar {
  background: #fff;
  border: 1px solid var(--border);
}

/* IMPORTANTE: no incluir .btn-whatsapp en el grupo anterior */


/* Compatibilidad con contenedores de acciones */
.actions .btn-whatsapp,
.actions-inline .btn-whatsapp {
  background: transparent !important;
  border: none !important;
}

/* Mobile: compacto y legible */
@media (max-width: 768px) {
  .btn-whatsapp {
    width: 24px !important;
    height: 24px !important;
  }
  .btn-whatsapp i {
    font-size: 18px !important;
  }
}

/* Opcional: si tienes un select superpuesto para múltiples números */
.whatsapp-select {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: transparent !important;
  border: none !important;
  width: 48px;
  height: 48px;
}
.whatsapp-select select {
  position: absolute;
  inset: 0;
  opacity: 0; /* clickeable sin verse */
  cursor: pointer;
  z-index: 2;
}
.whatsapp-select .wsp-icon i {
  color: var(--green) !important;
  font-size: 22px !important;
  line-height: 1 !important;
}

@media (max-width: 768px) {
  .whatsapp-select {
    width: 24px !important;
    height: 24px !important;
  }
  .whatsapp-select .wsp-icon i {
    font-size: 13px !important;   /* tamaño base */
    transform: scale(0.5);        /* reduce visualmente el glifo */
    transform-origin: center;     /* centra el escalado */
    display: inline-block;
  }
}


/* Evitar tamaños de ícono globales que pisen el WhatsApp */
.actions .button i,
.btn-wishlist i,
.btn-compare i,
.btn-financiar i {
  font-size: 22px; /* grande para los sólidos */
}

@media (max-width: 768px) {
  .actions .button i,
  .btn-wishlist i,
  .btn-compare i,
  .btn-financiar i {
    font-size: 14px; /* compacto en móvil para los sólidos */
  }
}

/* Nota: .btn-whatsapp i mantiene el tamaño definido arriba y no se ve afectado por estos globales */


@media screen and (max-width: 768px) {
  /* Contenedor centrado */
  .actions {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    padding: 0 !important;
  }

  /* Separación uniforme para todos los hijos directos (incluye WhatsApp select) */
  .actions > .btn-wishlist,
  .actions > .btn-compare,
  .actions > .btn-financiar,
  .actions > .btn-whatsapp,
  .actions > .whatsapp-select {
    margin-left: 0.5rem !important;  /* 8px */
    margin-right: 0 !important;      /* evita empujes */
    flex: 0 0 auto !important;       /* no se expande */
  }

  /* El primer botón sin margen izquierdo */
  .actions > :first-child {
    margin-left: 0 !important;
  }

  /* Asegurar que WhatsApp no crezca y respete el espaciado */
  .btn-whatsapp,
  .whatsapp-select {
    flex: 0 0 auto !important;
  }
}

@media screen and (max-width: 768px) {
  .actions {
    margin-bottom: 1rem !important; /* añade espacio debajo del grupo de botones */
  }
}


@media screen and (max-width: 768px) {
  /* Vista individual: asegura que WhatsApp tenga tamaño igual a los demás */
  .single-product.full-width .price-actions-row .btn-whatsapp,
  .single-product.full-width .price-actions-row .whatsapp-select {
    width: 48px !important;
    height: 48px !important;
    padding: 0 !important;
    flex: 0 0 auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .single-product.full-width .price-actions-row .btn-whatsapp i,
  .single-product.full-width .price-actions-row .whatsapp-select .wsp-icon i {
    font-size: 22px !important;
    color: var(--green) !important;
    line-height: 1 !important;
    transform: none !important;
  }
}

.wsp-float {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 999;
}

.wsp-toggle {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: var(--green);
  color: #fff;
  font-size: 24px;
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 2px 6px rgba(0,0,0,0.2);
}

.wsp-panel {
  display: none;
  position: absolute;
  bottom: 70px;
  right: 0;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 0.5rem;
  width: 220px;
}

.wsp-panel.open {
  display: block;
}

.wsp-panel select.wsp-select {
  width: 100%;
  padding: 0.5rem;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: #fff;
  color: #222;
  font-size: 0.9rem;
  appearance: auto;
}





/* Vista escritorio: alineación uniforme de bloques de especificaciones */
@media (min-width: 769px) {
  #ricsu-ajax-results .result-info {
    display: block !important;         /* ← layout vertical como en móvil */
  }

  #ricsu-ajax-results .result-specs {
    width: 100% !important;
    margin-left: 0 !important;
    margin-top: .5rem !important;
    text-align: left !important;
  }

  #ricsu-ajax-results .result-specs div {
    white-space: normal !important;
    word-break: break-word !important;
    font-size: 0.85rem !important;
    line-height: 1.2 !important;
  }

  /* Nombre de la moto */
  #ricsu-ajax-results .result-title {
    font-size: 1.2rem !important;   /* un poco más pequeño */
    font-weight: 700 !important;    /* negrita */
    margin-bottom: 0.25rem !important;
  }

  /* Precio igual al título */
  #ricsu-ajax-results .result-price {
    font-size: 1.2rem !important;   /* mismo tamaño que el título */
    font-weight: 700 !important;    /* negrita */
    margin-bottom: 0.25rem !important;
  }

  /* Título Categoría en negrita */
  #ricsu-ajax-results .result-cat strong {
    font-size: 0.85rem !important;
    font-weight: 700 !important;    /* negrita */
  }

  /* Resultado de la categoría más pequeño */
  #ricsu-ajax-results .result-cat {
    font-size: 0.75rem !important;  /* más pequeño porque está en mayúscula */
    font-weight: 500 !important;
    margin-bottom: 0.25rem !important;
  }


  #ricsu-ajax-results .result-item {
    display: grid;
    grid-template-columns: 240px 1fr; /* imagen más ancha */
    align-items: center;
    column-gap: 2rem;
  }

  #ricsu-ajax-results .result-thumb {
    width: 260px !important; /* ajusta el ancho del bloque */ 
    height: auto !important; /* deja que se expanda según la imagen */
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    background: #fff;
    border-radius: 8px;
    padding: .5rem;
  }


  #ricsu-ajax-results .result-thumb img.result-img {
    width: 100% !important;   /* ocupa todo el ancho del contenedor */
    height: auto !important;  /* mantiene proporción */
    max-width: none !important; /* elimina límite anterior */
    max-height: none !important; /* elimina límite anterior */
    object-fit: contain !important;
  }


  #ricsu-ajax-results .result-info {
    width: 100%;
  }
  
}

.related-price {
  color: var(--orange);
  font-weight: 700;
  margin-top: .25rem;
  font-size: 1.1rem;
}

.related-specs {
  font-size: 0.85rem;
  color: #444;
  margin-top: .5rem;
  text-align: left;
  display: flex;
  flex-direction: column;
  gap: .25rem;
}


/* Ajustes específicos para móviles en productos relacionados */
@media (max-width: 768px) {
  .related-products-full .related-name {
    font-size: 0.9rem !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
  }

  .related-products-full .related-price {
    font-size: 0.85rem !important;
    font-weight: 600 !important;
    margin-top: 0.25rem !important;
  }

  .related-products-full .related-specs {
    font-size: 0.75rem !important;
    line-height: 1.2 !important;
    gap: 0.2rem !important;
  }

  .related-products-full .related-card {
    padding: 0.5rem !important;
  }
}


.specs-accordion .acc-item.open .acc-header {
  background: var(--orange) !important;
  color: #000 !important;
}

.specs-accordion .acc-item.open .acc-title {
  color: #000 !important;
  font-weight: 700;
}

.specs-accordion .acc-item.open .acc-icon {
  color: #000 !important;
}

.specs-scroll {
  min-height: 700px; /* ajusta este valor según la altura que quieras */
  max-height: 800px;
  overflow-y: auto;
  padding-right: 1rem;
  border: 1px solid #cccccc00;
  border-radius: 8px;
  background: #f9f9f9;
}


.specs-title {
  margin-bottom: 0.5rem !important;
}

.specs-scroll {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

.specs-accordion {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

.specs-accordion .acc-item:first-child {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

.specs-accordion .acc-header {
  margin-top: 0 !important;
  padding-top: 0.5rem !important;
}


.header-icon.compare-link {
  color: var(--orange); /* o el color que uses para íconos */
  font-size: 1.2rem;
  margin-left: 15px; /* separarlo del corazón */
  cursor: pointer;
}
.header-icon.compare-link:hover {
  color: var(--green); /* verde al pasar el mouse */
}



.btn-compare.active i {
  color: #ffeb3b; /* amarillo patito brillante */
}



.compare-toast {
  display: none; /* oculto por defecto */
  position: fixed;
  bottom: 20px;
  right: 20px;
  background: #333;
  color: #fff;
  padding: 10px 16px;
  border-radius: 6px;
  font-size: 14px;
  z-index: 9999;
}





.compare-link {
  position: relative;
}

.compare-count {
  position: absolute;
  top: -6px;
  right: -6px;
  background: var(--orange);
  color: #fff;
  font-size: 11px;
  font-weight: bold;
  border-radius: 50%;
  padding: 2px 6px;
  line-height: 1;
  min-width: 18px;
  text-align: center;
}








@media (max-width: 768px) {
  /* 🔘 Botón VER CATÁLOGO más pequeño */
  a.elementor-button.elementor-size-sm {
    font-size: 0.85rem !important;
    padding: 0.4rem 0.75rem !important;
    border-radius: 6px !important;
    width: 60% !important;
    margin: 0 auto !important;
    display: block !important;
  }

  a.elementor-button.elementor-size-sm .elementor-button-text {
    font-size: 0.8rem !important;
  }

  /* 📘 Sección "Nuestra historia" con imagen centrada y texto justificado */
  .elementor-element-7ad8ebb .elementor-container {
    display: block !important;
    padding: 0.5rem 1rem !important;
  }

  .elementor-element-7ad8ebb .elementor-widget-image {
    text-align: center !important;
    margin-bottom: 0.75rem !important;
  }

  .elementor-element-7ad8ebb .elementor-widget-image img {
    width: 75% !important;
    max-width: 220px !important;
    height: auto !important;
    object-fit: contain !important;
    border-radius: 6px !important;
    margin: 0 auto !important;
    display: block !important;
  }

  .elementor-element-7ad8ebb .elementor-widget-text-editor {
    font-size: 0.78rem !important;
    line-height: 1.4 !important;
    text-align: justify !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .elementor-element-7ad8ebb h2 {
    font-size: 1rem !important;
    text-align: center !important;
    margin-bottom: 0.5rem !important;
  }

  /* 📢 Imágenes promocionales (CUOTAS, FINANCIAMOS, etc.) más pequeñas */
  .elementor-widget-image img {
    max-width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
    border-radius: 6px !important;
  }



  /* 👇 Achicar todas las imágenes promocionales */
  .elementor-element-77a047f img,  /* CUOTAS SIN INTERESES */
  .elementor-element-6e2a3d1 img,  /* FINANCIAMOS DESDE 100 SOLES */
  .elementor-element-3e9b2c4 img,  /* FINANCIAMOS repuestos y accesorios */
  .elementor-element-5f1d8a7 img,  /* otra imagen promocional */
  .elementor-element-d6c5b7a img,  /* imagen inferior que no se achicaba */
  .elementor-element-2f8e3c1 img,  /* imagen superior que seguía grande */
  .elementor-element-278bd24 img, /* nueva imagen detectada */
  .elementor-element-0fec0b6 img  /* nueva imagen detectada */
  {
    width: 80% !important;
    max-width: 220px !important;
    margin: 0 auto !important;
    display: block !important;
    height: auto !important;
    object-fit: contain !important;
    border-radius: 6px !important;
  }


}


/* Quitar el cursor de lupa en la imagen principal */
.single-gallery #main-image {
  cursor: default !important;
}

/* Quitar pseudo-elementos que dibujan la lupa */
.single-gallery #main-image::before,
.single-gallery #main-image::after {
  display: none !important;
  content: none !important;
}

.single-gallery {
  position: relative ;
  overflow: hidden ;
}


/* Vista individual en escritorio */
@media (min-width:1025px) {
  .single-product.full-width {
    display: grid;
    grid-template-columns: minmax(500px, 1fr) 1fr; /* imagen nunca baja de 500px */
    gap: 2rem;
  }

  .single-gallery {
    position: relative;
    max-width: 100%;
  }

  .single-gallery img {
    width: 100%;
    height: auto;
    object-fit: contain;
  }
}


#main-image {
  width: 100% !important;
  height: auto !important;
  /*aspect-ratio: 4 / 3; /* ajusta según tu imagen */
  background-size: 100% 100% !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  transition: background-size 0.2s ease !important;
}







/* Asegura que la galería (imagen + miniaturas) se comporten como un bloque único */
.product-media {
  display: block;
}

/* Mantén la imagen principal en bloque */
.single-gallery {
  display: block;
}

/* Miniaturas debajo y centradas */
.gallery-thumbs {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.5rem;
  margin-top: 1rem;
}

.gallery-thumbs .thumb {
  width: 70px;
  height: auto;
  cursor: pointer;
  border: 2px solid transparent;
}

.gallery-thumbs .thumb.active {
  border-color: #FB8C00;
}



@media (max-width: 768px) {
  .nav-arrow {
    font-size: 1.5rem;
    padding: 0.4rem 0.8rem;
  }

  .nav-arrow.prev {
    left: 6px;
  }

  .nav-arrow.next {
    right: 6px;
  }

  .single-gallery {
    justify-content: center;
  }
}

@media (max-width: 768px) {
  .nav-arrow {
    font-size: 1rem;
    padding: 0.2rem 0.5rem;
    width: 28px;
    height: 28px;
    border-radius: 4px;
  }

  .nav-arrow.prev {
    left: 4px;
  }

  .nav-arrow.next {
    right: 4px;
  }


}



.open-full-gallery svg {
  width: 70%;
  height: 70%;
}

@media (max-width: 768px) {
  .open-full-gallery {
    width: 28px;
    height: 28px;
    top: 8px;
    right: 8px;
    border-radius: 6px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .open-full-gallery svg {
    width: 80%;
    height: 80%;
  }
}








.product-media-wrapper {
  width: 100%;
  max-width: 900px; /* o el ancho real que tenía tu imagen antes */
  margin: 0 auto;
}

.product-media {
  width: 100%;
}

.single-gallery {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.main-image-wrapper img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: contain;
}

/* Carrusel */
.gallery-thumbs-scroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}

.gallery-thumbs-scroll::-webkit-scrollbar {
  height: 6px;
}

.gallery-thumbs-scroll::-webkit-scrollbar-thumb {
  background: rgba(0,0,0,0.3);
  border-radius: 3px;
}

.gallery-thumbs {
  display: inline-flex;
  gap: 8px;
  min-width: max-content;
}

/* Miniatura activa */
.gallery-thumbs img.thumb.active {
  border-color: orange;
}

/* Contenedor de cada miniatura */
.gallery-thumbs .thumb-box {
  width: 160px;       /* tamaño del recuadro */
  height: 110px;      /* altura del recuadro */
  background: #fff;
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 2px solid transparent;
  box-sizing: border-box;
  overflow: hidden;
}

.gallery-thumbs .thumb-box img.thumb {
  max-width: 100%;    /* la imagen nunca excede el ancho */
  max-height: 100%;   /* la imagen nunca excede la altura */
  width: auto;        /* ← evita que se estire a lo ancho */
  height: auto;       /* ← evita que se estire a lo alto */
  object-fit: contain;/* ← asegura que se vea completa */
  display: block;
  cursor: pointer;
  transition: border 0.3s ease;
}


/* Imagen activa dentro de la miniatura */
.gallery-thumbs .thumb-box img.thumb.active {
  border: 2px solid orange;
}


@media (max-width: 768px) {
  .gallery-thumbs .thumb-box {
    width: 120px;   /* más grande que antes */
    height: 85px;   /* altura proporcional */
    padding: 4px;
  }

  .gallery-thumbs {
    gap: 8px;       /* separación un poco mayor */
  }
}





/* ===== Carrusel de miniaturas ===== */
.gallery-thumbs-scroll {
  overflow-x: auto;       /* scroll horizontal */
  overflow-y: hidden;
  white-space: nowrap;
  padding: 10px 0;
}

.gallery-thumbs {
  display: flex;
  gap: 12px;              /* espacio entre miniaturas */
}

.gallery-thumbs .thumb-box {
  width: 160px;           /* tamaño grande de miniatura */
  height: 110px;
  background: #fff;
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 2px solid transparent;
  box-sizing: border-box;
  overflow: hidden;
  cursor: pointer;
  transition: border 0.3s ease;
}

.gallery-thumbs .thumb-box img.thumb {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;    /* que la moto se vea completa */
  display: block;
}

.gallery-thumbs .thumb-box img.thumb.active {
  border: 2px solid #FB8C00; /* resalta la miniatura activa */
}

/* ===== Ajuste responsive ===== */
@media (max-width: 768px) {
  .gallery-thumbs .thumb-box {
    width: 120px;   /* un poco más pequeño en móvil */
    height: 85px;
  }
}

@media (max-width: 480px) {
  .gallery-thumbs .thumb-box {
    width: 100px;   /* aún más compacto en pantallas muy pequeñas */
    height: 70px;
  }
}

#main-image {
  max-width: 75%;
  max-height: 65vh;
  display: block;
  margin: 0 auto;
  object-fit: contain;
}



/* Bloque de la moto proporcional */
.single-gallery .main-image-wrapper {
  width: 100%;                /* ocupa todo el ancho disponible */
  aspect-ratio: 4 / 3;        /* proporción ancho/alto (ajusta según tu diseño: 16/9, 4/3, etc.) */
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}

/* Imagen ajustada dentro del bloque */
.single-gallery .main-image-wrapper img#main-image {
  width: 100%;
  height: 100%;
  object-fit: contain;        /* mantiene proporción sin distorsión */
}

/* Evita que el scroll del carrusel afecte el scroll de la página */
.gallery-thumbs-scroll {
  overscroll-behavior: contain;
}

/* Desactiva cualquier scroll "suave" que pueda amplificar el salto */
html {
  scroll-behavior: auto;
}












.financiar-modal {
  position: fixed;
  top: 0; left: 0;
  width: 100%; height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
}

.financiar-modal .modal-overlay {
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background: rgba(0,0,0,0.4);
}

.financiar-modal .modal-content {
  position: relative;
  background: #fff;
  padding: 20px;
  border-radius: 8px;
  text-align: center;
  max-width: 320px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.2);
  z-index: 1;
  border: 2px solid #25D366;


}



.financiar-modal button {
  margin: 10px;
  padding: 8px 14px;
  border: none;
  border-radius: 6px;
  cursor: pointer;
}


.financiar-modal .btn-yes { background: #25D366; color: #fff; }
.financiar-modal .btn-no { background: #ccc; }




.btn-descargar-pdf {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 4px;              /* opcional: espacio mínimo alrededor */
     /* borde negro pegado a la imagen */
  border-radius: 6px;
  background-color: transparent;
  text-decoration: none;
  box-sizing: border-box;
}


.btn-descargar-pdf img {
  height: 65px;   /* ← tamaño real de la imagen */
  width: auto;
  display: block;
}

.actions-inline {
  display: flex;
  gap: 10px;
  align-items: center; /* ← esto alinea todos los íconos al centro vertical */
  flex-wrap: wrap;
}

@media (max-width: 480px) {
  .btn-descargar-pdf img {
    height: 50px; /* la mitad de 65px */
  }
}

.desc, .long-desc { text-align: justify !important; }

.read-more-link {
  color: #0073aa;
  text-decoration: underline;
  cursor: pointer;
  font-weight: 500;
}
.read-more-link:hover {
  color: #005177;
}