/* =====================================================================
   Catálogo · inec.com · ES y PT
   Ficha de producto, resultados de búsqueda y páginas de familia.
   Se carga en comunes/paginas/head.php justo después de paginas-cliente.css.
   Para volver al diseño anterior basta con quitar esa línea.
   Solo cambia el aspecto: no toca enlaces, formularios ni datos de Velneo.
   Cada sección se aplica solo a su página (con :has()); en un navegador
   muy antiguo esas páginas se ven como hasta ahora.
   Las miniaturas de la ficha de producto las crea catalogo.js; sin ese
   archivo la ficha se ve igual, solo que sin miniaturas.
   Colores de la guía de INEC: amarillo #FCCB28 · azul #1B2732
   Icono de flecha: Phosphor Icons (bold), licencia MIT.
   ===================================================================== */

#content{
  --ui:"Segoe UI", -apple-system, BlinkMacSystemFont, Roboto, "Helvetica Neue", Arial, sans-serif;
  --azul:#1B2732;
  --amarillo:#FCCB28;
  --suave:#5b6672;
  --borde:#cfd6dd;
  --linea:#e4e8ec;
  --fondo-suave:#f5f7f9;
  --pozo:#f3f4f6;
}

/* =====================================================================
   0 · Piezas compartidas: margen, título, descripción y "Pertenece a la familia"
   ===================================================================== */
/* Aire a los lados: 22 px junto a la columna izquierda y lo mismo junto a la
   derecha (que ya tiene 10 px de separación). El ancho total no cambia. */
#content:has(#conjunto),
#content:has(#descripcion-familia),
#content:has(form[name="busca"]){
  box-sizing:border-box;
  padding-left:22px;
  padding-right:12px;
}

#content:has(#descripcion-familia) #login > h4,
#content #conjunto > h2{
  margin:6px 0 10px;
  padding:0;
  border:0;
  font:700 28px/1.2 var(--ui);
  letter-spacing:-.01em;
  color:var(--azul);
  text-wrap:balance;
}
#content #conjunto > h2{font-size:24px;margin-bottom:18px}

#content #descripcion-familia{
  width:auto;
  max-width:none; /* el texto ocupa todo el ancho, sin hueco a la derecha */
  margin:0 0 14px;
  font:400 14px/1.6 var(--ui);
  color:#3d4954;
}

/* "Pertenece a la Familia:" como fila de etiquetas */
#content #familia-link{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:6px;
  width:auto;
  margin:0 0 20px;
  padding:0;
  border:0;
  font:600 12.5px/1.2 var(--ui);
  color:var(--suave);
}
#content #familia-link .atras{display:none}
#content #familia-link a{
  display:inline-block;
  margin:0;
  padding:6px 12px;
  border-radius:999px;
  background:var(--fondo-suave);
  border:1px solid var(--linea);
  font:600 12.5px/1.2 var(--ui);
  color:var(--azul);
  text-decoration:none;
  transition:border-color 150ms ease, background-color 150ms ease;
}
#content #familia-link a:hover{border-color:var(--amarillo);background:#ffffff}

/* =====================================================================
   1 · Páginas de familia
   ===================================================================== */
#content:has(#descripcion-familia) #scroll{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:16px;
  margin-bottom:24px;
}
#content:has(#descripcion-familia) #scroll > #descripcion-familia,
#content:has(#descripcion-familia) #scroll > #familia-link{grid-column:1 / -1;margin-bottom:0}
#content:has(#descripcion-familia) #scroll > #familia-link{margin-bottom:6px}

