body {
    background-color: #e3e3e3;
    font-family: 'Inter', 'Heebo', 'Open Sans', sans-serif;
}

[data-bs-theme=dark] body {
    background-color: #161616 !important;
}

[data-bs-theme=dark] .topbar {
    background-color: #111 !important;
}

[data-bs-theme=dark] .topbar .fa, [data-bs-theme=dark] .topbar .fa-regular, [data-bs-theme=dark] .topbar .fa-solid {
    color: #fff !important;
}

[data-bs-theme=dark] a {
    color: initial !important;
}

/* Topbar */

.topbar {
    padding: 20px;
}

.topbar .logo {
    height: 70px;
    margin-bottom: -15px;
    margin-top: -15px;
}

.topbar .userLinks {
    position: relative;
}

.topbar .userLinks ul {
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
}

.topbar .nav-link {
    font-size: 110%;
}

.topbar .nav-link::after {
    display: none !important;
}

.topbar a {
    color: #c75144 !important;
    font-weight: bold;
    text-decoration: none;
}

/* Navigation */

.mainNavigation {
    background: #233249 !important;
    padding: 0;
}

.mainNavigation .nav-item {
    padding: 15px 10px;
    position: relative;
}

.mainNavigation .nav-item a.nav-link {
    color: #fff;
}

@media (min-width: 768px) {
    .mainNavigation .nav-item:has(> a.active)::after {
        content: "";
        display: block;
        width: 50%;
        position: absolute;
        left: 50%;
        right: 50%;
        transform: translateX(-50%);
        bottom: 0px;
        border-bottom: 5px solid white;
    }

    .mainNavigation .nav-item:not(:last-child) a.nav-link::after {
        content: "";
        display: block;
        height: 25%;
        position: absolute;
        top: 50%;
        bottom: 50%;
        transform: translateY(-50%);
        right: 0px;
        border-right: 1px solid white;
        border-top: none !important;
    }

    .mainNavigation .dropdown-toggle::after {
        display: none;
    }
}

/* Dashboard */
.btn-dashboard {
    aspect-ratio: 1 / 1;
    font-weight: bold;
}

.operationalNotices {
    flex: 1;
    background: #be81c4;
    color: #fff;
}

.operationalNotices .card-footer {
    background: #ab75af;
    border: none;
    padding-top: 10px;
    padding-bottom: 10px;
}

.operationalNotices a {
    color: #fff !important;
}

.avatar-xl {
    width: 74px !important;
    height: 74px !important;
}

.avatar {
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    border-radius: 0.75rem;
    height: 48px;
    width: 48px;
    transition: all .2s ease-in-out;
}

@font-face {
    font-family: vrmFont;
    src: url('../fonts/vrmFont.ttf') format('truetype');
    font-weight: bold;
}

.vehicleVRM {
    background-color: #f5cb2f;
    border-radius: 5px;
    padding: 5px;
    border: 2px black solid;
    font-size: 9px;
}

.vehicleVRM h2 {
    font-weight: bold;
    font-size: 50px;
    font-family: "vrmFont", serif;
    margin-bottom: -5px;
}

a {
    color: #0e3280;
    text-decoration: none;
    font-weight: bold;
}