﻿/*SELECT BACKGROUNDS*/
/*a {
    background-color: white;
}*/

/*SELECT BACKGROUNDS*/
/*a {
    background-color: white;
}*/
/*

This is for the loader gif
.no-js #loader { display: none;  }
.js #loader { display: block; position: absolute; left: 100px; top: 0; }
.se-pre-con {
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	z-index: 9999;
	background: url('../images/Preloader_1.gif') center no-repeat #fff;
}
*/

/*-------------------------------------------------
    Common UI Treatment
-------------------------------------------------*/
/*These 3 lines plus main-content flex1 keep footer pinned to bottom*/
body {
    display: flex;
    min-height: 100vh;
    flex-direction: column;
}

body .main-content {
    flex: 1;
}

a.subtle {
    color:#95a5a6;
    font-size:15px;
}

h1 {
    font-size: 2rem;
    line-height: 2rem;
    margin-left: 0px;
    margin-top: 0px;
}

h1 i {
    font-size:2rem !important;
    line-height:2rem !important;
}

h2 {
    font-size: 1.3rem;
    line-height: 1.3rem;
}

td, li, div, p, span {font-size:14px;}

/*This is to remove number input buttons*/
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    /* display: none; <- Crashes Chrome on hover */
    -webkit-appearance: none;
    margin: 0; /* <-- Apparently some margin are still there even though it's hidden */
}

.checkbox label, .radio label {
    line-height: inherit;
}

input[type=radio] {
    margin: 10px 0 0;
}

.form-control, .select2-search input[type="text"] {
    border: 1px solid #bdc3c7;
}

.input-group-btn .btn {
    border: 1px solid #bdc3c7;
}

.panel-default {
    border: 1px solid #E8E8E8;
}

.dropdown-menu {
    border: 1px solid #bdc3c7;
}

.ui-spinner-input {
    width: 100%;
}

.ui-datepicker {
    border: 1px solid #3498db;
    border-radius: 8px;
}

    .ui-datepicker .ui-datepicker-header {
        margin: initial;
    }

    .ui-datepicker .ui-datepicker-next {
        border: none;
    }

    .ui-datepicker .ui-datepicker-prev {
        border: none;
    }

/*service formset padding*/
.table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td {
    padding: 9px 0.33rem;
}

.navbar {
    border-radius: 0px;
}

.alert {
    color: #a94442;
}

.alert.alert-success, .alert.alert-info {
    color: #1abc9c;
}

.table .checkbox, .table .radio {
    margin: 6px 0 0 -9px
}

.checkbox {
    position: absolute;
}

.select {
    width: 100%;
}

/*readonly visitdate*/
.form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control, .select2-search input[type="text"][disabled], .select2-search input[type="text"][readonly], fieldset[disabled] .select2-search input[type="text"] {
    color: grey;
}

.modal-backdrop {
    z-index: 0;
}

button:focus, button:active, input[type=checkbox]:focus {
    outline: 1px dotted #bdc3c7 !important;
}

/*Prevent browser auto background color on auto-complete. Note some browsers like Chrome won't permit overrides of this.*/
input:autofill, input:-webkit-autofill {
    background-color: #fff !important;
    -webkit-box-shadow: none;
}

/*-------------------------------------------------
    Select2 overrides
-------------------------------------------------*/

.select2-selection {
    min-height: 41px !important;
    border-radius: 6px !important;
    border: 1px solid #bdc3c7;
}

.select2-container .select2-selection__rendered {
    padding-left: 0px !important;
}

.select2-container .select2-selection__arrow {
    height: 41px !important;
}

/*custom css class added stop drop down container */
.select2-drop, .select2-drop-nosearch {
    margin-top: 0px;
}

.select2-drop .select2-search {
    display: block;
}

.select2-drop input[type=search],
.select2-drop input[type=search]:focus {
    outline: none;
}


.select2-results__option--highlighted {
    background-color: #16a085 !important;
}

.select2-choice {
    border: 1px solid #bdc3c7;
    color:inherit;
}

.multiselect.form-control, .multiselect.select2-search input[type="text"] {
    border: 1px solid #bdc3c7;
}

.select2-container-disabled .select2-choice {
    opacity: .5;
    color: grey
}

