.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;
}
/*.flex-flow-wrap {
    display: flex;
    flex-flow: wrap;
    align-items: flex-start;
    width: 100%
}
.flex-flow-wrap > li {
    list-style-type: none;
    flex: 50%;
}
.full-view-summary-body > h2 {
    margin: 3px 0 0 0;
     font-size: 11px;
    color: #068cb0;
    font-weight: 600;
    padding: 0 2px;
    background-color: rgb(255 247 245);
}
.full-model-summary-head {
    padding: 0px 10px;
    background-color: #dbfff8 !important;
    color: #151515;
    position: relative;
}
.full-model-summary-head > h4 {
    font-size: 12px;
    font-weight: 600;
    line-height: 12px;
    color: #1d5558;
}
.full-model-summary-head > button {
    color: #f00 !important;
    line-height: 0;
    right: 10px;
    top: 0;
    bottom: 0;
    position: absolute;
}
.full-view-summary-container {
    display: block;
}
.full-view-summary-head {
    display: flex;
    align-items: center;
    padding: 4px 4px;
}
.full-view-summary-head > h1 {
    margin: 0;
    font-size: 11px;
    font-weight: 600;
    color: #000;
}
.full-view-summary-head {
    background-color: #eee;
}
.full-view-summary-ul {
    margin: 0;
}
.full-view-summary-ul > li {
    border-bottom: 0.8px solid #d2d2d2;
    padding: 2px 12px 2px 2px;
     font-size: 11px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #313131;
    position: relative;
}
.full-view-summary-ul > li > i {
    position: absolute;
    right: 2px;
    top: 0;
    bottom: 0;
    margin: auto 0;
    height: 10px;
    color: #ff6a00;
}
.full-view-summary-body > table {
    margin: 0;
    border: 1px solid #d2d2d2;
}
.full-view-summary-body > table > thead > tr > th,
.full-view-summary-body > table > tbody > tr > th{
     font-size: 11px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #000;
    padding: 0px 2px;
    vertical-align: middle;
}
.full-view-summary-body > table > tbody > tr > td {
     font-size: 11px;
    border: 0.5px solid #d2d2d2;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #000;
    padding: 0px 2px;
    vertical-align: middle;
}
.full-table-flex > table {
    display: inline-block
}
.full-view-summary-body > table > thead > tr:first-child > th:first-child {
    background-color: #068cb0;
    color: #fff;
}*/

.consultation-summary-container {
    overflow: hidden;
    display: block;
    border: 1px solid #d2d2d2;
}

.consultation-summary-header {
    background-color: #afd9d7;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 2px 6px;
    cursor: pointer;
}

    .consultation-summary-header.active,
    .consultation-summary-header.active > h1 {
        background-color: #1d5558;
        color: #fff
    }

    .consultation-summary-header > h1 {
        font-size: 11px;
        font-weight: 600;
        font-stretch: normal;
        font-style: normal;
        line-height: normal;
        letter-spacing: normal;
        text-align: left;
        color: #30625f;
        display: inline-block;
        margin: 0;
    }

.consultation-summary-body {
    background-color: #fff;
    padding: 6px;
    display: block;
    box-shadow: 0 3px 10px rgb(0 0 0 / 0.2);
}

.summary-content {
    display: block;
    margin-bottom: 8px;
}

    .summary-content > h1,
    .text-s14w600cc5771b {
        font-size: 14px !important;
        font-weight: 600 !important;
        font-stretch: normal !important;
        font-style: normal !important;
        line-height: normal !important;
        letter-spacing: normal !important;
        text-align: left !important;
        color: #c5771b !important;
        margin: 3px 0 !important;
        margin: 0 !important;
    }

    .summary-content > li {
        /*margin-bottom: 10px;*/
        margin-bottom: 5px;
    }

        .summary-content > li > label {
            font-size: 11px;
            font-weight: 500;
            font-stretch: normal;
            font-style: normal;
            line-height: normal;
            letter-spacing: normal;
            text-align: left;
            color: #767676;
        }

        .summary-content > li > p {
            font-size: 11px;
            font-weight: 600;
            font-stretch: normal;
            font-style: normal;
            line-height: normal;
            letter-spacing: normal;
            text-align: left;
            color: #313131;
            margin: 0;
        }

.appointment-vsts-history {
    background-color: #ececec;
    padding: 8px;
    display: flex;
    align-items: center;
    border-radius: 4px 4px 0 0;
    justify-content: space-between;
}

    .appointment-vsts-history > h1 {
        font-size: 11px;
        font-weight: 600;
        font-stretch: normal;
        font-style: normal;
        line-height: normal;
        letter-spacing: normal;
        text-align: left;
        color: #000;
        margin: 0;
    }

