html, body {
    background-color: #f8f9fa;
}

:root {
    --bs-table-bg: unset;
}

/* latin */
@font-face {
    font-family: 'IBM Plex Sans';
    font-style: normal;
    font-weight: 100 700;
    font-stretch: 75% 100%;
    font-display: swap;
    src: url(fonts/plex.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

body, .tooltip, .popover {
            font-family: "IBM Plex Sans", sans-serif;
            font-optical-sizing: auto;
}

.font-width-75 {
    font-variation-settings:
        "wdth" 75;
}

.container-xl {
    max-width: 991px;
}

.sticky-top {
    background-color: rgba(248, 249, 250, 0.80) !important;
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
}

/* Accounting-style currency formatting */
.currency {
    position: relative;
    padding-left: 24px !important;
}

.currency::before {
    content: "$";
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--bs-gray-600);
    font-weight: 400;
}

.input-group-text {
    min-width: 40px;
    justify-content: center;
}

/* Custom styling for option codes */
.option-code {
    font-size: 60%;
    font-weight: 500;
    margin-left: 1em;
    display: inline-block;
    color: var(--bs-gray-700);
    background-color: var(--bs-gray-100);
    outline: 1px solid var(--bs-gray-300);
    padding: 0.1em 0.3em;
    border-radius: 0.25em;
    vertical-align: .25em;
}

/* Custom styling for floating labels */

.form-floating>.form-control {
    padding-left: 20px;
    text-align: right;
}

.form-floating>label {
    padding-left: 15px;
    opacity: 0.65;
}

/* Style for readonly inputs */
.form-control[readonly] {
    background-color: #f8f9fa;
    border-color: #dee2e6;
}

#drive-away-row label, #drive-away-service-row label {
    color: #000;
    opacity: 1;
    font-weight: 500;
}

#drive-away-service-row label {
    font-weight: 500;
}

#gross-profit-row label {
    opacity: 1;
}

/* Custom styling for VFOS (factory bonus) field */
.vfos-applied {
    background-image: url('vfos.svg');
    background-position: bottom .75em left .9em;
    background-repeat: no-repeat;
    background-size: 2.2em 1em;
}

/* Custom styling for VFOS (factory bonus) field when autofilled by database */
.vfos-db {
    background-image: url('auto-colour.svg');
    background-position: bottom .75em left .9em;
    background-repeat: no-repeat;
    background-size: 2.2em 1em;
}

.vfos-db-warning {
    background-image: url('auto-warn.svg');
    background-position: bottom .75em left .9em;
        background-repeat: no-repeat;
        background-size: 2.2em 1em;
        border-color: var(--bs-warning-border-subtle) !important;
        border-width: 2px;
}

/* Login button in footer */
.footer-link {
    font-size: 0.6rem;
    text-decoration: none;
    color: var(--bs-gray-500);
}

.footer-link:hover {
    color: var(--bs-gray-700);
    text-decoration: none;
}

/* Remove dropdown toggler border */
.dropdown-toggle::after {
    border: none;
}

#appMenu .dropdown-toggle:hover {
    box-shadow: 0 0 0 .25rem rgba(0, 0, 0, .15);
    border-radius: 5px;
}


/* Table row styling */
.vehicle-details .small td {
    color: var(--bs-gray-700) !important;
}

/* Fix price column width when cost column is hidden */
.table th:last-child {
    width: auto !important;
}

/* Add more space for non-authenticated price inputs */
@media (min-width: 768px) {
    .col-md-6.non-auth-input {
        max-width: 50%;
        margin: 0 auto;
    }
}

.popover {
    background-color: rgba(255, 255, 255, 0.8) !important;
        -webkit-backdrop-filter: blur(4px);
        backdrop-filter: blur(4px);
}
.popover-header {
    background-color: unset;
    border-bottom: unset;
    font-size: unset;
}

.popover-body {
    background-color: unset;
    font-size: 85%;
    padding-top: 0;
}
.licence-content {
    max-height: 300px;
        overflow-y: auto;
        padding: 10px;
        background-color: #f8f9fa;
        border-radius: 4px;
}
.licence-content strong {
    font-weight: 500;
}

tbody,
td,
tfoot,
th,
thead,
tr {
    border-color: var(--bs-gray-200);
}

.dropdown-item.active,
.dropdown-item:active {
    background-color: var(--bs-gray-300);
    color: var(--bs-dark);
}

.border-indigo {
   border-color: #6610f2 !important;
}

.bg-indigo-subtle {
    background-color: rgba(224, 207, 252, 0.35) !important;
}

.bg-teal-subtle {
    background-color: #eaf3f6ce !important;
}
.border-teal {
    border-color: #1dbdf3 !important;
}