.left-navigation ul li.active a {
    background-color: #1D5558;
    color: #fff !important;
}
.invent-tabs > li.active > a,
.invent-tabs > li:hover > a {
    background-color: #2bbb94 !important;
    color: #fff;
}
.invent-tabs > li > a {
    border: 1px solid #2bbb94;
    color: #2bbb94;
}
.h100 {
    height: 100px !important;
}
.tableAccordion > thead > tr > th {
    background-color: #1D5558;
}
.btn-new {
    background-color: #2bbb94 !important;
    color: #fff !important;
}
.appointment-vsts-list {
    margin: 0;
    display: block;
    border: 1px solid #d2d2d2;
}
    .appointment-vsts-list > li {
        list-style: none;
        background-color: #fff;
        border-bottom: 1px solid #d2d2d2;
        padding: 6px;
        display: flex;
        align-items: center;
        position: relative;
        cursor: pointer;
    }
        .appointment-vsts-list > li > div > p {
            font-size: 12px;
            font-weight: 500;
            font-stretch: normal;
            font-style: normal;
            line-height: normal;
            letter-spacing: normal;
            text-align: left;
            color: #7c7c7c;
            margin-top: 4px;
            margin-bottom: 0;
        }
.text-068cb0 {
    color: #068cb0 !important;
}
.referral-summary-list {
    display: flex;
    align-items: flex-start;
    grid-gap: 4px 14px;
    margin: 0;
    flex-flow: wrap;
}
    .referral-summary-list > li {
        display: flex;
        grid-gap: 4px 6px;
        align-items: center;
        position: relative;
        flex-flow: wrap;
    }
.text-07a0d4 {
    color: #07a0d4 !important;
}
.date-bg-visits {
    padding: 0px 5px;
    border-radius: 4px;
    background-color: #34b698;
    font-size: 11px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 2;
    letter-spacing: normal;
    text-align: left;
    color: #fff;
}
.referral-table {
    width: 100%;
    background-color: #f9f9f9 !important;
    border: 1px solid #d2d2d2;
}
    .referral-table > tbody > tr > td,
    .referral-table > tbody > tr > th,
    .referral-table > thead > tr > td {
        padding: 2px 6px;
        vertical-align: top;
        text-align: center;
        border: 1px solid #d2d2d2 !important;
        background-color: #fff !important;
    }
    .referral-table > thead > tr > th {
        padding: 2px 6px;
        vertical-align: top;
        text-align: center;
        font-size: 10px;
        border: 1px solid #d2d2d2 !important;
        background-color: #f6f6f6 !important;
    }
    .referral-table > tbody > tr > td > label,
    .referral-table > tbody > tr > td > ul > li > label,
    .referral-summary-list > li > label,
    .referral-table > tbody > tr > td > article > label,
    .referral-table > tbody > tr > td > p > b {
        font-size: 11px;
        font-weight: 600;
        font-stretch: normal;
        font-style: normal;
        line-height: 22px;
        letter-spacing: normal;
        text-align: left;
        color: #000;
        margin: 0;
    }
    .referral-table > tbody > tr > td > span,
    .referral-summary-list > li > span {
        color: #767676;
        font-weight: normal;
        font-size: 10px;
    }
.full-popup {
    z-index: 20000 !important;
    overflow: hidden
}
    .full-popup > .modal-dialog {
        width: 100% !important;
        height: 100% !important;
        border: none !important;
        margin: 0px !important;
        border-radius: 0 !important;
    }
