﻿::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
background-color: #F5F5F5;
}

::-webkit-scrollbar {
width: 6px;
background-color: #F5F5F5;
}

::-webkit-scrollbar-thumb {
height:25px;
background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0.44, rgb(152,100,191)), color-stop(0.72, rgb(91,46,145)), color-stop(0.86, rgb(91 46 145)));
}

::-webkit-scrollbar-thumb:hover {
background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0.44, rgb(236,223,255)), color-stop(0.72, rgb(91,46,145)), color-stop(0.86, rgb(91 46 145)));
}

body::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(255,255,255,1);
    background-color: #fff;
}

body::-webkit-scrollbar {
    width: 8px;
    background-color: #fff;
}

body::-webkit-scrollbar-thumb {
height: 25px;
background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0.44, rgb(255,255,255)), color-stop(0.72, rgb(91,46,145)), color-stop(0.86, rgb(255 255 255)));
}

body::-webkit-scrollbar-thumb:hover {
    /*border-radius: 10px;*/
    background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0.72, rgb(91,46,145)), color-stop(0.72, rgb(91,46,145)), color-stop(0.72, rgb(91,46,145)));
}

#blazor-error-ui.hidden {
    display:none;
}

.alert-no-caption {
    padding: .25rem 1.25rem !important;
}

.noselect {
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Old versions of Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome, Edge, Opera and Firefox */
}

.mandatory:after {
    content: "*";
    color: red;
    z-index: 999;
    position: absolute;
    top: 4%;
    left: 3px;
    font-size: 14px;
}

.tele-health-icon {
    cursor: pointer;
    opacity: 0.64;
    font-size: 1.1rem;
    font-weight: 600;
}

.app-content {
    /*position: relative;*/
    min-height: 100%;
    margin: 10px 10px 0 250px !important;
    background-color: var(--white);
    border-radius: 10px;
    padding: 5px 10px !important;
}

.app-container {
     
}

@keyframes fadeIn {
    from {
        opacity: .5;
    }
}

.app-loader {
    animation: fadeIn .8s infinite alternate;
}

input[type=date] {
    cursor:pointer;
}

.btn-light {
    background-color: #fcfcfc;
    border: 1px solid rgb(201, 210, 227);
}

.btn-light:hover {
    background-color: #f6f1fc;
}

.btn-rounded {
    color: #212837 !important;
}

.btn-grid {
    background-color: transparent;
    border: 1px solid transparent;
    color: darkblue;
    line-height: 2;
    text-align: center;
    padding: 4px 7px;
}

.btn-grid:hover {
    background-color: #f5f5f5;
    border: 1px solid #e1e1e1;
    border-radius: 3px;
    cursor: pointer;
}

.btn-grid:active {
    background-color: #ccc;
}

.btn-grid.disabled {
    background-color: transparent;
    border: 1px solid transparent;
    color: #ccc !important;
    text-align: center;
}

.custom-select:focus {
    border-color: #ffffff;
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgb(205 144 231 / 25%);
}

.custom-select-ui-fix {
    background: none !important;
    border: none !important;
    padding: 0 !important;
}

.btn-light.focus, .btn-light:focus {
    background-color: #fcfcfc;
}

.btn-light:not(:disabled):not(.disabled).active, .btn-light:not(:disabled):not(.disabled):active, .show > .btn-light.dropdown-toggle {
    background-color: #fafafa;
}

.form-group {
    margin-bottom: 1rem;
    width: 100%;
}

.dropdown-toggle {
    text-align:left;
    display:block;
    width:100%;
}

.dropdown-toggle::after {
    position: absolute;
    right: 10px;
    top: 15px;
}

.mdc-typography--headline5, .mat-headline5, .mat-h5 {
    line-height:1rem !important;
}

.h5, h5 {
    font-size: 1.09375rem !important;
}

/*.sticky_headers {
    overflow-y: auto;
}

.sticky_headers th {
    position: sticky;
    top: -2px;
    z-index: 50;
}*/

.sticky_headers {
    overflow: auto;
    min-height: 300px;
    width: 100%;
}

.sticky_headers thead th {
    position: sticky;
    top: 0;
    z-index: 50;
}

.sticky_headers tbody th {
    position: sticky;
    left: 0;
}


.pl-tbl-light {
    height: calc(100vh - 220px);
    border: 1px solid #ccc;
    border-radius: 2px;
}

.table > :first-child > tr:first-child td, .table > :first-child > tr:first-child th {
    border-top: 0;
}

.table .thead-light th {
    color: var(--white) !important;
    background-color: var(--purple) !important;
    border-color: var(--light-purple) !important;
    padding: 0.50rem !important;
    z-index: 50 !important;
    vertical-align: middle !important;
    text-align: center !important;
}

