/*************************** Tabs in the navigation ***********************/
.nav-tabs {
    margin-bottom: 0px;
    border-bottom: none;
}

.navbar {
    /*padding: 0px;*/
    border-bottom: 1px solid #dee2e6;
}


/************************** Logged out menu ******************************/

.navbar-loggedout a.nav-link {
    color: black;
    padding-left: .13em !important;
    padding-right: .13em !important;
}


/****************** accuracy/confidence/efficiancy panel ******************************/

.accuracy-panel-images img {
    margin: 0px;
    width: 180px;
    height: 154px;
}

div.navbar-nav .nav-tabs .nav-item {
    margin-bottom: -5px !important;
}

.navbar, .login-navbar {
    margin-bottom: 0px !important;
}



.quick-links {
    margin-top: 120px;
}


@media all and (max-width: 600px) {

    /* styles here */
    .homepageMainImage {
        height: auto;
    }
}

@media only screen and (max-width: 768px) {
    /* For mobile phones: */
    .quick-links {
        margin-top:10px;
        height: 300px;
    }

        .quick-links div.dotted-divider {
            width: 50% !important;
        }


    #homeImage {
        display:none;
    }

    .btn-outline-secondary {
        min-width:unset !important;
    }
}


.alert {
    margin-bottom: 1px;
}

a.case-action-link, a.orange-link {
    color: #ff9e18;
}

    a.case-action-link:visited, a.orange-link:visited {
        color: #ff9e18;
    }

div.daterangepicker-container input.daterangepicker {
    min-width: 13em;
}

div.datepicker input.datepicker {
    min-width: 10em;
}

#caseFilterBar input, #caseFilterBar select {
    min-width: 15em;
}

#caseFilterBar .nav-item {
    padding-left: .5em;
    padding-right: .5em;
}

/*************************** Surgeon Profile ***********************/
#surgeon-profile-navigation {
    border-bottom: 1px solid #dee2e6;
}

#surgeon-settings {
    margin-top: 2rem;
}

    #surgeon-settings > div:nth-child(n+1) {
        margin-top: 2rem;
    }

    #surgeon-settings #email {
        width: 24rem;
    }

#surgeon-sales-rep-panel {
    padding: 1.5rem 0 1.5rem 2rem;
    background: #f5f7fa;
}

#surgeon-settings-row, #surgeon-sales-rep-panel, .side-panel, #surgeon-settings-row {
    min-height: 100%;
}

#content {
    height: 100%;
}

.side-panel {
    /*height: 85vh;*/
}

.implant-card-img {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 250px;
}
/*************************** Surgeon Notifications ***********************/
#notifications {
    margin-top: 2rem;
}

#btnSaveNotifications {
    margin: 2rem 2rem 2rem 0;
}

#notification-emails #additionalEmails {
    max-width: 50rem;
}

.agreement-checkbox {
    padding-left: 1rem;
}


.button-tooltip {
    vertical-align: middle;
    display: inline-block;
    min-width: 80px;
    padding: 12px 11px;
}

.panel-image-rightborder {
    margin-top: -90px;
}

.panel-image-leftborder {
    margin-bottom: -90px;
}

.case-listing {
    padding-top: .5em;
    padding-right: 0;
}


.body-left-padding {
    padding-left: 1em;
}

.btn.btn-primary.button-case-action.modal-button-hidden {
    display: none !important;
}
.btn.btn-primary.button-case-action.modal-button-visible {
    display: block !important;
}
/*************************** File Upload ***********************/
.side-panel {
    background: #f5f7fa;
}

#user-image-details {
    padding: 1.5rem 0 1.5rem 2rem;
}

.row-no-gutter {
    padding-left: 0px;
    padding-right: 0px;
}

.file-upload {
    background-color: #f5f7fa;
    outline: 2px dashed #c4c6c8;
    outline-offset: -10px;
    padding: 2rem;
}

.file-box {
    text-align: center;
}

#file {
    display: none;
}

