.Pending {
    color: #FFBA5A;
}

.Rejected {
    color: #BA1C1C;
}

.Accepted,
.Posted {
    color: #019889;
}

.text-anchor {
    color: var(--color1) !important;
}

.dashboard-layout-wrapper {
    display: flex;
    width: 100%;
    background: #f8f9fb;
}

.authBodyWRp {
    width: 100%;
}

.left-sidebar-wrapper {
    width: 250px;
    max-width: 250px;
    box-shadow: 4px 4px 10px 0px #0000000D;
    border-radius: 0 20px 20px 0;
    min-height: 100vh;
    overflow: auto;
    background: #FAF9F5;
}

.sidebar-header {
    padding: 30px 20px;
    width: 100%;
}


.left-nav-menu {
    width: 100%;
    display: block;
}

.sideMenu {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding: 10px 20px;
    text-decoration: none;
    color: #000;
    font-size: 18px;
    background: transparent;
    border: none;
}

.sideMenu p {
    margin: 0;
    font-size: 18px;
    line-height: 20px;
    font-family: 'GilroyRegular';
}

span.sideIcon {
    font-size: 25px;
    line-height: 20px;
    margin-right: 10px;
}

.sideMenu:hover, .sideMenu.active {
    color: #fff !important;
    background: var(--color1) !important;
    border-radius: 0px 10px 10px 0;
}

.mainWapperBody {
    width: calc(100% - 250px);
    padding: 20px 30px;
    min-height: 100%;
}

.topHeaderBar {
    width: 100%;
}

