/* CityPulse — Shared Theme */
:root{
  --blue:#1a73e8;--blue-light:#e8f0fe;--blue-dark:#1557b0;
  --teal:#00897b;--teal-light:#e0f2f1;--teal-dark:#00695c;
  --text:#1a2a3a;--text-muted:#5f6b7a;--text-light:#78909c;
  --bg:#f0f4f8;--card:#fff;--border:#e0e4e8;
  --shadow:0 2px 8px rgba(0,0,0,0.08);
  --shadow-lg:0 4px 16px rgba(0,0,0,0.10);
  --radius:12px;--radius-sm:8px;
  --health-color:var(--teal);
}
@media(prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --blue:#6ab0ff;--blue-light:#1a2a3a;--blue-dark:#8ac4ff;
    --teal:#4db6ac;--teal-light:#1a2e2b;--teal-dark:#80cbc4;
    --text:#e0e4e8;--text-muted:#a0aab4;--text-light:#8090a0;
    --bg:#0f1419;--card:#1a2332;--border:#2a3442;
    --shadow:0 2px 8px rgba(0,0,0,0.3);
    --shadow-lg:0 4px 16px rgba(0,0,0,0.4);
  }
}
[data-theme="dark"]{
  --blue:#6ab0ff;--blue-light:#1a2a3a;--blue-dark:#8ac4ff;
  --teal:#4db6ac;--teal-light:#1a2e2b;--teal-dark:#80cbc4;
  --text:#e0e4e8;--text-muted:#a0aab4;--text-light:#8090a0;
  --bg:#0f1419;--card:#1a2332;--border:#2a3442;
  --shadow:0 2px 8px rgba(0,0,0,0.3);
  --shadow-lg:0 4px 16px rgba(0,0,0,0.4);
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;background:var(--bg);color:var(--text);line-height:1.6}

/* Nav */
.nav-bar{background:var(--card);box-shadow:0 1px 4px rgba(0,0,0,0.06);padding:12px 24px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:900}
.nav-bar .brand{font-size:1.25rem;font-weight:700;color:var(--blue);text-decoration:none;letter-spacing:-0.01em}
.nav-bar nav a{color:var(--text-muted);text-decoration:none;font-size:0.9rem;margin-left:20px;padding:6px 14px;border-radius:var(--radius-sm);transition:background .2s,color .2s}
.nav-bar nav a:hover,.nav-bar nav a.active{background:var(--blue-light);color:var(--blue)}

