:root {
  --black:#000000; --white:#FFFFFF;
  --gray-50:#FAFAFA; --gray-100:#f5f5f5; --gray-200:#E8E8E8;
  --gray-300:#D0D0D0; --gray-400:#A0A0A0; --gray-500:#6B6B6B;
  --gray-700:#333333; --gray-900:#1D3557;
  --f:'Inter',-apple-system,'Helvetica Neue',sans-serif;
  --primary: #1B2A4A; --secondary: #457B9D; --accent: #e0e0e0;
  --navy: #1D3557; --cream: #f5f5f5;
  --ink: #1D3557; --muted: #6B6B6B; --border: #E8E8E8;
  --fd: 'Inter',-apple-system,'Helvetica Neue',sans-serif;
  --fb: 'Inter',-apple-system,'Helvetica Neue',sans-serif;
}
/* ── assets/css/search.css ── FrenchBoat */
.search-top { background:var(--white); border-bottom:1px solid var(--border); padding:14px 36px; }
.search-bar-form { display:flex; gap:10px; align-items:center; max-width:800px; }
.search-bar-form select, .search-bar-form input { padding:9px 13px; border:1px solid var(--border); border-radius:8px; font-size:13px; outline:none; font-family:var(--fb); background:var(--white); color:var(--ink); }
.search-bar-form input:focus, .search-bar-form select:focus { border-color:#457B9D; }
.search-bar-form input { min-width:160px; }
.search-bar-form .search-btn { padding:9px 20px; background:#1B2A4A; color:#fff; border:none; border-radius:8px; font-family:var(--fb); font-size:13px; font-weight:500; cursor:pointer; transition:background .2s; }
.search-bar-form .search-btn:hover { background:#E63946; }

.search-layout { display:grid; grid-template-columns:260px 1fr; min-height:calc(100vh - 128px); }

/* ── Filter sidebar ── */
.filters { border-right:1px solid var(--border); padding:22px; background:var(--white); position:sticky; top:128px; height:calc(100vh - 128px); overflow-y:auto; }
.filters h3 { font-family:var(--f,var(--fd)); font-size:15px; font-weight:600; margin-bottom:22px; color:#1D3557; }
.filter-group { margin-bottom:22px; }
.filter-group label { display:block; font-size:11px; font-weight:600; color:var(--muted); text-transform:uppercase; letter-spacing:.06em; margin-bottom:7px; }
.filter-group select, .filter-group input[type=range] { width:100%; }
.filter-group select {
  appearance: none;
  -webkit-appearance: none;
  width: 100%;
  padding: 9px 36px 9px 12px;
  font-size: 13px;
  font-family: var(--f);
  font-weight: 500;
  color: var(--ink);
  background-color: var(--white);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%231D3557' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  border: 1.5px solid var(--border);
  border-radius: 8px;
  cursor: pointer;
  transition: border-color .15s, box-shadow .15s;
  outline: none;
}
.filter-group select:hover { border-color: #e0e0e0; }
.filter-group select:focus { border-color: #457B9D; box-shadow: 0 0 0 3px rgba(69,123,157,.1); }
.filter-group input[type=checkbox] { accent-color:#1B2A4A; }

/* Price range slider */
.price-slider-wrap { position:relative; height:36px; display:flex; align-items:center; }
.price-slider-track { position:absolute; top:50%; left:0; right:0; height:4px; background:var(--gray-200); border-radius:2px; transform:translateY(-50%); pointer-events:none; z-index:1; }
.price-range { position:absolute; width:100%; height:4px; background:transparent; -webkit-appearance:none; appearance:none; pointer-events:none; z-index:2; top:50%; transform:translateY(-50%); }
.price-range::-webkit-slider-thumb { -webkit-appearance:none; width:20px; height:20px; border-radius:50%; background:#1B2A4A; border:3px solid #fff; box-shadow:0 2px 6px rgba(0,0,0,.2); cursor:pointer; pointer-events:all; position:relative; z-index:3; }
.price-range::-moz-range-thumb { width:20px; height:20px; border-radius:50%; background:#1B2A4A; border:3px solid #fff; box-shadow:0 2px 6px rgba(0,0,0,.2); cursor:pointer; pointer-events:all; }
.price-slider-fill { position:absolute; top:50%; height:4px; background:#1B2A4A; border-radius:2px; transform:translateY(-50%); pointer-events:none; z-index:1; }

/* ── Boat-specific filter styles ── */
.filter-chips { display:flex; flex-wrap:wrap; gap:6px; margin-top:6px; }
.filter-chip { padding:5px 12px; border:1px solid #e0e0e0; border-radius:100px; font-size:12px; color:#457B9D; background:#f5f5f5; cursor:pointer; transition:all .2s; }
.filter-chip:hover, .filter-chip.active { background:#457B9D; color:#fff; border-color:#457B9D; }
.filter-reset { font-size:12px; color:#E63946; cursor:pointer; border:none; background:none; text-decoration:underline; margin-top:12px; }

/* ── Results area (split view) ── */
.results-area { padding:0; background:var(--gray-50); }
.results-boats { padding:20px; }
.results-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:18px; font-size:14px; color:var(--muted); }
.results-header strong { color:var(--navy); }
.results-map { background:var(--gray-100); }

/* ── Results grid for boat cards ── */
.results-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:20px; }
.result-card { background:var(--white); border-radius:12px; border:1px solid var(--border); overflow:hidden; transition:transform .25s, box-shadow .25s; cursor:pointer; text-decoration:none; }
.result-card:hover { transform:translateY(-4px); box-shadow:0 12px 32px rgba(29,53,87,.1); }
.result-card-img { height:180px; overflow:hidden; background:#f5f5f5; position:relative; }
.result-card-img img { width:100%; height:100%; object-fit:cover; transition:transform .5s; }
.result-card:hover .result-card-img img { transform:scale(1.05); }
.result-card-badge { position:absolute; top:10px; left:10px; background:rgba(29,53,87,.82); color:#fff; font-size:10px; font-weight:500; padding:3px 9px; border-radius:100px; backdrop-filter:blur(4px); }
.result-card-fav { position:absolute; top:10px; right:10px; width:32px; height:32px; border-radius:50%; background:rgba(255,255,255,.9); border:none; cursor:pointer; font-size:16px; display:flex; align-items:center; justify-content:center; color:#E63946; transition:transform .2s; }
.result-card-fav:hover { transform:scale(1.1); }
.result-card-body { padding:14px 16px; }
.result-card-loc { font-size:11px; color:var(--muted); text-transform:uppercase; letter-spacing:.5px; margin-bottom:4px; }
.result-card-name { font-family:var(--fd); font-size:15px; font-weight:700; color:#1D3557; line-height:1.2; margin-bottom:6px; }
.result-card-specs { font-size:12px; color:var(--muted); margin-bottom:8px; display:flex; gap:10px; flex-wrap:wrap; }
.result-card-foot { display:flex; justify-content:space-between; align-items:center; padding-top:10px; border-top:1px solid var(--border); }
.result-card-price { font-family:var(--fd); font-size:16px; font-weight:700; color:#1D3557; }
.result-card-price span { font-size:11px; font-weight:400; color:var(--muted); }
.result-card-rating { display:flex; align-items:center; gap:4px; font-size:12px; font-weight:500; color:#1D3557; }
.result-card-rating .star { color:#E63946; }

/* ── Map section (Leaflet) ── */
.search-layout-map { display:grid; grid-template-columns:1fr 1fr; min-height:calc(100vh - 128px); }
.map-container { position:sticky; top:128px; height:calc(100vh - 128px); }
.map-container .leaflet-container { height:100%; width:100%; border-radius:0; }
.map-container .leaflet-popup-content-wrapper { border-radius:10px; box-shadow:0 4px 16px rgba(29,53,87,.12); }
.map-container .leaflet-popup-content { font-family:var(--fb); font-size:13px; color:#1D3557; }
.map-marker-price { background:#1D3557; color:#fff; padding:4px 10px; border-radius:100px; font-family:var(--fd); font-size:12px; font-weight:600; white-space:nowrap; box-shadow:0 2px 8px rgba(0,0,0,.15); }
.map-marker-price.active { background:#E63946; }

/* ── Pagination ── */
.pagination { display:flex; justify-content:center; gap:6px; margin-top:32px; }
.pagination a, .pagination span { padding:8px 14px; border-radius:8px; font-size:13px; font-weight:500; text-decoration:none; border:1px solid var(--border); color:var(--muted); transition:all .2s; }
.pagination a:hover { border-color:#457B9D; color:#457B9D; background:#f5f5f5; }
.pagination .active { background:#1D3557; color:#fff; border-color:#1D3557; }

@media(max-width:1024px) {
  .results-map { display:none; }
  .results-area { flex-direction:column; }
}
@media(max-width:768px) {
  .search-layout { grid-template-columns:1fr; }
  .filters { position:static; height:auto; border-right:none; border-bottom:1px solid var(--border); }
  .results-area { padding:0; }
  .results-boats { padding:16px; }
  .results-grid { grid-template-columns:1fr; }
}