.table thead th {
    color: #848484 !important;
    /*background-color: var(--purple) !important;
    border-color: var(--light-purple) !important;*/
    background-color: rgb(253 253 253) !important;
    border-color: #e6ecf9 !important;
    padding: 0.50rem !important;
    z-index: 50 !important;
    vertical-align: middle !important;
    text-align: center !important;
}

.table td, .table th {    
    font-size: .815rem;
}

.table-bordered td {
    border-color: var(--light-purple2) !important;
}

.mdc-text-field__input {
    font-size: var(--mdc-typography-subtitle1-font-size, .8rem) !important;
    margin-top: 6px;
}

.mdc-text-field--filled {
    height: 45px !important;
}

.mdc-text-field .mdc-floating-label {    
    font-size: .8rem !important;
}

/* TeleHealth Call - Start */
.incoming-call-notification {
    padding: 15px 3%;
    background: #fff;
    border-radius: 5px;
    -moz-box-shadow: 0px 0px 9px 0px #333;
    -webkit-box-shadow: 0px 0px 9px 0px #333;
    box-shadow: 0px 0px 9px 0px #333;
    color: rgba(0,0,0,.6);
    height: 120px;
    position: fixed;
    right: 100px;
    top: -250px;
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    transition: all 0.2s linear;
    z-index: 99999999;
}

.incoming-call-notification .call-modal-initiator {
    text-transform:capitalize;
}

.incoming-call-notification-img {
    border: 3px solid #00b3e3;
    border-radius: 50%;
    width: 70px;
    background-repeat: no-repeat;
    background-size: cover;
    margin-right: 10px;
    height: 70px;
}

.incoming-call-notification.open {
    top: 50px;
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    transition: all 0.2s linear;
}



.disablefabricbutton {
    color: #ccc !important;
}

.TeleHealth-video {
    height: 356px;
    width: 430px;
    position: absolute !important;
    top: 4px;
    left: -41px;
    z-index: 0;
    background: #333 !important;
}

.mandatory:after {
    content: "*";
    color: red;
    z-index: 999;
    position: absolute;
    top: 4%;
    left: 3px;
    font-size: 14px;
}

.activated:after {
    content: '\2713';
    color: forestgreen !important;
    padding: 0 6px 0 0;
    z-index: 999;
}

#components-reconnect-modal {
    z-index: 99999999 !important;
}



/* TeleHealth Call - End */


.tele-health-loader {
    margin: 0 auto;
    font-size: 8px;
    position: relative;
    text-indent: -9999em;
    border-top: 0.3em solid rgba(255, 255, 255, 0.2);
    border-right: 0.3em solid rgba(255, 255, 255, 0.2);
    border-bottom: 0.3em solid #cf71ff;
    border-left: 0.3em solid #cf71ff;
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-animation: load8 1.1s infinite linear;
    animation: load8 1.1s infinite linear;
}

.tele-health-loader, .tele-health-loader:after {
    border-radius: 50%;
    width: 3em;
    height: 3em;
}

@-webkit-keyframes load8 {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes load8 {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

.w-room-list {
    display: flex;
    flex-direction: column;
    border-left: 1px solid #e1e1e1;
    height: 100%;
    padding: 5px;
    margin: 5px;
}

.w-room-img {
    background-image: url(https://cdn.ruhbaru.com/filestore/patients/pt-p1.jpg);
    border: 2px solid var(--light-purple);
    border-radius: 50%;
    width: 40px;
    height: 40px;
    background-repeat: no-repeat;
    background-size: cover;
}

.cfc_form .validation-message {
    font-size: 11px;
    position: absolute;
    top: 26px;
    left: 0px;
    background-color: transparent;
    padding: 3px 10px;
    z-index: 2;
}

.cfc_form .validation-message:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 0;
    border: 12px solid transparent;
    border-bottom-color: maroon;
    border-top: 0;
    border-left: 0;
    margin-bottom: -10px;
}

.cfc_form .cfc_form_control {
    position: relative;
}

#modalApptSetup .custom-select-ui-fix {
    background: none !important;
    border-color: #c2cbdd;
    padding: 5px !important;
}

#modalApptSetup .bootstrap-select {
    width: 100% !important;
    padding: 0 5px;
}

#modalApptSetup .bootstrap-select .dropdown-toggle .filter-option {
    padding-right: 2rem;
}

#modalApptSetup .bootstrap-select .dropdown-menu li {
    position: relative;
    width: 100%;    
    white-space: pre-line;
    display: block;
    float: left;
    line-height: 1em;
}

#modalApptSetup .bootstrap-select .dropdown-menu.inner {
    overflow: hidden;
}

#modalApptSetup .select2-container, #modalCaseInfo .select2-container {
    width: 100% !important;
    padding: 0 5px 0px 0px;
}

#modalApptSetup .appt-client-select-container .dropdown-toggle, #modalApptSetup .appt-client-select-container .dropdown-menu {
    display:none !important;
}

