.map-view {
    height: calc(100vh - 200px);
}

.map-size{
    height: calc(100vh - 200px);
}

.info.legend {
    gap: 1rem;
    background-color: rgba(255, 255, 255, 0.3); /* Increased opacity */
    backdrop-filter: blur(20px); /* Increased blur */
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, 0.4);
    padding: 1rem 1.5rem;
    border-radius: 12px;
    margin-bottom: 1.5rem; /* Reduced margin */
    position: sticky;
    top: 15px; /* Position sticky relative to parent padding */
    z-index: 1000;
}

.suitability-map {
    width: 300px;
    /* height: 80vh; */
}

@media  screen and (min-width: 767px) {
    /* #page-title{
        font-size: 1.2rem;
        text-align: center;
    } */
    .map-view{
        margin-top: .5rem;
        height: calc(92.5vh - 60px) !important;
        border-radius: 50px;
    }
    .map-view {
        height: calc(100vh - 150px);
    }

    .map-size{
        height: calc(100vh - 150px);
    }

    /* #map-details{
        height: 45dvh;
        margin-top: 4px;
        align-items: start;
    } */
    /* #map-hint{
        height: 39dvh;
    } */
}

@media  screen and (min-width: 991px) {
    /* #page-title{
        font-size: 1.2rem;
        text-align: center;
    } */
     .map-view {
        height: calc(100vh - 200px);
    }

    .map-size{
        height: calc(100vh - 200px);
    }
    /* #map-details{
        height: 45dvh;
        margin-top: 4px;
        align-items: start;
    /* } */
} 

@media  screen and (min-width: 1192px) {
    /* #page-title{
        font-size: 1.2rem;
        text-align: center;
    } */
     .map-view {
        height: calc(100vh - 130px);
    }

    .map-size{
        height: calc(100vh - 130px);
    }
    /* #map-details{
        height: 45dvh;
        margin-top: 4px;
        align-items: start;
    /* } */
} 
/* @media  screen and (max-width: 420px){
    #page-title{
        font-size: 1rem;
        text-align: center;
    }
} */