/* ============================================================================
   assets/css/editorial-busqueda.css — Artículos editoriales en los resultados
   de búsqueda de productos (2026-10-21, CLAUDE.md §32)

   Marcado de ed_render_busqueda() (php/editorial.inc.php). Lo cargan la web
   pública (catalogo/resultados.inc.php) y la tienda de logic (/tienda/?q=):
   variables de main.css (logic las define en estilo_cabecera.css) con
   respaldo, y propiedades explícitas donde estilos_1.css de logic pone las
   suyas (enlaces en negrita, márgenes de h2/p).
   ============================================================================ */

.ed-busq{
  margin: var(--eM, 12px) 0 var(--eL, 20px);
  padding: var(--eM, 12px) var(--eM, 12px) var(--eS, 8px);
  background: var(--rC3, #fbf3f3);
  border: 1px solid var(--rC2, #f0d6d6);
  border-radius: var(--rM, 10px);
  font-family: var(--fuente-base, inherit);
  color: var(--gO, #333);
}
.ed-busq *{ box-sizing: border-box; }

.ed-busq__cab{ margin: 0 0 var(--eS, 8px); }
.ed-busq .ed-busq__titulo{
  margin: 0;
  padding: 0;                  /* main.css da padding-top a los h2 */
  font-size: var(--fM, 1.05rem);
  line-height: 1.3;
  font-weight: 600;
  color: var(--gO, #333);
}
.ed-busq .ed-busq__nota{
  margin: 2px 0 0;
  font-size: var(--fXS, .8rem);
  line-height: var(--lhXS, 1.35);
  color: var(--gO, #333);
  opacity: .75;
}

/* Fila con desplazamiento horizontal: no empuja los productos hacia abajo */
.ed-busq__lista{
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(280px, 340px);
  gap: var(--eS, 8px);
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  padding-bottom: var(--eS, 8px);
  overscroll-behavior-x: contain;
}

.ed-busq .ed-busq__item{
  display: flex;
  gap: var(--eS, 8px);
  scroll-snap-align: start;
  padding: var(--eS, 8px);
  background: #fff;
  border: 1px solid var(--rC2, #f0d6d6);
  border-radius: var(--rP, 6px);
  color: inherit;
  font-weight: normal;
  text-decoration: none;
  transition: border-color .2s ease, box-shadow .2s ease;
}
.ed-busq .ed-busq__item:hover,
.ed-busq .ed-busq__item:focus-visible{
  border-color: var(--rC, #d98c8c);
  box-shadow: 0 1px 6px rgba(0, 0, 0, .08);
}
.ed-busq .ed-busq__item:hover .ed-busq__nombre{ color: var(--r, #b13837); }

.ed-busq__media{
  flex: 0 0 96px;
  height: 72px;
  border-radius: 4px;
  overflow: hidden;
  background: var(--rC3, #fbf3f3);
  display: flex;
  align-items: center;
  justify-content: center;
}
.ed-busq__media img{ width: 100%; height: 100%; object-fit: cover; display: block; }
.ed-busq__media--logo img{ object-fit: contain; padding: 6px; }
.ed-busq__sinimg{ font-size: 28px; color: var(--rC, #d98c8c); }

.ed-busq__cuerpo{ display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ed-busq__chip{
  align-self: flex-start;
  padding: 1px 6px;
  border-radius: 999px;
  background: var(--r, #b13837);
  color: #fff;
  font-size: 11px;
  line-height: 16px;
  font-weight: 600;
  letter-spacing: .02em;
  text-transform: uppercase;
}
.ed-busq__meta{
  font-size: var(--fXS, .8rem);
  line-height: var(--lhXS, 1.35);
  opacity: .7;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ed-busq__nombre{
  font-size: var(--fS, .92rem);
  line-height: 1.3;
  font-weight: 600;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.ed-busq__motivo{
  font-size: var(--fXS, .8rem);
  line-height: var(--lhXS, 1.35);
  opacity: .85;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.ed-busq__motivo b{ font-weight: 600; }

@media (max-width: 600px){
  .ed-busq{ padding: var(--eS, 8px); }
  .ed-busq__lista{ grid-auto-columns: 85%; }
  .ed-busq__media{ flex-basis: 76px; height: 60px; }
}

@media print{
  .ed-busq__lista{ grid-auto-flow: row; grid-auto-columns: auto; overflow: visible; }
}