:root {
    --mdb-dark-rgb: 10,0,0;
    --mdb-body-font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
    --mdb-link-color: #EAB12D;
    --mdb-link-hover-color: #DBA32B;
    --mdb-body-font-size: 16px;
}
.dropdown-menu {
    --mdb-dropdown-color: #4f4f4f;
    --mdb-dropdown-bg: #EAB12D;
    --mdb-dropdown-color: #fff;
    --mdb-dropdown-header-color: #fff;
    border-radius: 0;
}
.nav-tabs .nav-link {
    --mdb-nav-tabs-link-active-color: #EAB12D;
    --mdb-nav-tabs-link-active-border-color: #EAB12D;
    --mdb-nav-tabs-link-font-size: 16px;
}
 .btn {
    --mdb-btn-padding-top: 0.625rem;
    --mdb-btn-padding-bottom: 0.5rem;
    --mdb-btn-border-width: 0;
    --mdb-btn-border-color: none;
    --mdb-btn-border-radius: 0;
    --mdb-btn-box-shadow: none;
    --mdb-btn-hover-box-shadow: none;
    --mdb-btn-focus-box-shadow: none;
    --mdb-btn-active-box-shadow: none;
    --mdb-btn-font-size: 1rem;
    font-weight: bold;
    padding-top: var(--mdb-btn-padding-top);
    padding-bottom: var(--mdb-btn-padding-bottom);
    text-transform: none;
    border-radius: var(--mdb-btn-border-radius);
    box-shadow: var(--mdb-btn-box-shadow) !important;
}
.btn-primary:active:hover, .btn-primary:focus, .btn-primary.show:hover, .btn-primary:active:hover {
    background-color: #DBA32B;
}
.btn-primary {
    --mdb-btn-bg: #EAB12D;
    --mdb-btn-color: #fff;
    --mdb-btn-box-shadow: none;
    --mdb-btn-hover-bg: #DBA32B;
    --mdb-btn-hover-color: #fff;
    --mdb-btn-focus-bg: #DBA32B;
    --mdb-btn-focus-color: #fff;
    --mdb-btn-active-bg: #DBA32B;
    --mdb-btn-active-color: #fff;
}

.progress {
    --mdb-progress-bar-bg: #EAB12D;
}

.pagination {
    --mdb-pagination-active-color: #fff;
    --mdb-pagination-active-bg: #EAB12D;
}


.btn-primary:first-child:hover, .btn-primary:focus-visible, .btn-primary:hover, :not(.btn-check) + .btn-primary:hover {
    box-shadow: none;
}
.form-switch .form-check-input:checked[type=checkbox]:after {
    background-color: #EAB12D;
}
.form-switch .form-check-input:checked:focus:before {
    margin-left: 1.0625rem;
    box-shadow: 3px -1px 0 13px #EAB12D;
}
.form-row {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: -5px;
    margin-left: -5px;
}
 
.form-row > .col, .form-row > [class*=col-] {
    padding-right: 5px;
    padding-left: 5px;
}
.table {
    --mdb-table-font-size: 14px;
}

.dropdown-header {
    color: #333;
    border-bottom: 1px solid #333;
    margin-top: 0.5rem;
    font-weight: bold;
}

.dropdown-item {
    --mdb-dropdown-state-color: #fff;
    --mdb-dropdown-state-background-color: #000;
    text-transform:uppercase;
}

.form-group {
    margin-bottom: 1.5rem !important;
}

.form-check-input[type=checkbox]:checked {
    background-color: #EAB12D;
    border-color: #EAB12D;
}
.form-check-input[type=checkbox]:checked:focus {
    background-color: #EAB12D;
}
.form-check-input:checked:focus:before {
    box-shadow: 0 0 0 13px #EAB12D;
}

button.close {
    border: none;
    background: none;
    font-size: 40px;
    line-height: 1rem;
    padding: 8px 4px;
}

    @page {
        size: auto;
        margin: 0px;
    }


    @media print {
        .table-open.closed {
            display: none;
        }

        .chartjs-render-monitor {
            max-width: 100%;
            height: auto !important;
            width: auto !important;
        }
    }

    body {
    
    padding-bottom: 20px;
}

