html {
    font-size: 14px;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

html {
    position: relative;
    min-height: 100%;
}

body {
    /*  margin-bottom: 60px;*/
    background-color: #F0F6F6;
}

.app-header {
    background: #F0F6F6;
}

.loader {
    width: 60px;
}

.form-select {
    padding: 8px !important;
}

.devicesettings-dropdown ul.dropdown-menu.show {
    max-height: 150px;
    overflow-y: scroll;
    height: fit-content;
}

input[type="tel"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.app-sidebar .side-menu__item.active .side-menu__label, .app-sidebar .side-menu__item:hover .side-menu__label, .app-sidebar .side-menu__item:hover .side-menu__icon, .app-sidebar .side-menu__item.active .side-menu__icon {
    color: #0A9EA8;
}

.logo-preview {
    height: 200px;
    width: 100%;
    background-repeat: no-repeat;
    background-size: contain;
}

.printreportaddress {
    width: auto;
    word-break: normal;
    text-overflow: clip;
    white-space: break-spaces;
    overflow: overlay;
    text-align: end;
    max-width: 250px;
}

.form-label {
    font-size: 0.8rem;
    font-family: 600;
    color: #071F4B;
}

select:disabled {
    cursor: not-allowed !important;
}

.form-control form-select {
    border-color: #CFDDFC;
}

.table th {
    padding: .75rem;
    vertical-align: middle;
    line-height: 1.2;
    font-size: 1rem;
    font-weight: 400;
    background-color: #21809B !important;
    color: #F1F7F9;
    height: 3rem;
}

.table td {
    vertical-align: middle;
    line-height: 1.2;
    font-size: 0.9rem;
    font-weight: 500;
    border-left-width: 0px;
    border-right-width: 0px;
    color: #354157;
    padding: 5px;
}

.btn-primary {
    background-color: #1ABBAF !important;
    border-color: #1ABBAF !important;
}

    .btn-primary:hover {
        background-color: #0A9EA8 !important;
        border-color: #0A9EA8 !important;
    }

.bg-image {
    background-image: url(../assets/images/used_images/login-bg-banner.jpg);
    background-size: cover;
}

.app-sidebar .side-menu__icon {
    fill: #065E73;
    color: #065E73;
    border-radius: .5rem;
}

.app-sidebar .side-menu__label {
    font-family: 'Inter';
    font-size: 0.9rem;
}

th,
td {
    padding: .5rem .5rem;
    vertical-align: middle;
    line-height: 0;
    font-size: 0.813rem;
    font-weight: 500;
}

tbody, td, tfoot, th, thead, tr {
    border-color: #E4EFEE;
}

button {
    font-size: 13px !important;
}


.card.custom-card .card-header .card-title:before {
    content: "";
    position: absolute;
    height: 1.5rem;
    width: .2rem;
    inset-block-start: .15rem;
    inset-inline-start: -.65rem;
    background: linear-gradient(to bottom, var(--primary05) 50%, rgba(var(--secondary-rgb), .5) 50%);
    border-radius: .5rem;
}

.main-header-container {
    background: white;
}

.modal-header {
    padding: 1rem 1.25rem !important;
}

.modal-body {
    position: relative;
    flex: 1 1 auto;
    padding: 1rem 1.25rem !important;
}


.disease-legend {
    padding: 10px 15px;
    border-radius: 8px;
    font-size: 11px;
    z-index: 1000;
}

    .disease-legend ul {
        list-style: none;
        padding: 0;
        margin: 0;
    }

    .disease-legend li {
        display: flex;
        align-items: center;
        margin-bottom: 8px;
    }

    .disease-legend .dot {
        width: 13px; /* Bigger dot */
        height: 13px;
        border-radius: 50%;
        display: inline-block;
        margin-right: 8px;
    }

    /* Disease-specific colors */
    .disease-legend .diabetic {
        background-color: #FF9B53;
    }

    .disease-legend .dengue {
        background-color: #D94A5C;
    }

    .disease-legend .malaria {
        background-color: #A03059; 
    }

    .disease-legend .rabies {
        background-color: #600E2C;
    }

    .disease-legend .polio {
        background-color: #FFFF00;
    }
/*.mapcontainer .map {
    background-color: #cbc0c0 !important;
}*/
/*.mapcontainer .map svg {
    background-color: #cbc0c0 !important;
}

.mapcontainer {
    background-color: #cbc0c0 !important;
}*/
.gray-background {
    background-color: #cbc0c0 !important;
}