/* Tarjeta común a subfamilias (.titulo-p) y productos (.titulo_es / .titulo_pt) */
#content .titulo-p,
#content .titulo_es,
#content .titulo_pt{
  float:none;
  width:auto;
  height:auto;
  margin:0;
  box-sizing:border-box;
  position:relative;
  display:flex;
  flex-direction:column;
  padding:8px 8px 14px;
  background:#ffffff none;
  border:1px solid #e4e6e9;
  border-radius:16px;
  box-shadow:0 1px 2px rgba(20,24,30,.05);
  font-family:var(--ui);
  transition:transform 220ms cubic-bezier(.23,1,.32,1), box-shadow 220ms cubic-bezier(.23,1,.32,1), border-color 220ms ease;
}
/* Foto primero, en su fondo gris; el blanco de la foto se funde con él */
#content .titulo-p .imgfs,
#content .titulo_es .imgfc,
#content .titulo_pt .imgfc{
  order:-1;
  height:136px;
  margin:0 0 12px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:var(--pozo);
  border-radius:9px;
  overflow:hidden;
}
#content .titulo-p .imgfs > div,
#content .titulo_es .imgfc > div,
#content .titulo_pt .imgfc > div{text-align:center;line-height:0}
#content .titulo-p .imgfs img,
#content .titulo_es .imgfc img,
#content .titulo_pt .imgfc img{
  display:block;
  max-width:100%;
  height:auto;
  mix-blend-mode:multiply;
  transition:transform 320ms cubic-bezier(.23,1,.32,1);
}
#content .imgfs :hover,
#content .imgfc :hover{transform:none}

/* Título */
#content .titulo-p .titulo-familia,
#content .titulo_es .titulo-conjunto,
#content .titulo_pt .titulo-conjunto{
  float:none;
  width:auto;
  height:auto;
  margin:0 6px 6px;
  text-align:left;
  font:inherit;
}
#content .listado-familia-link a,
#content .listado-familia-link-producto a{
  font:600 13px/1.35 var(--ui);
  color:#1f2023;
  text-decoration:none;
}
#content .listado-familia-link a{font-size:15px;font-weight:700}
#content .listado-familia-link a:hover{color:#1f2023}
/* Flecha tras el nombre de la subfamilia: indica que lleva a otro listado */
#content .listado-familia-link a::after{
  content:"";
  display:inline-block;
  width:12px;
  height:12px;
  margin-left:6px;
  vertical-align:-1px;
  background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="%231B2732"><path d="M184.49,136.49l-80,80a12,12,0,0,1-17-17L159,128,87.51,56.49a12,12,0,1,1,17-17l80,80A12,12,0,0,1,184.49,136.49Z"/></svg>') center/contain no-repeat;
}
/* Toda la tarjeta es clicable (mismo enlace que el título) */
#content .titulo-p .titulo-familia a::before,
#content .titulo_es .titulo-conjunto a::before,
#content .titulo_pt .titulo-conjunto a::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:16px;
  z-index:1;
}

/* Descripción */
#content .listado-familia-des,
#content .listado-conjunto-des{height:auto;padding:0 6px}
#content .listado-familia-des a,
#content .listado-conjunto-des a{
  float:none;
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
  width:auto;
  height:auto;
  margin:0;
  text-align:left;
  font:400 12px/1.5 var(--ui);
  color:#5d6168;
  text-decoration:none;
}

/* Con sesión: referencia, stock y precio al pie de la tarjeta */
#content .titulo_es .divFooterTituloFam,
#content .titulo_pt .divFooterTituloFam{
  float:none;
  width:auto;
  height:auto;
  margin:auto 6px 0;
  padding:10px 0 0;
  border-top:1px solid #eceef0;
  display:flex;
  align-items:center;
  gap:6px;
  position:relative;
  z-index:2;
}
#content .titulo_es .divRefFam,
#content .titulo_pt .divRefFam{float:none;display:block;flex:1 1 auto;min-width:0;margin:0}
#content .titulo_es .divRefFam a,
#content .titulo_pt .divRefFam a{font:500 11px/1.2 var(--ui);color:#6b7078;letter-spacing:.01em}
#content .titulo_es .divFooterTituloFam > img,
#content .titulo_pt .divFooterTituloFam > img{flex:none}
#content .titulo_es .divPrecioFam,
#content .titulo_pt .divPrecioFam{float:none;display:block;width:auto;margin:0;font-size:13px}
#content .titulo_es .divPrecioFam a,
#content .titulo_pt .divPrecioFam a{display:flex;align-items:baseline;color:#1f2023;font-variant-numeric:tabular-nums}
#content .titulo_es .precioFamEnt,
#content .titulo_es .precioFamDec,
#content .titulo_es .precioFamEur,
#content .titulo_pt .precioFamEnt,
#content .titulo_pt .precioFamDec,
#content .titulo_pt .precioFamEur{float:none;display:inline;margin:0;font-family:var(--ui);font-weight:700}
#content .titulo_es .precioFamEnt,
#content .titulo_pt .precioFamEnt{font-size:18px;letter-spacing:-.01em}
#content .titulo_es .precioFamDec,
#content .titulo_pt .precioFamDec{font-size:12px}
#content .titulo_es .precioFamEur,
#content .titulo_pt .precioFamEur{font-size:13px;margin-left:2px}

