/* ════════════════════════════════════════════════════════════════
   me-filters.css — Panneau de filtres enrichi (Mon Énergie)
   Couche isolée (filtre uniquement, aucune refonte thème).
   Réutilise les variables --me-* définies dans mon_energie.css.
   ════════════════════════════════════════════════════════════════ */

/* ── Panneau ─────────────────────────────────────────────────── */
.me-filter{
  background:#fff;
  border:1px solid var(--me-border, #E2E4E7);
  border-radius:var(--me-radius, 1rem);
  box-shadow:var(--me-elev-1, 0 1px 3px rgba(15,23,42,.08));
  overflow:hidden;
}
.me-filter-head{
  padding:.9rem 1.1rem .5rem;
  display:flex; align-items:center; justify-content:space-between;
}
.me-filter-head h6{
  font-weight:800; font-size:.85rem; text-transform:uppercase;
  letter-spacing:.05em; color:var(--me-navy, #1e3a5f); margin:0;
}
.me-filter-head h6 i{color:var(--me-orange, #E87500);}
.me-filter-body{padding:0 1.1rem 1.1rem;}

/* ── Facette repliable ───────────────────────────────────────── */
.me-fac{padding:.8rem 0; border-bottom:1px solid var(--me-border,#E2E4E7);}
.me-fac:last-child{border-bottom:0;}
.me-fac-title{
  display:flex; align-items:center; gap:.45rem;
  font-weight:800; font-size:.8rem; color:#1A1D22;
  margin-bottom:.35rem; cursor:pointer; user-select:none;
}
.me-fac-title > i.fa-solid:first-child{color:var(--me-orange,#E87500); width:16px;}
.me-fac-title .chev{margin-left:auto; transition:.2s; color:var(--me-muted,#6C727A);}
.me-fac.collapsed .me-fac-body{display:none;}
.me-fac.collapsed .chev{transform:rotate(-90deg);}
.me-fac-body{font-size:.82rem;}

/* ── Slider double-borne natif (zéro dépendance) ─────────────── */
.me-dr{position:relative; height:34px; margin:.4rem .35rem .2rem;}
.me-dr-track{
  position:absolute; top:50%; left:0; right:0; height:6px;
  border-radius:999px; background:var(--me-border,#E2E4E7); transform:translateY(-50%);
}
.me-dr-fill{
  position:absolute; top:0; height:100%; border-radius:999px;
  background:linear-gradient(90deg, var(--me-orange,#E87500), var(--me-orange-2,#ff8c1a));
}
.me-dr input[type=range]{
  position:absolute; left:0; top:0; width:100%; height:34px; margin:0;
  background:transparent; pointer-events:none; -webkit-appearance:none; appearance:none; z-index:2;
}
.me-dr input[type=range]::-webkit-slider-thumb{
  -webkit-appearance:none; pointer-events:all;
  width:22px; height:22px; border-radius:50%;
  background:#fff; border:3px solid var(--me-orange,#E87500);
  box-shadow:0 4px 10px rgba(15,23,42,.18); cursor:grab; transition:transform .12s;
}
.me-dr input[type=range]::-moz-range-thumb{
  pointer-events:all; width:18px; height:18px; border-radius:50%;
  background:#fff; border:3px solid var(--me-orange,#E87500);
  box-shadow:0 4px 10px rgba(15,23,42,.18); cursor:grab;
}
.me-dr input[type=range]:active::-webkit-slider-thumb{cursor:grabbing; transform:scale(1.15);}
.me-dr-vals{display:flex; justify-content:space-between; font-weight:800; font-size:.8rem; margin-top:.15rem;}
.me-dr-vals .pill{
  background:var(--me-navy-soft,#EAF1F8); color:var(--me-navy,#1e3a5f);
  padding:.15rem .55rem; border-radius:999px;
}
.me-dr-vals .sep{color:var(--me-muted,#6C727A); align-self:center;}

/* ── Chips ───────────────────────────────────────────────────── */
.me-chip{
  border:1.5px solid var(--me-border,#E2E4E7); background:#fff; color:#3a3f47;
  border-radius:999px; font-size:.76rem; font-weight:700; padding:.38rem .75rem;
  line-height:1; transition:.18s cubic-bezier(.22,.61,.36,1); cursor:pointer;
  display:inline-flex; align-items:center; gap:.3rem;
}
.me-chip:hover{border-color:var(--me-orange,#E87500); color:var(--me-orange,#E87500);}
.me-chip.active{
  background:var(--me-orange,#E87500); border-color:var(--me-orange,#E87500); color:#fff;
  box-shadow:0 6px 14px rgba(232,117,0,.28);
}

/* ── Multiselect fabricants / checkbox ───────────────────────── */
.me-mfr{display:flex; align-items:center; gap:.5rem; padding:.3rem 0; cursor:pointer;}
.me-mfr input{accent-color:var(--me-orange,#E87500); width:16px; height:16px;}
.me-mfr .n{flex:1; font-weight:600;}

/* ── Responsive : panneau collant sur desktop ────────────────── */
@media (min-width:992px){
  .me-filter{position:sticky; top:90px; max-height:calc(100vh - 110px); overflow-y:auto;}
}