.topHeaderBody {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

.topHeaderTitle {
    width: calc(100% - 56px);
}

.topHeaderTitle h1 {
    margin: 0;
    font-family: GilroyRegular;
    font-size: 32px;
    font-weight: 400;
    line-height: 38.4px;
    color: #313131;
}

.topHeaderTitle p {
    font-family: GilroyRegular;
    font-size: 14px;
    font-weight: 400;
    line-height: 16.8px;
    text-align: left;
    color: #B9B9B9;
    margin: 0;
}

.notificationBx {
    width: 56px;
    height: 56px;
    background: #DAF0F1;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: #019889;
    font-size: 30px;
    position: relative;
}

span.notificationAlrt {
    width: 8px;
    height: 8px;
    background: red;
    position: absolute;
    right: 33%;
    top: 35%;
    border-radius: 50%;
}

.cardBox {
    width: 100%;
    padding: 20px;
    border-radius: 15px;
    background: #fff;
}

.cardBoxHeader {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.cardBoxHeader h2 {
    font-family: GilroySemiBold;
    font-size: 24px;
    font-weight: 400;
    line-height: 31.94px;
    text-align: left;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;
    color: #313131;
    margin: 0;
}

.progressBody {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.progressCard {
    width: 20%;
    max-width: 120px;
}

.progressBarBx {
    position: relative;
    max-width: 120px;
    height: 120px;
    margin: 0 auto 20px;
}

.progressBarBx h3 {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    font-family: GilroySemiBold;
    font-size: 24px;
    font-weight: 400;
    line-height: 31.94px;
    color: #313131;
    margin: 0;
}

.progressContentBx {
    width: 100%;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 0 20px;
}

.progressContentBx h4 {
    margin: 0;
    font-family: GilroyRegular;
    font-size: 14px;
    font-weight: 400;
    line-height: 18.63px;
    text-align: center;
    color: #313131;
}

.cardBoxHeader a {
    font-family: GilroyMedium;
    font-size: 16px;
    font-weight: 400;
    line-height: 21.3px;
    text-align: left;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;
    color: #019889;
}

.cardBoxHeader button {
    font-family: GilroyMedium;
    font-size: 16px;
    font-weight: 400;
    line-height: 21.3px;
    text-align: left;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;
    color: #019889;
    background: transparent;
    border: none;
    padding: 0px;
}

.cardBoxHeader button:hover,
.cardBoxHeader button:focus {
    background: transparent !important;
    color: #019889 !important;
}

.searchBx {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 30px;
    border: 1px solid #E6E6E6;
    border-radius: 15px;
}

.searchBx input {
    width: 100%;
    border: none;
    color: #000;
}

button.serchBtn {
    padding: 0;
    background: none;
    border: none;
    color: #CACACA;
    font-size: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}

.chatContbx {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}

.chatContbx:last-child {
    margin: 0;
}

.userChatContentBx {
    width: calc(100% - 85px);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-left: 20px;
}

.userChatBx {
    width: 85px;
    height: 85px;
    border-radius: 50%;
    overflow: hidden;
}

.userContent {
    width: 100%;
}

.userContent h4 {
    margin: 0;
    font-family: GilroyExtraBold;
    font-size: 18px;
    font-weight: 400;
    line-height: 22.28px;
    text-align: left;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;
    color: #313131;
}

.userContent p {
    font-family: GilroyRegular;
    font-size: 12px;
    font-weight: 400;
    line-height: 14.4px;
    text-align: left;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;
    margin: 0;
    color: #898989;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    /* number of lines to show */
    line-clamp: 2;
    -webkit-box-orient: vertical;
}

.userTime {
    width: 100px;
    font-family: GilroyMedium;
    font-size: 12px;
    font-weight: 400;
    line-height: 14.56px;
    text-align: left;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;
    color: #898989;
}


.upcomingAppointmenT {
    width: 100%;
}

.upcomingAppointmenT ul.nav-tabs {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #019889;
    border-radius: 12px;
    overflow: hidden;
    flex-wrap: nowrap;
}

.upcomingAppointmenT ul li.nav-item {
    width: 100%;
    border-left: 1px solid #019889;
}

.upcomingAppointmenT ul li.nav-item:first-child {
    border-left: none;
}

.upcomingAppointmenT ul li.nav-item button {
    width: 100%;
    background: transparent;
    border: none;
    font-family: GilroyMedium;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    text-align: center;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;
    color: #019889;
    border-radius: 0;
    height: 48px;
}

.upcomingAppointmenT ul li.nav-item button.active {
    background: #019889;
    color: #fff;
}


.upcomingAppBody {
    width: 100%;
    display: block;
}

.upcominCardBx {
    width: 100%;
    border: 1px solid #E6E6E6;
    padding: 10px;
    border-radius: 10px;
    margin-bottom: 20px;
}

.upcardTopBx {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    width: 100%;
}

.appoinmentUserImg {
    width: 80px;
    height: 80px;
    border-radius: 10px;
    overflow: hidden;
}

.appinmentUserContent {
    width: calc(100% - 80px);
    padding: 0 20px;
    position: relative;
}

ul.aapinDateTime {
    margin: 0;
    padding: 0;
    width: 100%;
    display: block;
}

ul.aapinDateTime li {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: flex-start;
    font-size: 22px;
    color: #838383;
    margin-bottom: 5px;
}

ul.aapinDateTime li p {
    margin: 0 0 0 10px;
    font-family: GilroyMedium;
    font-size: 12px;
    font-weight: 400;
    line-height: 14.56px;
    text-align: center;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;
    color: #313131;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

ul.aapinDateTime li:last-child {
    margin: 0;
}

.upcardbttmBx {
    width: 100%;
    padding-top: 20px;
}

.upcardbttmBx h5 {
    font-family: 'GilroyRegular';
    font-size: 14px;
    font-weight: 500;
    line-height: 15px;
    text-align: left;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;
    color: #313131;
    margin-bottom: 5px;
}

.upcardbttmBx p {
    font-family: GilroyRegular;
    font-size: 14px;
    font-weight: 400;
    line-height: 15px;
    text-align: left;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;
    margin: 0;
    color: #B9B9B9;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    /* number of lines to show */
    line-clamp: 2;
    -webkit-box-orient: vertical;
}

.appinmentUserContent h4 {
    font-family: GilroySemiBold;
    font-size: 18px;
    font-weight: 400;
    line-height: 22.05px;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;
    color: #313131;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.upcominCardBx:last-child {
    margin: 0;
}

ul.aapinDateTime.d-flex.justify-content-space-between {
    flex-wrap: wrap;
}

.addPrescriptionsBx {
    display: block;
    text-align: center;
    width: 100%;
}

.addPrescriptionsBx a {
    font-family: GilroyMedium;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    text-align: center;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;
    color: #019889;
}

.prescriptionsBody {
    width: 100%;
    display: block;
}

.prescriptionsBody h4 {
    font-family: GilroyMedium;
    font-size: 16px;
    font-weight: 400;
    line-height: 22px;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;
    color: #838383;
    margin-bottom: 15px;
}

.prescriptionsBody h4 strong {
    color: #1B1B1B;
}

.tableDesing-01 {
    width: 100%;
    display: block;
    overflow: auto;
}

.table {
    margin: 0;
}

.tableDesing-01 .table th {
    border-top: 1px solid #313131;
    border-bottom: 1px solid #313131;
    font-family: GilroyMedium;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    color: #1B1B1B;
}

.tableDesing-01 .table td {
    font-family: GilroyMedium;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    color: #1B1B1B;
    border-bottom: 1px solid #e6e6e6;
}

.prescriptionsBtnBody {
    width: 100%;
}

.prescriptionsBtnBody a,
.prescriptionsBtnBody button {
    width: 250px;
    height: 50px;
    align-items: center;
    justify-content: center;
    display: flex;
}

.addMedicationNameBody {
    width: 100%;
    display: block;
    border: var(--bs-border-width) solid var(--bs-border-color);
    border-radius: 10px;
    overflow: hidden;
}

.addMedicationNameButtonBx {
    background: #FAF9F5;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px;
    border-top: var(--bs-border-width) solid var(--bs-border-color);
}

button.addBtn {
    background: transparent;
    border: none;
    color: #019889;
    font-family: GilroyMedium;
    font-size: 16px;
    font-weight: 400;
    line-height: 19.41px;
}

.addMedicationNameBody input.form-control {
    border: navajowhite;
}

.addPatientModlBdy {
    display: block;
    width: 100%;
}

.headerBx {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    margin-bottom: 20px;
}

.headerBx h2 {
    font-family: GilroySemiBold;
    font-size: 24px;
    font-weight: 400;
    margin: 0;
    color: #313131;
}

.modal-body {
    padding: 20px;
}

.addpatientListBody {
    width: 100%;
}

.addpatientListBody .upcominCardBx:last-child {
    margin-bottom: 0 !important;
}

.appinmentUserContent .btn-group-card {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    height: auto;
    gap: 6px;
    top: 0;
    bottom: 0;
}

.btn-group-card .btn {
    font-size: 13px;
    padding: 3px 10px;
    border-radius: 30px;
    width: 100%;
}

.calendar {
    font-family: Arial, sans-serif;
    text-align: center;
}

.calendar-navigation {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

.calendar-days {
    display: flex;
    overflow-x: auto;
    scroll-behavior: smooth;
    gap: 10px;
    padding: 10px 0;
    /* width: 100%; */
    width: calc(100% - 100px);
}

.calender-wrapper {
    width: calc(100% - 100px);
    white-space: nowrap;
}

.calendar-day {
    flex: 0 0 auto;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    border: 1px solid #F5F5F5;
    cursor: pointer;
    background: #F5F5F5;
    border-radius: 50%;
    color: #838383;
    font-family: 'GilroySemiBold';
}

.calendar-day.selected {
    background-color: #E8F3F1;
    color: var(--color1);
    border-color: var(--color1);
}

.nav-button {
    background-color: #007bff;
    color: white;
    border: none;
    padding: 10px;
    cursor: pointer;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.nav-button:hover {
    background-color: #0056b3;
}

/* Hide scrollbar for a cleaner look */
.calendar-days::-webkit-scrollbar {
    display: none;
}

.calendar-days {
    scrollbar-width: none;
    /* For Firefox */
}

.inputSrchBx {
    display: flex;
    border: 1px solid #E6E6E6;
    border-radius: 10px;
    overflow: hidden;
    height: 50px;
    position: relative;
}

.srchBtn {
    border: none;
    font-size: 27px;
    background: none;
    color: #ADADAD;
    padding: 5px;
    width: 50px;
}

.inputSrchBx input {
    border: none;
    width: calc(100% - 50px);
    font-size: 14px;
}

.authBodyWRp {
    width: 100%;
}


.patientChatBody {
    width: 100%;
    display: block;
    height: calc(100vh - 280px);
}

.patientChatContent {
    width: 100%;
    height: calc(100% - 90px);
    overflow: auto;
    padding: 10px 20px;
    min-height: 200px;
}
.chatInputBox .sendbtn {
    right: 4px;
    position: absolute;
    bottom: 4px;
}

.chatInputBox {
    position: relative;
}

.chatInputBox textarea {
    min-height: 100px;
    padding-right: 100px;
    font-size: 14px;
}

.chatMsgBody {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
}

.chatMsgBody.sendMsgBx {
    justify-content: flex-end;
    align-items: end;
}

.chatMsg {
    width: auto;
    max-width: max-content;
    border: 1px solid #E6E6E6;
    padding: 10px;
    margin-bottom: 5px;
}

.chatMsg p {
    margin: 0 0 0 0;
    font-family: GilroyRegular;
    font-size: 16px;
    font-weight: 400;
    line-height: 19.2px;
    color: #313131;
}

.chatmsWrsr {
    display: flex;
    flex-direction: column;
    align-items: end;
}

.chatTime {
    min-width: 200px;
}

.receiveMsgBx .chatmsWrsr {
    align-items: start;
}

.chatMsg span {
    background: #E8F3F1;
    width: 100px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 5px;
    color: #019889;
    font-family: GilroyMedium;
    font-size: 14px;
    font-weight: 400;
    line-height: 16.98px;
    margin-top: 10px;
}

.chatMsgBody.receiveMsgBx {
    justify-content: flex-start;
}

.chatMsgBody.sendMsgBx .chatMsg {
    border-radius: 10px 10px 0px 10px;
}

.chatMsgBody.receiveMsgBx .chatMsg {
    border-radius: 10px 10px 10px 0px;
    background: #019889;
}

.chatMsgBody.receiveMsgBx .chatMsg p {
    color: #fff;
}

.chatTime {
    display: inline-block;
    width: 100%;
    font-family: GilroyMedium;
    font-size: 12px;
    font-weight: 400;
    line-height: 14.56px;
    max-width: 80%;
    color: #838383;
}

.chatMsgBody.sendMsgBx .chatTime {
    text-align: right;
}

.patientWritMsgBx {
    width: 100%;
    display: flex;
    border: 1px solid #E6E6E6;
    height: 50px;
    border-radius: 5px;
    align-items: center;
    justify-content: space-between;
    padding: 5px 10px;
}

.patientWritMsgBx input.form-control {
    border: none;
}

.patientWritMsgBx button.btn.sendbtn {
    background: none;
    border: none;
    padding: 0;
    width: 40px;
    height: 100%;
    font-size: 30px;
    color: #019889;
    transform: rotate(-30deg);
    transform-origin: 30%;
}

.full-width {
    width: 100% !important;
    max-width: 100% !important;
}

.prescriptionPrintBx {
    width: 100%;
    display: block;
    padding: 20px;
    border: 1px solid #ccc;
    border-radius: 20px;
    min-height: calc(100vh - 350px);
}

.prescriptionsBody h2 {
    font-family: GilroySemiBold;
    font-size: 22px;
    font-weight: 400;
    line-height: 31.94px;
    color: #313131;
}

.medicationDay {
    width: 100%;
    display: block;
}

.medicationTimeTblBody {
    width: 100%;
    display: block;
}

.medicationTimeTblBody h3 {
    font-family: GilroyMedium;
    font-size: 16px;
    font-weight: 400;
    line-height: 19.41px;
    color: #1B1B1B;
}

.medicationTimeBx {
    width: 100%;
    border: 1px solid #E6E6E6;
    border-radius: 10px;
    padding: 10px;
}

.medicationTimeBx h4 {
    color: #313131;
    margin-bottom: 10px;
}

.medicationTime {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.medicationTime p {
    width: 100%;
    color: #838383;
    font-family: GilroyRegular;
    font-size: 14px;
    font-weight: 400;
    line-height: 16.8px;
    margin: 0;
}


.btn-refer,
.btn-refer p {
    color: #019889 !important;
}

.btn-refer p {
    cursor: pointer;
}

.patientsWapper ul.aapinDateTime li {
    width: 33%;
}

.requestBody {
    width: 100%;
    max-width: 300px;
    margin: auto;
    text-align: center;
}

.requestBody h2 {
    font-family: GilroySemiBold;
    font-size: 24px;
    font-weight: 400;
    line-height: 31.94px;
    text-align: center;
    color: #313131;
}

.btn-denger {
    border: 1px solid #BA1C1C;
    color: #BA1C1C;
}

.btn-denger:hover {
    border: 1px solid #BA1C1C;
    background: #BA1C1C;
    color: #fff;
}

.requestBody p {
    font-family: GilroyMedium;
    font-size: 16px;
    font-weight: 400;
    line-height: 20px;
    text-align: center;
    color: #838383;
}

.requestBody p strong {
    color: #1B1B1B;
    display: block;
}

h5.referredStatus {
    position: absolute;
    right: 0;
    bottom: 0;
    font-family: GilroySemiBold;
    font-size: 14px;
    font-weight: 400;
    line-height: 17.15px;
}

.invitesMailBoxBody {
    width: 100%;
    display: block;
}

.invitesMailContentBx {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    padding: 20px;
}

.invitIconBox {
    width: 150px;
    height: 150px;
    padding: 40px;
    border-radius: 12px;
    border: 1px solid #E6E6E6;
    display: flex;
    align-items: center;
    justify-content: center;
}

.invitesMailContentBx p {
    font-family: GilroyMedium;
    font-size: 16px;
    font-weight: 400;
    line-height: 19.41px;
    text-align: center;
    margin: 0;
    color: #313131;
}

.invitesMailShareBx {
    width: 100%;
}

.invitesMailShareBx input.form-control {
    height: 45px;
    border-radius: 12px;
}

button.btn svg {
    margin-right: 10px;
}

.table-theme-01 {
    width: 100%;
    border-radius: 10px;
    box-sizing: border-box;
}

.table-theme-01 thead tr th {
    background: #019889;
    font-family: GilroyMedium;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    text-align: center;
    color: #fff;
    height: 50px;
    vertical-align: middle;
    white-space: nowrap;
}

.table-theme-01 tbody tr td {
    vertical-align: middle;
    border: 1px solid #E6E6E6;
    font-family: GilroyMedium;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    color: #313131;
    text-align: center;
    height: 50px;
    white-space: nowrap;
}

.table-theme-01 tbody tr td button.btn.btn-anchor {
    background: transparent;
    padding: 0;
    color: #019889;
    font-family: GilroySemiBold;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    text-align: center;
}

.table-theme-01 thead tr th:first-child {
    border-radius: 12px 0 0 0;
}

.table-theme-01 thead tr th:last-child {
    border-radius: 0 12px 0 0;
}

.articleBx {
    width: 100%;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
}

.articleImg {
    width: 80px;
    height: 80px;
    border-radius: 10px;
    overflow: hidden;
    display: flex;
}

.articleContentBx {
    width: calc(100% - 80px);
    padding-left: 10px;
    display: block;
    position: relative;
}

.articleContentBx h4 {
    font-family: GilroySemiBold;
    font-size: 14px;
    font-weight: 400;
    line-height: 17.15px;
    text-align: left;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    color: #313131;
}

.articleTag {
    width: 100%;
    font-family: GilroySemiBold;
    font-size: 12px;
    font-weight: 400;
    line-height: 14.7px;
    text-align: left;
    color: #019889;
    margin-bottom: 10px;
    display: block;
}

.articleContentBx p {
    margin: 0;
    font-family: GilroyMedium;
    font-size: 12px;
    font-weight: 400;
    line-height: 14.56px;
    text-align: left;
    color: #313131;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

span.filtterIcon {
    position: absolute;
    right: 0;
    width: 50px;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
}

.articleViewBody {
    width: 100%;
    display: block;
}

.articleViewImg {
    width: 100%;
    border-radius: 15px;
    overflow: hidden;
    object-fit: cover;
}

.articleViewImg img {
    width: 100%;
}

.articleContent {
    display: block;
    padding: 20px 0;
    width: 100%;
}

.articleContent h2 {
    font-family: GilroySemiBold;
    font-size: 18px;
    font-weight: 400;
    line-height: 22.05px;
    text-align: left;
}

.articleContent ul {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: flex-start;
    margin: 0 0 10px 0;
    padding: 0;
}

.articleContent ul li {
    list-style: none;
    margin-right: 20px;
    font-family: GilroyMedium;
    font-size: 16px;
    font-weight: 400;
    line-height: 19.41px;
    text-align: left;
    color: #838383;
}

.articleContent p {
    font-family: GilroyMedium;
    font-size: 16px;
    font-weight: 400;
    line-height: 25px;
    color: #838383;
    text-align: left;
}

.articleContent p:last-child {
    margin: 0;
}

.articleCommetList {
    width: 100%;
    display: block;
    padding: 20px 0;
    border-top: 1px solid #E8F3F1;
}

.articleCommentTitle {
    width: 100%;
    display: block;
    font-family: GilroySemiBold;
    font-size: 16px;
    font-weight: 400;
    line-height: 20px;
    text-align: left;
    color: #019889;
    margin-bottom: 20px;
}

.aritcleCommentListBody {
    width: 100%;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
}

.aritcleUseImg {
    width: 50px;
    height: 50px;
    display: flex;
    border-radius: 50%;
    overflow: hidden;
}

.aritcleCommentContent {
    width: calc(100% - 50px);
    padding-left: 20px;
    padding-top: 10px;
    position: relative;
}

.aritcleCommentContent h4 {
    font-family: GilroyMedium;
    font-size: 16px;
    font-weight: 400;
    line-height: 19.41px;
    text-align: left;
    color: #313131;
}

.aritcleCommentContent p {
    font-family: GilroyRegular;
    font-size: 16px;
    font-weight: 400;
    line-height: 19.2px;
    text-align: left;
}

span.commentTime {
    position: absolute;
    right: 0;
    font-family: GilroyMedium;
    font-size: 13px;
    font-weight: 400;
    line-height: 15.77px;
    text-align: left;
    color: #838383;
    bottom: 0;
}

.replyComment {
    font-family: GilroySemiBold;
    font-size: 16px;
    font-weight: 400;
    line-height: 19.6px;
    text-align: left;
    color: #019889;
}

.replyComment svg {
    margin-right: 5px;
}

.patientWritMsgBx button.btn.sendbtn svg {
    margin: 0;
}

.communityImgBx {
    width: 100%;
    height: 450px;
    border: 1px solid #E6E6E6;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.communityImgBx label {
    position: absolute;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.communityImgBx label input {
    position: absolute;
    width: 100%;
    height: 100%;
    display: flex;
    z-index: 1;
    opacity: 0;
}

.communityImgBx label span {
    font-family: GilroySemiBold;
    font-size: 16px;
    font-weight: 400;
    line-height: 20px;
    text-align: center;
    color: #019889;
    width: 150px;
}

.communityImg {
    width: 100%;
    display: flex;
    height: 100%;
    object-fit: cover;
    overflow: hidden;
    border-radius: 10px;
}

img.commuImg {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.CommunityCommetBody {
    display: flex;
    align-items: flex-start;
    width: 100%;
    justify-content: space-between;
    padding: 20px 0;
}

.chatImg {
    width: 100%;
    max-width: 300px;
    height: auto;
    border-radius: 10px;
    overflow: hidden;
}

ul.communityReplyComtLts {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin: 0;
    padding: 0;
}

ul.communityReplyComtLts li {
    list-style: none;
    margin-right: 10px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    font-family: GilroySemiBold;
    font-size: 16px;
    font-weight: 400;
    line-height: 16.6px;
    text-align: left;
    color: #019889;
}

ul.communityReplyComtLts li span {
    margin-right: 5px;
}

.form-group p {
    font-family: GilroyRegular;
    font-size: 14px;
    font-weight: 400;
    line-height: 16.8px;
    text-align: left;
    color: #838383;
    margin: 0;
}

.btn-more,
.btn-more:hover {
    background: transparent;
    padding: 0;
    color: #019889;
    border: none;
}

.appinmentUserCrdBtns {
    position: absolute;
    right: 0;
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
    flex-direction: column;
    gap: 5px;
    width: auto;
    top: 14px;
}

.appinmentUserCrdBtns .btn-anchor {
    background: transparent;
    border: none;
    padding: 0;
    font-size: 13px;
    line-height: 25px;
    padding: 0 10px;
    width: 100%;

    border-radius: 4px;
}

.deflat-flex {
    flex-direction: row;
}

.deflat-flex button {
    margin-left: 15px;
}

.mr-1 {
    margin-right: 10px;
}

.popupContent {
    width: 100%;
    display: block;
    text-align: center;
}

.popupContent p {
    text-align: center;
    margin: 0;
    color: #1B1B1B;
    font-family: GilroyMedium;
    font-size: 15px;
    font-weight: 400;
    line-height: 19.41px;
}

.iconBx {
    text-align: center;
    display: block;
    width: 100%;
}

.genderBox svg {
    margin-bottom: 10px;
    font-size: 30px;
    color: #838383;
}

.genderBoxWrp input:checked~.genderBox svg {
    color: #fff;
}



.switchBtn {
    position: relative;
    width: 40px;
    height: 20px;
    display: inline-block;
    background: #B9B9B9;
    border-radius: 30px;
    cursor: pointer;
    transition: all 0.3s;
    -moz-transition: all 0.3s;
    -webkit-transition: all 0.3s;
}


.switchBtn:after {
    content: "";
    position: absolute;
    left: 2px;
    top: 2px;
    width: 16px;
    height: 16px;
    background: #FFF;
    border-radius: 50%;
    box-shadow: none;
}

input:checked+.switchBtn {
    background: #019889;
}

input:checked+.switchBtn:after {
    left: auto;
    right: 2px;
}

span.switchBx input {
    display: none;
}


.consultBx {
    display: block;
    width: 100%;
}

.consultBxHeader {
    width: 100%;
    display: flex;
}

.consultBxHeader h3 {
    width: auto;
    display: inline;
    font-family: GilroySemiBold;
    font-size: 18px;
    font-weight: 400;
    line-height: 22.05px;
    color: #313131;
}

.consultBxBody {
    width: 100%;
    display: block;
}

.consultBxBody label {
    font-family: GilroyMedium;
    font-size: 16px;
    font-weight: 400;
    line-height: 19.41px;
    color: #1B1B1B;
}

.consultBxBody input {
    height: 50px;
}

.consultBxHeader a {
    font-family: GilroyMedium;
    font-size: 16px;
    font-weight: 400;
    line-height: 21.3px;
    color: #019889;
}

.form-group-btnBx {
    display: flex;
    align-items: center;
    height: 100%;
    justify-content: flex-start;
}

.form-group-btnBx button.btn {
    background: transparent;
    width: auto;
    height: auto;
    padding: 0;
}


ul.consult-tabs {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
    margin: 0;
    padding: 0;
}

ul.consult-tabs li {
    list-style: none;
}

ul.consult-tabs li:first-child {
    margin: 0;
}

.react-datepicker-wrapper {
    display: block !important;
}

button.sideMenu.btn {
    width: 100%;
    background: transparent;
}


.terms-page h2,
.privacy-page h2 {
    font-family: GilroySemiBold;
    color: #16a085;
    font-size: 20px;
    margin-top: 20px;
}
.terms-page h3,
.privacy-page h3 {
    font-family: GilroySemiBold;
    color: #303030;
    font-size: 17px;
    margin-top: 20px;
}

.mainSitWapperBody {
    width: 100%;
}

.mobileHeader {
    width: 100%;
    background: #FAF9F5;
    box-shadow: 0px 0px 10px #00000045;
    position: sticky;
    top: 0;
    z-index: 1;
    display: none;
}

.mobileHeaderWrapper {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 0;
}

.mobileHeaderLeft {
    width: 40px;
}

.mobileHeaderIcon {
    width: auto;
}

.mobileHeaderIcon svg {
    width: 30px;
    color: #666;
}

button.btn.toggleMenu {
    border: none;
    background: none;
    padding: 0;
    margin: 0;
}

.mainWapperBgBody {
    display: none;
}

li.btn-refer {
    width: 100% !important;
}

.cardBoxHeader button svg {
    margin-right: 0;
}

.consultBxSlots {
    width: 100%;
    display: block;
}

.calendar-day.disabled {
    cursor: not-allowed;
    opacity: 0.5;
}

.upcomingAppointmentBody {
    min-height: calc(100vh - 250px);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.upcomHead h3 {
    font-family: GilroyMedium;
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    margin-bottom: 20px;
}

.upcomHead h5 {
    color: #838383;
    font-family: GilroyMedium;
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    margin-bottom: 20px;
}

.upcomHead {
    margin-bottom: 50px;
}

.notesUpdcom {
    color: #838383;
    padding: 20px;
    border: 1px solid #E8F3F1;
    border-radius: 8px;
    margin-bottom: 20px;
}

.slotBox {
    border: 1px solid #E6E6E6;
    padding: 10px;
    border-radius: 12px;
    text-align: center;
}

.slotBox.disabled {
    opacity: 0.5;
}

.seenStatus.doubleTick {
    color: var(--color1);
}

.communitChatListBody {
    min-height: 200px;
    overflow: auto;
    height: calc(100vh - 210px);
}

.uploadImgBtn {
    position: relative;
    overflow: hidden;
    margin: 0;
    margin-right: 10px;
    margin-left: 10px;
}

.uploadImgBtn input {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    opacity: 0;
}
.deleteImg {
    position: absolute;
    right: 0;
    top: 0;
    background: #fff;
    border-radius: 5px;
    cursor: pointer;
}
.uploadImgBtn img.privew {
    width: 42px;
    border-radius: 3px;
}
.uploadImgBtn img.privew {
    border: 1px solid #e1e1e1;
    padding: 2px;
}
.commentsComntyWrp {
    padding-top: 15px;
}

button#dropdown-basic {}

.flagDropdown .dropdown-toggle {
    background: transparent;
    padding: 0;
    height: auto;
    border: 0;
    line-height: normal;
}

.flagDropdown .dropdown-toggle:after {
    content: none;
}

.flagDropdown .dropdown-menu {
    border: 0;
    box-shadow: 0px 4px 4px 0px #00000040;
    border-radius: 10px;
}

.flagDropdown .dropdown-menu a {
    border-bottom: 1px solid #E8F3F1;
    padding: 7px 25px;
    text-align: center;
    font-size: 12px;
    color: #313131;
}

.flagDropdown .dropdown-menu a:nth-last-child(1) {
    border-bottom: 0;
}
.flagDropdown .dropdown-menu a:active {
    background: #e2fffc;
}
.appinmentUserCrdBtns .btn-anchor.Accepted {
    background: var(--color1);
    color: #fff;
}
.appinmentUserCrdBtns .btn-anchor.Accepted:hover {
    background: var(--color1);
    color: #fff;
}
.appinmentUserCrdBtns .btn-anchor.Rejected {
    background: #BA1C1C;
    color: #fff;
}
.appinmentUserCrdBtns .btn-anchor.Rejected:hover {
    background: #BA1C1C;
    color: #fff;
}