/* Interacción con ratón */
@media (hover:hover) and (pointer:fine){
  #content .titulo-p:hover,
  #content .titulo_es:hover,
  #content .titulo_pt:hover{
    transform:translateY(-3px);
    border-color:#d4d7db;
    box-shadow:0 14px 28px -14px rgba(20,24,30,.28);
  }
  #content .titulo-p:hover .imgfs img,
  #content .titulo_es:hover .imgfc img,
  #content .titulo_pt:hover .imgfc img{transform:scale(1.04)}
  #content .titulo-p:hover .listado-familia-link a,
  #content .titulo_es:hover .listado-familia-link-producto a,
  #content .titulo_pt:hover .listado-familia-link-producto a{
    text-decoration:underline;
    text-decoration-color:var(--amarillo);
    text-decoration-thickness:2px;
    text-underline-offset:3px;
  }
}
#content .titulo-p a:focus-visible,
#content .titulo_es a:focus-visible,
#content .titulo_pt a:focus-visible{outline:2px solid #242424;outline-offset:2px;border-radius:4px}

/* Selector de orden (con sesión) */
#content #div_Ord{font-family:var(--ui)}
#content #lbl_Ord{font:600 12.5px/1.2 var(--ui);color:var(--azul)}
#content #cont_Ord{border:1px solid var(--borde);border-radius:10px;padding:6px 10px;box-shadow:0 8px 20px -12px rgba(27,39,50,.35)}
#content .Ord_Act,
#content .Ord_Inact,
#content .Ord_Inact > a{font:500 12.5px/1.3 var(--ui);color:var(--azul)}

/* =====================================================================
   2 · Ficha de producto
   ===================================================================== */
/* "« Familia" a la izquierda e icono de imprimir a la derecha */
#content:has(#conjunto) .volver-link{
  display:flex;
  align-items:center;
  gap:6px;
  width:auto;
  height:auto;
  margin:6px 0 4px;
  font:600 12.5px/1.2 var(--ui);
  color:var(--suave);
}
#content:has(#conjunto) .volver-link a{font:600 12.5px/1.2 var(--ui);color:var(--suave);text-decoration:none}
#content:has(#conjunto) .volver-link a:hover{color:var(--azul);text-decoration:underline}
#content:has(#conjunto) .volver-link .atras{color:var(--suave)}
#content:has(#conjunto) .volver-link .print{float:none;width:auto;height:auto;margin-left:auto}
#content:has(#conjunto) .volver-link .print img{display:block;opacity:.6;transition:opacity 150ms ease}
#content:has(#conjunto) .volver-link .print:hover img{opacity:1}

/* Foto + descripción en dos columnas */
#content #conjunto .foto-descripcion{float:none}
#content #conjunto .foto-descripcion > table,
#content #conjunto .foto-descripcion > table > tbody{display:block;width:100%}
#content #conjunto .foto-descripcion > table > tbody{
  display:grid;
  grid-template-columns:250px minmax(0,1fr);
  gap:24px;
  align-items:start;
}
#content #conjunto .foto-descripcion tr{display:contents}
#content #conjunto .foto-descripcion td{display:block;width:auto;padding:0}
#content #conjunto .foto-descripcion tr:first-child td{
  display:flex;
  align-items:center;
  justify-content:center;
  height:170px;
  background:var(--pozo);
  border-radius:14px;
}
#content #conjunto .foto-descripcion tr:first-child img{display:block;max-width:100%;height:auto;mix-blend-mode:multiply}

