body {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    background-color: #f4fafc;
    font-family: "Poppins", sans-serif;
}

html {
    scroll-behavior: smooth;
}

:root {
    --primary: #438eb9;
    --secondary: #115c88;
    --secondary-2: #00ADFF;
    --secondary-red: #E31E25;
    --black: #121212;
    --white: #ffffff;
    --primary-lit-1: #63A9CB;
    --primary-lit-2: #093d4a3f;
    --golden-yellow: #FFD702;
    --gradient-1: linear-gradient(to right, #0CA4CA, #096278);
    --gradient-2: linear-gradient(to right, #025367, #018DB0);
    --white: #ffffff;
    --transi: all 0.5s ease;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    text-transform: capitalize;
}

h1 {
    font-weight: 700;
    font-size: 44px;
}

h2 {
    font-weight: 500;
    font-size: 30px;
    color: var(--primary);
}

a {
    text-decoration: none;
}

img {
    width: 100%;
}

.sec_gapping {
    padding: 18px 0;
}

ul {
    padding-left: 0;
}

ul li {
    list-style: none;
}

.sec_heading {
    text-transform: uppercase;
    font-size: 22px;
    font-weight: 600;
    position: relative;
    display: inline-block;
    margin-bottom: 0;
}

/* .sec_heading::after {
    position: absolute;
    content: '';
    width: 100%;
    height: 6px;
    background: #ffd70263;
    left: 0;
    bottom: 4px;
} */

.my_form .form_control {
    border: none;
    padding: 0 0 0 4px;
    border-radius: 4px;
}

.form-select {
    font-size: 14px;
    text-transform: capitalize;

}

.form-select option {
    font-size: 13px;
    text-transform: capitalize;
}

.my_form {
    margin-top: 14px;
}

.my_form .form-label {
    text-transform: capitalize;
    font-size: 15px;
    margin: 6px 0 0 0;
}

.form-check-label {
    text-transform: capitalize;
}
.form-label{
    text-transform: capitalize;
}

.btn1 {
    background: var(--secondary);
    border-radius: 6px;
    padding: 5px 16px;
    font-size: 18px;
    color: var(--white);
    border: none;
    text-transform: capitalize;
    transition: var(--transi);
    cursor: pointer;
}

.btn1:hover {
    background: var(--primary);
    color: var(--white);
}

.btn2 {
    background: #9a850f;
    padding: 4px 10px;
    font-size: 15px;
    color: white;
}

.saveBtn,
.cancelBtn {
    background: white;
}

.saveBtn {
    color: var(--primary);
    border: 1px solid var(--primary);
}

.cancelBtn {
    color: var(--secondary-red);
    border: 1px solid var(--secondary-red);
    margin-left: 8px;
}

.cancelBtn:hover {
    background: var(--secondary-red);
}

.visitDetails {
    border: 1px dashed var(--black) !important;
    background: var(--black) !important;
    color: white !important;

}

.visitDetails:hover {
    background: white !important;
    /* color: white !important; */
    color: var(--black) !important;
}

.addBtn {
    text-transform: capitalize;
    background-color: var(--secondary);
    border: 0;
    border-radius: 56px;
    color: #fff;
    cursor: pointer;
    display: inline-block;
    font-family: system-ui, -apple-system, system-ui, "Segoe UI", Roboto, Ubuntu, "Helvetica Neue", sans-serif;
    font-size: 16px;
    font-weight: 600;
    outline: 0;
    padding: 10px 30px;
    position: relative;
    text-align: center;
    text-decoration: none;
    transition: all .3s;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
}

.addBtn:before {
    background-color: initial;
    background-image: linear-gradient(#fff 0, rgba(255, 255, 255, 0) 100%);
    border-radius: 125px;
    content: "";
    height: 50%;
    left: 4%;
    opacity: .5;
    position: absolute;
    top: 0;
    transition: all .3s;
    width: 92%;
}

.addBtn:hover {
    box-shadow: #ffffff33 0 3px 15px inset, #0000001a 0 3px 5px, #0000001a 0 10px 13px;
    transform: scale(1.02);
    color: wheat;
}

.table thead tr th {
    text-transform: capitalize;
    font-size: 13px;
    white-space: nowrap;
    font-weight: 600;
}

.table tbody tr td {
    font-size: 12.5px;

}

.top_header {
    padding-top: 4px;
    padding-bottom: 4px;
}

.top_header .top_headerUL {
    display: flex;
    align-items: center;
    justify-content: end;
    margin-bottom: 0;
}

.top_header .top_headerUL li i {
    font-size: 18px;
    color: black;
}

.top_header .top_headerUL li:not(:last-child) {
    margin-right: 30px;
}

.top_header .top_headerUL li .btn-group button {
    border: none;
    background: none;
}

.top_header .top_headerUL li .btn-group button img {
    width: 28px;
}

.top_header .top_headerUL li .btn-group .dropdown-menu {
    border: none;
    max-width: 5rem !important;
    background: var(--secondary);
}

.top_header .top_headerUL li .btn-group .dropdown-menu li {
    margin-right: 0px;
    color: white;
}

.top_header .top_headerUL li .btn-group .dropdown-menu li a .dropdown-item {
    text-transform: capitalize;
    font-size: 14px;
}


.navbar {
    background: var(--primary);
    padding: 0;
}

.navbar-brand {
    color: wheat;
    font-size: 24px;
    padding: 9px 0;
}

.navbar-brand:hover {
    color: wheat;
}

.navbar .navbar-collapse .navbar-nav .nav-item .nav-link {
    text-transform: capitalize;
    color: var(--white);
    font-size: 15px;
    padding: 22px 8px;
    transition: var(--transi);
}

.navbar .navbar-collapse .navbar-nav .nav-item .nav-link.active,
.navbar .navbar-collapse .navbar-nav .nav-item .nav-link:hover {
    background: var(--secondary);
}

.userAccount {
    padding: 20px 8px !important;
    border-radius: 0 !important;
    border-left: 2px solid var(--golden-yellow) !important;
}

.userAccount i {
    color: var(--golden-yellow) !important;
    font-size: 22px;
}

/* .navbar .navbar-collapse .navbar-nav .nav-item:hover {
    background: var(--secondary);
} */

.navbar-toggler {
    color: white;
    border: 1px solid white;
    border-radius: 0 !important;
}

.navbar-toggler:focus {
    text-decoration: none;
    outline: 0;
    box-shadow: none !important;
}

.navbar-collapse {
    justify-content: end;
}


.userAccount_menu {
    left: -107px !important;
}

/* .dropdown-menu {
    background: var(--secondary);
    border-radius: 0 !important;
    padding: 0 !important;
}

.dropdown-menu .dropdown-item {
    color: white;
    text-transform: capitalize;
    font-size: 14px;
}

.dropdown-menu .dropdown-item:hover {
    background: var(--primary);
}

.dropdown-menu[data-bs-popper] {
    top: 100%;
    left: 0;
    margin-top: 0px !important;
    border: none;
} */






.dropend .nav-link {
    background: none !important;
    padding: 6px !important;
}

.dropdown .dropdown-menu {
    display: none;
    padding: 0;
    border-radius: 0;
    background: var(--secondary);
    border: none;
    padding: 4px;
}

.dropdown-menu li a {
    text-transform: capitalize;
    font-size: 14px;
    color: white;
    padding: 2px 6px !important;

}

.dropend .dropdown-menu li a i {
    font-size: 9px;
    margin-right: 6px;
}

.dropdown:hover>.dropdown-menu,
.dropend:hover>.dropdown-menu {
    display: block;
}


.accordion-button:not(.collapsed),
.accordion-button {
    color: white;
    background: var(--secondary) !important;
    box-shadow: none;
    padding: 6px !important;
    border-radius: 0 !important;
}

.accordion-body {
    background: #063652e8 !important;
    padding: 0;
}

.accordion-body li a i {
    font-size: 8px;
    margin-right: 6px;
}

.accordion-button {
    text-transform: capitalize !important;
    font-size: 14px !important;
    font-weight: 400 !important;
}

.accordion-body li a {
    text-transform: capitalize !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    color: wheat;

}

.accordion-button:focus {
    border-color: transparent;
    box-shadow: none;
}

.accordion-item {
    border: none;
}

.accordion-button:not(.collapsed)::after,
.accordion-button::after {
    background-image: none;
}

.chartModal .modal-dialog {
    max-width: max-content;
}


@media (max-width: 767.99px) {
    .dropend .dropdown-toggle {
        margin-left: 0.5em;
    }

    .dropend .dropdown-menu[data-bs-popper] {
        /* margin: 4px 12px;
        background: #1470a5 !important; */
        margin-left: 0;
    }

    .dropend .dropdown-menu li a {
        font-size: 13px !important;
        color: wheat !important;
        margin-left: 8px;

    }

    .dropend .dropdown-menu li a i {
        font-size: 7px;
        margin-right: 4px;
    }
}

@media (min-width: 768px) {
    .dropend:hover>.dropdown-menu {
        position: absolute;
        top: 0;
        left: 100%;
    }

    .dropdown-item:hover,
    .dropend .nav-link:hover {
        background: var(--primary) !important;
        color: #fff;
    }
}




.timeSlotUL {
    display: inline-flex;
    border: 1px solid #d4d4d4;
    border-radius: 4px;
    /* margin-top: 20px; */
    padding: 6px;
}

.timeSlotUL li {
    padding: 8px 15px;
}

.timeSlotUL li:nth-child(1) {
    background: #62cdff;
}

.timeSlotUL li:nth-child(2) {
    background: #acfdef;
}

.timeSlotUL li:nth-child(3) {
    background: #b8acfd;
}

.timeSlotUL li:nth-child(4) {
    background: #fdf9ac;
}

.timeSlotUL li:nth-child(5) {
    background: #b4fdac;
}

.timeSlotUL li:not(:last-child) {
    border-right: 2px solid #979797;
}



.colorBlocksUL {
    display: inline-flex;
}

.colorBlocksUL li {
    display: flex;
    align-items: center;
    margin-right: 30px;
    text-transform: capitalize;
}

.colorBlocksUL li div {
    border: 1px solid #acacac;
    border-radius: 4px;
    height: 16px;
    width: 16px;
    background-color: transparent;
    margin-right: 8px;
}



/***************** LOG IN CSS start  ****************/
.login_screen {
    display: flex;
    justify-content: center;
    align-items: center;
    background-image: url('../images/loginBG.png');
    background-position: bottom;
    padding: 40px 0;
    width: 100%;
    height: 100vh;
    background-repeat: no-repeat;
    background-size: cover;
}

.login_content {
    padding: 40px;
    width: 33%;
    border-radius: 6px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    position: relative;

}

.login_content::after {
    position: absolute;
    content: '';
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background: #003b5d14;
    border-radius: 6px;
    box-shadow: 0 4px 30px #0000001a;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid #115c8830;
}

.login_formDiv {
    width: 100%;
    position: relative;
    z-index: 11;
}

.login_content p {
    text-align: center;
    font-size: 26px;
    font-weight: 500;
    text-transform: uppercase;
    /* margin-bottom: 14px; */
}

.login_content .login_formDiv .loginLogo_div {
    display: flex;
    align-items: center;
    justify-content: center;
}

.login_content .login_formDiv .loginLogo_div .logo_img {
    width: 40%;
}

/***************** LOG IN CSS end  ****************/





/************* Dashboard css start ***************/
.dashboard .dashboard_card {
    background: #ffffff;
    border-radius: 6px;
    text-align: center;
    padding: 40px 10px 30px 10px;
    transition: var(--transi);
    margin-bottom: 20px;
    border: 1px solid transparent;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.dashboard .dashboard_card li.badge {
    background: #7e55b3;
    padding: 6px 10px;
    position: absolute;
    top: 4px;
    right: 4px;
}

.dashboard .dashboard_card:hover {
    transform: translateY(-6px);
    border: 1px solid var(--secondary-2);
}

.dashboard a .dashboard_card {
    color: var(--secondary);
    text-transform: capitalize;
    margin-bottom: 0;
    font-size: 16px;
    font-weight: 500;
}

.dashboard .dashboard_card .db_img {
    display: inline-block;
    position: relative;
}

.dashboard .dashboard_card .db_img::after {
    position: absolute;
    content: '';
    height: 50px;
    width: 50px;
    background: #cdefff;
    right: 0;
    top: 0;
    border-radius: 50%;
}

.dashboard .dashboard_card .db_img img {
    height: 80px;
    width: 80px;
    position: relative;
    z-index: 11;
    margin-bottom: 16px;
}

/************* Dashboard css end***************/


/***************** all patient start ******************/
.allPatient .formUL {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0;
}

.allPatient .formUL li label {
    font-size: 14px;
}

/***************** all patient end ******************/


.patientInfoDiv {
    padding: 14px;
    border: 1px solid #d2d2d2;
    box-shadow: 0 0 black;
    box-shadow: 0 1px 16px #0000001c;
    border-radius: 8px;
    margin-top: 16px;
}

.patientInfoDiv h4, .patientInfoDiv h5 {
    display: inline-block;
    color: #5a5a5a;
    font-size: 1.3rem;
}
.patientInfoDiv h5 {
    font-size: 16px !important;
}

.patientInfoDiv p {
    margin-bottom: 10px;
    font-size: 15px;
}

.patientInfoDiv p i {
    padding: 4px;
    border: 1px solid var(--primary);
    border-radius: 4px;
    color: var(--primary);
    margin-right: 4px;
    font-size: 12px;
}
.topUL .nav-link{
    text-transform:capitalize;
}
.topUL .nav-link.active,
.topUL .show > .nav-link {
    color: #fff;
    background-color: var(--primary);
    border: 1px solid var(--primary);
    border-bottom: none !important;
}

.topUL .nav-link {
    color: var(--primary-lit-1);
    border-radius: 4px 4px 0 0;
    padding: .5rem 2rem ;
    background: white;
    border: 1px solid var(--primary);
    margin-right: 20px;
    border-bottom: none !important;
}

.topUL {
    border-bottom: 1px solid var(--primary);
}

.detailsDiv {
    padding: 16px;
    border: 1px solid #007092;
}

.caseDate {
    background: #007092;
    padding: 6px 10px;
    border-radius: 4px 4px 0 0;
}

.caseDate ul {
    display: flex;
    align-items: center;
    justify-content: end;
    margin-bottom: 0;
}

.caseDate ul li i {
    color: white;
    padding: 8px 10px;
    background: #ffffff38;
    border-radius: 4px;
}

.caseDate ul li:not(:last-child) {
    margin-right: 20px;
}

.caseDate h5 {
    color: wheat;
    display: inline-block;
    margin-bottom: 0;
}

.profileDiv {
    border-radius: 4px;
    margin-bottom: 20px;
    border: 1px solid #c5d6db;
}

.followUP {
    border: 1px solid wheat;
    color: wheat;
    padding: 4px 8px;
    border-radius: 4px;
    background: transparent;
    transition: all 0.5s ease-in-out;
    text-transform: capitalize;

}

.followUP:hover {
    background: wheat;
    color: black;
}

.profileDiv .my_form {
    padding: 14px;
    margin-top: 0;
}

.profileDiv h6 {
    margin-bottom: 0;
    padding: 8px;
    border-radius: 4px 4px 0 0;
    background-color: #acd0d93f;
    color: #3f91a5;
    font-weight: 400;
}

.btnUL {
    justify-content: start !important;
}

.btnUL li:not(:last-child) {
    margin-right: 16px;
}

.medicalInfoDiv {
    padding: 12px;
    border: 1px solid #007092;
}

.medicalInfoDiv ul.dateUL {
    display: flex;
    flex-wrap: wrap;
}

 .medicalInfoDiv ul.dateUL li a {
     padding: 4px 12px;
     background: #f4f0f0;
     color: black;
     border-radius: 4px;
     /* margin: 0 50px; */
     font-size: 13px;
     position: relative;
     margin-bottom: 6px;
 }
    .medicalInfoDiv ul.dateUL li a.active {
        /*    background: #323232;*/
        /*    color: white;*/
        border: 2px solid #006cff;
    }

.medicalInfoDiv ul.dateUL li:not(:last-child) {
    margin-right: 7px;
}

.dateWiseInfo li {
    margin-top: 6px;
    font-size: 14px;
}

.dateWiseInfo li i {
    font-size: 8px;
    margin-right: 4px;
    color: gray;
}

.visitHistory .modal-dialog {
    max-width: 1200px !important;
}
.visitHistory li i{
    font-size:16px;
}
.diseaseEntryModal .modal-dialog {
    max-width: 660px !important;
}

.questionDiv {
    padding: 16px;
    border: 1px solid #bed1d6;
    margin: 16px;
    border-radius: 6px;
}

.questionDiv label{
    font-size: 14px;
    color: #808080;
}

.questionOptionsUL{columns: 2;}
.score_nav .nav-item .nav-link{
    background: #fff0d3;
    color: #007092;
    margin-right: 10px;
    border: 2px solid #ffd891;
    transition: all 0.5s ease-in-out;
}
.score_nav .nav-item .nav-link.active{
    color: #fff0d3;
    background: #007092;
}
.score_nav .nav-item .nav-link:hover{
    color: #fff0d3;
    background: #007092;
}
.history_formUL{
    display: flex;
}
.history_formUL li .form-check-label{
    margin-right: 16px;
    font-size: 14px;
}
.pagerRow a,
.pagerRow span {
    margin: 0 4px;
    padding: 4px 8px;
    border: 1px solid #ccc;
    border-radius: 3px;
    text-decoration: none;
    color: #115c88;
    font-size: 14px;
}

.pagerRow .current {
    font-weight: bold;
    background-color: #115c88;
    color: white;
}

.pagerRow .disabled {
    color: #aaa;
    pointer-events: none;
    border-color: #eee;
}

.chosen-container{
    width:100% !important;
}
.chosen-container-multi .chosen-choices {
    padding: .375rem .75rem !important;
    background-image: none !important;
    border-radius: .25rem !important;
    border: 1px solid #ced4da !important;
}

.statisticsTopUL{
    display:flex;
    align-items: center;
    justify-content:space-between;
    margin-bottom: 0;
}

table tbody tr {
    background: white;
}