.pagebreak {
    display: block;
    clear: both;
    page-break-after: always;
}

footer {
    margin-top:3rem;
    font-weight:bold;
}
.ml-auto {
    margin-left:auto;
}
.navbar-dark  .navbar-toggler-icon {
    background-image: var(--mdb-navbar-toggler-icon-bg);
}
.navbar-dark .nav-link {
    color:#fff;
    text-transform:uppercase;
    font-weight:bold;
}
 
select.form-control {
    padding-top: 6px;
    padding-bottom: 6px;
    background-color: #fff !important;
    appearance: auto;
} 

/* Wrapping element */
/* Set some basic padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
}
.navbar {
    margin-bottom: 3rem;
}
a {
    cursor: pointer;
}

.modal-footer {
    justify-content: flex-start;
}


.dimension-control {
    white-space: nowrap;
}
.dimension-control select {
    width:auto;
    display:inline-block;
}

caption {
    caption-side: top;
    color: #777;
    text-align: left;
    font-size: 120%;
    font-weight: bold;
    padding: 8px;
}

a.back {
    margin-left:15px;
}
.navbar-brand {
    padding: 12px 5px;
}
.navbar-brand > img {
    display: inline-block;
    width:32px;
    height:30px;
}
a.btn-primary:not([href]) {
    color:#fff !important;
}

@media (max-width: 576px) {
    .navbar {
        margin-bottom: 0;
    }
}

@media (min-width: 576px) {
    .modal-dialog {
        max-width: 600px;
    }
}

.validation-summary-errors {
    padding: 1em;
    margin: 1em 0;
    background: #F8D7DA;
    border: 1px solid #F5C6CB;
    color: #721c24;
    border-radius: 6px;
}

.validation-summary-errors ul {
    margin:0;

}

.input-group-prepend .fa-calendar-alt:before {
    content: "\f073";
    vertical-align: sub;
}
.input-group-prepend .fa-clock:before {
    vertical-align: sub;
}

td.rotation {
    padding:0;
    text-align:center;
}
td.rotation > div {
    margin: 10px;
}
.tire-position {
    position:absolute;
    width:1px;
    height:0px;
    background:red;
}

.tire-position-top {
    top: 0;
}
.tire-position-bottom {
    bottom:0;
}
.tire-position-1, .tire-position-5 {
    left: 0%;
}
.tire-position-2, .tire-position-6 {
    left: 100%;
}
.tire-position-3, .tire-position-7 {
    left: 0;
}
.tire-position-4, .tire-position-8 {
    left: 100%;
}

/*
th.tire-lf {
    background: url(/images/corner-lf.png) 0 0 no-repeat;
}

th.tire-rf {
    background: url(/images/corner-rf.png) 100% 0 no-repeat;
}

th.tire-lr {
    background: url(/images/corner-lr.png) 0 100% no-repeat;
}

th.tire-rr {
    background: url(/images/corner-rr.png) 100% 100% no-repeat;
}
    */

.dimension-control.error select {
    border-color: #DC3545;
}

.table-open .table-toggle {
    margin-right:10px;
    transition: transform ease-in-out 0.2s;
}

.table-open:not(.closed) .table-toggle {
    transform: rotate(90deg);
}

.table-open.closed thead, .table-open.closed tbody, .table-open.closed .disclaimer {
    display: none;
}

.table-open.closed {
    display: inline-block;
    margin-right: 40px;
}

.table-open.closed table {
    border:none;
}

    .table-open.closed > div  {
        display:none;
    }

.table-open.closed caption {
    display:inline-block;
}

td .caption {
    font-size: 120%;
    font-weight: bold;
    padding: 8px;
}


.table-open caption, td .caption {
    cursor: pointer;
    color: #EAB12D;
}

.hide-projections thead, .hide-projections tr {
    display:none;
}

.hide-projections tr.warning {
    display: table-row;
}


div.projection.hidden, li.projection.hidden {
    display: none;
}

td div.projection.hidden {
    display:block;
    visibility: hidden;
    position: relative;
}
    td div.projection.hidden:after {
        visibility: visible;
        position: absolute;
        top: 0;
        left: 0;
        content: "N/A";
    }