.is-dragover {
    background-color: #fdecd3;
    outline: 2px dashed #f6a83a;
    outline-offset: -15px;
}

.file-box label strong {
    color: #d774ae;
    cursor: pointer;
}

.file-list {
    text-align: center;
}
.file-list div {
    text-align: left;
}

.file-list a > span.material-icons {
    font-size: 1.1rem;
    vertical-align: middle;
    margin-right: 1rem;
}

/*************************** footer to bottom of the page ***********************/
html,
body {
    margin: 0;
    padding: 0;
    height: 100%;
    overflow: auto;
    overflow-x: hidden;
    display: flex;
    flex-direction: column;
    min-height: 100%;
}

#container {
    /*    min-height: 100%;*/
    position: relative;
    flex: 1;
}

#header {
}

#footer {
    position: relative;
    bottom: 0;
    width: 100%;
}

.fullheight {
    min-height: 100%;
}


#body {
    /* height: 100%; */
    padding-left: 0.25em;
}

    
/*************************** legend ***********************/
div#legend.card {
    margin: 0rem 1rem 1rem 1rem;
    background-color: #F5F7FA;
}

.minsize-maxcontent {
    min-width: max-content;
}
/*************************** datatable grids ***********************/

/* fix issue with processing shows behind grid rows */
.dataTables_processing {
    z-index: 105
}

/* Hide default processing spinner */
div.dataTables_processing > div:last-child  {
    display: none;
}


div.dataTables_wrapper {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border: 1px solid #dde1e6;
    border-radius: 6px;
    padding-bottom: 1rem;
}

/* Surgeon contact grid */
#surgeon-contacts-datatable div.dataTables_wrapper div.row:last-child {
    margin-left: 0rem;
    margin-right: 0rem;
}

#surgeon-contacts-datatable div.dataTables_wrapper div.dataTables_filter {
    padding-top: 2rem;
    padding-right: 2rem;
}

/* Surgeon image center grid  */
#surgeon-image-centers-datatable div.dataTables_wrapper div.row:last-child {
    margin-left: 0rem;
    margin-right: 0rem;
}

#surgeon-image-centers-datatable div.dataTables_wrapper div.dataTables_filter {
    padding-top: 2rem;
    padding-right: 2rem;
}

#SurgeonTabContent div.table_resize_wrapper {
    padding: 1rem;
}

#SurgeonTabContent div.dataTables_wrapper div.row:last-child {
    margin-left: 0rem;
    margin-right: 0rem;
}

#SurgeonTabContent div.dataTables_wrapper div.dataTables_filter {
    padding-top: 2rem;
    padding-right: 2rem;
}

div.dataTables_info {
    padding-left: .5rem;
}

div.dataTables_filter {
    padding-top: .5rem;
    padding-right: .5rem;
}

#pre-op-plan {
    min-width: 18%;
}

#convert-surgery {
    min-width: 23%;
}

.nav-link.active {
    font-weight: bold;
}

.data-item-head-cell {
    width: 25%;
}

table.interactive-table tr.odd {
    background-color: #FFFFFF;
}

    table.interactive-table tr.odd + tr.child {
        background-color: #FFFFFF;
        padding: 0;
    }

table.interactive-table tr.even, .dataTables_scrollHead {
    background-color: rgb(245, 247, 250);
}

    table.interactive-table tr.even + tr.child {
        background-color: rgb(245, 247, 250);
        padding: 0;
    }

table.interactive-table tr.odd + tr.child:hover {
    background-color: #FFFFFF !important;
}

table.interactive-table tr.even + tr.child:hover {
    background-color: rgb(245, 247, 250) !important;
}

table.interactive-table table.inner-table {
    margin-left: 2.4em;
}

.interactive-table table td:not(:last-child), .interactive-table table th:not(:last-child), .static-table table td:not(:last-child), .static-table table th:not(:last-child) {
    /*   border-right: none;*/
}

table.dataTable {
    margin-top: 0px !important;
}

    table.dataTable td:first-child, table.dataTable td:last-child {
        border-right: none;
    }

