/* ============================================================
   EdilBerat — galleria.css (galleria filtrabile a mosaico)
   ============================================================ */

.gal-head{padding:130px 0 10px;text-align:center}
.gal-filters{display:flex;justify-content:center;margin:26px 0 6px}
/* Barra filtri compatta: dropdown categoria + toggle Prima/Dopo */
.gal-filter-bar{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;align-items:center}
.gal-select-wrap{position:relative;display:inline-flex;align-items:center}
.gal-select-wrap>.fa-sliders{position:absolute;left:16px;color:var(--red);pointer-events:none;font-size:.9rem}
.gal-select{appearance:none;-webkit-appearance:none;font-family:var(--font-head);font-weight:500;font-size:.95rem;
  padding:12px 44px 12px 40px;border-radius:999px;border:1px solid var(--line-strong);background:#fff;
  color:var(--ink);cursor:pointer;min-width:230px}
.gal-select:focus{outline:none;border-color:var(--red)}
.gal-select-caret{position:absolute;right:16px;color:var(--muted);pointer-events:none;font-size:.78rem}
.gal-toggle{font-family:var(--font-head);font-weight:500;font-size:.92rem;padding:12px 20px;border-radius:999px;
  border:1px solid var(--line-strong);background:#fff;color:var(--muted);cursor:pointer;transition:.2s;
  display:inline-flex;align-items:center;gap:8px}
.gal-toggle:hover{border-color:var(--red);color:var(--red)}
.gal-toggle.active{background:var(--red);color:#fff;border-color:var(--red)}

/* compat: vecchi chip (non più usati) */
.gal-chip{font-family:var(--font-head);font-weight:500;font-size:.9rem;padding:9px 18px;border-radius:999px;
  border:1px solid var(--line-strong);background:#fff;color:var(--muted);cursor:pointer;transition:.2s}
.gal-chip.active{background:var(--red);color:#fff;border-color:var(--red)}

/* Mosaico: colonne fluide, ogni foto entra con la sua proporzione */
.gal-masonry{columns:4 250px;column-gap:14px;padding:28px 0 10px}
.gal-cell{position:relative;break-inside:avoid;margin:0 0 14px;border-radius:12px;overflow:hidden;
  cursor:pointer;background:var(--bg-soft);box-shadow:var(--shadow-sm)}
.gal-cell img{width:100%;display:block;transition:transform .5s var(--ease)}
.gal-cell::after{content:"\f00e";font-family:"Font Awesome 6 Free";font-weight:900;color:#fff;font-size:1.4rem;
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(180deg,rgba(139,0,0,0),rgba(20,18,16,.5));opacity:0;transition:opacity .3s}
.gal-cell:hover img{transform:scale(1.06)}
.gal-cell:hover::after{opacity:1}
.gal-cell.hide{display:none}

.gal-empty{text-align:center;color:var(--muted);padding:40px 0}

@media (max-width:600px){
  .gal-head{padding:110px 0 6px}
  .gal-masonry{columns:2 150px;column-gap:10px}
  .gal-cell{margin-bottom:10px}
  .gal-filter-bar{flex-direction:column;gap:10px;width:100%}
  .gal-select-wrap{width:100%}
  .gal-select{width:100%;min-width:0}
  .gal-toggle{width:100%;justify-content:center}
}