/* Con galería (catalogo.js): foto principal arriba y miniaturas debajo */
#content #conjunto .foto-descripcion tr:first-child td.cat-con-galeria{
  flex-direction:column;
  align-items:stretch;
  justify-content:flex-start;
  gap:8px;
  height:auto;
  background:none;
  border-radius:0;
}
#content #conjunto .foto-descripcion td.cat-con-galeria > a[rel="aumenta"]{
  display:flex;
  align-items:center;
  justify-content:center;
  height:170px;
  background:var(--pozo);
  border-radius:14px;
}
#content #conjunto .cat-galeria-mini{display:flex;gap:8px}
#content #conjunto .cat-mini{
  flex:1 1 0;
  min-width:0;
  display:flex;
  align-items:center;
  justify-content:center;
  height:56px;
  background:var(--pozo);
  border-radius:9px;
  overflow:hidden;
  text-decoration:none;
  transition:box-shadow 150ms ease;
}
#content #conjunto .foto-descripcion tr:first-child .cat-mini img{width:100%;height:100%;max-width:none;object-fit:contain}
#content #conjunto .cat-mini-mas{
  background:#ffffff;
  border:1px solid var(--linea);
  box-sizing:border-box;
  font:600 12.5px/1.2 var(--ui);
  color:var(--azul);
  white-space:nowrap;
}
#content #conjunto .cat-mini:hover{box-shadow:inset 0 0 0 2px var(--amarillo)}
#content #conjunto .cat-mini:focus-visible{outline:2px solid var(--azul);outline-offset:2px}

#content #conjunto .texto-descrip{
  margin:0;
  max-width:none;
  text-align:left;
  font:400 14px/1.65 var(--ui);
  color:#3d4954;
}
#content #conjunto > p:empty{display:none}
#content #conjunto .linea-g{display:none}
#content #conjunto #familia-link{margin-top:20px}

/* Tabla de referencias, precios y cantidades */
#content #conjunto > table{
  width:100%;
  margin:0 0 26px;
  border-collapse:separate;
  border-spacing:0;
  background:#ffffff;
  border:1px solid var(--linea);
  border-radius:14px;
  overflow:hidden;
  font:400 13px/1.4 var(--ui);
  color:var(--azul);
}
#content #conjunto > table td{padding:10px 7px;vertical-align:middle}
#content #conjunto .tabla-referencia,
#content #conjunto .tabla-descripcion,
#content #conjunto .tabla-cantidad,
#content #conjunto .tabla-precio,
#content #conjunto .tabla-unidades,
#content #conjunto .tabla-carrito,
#content #conjunto .tabla-stock,
#content #conjunto .tabla-pedido{
  width:auto;
  padding:11px 7px;
  background:var(--fondo-suave);
  border-bottom:1px solid var(--linea);
  font:600 12px/1.2 var(--ui);
  color:var(--suave);
  white-space:nowrap;
}
#content #conjunto .tabla-referencia,
#content #conjunto .tabla-descripcion{text-align:left}
#content #conjunto .tabla-cantidad{text-align:center}
#content #conjunto .tabla-precio{text-align:right}
#content #conjunto .tabla-codigo-dato{
  padding-left:10px;
  font:600 13px/1.3 var(--ui);
  font-variant-numeric:tabular-nums;
  white-space:nowrap;
}
#content #conjunto .tabla-descripcion-dato{padding-left:10px;font:400 12.5px/1.4 var(--ui);color:#3d4954}
#content #conjunto .tabla-descripcion-dato img{vertical-align:-3px;margin-right:4px}
/* Foto de cada artículo: la casilla gris se reserva desde el principio (con el
   icono de la cámara centrado) y catalogo.js pone dentro la miniatura, así la
   fila no salta al cargar. */
