/* DO NOT EDIT */
/* ———————————————————————————————————————————————————————————————————————
   Define Variable Values
——————————————————————————————————————————————————————————————————————— */

:root {
    --border-radius: 2px;
    --font-size: 12px;
    --placeholder-color: #ccc;
    --active-color: #4a90e2;
    --light-gray: #f5f6f7;
    --hr-line: #d5d7dc;
    --nav-color: #293846;
    --nav-item-color: #5b5b5b;
    /* --font-family: 'Open Sans', sans-serif; */ /* disable it */
    --help-text-color: #5c5c5c;
    --table-header: #e9ecf0;
    --hover-color: #e9ecf0;

    /* New used Values as per design */
    --form-mb: 16px; /* used in form bottom spacing */
    --input-lh: 34px; /* used to align input field and label */
    --p-font-size: 13px; /* used in text link; This should be <p> tag size */
    --text-gray: #9a9d9d;
    --border-color: #ccc; /* default bootstrap color*/
    /* New color code for sample as per design */
    --bg-faded: #eee;
    --bg-red: #e73631;
    --bg-white: #fff;
    --bg-pink: #e46481;
    --bg-gray: #7f7f7f;
    --bg-gold: #ecb718;
    --bg-green: #439242;
    --bg-black: #121212;
    --bg-orange: #e8722e;
    --bg-yellow: #e8ca6b;
    --bg-lavender: #9261a0;
    --bg-light-blue: #308ee0;
    --bg-royal-blue: #35568e;
    --bg-light-green: #80cb7f;

    --color-dark: #6d6d6d;

    --color-primary: #428bca;
    --color-success: #5cb85c;
    --color-info: #5bc0de;
    --color-warning: #f0ad4e;
    --color-danger: #d9534f;

    --fw-lighter: 100;
    --fw-light: 300;
    --fw-normal: 400;
    --fw-bold: 600;
    --fw-bolder: 700;
    --active-card: #9ccffb6b;
    --active-border: 2px solid #9ccffb6b;
    --hover-card: #9ad0ff;
    --dc-color: #313b4c;
}

.text-gray {
    color: var(--text-gray);
}
.form-group {
    margin-bottom: var(--form-mb);
}
.form-control,
input.form-control {
    border-radius: var(--border-radius);
} /* Input Field Border Radius */
/* ———————————————————————————————————————————————————————————————————————
   Utility Classes
——————————————————————————————————————————————————————————————————————— */
*:focus {
    outline: 0 !important;
}
.align-items-center {
    display: flex;
    align-items: center !important;
}
.justify-content-center {
    display: flex;
    justify-content: center !important;
}
.float-left,
.pull-left {
    float: left !important;
}
.float-right,
.pull-right {
    float: right !important;
}
.clear_both {
    display: block;
    clear: both !important;
    content: '';
}

/* Display Classes */
.d-inline {
    display: inline !important;
}
.d-inline-block {
    display: inline-block !important;
}
.d-block {
    display: block !important;
}
.d-flex {
    display: flex !important;
}
.d-inline-flex {
    display: inline-flex !important;
}

.d-rev {
    flex-direction: row-reverse;
}

/* Typography */
.text-lowercase {
    text-transform: lowercase !important;
}
.text-uppercase {
    text-transform: uppercase !important;
}
.text-capitalize {
    text-transform: capitalize !important;
}

/* Spacing Classes */
.p-0 {
    padding: 0 !important;
}
.p-5 {
    padding: 5px !important;
}
.p-10 {
    padding: 10px !important;
}
.p-15 {
    padding: 15px !important;
}
.p-20 {
    padding: 20px !important;
}
.p-30 {
    padding: 30px !important;
}

.pr-0 {
    padding-right: 0 !important;
}
.pr-5 {
    padding-right: 5px !important;
}
.pr-10 {
    padding-right: 10px !important;
}
.pr-15 {
    padding-right: 15px !important;
}
.pr-20 {
    padding-right: 20px !important;
}
.pr-30 {
    padding-right: 30px !important;
}

.pl-0 {
    padding-left: 0 !important;
}
.pl-5 {
    padding-left: 5px !important;
}
.pl-10 {
    padding-left: 10px !important;
}
.pl-15 {
    padding-left: 15px !important;
}
.pl-20 {
    padding-left: 20px !important;
}
.pl-30 {
    padding-left: 30px !important;
}

