/* style.css */

/* Style for the custom icon */
.custom-icon {
    position: relative; /* Position relative for absolute positioning of the background */
    z-index: 1 !important;

}

.custom-icon .icon-background {
    background-color: #001f3f; 
    border-radius: 50%;
    width: 100%; 
    height: 100%; 
    display: flex; 
    align-items: center; 
    justify-content: center; 
}

.custom-icon.red {
    z-index: 1000 !important;

}

.custom-icon.red .icon-background {
    background-color: #e82127;
}

.custom-icon .icon-background img {
    width: 75%; 
    height: 75%; 
}

/* Style for the cluster icon */
.cluster-icon {
    background-color: #001f3f; /* Dark blue background for clusters */
    color: white; /* Text color */
    border-radius: 50%; /* Make it circular */
    display: flex; /* Use flexbox for centering */
    align-items: center; /* Center vertically */
    justify-content: center; /* Center horizontally */
    font-size: 12px; /* Font size for the count */
    font-weight: bold; /* Bold text */
    z-index: 1 !important;
}

.cluster-icon.red {
    background-color: #e82127;
    z-index: 1000 !important;
}