#content #conjunto td.tabla-descripcion-dato > a[rel="aumenta"]{display:inline-block;vertical-align:middle;margin-right:8px;line-height:0;border-radius:6px}
#content #conjunto td.tabla-descripcion-dato > a[rel="aumenta"] > img{
  box-sizing:border-box;
  width:56px;
  height:32px;
  margin:0;
  vertical-align:middle;
  object-fit:none;
  background:var(--pozo);
  border-radius:6px;
  transition:box-shadow 150ms ease;
}
#content #conjunto td.tabla-descripcion-dato > a[rel="aumenta"] > img.cat-mini-art{object-fit:contain;mix-blend-mode:multiply}
#content #conjunto td.tabla-descripcion-dato > a[rel="aumenta"]:hover > img{box-shadow:inset 0 0 0 2px var(--amarillo)}
/* Tramos de cantidad (≥1, ≥5…) y precios */
#content #conjunto .tabla-cantidad-dato{font:500 12px/1.3 var(--ui);color:var(--suave);text-align:center}
#content #conjunto .tabla-precio-dato{
  padding-right:8px;
  font:700 14px/1.3 var(--ui);
  font-variant-numeric:tabular-nums;
  white-space:nowrap;
  text-align:right;
  color:var(--azul);
}
/* Mensajes que ocupan toda la fila ("Necesario Iniciar Sesión...", "Sin precio"...) */
#content #conjunto .tabla-cantidad-dato[colspan]{
  padding:14px 10px;
  font:500 13px/1.4 var(--ui);
  color:var(--suave);
}
/* Cantidad + Añadir */
#content #conjunto > table form{display:inline-flex;align-items:center;gap:6px;margin:0}
#content #conjunto .tabla-input-dato{
  box-sizing:border-box;
  width:46px;
  height:34px;
  margin:0;
  padding:0 6px;
  border:1px solid var(--borde);
  border-radius:8px;
  background:#ffffff;
  color:var(--azul);
  text-align:center;
  font:500 13px/1 var(--ui);
}
#content #conjunto .tabla-input-dato:focus{outline:none;border-color:var(--azul);box-shadow:0 0 0 3px rgba(252,203,40,.6)}
#content #conjunto .tabla-boton-anade{
  box-sizing:border-box;
  width:auto;
  height:34px;
  margin:0;
  padding:0 12px;
  border:0;
  border-radius:8px;
  background:var(--amarillo);
  color:var(--azul);
  font:700 12.5px/1 var(--ui);
  cursor:pointer;
  transition:filter 150ms ease, transform 120ms ease;
}
#content #conjunto .tabla-boton-anade:hover{filter:brightness(1.05)}
#content #conjunto .tabla-boton-anade:active{transform:scale(.97)}
#content #conjunto .tabla-boton-anade:focus-visible{outline:2px solid var(--azul);outline-offset:2px}
#content #conjunto .tabla-stock-dato{text-align:center}
#content #conjunto .tabla-pedido-dato{text-align:right;font:600 12.5px/1.2 var(--ui)}
#content #conjunto .tabla-pedido-dato a{color:var(--azul);text-decoration:none}
/* Separador entre referencias */
#content #conjunto td.linea-tabla-conjunto{height:0;padding:0;margin:0;background:none;border-top:1px solid #eef1f4}
#content #conjunto td.codfab{padding-top:0;font:italic 400 11.5px/1.3 var(--ui);color:var(--suave)}

/* Pestañas Ficha técnica / Galería de fotos (jQuery UI) */
#content #conjunto #tabs{
  padding:0;
  border:0;
  border-radius:0;
  background:none;
  font-family:var(--ui);
}
#content #conjunto #tabs .ui-tabs-nav{
  display:flex;
  gap:4px;
  margin:0;
  padding:0;
  border:0;
  border-bottom:1px solid var(--linea);
  border-radius:0;
  background:none;
}
#content #conjunto #tabs .ui-tabs-nav::after{display:none}
#content #conjunto #tabs .ui-tabs-nav li{
  float:none;
  margin:0 0 -1px;
  padding:0;
  border:0;
  background:none;
}
#content #conjunto #tabs .ui-tabs-nav li a{
  float:none;
  display:block;
  padding:11px 16px;
  font:600 13.5px/1.2 var(--ui);
  color:var(--suave);
  text-decoration:none;
  border-bottom:2px solid transparent;
  transition:color 150ms ease, border-color 150ms ease;
}
#content #conjunto #tabs .ui-tabs-nav li a:hover{color:var(--azul)}
#content #conjunto #tabs .ui-tabs-nav li.ui-tabs-selected a,
#content #conjunto #tabs .ui-tabs-nav li.ui-state-active a{color:var(--azul);border-bottom-color:var(--amarillo)}
#content #conjunto #tabs .ui-tabs-panel{padding:14px 0 0;border:0;background:none}
#content #conjunto #tabs .ui-tabs-hide{display:none}