tr.projection.hidden {
    display:none;
}


div.warnings p.text-danger {
    padding: 8px;
}
div.warnings p.text-danger i {
    margin-right:10px;
}

p.text-danger a {
    color:#dc3545  !important;
    text-decoration:underline;
    font-weight:bold;

}

.sae-table td {
    vertical-align:top;
}
.sae-table td:first-child {
    font-weight:bold;
    padding-right:1em;
}


.model-footer {
    justify-content:flex-start;
}



.accordian .accordian-content {
    display: none;
    margin-top: 0.5em;
}

.accordian.open .accordian-content {
    display: block;
}
.accordian .fa-chevron-right {
    margin-right:10px;
}
.accordian.open .fa-chevron-right {
    transform:rotate(90deg);
}

.vehicle-overview {
    margin: 0;
    padding: 0;
    list-style-type: none;

    font-size: 130%;
}

.vehicle-overview  li {
    display:block;
}

/*
@media (max-width: 995px) {
    .vehicle-overview li {
        width:49%;
    }

}
@media (max-width: 576px) {
    .vehicle-overview li {
        width: 100%;
    }
}
    */
#vehicle-metadata img {
    float: left;
    width: 50px;
    margin-right: 20px;
}
#vehicle-metadata .metadata > span {
    display:block;
}
#vehicle-metadata .metadata {
    margin-left:70px;
}

#vehicle-metadata .row {
    margin-bottom:1em;
    font-size:120%;
}
tr.table-spacer td {
    height: 2em;
    background: #fff;
    border: 1px solid #fff;
    padding-left: 0;
}
tr.measurement-averages-header th {
    font-weight: bold;
    text-align: center;
    vertical-align: middle;
    background: #F2F2F2;
}
.table thead th {
    background: #F3F3F3;
}

tr.measurement-averages td {
    background: #fff;
    font-weight: bold;
    text-align: center;
    vertical-align: middle;
}
tr.measurement-averages-header  a:hover {
    text-decoration: none;
    cursor: text;
    color: #007bff;
}

.rotate-diagram svg {
    display: block;
    margin: 0 auto;
}
.rotate-diagram .LeftFront, .rotate-diagram .LeftRear{
    float: left;
}
.rotate-diagram .RightFront, .rotate-diagram .RightRear {
    float: right;
}

.measurement-details li {
    white-space:nowrap;
    font-size:80%;
}
.calculation-details {
    padding: 0;
    color: #999;
    font-size: 80%;
}
.calculation-details li {
    white-space: nowrap;
    list-style-type: none;
}

.legend-icon {
    display: inline-block;
    width: 1em;
    height: 1em;
    border-radius: 100%;
    margin-right: 0.5em;
    vertical-align: baseline;
}
.legend-entry {

    display:inline-block;
}
    .legend-entry + .legend-entry {
        margin-left: 2em;
    }


/* table sorting */
th[role=columnheader]:not(.no-sort) {
    cursor: pointer;
}

    th[role=columnheader]:not(.no-sort):before {
        content: '';
        float: right;
        margin-top: 7px;
        border-width: 0 4px 4px;
        border-style: solid;
        border-color: #404040 transparent;
        visibility: hidden;
        opacity: 0;
        -ms-user-select: none;
        -webkit-user-select: none;
        -moz-user-select: none;
        user-select: none;
    }

th[aria-sort=descending]:not(.no-sort):before {
    border-bottom: none;
    border-width: 4px 4px 0;
}

th[aria-sort]:not(.no-sort):before {
    visibility: visible;
    opacity: 0.4;
}

th[aria-sort][data-sortedby]:before {
    visibility: visible;
    opacity:1;
}
th[aria-sort="none"]:before {
    visibility: visible;
    opacity: 0.2 !important;
}



th[role=columnheader]:not(.no-sort):hover:before {
    visibility: visible;
    opacity: 1;
}
#tbl-performance table {
    width:auto;
}
#tbl-performance table td:first-child {
    font-weight:bold;
}
    #tbl-performance table td:nth-child(4) {
        font-weight: bold;
    }
#tbl-performance .spacer {
    border-top: 1px solid #fff;
}