.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;
        }

.list-cord-pcl {
    margin: 0;
    width: 100%;
}

    .list-cord-pcl > li {
        display: block;
        margin-bottom: 8px;
        list-style: none;
        margin-top: 4px;
    }

        .list-cord-pcl > li > label, .list-cord-pcl > li > p > b {
            margin: 0;
            font-size: 11px;
            font-weight: 600;
            font-stretch: normal;
            font-style: normal;
            line-height: normal;
            letter-spacing: normal;
            text-align: left;
            color: #313131;
        }

        .list-cord-pcl > li > span {
            color: #313131;
            font-size: 12px;
            font-weight: 600;
            font-stretch: normal;
            font-style: normal;
            line-height: 2;
            letter-spacing: normal;
            text-align: left;
        }

.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-278c7a {
    color: #278c7a !important;
}

.text-5c85c {
    color: #5cb85c !important;
}

.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;
    }

.four-sections {
    display: flex;
    grid-gap: 4px;
    flex-wrap: wrap;
}

    .four-sections > div,
    .four-sections > li {
        width: calc(100% * (1/4) - 3px - 0px);
    }

.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;
            }

.stock-data {
    display: flex;
    align-items: center;
    grid-gap: 5px !important;
    text-align: left;
    flex-flow: wrap;
}

.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;
            /* width:100% !important;*/
            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;
    /* padding: 6px 12px 12px 12px; */
    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-history {
    background-color: #ececec;
    padding: 8px;
    display: flex;
    align-items: center;
    border-radius: 4px 4px 0 0;
    justify-content: space-between;
}

.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;
}

.table-tally {
    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;
}

.applist-free-tag {
    background: #1e8e84;
    color: #fff;
    padding: 1px 8px;
    border-radius: 10px;
    font-weight: 700;
    margin-left: 5px;
}

.counsler-dropdown > li {
    padding: 5px 10px;
    border-bottom: 1px solid #eee;
    cursor: pointer;
    text-transform: none !important;
}

.text-transform-none {
    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
    }

.dilation-free {
    position: absolute;
    right: 20px;
    top: 10px;
    bottom: 0;
    z-index: 1;
    display: grid;
    align-items: center;
}

.earning-points > li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border: 1px solid #26c09e;
    color: #26c09e;
    border-radius: 10px;
    padding: 0px 10px;
}

.two-sections {
    display: flex;
    grid-gap: 4px;
}

    .two-sections > .profile-section,
    .two-sections > div,
    .two-sections > li {
        width: calc(100% * (1/2) - 2px - 0px);
    }
/*span,p, div, label, h1,h2,h3,h4,h5,h6 {
    word-break: break-all;
}*/
.p-0-15 {
    padding: 0 15px;
}

.input-box-error {
    position: absolute;
    font-size: 9px;
    bottom: -15px;
    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;
        /* flex: auto; */
    }

        .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;
        }

.table-vendor > thead > tr > th {
    background-color: #1D5558;
    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;
        /*  background-color: #fff;*/
        border-radius: 6px;
        /* padding: 4px;*/
    }

        .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;
        /*  border-bottom: 1px solid #d2d2d2;*/
    }

        .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;
    /*  margin-bottom: 0px;*/
}

.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;
            /*  margin-bottom:5px;*/
        }

        .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;
}

.text-general {
    color: #538E8E !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: #7A7A7A;*/
    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: 2px;
    /* padding: 8px;*/
    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/4) - 3px - 0px);*/
        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:#fff !important;*/
            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;
            /*padding: 5px 6px !important;*/
        }

.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;
}

.text-2A7A7F {
    color: #2A7A7F !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;
}

.newcasehistory-label > li > label {
    font-size: 10px !important;
}

.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:auto;*/
    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;
    /*    vertical-align:top;*/
    }

        .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;
}
/*New Case History*/

/*New Styles for Drawing Pad Date:02/12/2024*/

.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--2 > 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: 12PX;*/
                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 {
    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;
                    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;
}

.brush-draw-dropdown {
    width: 180px;
    max-width: 180px;
    margin-top: 40px;
}

.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-cyana {
    background-color: #2290A8;
}

.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;
    display: block;
    background-repeat: no-repeat;
    margin: auto;
    background-position: center center;
    cursor: pointer;
}

.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;
}