.explorex-ml{display:flex;gap:20px;align-items:stretch}
.explorex-ml__sidebar{width:40%;max-height:80vh;overflow:auto;background:#f9f9f9;border:1px solid #e6e6e6;border-radius:16px;padding:14px}
.explorex-ml__mapwrap{width:60%;position:sticky;top:120px}
.explorex-ml__map{height:80vh;border-radius:16px;border:1px solid #e6e6e6;box-shadow:0 6px 18px rgba(0,0,0,.06)}
.explorex-ml__title{margin:0 0 10px 0;font-size:18px}
.explorex-ml__controls{display:flex;gap:10px;align-items:center;margin-bottom:8px}
.explorex-ml__search{flex:1;min-width:0;padding:10px 12px;border-radius:12px;border:1px solid #ddd;background:#fff;line-height:1.2}
.explorex-ml__btn{padding:10px 12px;border-radius:12px;border:0;background:#FCB424;color:#fff;cursor:pointer;line-height:1.2;white-space:nowrap}
.explorex-ml__btn--ghost{background:#fff;color:#111;border:1px solid #ddd}
.explorex-ml__resultsline{font-size:13px;opacity:.8;margin-bottom:10px}
.explorex-ml__filters{background:#fff;border:1px solid #eee;border-radius:14px;padding:0;margin-bottom:12px;overflow:hidden}
.explorex-ml__select{
  width:100%;
  padding:12px 12px;
  border-radius:12px;
  border:1px solid #ddd;
  background:#fff;
  line-height:1.2;
  min-height:44px;
  box-sizing:border-box;
}
.explorex-ml__checks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
.explorex-ml__checks label{display:flex;gap:8px;align-items:flex-start;font-size:13px;line-height:1.25;cursor:pointer}
.explorex-ml__list{margin-top:4px}
.explorex-ml__card{display:flex;gap:10px;border:1px solid #e3e3e3;background:#fff;border-radius:14px;padding:10px;margin:0 0 10px 0;cursor:pointer;transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease;will-change:transform}
.explorex-ml__card:hover{transform:translateY(-0.5px);box-shadow:0 10px 22px rgba(0,0,0,.10);border-color:#d9d9d9}
.explorex-ml__card.is-hover{box-shadow:0 10px 22px rgba(0,0,0,.10)}
.explorex-ml__card.is-active{border-color:#FCB424;box-shadow:0 14px 30px rgba(0,0,0,.12)}
.explorex-ml__thumb{width:88px;height:66px;object-fit:cover;border-radius:12px;background:#eee;flex:0 0 auto}
.explorex-ml__meta{min-width:0}
.explorex-ml__name{font-weight:800;display:block;line-height:1.2}
.explorex-ml__addr{font-size:13px;opacity:.75;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;margin-top:4px}
.explorex-ml__chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.explorex-ml__chip{font-size:12px;padding:3px 8px;border-radius:999px;background:#f1f1f1}
.explorex-ml__pagination{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-top:10px}
.explorex-ml__pagebtn{padding:7px 10px;border-radius:10px;border:1px solid #e3e3e3;background:#fff;cursor:pointer}
.explorex-ml__pagebtn.is-active{background:#FCB424;border-color:#FCB424;color:#fff}
.explorex-ml__empty{padding:14px;background:#fff;border:1px dashed #ddd;border-radius:14px;opacity:.8}
/* Default marker div icon */
/*
 * Marker HTML for L.divIcon is already positioned by Leaflet using iconAnchor.
 * Do NOT translate here (otherwise the marker is offset twice and disappears).
 */
.explorex-ml-marker{width:34px;height:41px}
.explorex-ml-marker img{width:34px;height:41px;display:block;transition:transform .15s ease, filter .15s ease;will-change:transform}
.explorex-ml-marker.is-hover img{transform:translateY(-2px) scale(1.03)}
.explorex-ml-marker.is-selected img{transform:translateY(-1px) scale(1.05);filter:drop-shadow(0 10px 18px rgba(0,0,0,.18))}

/* Accordion */
.explorex-ml-acc__item{border-top:1px solid #f0f0f0}
.explorex-ml-acc__item:first-child{border-top:0}
.explorex-ml-acc__header{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:12px 14px;
  background:#fff;
  border:0;
  cursor:pointer;
  font-weight:800;
}
.explorex-ml-acc__chev{transition:transform .15s ease; opacity:.7}
.explorex-ml-acc__header[aria-expanded="true"] .explorex-ml-acc__chev{transform:rotate(180deg)}
.explorex-ml-acc__panel{padding:0 14px 14px 14px}
.explorex-ml-acc__panel .explorex-ml__select{margin-top:6px}

/* Mobile bar + badge */
.explorex-ml__mobilebar{display:none;gap:10px}
.explorex-ml__mobile-switch,
.explorex-ml__mobile-results{
  width:100%;
  padding:12px 14px;
  border-radius:14px;
  border:0;
  background:#FCB424;
  color:#fff;
  font-weight:800;
  cursor:pointer;
  display:flex;
  justify-content:center;
  align-items:center;
  gap:10px;
}
.explorex-ml__mobile-results{background:#111}
.explorex-ml__badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:3px 8px;
  border-radius:999px;
  background:rgba(255,255,255,.22);
  font-size:12px;
  font-weight:900;
}

/* Mobile layout: show toggle + show one panel at a time */
@media(max-width:768px){
  .explorex-ml{flex-direction:column}
  .explorex-ml__mobilebar{display:flex}
  .explorex-ml__sidebar,.explorex-ml__mapwrap{width:100%}
  .explorex-ml__mapwrap{position:relative;top:auto}
  .explorex-ml__sidebar{max-height:none}
  .explorex-ml__map{height:60vh}
  .explorex-ml__checks{grid-template-columns:1fr}

  /* Default view = map */
  .explorex-ml[data-view="map"] .explorex-ml__sidebar{display:none}
  .explorex-ml[data-view="list"] .explorex-ml__mapwrap{display:none}
}

/* === POPUP STYLE (Explorex) === */
.leaflet-popup.explorex-ml-popup .leaflet-popup-content-wrapper{
  padding:0;
  border-radius:16px;
  overflow:hidden;
  box-shadow:0 14px 38px rgba(0,0,0,.20);
}
.leaflet-popup.explorex-ml-popup .leaflet-popup-content{
  margin:0;
  width:280px !important;
}
.leaflet-popup.explorex-ml-popup .leaflet-popup-tip{
  box-shadow:0 10px 25px rgba(0,0,0,.12);
}
.explorex-ml-popup__img{
  width:100%;
  height:140px;
  object-fit:cover;
  display:block;
  background:#eee;
}
.explorex-ml-popup__body{
  padding:12px 14px 14px 14px;
  background:#fff;
}
.explorex-ml-popup__title{
  font-weight:900;
  font-size:15px;
  line-height:1.2;
  margin:0 0 6px 0;
  color:#111;
}
.explorex-ml-popup__addr{
  font-size:13px;
  line-height:1.25;
  color:rgba(0,0,0,.70);
  margin:0 0 10px 0;
}
.explorex-ml-popup__btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:100%;
  padding:10px 12px;
  border-radius:12px;
  background:#FCB424;
  color:#fff !important;
  text-decoration:none !important;
  font-weight:900;
  font-size:13px;
}
.explorex-ml-popup__btn:hover{filter:brightness(.98)}
.leaflet-popup.explorex-ml-popup a.leaflet-popup-close-button{
  width:34px;
  height:34px;
  line-height:34px;
  text-align:center;
  border-radius:999px;
  background:rgba(17,17,17,.55);
  color:#fff;
  font-size:18px;
  padding:0;
}
.leaflet-popup.explorex-ml-popup a.leaflet-popup-close-button:hover{
  background:rgba(17,17,17,.70);
}
@media(max-width:768px){
  .leaflet-popup.explorex-ml-popup .leaflet-popup-content{width:300px !important;}
}


/* Popup taxonomy chip */
.explorex-ml-popup__chips{
  margin:6px 0 6px 0;
}
.explorex-ml-popup__chip{
  display:inline-block;
  font-size:12px;
  padding:4px 10px;
  border-radius:999px;
  background:#f1f1f1;
  font-weight:700;
}


/* Marker hover/selected effect (gentle) */
.explorex-ml-marker.is-hover img{
  transform:translateY(-2px) scale(1.03);
  filter:drop-shadow(0 8px 14px rgba(0,0,0,.18));
}
.explorex-ml-marker.is-selected img{
  transform:translateY(-1px) scale(1.05);
  filter:drop-shadow(0 10px 18px rgba(0,0,0,.18));
}

/* Favorites UI */
.explorex-ml__favonly{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid #ddd;
  background:#fff;
  cursor:pointer;
  font-weight:800;
  font-size:13px;
  line-height:1.2;
  white-space:nowrap;
}
.explorex-ml__favonly input{margin:0}
.explorex-ml__card{position:relative}
.explorex-ml__favbtn{
  position:absolute;
  top:10px;
  right:10px;
  width:34px;
  height:34px;
  border-radius:999px;
  border:0;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(17,17,17,.55);
  color:#fff;
}
.explorex-ml__favbtn:hover{background:rgba(17,17,17,.70)}
.explorex-ml__favbtn.is-on{background:#FCB424;color:#111}
.explorex-ml__favbtn svg{width:18px;height:18px;display:block}

/* Area selected button */
.explorex-ml__btn--area{max-width:100%}

/* Popup favorite */
.explorex-ml-popup{position:relative}
.explorex-ml-popup__fav{
  position:absolute;
  top:10px;
  right:10px;
  width:36px;
  height:36px;
  border-radius:999px;
  border:0;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(17,17,17,.55);
  color:#fff;
}
.explorex-ml-popup__fav:hover{background:rgba(17,17,17,.70)}
.explorex-ml-popup__fav.is-on{background:#FCB424;color:#111}
.explorex-ml-popup__fav svg{width:18px;height:18px;display:block}

/* Marker hover/selected (kept gentle - see top for main rules) */
.explorex-ml-marker img{transition:transform .15s ease, filter .15s ease}
.explorex-ml-marker.is-hover img{transform:translateY(-2px) scale(1.03);filter:drop-shadow(0 8px 14px rgba(0,0,0,.18))}
.explorex-ml-marker.is-selected img{transform:translateY(-1px) scale(1.05);filter:drop-shadow(0 10px 18px rgba(0,0,0,.18))}



/* --- UX: skeleton loader (cards) --- */
.explorex-ml__list.is-loading{min-height:240px}
.explorex-ml__card--skeleton{pointer-events:none}
.explorex-ml__skel-block{background:linear-gradient(90deg,#f1f1f1,#e8e8e8,#f1f1f1);background-size:200% 100%;animation:explorexSkel 1.1s ease-in-out infinite}
.explorex-ml__skel-line{height:10px;border-radius:8px;margin-top:8px;background:linear-gradient(90deg,#f1f1f1,#e8e8e8,#f1f1f1);background-size:200% 100%;animation:explorexSkel 1.1s ease-in-out infinite}
.explorex-ml__skel-line--lg{height:12px;width:82%}
.explorex-ml__skel-line--sm{width:55%}
@keyframes explorexSkel{0%{background-position:200% 0}100%{background-position:-200% 0}}

/* --- UX: empty state (enhanced) --- */
.explorex-ml__empty-title{font-weight:800;margin-bottom:6px;opacity:1}
.explorex-ml__empty-sub{margin-bottom:12px;opacity:.85}
.explorex-ml__empty-actions{display:flex;gap:10px;flex-wrap:wrap}


/* Active filters chips */
.explorex-ml__activefilters{ padding: 10px 0 0; }
.explorex-ml__activefilters-inner{ display:flex; flex-wrap:wrap; gap:8px; }
.explorex-ml__chipbtn{ display:inline-flex; align-items:center; gap:8px; padding:8px 10px; border-radius:999px; border:1px solid rgba(0,0,0,.12); background:#fff; font-size:13px; line-height:1; cursor:pointer; transition:transform .08s ease, box-shadow .12s ease; }
.explorex-ml__chipbtn:hover{ transform:translateY(-1px); box-shadow:0 6px 18px rgba(0,0,0,.08); }
.explorex-ml__chipx{ font-size:16px; line-height:1; opacity:.7; }
.explorex-ml__chipbtn--ghost{ background:transparent; border-style:dashed; }


/* Geolocalizzazione: pulsante sotto lo zoom (Leaflet) */
.explorex-ml__locate{
  margin-top: 8px;
}
.explorex-ml__locate-btn{
  width: 30px;
  height: 30px;
  display: block;
  line-height: 30px;
  text-align: center;
  text-decoration: none;
  background: #fff;
  position: relative;
}
.explorex-ml__locate-icon{
  display: inline-block;
  width: 16px;
  height: 16px;
  vertical-align: middle;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 16px 16px;
  opacity: .85;
  /* simple target/crosshair svg */
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='7'/%3E%3Cpath d='M12 2v3M12 19v3M2 12h3M19 12h3'/%3E%3Cpath d='M12 9a3 3 0 1 0 0 6a3 3 0 0 0 0-6z'/%3E%3C/svg%3E");
}
.explorex-ml__locate:hover .explorex-ml__locate-icon{
  opacity: 1;
}
.explorex-ml__locate.is-loading .explorex-ml__locate-icon{
  opacity: .6;
  animation: explorex-ml-spin 1s linear infinite;
}
@keyframes explorex-ml-spin{
  from{ transform: rotate(0deg); }
  to{ transform: rotate(360deg); }
}