.pl-15 {
    padding-left: 15px !important;
}

.pb-0 {
    padding-bottom: 0 !important;
}
.pb-5 {
    padding-bottom: 5px !important;
}
.pb-10 {
    padding-bottom: 10px !important;
}
.pb-15 {
    padding-bottom: 15px !important;
}
.pb-20 {
    padding-bottom: 20px !important;
}
.pb-30 {
    padding-bottom: 30px !important;
}

.pt-0 {
    padding-top: 0 !important;
}
.pt-5 {
    padding-top: 5px !important;
}
.pt-10 {
    padding-top: 10px !important;
}
.pt-15 {
    padding-top: 15px !important;
}
.pt-20 {
    padding-top: 20px !important;
}
.pt-30 {
    padding-top: 30px !important;
}

.ptb-0,
.py-0 {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}
.ptb-10,
.py-10 {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}
.ptb-15,
.py-15 {
    padding-top: 15px !important;
    padding-bottom: 15px !important;
}
.ptb-20,
.py-20 {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
}
.ptb-30,
.py-30 {
    padding-top: 30px !important;
    padding-bottom: 30px !important;
}
.ptb-50,
.py-50 {
    padding-top: 50px !important;
    padding-bottom: 50px !important;
}
.ptb-100,
.py-100 {
    padding-top: 100px !important;
    padding-bottom: 100px !important;
}

.m-0 {
    margin: 0 !important;
}

.m-5 {
    margin: 5px !important;
}

.m-10 {
    margin: 10px !important;
}

.m-15 {
    margin: 15px !important;
}

.mt-4 {
    margin-top: 4px !important;
}
.mt-5 {
    margin-top: 5px !important;
}
.mt-10 {
    margin-top: 10px !important;
}
.mt-15 {
    margin-top: 15px !important;
}
.mt-20 {
    margin-top: 20px !important;
}
.mt-30 {
    margin-top: 30px !important;
}

.mr-5 {
    margin-right: 5px !important;
}
.mr-10 {
    margin-right: 10px !important;
}
.mr-15 {
    margin-right: 15px !important;
}
.mr-20 {
    margin-right: 20px !important;
}

.ml-5 {
    margin-left: 5px !important;
}
.ml-1 {
    margin-left: 1px !important;
}
.ml-10 {
    margin-left: 10px !important;
}
.ml-15 {
    margin-left: 15px !important;
}
.ml-20 {
    margin-left: 20px !important;
}

.mb-0 {
    margin-bottom: 0 !important;
}
.mb-4 {
    margin-bottom: 4px !important;
}
.mb-5 {
    margin-bottom: 5px !important;
}
.mb-10 {
    margin-bottom: 10px !important;
}
.mb-15 {
    margin-bottom: 15px !important;
}
.mb-20 {
    margin-bottom: 20px !important;
}
.mb-25 {
    margin-bottom: 25px !important;
}
.mb-30 {
    margin-bottom: 30px !important;
}

.mtb-0,
.my-0 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}
.mtb-10,
.my-10 {
    margin-top: 10px !important;
    margin-bottom: 10px !important;
}
.mtb-15,
.my-15 {
    margin-top: 15px !important;
    margin-bottom: 15px !important;
}
.mtb-20,
.my-20 {
    margin-top: 20px !important;
    margin-bottom: 20px !important;
}
.mtb-30,
.my-30 {
    margin-top: 30px !important;
    margin-bottom: 30px !important;
}
.mtb-50,
.my-50 {
    margin-top: 50px !important;
    margin-bottom: 50px !important;
}
.mtb-100,
.my-100 {
    margin-top: 100px !important;
    margin-bottom: 100px !important;
}

.fw-lighter {
    font-weight: var(--fw-lighter) !important;
}
.fw-light {
    font-weight: var(--fw-light) !important;
}
.fw-normal,
.fw-regular {
    font-weight: var(--fw-normal) !important;
}
.fw-bold {
    font-weight: var(--fw-bold) !important;
}
.fw-bolder {
    font-weight: var(--fw-bolder) !important;
}

.input-lh,
.lh-34 {
    line-height: 34px !important;
}