#modalApptSetup .dropdown-menu.show {    
    width: 100%;
}

.select2-dropdown {
    border: 1px solid rgb(201, 210, 227) !important;
    border-radius: 6px !important;
    box-shadow: 0 0 7px 1px rgb(201 210 227) !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #444;
    line-height: unset;
}
.select2-container .select2-selection--single .select2-selection__rendered {
    display: block;
    padding-left: 0;
    padding-right: 20px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.select2-container .select2-selection--single {
	height:35px !important;
}

.select2-container--default .select2-selection--single {
    background-color: #fcfcfc !important;
    border: 1px solid rgb(201, 210, 227) !important;
    padding: .180rem .180rem !important;
    font-size: .875rem;
    line-height: 1.5;
    border-radius: 6px !important;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.select2-container--default .select2-selection--single:hover {
    background-color: #f6f1fc !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 26px;
    position: absolute;
    top: 5px !important;
    right: 11px !important;
    width: 20px;
}

.select2-container--default .select2-selection--single .select2-selection__arrow b {
    height: 0;
    left: 50%;
    margin-left: -4px;
    margin-top: -2px;
    position: absolute;
    top: 50%;
    width: 0;
    content: "";
    border-top: .3em solid !important;
    border-right: .3em solid transparent !important;
    border-bottom: 0 !important;
    border-left: .3em solid transparent !important;
}

.select2-container .patient-search {
    display: flex;
}

.select2-container .patient-search .patient-img {
    border: 2px solid var(--light-purple);
    border-radius: 3px;
    width: 50px;
    height: 50px;
    background-repeat: no-repeat;
    background-size: cover;
}

.client-search-main-layout .select2-container--default .select2-selection--single {
    padding: .390rem .180rem !important;
    font-size: 1rem !important;
    border: none !important;
    height: 40px !important;
    background-color: transparent !important;
    border-color: transparent !important;
}

.client-search-main-layout .select2-container--default .select2-selection--single .select2-selection__placeholder {
    color: var(--gray) !important;
}

.client-search-main-layout .select2-container--default .select2-selection--single .select2-selection__arrow {
    display: none !important;
}

.client-search-main-layout .select2-container {
    width: 100% !important;
}

/*.menu-search-input {
    margin-left: 46px !important;
}*/

.client-search-main-layout .select2-container--default .select2-selection--single {
    margin-left: 46px !important;
}

.client-search-main-layout .search-container {
    background-color: #ebeef4;
    padding: .175rem;
    border-radius: 6px;
}

#div-diagnostics .select2-container .select2-selection--multiple {
    min-height: 63px !important;
}

.calendarCellsDiv {
    -webkit-transition: all .1s linear; /* Safari */
    transition: all .1s linear;

}

.cal-type-btn {
    -webkit-transition: all .1s linear;
    transition: all .1s linear;
    outline:none !important;
}

.cal-type-btn:focus {
    outline: none !important;
}

.cal-type-btn:hover {
    background-color: #F9F5FE !important;
}

.hover-to90:hover {
    height: 90px !important;
}

.hover-to120:hover {
    height: 120px !important;
}

.appt-box-medical-alert-flag-container {
    display: flex;
    z-index: 20;
    position: absolute;
    right: 10px;
    top: 2px;
    align-items: center;
}

.appt-box-medical-alert-flag {
    font-size: 13px !important;
    cursor: pointer;
    height: 14px;
    color: #e61b0f;
    margin: 0 5px;
}

.appt-box-medical-alert-flag:hover {
    opacity: .6;
}

.blazor-context-menu__item--default {
    padding: 0 6px !important;
}

.boxlinks {
    text-transform:capitalize;
}

.text-overflow-two-lines {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;            
    -webkit-line-clamp: 2;
}

.text-disabled {
    color: var(--gray-400) !important;
}

.btn-link {
    color: #1f6bff !important;
    cursor:pointer;
}

.grid-personnel, .grid-room {
    height: calc(100vh - 262px);
}

#modalEduSetup .select2-selection__clear {
    margin-right: 28px;
}

.demo-notification {
        position: absolute;
    }

.demo-notification .k-notification {
    width: 420px;
}

#demo-runner {
    height: 400px;
}

.stock-info-message {
    font-size: 16px;
    font-weight: bold;
    padding-left: 6px;
    padding-top: 5px;
    margin: 0;
}

.stock-info-time {
    padding-left: 6px;
    font-size: 13px;
    font-style: italic;
    text-align: right;
    margin: 3px;
}

.k-notification-container {
    margin: 6px 0;
}

.redcolor {
    color: #f00;
    margin-right: .2rem;
}

.k-grid {
    font-size: 0.8rem !important;
}

.grid-report {
    height: calc(100vh - 150px);
}

.mdc-dialog { 
    z-index: 999999 !important;
}

.mdc-dialog .mdc-dialog__surface {
    max-width: unset !important;
}