/* Bootstrap Overrides */
.card, .btn, .form-control, .dropdown-menu, .modal-content, .navbar, .progress, .input-group-text, .list-group-item, .nav-tabs .nav-link, .pagination .page-link {
    border-radius: 0 !important;
}

h1, h2, h3, h4, h5, h6 {
    font-family: "Roboto", sans-serif;
    font-optical-sizing: auto;
    font-weight: 300;
    font-style: normal;
    font-variation-settings: "wdth" 100;
}

.page {
    /* background-color: #f8f8f8; */
    margin-top: 59px !important;
}

.bg-white {
    background: #ffffff !important;
}

.background-theme {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url('/images/plans-grad.jpg');
    background-size: cover;
    background-position: center;
    z-index: 1;
}

.foreground-theme {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #003059; /* You can change this color */
    opacity: 1;
    transition: opacity 400ms ease-in-out;
    z-index: 2;
}

.foreground-theme.fade {
    opacity: 0.5;
}

.forground-100 {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: transparent !important; /* transparent background */
    z-index: 100;
}

.page-notifications {
    margin-top: 50px;
}

.with-navbar {
    padding-top: 56px;
}

.brand--header {
    transition: opacity 0.5s ease-in-out;
}

.brand--header.fade-out {
    opacity: 0;
}

.logo-white {
    margin-top: 25vh;
}



.page--login {
    margin-top: 25vh;
}

.login-form {
    transition: opacity 0.5s ease-in-out;
    opacity: 0;
}

.login-form.fade-in {
    opacity: 1;
}

/* Ensure the login form is hidden initially */
.d-none {
    display: none;
}

.spinner-border {
    width: 2rem;
    height: 2rem;
    animation-duration: 1s; /* Slower spin */
}

.notification-link {
    background: transparent !important;
    color: inherit !important;
    text-decoration: none !important;
    border: none !important;
    border-bottom: 1px solid #dee2e6 !important;
}

.theme--shadow {
    -webkit-box-shadow: 0 5px 10px 0 rgba(0,0,0,.4);
    box-shadow: 0 5px 10px 0 rgba(0,0,0,.4);
}

/* .dropdown-menu .dropdown-item:hover, 
.dropdown-menu .dropdown-item:focus {
    background-color: #f8f9fa !important; 
    color: #212529 !important;
} */

a.timer--item--row {
    text-decoration: none !important;
    color: inherit !important;
}

a.timer--item--row:hover {
    text-decoration: none !important;
    color: inherit !important;
}

a.admin--company--link {
    text-decoration: none !important;
    color: inherit !important;
}

a.admin--company--link:hover {
    text-decoration: none !important;
    color: inherit !important;
}

/* Target the side nav container */
/* nav.vh-100 {
    min-height: 100vh;
    background: #fff;
    border-right: 1px solid #dee2e6;
} */

/* Target the nav list */
nav.vh-100 .nav.flex-column {
    padding-left: 0;
}

/* Target all nav links in the side nav */
/* nav.vh-100 .nav-link {
    color: #333;
    padding: 0.75rem 1rem;
    border-radius: 0.375rem;
    transition: background 0.2s, color 0.2s;
    font-weight: 500;
} */

/* Active link */
/* nav.vh-100 .nav-link.active,
nav.vh-100 .nav-link:focus,
nav.vh-100 .nav-link:hover {
    background: #f0f2f5;
    color: #0d6efd;
    text-decoration: none;
} */

/* Optional: icon spacing */
nav.vh-100 .nav-link i {
    margin-right: 0.5em;
}