.mr-auto {
    margin-right: auto !important;
}
.ml-auto {
    margin-left: auto !important;
}
.mx-auto {
    margin-right: auto !important;
    margin-left: auto !important;
}
.my-auto {
    margin-top: auto !important;
    margin-bottom: auto !important;
}

.text-primary,
.text-blue,
.text-link {
    color: #428bca;
    background-color: transparent;
}
.text-gray {
    color: var(--text-gray) !important;
}

.pos-relative,
.position-relative,
.pos-rel {
    position: relative !important;
}

.pos-abs {
    position: absolute;
}

.border-rounded {
    border-radius: 3px !important;
}

.table-responsive {
    display: block;
    width: 100%;
    overflow-x: auto;
}

.pos-center {
    position: absolute;
    transform: translate(-50%, -50%);
}

/* Background color classes */
.bg-faded {
    background-color: var(--bg-faded) !important;
}
.bg-red,
.vacutainer-clr-red {
    background-color: var(--bg-red) !important;
}
.bg-white,
.vacutainer-clr-white {
    background-color: var(--bg-white) !important;
}
.bg-pink,
.vacutainer-clr-pink {
    background-color: var(--bg-pink) !important;
}
.bg-gray,
.vacutainer-clr-gray {
    background-color: var(--bg-gray) !important;
}
.bg-gold,
.vacutainer-clr-gold {
    background-color: var(--bg-gold) !important;
}
.bg-green,
.vacutainer-clr-green {
    background-color: var(--bg-green) !important;
}
.bg-black,
.vacutainer-clr-black {
    background-color: var(--bg-black) !important;
}
.bg-orange,
.vacutainer-clr-orange {
    background-color: var(--bg-orange) !important;
}
.bg-yellow,
.vacutainer-clr-yellow {
    background-color: var(--bg-yellow) !important;
}
.bg-lavender,
.vacutainer-clr-lavender {
    background-color: var(--bg-lavender) !important;
}
.bg-light-blue,
.vacutainer-clr-light-blue {
    background-color: var(--bg-light-blue) !important;
}
.bg-royal-blue,
.vacutainer-clr-royal-blue {
    background-color: var(--bg-royal-blue) !important;
}
.bg-light-green,
.vacutainer-clr-light-green {
    background-color: var(--bg-light-green) !important;
}

.bg-transparent {
    background-color: transparent !important;
}

/* ———————————————————————————————————————————————————————————————————————
Define All Buttons Here
——————————————————————————————————————————————————————————————————————— */

/* Tranparent button for text only */
.btn-transparent {
    background-color: transparent;
    border: 1px solid transparent;
    color: var(--text-gray);
}
.btn-transparent:hover,
.btn-transparent:focus,
.btn-transparent:active {
    border: 1px solid transparent;
    cursor: pointer;
    background-color: transparent;
    color: #333;
}
.btn:active,
.btn.active {
    box-shadow: none !important;
}

/* Text link button */
button[type='button'].text-link {
    color: #428bca;
    border: none;
    line-height: var(--input-lh);
    font-size: var(--p-font-size);
    padding: 0;
    margin: 0;
    font-weight: var(--fw-normal);
}
button[type='button'].text-link:hover,
button[type='button'].text-link:focus {
    background-color: transparent;
}

/* Hover all button */
button,
select,
.btn,
input[type='button'],
input[type='file'],
.img-link,
.text-link {
    transition: 0.3s;
    cursor: pointer;
}
button:hover,
select:hover,
.btn:hover,
input[type='button']:hover,
input[type='file']:hover,
.img-link:hover,
.text-link:hover {
    cursor: pointer;
}

/* Outline Border Button */
.btn-outline-primary {
    color: var(--color-primary);
    border: 1px solid var(--color-primary);
    background-color: transparent !important;
}
.btn-outline-success {
    color: var(--color-success);
    border: 1px solid var(--color-success);
    background-color: transparent;
}
.btn-outline-info {
    color: var(--color-info);
    border: 1px solid var(--color-info);
    background-color: transparent;
}
.btn-outline-warning {
    color: var(--color-warning);
    border: 1px solid var(--color-warning);
    background-color: transparent;
}
.btn-outline-danger {
    color: var(--color-danger);
    border: 1px solid var(--color-danger);
    background-color: transparent;
}
.btn-outline-dark {
    color: var(--color-dark);
    border: 1px solid var(--color-dark);
    background-color: transparent;
}

