/* ══════════════════════════════════════════════════════════════════════════
   Listados de la tienda (1-oct): filtros propios y banner pequeño.

   Solo carga con el interruptor encendido y en listados de producto; todo
   cuelga de body.musas-listado. Los ID de elemento son los de su plantilla
   «Products Archive» (5044), igual en su web y en la réplica.

   No cambia familias de letra (siguen las de su kit); solo tamaños y espacios.
   ══════════════════════════════════════════════════════════════════════════ */

body.musas-listado{
  --mf-texto:#1d1d1b;
  --mf-suave:#6b625b;
  --mf-linea:#e6e0da;
  --mf-fondo:#f4f1ee;
  --mf-acento:#BE573A;
}

/* ── El banner: de 274 px a una franja de una línea ────────────────────── */
body.musas-listado .elementor-element-d7916f5{
  --min-height:0px !important;
  --padding-top:12px !important; --padding-bottom:12px !important;
  --padding-left:20px !important; --padding-right:20px !important;
  --margin-bottom:10px !important;
  flex-direction:row !important; flex-wrap:wrap !important; align-items:center !important;
  gap:4px 18px !important;
}
/* Fijo bajo la cabecera mientras se baja (reunión del 2-oct): anuncia la novedad
   con su «Compra ahora». La foto de fondo se queda, pequeña, a la derecha. */
body.musas-listado .elementor-element-d7916f5{
  position:sticky !important; top:var(--musas-cab-alto,0px); z-index:20; transition:top .15s ease;
  overflow:hidden; padding-right:clamp(120px,28%,320px) !important;
  box-shadow:0 6px 14px -12px rgba(29,29,27,.35);
}
body.musas-listado .elementor-element-d7916f5::before{
  display:block !important; left:auto !important; right:0 !important; width:clamp(110px,26%,300px) !important;
  background-size:cover !important; background-position:center 30% !important; opacity:1 !important;
}
body.musas-listado .elementor-element-d7916f5 .elementor-element-bd9ea62{display:none !important}
body.musas-listado .elementor-element-d7916f5 .elementor-element-818134c{
  width:auto !important; max-width:none !important; --container-widget-width:auto !important;
}
body.musas-listado .elementor-element-d7916f5 .elementor-element-818134c > .elementor-widget-container{margin:0 !important}
body.musas-listado .elementor-element-d7916f5 .elementor-element-818134c .elementor-heading-title{
  font-size:17px !important; line-height:1.3 !important; letter-spacing:.01em;
}
body.musas-listado .elementor-element-d7916f5 .elementor-element-818134c .elementor-heading-title br{display:none}
/* El botón entra animado (fadeIn): sin la animación no se queda invisible. */
body.musas-listado .elementor-element-d7916f5 .elementor-element-7fe7a67{
  visibility:visible !important; opacity:1 !important; animation:none !important; margin-left:auto;
}
body.musas-listado .elementor-element-d7916f5 .elementor-element-7fe7a67 .elementor-button{font-size:13px !important}

/* ── Los avisos (WhatsApp, Click and Collect…): una línea pequeña ──────── */
body.musas-listado .elementor-element-e04e530{
  display:flex !important; flex-wrap:nowrap !important; gap:0 !important;
  --margin-bottom:18px !important; margin-bottom:18px !important;
  overflow-x:auto; scrollbar-width:none;
  border-top:1px solid var(--mf-linea); border-bottom:1px solid var(--mf-linea);
}
body.musas-listado .elementor-element-e04e530::-webkit-scrollbar{display:none}
body.musas-listado .elementor-element-e04e530 > .elementor-widget-icon-box{flex:1 0 auto; width:auto !important; margin:0 !important}
body.musas-listado .elementor-element-e04e530 .elementor-icon-box-wrapper{
  display:flex !important; align-items:center; gap:6px; padding:7px 12px; text-align:left !important;
}
body.musas-listado .elementor-element-e04e530 .elementor-icon-box-icon{margin:0 !important; line-height:0}
body.musas-listado .elementor-element-e04e530 .elementor-icon{font-size:14px !important}
body.musas-listado .elementor-element-e04e530 .elementor-icon svg{width:14px !important; height:14px !important}
body.musas-listado .elementor-element-e04e530 .elementor-icon-box-content{display:flex; align-items:baseline; gap:4px; white-space:nowrap}
body.musas-listado .elementor-element-e04e530 .elementor-icon-box-title{
  font-size:12px !important; line-height:1.3 !important; margin:0 !important; font-weight:600;
}
body.musas-listado .elementor-element-e04e530 .elementor-icon-box-description{
  font-size:12px !important; line-height:1.3 !important; margin:0 !important; color:var(--mf-suave);
}

