/* Dashboard styles */
* { box-sizing: border-box; }
body { margin: 0; font-family: 'Inter', system-ui, sans-serif; background: #0B1220; color: #E2E8F0; -webkit-font-smoothing: antialiased; }
.font-mono { font-family: 'JetBrains Mono', ui-monospace, monospace; }

.panel {
  background: #111A2E;
  border: 1px solid #1F2A44;
  border-radius: 8px;
  padding: 16px;
}
.kpi-card {
  background: #111A2E;
  border: 1px solid #1F2A44;
  border-radius: 8px;
  padding: 16px;
  position: relative;
  overflow: hidden;
}
.kpi-label {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #94A3B8;
  font-weight: 500;
}

.filter-select {
  background: #0B1220;
  border: 1px solid #283556;
  color: #E2E8F0;
  border-radius: 6px;
  padding: 6px 10px;
  font-size: 13px;
  outline: none;
  transition: border-color .15s;
}
.filter-select:hover { border-color: #3B4A6E; }
.filter-select:focus { border-color: #22D3EE; }
.filter-select:disabled { opacity: 0.4; cursor: not-allowed; }

.chip {
  background: #0B1220;
  border: 1px solid #283556;
  color: #94A3B8;
  border-radius: 6px;
  padding: 6px 10px;
  font-size: 11.5px;
  cursor: pointer;
  transition: all .15s;
  white-space: nowrap;
  font-family: 'JetBrains Mono', monospace;
}
.chip:hover { border-color: #3B4A6E; color: #CBD5E1; }
.chip-active {
  background: rgba(34,211,238,0.12);
  border-color: #22D3EE;
  color: #67E8F9;
}

/* Leaflet overrides */
.leaflet-container {
  background: #0B1220 !important;
  font-family: 'Inter', sans-serif;
}
.leaflet-popup-content-wrapper {
  background: #0E1628;
  color: #E2E8F0;
  border: 1px solid #283556;
  border-radius: 6px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.5);
}
.leaflet-popup-tip { background: #0E1628; border: 1px solid #283556; }
.leaflet-popup-close-button { color: #64748B !important; }

.popup { font-size: 12px; min-width: 220px; padding: 4px; }
.popup-title { font-weight: 600; color: #fff; font-size: 13px; }
.popup-sub { color: #64748B; font-size: 10px; font-family: 'JetBrains Mono', monospace; margin-bottom: 8px; }
.popup-row { display: flex; justify-content: space-between; padding: 2px 0; border-top: 1px solid #1F2A44; }
.popup-row span { color: #94A3B8; }
.popup-row b { color: #E2E8F0; font-weight: 500; }
.popup-cta { margin-top: 8px; padding-top: 8px; border-top: 1px solid #1F2A44; }
.popup-link { color: #22D3EE; text-decoration: none; font-size: 11px; font-weight: 500; }
.popup-link:hover { color: #67E8F9; }
.popup-muted { color: #64748B; font-size: 11px; font-style: italic; }

.marker-dot-wrap { background: transparent !important; border: none !important; }
.marker-dot {
  display: block;
  width: 12px; height: 12px;
  border-radius: 50%;
  border: 2px solid rgba(11,18,32,0.9);
  box-shadow: 0 0 0 1px rgba(34,211,238,0.2), 0 2px 6px rgba(0,0,0,0.6);
}
.cluster-wrap { background: transparent !important; border: none !important; }
.cluster-bubble {
  text-align: center;
  color: #0B1220;
  font-weight: 700;
  background: linear-gradient(135deg, #22D3EE, #60A5FA);
  border-radius: 50%;
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
  border: 2px solid rgba(11,18,32,0.7);
  box-shadow: 0 4px 12px rgba(34,211,238,0.3);
}

.leaflet-control-zoom a {
  background: #0E1628 !important;
  color: #94A3B8 !important;
  border-color: #283556 !important;
}
.leaflet-control-zoom a:hover { background: #15203A !important; color: #E2E8F0 !important; }
.leaflet-control-attribution {
  background: rgba(11,18,32,0.7) !important;
  color: #64748B !important;
  font-size: 10px !important;
}

/* Scrollbars */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: #0B1220; }
::-webkit-scrollbar-thumb { background: #1F2A44; border-radius: 5px; border: 2px solid #0B1220; }
::-webkit-scrollbar-thumb:hover { background: #283556; }

/* Recharts text */
.recharts-cartesian-axis-tick text,
.recharts-text { fill: #94A3B8; }
.recharts-default-tooltip { background: #0B1220 !important; border-color: #283556 !important; }
