:root {
    -webkit-touch-callout: none;
    --top-row-height: 3.5rem;
    --main-content-margin: 1.5rem;
    --full-height-content: calc(100vh - var(--top-row-height) - var(--main-content-margin) * 2);
    /*Variables*/
    --Primitives__Black: var(--Primitives__Black-Custom, #252827);
    --Primitives__Black-rgb: var(--Primitives__Black-Custom-rgb, 37, 40, 39);
    --Primitives__DarkBlack: var(--Primitives__DarkBlack-Custom, #0f1010);
    --Primitives__DarkGreen: var(--Primitives__DarkGreen-Custom, #00b5ad);
    --Primitives__DarkGreen-rgb: var(--Primitives__DarkGreen-Custom-rgb, 0, 181, 173);
    --Primitives__DarkGrey: var(--Primitives__DarkGrey-Custom, #545a59);
    --Primitives__Green: var(--Primitives__Green-Custom, #19cec6);
    --Primitives__Green-rgb: var(--Primitives__Green-Custom-rgb, 25, 206, 198);
    --Primitives__Grey: var(--Primitives__Grey-Custom, #AEB4B3);
    --Primitives__LightGrey: var(--Primitives__LightGrey-Custom, #f2f2f2);
    --Primitives__LightGrey-rgb: var(--Primitives__LightGrey-Custom-rgb, 242, 242, 242);
    --Primitives__LowBlack: var(--Primitives__LowBlack-Custom, #343736);
    --Primitives__MediumGrey: var(--Primitives__MediumGrey-Custom, #adb1b5);
    --Primitives__White: var(--Primitives__White-Custom, #ffffff);
    --Primitives__White-rgb: var(--Primitives__White-Custom-rgb, 255, 255, 255);
    /*Derived Variables*/
    --Primitives__Black10: rgba(var(--Primitives__Black-rgb), 0.1);
    --Primitives__Black40: rgba(var(--Primitives__Black-rgb), 0.4);
    --Primitives__Black60: rgba(var(--Primitives__Black-rgb), 0.6);
    --Primitives__Green15: rgba(var(--Primitives__Green-rgb), 0.15);
    --Primitives__Green30: rgba(var(--Primitives__Green-rgb), 0.3);
    --Primitives__Green60: rgba(var(--Primitives__Green-rgb), 0.6);
    --Primitives__DarkGreen15: rgba(var(--Primitives__DarkGreen-rgb), 0.15);
    --Primitives__DarkGreen30: rgba(var(--Primitives__DarkGreen-rgb), 0.3);
    --Primitives__DarkGreen60: rgba(var(--Primitives__DarkGreen-rgb), 0.6);
    --Primitives__LightGrey15: rgba(var(--Primitives__LightGrey-rgb), 0.15);
    --Primitives__LightGrey30: rgba(var(--Primitives__LightGrey-rgb), .3);
    --Primitives__LightGrey60: rgba(var(--Primitives__LightGrey-rgb), .6);
    --Primitives__White10: rgba(var(--Primitives__White-rgb), 0.1);
    --Primitives__White30: rgba(var(--Primitives__White-rgb), 0.3);
    --Primitives__White40: rgba(var(--Primitives__White-rgb), 0.4);
    --Radius__Radius1: 8px;
    --Radius__Radius2: 16px;
    --Radius__Radius3: 24px;
    --Radius__Radius4: 32px;
    --Radius__Radius5: 40px;
    --Spacings__Spacing1: 4px;
    --Spacings__Spacing2: 8px;
    --Spacings__Spacing3: 16px;
    --Spacings__Spacing4: 24px;
    --Spacings__Spacing5: 32px;
    --Spacings__Spacing6: 40px;
    --Spacings__Spacing7: 48px;
    --Spacings__Spacing8: 56px;
    --Spacings__Spacing9: 64px;
    --Spacings__Spacing10: 72px;
    --Spacings__Spacing11: 80px;
    --Spacings__Spacing12: 88px;
    --Spacings__Spacing13: 104px;
    --Spacings__Spacing14: 112px;
    --Spacings__Spacing15: 120px;
    --Spacings__Spacing16: 128px;
    --Spacings__Spacing17: 136px;
    --Spacings__Spacing18: 144px;
    --Spacings__Spacing19: 152px;
    --Spacings__Spacing20: 96px;
    --Spacings__Spacingnegative1: -24px;
    --Status__Danger: #dc3545;
    --Status__Danger20: rgba(220, 53, 69, 0.2);
    /*Light Theme*/
    --Backgrounds__Background1: var(--Primitives__White);
    --Backgrounds__Background2: var(--Primitives__Green);
    --Backgrounds__Background3: var(--Primitives__LightGrey);
    --Backgrounds__BackgroundHighlight: var(--Primitives__Black);
    --Backgrounds__Modal: var(--Primitives__Black40);
    --Badge__Background1: var(--Primitives__DarkGrey);
    --Badge__Background2: var(--Primitives__White);
    --Badge__Background3: var(--Primitives__LightGrey);
    --Badge__Text1: var(--Primitives__White);
    --Badge__Text2: var(--Primitives__DarkGrey);
    --Borders__BorderDefault: var(--Primitives__MediumGrey);
    --Borders__BorderLight: var(--Primitives__LightGrey);
    --Bottombar__Default: var(--Primitives__White10);
    --Bottombar__Highlighted: var(--Primitives__Green);
    --Bottombar__Selected: var(--Primitives__Black);
    --Buttons__ButtonText: var(--Primitives__Black);
    --Buttons__Primary: var(--Primitives__Green);
    --Buttons__Secondary: var(--Primitives__Black);
    --Buttons__SecondaryBorder: var(--Primitives__LightGrey);
    --Buttons__Thertiary: var(--Primitives__Green15);
    --Forms__BorderFocus: var(--Primitives__Black);
    --Forms__BorderFocus2: var(--Primitives__Green30);
    --Forms__Inputborder: var(--Primitives__MediumGrey);
    --Graphics__Line1: var(--Primitives__Black);
    --Graphics__Line2: var(--Primitives__MediumGrey);
    --Graphics__Line3: var(--Primitives__Green);
    --Graphics__Lines: var(--Primitives__MediumGrey);
    --Graphics__Texts: var(--Primitives__DarkGrey);
    --Icons__Default: var(--Primitives__Black);
    --Icons__Negative: var(--Primitives__White);
    --Texts__Copyrights: var(--Primitives__MediumGrey);
    --Texts__Default: var(--Primitives__Black);
    --Texts__Defaultfixed: var(--Primitives__Black);
    --Texts__Highlights: var(--Primitives__Green);
    --Texts__Negative: var(--Primitives__White);
    --Texts__Placeholder: var(--Primitives__DarkGrey);
    --Texts__Placeholderfixed: var(--Primitives__DarkGrey);
}

/*Dark Theme*/
[data-bs-theme=dark]:root {
    --Backgrounds__Background1: var(--Primitives__Black);
    --Backgrounds__Background2: var(--Primitives__DarkGreen);
    --Backgrounds__Background3: var(--Primitives__DarkBlack);
    --Backgrounds__BackgroundHighlight: var(--Primitives__White);
    --Backgrounds__Modal: var(--Primitives__White40);
    --Badge__Background1: var(--Primitives__Grey);
    --Badge__Background2: var(--Primitives__Black);
    --Badge__Background3: var(--Primitives__LowBlack);
    --Badge__Text1: var(--Primitives__Black);
    --Badge__Text2: var(--Primitives__Grey);
    --Borders__BorderDefault: var(--Primitives__MediumGrey);
    --Borders__BorderLight: var(--Primitives__LowBlack);
    --Bottombar__Default: var(--Primitives__Black10);
    --Bottombar__Highlighted: var(--Primitives__DarkGreen);
    --Bottombar__Selected: var(--Primitives__White);
    --Buttons__ButtonText: var(--Primitives__White);
    --Buttons__Primary: var(--Primitives__DarkGreen);
    --Buttons__Secondary: var(--Primitives__White);
    --Buttons__SecondaryBorder: var(--Primitives__LowBlack);
    --Buttons__Thertiary: var(--Primitives__DarkGreen15);
    --Forms__BorderFocus: var(--Primitives__White);
    --Forms__BorderFocus2: var(--Primitives__DarkGreen30);
    --Forms__Inputborder: var(--Primitives__MediumGrey);
    --Graphics__Line1: var(--Primitives__White);
    --Graphics__Line2: var(--Primitives__MediumGrey);
    --Graphics__Line3: var(--Primitives__DarkGreen);
    --Graphics__Lines: var(--Primitives__MediumGrey);
    --Graphics__Texts: var(--Primitives__Grey);
    --Icons__Default: var(--Primitives__White);
    --Icons__Negative: var(--Primitives__Black);
    --Texts__Copyrights: var(--Primitives__MediumGrey);
    --Texts__Default: var(--Primitives__White);
    --Texts__Defaultfixed: var(--Primitives__White);
    --Texts__Highlights: var(--Primitives__DarkGreen);
    --Texts__Negative: var(--Primitives__Black);
    --Texts__Placeholder: var(--Primitives__Grey);
    --Texts__Placeholderfixed: var(--Primitives__Grey);
}

.full-height-content {
    height: var(--full-height-content) !important;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid red;
}

.validation-message {
    color: red;
}

#blazor-error-ui {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    z-index: 99999;
    background: rgba(0,0,0,0.7);
    color: #fff;
    padding: 2.5rem;
    text-align: center;
    display: none;
}

    #blazor-error-ui .dismiss {
        cursor: pointer;
        position: absolute;
        right: 2.5rem;
        top: 2rem;
    }

.pointer {
    cursor: pointer;
}

.white-shadow {
    filter: drop-shadow(0px 0px 5px white);
}

.black-shadow {
    filter: drop-shadow(0px 0px 5px black);
}

img {
    pointer-events: none;
    user-select: none;
    -moz-user-select: none;
    -webkit-user-drag: none;
    -webkit-user-select: none;
    -ms-user-select: none;
}

.floating-action-button {
    position: fixed;
    bottom: 6.5rem;
    right: 1.5rem;
    width: 45px;
    height: 45px;
}

@media (min-width: 768px) {
    .floating-action-button {
        bottom: 1.5rem;
        right: 1.5rem;
    }
}

.callout {
    padding: 1.25rem;
    margin-top: 1.25rem;
    margin-bottom: 1.25rem;
    background-color: var(--callout-bg, var(--bs-gray-100));
    border-left: 0.25rem solid var(--callout-border, var(--bs-gray-300));
}

.callout-primary {
    --callout-bg: rgba(var(--bs-primary-rgb), .075);
    --callout-border: rgba(var(--bs-primary-rgb), .5);
}

.callout-secondary {
    --callout-bg: rgba(var(--bs-secondary-rgb), .075);
    --callout-border: rgba(var(--bs-secondary-rgb), .5);
}

.callout-success {
    --callout-bg: rgba(var(--bs-success-rgb), .075);
    --callout-border: rgba(var(--bs-success-rgb), .5);
}

.callout-info {
    --callout-bg: rgba(var(--bs-info-rgb), .075);
    --callout-border: rgba(var(--bs-info-rgb), .5);
}

.callout-warning {
    --callout-bg: rgba(var(--bs-warning-rgb), .075);
    --callout-border: rgba(var(--bs-warning-rgb), .5);
}

.callout-danger {
    --callout-bg: rgba(var(--bs-danger-rgb), .075);
    --callout-border: rgba(var(--bs-danger-rgb), .5);
}

.callout-dark {
    --callout-bg: rgba(var(--bs-dark-rgb), .075);
    --callout-border: rgba(var(--bs-dark-rgb), .5);
}

.callout-light {
    --callout-bg: rgba(var(--bs-light-rgb), .075);
    --callout-border: rgba(var(--bs-light-rgb), .5);
}

/*------------ NEW ----------------*/

/*----- Generics -----*/
/*Generics*/
.border-btn-bottom-4 {
    border-bottom-right-radius: var(--Spacings__Spacing4);
    border-bottom-left-radius: var(--Spacings__Spacing4);
}

.border-pill {
    border-radius: var(--Spacings__Spacing5);
}

.custom-popup {
    background-color: var(--Backgrounds__Background1);
    color: var(--Texts__Default);
    border-radius: var(--Spacings__Spacing6);
    gap: var(--Spacings__Spacing3);
    padding: var(--Spacings__Spacing4);
    overflow-y: auto !important;
}

.custom-offcanvas {
    background-color: var(--Backgrounds__Background1);
    color: var(--Texts__Default);
    border-top-left-radius: var(--Spacings__Spacing4);
    border-top-right-radius: var(--Spacings__Spacing4);
    gap: var(--Spacings__Spacing3);
    overflow-y: auto;
    height: auto !important;
    padding: var(--Spacings__Spacing4);
}
/*-*/
/*Backgrounds*/
.bg-main {
    background-color: var(--Backgrounds__Background1);
    color: var(--Texts__Default);
}

.bg-danger20 {
    background-color: var(--Status__Danger20);
}

.bg-card-default {
    background-color: var(--Backgrounds__Background3);
    color: var(--Texts__Defaultfixed);
}

.bg-card-primary {
    background-color: var(--Backgrounds__Background2);
    color: var(--Texts__Defaultfixed);
}
/*-*/
/*Text*/
.text-title {
    color: var(--Texts__Negative);
}

.text-placeholder {
    color: var(--Texts__Placeholder);
}

.fs-0 {
    font-size: 2.5rem;
}

.icon-default {
    color: var(--Icons__Default);
}
/*-*/
/*NavMenu*/
.menu-item {
    background-color: var(--Backgrounds__Background1);
    border-radius: var(--Spacings__Spacing6) !important;
    color: var(--Texts__Default);
}

.menu-bottom-item {
    background-color: var(--Backgrounds__Background3);
    border-radius: var(--Spacings__Spacing6) !important;
}
/*-*/
/*Header*/
.text-header {
    color: var(--Texts__Default);
    font-size: 19px;
    font-weight: 600;
}
/*-*/
/*Loading*/
.loading-icon {
    font-size: 3rem;
    color: var(--Primitives__White);
}

.loading-bg {
    z-index: 1031;
    background-color: var(--Backgrounds__Background2);
}
/*-*/
/*Buttons*/
.btn-add {
    height: 50px;
    border-radius: var(--Spacings__Spacing4);
    padding-top: var(--Spacings__Spacing3);
    padding-right: var(--Spacings__Spacing4);
    padding-bottom: var(--Spacings__Spacing3);
    padding-left: var(--Spacings__Spacing4);
    gap: var(--Spacings__Spacing2);
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: var(--Buttons__Primary);
    color: var(--Buttons__ButtonText);
}

    .btn-add:hover {
        background-color: var(--Primitives__DarkGreen30);
    }

.btn-add-sm {
    height: 40px;
    width: 40px;
    border-radius: var(--Spacings__Spacing4);
    padding: var(--Spacings__Spacing2);
    background-color: var(--Buttons__Primary);
    color: var(--Buttons__ButtonText);
    display: inline-block;
    justify-items: center;
}

    .btn-add-sm:hover {
        background-color: var(--Primitives__DarkGreen30);
    }

.btn-delete-sm {
    height: 40px;
    width: 40px;
    border-radius: var(--Spacings__Spacing4);
    padding: var(--Spacings__Spacing2);
    border: 1px solid var(--Status__Danger);
    color: var(--Buttons__ButtonText);
    display: inline-block;
    justify-items: center;
}

    .btn-delete-sm:hover {
        background-color: var(--Status__Danger);
    }

.btn-text-primary {
    color: var(--Buttons__Primary);
}

.btn-group.theme {
    background-color: var(--Backgrounds__Background3);
    border-radius: var(--Spacings__Spacing6);
    padding: var(--Spacings__Spacing1);
    height: 60px;
    display: flex;
    align-items: center;
}

.btn-theme {
    padding: var(--Spacings__Spacing3);
    gap: var(--Spacings__Spacing1);
    color: var(--Texts__Default);
    display: flex;
    align-items: center;
    justify-content: center;
}

    .btn-theme.active {
        border-radius: var(--Spacings__Spacing6) !important;
        border-color: var(--Backgrounds__BackgroundHighlight);
        height: 52px;
        background-color: var(--Backgrounds__BackgroundHighlight);
        color: var(--Texts__Negative);
    }

    .btn-theme:hover {
        border-radius: var(--Spacings__Spacing6) !important;
        border-color: var(--Backgrounds__BackgroundHighlight);
        height: 52px;
        background-color: var(--Backgrounds__BackgroundHighlight);
        color: var(--Texts__Negative);
    }

.bg-btn-primary {
    border-bottom-right-radius: var(--Spacings__Spacing4);
    border-bottom-left-radius: var(--Spacings__Spacing4);
    background-color: var(--Buttons__Primary);
    color: var(--Texts__Defaultfixed);
}

.btn-circle {
    height: 30px;
    width: 30px;
    border-radius: var(--Spacings__Spacing4);
    display: flex;
    justify-content: center;
    align-items: center;
}

.btn-circle-primary {
    background-color: var(--Backgrounds__Background2);
    color: var(--Texts__Defaultfixed);
}

    .btn-circle-primary:hover {
        background-color: var(--Primitives__Green60);
        color: var(--Texts__Defaultfixed);
    }

.btn-circle-default {
    background-color: var(--Backgrounds__Background3);
    color: var(--Texts__Defaultfixed);
}

    .btn-circle-default:hover {
        background-color: var(--Primitives__LightGrey60);
        color: var(--Texts__Defaultfixed);
    }

.btn-back {
    background-color: var(--Buttons__Thertiary);
    color: var(--Icons__Default);
    height: 40px;
    width: 40px;
    border-radius: var(--Spacings__Spacing5);
    padding: var(--Spacings__Spacing2);
    display: flex;
    justify-content: center;
    align-items: center;
}

.btn-back-image {
    position: absolute;
    top: 15px;
    left: 15px;
}

.bg-btn-back {
    background-color: var(--Backgrounds__Background1);
    color: var(--Icons__Default);
    height: 40px;
    width: 40px;
    border-radius: var(--Spacings__Spacing5);
    padding: var(--Spacings__Spacing2);
    display: flex;
    justify-content: center;
    align-items: center;
}

.bg-btn-pdf {
    background-color: var(--Backgrounds__Background1);
    color: var(--Icons__Default);
    border-radius: var(--Spacings__Spacing5);
    display: flex;
    justify-content: center;
    align-items: center;
}

.btn-pdf {
    background-color: var(--Buttons__Thertiary);
    color: var(--Icons__Default);
    border-radius: var(--Spacings__Spacing5);
    display: flex;
    justify-content: center;
    align-items: center;
}



.btn-popup {
    border-radius: var(--Spacings__Spacing5);
    padding-top: var(--Spacings__Spacing3);
    padding-right: var(--Spacings__Spacing4);
    padding-bottom: var(--Spacings__Spacing3);
    padding-left: var(--Spacings__Spacing4);
    gap: var(--Spacings__Spacing2);
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
}

    .btn-popup.outline-danger {
        border: 1px solid var(--Status__Danger);
        color: var(--Status__Danger);
    }

        .btn-popup.outline-danger:hover {
            background-color: var(--Status__Danger);
            color: var(--Texts__Negative);
        }

    .btn-popup.outline-secondary {
        border: 1px solid var(--Borders__BorderLight);
        color: var(--Buttons__Secondary);
    }

        .btn-popup.outline-secondary:hover {
            background-color: var(--Borders__BorderLight);
        }

    .btn-popup.outline-secondary-danger {
        border: 1px solid var(--Icons__Negative);
        color: var(--Buttons__Secondary);
    }

        .btn-popup.outline-secondary-danger:hover {
            background-color: var(--Icons__Negative);
        }

    .btn-popup.danger {
        background-color: var(--Status__Danger);
        color: var(--Texts__Negative);
    }

        .btn-popup.danger:hover {
            background-color: var(--Status__Danger20);
        }

    .btn-popup.primary {
        background-color: var(--Buttons__Primary);
        color: var(--Buttons__ButtonText);
    }

        .btn-popup.primary:hover {
            background-color: var(--Primitives__Green60);
        }
/*-*/
/*Documents*/
.document-card {
    background-color: var(--Backgrounds__Background1);
    border-radius: var(--Spacings__Spacing4);
    padding: var(--Spacings__Spacing3);
    gap: var(--Spacings__Spacing3);
    display: flex;
}

    .document-card.driver {
        background-color: var(--Backgrounds__Background3);
    }
/*-*/
/*HR*/
hr.dotted {
    border-top: 2px dotted var(--Borders__BorderDefault);
}

hr.light {
    background-color: var(--Borders__BorderLight);
    height: 1px;
    margin: 0 !important;
    margin-top: 0px !important;
    margin-right: .5rem !important;
    margin-bottom: 0px !important;
    margin-left: .5rem !important;
}

.border-bottom-dotted {
    border-bottom: 2px dotted var(--Borders__BorderDefault);
}
/*-*/
/*--Cards--*/
/*Vehicle*/
.driver-card-bg {
    background-color: var(--Backgrounds__Background1);
    border-radius: var(--Spacings__Spacing4);
}


.vehicle-card {
    background-color: var(--Backgrounds__Background3);
    min-height: 110px;
    height: 100%;
    gap: var(--Spacings__Spacing3);
    padding: var(--Spacings__Spacing3);
    border-radius: var(--Spacings__Spacing4);
}

    .vehicle-card.dark {
        background-color: var(--Backgrounds__BackgroundHighlight);
        color: var(--Texts__Negative);
    }

.vehicle-card-detail {
    background-color: var(--Backgrounds__Background1);
    border-radius: var(--Spacings__Spacing4);
    position: relative;
    margin-top: -28px;
    border: 1px solid var(--Borders__BorderLight);
}

.vehicle-card-img {
    width: 100%;
    height: 300px;
    object-fit: cover;
}

/*Configurator*/
.vehicle-configuration-card {
    background-color: var(--Backgrounds__Background3);
    gap: var(--Spacings__Spacing3);
    padding: var(--Spacings__Spacing3);
    border-radius: var(--Spacings__Spacing4);
    height: 100%;
}

    .vehicle-configuration-card.active {
        background-color: var(--Buttons__Primary);
        color: var(--Texts__Negative);
    }

    .vehicle-configuration-card.dark {
        background-color: var(--Backgrounds__BackgroundHighlight);
        color: var(--Texts__Negative);
    }

.card-configuration-active {
    border: 2px solid var(--Buttons__Primary);
    border-top-left-radius: var(--Spacings__Spacing4);
    border-top-right-radius: var(--Spacings__Spacing4);
}
/*-*/

/*Driver*/
.driver-card {
    background-color: var(--Backgrounds__Background1);
    border-bottom-left-radius: var(--Spacings__Spacing4);
    border-bottom-right-radius: var(--Spacings__Spacing4);
}

/*FuelCard*/
.fuelCard-default {
    height: 130px;
    color: var(--Texts__Negative);
    background-color: var(--Backgrounds__BackgroundHighlight);
    border-radius: var(--Spacings__Spacing4);
    padding: var(--Spacings__Spacing3);
}

.fuelCard-icon {
    background-color: var(--Backgrounds__Background1);
    color: var(--Icons__Default);
    height: 40px;
    width: 40px;
    border-radius: var(--Spacings__Spacing5);
    padding: var(--Spacings__Spacing2);
    gap: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.fuelCard-primary {
    height: 130px;
    color: var(--Texts__Defaultfixed);
    background-color: var(--Backgrounds__Background2);
    border-radius: var(--Spacings__Spacing4);
    padding: var(--Spacings__Spacing3);
}

.fuelCard-title {
    color: var(--Texts__Highlights)
}

.fuelCard-popup-row {
    padding-top: var(--Spacings__Spacing4);
    padding-right: var(--Spacings__Spacing4);
    padding-left: var(--Spacings__Spacing4);
}

    .fuelCard-popup-row.buttons {
        padding-top: var(--Spacings__Spacing3);
        padding-bottom: var(--Spacings__Spacing4);
    }

.fuelCard-popup {
    background-color: var(--Backgrounds__Background1);
    color: var(--Texts__Default);
    border-radius: var(--Spacings__Spacing6);
    gap: var(--Spacings__Spacing2);
    overflow-y: auto !important;
}

.fuelCard-offcanvas {
    background-color: var(--Backgrounds__Background1);
    color: var(--Texts__Default);
    border-top-left-radius: var(--Spacings__Spacing4);
    border-top-right-radius: var(--Spacings__Spacing4);
    gap: var(--Spacings__Spacing2);
    overflow-y: auto;
    height: auto !important;
    padding: 0;
}
/*--*/

/*----- Vehicle -----*/
/*VehicleBadge*/
.vehicle-card-detections {
    display: none;
}

.badge-custom {
    padding-top: var(--Spacings__Spacing1);
    padding-right: var(--Spacings__Spacing2);
    padding-bottom: var(--Spacings__Spacing1);
    padding-left: var(--Spacings__Spacing2);
    gap: var(--Spacings__Spacing2);
    border-radius: 12px;
    font-size: 10px;
    font-weight: 600;
}

    .badge-custom.primary {
        background-color: var(--Badge__Background1);
        color: var(--Badge__Text1);
    }

    .badge-custom.secondary {
        background-color: var(--Badge__Background3);
        color: var(--Badge__Text2);
    }

    .badge-custom.tertiary {
        background-color: var(--Badge__Background2);
        color: var(--Badge__Text2);
    }
/*-*/
/*VehicleDocuments, VehicleDetections and SupplierInformations*/
.title-head {
    background-color: var(--Backgrounds__BackgroundHighlight);
    color: var(--Texts__Negative);
    height: 75px;
}

.title-body {
    background-color: var(--Backgrounds__Background1);
    border-radius: var(--Spacings__Spacing4);
    margin-top: -25px;
    border: 1px solid var(--Borders__BorderLight);
}

.title-body-minimal {
    background-color: var(--Backgrounds__Background1);
    margin-top: -25px;
    border-radius: var(--Spacings__Spacing4);
}
/*-*/
/*VehicleDetails*/
.vehicle-details-option:hover {
    background-color: var(--Primitives__DarkGreen30);
}

.vehicle-tab {
    color: var(--Texts__Placeholder);
}

    .vehicle-tab.active {
        color: var(--Texts__Default);
    }

.vehicle-image {
    max-height: 50%;
    object-fit: cover;
}
/*-*/
/*Configurator*/
.vehicle-configuration-image {
    border-top-left-radius: var(--Spacings__Spacing4);
    border-top-right-radius: var(--Spacings__Spacing4);
}
/*-*/

/*----- Tolls -----*/
.tolls-card {
    padding: var(--Spacings__Spacing3);
    border-radius: var(--Spacings__Spacing4);
    gap: var(--Spacings__Spacing3);
}

.toll-toggle {
    background-color: var(--Backgrounds__Background1);
    color: var(--Texts__Default);
}

.tolls-recap {
    background-color: var(--Backgrounds__Background3);
    color: var(--Texts__Default);
    border-radius: var(--Spacings__Spacing4);
    padding: var(--Spacings__Spacing3);
    gap: var(--Spacings__Spacing1);
}
/*-*/

/*md*/
@media (min-width: 768px) {
    /*Generics*/
    .bg-padding {
        padding: var(--Spacings__Spacing5);
    }
    /*Text*/
    .text-title {
        color: var(--Texts__Default);
    }

    .title-head {
        background-color: var(--Backgrounds__Background1);
        color: var(--Texts__Default);
        height: auto;
    }

    .title-body {
        margin-top: 0;
    }

    .title-body-minimal {
        margin-top: 0;
    }

    /*Vehicle*/
    .vehicle-image {
        border-top-left-radius: var(--Spacings__Spacing4);
        border-top-right-radius: var(--Spacings__Spacing4);
    }

    /*Cards*/
    .vehicle-card {
        min-height: 137px;
    }

    .fuelCard-default {
        height: 137px;
    }

    .fuelCard-primary {
        height: 137px;
    }

    .card-md {
        border: 1px solid var(--Borders__BorderLight) !important;
        border-width: 1px !important;
        border-radius: var(--Radius__Radius3) !important;
        padding: var(--Spacings__Spacing4);
        background-color: var(--Backgrounds__Background1);
    }

    .driver-card {
        border-radius: var(--Spacings__Spacing4);
    }

    .document-card {
        background-color: var(--Backgrounds__Background3);
        padding: var(--Spacings__Spacing4);
    }
}

@media (min-width: 950px) {
    /*VehicleBadge*/
    .vehicle-card-detections {
        display: flex;
    }
}

/*lg*/
@media (min-width: 992px) {
    /*VehicleDetections*/
    .col-lg-card {
        --bs-card-spacer-y: 1rem;
        --bs-card-spacer-x: 1rem;
        --bs-card-title-spacer-y: .5rem;
        --bs-card-border-width: var(--bs-border-width);
        --bs-card-border-color: var(--bs-border-color-translucent);
        --bs-card-border-radius: var(--bs-border-radius);
        --bs-card-inner-border-radius: calc(var(--bs-border-radius) -(var(--bs-border-width)));
        --bs-card-cap-padding-y: .5rem;
        --bs-card-cap-padding-x: 1rem;
        --bs-card-cap-bg: rgba(var(--bs-body-color-rgb), .03);
        --bs-card-bg: var(--bs-body-bg);
        --bs-card-img-overlay-padding: 1rem;
        --bs-card-group-margin: .75rem;
        position: relative;
        min-width: 0;
        height: var(--bs-card-height);
        color: var(--Texts__Default);
        word-wrap: break-word;
        background-color: var(--Backgrounds__Background1);
        background-clip: border-box;
        border: var(--bs-card-border-width) solid var(--bs-card-border-color);
        border-radius: var(--bs-card-border-radius);
        padding: 1rem !important;
    }

    /*Tolls*/
    .tolls-card {
        padding: var(--Spacings__Spacing4);
        border-radius: var(--Spacings__Spacing4);
        gap: var(--Spacings__Spacing5);
    }

    .toll-toggle {
        min-width: 250px;
        background-color: var(--Backgrounds__Background1);
        color: var(--Texts__Default);
    }
}

.offcanvas-backdrop, .modal-backdrop, .loading-bg {
    margin: 0 !important;
}

@media (min-width: 1700px) {
    .col-xxxl-3 {
        flex: 0 0 auto;
        width: 25%;
    }
}

.aliasInitials {
    height: 3.5rem;
    width: 3.5rem;
    border-radius: 50% !important;
    text-align: center !important;
    padding: 0.5rem;
}

    .aliasInitials > * {
        font-size: 1.5rem;
    }


/*Table custom*/
.table-card {
    border-collapse: separate;
    border-spacing: 0 10px; /* Spazio verticale tra le righe */
}

    .table-card tr td:first-child {
        border-top-left-radius: var(--Spacings__Spacing4);
        border-bottom-left-radius: var(--Spacings__Spacing4);
        padding-left: var(--Spacings__Spacing3);
    }

    .table-card tr th:first-child {
        padding-left: var(--Spacings__Spacing3);
    }

    .table-card tr td:last-child {
        border-top-right-radius: var(--Spacings__Spacing4);
        border-bottom-right-radius: var(--Spacings__Spacing4);
        padding-right: var(--Spacings__Spacing3);
    }

    .table-card tr th:last-child {
        border-top-right-radius: var(--Spacings__Spacing4);
        border-bottom-right-radius: var(--Spacings__Spacing4);
        padding-right: var(--Spacings__Spacing3);
    }

    .table-card tr.row-bg-primary td {
        padding-bottom: var(--Spacings__Spacing3);
        padding-top: var(--Spacings__Spacing3);
        background-color: var(--Backgrounds__Background2) !important;
        color: var(--Texts__Defaultfixed) !important;
    }

        .table-card tr.row-bg-primary td .option-cell {
            background-color: var(--Backgrounds__Background2) !important;
            color: var(--Texts__Defaultfixed) !important;
        }

    .table-card tr.row-bg-default td {
        padding-bottom: var(--Spacings__Spacing3);
        padding-top: var(--Spacings__Spacing3);
        background-color: var(--Backgrounds__Background3) !important;
        color: var(--Texts__Defaultfixed) !important;
    }

        .table-card tr.row-bg-default td .option-cell {
            background-color: var(--Backgrounds__Background3) !important;
            color: var(--Texts__Defaultfixed) !important;
        }


    .table-card tr:nth-child(n+2) td { /* Evita di spostare la prima riga */
        position: relative;
        top: 10px;
    }