/* ── El panel de filtros ──────────────────────────────────────────────── */
.musas-filtros{font-size:14px; color:var(--mf-texto,#1d1d1b); padding-right:24px}
.musas-filtros details > summary{list-style:none; cursor:pointer}
.musas-filtros details > summary::-webkit-details-marker{display:none}
.musas-filtros__cab{
  font-size:12px; letter-spacing:.12em; text-transform:uppercase; font-weight:600;
  padding:4px 0 10px; border-bottom:1px solid var(--mf-linea,#e6e0da);
}
.musas-filtros__activos{color:var(--mf-acento,#BE573A)}
.musas-filtros__limpiar{
  display:inline-block; margin:10px 0 0; font-size:13px; color:var(--mf-acento,#BE573A);
  text-decoration:underline; text-underline-offset:3px;
}
.musas-filtros__grupo{border-bottom:1px solid var(--mf-linea,#e6e0da)}
.musas-filtros__grupo > summary{
  display:flex; justify-content:space-between; align-items:center;
  padding:14px 0 10px; font-weight:600; font-size:14px;
}
.musas-filtros__grupo > summary::after{
  content:""; width:6px; height:6px; margin-right:4px;
  border-right:1.3px solid currentColor; border-bottom:1.3px solid currentColor;
  transform:rotate(45deg) translateY(-2px); transition:transform .2s ease;
}
.musas-filtros__grupo[open] > summary::after{transform:rotate(-135deg) translateY(-1px)}
.musas-filtros__grupo ul{list-style:none; margin:0 0 12px; padding:0}
.musas-filtros__grupo li{margin:0}
.musas-filtros__grupo a{
  display:flex; align-items:center; gap:10px; padding:5px 0; min-height:28px;
  color:inherit; text-decoration:none; line-height:1.3;
}
.musas-filtros__grupo a:hover .musas-filtros__nombre{text-decoration:underline; text-underline-offset:3px}
.musas-filtros a:focus-visible, .musas-filtros summary:focus-visible{outline:2px solid var(--mf-acento,#BE573A); outline-offset:2px}
.musas-filtros__caja{
  flex:0 0 16px; width:16px; height:16px; border:1.3px solid #8f8780; border-radius:3px; position:relative;
}
.musas-filtros a.is-on .musas-filtros__caja{background:var(--mf-acento,#BE573A); border-color:var(--mf-acento,#BE573A)}
.musas-filtros a.is-on .musas-filtros__caja::after{
  content:""; position:absolute; left:4.5px; top:1px; width:4px; height:8px;
  border-right:2px solid #fff; border-bottom:2px solid #fff; transform:rotate(45deg);
}
.musas-filtros a.is-on .musas-filtros__nombre{font-weight:600}
.musas-filtros__nombre{flex:1 1 auto}
.musas-filtros__n{color:var(--mf-suave,#6b625b); font-size:12px; font-variant-numeric:tabular-nums}

/* En escritorio el panel siempre está abierto: el «Filtrar» es solo un título. */
@media (min-width:768px){
  .musas-filtros__cab{pointer-events:none}
  /* Sin barra propia: todos los grupos a la vista al bajar la página (MENU-2). */
  body.musas-listado .elementor-element-eb98d68{align-self:flex-start}
}

/* ── Móvil: «Filtrar (n)» como botón; el panel se abre al pulsarlo ────── */
@media (max-width:767px){
  .musas-filtros{padding:0 0 12px}
  .musas-filtros__cab{
    display:flex; justify-content:center; align-items:center; gap:6px;
    border:1px solid var(--mf-texto,#1d1d1b); border-radius:999px; padding:11px 16px;
    font-size:12px; margin-bottom:6px;
  }
  .musas-filtros__todo[open] > .musas-filtros__cab{margin-bottom:4px}
  body.musas-listado .elementor-element-eb98d68{height:auto !important}
  body.musas-listado .elementor-element-d7916f5{--padding-top:10px !important; --padding-bottom:10px !important;
    --padding-left:14px !important; --padding-right:14px !important}
  body.musas-listado .elementor-element-d7916f5 .elementor-element-818134c .elementor-heading-title{font-size:15px !important}
  body.musas-listado .elementor-element-e04e530{margin-bottom:14px !important}
}

/* Rejilla pareja aunque alguna foto sea más alta o falte (Vera, MENU-2, V-01/V-02). */
body.musas-listado .elementor-element-e0ad6a8 .e-loop-item .elementor-widget-image img,
body.musas-listado .elementor-element-e0ad6a8 .e-loop-item .elementor-widget-theme-post-featured-image img{
  aspect-ratio:1/1; width:100%; height:auto; object-fit:contain; background:#fff;
}

/* Móvil: el banner fijo más bajo, sin la foto (no cabe). */
@media (max-width:767px){
  body.musas-listado .elementor-element-d7916f5{padding-right:14px !important}
  body.musas-listado .elementor-element-d7916f5::before{display:none !important}
}

/* «Ver N productos»: solo en el móvil, pegado abajo del panel abierto (MENU-3) */
.musas-filtros__ver{display:none}
@media (max-width:767px){
  .musas-filtros__todo[open] .musas-filtros__ver{display:block;position:sticky;bottom:12px;z-index:3;width:100%;margin:14px 0 4px;
    padding:13px 16px;border:0;border-radius:6px;background:#BE573A;color:#fff;font-weight:600;font-size:15px;box-shadow:0 4px 14px rgba(0,0,0,.18)}
}