/* Ficha técnica: filas alternas, etiqueta a la izquierda y valor a la derecha */
#content #conjunto #tabs-1 > table{width:100%;border-collapse:collapse}
#content #conjunto #tabs-1 > table:nth-of-type(odd){background:var(--fondo-suave)}
#content #conjunto #tabs-1 > table td{padding:9px 12px;vertical-align:top}
#content #conjunto #tabs-1 > table:first-of-type{border-radius:10px 10px 0 0}
#content #conjunto #tabs-1 .tipo-desc,
#content #conjunto #tabs-1 .tipo-desc b{border:0;font:600 13px/1.4 var(--ui);color:var(--suave);text-align:left}
#content #conjunto #tabs-1 .desc{border:0;padding:0;font:400 13px/1.4 var(--ui);color:var(--azul);text-align:left}

/* Galería: fotos grandes en dos columnas */
#content #conjunto #tabs-2{display:flex;flex-wrap:wrap;gap:12px}
#content #conjunto #tabs-2.ui-tabs-hide{display:none}
#content #conjunto #tabs-2 .galeria-titulo{flex:0 0 100%;margin:6px 0 0;padding:0;font:600 12.5px/1.2 var(--ui);color:var(--suave)}
#content #conjunto #tabs-2 > a{flex:0 0 calc(50% - 6px);display:block;line-height:0}
#content #conjunto #tabs-2 .foto-galeria{
  box-sizing:border-box;
  width:100%;
  height:auto;
  margin:0;
  border:1px solid var(--linea);
  border-radius:12px;
  background:#ffffff;
}

#content:has(#conjunto) .codigo-conjunto{margin:16px 0 0;text-align:right;font:500 11px/1 var(--ui);color:#9aa3ab}

/* =====================================================================
   3 · Resultados de búsqueda
   ===================================================================== */
/* Formulario de búsqueda */
#content form[name="busca"] > table{
  width:auto;
  margin:6px 0 18px;
  padding:12px 14px;
  border-collapse:separate;
  border-spacing:0;
  background:var(--fondo-suave);
  border:1px solid var(--linea);
  border-radius:14px;
  font:400 13px/1.3 var(--ui);
  color:var(--azul);
}
#content form[name="busca"] > table td{padding:4px 6px;vertical-align:middle}
#content form[name="busca"] > table b{font:600 13px/1.3 var(--ui)}
#content form[name="busca"] .input-text-user{width:260px}
#content form[name="busca"] input[type="checkbox"]{margin:0}
#content form[name="busca"] .boton-text-user{margin-left:12px}

#content:has(form[name="busca"]) #descripcion{width:auto;margin:0 0 14px;font:600 15px/1.4 var(--ui);color:var(--azul)}
#content:has(form[name="busca"]) .tabla-busqueda{float:none;display:flow-root;width:auto;border:0}
/* table-layout:fixed: la tabla exterior se ajusta a la columna y no al nombre más largo */
#content:has(form[name="busca"]) .tabla-busqueda > table{float:none;width:100%;table-layout:fixed}