/*Reference
/* Input field 
.select2-selection__rendered {
}

/* Around the search field 
.select2-search {
}

    /* Search field 
    .select2-search input {
    }

/* Each result 
.select2-results {
}

/* Higlighted (hover) result 
.select2-results__option--highlighted {
}

/* Selected option 
.select2-results__option[aria-selected=true] {
}
*/

/*Multi-select overrides*/
.select2-container--default.select2-container--focus .select2-selection--multiple {
    border: 1px solid #1abc9c;
    outline: 0;
    box-shadow: none;
}

.select2-container--default .select2-selection--multiple {
    padding: 0px 10px;
    height:auto;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice {
    margin-top: 0px;
    font-size:17px;
}

.select2-container--default .select2-selection--multiple .select2-selection__rendered li
{
    margin-top:6px;
    margin-bottom:2px;
}

/*-------------------------------------------------
    UI Helper Classes
-------------------------------------------------*/
.white {
    color: #ffffff;
}
.green {
    color: #1abc9c;
}
.dark-gray {
    color:#526476;
}

.red {
    color: #e74c3c;
}

.danger {
    color:#e74c3c; 
}

.text-wrap {white-space:normal;}

.bg-light-grey {
    background-color: #F9F9F9;
}
.bg-med-grey {
    background-color: #bdc3c7 !important;
}

.b-500 {
    font-weight: 500;
}
.b-600 { font-weight:600; }

.chk-lg {height:18px;}
.row.top .chk-lg {margin-top:13px;}

.btn-icon {
    background-color: transparent !important;
    padding: 0px;
    line-height: 1;
}
.btn-icon i {font-size:42px;}
.btn-icon:hover {color:inherit; }
.btn-icon:hover i {color:inherit; opacity: 0.8;}

/*-------------------------------------------------
    input read-only label
-------------------------------------------------*/
.read-only-label-style {
    border: none;
    background-color: transparent !important;
    color: #000 !important;
    font-weight: 400;
}

/*-------------------------------------------------
    TBD - come back to this and see if something upstream is not set properly
-------------------------------------------------*/
.input-group .input-group-addon.money {height:42px; line-height:15px;}

/*-------------------------------------------------
    Page Specific Treatments
-------------------------------------------------*/
.panel-header {display: flex;}

.panel-header.center {
    align-items: center;
    justify-content: center;
    padding-left: unset;
}
.panel-header i {font-size:34px; line-height:34px;}
.panel-header h1 {margin-bottom: 0px;display:inline !important;}

/*-------------------------------------------------
    Other overrides
-------------------------------------------------*/
.btn-primary {
    color: #fff !important;
}

.migrated label {
    min-height: 42px;
    height: auto;
}

/*-------------------------------------------------
    Validation overrides
-------------------------------------------------*/
    .validation-summary-errors ul {
    padding-left:0px;
}
.validation-summary-errors ul li {
    list-style-type: none;
}

/*-------------------------------------------------
    Navbar overrides
-------------------------------------------------*/
.navbar .nav-link {
    height: 100% !important;
    line-height: unset;
}
.navbar .navbar-text {
    line-height:unset;
}

.navbar-inverse .navbar-collapse.show {
    border: solid 2px #2f4154;
}

/*-------------------------------------------------
    Spinner overrides
-------------------------------------------------*/
.ui-spinner {
    width: 100%;
}
.ui-spinner-input {
    font-size: 15px;
    font-weight: normal;
}

/*-------------------------------------------------
    Calendar overrides - force it to appear on top
-------------------------------------------------*/
.ui-datepicker {z-index:9999 !important;}

/*-------------------------------------------------
    Admin sidebar
-------------------------------------------------*/
body.admin {
    /*
    background-color: #ecf0f1;
    display: flex;
    align-items: stretch;
    */
    display: block;
}

.admin .sidebar {
    background-color: #ecf0f1;
    transition: all 0.3s;
}

.admin .sidebar .nav-link {
    color: inherit;
}

.admin .sidebar .dropdown-menu {
    min-width: unset;
    background-color: inherit;
}

.admin .sidebar ul.side-menu li {
    list-style:none;
}

.admin .sidebar .dropdown-item:active, 
.admin .sidebar .dropdown-item:focus, 
.admin .sidebar .dropdown-item:hover {
    background-color: #1abc9c;
    color:#ffffff;
}

.navbar .dropdown-item.active,
.navbar .dropdown-item:active, 
.admin .sidebar .dropdown-item.active {
    background-color: #F9F9F9;
    color: #1abc9c;
}
.admin .sidebar .dropdown-item.active:after {
    content:"\25BA";
    font-weight:bold;
    text-align: right;
    float:right;
    color:inherit;
}

.admin .wrapper .content {
    width: 100%;
    float: left;
    margin-left: 250px;
    background-color: #F9F9F9;
    transition: all 0.3s;
}

/*Inactive data rows treatment*/
.admin tr.inactive > td {
    background-color: #dedede;
    color: #95a5a6;
}

/*-------------------------------------------------
    Login Page
-------------------------------------------------*/
.login-container {
    background-color: #ecf0f1;
    border-radius: 10px;
    margin-top: 60px;
    margin-bottom: 80px;
}

.login-container h1 {
    padding:10px;
    font-size:40px;
    line-height: 40px;
}

.login-container h1 i.material-icons {
    font-size: 40px;
    vertical-align: top
}


/*-------------------------------------------------
    Slide in Panel
-------------------------------------------------*/
.slide-in-panel {
    z-index: 1030;
    width: 340px;
    margin-right: -340px;
    min-height: 240px;
    height: 100vh;
    background-color: #ffffff;
    position: fixed;
    top: 0;
    right: 0;
    transition: all 500ms ease-out;
    overflow-y: auto;
}

    .slide-in-panel.auto-height {
        height: auto;
    }

    .slide-in-panel.open {
        margin-right: 0;
    }

    .slide-in-panel .panel-header {
        height: 62px;
        color: #fff;
    }

        .slide-in-panel .panel-header .title {
            font-size: 1.2rem;
            font-weight: 700;
        }

        .slide-in-panel .panel-header i {
            font-size: 1.4rem;
        }

.help-toggle-open:hover, .help-toggle-open.open, .help-toggle-close:hover {
    color: #16a085;
    cursor: pointer;
}

@media (max-width: 400px) {
    .slide-in-panel {
        top:62px;
        width: 90%;
        margin-right: -91%;
    }
    .slide-in-panel.open {
        margin-right: 0;
    }

    .slide-in-panel.auto-height {
        width: 100%;
        margin-right: -101%;
    }
    .slide-in-panel.auto-height.open {
        margin-right: 0;
    }
}

/*-------------------------------------------------
    Patient List
-------------------------------------------------*/
/*-------------------------------------------------
    Visit Service, Visit Lab Test
-------------------------------------------------*/
.form-control.diagnosis-label { line-height:44px;}

.visit-lab-test .row .select {
    min-width: unset;
    width: 100%;
}
.visit-lab-test .row .select a {
    padding: 10px;
}
.visit-lab-test-list li {
    list-style-type:none;
}
.visit-service .row.pending-delete, .visit-lab-test .row.pending-delete {
    background-color: #E8E8E8;
    opacity: .6;
}

@media (max-width: 768px) {
    .visit-lab-test .row .select a {
        padding: 6px;
    }
}

/*-------------------------------------------------
    Pagination
-------------------------------------------------*/
.pagination {
    width: 100%;
    text-align: center;
}

.pager-nav {
    display: inline-block;
}
.pager-label {
    display:inline-block;
}

/*-------------------------------------------------
    Table header sort indicator
-------------------------------------------------*/
table thead th.sort-header {
    color: #1abc9c;
}
table thead th.sort-header:hover {
    opacity: 0.8;
    cursor:pointer;
}
table thead th.sort-header[data-sort=asc]:after {
    margin-left: 2px;
    font-family: 'Material Icons';
    content: "arrow_drop_up";
    -webkit-font-feature-settings: 'liga';
}
table thead th.sort-header[data-sort=desc]:after {
    margin-left: 2px;
    font-family: 'Material Icons';
    content: "arrow_drop_down";
    -webkit-font-feature-settings: 'liga';
}