.frequesntly-heading {
    background-image: linear-gradient(to bottom, #008b86, #1d5558);
    padding: 30px 40px;
    position: relative;
}
    .frequesntly-heading > button {
        color: #fff;
        font-size: 26px;
        position: absolute;
        right: 20px;
        top: 10px;
        background-color: transparent;
        border: none;
    }
    .frequesntly-heading > h1 {
        color: #fff;
        font-size: 26px;
        margin-bottom: 10px;
    }
.frequesntly-form {
    display: flex;
    align-items: center;
    grid-gap: 8px;
}
    .frequesntly-form > input {
        background-color: #fff;
        border-radius: 6px;
        border: 1px solid #d2d2d2;
        padding: 10px 6px;
        text-indent: 26px;
        font-size: 20px;
        width: 100%;
    }

    .frequesntly-form > button {
        background-color: #5db428;
        border-radius: 6px;
        border: 1px solid #5db428;
        padding: 10px 6px;
        font-size: 20px;
        width: 150px;
        color: #fff;
    }
.frequesntly-ulli {
    margin: 0;
}
    .frequesntly-ulli > li {
        list-style-type: none;
        padding: 6px 15px;
        border-bottom: 1px solid #d2d2d2;
        display: block;
        border-radius: 6px;
    }
        .frequesntly-ulli > li:last-child > a {
            border: none;
        }
        .frequesntly-ulli > li > a {
            display: block;
            font-size: 12px;
            color: #131313;
            text-align: left;
            text-transform: capitalize;
            border-radius: 6px;
        }
        .frequesntly-ulli > li.active {
            background-image: linear-gradient(to bottom, #008b86, #1d5558);
            color: #fff;
        }
            .frequesntly-ulli > li.active > a {
                color: #fff;
            }
.timeslotsappt {
    display: flex;
    grid-gap: 8px;
    align-items: center;
    flex-flow: wrap;
}
    .timeslotsappt > li {
        list-style: none;
        width: calc(100% * (1/10) - 0px - 10px);
        text-align: center;
    }
        .timeslotsappt > li > a {
            padding: 3px 3px;
            border-radius: 6px;
            border: solid 0.5px rgba(144, 144, 144, 0.6);
            background: linear-gradient(to bottom, #eee 0%, #ebeaea 100%);
            color: #313131;
            display: block;
        }
        .timeslotsappt > li.active > a {
            background: #068cb0 !important;
            color: #fff;
        }
.crm-timeslots > thead > tr > th {
    background: #d2d2d2 !important;
    padding: 10px;
}
    .crm-timeslots > thead > tr > th.active {
        background: linear-gradient(to bottom, #81e8e5, #437b7e) !important;
        padding: 10px;
        color: #fff !important;
    }
    .crm-timeslots > thead > tr > th > a {
        position: absolute;
        width: 30px;
        height: 30px;
        text-align: center;
        line-height: 30px;
        color: #1d5558;
        top: 2px;
        border-radius: 50%;
        border: 2px solid #1d5558;
    }
.eh-controls {
    margin: 0;
    display: flex;
    align-items: center;
}
    .eh-controls > li {
        display: flex;
        align-items: center;
        list-style: none;
        margin: 0 3px;
    }
        .eh-controls > li > a {
            display: inline-flex;
            font-size: 11px;
            font-weight: 500;
            font-stretch: normal;
            font-style: normal;
            line-height: normal;
            letter-spacing: normal;
            text-align: left;
            color: #068cb0;
            margin: 0 5px;
        }
.eh-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #d2d2d2;
    background-color: #f5faf9;
    border-radius: 5px 5px 0 0;
    padding: 4px;
    width: 100%;
}
.eh-panel {
    border-radius: 4px;
    border: solid 0.5px #d2d2d2;
    background-color: #fff;
    margin-bottom: 8px;
}
.eh-header > h1 {
    font-size: 15px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.22;
    letter-spacing: normal;
    text-align: left;
    color: #373737;
    margin: 0;
    position: relative;
    padding-left: 3px;
}
.appointment-vsts-list {
    margin: 0;
    display: flex;
    border: 1px solid #d2d2d2;
}
    .appointment-vsts-list > li {
        list-style: none;
        background-color: #fff;
        border-bottom: 1px solid #d2d2d2;
        padding: 6px;
        display: flex;
        align-items: center;
        position: relative;
        cursor: pointer;
    }
        .appointment-vsts-list > li.active {
            background-color: #e3f8ff;
        }
.upcmng-appt-scroll {
    height: 170px;
    overflow-y: scroll;
    overflow-x: hidden;
}
.appointment-vsts-list > li > div > p {
    font-size: 11px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #7c7c7c;
    margin-top: 4px;
    margin-bottom: 0;
}
.time-bg-billing {
    background-color: #dff0d8 !important;
    border-radius: 20px !important;
    color: #39821a !important;
    padding: 0px 10px !important;
    font-size: 12px !important;
    font-weight: 600;
}
.time-bg-visits,
.time-bg-billing {
    padding: 0px 5px;
    border-radius: 4px;
    background-color: #f6981c;
    font-size: 11px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 2;
    letter-spacing: normal;
    text-align: left;
    color: #fff;
}
.tableprofile-details > tbody > tr > td {
    padding: 0px 10px !important;
}
.h-scroll {
    overflow-y: scroll;
    overflow-x: hidden;
}
.bg-e4eaec {
    background-color: #e4eaec !important;
}
.ehr-tabs > ul {
    margin: 0;
    display: flex;
    align-items: center;
}
    .ehr-tabs > ul > li.active > a {
        background-image: linear-gradient(to bottom, #07a0d4 0%, #068cb0 100%);
        color: #fff;
    }
    .ehr-tabs > ul > li > a {
        display: block;
        font-size: 11px;
        font-weight: 500;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.13;
        letter-spacing: normal;
        text-align: left;
        color: #313131;
        background-image: linear-gradient(to bottom, #f6f6f6, #e5e5e5);
        padding: 8px 20px;
    }
.crmworkflow > div:hover,
.crmworkflow > div:active {
    background-color: #dcf6f0;
}
.time-loader {
    border: 3px solid rgb(221,44,0);
    width: 70px;
    height: 35px;
    border-radius: 30px;
    text-align: center;
    display: block;
    line-height: 2;
    font-weight: 600;
    font-size: 12px;
    position: absolute;
    right: 5px;
    margin-top: 5px;
    z-index: 99;
    background-color: #fff;
    color: rgb(221,44,0);
}
.table-tally {
    margin: 0;
    table-layout: auto;
    border: 1px solid #d2d2d2;
    border-spacing: initial !important;
}
    .table-tally > thead > tr > th {
        background-color: #ececec;
        color: #000000;
        padding: 6px !important;
        border: 1px solid #f2f2f2;
        font-size: 12px !important;
        font-weight: 600;
        font-stretch: normal;
        font-style: normal;
        line-height: normal;
        letter-spacing: normal;
        text-align: left;
        color: #000;
        word-break: break-all;
    }
    .table-tally > tbody > tr > td {
        border: 1px solid #f2f2f2;
        font-size: 12px !important;
        font-weight: 500;
        font-stretch: normal;
        font-style: normal;
        line-height: normal;
        letter-spacing: normal;
        text-align: left;
        color: #313131;
        padding: 6px;
        word-break:break-word;
    }
        .table-tally > tbody > tr > td.table-tally-sub {
            background-color: #fffeee;
            padding: 6px;
        }
            .table-tally > tbody > tr > td.table-tally-sub > label {
                font-size: 12px;
                font-weight: 500;
                font-stretch: normal;
                font-style: normal;
                line-height: normal;
                letter-spacing: normal;
                text-align: left;
                color: #817b20;
            }
            .table-tally > tbody > tr > td.table-tally-sub > p {
                font-size: 11px;
                font-weight: normal;
                font-stretch: normal;
                font-style: normal;
                line-height: normal;
                letter-spacing: normal;
                text-align: left;
                color: #313131;
                margin: 0;
            }
.g-gap-2 {
    grid-gap: 2px !important;
}
.g-gap-5 {
    grid-gap: 5px !important;
}
.counsler-dropdown > li {
    padding: 5px 10px;
    border-bottom: 1px solid #eee;
    cursor: pointer;
    text-transform: none !important;
}
.fileupload-popover {
    margin: 0;
    padding: 0;
}
    .fileupload-popover > .popover-inner > .popover-content {
        word-break: break-all;
        display: block;
        white-space: pre-wrap
    }
.two-sections {
    display: flex;
    grid-gap: 4px;
}
    .two-sections > div,
    .two-sections > li {
        width: calc(100% * (1/2) - 2px - 0px);
    }
.input-box-error {
    position: absolute;
    font-size: 10px;
   /* bottom: -15px;*/
    bottom: -10px;
    color: #f21919 !important;
    font-weight: 700;
}
.autofill-design {
    display: flex;
    grid-gap: 5px;
    align-items: center;
}
.autofill-items {
    margin: 0;
    display: flex;
    align-items: center;
    flex-flow: wrap;
    grid-gap: 4px;
}
    .autofill-items > li {
        list-style: none;
    }
        .autofill-items > li > a {
            display: block;
            width: 100%;
            padding: 4px 2px;
            text-align: center;
            border: 1px solid #cecece;
            font-family: 'Plus Jakarta Sans', sans-serif !important;
            font-weight: 500;
            color: #000;
            border-radius: 5px;
            min-width: 60px;
            max-width: fit-content;
            background-color: #fff;
        }
        .autofill-items > li:hover > a,
        .autofill-items > li.active > a {
            background-color: #15898f;
            color: #fff;
        }
.Investigation-Result > thead > tr > td > ul,
.Investigation-Result-body > tbody > tr > td > ul {
    background-color: #f6f6f6;
    padding: 5px;
    border-radius: 10px;
}
    .Investigation-Result > thead > tr > td > ul li > label,
    .Investigation-Result-body > tbody > tr > td > ul li > label {
        font-weight: 700;
        font-size: 16px !important;
    }
    .Investigation-Result > thead > tr > td > ul > li > span,
    .Investigation-Result-body > tbody > tr > td > ul > li > span {
        font-weight: 500;
        font-size: 14px !important;
        color: #000 !important;
    }
    .Investigation-Result > thead > tr > td > ul > li::after {
        content: "";
        position: absolute;
        right: 0;
        top: 0;
        bottom: 0;
        background-color: #909090;
        width: 1px;
        margin: 2px -5px;
    }
    .Investigation-Result > thead > tr > td > ul > li:last-child::after {
        content: "";
        position: absolute;
        right: -5px;
        top: 0;
        bottom: 0;
        background-color: #f2f2f2;
        width: 1px;
        margin: 4px 0;
    }
.Investigation-Result-body > tbody > tr > td::after,
.Investigation-Result-body > li::after {
    content: "";
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    background-color: #efefef;
    width: 1px;
    margin: 4px 0px;
}
.Investigation-Result-body > li::after {
    background-color: #000 !important;
    margin: 4px -5px !important;
    width: 2px !important;
}
.Investigation-Result-body > li:last-child::after {
    background-color: #fff !important;
    width: 2px !important;
    margin: 4px -5px !important;
}
.Investigation-Result-body > tbody > tr > td:last-child::after,
.Investigation-Result-body > li:last-child::after {
    content: "";
    position: absolute;
    right: -5px;
    top: 0;
    bottom: 0;
    background-color: #fff;
    width: 1px;
    margin: 4px 0;
}
.Investigation-Result-body > tbody > tr > td > p {
    color: #767676;
}
.Investigation-Result-right {
    background-color: #f6f6f6;
    padding: 6px;
    border-radius: 6px;
}
    .Investigation-Result-right > ul > li > label,
    .Investigation-Result-right > ul > li > span {
        font-size: 14px !important;
        color: #000;
    }
.Investigation-Result-body > li > label,
.Investigation-Result-body > li > span {
    font-size: 12px !important;
    color: #000 !important;
}
.Investigation-Result-img > i {
    color: #5cb85c !important;
    border: 1px solid #5cb85c;
    padding: 5px 20px;
    border-radius: 10px;
}
.counsoller-scrollspy {
    margin: 0;
    display: flex;
    align-items: center;
}
    .counsoller-scrollspy > li {
        list-style: none;
        flex: 1;
        background-color: #fff;
        padding: 4px 6px;
        border-right: 1px solid #e7e7e7;
    }
        .counsoller-scrollspy > li > a {
            font-size: 12px;
            color: #373737;
            font-weight: 500;
            line-height: normal;
            display: block;
            width: 100%;
            text-align: center;
        }
.display-flow-list {
    display: flex;
    align-items: center;
    margin: 0;
    grid-gap: 4px 5px;
    flex-flow: wrap;
}
    .display-flow-list > li {
        list-style: none;
        display: flex;
        align-items: center;
        grid-gap: 6px;
    }
        .display-flow-list > li > span {
            font-weight: 500;
            font-size: 12px;
            line-height: normal;
            color: #767676;
        }
        .display-flow-list > li > label {
            font-weight: 600;
            font-size: 12px;
            line-height: normal;
            color: #000;
        }
/*----------------------------------------------------Quick Consultation*/
.adjustable-position {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    margin: auto;
    overflow-x: hidden;
    overflow-y: auto;
}
.main-summary-heading {
    background: #FFF;
    box-shadow: 0px 3px 10px 2px rgba(163, 163, 163, 0.25);
    width: 100%;
    padding: 6px;
}
    .main-summary-heading > ul {
        margin: 0;
        display: flex;
        align-items: center;
        grid-gap: 4px 8px;
        justify-content: end;
    }
        .main-summary-heading > ul > li {
            list-style: none;
        }
            .main-summary-heading > ul > li > button {
                border-radius: 4px;
                background: #1D5558;
                color: #FFF;
                font-size: 11px;
                font-style: normal;
                font-weight: 600;
                line-height: normal;
                padding: 4px 12px;
                border: none;
            }
.summary-appt-details {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 5px;
    background: #E4F5F6;
    padding: 3px 6px;
    margin: 0;
}
    .summary-appt-details > label {
        color: #1D5558;
        font-size: 12px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
    }
    .summary-appt-details > ul {
        display: flex;
        align-items: center;
        justify-content: space-between;
        grid-gap: 2px 8px;
        margin: 0;
        border-radius: 6px;
    }
        .summary-appt-details > ul > li {
            list-style: none;
            grid-gap: 0px 6px;
            display: flex;
            align-items: center;
            color: #0E0E0E;
            font-size: 11px;
            font-style: normal;
            font-weight: 500;
            line-height: normal;
        }
.summary-main {
    border-radius: 6px;
    border: 1px solid #ddd;
    background: #FFF;
    display: block;
    margin-bottom: 5px;
    overflow: hidden;
}
.summary-main-header {
    display: block;
    padding: 0px 10px;
    background: #fff;
    padding: 5px;
}
    .summary-main-header > h1 {
        color: #0E0E0E;
        font-size: 14px;
        font-style: normal;
        font-weight: 600;
        line-height: normal;
        margin: 0;
    }
.summary-main-body {
    display: block;
    padding: 3px;
}
.summary-border {
    border: 1px solid #ddd;
    margin-bottom: 8px;
    border-radius: 8px;
    overflow: hidden;
}
.summary-main-table {
    width: 100%;
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0 1px;
    table-layout: fixed;
    background: #fff;
}
    .summary-main-table > tbody > tr > td:first-child {
        border-right: 1px solid #d2d2d2;
        vertical-align: middle;
    }
    .summary-main-table > tbody > tr > td {
        padding: 6px 8px;
    }
        .summary-main-table > tbody > tr > td > label {
            color: #0E0E0E;
            font-size: 12px;
            font-style: normal;
            font-weight: 600;
            line-height: normal;
        }
        .summary-main-table > tbody > tr > td:last-child,
        .summary-main-table > tbody > tr > td:last-child.ng-hide {
            border-right: none !important;
        }
    .summary-main-table > tbody > tr > th {
        background: #f2f2f2;
        color: #000;
        font-size: 12px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
        padding: 8px 10px;
        width: 150px;
        word-break: break-word;
    }
    .summary-main-table > tbody > tr > td {
        padding: 5px 10px;
        vertical-align: top;
        font-size: 11px;
    }
        .summary-main-table > tbody > tr > td > h2 {
            color: #4A4A4A;
            font-size: 14px;
            font-style: normal;
            font-weight: 600;
            line-height: normal;
            margin: 0;
        }
        .summary-main-table > tbody > tr > td > a,
        .eh-controls > li > a {
            border-radius: 5px;
            border: 0.8px solid #1D5558;
            padding: 4px 10px;
            width: 17px;
            height: 17px;
            display: flex;
            justify-content: center;
            align-items: center;
            text-align: center;
            color: #1D5558;
            font-size: 12px
        }
        .summary-main-table > tbody > tr > td > .summary-item-list:last-child {
            margin-bottom: 0;
        }
.summary-item-list {
    display: flex;
    justify-content: flex-start;
    flex-direction: column;
    grid-gap: 3px 0;
    margin-bottom: 10px;
}
.summary-item-list-new {
    display: flex;
    justify-content: space-between !important;
    flex-direction: row !important;
    grid-gap: 5px;
}
.summary-item-list > ul {
    display: flex;
    flex-flow: wrap;
    grid-gap: 0 6px;
    margin: 0;
    align-items: center;
}
    .summary-item-list > ul > li {
        list-style: none;
    }
        .summary-item-list > ul > li > div.summary-organ {
            min-width: 60px;
            max-width: 60px;
            height: 24px;
            flex-shrink: 0;
            border-radius: 8px;
            display: flex;
            align-items: center;
            justify-content: center;
            text-align: center;
            font-size: 12px;
            font-style: normal;
            font-weight: 700;
            line-height: normal;
        }
        .summary-item-list > ul > li > label.summary-organ {
            border-radius: 8px;
            font-size: 11px;
            font-style: normal;
            font-weight: 700;
            line-height: normal;
        }
.text-od {
    color: #4B8BA3 !important;
    font-weight: 700 !important;
    font-size: 12px !important;
}
.text-os {
    color: #5EA697 !important;
    font-weight: 700 !important;
    font-size: 12px !important;
}
.text-ou {
    color: #A5884F !important;
    font-weight: 700 !important;
    font-size: 12px !important;
}
.organ-od {
    background-color: #CCEBF6 !important;
    color: #4B8BA3 !important;
}
.organ-os {
    background-color: #DDF0DD !important;
    color: #5EA697 !important;
}
.organ-ou {
    background-color: #ECD5A7CC !important;
    color: #A5884F !important;
}
.organ-general {
    background-color: #e3f2f1 !important;
    color: #538E8E !important;
    width: 60px !important;
}
.summary-item-list > ul > li > span {
    color: #7A7A7A;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}
.summary-item-list > ul > li > label {
    color: #0E0E0E;
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    vertical-align: initial;
}
.summary-item-list > ul > li > q {
    color: #008B86;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}
.summary-item-list > p > b {
    color: #0E0E0E;
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}
.summary-item-list > p {
    color: #1d1d1d;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    border: none;
    padding: 0;
    margin: 0;
    word-break: break-all;
    text-align: left;
}
.summary-refraction-table {
    margin: 0;
    width: 100%;
    table-layout: fixed;
}
    .summary-refraction-table > thead > tr > th {
        background: #F8F8F8;
        padding: 3px 3px;
        font-size: 12px;
        text-align: center;
        border: 0.8px solid #DDD;
        vertical-align: middle;
    }
    .summary-refraction-table > tbody > tr > th,
    .summary-refraction-table > thead > tr > td {
        padding: 6px 6px;
        text-align: left;
        font-size: 12px;
        vertical-align: middle;
        word-break: break-all;
    }
    .summary-refraction-table > thead > tr > th > span {
        color: #7A7A7A;
        font-size: 12px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
    }
    .summary-refraction-table > thead > tr > th > label {
        color: #7A7A7A;
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: normal;
    }
    .summary-refraction-table > tbody > tr > td {
        background-color: #fff;
        color: #000;
        font-size: 12px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
        text-align: center;
        vertical-align: top;
        padding: 3px 3px;
        border: 0.8px solid #DDD;
        word-break: break-all;
    }
.drop-used-count {
    display: inline-flex;
    align-items: center;
    border-radius: 100px;
    border: 0.6px solid #008B86;
    padding: 1px 6px;
    color: #008B86;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    background-color: #fff;
    overflow: hidden;
}
    .drop-used-count > b {
        color: #000;
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: normal;
    }
.ash-text {
    background-color: rgba(255, 183, 111, 0.20) !important;
    color: #E57100 !important;
    text-align: center !important;
    font-size: 12px !important;
    font-style: normal !important;
    font-weight: 500 !important;
    line-height: normal !important;
}
.text-008B86 {
    color: #008B86;
}
/*Case Sheet New July 2024*/
.cashesheet-tab {
    display: flex;
    align-items: center;
    width: 100%;
    border-radius: 100px;
    overflow: hidden;
    padding: 0;
}
    .cashesheet-tab > li {
        list-style: none;
        flex: 1;
    }
        .cashesheet-tab > li > a {
            display: block;
            padding: 6px 4px;
            text-align: center;
            color: #7A7A7A;
            font-size: 11px;
            font-style: normal;
            font-weight: 600;
            line-height: normal;
            background-color: #fff;
        }
        .cashesheet-tab > li.active > a {
            background: linear-gradient(273deg, #1D5558 60.89%, #3FB8BE 163.64%);
            color: #fff;
        }
.dipcgmf-actions {
    background-color: #fff;
    padding: 4px;
    border-radius: 8px;
    box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.15);
    display: flex;
    align-items: center;
    grid-gap: 8px 4px;
    flex-wrap: wrap;
    overflow: hidden;
    margin-bottom: 2px;
}
    .dipcgmf-actions > li {
        width: calc(100% * (1/7) - 4px - 0px);
        list-style: none;
    }
        .dipcgmf-actions > li > a {
            display: block;
            color: #1D5558;
            font-size: 11px;
            font-style: normal;
            font-weight: 500;
            line-height: normal;
            text-align: center;
        }
            .dipcgmf-actions > li > a > i {
                display: flex;
                align-items: center;
                justify-content: center;
                border-radius: 5px;
                background: rgba(29, 85, 88, 0.10);
                padding: 6px;
                width: 30px;
                height: 30px;
                margin: auto;
            }
.AOO-tabs {
    background-color: #fff;
    border-radius: 5px;
    background: #FFF;
    padding: 4px;
    display: flex;
    grid-gap: 0 4px;
    width: 100%;
    margin: 0;
    overflow: hidden;
}
    .AOO-tabs > li {
        list-style: none;
        flex: 1;
        display: flex;
        align-items: center;
    }
        .AOO-tabs > li > a {
            display: block;
            padding: 4px 2px;
            border-radius: 4px;
            background: #E4E9EE;
            color: #4A4A4A;
            font-size: 13px;
            font-style: normal;
            font-weight: 500;
            line-height: normal;
            text-align: center;
            width: 100%;
        }
        .AOO-tabs > li.active > a {
            background: linear-gradient(132deg, #555586 -28.54%, #2D2D47 118.29%);
            color: #fff;
        }
.newcase-list {
    border-radius: 5px;
    background: #FFF;
    box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.15);
    padding: 4px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    grid-gap: 4px 0;
    margin-bottom: 3px;
}
    .newcase-list.active {
        background: #1D5558;
        box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.15);
    }
        .newcase-list.active > div > label {
            color: #000 !important;
        }
        .newcase-list > div > div > i#active-casesheet,
        .newcase-list.active > div > div > i#notactive-casesheet {
            display: flex;
        }
        .newcase-list.active > div > div > i#active-casesheet,
        .newcase-list > div > div > i#notactive-casesheet {
            display: none;
        }
.newcase-section.active {
    background: #1d5558;
}
    .newcase-section.active > label {
        color: #fff;
    }
    .newcase-section.active > ul > li > a {
        background-color: #fff;
    }
.newcase-list-icons {
    display: flex;
    align-items: center;
    margin: 0;
    grid-gap: 0 4px;
}
    .newcase-list-icons > li {
        list-style: none;
    }
        .newcase-list-icons > li > a {
            display: flex;
            border-radius: 4px;
            background: #E8EEEE;
            width: 18px;
            height: 18px;
            color: #FFF;
            font-size: 11px;
            font-style: normal;
            font-weight: 700;
            line-height: normal;
            justify-content: center;
            align-items: center;
        }
.newcase-list > div > div > label {
    color: #0E0E0E;
    font-size: 11px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 1px;
    width: 100%;
}
.newcase-list.active > div > div > label,
.newcase-list.active > div > div > span {
    color: #fff;
}
.newcase-list > div > div > span {
    color: #7A7A7A;
    font-size: 11px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 1px;
    width: 100%;
}
.newcase-list-icons > li.ot-active > a {
    background: #8AD285 !important;
}
.newcase-list-icons > li.op-active > a {
    background: #FF9F9F !important;
}
.newcase-section {
    border-radius: 4px;
    background: #F8F8F8;
    box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.25);
    padding: 4px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
    .newcase-section > label {
        color: #0E0E0E;
        font-size: 11px;
        font-style: normal;
        font-weight: 600;
        line-height: normal;
        margin: 0;
    }
.templates-header {
    display: flex;
    align-items: center;
    grid-gap: 0 4px;
}
    .templates-header > li {
        list-style: none;
    }
        .templates-header > li > label {
            color: #000;
            font-size: 11px;
            font-style: normal;
            font-weight: 500;
            line-height: normal;
        }
.text-head-case {
    color: #008B86;
    font-size: 18px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    margin: 6px 0;
}
.case-accordion-sheet > .panel-group > .panel > .panel-heading {
    border-radius: 5px;
    background: #FFF;
    padding: 6px 6px;
}
.case-accordion-sheet > .panel-group {
    margin-bottom: 5px !important;
}
.text-E57100 {
    color: #E57100 !important
}
.bg-f2f2f2 {
    background-color: #f2f2f2 !important;
}
.CH-small > label > small {
    color: #000;
    font-size: 13px !important;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}
/*TV Screen*/
.tv-header {
    display: flex;
    align-items: center;
    grid-gap: 10px;
}
.tv-header-list {
    list-style: none;
}
    .tv-header-list > li > p {
        color: #00AFEF;
        font-size: 11px;
        font-style: normal;
        font-weight: 600;
        line-height: normal;
        margin-bottom: 0;
        border-radius: 30px;
        border: 1px solid #00AFEF;
        background: rgba(255, 255, 255, 0.30);
        padding: 5px 10px;
        margin-bottom: 5px;
    }
    .tv-header-list > li > label {
        border-radius: 30px;
        border: 1px solid #C1C1C1;
        padding: 5px 10px;
        font-size: 12px;
        font-style: normal;
        font-weight: 300;
        line-height: normal;
    }
    .tv-header-list > li > h1 {
        color: #1D5558;
        font-size: 20px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
        margin: 0;
    }
    .tv-header-list > li > h2 {
        color: #1d5558;
        font-size: 12px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
        margin: 0;
    }
    .tv-header-list > li > button,
    .tv-header-list > li > button:hover {
        border-radius: 30px;
        background: #1D5558;
        color: #fff;
        font-size: 10px;
    }
.tv-screen-table {
    width: 100%;
    border-collapse: collapse !important;
}
    .tv-screen-table > thead > tr > th {
        background-color: #E6E6E6;
        color: #4A4A4A;
        font-size: 12px !important;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
        position: sticky;
        z-index: 9;
        padding: 5px 6px !important;
    }
    .tv-screen-table > tbody > tr > td {
        border: none !important;
        padding: 6px 3px !important;
    }
        .tv-screen-table > tbody > tr > td > label {
            color: #606060;
            font-size: 14px;
            font-style: normal;
            font-weight: 700;
            line-height: normal;
        }
.tv-screen-tbody-active {
    border: 3px solid rgba(20, 187, 11, 0.50) !important;
    background: rgba(20, 187, 11, 0.10);
}
.tv-screen-tbody-normal {
    border: 3px solid #FFC24A !important;
    background: rgba(255, 194, 74, 0.20);
}
.tv-screen-tbody-danger {
    border: 3px solid #e86868 !important;
    background: rgba(255, 159, 159, 0.5);
}
.tv-screen-patient > label {
    color: #464748;
    font-size: 13px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}
.tv-screen-patient > p {
    color: #7A7A7A;
    font-size: 11px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}
.tv-screen-doctor > label {
    color: #369FA5;
    font-size: 13px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}
.tv-screen-doctor > p {
    color: #565050;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}
.text-C71D27 {
    color: #C71D27 !important;
}
/*TV Screen*/
.patient-tags {
    width: 22px;
    height: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 100%;
}
.patient-vip {
    background: rgba(255, 186, 0, 0.10);
    border: 0.8px solid #FFBA00;
}
.patient-one-eye {
    background: rgba(181, 123, 113, 0.10);
    border: 0.8px solid #B57B71;
}
.patient-disable {
    background: rgba(29, 85, 88, 0.10);
    border: 0.8px solid #1D5558;
}
.patient-disable-white {
    background: rgba(255, 255, 255, 0.10);
    border: 0.8px solid #fff;
}
.CH-popup-table {
width: 100%;
border: none;
margin: 3px;
}
.CH-popup-table > thead > tr > th {
background-color: #dce0e2;
font-size: 12px;
color: #4A4A4A;
font-weight: 600;
padding: 3px 10px;
text-align: left;
border:1px solid #f2f2f2;
}
.CH-popup-table > tbody > tr > td {
font-size: 12px;
color: #000;
padding: 1px 10px;
text-align: left;
border:1px solid #f2f2f2;
}
.drawing-icons {
    list-style: none;
    margin-bottom: 0;
}
    .drawing-icons > li {
        grid-gap: 5px;
        display: inline-flex;
        align-items: center;
    }
.squint-bg {
    background: rgba(29, 85, 88, 0.10) !important;
}
.anterior-table > tbody > tr > td,
.anterior-table > thead > tr > th {
    padding: 1px 10px !important;
}
.anterior-table > thead > tr > th {
    align-items: center !important;
}
.anterior-table > tbody > tr > td > p > span {
    color: #000;
    font-size: 11px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}
.contact-lens-ul > ul {
    padding: 0;
}
.drops-used {
    border-radius: 30px;
    border: 0.6px solid #008B86;
    font-size: 12px;
    padding: 0px 10px !important;
    line-height: 1.2;
    color: #008B86;
}
.list-group > li {
    list-style: none !important;
}
/*New Case History*/
.case__history__main {
    border-radius: 4px;
    border: 0.8px solid #DDD;
    background: #fff;
    margin-bottom: 8px;
}
.case__history__header {
    border-radius: 4px 4px 0px 0px;
    background: #F2F2F2;
    padding: 5px;
}
    .case__history__header > h1 {
        color: #0E0E0E;
        font-size: 14px;
        font-style: normal;
        font-weight: 600;
        line-height: normal;
        margin: 0;
    }
.case__history__body {
    display: block;
    padding: 6px;
}
.case__history__table {
    width: 100%;
    table-layout: fixed;
}
    .case__history__table > tbody > tr > td:first-child::after {
        content: "";
        position: absolute;
        right: 0;
        top: 0;
        bottom: 0;
        background-color: #F2F2F2;
        width: 2px;
        margin: 4px 0;
    }
    .case__history__table > tbody > tr > td {
        position: relative;
        padding: 3px 10px !important;
    }
        .case__history__table > tbody > tr > td > label {
            color: #0E0E0E;
            font-size: 12px;
            font-style: normal;
            font-weight: 600;
            line-height: normal;
        }
    .case__history__table > tbody > tr {
        border-bottom: 2px solid #F2F2F2 !important;
    }
        .case__history__table > tbody > tr:last-child {
            border-bottom: none !important;
        }
.tab__style--1 > ul {
    display: flex;
    align-items: center;
    border-bottom: 0.5px solid #d2d2d2;
    background: #fff;
    grid-gap: 0 8px;
    margin: 0;
}
    .tab__style--1 > ul > li {
        list-style: none;
        margin-bottom: -1px;
    }
        .tab__style--1 > ul > li > a {
            display: block;
            color: #1D5558;
            font-size: 12px;
            font-style: normal;
            font-weight: 500;
            line-height: normal;
            padding: 6px 16px;
            margin: 5px 6px 0px 6px;
        }
        .tab__style--1 > ul > li.active > a {
            background-color: #F8F8F8;
            border-radius: 10px 10px 0px 0px;
            border-top: 0.5px solid #d2d2d2;
            border-right: 0.5px solid #d2d2d2;
            border-left: 0.5px solid #d2d2d2;
            color: #1d5558;
            font-size: 12px;
            font-weight: 700;
        }
.header-new-buttons {
    background: #fff;
    border-radius: 15px;
    padding: 2px;
}
.profile-header-alignment {
    min-width: 220px;
    max-width: 250px;
}
.text-h1 {
    font-size: 16px;
    font-weight: 700;
    color: #000;
    margin: 0;
    line-height: normal;
}
.tab__style--2 {
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
}
.tab__style--3 {
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
    background: #DEE2E7;
    border-radius:100px;
}
 .tab__style--3 > li.active {
        border: none;
        background:#1d5558;
        border-radius:20px;
        margin:4px;
    }
    .tab__style--3 > li.active > a {
        color: #fff;
    }
    .tab__style--3 > li > a {
        font-size: 12px;
        font-weight: 600;
        color: #64748B;
        line-height: normal;
    }
.tab__style--2 > li,
.tab__style--3 > li {
    display: flex;
    align-items: center;
    grid-gap: 10px;
    padding: 6px;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    list-style: none;
}
   
        .tab__style--2 > li > a {
            font-size: 12px;
            font-weight: 500;
            color: #4A4A4A;
            line-height: normal;
        }
        .tab__style--2 > li > div {
            display: none;
        }
        .tab__style--2 > li.active > a {
            color: #1D5558;
        }
        .tab__style--2 > li.active {
            border: 1px solid #1D5558;
            margin-bottom: -2px;
        }
            .tab__style--2 > li.active > div {
                display: flex;
                align-items: center;
                grid-gap: 8px;
            }
        .tab__style--2 > li > div > button {
            font-size: 12PX;
            font-weight: 400;
            color: #7A7A7A;
            line-height: normal;
            border: 1px solid #DDDDDD;
            border-radius: 15px;
            background-color: #fff;
            padding: 2px 7px;
        }
            .tab__style--2 > li > div > button.active {
                color: #fff;
                background-color: #1D5558;
            }
.drawingpad__list {
    padding: 5px;
    background: #F7F7F7;
}
    .drawingpad__list > ol {
        display: flex;
        align-items: center;
        grid-gap: 5px;
        flex-wrap: wrap;
        margin-bottom: 0px;
    }
        .drawingpad__list > ol > li {
            border-radius: 20px;
            background: #F2F2F2;
            border: 1px solid #DDDDDD;
            padding: 1px 12px;
            text-align: center;
            list-style: none;
        }
            .drawingpad__list > ol > li > a {
                font-size: 11PX;
                font-weight: 500;
                color: #5F5F5F;
                line-height: normal;
            }
            .drawingpad__list > ol > li.active {
                background: #E0EEEE;
                border: 0.6px solid #1D5558;
            }
                .drawingpad__list > ol > li.active > a {
                    color: #1D5558;
                }
.drawing-actions {
    background: #FFF;
    box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.08);
    padding: 4px 4px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}
    .drawing-actions > div {
        border-right: 1px solid #d2d2d2;
        padding: 0 8px;
        display: flex;
        justify-content: space-between;
        grid-gap: 5px 0;
        /*height: 52px;*/
        flex-direction: column;
    }
        .drawing-actions > div > ul,
        .drawing-actions > div > ol,
        .drawing-colors{
            margin: 0;
            display: flex;
            align-items: center;
            grid-gap: 0 8px;
            justify-content: center;
        }
            .drawing-actions > div > label,
            .drawing-actions > div > ol > li > label,
            .drawing-colors > li > label {
                color: #000;
                font-size: 12px;
                font-style: normal;
                font-weight: 400;
                line-height: normal;
                margin: 0;
                text-align: center;
            }
            .drawing-actions > div > ul > li,
            .drawing-actions > div > ol > li,
            .drawing-colors > li {
                list-style: none;
            }
                .drawing-actions > div > ol > li > span,
                .drawing-colors > li > a {
                   /* width: 16px;
                    height: 16px; */
                    width: 22px;
                    height: 22px;
                    border-radius: 4px;
                    display: block;
                    cursor: pointer;
                  /*  border: 1px solid #d2d2d2;*/
                }
                .drawing-actions > div > ol > li > input,
                .drawing-colors > li > input {
                    height: 20px;
                    width: 40px;
                    position: absolute;
                    left: 0;
                    top: 0;
                    bottom: 0;
                    right: 0;
                    z-index: 1;
                    width: 100%;
                    height: 100%;
                    opacity: 0;
                    cursor: pointer;
                }
                .drawing-actions > div > ul > li > button {
                    background-color: #fff;
                    border-radius: 5px;
                    border: 0.8px solid #DDD;
                    display: flex;
                    flex-direction: column;
                    grid-gap: 4px 0;
                    justify-content: center;
                    align-items: center;
                    padding: 2px 6px;
                    font-size: 10px;
                    color: #000;
                    font-weight: 400;
                }
.drwaing-history-icon {
    width: 22px;
    height: 22px;
    display: block;
    margin: auto;
    background-image: url('../images/historyD.svg');
    background-size: contain;
    background-repeat: no-repeat;
}
.drwaing-template-icon {
    width: 22px;
    height: 22px;
    display: block;
    margin: auto;
    background-image: url(../img/consultation-icons/template-icon.svg);
    background-size: contain;
    background-repeat: no-repeat;
}
.drawing-actions > div > ul > li > input {
    width: 100%;
    height: 100%;
    position: absolute;
    background-color: transparent;
    border: none;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    opacity: 0;
    cursor: pointer;
}
.drawing-actions > div > ul > li > a > i,
.drawing-actions-icon {
    width: 24px;
    height: 24px;
    display: block;
    margin: auto;
    background-image: url(../img/drawingPadIcons.svg);
    background-size: auto;
    background-repeat: no-repeat;
}
.drawing-actions > div > ul > li.active > a,
.drawing-actions > div > ol > li.active > a {
    background-color: #bff0f3;
    border: 1.5px solid #1D5558;
    display: block;
}
.drawing-colors > li.active > a {
    border: 2px solid #1D5558;
    display: block;
}
.drawing-actions > div > ul > li.active > a,
.drawing-actions > div > ol > li.active > a,
.drawing-colors > li {
    position: relative;
}
.move-draw {
    background-position: -1px -12px;
}
.hand-draw {
    background-position: -51px;
}
.sruare-draw {
    background-position: -100px -12px;
}
.circle-draw {
    background-position: -150px -12px;
}
.triangle-draw {
    background-position: -200px -12px;
}
.line-draw {
    background-position: -250px -12px;
}
.arrow-draw {
    background-position: -300px -12px;
}
.pen-draw {
    background-position: -348px -12px;
}
.color-draw {
    background-position: -400px -12px;
}
.text-draw {
    background-position: -450px -12px;
}
.eraser-draw {
    background-position: -568px -12px;
}
.brush-draw {
    background-position: -496px -12px;
    width: 51px !important;
}
.sync-draw {
    background-position: -616px -12px;
}
.upload-draw {
    background-position: -667px -12px;
}
.redo-draw {
    background-position: -717px -9px;
    width: 32px;
    height: 32px;
}
.undo-draw {
    background-position: -775px -9px;
    width: 32px;
    height: 32px;
}
.sfront-draw {
    background-position: -831px -9px;
    width: 32px;
    height: 32px;
}
.sback-draw {
    background-position: -889px -9px;
    width: 32px;
    height: 32px;
}
.zoonin-draw {
    background-position: -946px -9px;
    width: 32px;
    height: 32px;
}
.zoomout-draw {
    background-position: -1004px -9px;
    width: 32px;
    height: 32px;
}
.copy-draw {
    background-position: -1062px -9px;
    width: 32px;
    height: 32px;
}
.refresh-draw {
    background-position: -1119px -9px;
    width: 32px;
    height: 32px;
}
.border-draw {
    background-position: -1177px -9px;
}
.bg-black {
    background-color: #000;
}
.bg-yellow {
    background-color: #F3E056;
}
.bg-C71D26 {
    background-color: #C71D26;
}
.bg-orange {
    background-color: #F37123;
}
.bg-brown {
    background-color: #974A02;
}
.bg-pink {
    background-color: #FF88E9;
}
.bg-green {
    background-color: #31D069;
}
.bg-blue {
    background-color: #5BD8EE;
}
.rotate-drawpad {
    background-color: #fff;
    padding: 8px;
    border-radius: 8px;
}
.span-eye {
    border: 0.5px solid #DDDDDD;
    background: #fff;
    padding: 3px 6px;
    text-align: center;
    border-radius: 10px;
    color: #1D1D1D;
    font-weight: 500;
    line-height: normal;
    font-size: 8px;
}
.rotate-drawpad > input[type=range][orient=vertical] {
    writing-mode: vertical-lr;
    direction: ltr;
    width: 16px;
    vertical-align: bottom;
    transform: rotate(180deg);
    margin: auto;
}
.color-picker-icon {
    background-image: url(../img/new-icons/color-picker-icon.svg);
/*    width: 50px;
    height: 50px;*/
    width: 22px;
    height: 22px;
    display: block;
    background-repeat: no-repeat;
    margin: auto;
    background-position: center center;
    cursor: pointer;
    border-radius:4px;
}
.list__images-- {
    border: 1px solid #DDDDDD;
    border-radius: 8px;
    padding: 8px;
    background: #fff;
    width: 200px;
}
    .list__images-- > ul {
        display: flex;
        flex-direction: column;
        grid-gap: 10px;
        padding: 0;
        margin: 0;
    }
        .list__images-- > ul > li {
            list-style: none;
            border: 1px solid #DDDDDD;
            border-radius: 8px;
        }
            .list__images-- > ul > li > div > div > img {
                width: 100%;
                height: 100px;
                object-fit: contain;
                background-position: 100%;
            }
.hlist {
    display: flex;
    align-items: center;
    grid-gap: 5px;
}
    .hlist > label {
        font-size: 11px;
        font-weight: 400;
        line-height: 1.2;
        text-align: left;
        color: #656565;
    }
    .hlist > span {
        font-size: 11px;
        font-weight: 400;
        line-height: 1.2;
        color: #1D1D1D;
    }
.draw-remarks {
    display: flex;
    align-items: center;
    justify-content: space-between;
    grid-gap: 10px;
    box-shadow: 0px 4px 12px 0px #0000000F;
    padding: 5px;
}
    .draw-remarks > p {
        font-size: 13px;
        font-weight: 600;
        text-align: left;
        color: #1D1D1D;
        margin: 0;
    }
.custom-list-dropdown {
    width: 220px !important;
    height: 400px !important;
    overflow: auto;
    padding: 5px;
}
/*Dashboard*/
.dashboard__cards-- {
    background-color: #fbfdff;
    border: 1px solid #e5e7eb;
    display: flex;
    align-items: center;
    padding: 6px;
    border-radius: 6px;
    margin: 4px 0;
    height: 70px;
}
.dashboard__cards-- > div {
    min-width: 1px;
}
.dashboard__cards-- > div > p {
    color: rgb(111 119 130);
    font-weight: 400;
    font-size: 14px;
    line-height: 2;
    margin: 0;
    white-space: nowrap;
    min-width: 1px;
    text-overflow: ellipsis;
    overflow: hidden;
}
.dashboard__cards-- > div > h2 {
    margin: 0;
    font-size: 1.25rem;
    line-height: 1.75rem;
    font-weight: 600;
    color: #313131;
}
.dashboard__cards-- > div > a {
    display: flex;
    align-items: center;
    font-size: 14px;
    border: 1px solid #d2d2d2;
    width: 22px;
    height: 22px;
    justify-content: center;
    border-radius: 100px;
    margin: auto;
}
.remarks-content {
    max-width: 350px;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
}