table caption .table-filter {
    float: right;
    max-width: 225px;
}
.modal-body {
    overflow: auto;
    max-height: calc(100vh - 233px);
}

.text-danger-flash, .fill-flash {
    animation: blinker 1s linear infinite;
    color:#dc3545  !important
}

@keyframes blinker {
    50% {
        color:#fff;
        fill:#fff;
    }
}

.vehicle-photo {
    border-radius: 50%;
}


.upload-btn-wrapper {
    position: relative;
    overflow: hidden;
    display:flex;
    gap:1rem;
}

    .upload-btn-wrapper .btn {
       padding:0;
       background-color: white;
       color:#fff;
    }
    .upload-btn-wrapper .image-action {
        display:block;
        float:right;
        clear:right;
        margin-top:1em;
        font-size:20px;
        cursor:pointer;
    }

    .upload-btn-wrapper:not(.has-photo) .image-action {
        display:none;

    }
.upload-btn-wrapper.has-photo .btn {
    width: 100px;
    height: 100px;
    text-indent: -999px;
    background-size: contain;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    margin: 4px 0;
}
        .upload-btn-wrapper.has-photo .btn img {
            display: none;
        }
            .upload-btn-wrapper input[type=file] {
    font-size: 100px;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
}
    .upload-btn-wrapper.has-photo input[type=file] {
        width:100px;
        height:100px;
        font-size:1em;
        overflow:hidden;
    }
    .gauge-wrap {
    min-width:150px;
}
.round-indicator {
    display: inline-block;
    width: 30px;
    height: 30px;
    background: #119719;
    border-radius: 50%;
    border: 1px solid #8B8B8B;
    margin-top:3px;
}
    .round-indicator:before {
        content: " ";
        border: 1px solid #fff;
        position: absolute;
        width: 28px;
        height: 28px;
        border-radius: 50%;
        margin-left: -14px;
        margin-top: 0px;
    }

    .round-indicator.danger {
        background-color: #DE3B14;
    }
    .round-indicator.warning {
        background-color: #FFC209;
    }

.row > .col:first-child {
    padding-left: 0;
}
.row > .col:last-child {
    padding-right: 0;
}

.sorted-cell {
    background:rgba(238,238,33,0.18) !important;
}

.ics-link {
    font-size:13px;
    white-space:nowrap;
}

.fc-day-grid-event .fc-content {
    white-space: normal !important;
    overflow: hidden;
}

.fc-event a {
    color:white;
    text-decoration:underline;
}

@media (min-width: 768px) {
    .navbar-icon {
        display: none;
    }
}
@media (max-width: 768px) {
    .menu-brand {
        display: none;
    }

}

.bg-setco {
    background: #CD9258;
}

.balance-diagram > svg {
    width: 350px;
    height: 287px;
    opacity:0;
}

.corner-icon {
    background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABsAAAAbCAIAAAACtmMCAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAABOSURBVEhLYzw7KYKBqoAJSlMPQN1olLscwqcEnJscCSQRJkL4eABBWyEmUN/XoyZSB4yaSB1AfROpn69HY4Y6YNRE6oChYOLgbwEwMAAAfjYUxfmQPoQAAAAASUVORK5CYII=');
    width: 27px;
    height: 27px;
    display: inline-block;
    vertical-align: text-top;
}
.corner-icon-rf {
    transform: scaleX(-1);
}
.corner-icon-lr {
    transform: scaleY(-1);
}
.corner-icon-rr {
    transform: scaleX(-1) scaleY(-1);
}

.combo-select {
    position: absolute;
    display:none;
    background: #fff;
    z-index: 2;
    max-height: 10em;
    overflow: auto;
    width: calc(100% - 10px);
    box-shadow: 5px 5px 5px rgba(0,0,0,.1);
    padding:0 !important;
}
.combo-select ul {
    padding:0;
    margin:0;
    list-style-type:none;
}
.combo-select a {
    display:block;
    padding:8px 12px;
    text-decoration:none;
    color:#000;
}
.combo-select a:hover {
    background: #F8F9FA;
}
.spare-tag {
    background: #CD9258;
    display: inline-block;
    padding: 0px 6px;
    border-radius: 3px;
    color: white;
    font-size: 85%;
    margin-left: 5px;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.5);
}
a.spare-tag:hover {
    color: white;
    text-decoration: none;
}

