/* Finder V3: dark band with the search, then a cloud sheet with filters, result cards and a calm map.
   The finder's logic and data are untouched; only the presentation changed. */
[data-booking]{display:none}
.booking-on [data-booking]{display:revert}
.find-band{padding-bottom:110px}
.find-band .band-in>*{max-width:none}
.fsearchbar{display:grid;grid-template-columns:1.6fr 1.1fr auto;align-items:center;gap:0;width:min(100%,900px);padding:6px;border-radius:999px;background:#fff;box-shadow:0 14px 40px rgba(4,10,24,.3);margin-top:6px}
.booking-on .fsearchbar{grid-template-columns:1.6fr 1.1fr 1fr auto}
.fsearchbar label{display:flex;align-items:center;gap:8px;padding:0 14px;min-width:0}
.fsearchbar label+label{border-left:1px solid var(--line-light)}
.fsearchbar .ic{color:var(--lagoon);width:20px;height:20px}
.fsearchbar input,.fsearchbar select{width:100%;min-width:0;min-height:48px;border:0;background:transparent;color:var(--ink-dark);font-size:16px}
.fsearchbar select{appearance:none;cursor:pointer;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%231689AE' stroke-width='2'/%3E%3C/svg%3E") no-repeat right 4px center;padding-right:24px}
.fsearchbar input:focus,.fsearchbar select:focus{outline:none}
.fsearchbar:focus-within{box-shadow:0 0 0 3px rgba(20,183,192,.45),0 14px 40px rgba(4,10,24,.3)}
.find-tools{display:flex;align-items:center;gap:10px 22px;flex-wrap:wrap;margin-top:4px}
.find-tools .geo-link{margin:0;background:none;border:0;cursor:pointer;padding:0}
.find-tools #whereLbl{font-size:14px;color:var(--ink-muted)}
.find-tools #whereLbl:empty{display:none}
@media (max-width:700px){.fsearchbar{grid-template-columns:1fr;border-radius:22px}.fsearchbar label+label{border-left:0;border-top:1px solid var(--line-light)}.fsearchbar .btn{margin:6px 0 0}}

.finder-app{position:relative;z-index:3;margin-top:-70px;padding:0 var(--gutter) var(--section)}
.finder-main{display:grid;grid-template-columns:250px minmax(0,1fr) minmax(360px,42%);gap:16px;align-items:start;max-width:calc(var(--maxw) + 240px);margin:0 auto;padding:16px;border-radius:var(--r-sheet);background:var(--cloud);box-shadow:0 30px 80px rgba(4,10,24,.35);color:var(--ink-dark-body)}
.rail{background:#fff;border:1px solid var(--line-light);border-radius:var(--r-card);padding:18px;display:flex;flex-direction:column;gap:18px}
.rail-title{display:flex;align-items:center;gap:8px;font-weight:700;color:var(--ink-dark)}
.rail-title .ic{color:var(--lagoon)}
.rail .rail-h{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-dark-muted);margin-bottom:6px;font-weight:700}
.chk{display:flex;align-items:center;gap:10px;font-size:15px;padding:6px;margin:0 -6px;border-radius:8px;cursor:pointer;color:var(--ink-dark)}
.chk:hover{background:var(--cloud)}
.chk input{width:18px;height:18px;accent-color:var(--teal);flex:none}
.chk .n{margin-left:auto;color:var(--ink-dark-muted);font-size:13px;font-variant-numeric:tabular-nums}
#fDist{width:100%;border:1.5px solid var(--line-light);border-radius:12px;padding:10px;background:#fff;color:var(--ink-dark)}
.hint{font-size:13px;color:var(--ink-dark-muted);margin-top:6px}
#reset{color:var(--ink-dark);border-color:var(--line-light)}

.results{min-width:0}
.rhead{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding:6px 4px 12px}
.rhead h2{font-size:19px;color:var(--ink-dark);line-height:1.3}
#rSub{font-size:14px;color:var(--ink-dark-muted)}
#sort{border:1.5px solid var(--line-light);border-radius:999px;padding:8px 14px;background:#fff;color:var(--ink-dark);font-size:14px}
#list{display:grid;gap:10px}
.card{display:grid;grid-template-columns:48px 1fr auto;gap:14px;align-items:start;padding:16px;background:#fff;border:1px solid var(--line-light);border-radius:18px;transition:border-color .25s,box-shadow .25s}
.card:hover,.card.active{border-color:var(--sea);box-shadow:0 10px 26px rgba(23,38,71,.08)}
.card .fc-badge{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:#E5F6F3;color:var(--lagoon)}
.card .fc-badge svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.card h3{font-size:16px;line-height:1.3}
.card h3 button{background:none;border:0;padding:0;font:inherit;font-weight:700;color:var(--ink-dark);text-align:left;cursor:pointer}
.card h3 button:hover{color:var(--lagoon-ink)}
.card .sub{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:13px;color:var(--ink-dark-muted);margin-top:4px}
.card .sub svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.75;flex:none}
.card .tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.card .tag{display:inline-block;padding:3px 10px;border-radius:999px;background:var(--cloud);border:1px solid var(--line-light);font-size:12px;font-weight:600;color:var(--ink-dark-body)}
.card .tag.now{background:#E5F6F3;border-color:#BFE7E0;color:#0D5C52}
.card .fc-go{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--btn-grad);color:var(--navy-deep);border:0;cursor:pointer;align-self:center}
.card .fc-go svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.3;stroke-linecap:round;stroke-linejoin:round}
.card .side{display:grid;gap:8px;justify-items:end}
.empty{padding:28px;text-align:center;background:#fff;border-radius:18px;border:1px dashed var(--line-light)}
.more{margin:14px auto 0;display:flex;color:var(--ink-dark);border-color:var(--line-light)}
.src{font-size:12px;color:var(--ink-dark-muted);margin:14px 4px 0}

.mapcol{position:sticky;top:calc(var(--header-h) + 16px);height:calc(100vh - var(--header-h) - 32px);min-height:460px;border-radius:var(--r-card);overflow:hidden;border:1px solid var(--line-light)}
#map{width:100%;height:100%;background:#E9EEF3}
.pin{width:26px;height:30px;display:grid;place-items:center;border-radius:50% 50% 50% 0;transform:rotate(-45deg);background:var(--teal);border:2px solid #fff;box-shadow:0 3px 8px rgba(23,38,71,.3)}
.pin svg{width:13px;height:13px;transform:rotate(45deg);fill:#fff}
.leaflet-popup-content-wrapper{border-radius:14px}
.leaflet-popup-content{font-family:var(--font);color:var(--ink-dark)}

@media (min-width:1101px){
  .rail,.results{position:sticky;top:calc(var(--header-h) + 16px);max-height:calc(100vh - var(--header-h) - 32px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#C9D3DE transparent}
  .results{height:calc(100vh - var(--header-h) - 32px);padding:0 6px 24px 2px}
  .rhead{position:sticky;top:0;z-index:2;background:var(--cloud)}
}
@media (max-width:1100px){
  .finder-main{grid-template-columns:1fr}
  .mapcol{position:relative;top:0;height:360px;min-height:0;order:-1}
  .rail{display:grid;grid-template-columns:1fr 1fr;gap:14px}
  .rail-title{grid-column:1/-1}
}
@media (max-width:600px){.rail{grid-template-columns:1fr}.finder-main{padding:10px}}

/* claim dialog (practice side) and the booking dialog, when switched on */
.ov{position:fixed;inset:0;z-index:150;background:rgba(15,26,51,.7);display:none;align-items:center;justify-content:center;padding:16px}
.ov.on{display:flex}
.dlg{position:relative;background:#fff;color:var(--ink-dark-body);border-radius:24px;padding:28px;width:min(560px,100%);max-height:calc(100svh - 32px);overflow:auto}
.dlg h2{color:var(--ink-dark);font-size:22px}
.dlg .x{position:absolute;right:12px;top:12px;width:40px;height:40px;border:0;border-radius:12px;background:none;font-size:24px;cursor:pointer;color:var(--ink-dark)}
.dlg .form{display:grid;gap:10px;margin-top:14px}
.dlg .form input,.dlg .form select{min-height:46px;border:1.5px solid var(--line-light);border-radius:12px;padding:0 12px;font-size:15px;color:var(--ink-dark)}
.dlg .btn.g{background:var(--btn-grad);color:var(--navy-deep);border:0;min-height:46px;border-radius:999px;font-weight:700}
.dlg .btn.o{background:#fff;border:1.5px solid var(--line-light);color:var(--ink-dark);min-height:42px;border-radius:999px;padding:0 16px}
.dlg .opt{border:1px solid var(--line-light);border-radius:14px;padding:12px}
.dlg .opt-hl{background:#E5F6F3;border-color:#BFE7E0}
.dlg .sub{font-size:14px;color:var(--ink-dark-muted)}
.err{display:none;color:var(--lagoon-ink);font-weight:600;font-size:14px}