/* Dashboard Layout */
.filter-bar{background:var(--card);border-bottom:1px solid var(--border);padding:8px 24px}
.filter-form{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:0.9rem}
.filter-form label{color:var(--text-muted);font-weight:600}
.filter-form select{padding:6px 10px;border:1px solid #cfd8dc;border-radius:6px;font-size:0.9rem;background:var(--card);transition:border-color .2s}
.filter-form select:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 2px rgba(26,115,232,0.15)}
.refresh-indicator{margin-left:auto;color:var(--text-light);font-size:0.85rem}
.dashboard-layout{display:flex;gap:1rem;padding:1rem}
.map-wrap{flex:1;position:relative;min-height:80vh;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
.map-wrap iframe,.map-wrap .folium-map{width:100%;height:100%;border:none}
.no-reports{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:rgba(255,255,255,0.97);padding:2rem 2.5rem;border-radius:var(--radius);font-size:1.05rem;color:var(--text-muted);box-shadow:var(--shadow-lg);z-index:1000;pointer-events:none;text-align:center}

/* Stats Panel */
#stats-panel{width:340px;background:var(--card);border-radius:var(--radius);padding:1.25rem;font-size:0.9rem;box-shadow:var(--shadow-lg);display:flex;flex-direction:column;gap:0.25rem}
.health-score{text-align:center;margin-bottom:0.5rem;padding:1.5rem 1rem;background:linear-gradient(135deg,#e8f5e9,var(--teal-light));border-radius:var(--radius);border:2px solid rgba(0,137,123,0.12)}
.health-score .label{font-size:0.75rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:0.1em;font-weight:600;margin-bottom:0.25rem}
.health-score .score{font-size:3.5rem;font-weight:800;color:var(--health-color);line-height:1}
.health-score .max{font-size:0.85rem;color:var(--text-light);margin-top:0.25rem}
/* Dynamic health score colors — set via inline style on .health-score */
.health-score.health-green .score{color:#2e7d32}
.health-score.health-green{background:linear-gradient(135deg,#e8f5e9,#c8e6c9);border-color:rgba(46,125,50,0.15)}
.health-score.health-amber .score{color:#e65100}
.health-score.health-amber{background:linear-gradient(135deg,#fff3e0,#ffe0b2);border-color:rgba(230,81,0,0.15)}
.health-score.health-red .score{color:#c62828}
.health-score.health-red{background:linear-gradient(135deg,#fbe9e7,#ffcdd2);border-color:rgba(198,40,40,0.15)}

.stat-section{margin-bottom:0.75rem}
.stat-section h3{margin:0 0 0.5rem;font-size:0.8rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:0.06em;font-weight:600;border-bottom:1px solid var(--border);padding-bottom:4px}
.stat-section p{font-size:1.1rem;font-weight:600;color:var(--text)}

/* Category Bars */
.cat-bar-row{display:flex;align-items:center;margin-bottom:6px;transition:transform .15s}
.cat-bar-row:hover{transform:translateX(2px)}
.cat-bar-label{width:90px;text-transform:capitalize;font-size:0.82rem;color:var(--text-muted)}
.cat-bar{height:22px;background:linear-gradient(90deg,var(--teal),#26a69a);border-radius:11px;min-width:4px;transition:width .4s ease}
.sev-bar{height:22px;border-radius:11px;min-width:4px;transition:width .4s ease}
.sev-low{background:linear-gradient(90deg,#43a047,#66bb6a)}
.sev-medium{background:linear-gradient(90deg,#fb8c00,#ffa726)}
.sev-high{background:linear-gradient(90deg,#f4511e,#ff7043)}
.sev-critical{background:linear-gradient(90deg,#c62828,#e53935)}
.cat-bar-count{margin-left:8px;font-weight:600;font-size:0.82rem;color:var(--text)}

/* Hotspots & Trend */
.hotspot-list{list-style:none;padding:0;margin:0;counter-reset:hotspot}
.hotspot-list li{padding:5px 0;border-bottom:1px solid #f0f0f0;font-size:0.88rem;display:flex;align-items:center;gap:8px;counter-increment:hotspot}
.hotspot-list li::before{content:counter(hotspot);display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;background:var(--blue-light);color:var(--blue);border-radius:50%;font-size:0.75rem;font-weight:700;flex-shrink:0}
.hotspot-list li:last-child{border-bottom:none}
.trend{font-size:1.05rem;text-align:center;padding:0.6rem;background:var(--bg);border-radius:var(--radius-sm);font-weight:600;color:var(--text)}

/* Footer */
.site-footer{text-align:center;padding:1.5rem 1rem;color:var(--text-light);font-size:0.8rem;border-top:1px solid var(--border);margin-top:2rem;background:var(--card)}
.site-footer .badge{display:inline-block;background:var(--blue-light);color:var(--blue);padding:2px 10px;border-radius:20px;font-weight:600;font-size:0.75rem;margin-left:6px}

/* Mobile: dashboard stacks */
@media(max-width:768px){
  .dashboard-layout{flex-direction:column}
  .map-wrap{min-height:50vh}
  #stats-panel{width:100%}
  .nav-bar{padding:8px 12px}
  .nav-bar nav a{margin-left:12px;padding:8px 12px;min-height:44px;display:inline-flex;align-items:center}
  .filter-form label{display:none}
  .filter-form select{flex:1;min-width:0}
}

/* Theme toggle */
.theme-toggle{background:none;border:1px solid var(--border);border-radius:var(--radius-sm);padding:6px 10px;cursor:pointer;font-size:1rem;line-height:1;color:var(--text-muted);transition:background .2s}
.theme-toggle:hover{background:var(--blue-light)}

/* Chat Widget */
.chat-fab{position:fixed;bottom:24px;right:24px;width:56px;height:56px;border-radius:50%;background:var(--blue);color:#fff;border:none;font-size:1.5rem;cursor:pointer;box-shadow:var(--shadow-lg);z-index:1000;transition:transform .2s}
.chat-fab:hover{transform:scale(1.1)}
.chat-panel{position:fixed;bottom:24px;right:24px;width:380px;max-height:520px;background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow-lg);display:flex;flex-direction:column;z-index:1001;border:1px solid var(--border);overflow:hidden}
.chat-header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:var(--blue);color:#fff;font-weight:600;font-size:0.95rem}
.chat-close{background:none;border:none;color:#fff;font-size:1.2rem;cursor:pointer;padding:0 4px;line-height:1}
.chat-messages{flex:1;overflow-y:auto;padding:12px;display:flex;flex-direction:column;gap:8px;max-height:380px;min-height:200px}
.chat-msg{padding:8px 12px;border-radius:var(--radius-sm);font-size:0.88rem;line-height:1.5;max-width:85%;word-wrap:break-word}
.chat-msg.user{align-self:flex-end;background:var(--blue);color:#fff;border-bottom-right-radius:2px}
.chat-msg.ai{align-self:flex-start;background:var(--bg);color:var(--text);border-bottom-left-radius:2px}
.chat-input{display:flex;border-top:1px solid var(--border);padding:8px}
.chat-input input{flex:1;border:1px solid var(--border);border-radius:var(--radius-sm);padding:8px 12px;font-size:0.88rem;background:var(--card);color:var(--text);outline:none}
.chat-input input:focus{border-color:var(--blue)}
.chat-input button{background:var(--blue);color:#fff;border:none;border-radius:var(--radius-sm);padding:8px 14px;margin-left:6px;cursor:pointer;font-size:1rem}
.chat-input button:disabled{opacity:0.5;cursor:not-allowed}
.chat-loading .dots::after{content:'';animation:dots 1.2s steps(4,end) infinite}
@keyframes dots{0%{content:''}25%{content:'.'}50%{content:'..'}75%{content:'...'}}
@media(max-width:768px){
  .chat-panel{width:calc(100% - 16px);right:8px;bottom:8px;max-height:70vh}
  .chat-fab{bottom:16px;right:16px}
}