/* ===== Spas Directory ===== */

/* Filter bar sits in a white card, matching the certification-registry look. */
.dir-filters{
  background:var(--white); border:1px solid var(--line); border-radius:6px;
  padding:18px 20px; display:flex; gap:14px; flex-wrap:wrap; align-items:center;
  margin-bottom:36px;
}
.dir-filters .dir-search{flex:1 1 240px; display:block}
.dir-filters .dir-search input{
  width:100%; border:1px solid var(--line); border-radius:3px; padding:10px 12px;
  font-size:12.5px; background:var(--cream); color:var(--ink);
}
.dir-filters .dir-search input:focus{outline:2px solid var(--gold); outline-offset:1px}
.dir-filters select{
  border:1px solid var(--line); border-radius:3px; padding:10px 12px;
  font-size:12.5px; background:var(--cream); cursor:pointer; min-width:150px;
}
.dir-filters select.wide{min-width:170px}
.dir-filters .reset{
  background:none; border:0; color:var(--gold); font-size:12px; font-weight:600;
  letter-spacing:.05em; cursor:pointer;
}
.dir-filters .reset:hover{color:var(--gold-dark)}
.dir-filters .to-map{
  margin-left:auto; background:var(--navy); color:var(--white); border:0;
  padding:10px 18px; font-size:11.5px; font-weight:600; letter-spacing:.08em;
  text-transform:uppercase; border-radius:3px;
  display:inline-block; text-align:center; transition:background .15s;
}
.dir-filters .to-map:hover{background:var(--navy2)}

@media (max-width:700px){
  .dir-filters .dir-search{flex:1 1 100%}
  .dir-filters select{min-width:0; flex:1 1 140px}
  .dir-filters .to-map{margin-left:0; width:100%}
}