/* Outline Button Hover */
.btn-outline-primary:hover {
    color: #fff;
    background-color: var(--color-primary) !important;
    border-color: var(--color-primary);
}
.btn-outline-success:hover {
    color: #fff;
    border: 1px solid var(--color-success);
    background-color: var(--color-success);
}
.btn-outline-info:hover {
    color: #fff;
    border: 1px solid var(--color-info);
    background-color: var(--color-info);
}
.btn-outline-warning:hover {
    color: #fff;
    border: 1px solid var(--color-warning);
    background-color: var(--color-warning);
}
.btn-outline-danger:hover {
    color: #fff;
    border: 1px solid var(--color-danger);
    background-color: var(--color-danger);
}
.btn-outline-dark:hover {
    color: #fff;
    border: 1px solid var(--color-dark);
    background-color: var(--color-dark);
}
.btn-link-outline:hover {
    border: 1px solid var(--color-primary);
    text-decoration: none;
    border-radius: 3px;
    padding: 6px 12px;
}

/* Outline Button Hover With Light Background */
.btn-outline-light-bg-primary {
    color: var(--color-primary);
    border: 1px solid var(--color-primary);
    background-color: transparent;
}
.btn-outline-light-bg-success {
    color: var(--color-success);
    border: 1px solid var(--color-success);
    background-color: transparent;
}
.btn-outline-light-bg-info {
    color: var(--color-info);
    border: 1px solid var(--color-info);
    background-color: transparent;
}
.btn-outline-light-bg-warning {
    color: var(--color-warning);
    border: 1px solid var(--color-warning);
    background-color: transparent;
}
.btn-outline-light-bg-danger {
    color: var(--color-danger);
    border: 1px solid var(--color-danger);
    background-color: transparent;
}

/* Outline Button Hover With Light Background Hover */
.btn-outline-light-bg-primary:hover,
.btn-outline-light-bg-primary:focus {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: rgba(66, 139, 202, 0.2);
}
.btn-outline-light-bg-success:hover,
.btn-outline-light-bg-success:focus {
    color: var(--color-success);
    border: 1px solid var(--color-success);
    background-color: rgba(92, 184, 92, 0.2);
}
.btn-outline-light-bg-info:hover,
.btn-outline-light-bg-info:focus {
    color: var(--color-info);
    border: 1px solid var(--color-info);
    background-color: rgba(91, 192, 222, 0.2);
}
.btn-outline-light-bg-warning:hover,
.btn-outline-light-bg-warning:focus {
    color: var(--color-warning);
    border: 1px solid var(--color-warning);
    background-color: rgba(240, 173, 78, 0.2);
}
.btn-outline-light-bg-danger:hover,
.btn-outline-light-bg-danger:focus {
    color: var(--color-danger);
    border: 1px solid var(--color-danger);
    background-color: rgba(217, 83, 79, 0.2);
}

/* Shadow Buttons */
.shadow-primary:hover,
.shadow-primary:focus {
    box-shadow: 0 3px 10px var(--color-primary);
}
.shadow-success:hover,
.shadow-success:focus {
    box-shadow: 0 3px 10px var(--color-success);
}
.shadow-info:hover,
.shadow-info:focus {
    box-shadow: 0 3px 10px var(--color-info);
}
.shadow-warning:hover,
.shadow-warning:focus {
    box-shadow: 0 3px 10px var(--color-warning);
}
.shadow-danger:hover,
.shadow-danger:focus {
    box-shadow: 0 3px 10px var(--color-danger);
}
.shadow-dark:hover,
.shadow-dark:focus {
    box-shadow: 0 3px 10px var(--color-dark);
}
/* END Define All Buttons Here */

/* ———————————————————————————————————————————————————————————————————————
    "Global CSS" (Match the style of dashboard)
——————————————————————————————————————————————————————————————————————— */
.breadcrumb {
    background-color: transparent;
}

/* Tooltip */
.tooltip-inner {
    background: #fff;
    color: #333;
    border: 1px solid #aaa;
    max-width: 300px;
    padding: 10px;
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
}
.tooltip.top .tooltip-arrow,
.tooltip.bottom .tooltip-arrow {
    border-top-color: #aaa;
    border-bottom-color: #aaa;
    left: 20% !important;
}