/* Cada resultado: una tarjeta con la foto a la izquierda */
#content .tabla-busqueda table table{
  display:grid;
  grid-template-columns:120px minmax(0,1fr);
  column-gap:16px;
  row-gap:4px;
  align-items:start;
  width:100%;
  box-sizing:border-box;
  margin:0 0 10px;
  padding:10px;
  background:#ffffff;
  border:1px solid #e4e6e9;
  border-radius:16px;
  box-shadow:0 1px 2px rgba(20,24,30,.05);
  transition:border-color 200ms ease, box-shadow 200ms ease;
}
#content .tabla-busqueda table table > tbody,
#content .tabla-busqueda table table tr{display:contents}
#content .tabla-busqueda table table td{display:block;width:auto;padding:0;background:none}
/* Foto */
#content .tabla-busqueda table table td:has(> .img-busqueda){grid-column:1;grid-row:1 / span 3}
#content .tabla-busqueda .img-busqueda{
  float:none;
  display:flex;
  align-items:center;
  justify-content:center;
  width:120px;
  height:84px;
  border:0;
  border-radius:10px;
  background:var(--pozo);
  overflow:hidden;
}
#content .tabla-busqueda .img-busqueda img{display:block;max-width:100%;max-height:100%;height:auto;mix-blend-mode:multiply}
/* Nombre */
#content .tabla-busqueda table table td:has(.descripcion-busqueda){grid-column:2;grid-row:1}
#content .tabla-busqueda .descripcion-busqueda a{
  margin:0;
  font:600 14.5px/1.35 var(--ui);
  color:var(--azul);
  text-decoration:none;
}
#content .tabla-busqueda .descripcion-busqueda a:hover{text-decoration:underline;text-decoration-color:var(--amarillo);text-decoration-thickness:2px;text-underline-offset:3px}
/* Familias (en resultados de producto y de familia) */
#content .tabla-busqueda table table td.tabla-conjunto,
#content .tabla-busqueda table table td.tabla-familia{grid-column:2;grid-row:2}
#content .tabla-busqueda div.resultado-busqueda{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:4px 8px;
  margin:0;
  font:400 12px/1.4 var(--ui);
  color:var(--suave);
}
#content .tabla-busqueda span.resultado-busqueda{margin:0}
#content .tabla-busqueda .resultado-busqueda a{margin:0;font:500 12px/1.4 var(--ui);color:var(--suave);text-decoration:underline;text-decoration-color:rgba(91,102,114,.35);text-underline-offset:2px}
#content .tabla-busqueda .resultado-busqueda a:hover{color:var(--azul)}
/* Referencias como etiquetas (fila 3) y referencias de fabricante (fila 4) */
#content .tabla-busqueda table table td:has(> .codigo-busqueda){grid-column:2;grid-row:3}
#content .tabla-busqueda table table td:has(> div > .codigo-busqueda){grid-column:2;grid-row:4}
#content .tabla-busqueda table table td:has(> .codigo-busqueda),
#content .tabla-busqueda table table td:has(> div > .codigo-busqueda) > div{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
#content .tabla-busqueda .codigo-busqueda{float:none !important;margin:0 2px 0 0;font:400 12px/1.4 var(--ui);color:var(--suave)}
#content .tabla-busqueda table table td:has(.codigo-busqueda) div[style]{float:none !important;display:inline-flex;align-items:center;gap:4px}
#content .tabla-busqueda table table td:has(.codigo-busqueda) a:not([href]){display:none} /* separadores "-" */
#content .tabla-busqueda table table td:has(.codigo-busqueda) a[href]{
  display:inline-block;
  padding:4px 10px;
  border-radius:999px;
  background:var(--fondo-suave);
  border:1px solid var(--linea);
  font:600 12px/1.2 var(--ui);
  font-variant-numeric:tabular-nums;
  color:var(--azul);
  text-decoration:none;
}
#content .tabla-busqueda table table td:has(.codigo-busqueda) a[href]:hover{border-color:var(--amarillo);background:#ffffff}
#content .tabla-busqueda table table td:has(> div > .codigo-busqueda) a[href]{background:#ffffff;font-weight:500}
/* Semáforo de stock junto a cada referencia (con sesión) */
#content .tabla-busqueda table table td:has(.codigo-busqueda) div[style] img{display:block;width:auto;height:12px}
/* Resultado que es una familia: etiqueta "Familia" */
#content .tabla-busqueda table table td:has(> .codigo-busqueda:only-child) > .codigo-busqueda{
  padding:3px 10px;
  border-radius:999px;
  background:#e9edf1;
  font:600 11.5px/1.3 var(--ui);
  color:var(--azul);
}
/* Filas vacías y línea separadora antigua */
#content .tabla-busqueda table table td:empty,
#content .tabla-busqueda table table td:has(> .linea-busqueda){display:none}
@media (hover:hover) and (pointer:fine){
  #content .tabla-busqueda table table:hover{border-color:#d4d7db;box-shadow:0 10px 24px -14px rgba(20,24,30,.28)}
}

/* Sin movimiento si el usuario lo tiene desactivado */
@media (prefers-reduced-motion:reduce){
  #content .titulo-p, #content .titulo_es, #content .titulo_pt,
  #content .imgfs img, #content .imgfc img,
  #content .tabla-busqueda table table{transition:none}
  #content .titulo-p:hover, #content .titulo_es:hover, #content .titulo_pt:hover,
  #content .titulo-p:hover .imgfs img, #content .titulo_es:hover .imgfc img, #content .titulo_pt:hover .imgfc img{transform:none}
}