/*************************** Case Listing grid ***********************/
div.case-listing > .tabs-container {
    border-bottom: 1px solid #DDE1E6;
}

.datatables-container {
    margin-top: 1rem;
}

div.case-listing > .tabs-container .nav-tabs .nav-item.show .nav-link,
div.case-listing > .tabs-container .nav-tabs .nav-link {
    color: #495057;
    font-weight: bold;
}

div.case-listing .dataTable th, div.case-listing .dataTable td {
    border-right: 1px solid #dde1e6;
}

div.case-listing > .dataTable td:first-child,
div.case-listing > .dataTable td:last-child {
    border-right: 1px solid #dde1e6 !important;
}

div.case-listing table.inner-table .data-item-head-cell {
    margin-right: 5em;
}

div.case-listing table.inner-table .data-item-head-cell,
div.case-listing table.inner-table .data-item-body-cell {
    border-top: none !important;
    border-right: none !important;
    border-bottom: none !important;
    border-left: none !important;
}

#search-controls button {
    margin-top: 1.2rem;
}

div.case-date-warning {
    display: block;
    font-weight: bold;
}

.dataTable .child .inner-table {
    width: auto !important;
}

/* popover for case listing*/

.image-status-icon {
    cursor: pointer;
}
.popover-header {
    background-color: #f5f7fa;
    font-weight: bold;
}
.popover-body {
    padding: 5px;
    margin: 5px;
    position: relative;
    min-height: 60px;
    min-width: 40px;
    font-size: 15px;
}

.popover-body i {
    position: absolute;
    left: 35%;
    transform: translateX(-50%);
}
/*************************** Image center contact profile ***********************/
#myprofile-container {
    padding: 1.5rem 0 1.5rem 2rem;
}


/*************************** Feedback 5 star rating  ***********************/
.rate {
    float: left;
    height: 46px;
    padding-right: 10px;
}

    .rate:not(:checked) > input {
        position: absolute;
        top: -9999px;
    }

    .rate:not(:checked) > label {
        float: right;
        width: 1em;
        overflow: hidden;
        white-space: nowrap;
        cursor: pointer;
        font-size: 30px;
        color: #ccc;
    }

        .rate:not(:checked) > label:before {
            content: '★ ';
        }

    .rate > input:checked ~ label {
        color: #ffc700;
    }

    .rate:not(:checked) > label:hover,
    .rate:not(:checked) > label:hover ~ label {
        color: #deb217;
    }

    .rate > input:checked + label:hover,
    .rate > input:checked + label:hover ~ label,
    .rate > input:checked ~ label:hover,
    .rate > input:checked ~ label:hover ~ label,
    .rate > label:hover ~ input:checked ~ label {
        color: #c59b08;
    }

.rating-label {
    margin-bottom: 0;
}

.tab-content {
    padding-right: 15px;
}

    .tab-content > .active {
        height: 100%;
    }

.tab-pane.show.active {
    height: 100%;
}

/********************* Image Center **********************/
#imagingCenterTabContent {
    /*    margin-top: 2rem;*/
}

.form-field-label {
    margin-top: 1rem;
}

#imaging-center-navigation {
    border-bottom: 1px solid #dee2e6;
}

input.form-control, select.form-select {
    max-width: 400px !important;
}

input.datepicker {
    max-width: 360px !important;
    padding-left: 10px;
}

input.form-control[name="singledate"] {
    max-width: 360px !important;
}


input.states {
    max-width: 100px !important;
}

.machine-label {
    display: inline-block;
    width: 46px;
}

.text-danger {
}
/********** browser incompatible *****************/
span.emphasis {
    font-weight: bold;
}


a-font {
    font-size: 12px;
}

.rotate-180 {
    transform: rotate(180deg);
}

.rotate-90-left {
    transform: rotate(270deg);
}

.rotate-90-right {
    transform: rotate(90deg);
}

.ttStyle {
    padding-left: 5px;
    margin-left: 5px;
    margin-right: 5px;
}

div.dataTables_filter {
    display: none;
}