.tooltip {
    background: transparent;
}
/* END Tooltip */

/* Search Box */
.lh-search-field .form-control {
    background-color: transparent;
    border: 1px solid #9a9d9d;
    border-right: 0;
    box-shadow: none;
}
.lh-search-field .input-group-addon {
    border: 1px solid #9a9d9d;
    border-left: 0;
    background-color: transparent;
}
.lh-search-field .input-group-addon .fa {
    color: var(--text-gray);
}
/* END Search Box */
/* ———————————————————————————————————————————————————————————————————————
    React Plugins Customization
——————————————————————————————————————————————————————————————————————— */

/* Range picker */
.date-time-range-picker button {
    border: 1px solid #888;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}
.date-time-range-picker button:hover {
    background-color: #fff;
}
.date-time-range-picker button:focus {
    border-color: #66afe9;
    background-color: #fff;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6);
}
/* END Range picker */

/* bootstrap focus style */

/* input[type=text]:focus, input[type=email]:focus, input[type=number]:focus, textarea:focus {
    border-color: #66afe9 !important;
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102,175,233,.6) !important;
} */

::-webkit-input-placeholder {
    color: var(--text-gray) !important;
    font-size: 14px;
}
::-moz-placeholder {
    color: var(--text-gray) !important;
    font-size: 14px;
}
:-ms-input-placeholder {
    color: var(--text-gray) !important;
    font-size: 14px;
}
:-moz-placeholder {
    color: var(--text-gray) !important;
    font-size: 14px;
}

/* ———————————————————————————————————————————————————————————————————————
    (Match the style of LIST TABLE)
——————————————————————————————————————————————————————————————————————— */
/* List table 1 used in Bill List */
.lh-list-table-1 .label {
    padding: 5px 10px;
}
.lh-list-table-1 .text-truncate {
    max-width: 132px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.lh-list-table-1 p {
    margin-bottom: 0;
    line-height: 34px;
    color: #2a2a2a;
}
.lh-list-table-1 .patient-id {
    color: var(--text-gray);
    line-height: 14px;
}
.lh-list-table-1 .table > thead > tr > th {
    border-bottom: 0;
    color: var(--text-gray);
}
.lh-list-table-1 .table > tbody > tr > td {
    border-top: 0;
}
.lh-list-table-1 hr {
    margin: 2px 0;
}
/* END List table 1 */

/* List table 2 used in Pending Accession & Accessed */
.lh-list-table-2 .label {
    padding: 5px 10px;
}
.lh-list-table-2 .text-truncate {
    width: 160px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.lh-list-table-2 p {
    margin-bottom: 0;
    color: #2a2a2a;
}
.lh-list-table-2 .patient-id {
    color: var(--text-gray);
    line-height: 14px;
}
.lh-list-table-2 .table > thead > tr > th {
    border-bottom: 0;
    color: var(--text-gray);
}
.lh-list-table-2 .table > tbody > tr > td {
    border-top: 0;
}
.lh-list-table-2 hr {
    margin: 4px 0;
}
.vacutainer-clr {
    height: 16px;
    width: 16px;
    border-radius: 50%;
    display: inline-block;
    margin-right: 5px;
    border: 1px solid transparent;
    vertical-align: text-bottom;
}
.vacutainer-clr-red-dark_gray {
    background: url(https://s3-ap-southeast-1.amazonaws.com/livehealthuser/media/images/templates-layout/red_darkgrey.png);
    background-size: contain;
}
.vacutainer-clr-red-light_gray {
    background: url(https://s3-ap-southeast-1.amazonaws.com/livehealthuser/media/images/templates-layout/red_lightgrey.png);
    background-size: contain;
}
.vacutainer-clr-red-green_grey {
    background: url(https://s3-ap-southeast-1.amazonaws.com/livehealthuser/media/images/templates-layout/green_grey.png);
    background-size: contain;
}
.lh-list-table-2 .dropdown .dropdown-menu {
    right: 0;
    left: auto;
    padding: 0;
}
.lh-list-table-2 .dropdown .dropdown-menu > li > a {
    padding: 6px 16px;
}
.lh-list-table-2 .dropdown .dropdown-menu > li {
    border-bottom: 1px solid #f5f5f5;
}
.lh-list-table-2 .dropdown .dropdown-menu > li:last-child {
    border-bottom: none;
}
.lh-list-table-2 .cstm-btn-position {
    position: absolute;
    display: flex;
    justify-content: flex-end;
    bottom: 0;
    right: 0;
    left: auto;
}
/* END List table 2 */

/* List table 3 used in Accession Setting */
.lh-list-table-3 .table > tbody > tr > td,
.table > tfoot > tr > td {
    border: 1px solid #e1e1e1;
}
.lh-list-table-3 .table > thead > tr > th {
    border-bottom: 0;
    color: var(--text-gray);
}
.lh-list-table-3 p {
    margin-bottom: 0;
    line-height: 34px;
    color: #2a2a2a;
}
/* END List table 3 */
.lh-search-field input:focus {
    border-color: #9a9d9d;
}
.text-align {
    text-align: center;
}

.no-mb-form .form-group {
    /* When there is "Condition Apply" or error should display */
    margin-bottom: 0;
}

.jsx-body {
    background-color: var(--bg-faded);
    min-height: 100vh;
}

.bg-fade {
    background-color: var(--bg-faded);
}

.hover-me-gray:hover {
    background-color: #f6f8fa !important;
}

.hover-me-gray:focus {
    background-color: #ddeeff !important;
}

.hide-scrollbar::-webkit-scrollbar {
    display: none;
    width: 0px !important; /* Remove scrollbar space */
    background: transparent !important;
}
.hover-me-darkGray:hover {
    background-color: #e7ebed !important;
}

.gray-button {
    background: transparent;
    border-color: #a0a2a2;
    color: #898c8c;
    cursor: pointer;
    height: 30px;
}
.gray-button:focus {
    background: #fff;
}

.lh-2 {
    line-height: 2;
}

/**FONT SIZE*/

.fs-11 {
    font-size: 11px;
}

.fs-12 {
    font-size: 12px;
}

.fs-13 {
    font-size: 13px;
}

.fs-14 {
    font-size: 14px;
}
.fs-15 {
    font-size: 15px;
}
.fs-10 {
    font-size: 10px;
}

/*__________________________________________*/

/* Active and focus classes */

.active-card {
    background-color: rgb(179, 203, 216) !important;
    border: 1px solid rgb(119, 126, 131) !important;
    font-weight: 600;
}

.hover-me:hover,
.focus-me:focus {
    border: 2px solid var(--hover-card) !important;
    cursor: pointer;
}

.hover-me-gray:hover {
    background-color: #f6f8fa !important;
}

/*__________________________________________*/
.iframe-placeholder {
    background: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 100% 100%"><text fill="%0d0d0d" x="50%" y="50%" font-family="\'Lucida Grande\', sans-serif" font-size="16" text-anchor="middle">Loading PDF....</text></svg>')
        0px 0px no-repeat;
}

/* List table 4 used in Expense Managment */
.lh-list-table-4 .label {
    padding: 5px 10px;
}
.lh-list-table-4 .text-truncate {
    width: 160px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.lh-list-table-4 p {
    margin-bottom: 0;
    color: #2a2a2a;
}
.lh-list-table-4 .patient-id {
    color: var(--text-gray);
    line-height: 14px;
}
.lh-list-table-4 .table > thead > tr > th {
    border-bottom: 0;
    color: var(--text-gray);
}
.lh-list-table-4 .table > tbody > tr > td {
    border-top: 0;
}
.lh-list-table-4 hr {
    margin: 2px 0;
}
.vacutainer-clr {
    height: 16px;
    width: 16px;
    border-radius: 50%;
    display: inline-block;
    margin-right: 5px;
    border: 1px solid transparent;
    vertical-align: text-bottom;
}
.vacutainer-clr-red-dark_gray {
    background: url(https://s3-ap-southeast-1.amazonaws.com/livehealthuser/media/images/templates-layout/red_darkgrey.png);
    background-size: contain;
}
.vacutainer-clr-red-light_gray {
    background: url(https://s3-ap-southeast-1.amazonaws.com/livehealthuser/media/images/templates-layout/red_lightgrey.png);
    background-size: contain;
}
.vacutainer-clr-red-green_grey {
    background: url(https://s3-ap-southeast-1.amazonaws.com/livehealthuser/media/images/templates-layout/green_grey.png);
    background-size: contain;
}
.lh-list-table-4 .dropdown .dropdown-menu {
    right: 0;
    left: auto;
    padding: 0;
}
.lh-list-table-4 .dropdown .dropdown-menu > li > a {
    padding: 6px 16px;
}
.lh-list-table-4 .dropdown .dropdown-menu > li {
    border-bottom: 1px solid #f5f5f5;
}
.lh-list-table-4 .dropdown .dropdown-menu > li:last-child {
    border-bottom: none;
}
.lh-list-table-4 .cstm-btn-position {
    position: absolute;
    display: flex;
    justify-content: flex-end;
    bottom: 0;
    right: 0;
    left: auto;
}
/* END List table 2 */

.row-rev {
    flex-direction: row-reverse;
}

.enable-scroll::-webkit-scrollbar {
    display: block !important;
    width: 8px !important; /* Remove scrollbar space */
    height: 8px !important; /* R
}
.enable-scroll::-webkit-scrollbar-track {
	/* -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3); */
    border-radius: 10px;
    background-color: #f5f5f5;
}
.enable-scroll::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-color: #b9b8b8;
}

.react-select-field__indicators,
.react-select-field__value-container,
.react-select-field_async__value-container--has-value {
    top: -4px;
    position: relative;
}

.exception-async-select__indicator-separator {
    top: -1px;
    position: relative;
}

.exception-async-select__indicator,
.exception-select .react-select-field__value-container {
    padding-bottom: 5px;
    padding-top: 0;
    margin-top: 1px;
}

.exception-select .react-select-field__control--is-focused .exception-async-select__indicator,
.exception-select .react-select-field__control--is-focused,
.exception-select .react-select-field__control--is-focused .react-select-field__value-container {
    padding-bottom: 5px;
    padding-top: 0;
}

.exception-select .react-select-field__value-container,
.exception-async-select__value-container {
    top: -2px;
}

.exception-select .react-select-field__control--is-focused .react-select-field__value-container {
    top: -4px;
}

.list-wrapper {
    position: relative;
}
.list-item-wrapper {
    margin-top: 10px;
    position: relative;
}
.list-bullet {
    float: left;
    margin-right: 8px;
    background: #a09f9f;
    height: 13px;
    width: 12px;
    line-height: 18px;
    border-radius: 46px;
    font-weight: 700;
    color: white;
    text-align: center;
}
.list-item {
    display: table-row;
    vertical-align: middle;
}
.list-title {
    font-weight: 700;
}
.list-text {
    font-weight: 400;
}
.red-line {
    background: #b9b9b9;
    z-index: 0;
    width: 1px;
    height: 100%;
    position: absolute;
    left: 6px;
}

.timeline-with-step {
    background: #b9b9b9;
    z-index: 0;
    width: 1px;
    height: 90%;
    position: absolute;
    left: 6px;
}

.white-line {
    background: #fff;
    z-index: -1;
    top: 0px;
    width: 1px;
    height: 100%;
    position: absolute;
    left: 15px;
}

.custom-option-list {
    max-width: 300px;
    max-height: 300px;
    overflow: scroll;
}

.custom-menu-item a,
.custom-menu-item a:hover,
.custom-menu-item a:active {
    font-size: 13px;
    text-decoration: none;
    color: #000;
    padding: 0px 10px;
}

.custom-menu-item a,
.two-line-ellipsis {
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    -webkit-box-orient: vertical;
    font-size: 13px;
    line-height: 1.5;
    -webkit-line-clamp: 2 !important;
    color: #353535;
    display: -webkit-box;
}

.custom-menu-item:hover {
    background: #efefef;
}
.bg-default {
    background: #eef0f1;
}

.bg-v4 {
    background: #eef0f1;
    padding: 0px 15px;
    height: calc(100vh - 50px);
}

.flex-1 {
    flex: 1;
}

.hide-border .modal-content {
    box-shadow: none !important;
    border: none !important;
    margin-top: 2px;
}

.input-with-list-field-button {
    border: 1px solid #aaa !important;
}

.hover-on-red:hover {
    color: red !important;
}

.patient-req-custom-popover {
    top: 58px !important;
    left: -142px !important;
    width: 800px !important;
    border-radius: 0px !important;
    max-width: 330px !important;
}

.hide-arrow > .arrow {
    display: none;
}

.reject_button {
    margin-right: 8px;
    border-radius: 0;
}

.accept_button {
    margin-right: 13px;
    border-radius: 0px;
}
.first_col {
    color: gray;
    font-size: 12px;
    padding-top: -8px;
    margin-top: -9px;
}
.text_color {
    color: gray;
}

/* Loading dots css */
.spinner {
    width: 44px;
    text-align: center;
}

.spinner > div {
    width: 4px;
    height: 5px;
    margin: 0.5px;
    background-color: #6e6264;
    border-radius: 100%;
    display: inline-block;
    -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
    animation: sk-bouncedelay 1.5s infinite ease-in-out both;
}

.spinner .bounce1 {
    -webkit-animation-delay: -0.32s;
    animation-delay: -0.32s;
}

.spinner .bounce2 {
    -webkit-animation-delay: -0.16s;
    animation-delay: -0.16s;
}

@-webkit-keyframes sk-bouncedelay {
    0%,
    80%,
    100% {
        -webkit-transform: scale(0);
    }
    40% {
        -webkit-transform: scale(1);
    }
}

@keyframes sk-bouncedelay {
    0%,
    80%,
    100% {
        -webkit-transform: scale(0);
        transform: scale(0);
    }
    40% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}
.label_for_generate_invoice {
    margin-left: 46%;
}

.label_checkbox {
    margin-left: 7px;
    font-weight: normal;
    font-size: 13px;
    font-weight: 400;
    padding-bottom: -5px;
}

.list-bullet-border {
    float: left;
    margin-right: 8px;
    background: #a09f9f;
    height: 13px;
    width: 12px;
    line-height: 18px;
    border-radius: 46px;
    font-weight: 700;
    color: white;
    text-align: center;
    border : 1px solid lightgray;
    min-width: 12px;
}

.hover-me-border:hover {
    border: 2px solid var(--hover-card) !important;
}

.m-auto {
    margin: auto !important;
}

.v-divider {
    border-left:1px solid #686868; 
    width: 0px;
    height:80px;
}

.border-right {
    border-right: 1px solid #dee2e6;
}

.font-size-14{
    font-size: 14px;
}

.patient-card {
    box-shadow: 0 2px 6px 1px rgb(78 77 77 / 20%);
    padding: 10px;
}

.max-height-300 {
    max-height: calc(100vh - 380px);
    overflow: auto;
}

.text-white {
    color: #fff;
}

.mx-4 {
    margin-right: 1.5rem!important;
    margin-left: 1.5rem!important;
}

.justify-content-end {
    justify-content: end;
}

.account-manager-height {
    height: calc(100vh - 90px);
}

.payment-header {
    font-size: 32px;
    font-weight: bolder;
    margin-bottom: 30px;
}

.faq {
    font-size: 32px;
    font-weight: bolder;
}

.payment-info {
    display: flex;
    flex-direction: column;
    padding: 3rem;
}

.text-align-last-center {
    text-align-last: center
}
.text-align-last-left {
    text-align-last: left
}

.d-grid {
    display: grid;
}

.payment-faq {
    margin-top: auto;
    margin-bottom: auto;
    padding-top: 20px;
    padding-bottom: 20px;
}
.vh-100 {
    height: 100vh;
}

.panel-group > .panel-default {
    border-radius: 0px !important;
    margin-top: 0px !important;
}

.panel-group > .panel-default:first-child {
    border-top-right-radius: 4px !important;
    border-top-left-radius: 4px !important;
    margin-top: 0px !important;
}

.panel-group > .panel-default:last-child {
    border-bottom-right-radius: 4px !important;
    border-bottom-left-radius: 4px !important;
    margin-top: 0px !important;
}

.panel-group > .panel:not(:first-child) > .panel-heading {
    border-radius: 0px !important;
}

.text-decoration-none {
    text-decoration: none !important;
}

.flex-column {
    flex-direction: column;
}

.payment-form-width {
    width: 60%;
    text-align: center;
}

.overflow-y-scroll {
    overflow-y: scroll;
}

@media (max-width: 1600px) {
    .payment-form-width {
        width: 100%;
    }
  }

.cursor-pointer{
    cursor: pointer
}

.line-height-initial {
    line-height: initial;
}