.vehicle-diagram {
    width: 100%;
    border: 1px solid #ccc;
    padding: 5px;
    display: flex;
    justify-content: space-evenly;
}
.vehicle-diagram .column {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
}

.vehicle-diagram .tire {
    background: #fff url('/images/tire-tread-light.png');
    background-repeat: no-repeat;
    background-size: cover;
    width: 100px;
    height: 200px;
    border: 3px solid #aaa;
    margin: 10px;
    border-radius: 5px;
    text-align: center;
    flex-direction: column;
    justify-content: space-between;
    display: flex;
    cursor:move;
}

.vehicle-diagram .tire .position {
    background: #aaa;
    color: #fff;
    margin-left: -1px;
    margin-right: -1px;
    -moz-border-radius-topleft: 5px;
    -moz-border-radius-topright: 5px;
}

.vehicle-diagram .direction {
    font-size:60px;
    color:#aaa;
}
.vehicle-diagram .tire.dragging {
    opacity:0.5;
}
.vehicle-diagram .tire.ui-droppable-hover {
    border-color: #007BFF;
    box-shadow: 0 0 10px #007BFF;
}
.ui-draggable-dragging {
    box-shadow:0 0 10px rgba(0,0,0,.3);
    opacity:0.9;
}

img.grayscale {
    filter: grayscale(100%);
}

/* short height measurment dialog */
@media (max-height: 700px) {
    #edit-measurement-modal .modal-header  {
        display:none;
    }
    #edit-measurement-modal img.front-loader {
        display: none !important;
    }
    #edit-measurements-table {
        margin-top:0 !important;
        grid-gap: 5px 0 !important;
    }
}


table.dataTable thead .sorting:before, table.dataTable thead .sorting:after, table.dataTable thead .sorting_asc:before, table.dataTable thead .sorting_asc:after, table.dataTable thead .sorting_desc:before, table.dataTable thead .sorting_desc:after, table.dataTable thead .sorting_asc_disabled:before, table.dataTable thead .sorting_asc_disabled:after, table.dataTable thead .sorting_desc_disabled:before, table.dataTable thead .sorting_desc_disabled:after {
    bottom: auto;
    top: 0;
}

.button-list {
    line-height: 42px;
}
.button-list > *, .button-list [type="submit"] {
    margin: 0.25rem;
}

.button-list .btn:first-child {
    margin-left: 0;
}

.button-list > *:last-child {
    margin-right:0;
}
@media (max-width: 768px) {
    .button-list {
        display:block;
        float:none !important;
    }
    .button-list > div {
        float: none !important;
    }
    .button-list .btn, .button-list .dropdown-toggle, .button-list > .dropdown, .button-list [type="submit"] {
        display: block !important;
        margin-left: 0;
        margin-right: 0;
        width: 100%;
        float: none !important;
    }
    a.back {
        margin:0;
    }
}


body.downloading h1 {
    font-size:1.5rem;
}
body.downloading .vehicle-overview {
    font-size:100%;
}

.img-responsive {
    max-width: 100%;
    height: auto;
}

.footer-links a {
    display:block;
    color:white;
}
input[type="password"] {
    font-family: verdana;
    letter-spacing: 0.15rem;
}


[data-tippy-root] img {
    max-height: 50vh;
    max-width: 50vw;
}

li.select2-results__option.select2-results__option--selectable.select2-results__option--highlighted .text-muted {
    color: white !important;
}

.select2-container .select2-selection--single {
    height: 35px;
    display: flex;
    align-items: center;
}
.select2-container--default .select2-results > .select2-results__options{
    max-height:300px;
}
.select2-results__option {
    padding:0;
}
.select2-productcode {
    display:flex;
    justify-content:space-between;
    flex-grow:1;
}
.select2-productcode span:last-child {
    opacity: 0.5;
    min-width:7rem;
}
.select2-results__group .select2-productcode span:last-child {
    display:none;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
    display: flex;
    flex-grow: 1;
}
select.form-control + .select2-container {
    display:block;
}
.select2-dropdown {
    z-index: 999999;
    min-width: 430px;
}