/* Layout: map + sidebar */
#app{display:flex;height:640px;margin:8px 12px 0;border:1px solid #ddd}
#map{flex:1}
/* ensure global font inherits from site */
html,body{margin:0;padding:0}
#app.container{max-width:none}
#sidebar{width:320px;padding:12px;box-shadow:inset 0 0 0 1px #f3f3f3;display:flex;flex-direction:column}
#sidebar h2{margin:0 0 8px;font-size:18px}
#info{font-size:13px;line-height:1.4;overflow:auto}
#controls{margin-top:12px;flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden}
table.props{width:100%;border-collapse:collapse}
table.props th{text-align:left;padding:4px 6px;background:rgba(128,128,128,0.1);width:40%}
table.props td{padding:4px 6px}

.candidates{padding-left:16px;margin:8px 0}
.candidates li{margin:6px 0}
.district-list{flex:1;min-height:0;overflow:auto;padding-left:12px;margin-top:12px;border-top:1px solid #eee}
.district-list a{display:block;padding:4px 0;color:#0078d4;text-decoration:none}
.district-list a:hover{text-decoration:underline}

/* tooltip tweaks to allow clicking links inside */
.district-tooltip { pointer-events: auto !important; max-width: 320px; }
.district-tooltip .tt-cands { margin-top: 4px; }
.district-tooltip .citem { margin-bottom: 6px; }
.district-tooltip a { color: #004a99; text-decoration: underline; }

@media (max-width:800px){
  /* Stack map above the sidebar on small screens and allow natural height */
  #app{flex-direction:column;height:auto}
  #map{width:100%;height:50vh;min-height:300px}
  #sidebar{width:100%;order:2;padding:12px}
  /* Make the district list scrollable beneath the map */
  #controls{max-height:40vh;overflow:hidden}
  .district-list{flex:1;min-height:0}
}

/* Candidate photo styles for tooltips and sidebar */
.district-tooltip .citem{display:flex;align-items:center}
.district-tooltip img.cand-photo{width:40px;height:40px;object-fit:cover;border-radius:4px;margin-right:8px}
.district-tooltip .cmeta{display:inline-block;vertical-align:middle}

.candidate-entry{display:flex;align-items:center;margin:8px 0}
.candidate-entry img.cand-photo{width:56px;height:56px;object-fit:cover;border-radius:6px;margin-right:8px}
.candidate-meta{font-size:14px;line-height:1.1}
.candidate-race{display:block;margin-top:2px;color:#1e63c6;font-weight:600}