html, body {
  height:100%;
  margin:0;
}

.container-fluid{
  height:100%;
  display:flex;
  flex-direction:column;
}

#headerBar{
  background:#2c2c2c;
  color:#fff;
  min-height:46px;
  padding:0 16px;
  border-bottom:1px solid #444;
}

.app-title{
  font-weight:600;
  font-size:15px;
}


/* harta full screen sub header */
#map{
  height:100%;
  width:100%;
}

#mapCol{
  padding:0;
}


/* SIDEBAR DREAPTA */
#sidebar {
  padding:10px;
}

#sidebarCol{
  border-left:1px solid #ddd;
  overflow-y:auto;
}

#footerBar{
  height:36px;
  background:#f8f9fa;
}

#searchBox {
  width:100%;
  padding:6px;
  margin-bottom:6px;
}

#siteList {
 
  overflow-y:auto;
  background:#fff;
  border:1px solid #ddd;
}

.site-item {
  padding:6px;
  cursor:pointer;
  border-bottom:1px solid #eee;
}

.site-item:hover {
  background:#e6f2ff;
}
.site-item.active{
  background:#2c7be5;
  color:#fff;
}
.site-item.active:hover{
  background:#1a5dcc;
}#detailView button{
  margin-bottom:8px;
}

#detailMeta{
  font-size:13px;
  margin-bottom:10px;
}
#detailMeta div{
  margin-bottom:4px;
}

/* buton reset ca Leaflet zoom */
.leaflet-control-reset-btn{
  width: 30px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  text-decoration: none;
  font-size: 18px;
  font-weight: 600;
  color: #000;
  background: #fff;
  display: block;
}

.leaflet-control-reset-btn:hover{
  background: #f4f4f4;
}

/* mic separator vizual între zoom și reset */
.leaflet-control-reset.leaflet-bar{
  margin-top: 6px; /* spațiu sub zoom */
}

.leaflet-top.leaflet-right{
  margin-top:46px;
}


.map-legend{
  background: rgba(255,255,255,0.92);
  padding: 10px 12px;
  border-radius: 10px;
  box-shadow: 0 6px 18px rgba(0,0,0,0.15);
  font-size: 13px;
  line-height: 1.2;
}

.map-legend .legend-title{
  font-weight: 700;
  margin-bottom: 8px;
}

.map-legend .legend-item{
  display:flex;
  align-items:center;
  gap:8px;
  margin: 4px 0;
}

.map-legend .legend-swatch{
  width: 12px;
  height: 12px;
  border-radius: 50%;
  display:inline-block;
  border: 2px solid #333;
}

.map-legend .legend-red{
  background:#c0392b;
  border-color:#922b21;
}

.map-legend .legend-blue{
  background:#1f6feb;
  border-color:#0b3d91;
}