/*************************** Case Detail Side Panel **************************************/
.data-item-body {
    font-size: 12px;
    margin-top: 0px;
    line-height:14px;
    padding-bottom:20px;
}

.data-item-body-cell .data-item-body
{
    padding-bottom: 0px !important;
}


/************** image wizard *******************************/
.imgcenterwizard {
    width: 100%;
    height: 34px;
    background-repeat: no-repeat;
    background-size: cover;
    margin-right: 20px;
}
.imgcenterwizard-outer {
    max-width: 600px;
    width: 100%;
    min-height: 20px;
    margin-right: 20px;
}
@media all and (max-width: 600px) {

    /* styles here */
    .imgcenterwizard {
        height: 22px;
    }
    .imgcenterwizard-outer {
        min-height: 22px;
        margin-right: 0px;
    }
}



/************************* DAta table changes ****************/
tr.child td.child table.table-borderless {
    margin-left:0px;
}

.interactive-table td:first-child {
 /*   max-width: 50px;*/
}

/***************************Birth Date ************************/
.dob {
    max-width: 400px !important;
}

/***** Create/Edit case schedule section ***8*/
.search-wrapper > * {
    margin-top: 1rem;
}

.search-wrapper div > label {
    margin-top: 0;
}
#schedule-required-image-types div.input-group label:not(:last-child) {
    margin-right: 1rem;
}

.schedule-settings-ic-row > div > label {
    margin-top: 0;
}

div.search-ic-results .container.body-content {
    margin-left: .2rem !important;
}

/* https://fonts.google.com/icons?selected=Material%20Symbols%20Outlined%3Ainfo%3AFILL%400%3Bwght%40300%3BGRAD%40200%3Bopsz%4024  */

.material-symbols-outlined {
    font-variation-settings: 'FILL' 0, 'wght' 300, 'GRAD' 200, 'opsz' 24
}


/* Web Planner Styling*/
div.webplanner_changes {
    border: none;
}

.webplanner_changes > div > button > h3, div.webplannerrevision > button > h3 {
    color: white;
}
.webplanner_changes > div > button, div.webplannerrevision > button {
    text-decoration : none !important;
}
.webplanner_changes > div > button > h3 {
    background-color: #F78E82;
/*    color: white;
    text-decoration : none !important;
*/
}
div.webplannerrevision > button > h3 {
    background-color: #B4BC00;
    /*   color: white;
    text-decoration : none !important;
*/
}

#btnSavePreOpWebPlanner {
    display: none !important;
}
#btnCancelWebPlanner {
    display: none !important;
}
#btnSavePreOpWebPlanner, #btnCancelWebPlanner {
    display: none !important;
}

label.acknowledge-checkbox span.checkmark {
    border: 4px solid #B4BC00;
    width: 20px;
    height: 20px;
}

#btnCancelWebPlanner,#btnRequestChangesPlanner, .card-header-webplanner {
    margin-bottom: 0;
    background-color: #F78E82;
    border: 1px solid #F78E82;
    width: fit-content;
    text-decoration : none;
    border-radius: 6px;
}

#btnSavePreOpWebPlanner,.webplannerrevision {
    margin-bottom: 0;
    background-color: #B4BC00;
    border: 1px solid #B4BC00;
    width: fit-content;
}

a.webplanner {
    background-color: #79CAC1;
    border-color: #79CAC1;
}

ul {
    list-style: none;
    /*background: #8c52ff;*/
}

ul li {
    display: inline-block;
    position: relative;
}

ul li a {
    display: block;
    padding: 20px 25px;
    color: #FFF;
    text-decoration: none;
    text-align: center;
    font-size: 20px;
}

ul li ul.dropdown li {
    display: block;
}

ul li ul.dropdown {
    width: 200px;
    background: #ff9e18;
    position: absolute;
    z-index: 999;
    display: none;
    padding-left: 0;
}

ul li a:hover {
    /*background: #6d30e9;*/
}

ul li:hover ul.dropdown {
    display: block;
}