html,
body{

margin:0;
padding:0;
height:100%;

font-family:Arial;

}

#map{

position:absolute;

left:0;
top:0;

width:100%;
height:100%;

}

#sidebar{

position:absolute;

top:15px;
right:15px;

width:350px;

background:white;

padding:15px;

border-radius:12px;

box-shadow:0 0 15px rgba(0,0,0,.3);

z-index:100;

max-height:90vh;

overflow:auto;

}

#search{

width:100%;

padding:10px;

margin-bottom:15px;

font-size:16px;

}

details{

    margin-bottom:12px;

}

summary{

    cursor:pointer;
    font-size:17px;
    margin-bottom:10px;

}

.section{

    margin-top:10px;
    margin-left:5px;

}

.section label{

    display:block;
    margin:6px 0;

}

.section input[type="text"]{

    width:95%;
    padding:8px;
    border-radius:5px;
    border:1px solid #ccc;

}

/* ===========================
   Barre de recherche
=========================== */

#search-container{

    position:absolute;

    top:20px;
    left:20px;

    width:500px;

    z-index:1000;

    background:rgba(255,255,255,0.82);

    backdrop-filter:blur(10px);

    -webkit-backdrop-filter:blur(10px);

    border-radius:14px;

    box-shadow:0 4px 12px rgba(0,0,0,0.18);

    padding:10px;

}

#search{

    width:100%;

    border:none;

    outline:none;

    font-size:17px;

    background:transparent;

}

/* ======================================
   PANNEAU COUCHES
====================================== */

#layers-panel{

    position:absolute;

    top:200px;

    left:20px;

    width:280px;

    z-index:4000;

    background:rgba(255,255,255,.88);

    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);

    border-radius:12px;

    padding:15px;

    box-shadow:0 4px 15px rgba(0,0,0,.2);

}

#layers-panel hr{

    margin:12px 0;

}

#layers-panel label{

    display:block;

    margin:8px 0;

    cursor:pointer;

}

/* ===========================
   FILTRES THEMATIQUES
=========================== */

#theme-filters{

    position:absolute;

    top:100px;

    left:20px;

    display:flex;

    gap:10px;

    z-index:5000;

    flex-wrap:wrap;

}

.theme-btn,
#reset-filters{

    border:none;

    padding:10px 18px;

    border-radius:10px;

    background:rgba(255,255,255,.88);

    backdrop-filter:blur(10px);

    -webkit-backdrop-filter:blur(10px);

    box-shadow:0 2px 10px rgba(0,0,0,.15);

    cursor:pointer;

    font-size:15px;

    transition:.2s;

}

.theme-btn:hover,
#reset-filters:hover{

    transform:translateY(-2px);

    box-shadow:0 4px 15px rgba(0,0,0,.25);

}

.theme-btn.active{

    background:#2E7D32;

    color:white;

    border:2px solid #1B5E20;

}