/* ===============================
   GLOBAL STYLES
================================ */

*{
box-sizing:border-box;
margin:0;
padding:0;
}

body{
font-family:Arial, Helvetica, sans-serif;
background:#f5f5f5;
color:#333;
}

/* ===============================
   HEADER
================================ */

.header{
width:100%;
background:#0a4b78;
color:#fff;
padding:15px 20px;
font-size:20px;
font-weight:bold;
display:flex;
justify-content:space-between;
align-items:center;
}

.header a{
color:#fff;
text-decoration:none;
font-size:14px;
}

/* ===============================
   MAP CONTAINER
================================ */

#map{
width:100%;
height:60vh;

/* ===============================
   SEARCH PANEL
================================ */

.search-panel{
position:absolute;
top:20px;
left:20px;
background:#fff;
padding:15px;
border-radius:8px;
box-shadow:0 3px 10px rgba(0,0,0,0.2);
z-index:1000;
width:260px;
}

.search-panel h3{
margin-bottom:10px;
font-size:18px;
}

.search-panel input,
.search-panel select{
width:100%;
padding:8px;
margin-bottom:10px;
border:1px solid #ccc;
border-radius:4px;
font-size:14px;
}

.search-panel button{
width:100%;
padding:10px;
background:#0a4b78;
border:none;
color:white;
border-radius:4px;
font-size:14px;
cursor:pointer;
}

.search-panel button:hover{
background:#083b5f;
}

/* ===============================
   POPUP STYLES
================================ */

.leaflet-popup-content{
font-size:14px;
line-height:1.4;
}

.popup-title{
font-weight:bold;
font-size:16px;
margin-bottom:5px;
color:#0a4b78;
}

.popup-phone{
margin-top:5px;
font-weight:bold;
}

.popup-category{
font-size:13px;
color:#777;
}

/* ===============================
   ADMIN PANEL
================================ */

.admin-container{
max-width:600px;
margin:60px auto;
background:#fff;
padding:25px;
border-radius:8px;
box-shadow:0 4px 10px rgba(0,0,0,0.15);
}

.admin-container h2{
margin-bottom:20px;
}

.admin-container input{
width:100%;
padding:10px;
margin-bottom:12px;
border:1px solid #ccc;
border-radius:4px;
}

.admin-container button{
background:#0a4b78;
color:white;
padding:10px;
border:none;
width:100%;
border-radius:4px;
cursor:pointer;
}

.admin-container button:hover{
background:#083b5f;
}

/* ===============================
   MOBILE RESPONSIVE
================================ */

@media (max-width:768px){

body{
flex-direction:column;
height:auto;
}

#sidebar{
width:100%;
height:auto;
border-right:none;
border-bottom:1px solid #ccc;
}

#map{
width:100%;
height:60vh;
}

}
/* ===============================
   PROFESSIONAL POPUP
================================ */

.leaflet-popup-content-wrapper{
border-radius:10px;
padding:0;
overflow:hidden;
box-shadow:0 4px 12px rgba(0,0,0,0.25);
}

.leaflet-popup-content{
margin:0;
font-family:Arial, Helvetica, sans-serif;
}

.popup-card{
padding:12px 14px;
min-width:220px;
}

.popup-title{
font-size:16px;
font-weight:bold;
color:#1e3a8a;
margin-bottom:6px;
}

.popup-address{
font-size:13px;
color:#444;
margin-bottom:4px;
}

.popup-city{
font-size:13px;
color:#666;
margin-bottom:6px;
}

.popup-phone{
font-size:13px;
margin-bottom:8px;
}

.popup-category{
display:inline-block;
background:#e5e7eb;
color:#333;
padding:4px 8px;
border-radius:6px;
font-size:12px;
margin-bottom:8px;
}

.popup-btn{
display:block;
width:100%;
text-align:center;
background:#2563eb;
color:white;
padding:8px;
border-radius:6px;
text-decoration:none;
font-size:13px;
margin-top:6px;
}

.popup-btn:hover{
background:#1e4ed8;
}

.popup-report{
display:block;
margin-top:14px;
padding-top:10px;
border-top:1px solid #e5e7eb;
font-size:13px;
color:#b91c1c;
text-align:center;
text-decoration:none;
font-weight:bold;
}

.popup-report:hover{
color:#991b1b;
text-decoration:underline;
}

.legend-item{
display:flex;
align-items:center;
gap:8px;
font-size:13px;
margin-bottom:6px;
}

.legend-item img{
width:14px;
height:auto;
}
.alert-icon{
width:24px;
vertical-align:middle;
margin-right:8px;
}
/* SUBMIT RESOURCE FORM */

.admin-container{
display:flex;
justify-content:center;
align-items:flex-start;
padding-top:80px;
background:#f4f4f4;
min-height:100vh;
}

.form-container{
width:500px;
max-width:90%;
background:white;
padding:25px;
border-radius:8px;
box-shadow:0 3px 12px rgba(0,0,0,0.15);
}

.form-container h2{
margin-top:0;
margin-bottom:20px;
}

.form-container input,
.form-container select,
.form-container textarea{
width:100%;
padding:10px;
margin-bottom:12px;
border:1px solid #ccc;
border-radius:6px;
font-size:14px;
}

.form-container textarea{
height:100px;
resize:vertical;
}

.form-container button{
background:#2563eb;
color:white;
border:none;
padding:12px;
border-radius:6px;
font-weight:bold;
cursor:pointer;
width:100%;
}

.form-container button:hover{
background:#1d4ed8;
}

.admin-btn{
display:block;
text-align:center;
background:#374151;
color:white;
padding:10px;
border-radius:6px;
text-decoration:none;
}

.admin-btn:hover{
background:#1f2937;
}