/* Map + sidebar layout */
.map-wrap {
  max-width: 1200px;
  margin: 1.2rem auto;
  display: flex;
  gap: 16px;
  align-items: flex-start;
  padding: 0 12px;
}

#map {
  flex: 1;
  min-height: 640px;
  border-radius: 6px;
  box-shadow: 0 2px 10px rgba(0,0,0,0.08);
}

.sidebar {
  width: 340px;
  background: #fff;
  border-radius: 6px;
  padding: 12px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.04);
  font-size: 14px;
}

.sidebar h3 {
  margin-top: 0;
}

#resetBtn {
  margin-top: 12px;
  width: 100%;
}

/* Hover highlight */
.leaflet-interactive:hover {
  stroke: #000;
  stroke-width: 2;
}

/* Legend box */
.leaflet-control .legend {
  background: white;
  padding: 8px 12px;
  font: 13px/1.4 Arial, sans-serif;
  border-radius: 6px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.15);
}

.legend h4 {
  margin: 0 0 6px;
  font-size: 14px;
  font-weight: bold;
}

.legend i {
  width: 14px;
  height: 14px;
  float: left;
  margin-right: 6px;
  margin-top: 2px;
  opacity: 0.8;
}

.legend br {
  clear: both;
}

/* === Tooltip styles === */
.state-tooltip,
.county-tooltip {
  background: rgba(30, 30, 30, 0.9);
  color: #fff;
  border-radius: 4px;
  padding: 4px 8px;
  font-size: 13px;
  font-weight: 500;
  box-shadow: 0 2px 6px rgba(0,0,0,0.3);
}

.state-tooltip::before,
.county-tooltip::before {
  border-top-color: rgba(30, 30, 30, 0.9) !important;
}

/* === County cards === */
.county-card {
  background: #fff;
  border-radius: 8px;
  padding: 12px;
  margin-top: 10px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
  font-size: 14px;
  transition: border 0.2s ease, background 0.2s ease;
}

.county-card h4 {
  margin: 0 0 8px;
  font-size: 16px;
  font-weight: bold;
}

.county-card p {
  margin: 0;
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 14px;
}

/* Status-specific highlight */
.county-card.status-settled {
  border-left: 5px solid green;
}
.county-card.status-unsettled {
  border-left: 5px solid red;
}
.county-card.status-pending {
  border-left: 5px solid orange;
}
.county-card.status-unknown {
  border-left: 5px solid #ccc;
}

/* Badge styling */
.badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 20px;
  font-size: 14px;
  font-weight: bold;
  background: none;
  padding: 0;
  margin-right: 6px;
}

/* === Unified sidebar buttons === */
.sidebar-actions,
.map-buttons {
  text-align: center;
  margin-top: 16px;
}

.sidebar-actions .btn,
.map-buttons .btn,
.sidebar-btn {
  display: block;
  width: 100%;
  padding: 10px;
  margin: 6px 0;
  border: none;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  color: #fff;
  transition: background 0.2s;
  text-decoration: none;
}

/* Green reset */
.sidebar-actions .btn.green-btn,
.map-buttons .btn.green-btn,
.sidebar-btn.green-btn {
  background: #28a745;
}
.sidebar-actions .btn.green-btn:hover,
.map-buttons .btn.green-btn:hover,
.sidebar-btn.green-btn:hover {
  background: #218838;
}

/* Blue secondary (overview/return) */
.sidebar-actions .btn.blue-btn,
.map-buttons .btn.blue-btn,
.sidebar-btn.blue-btn {
  background: #0078d7;
}
.sidebar-actions .btn.blue-btn:hover,
.map-buttons .btn.blue-btn:hover,
.sidebar-btn.blue-btn:hover {
  background: #005fa3;
}

/* Office list styles */
.office-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.office-list li {
  margin: 4px 0;
  font-size: 14px;
  line-height: 1.4;
}

/* New filled/not-filled classes */
.filled {
  color: green;
  font-weight: bold;
}

.not-filled {
  color: red;
  font-weight: bold;
}


/* === Notes modal + button (data card) === */
.notes-modal { display:none; position:fixed; inset:0; z-index:10000; }
.notes-backdrop { position:absolute; inset:0; background:#0008; }
.notes-dialog {
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  width:min(900px, 92vw); max-height:80vh; overflow:auto;
  background:#fff; border-radius:12px; padding:18px 20px 24px;
  box-shadow:0 20px 60px rgba(0,0,0,.35);
  font-family: Arial, Helvetica, sans-serif;
}
.notes-close {
  position:absolute; right:10px; top:8px; background:none; border:none;
  font-size:28px; line-height:1; cursor:pointer;
}
.notes-content img { max-width:100%; height:auto; display:block; margin:8px 0; }
.notes-content a { text-decoration:underline; }

.data-card-notes-wrap { margin-top: 10px; }
.notes-btn {
  display:inline-flex; align-items:center; gap:6px;
  background:#0d6efd; color:#fff; border:none; border-radius:999px;
  padding:6px 10px; font-size:12px; cursor:pointer;
}
.notes-btn[disabled] { opacity:.4; cursor:not-allowed; }
.notes-btn svg { width:14px; height:14px; display:block; }
.notes-dialog { width: min(900px, 92vw); max-height: 80vh; }