:root {
    --primary_fore: #ca161d;
    --secondary_fore: #2F7ED5FF;
    --tertiary_fore: #fac200;
    --quatiary_fore: #ac1d22;

    --primary_back: #2a2c3c;
    --secondary_back: #171721;
    --tertiary_back: #0f1017;
    --quatiary_back: #205a9a;

    --primary_text: #b7c2c0;
    --secondary_text: #929a96;
    --tertiary_text: #6b706b;
    --quatiary_text: #f8c000;
}

body {
    color: var(--secondary_text);
    font-size: 16px;
    width: 100%;
    height: 100vh;
}

.footer {
    background-color: var(--secondary_back);
    color: var(--secondary_text);
    font-size: 16px;
    width: 100%;
    height: 100vh;
}

.navbar {
    background-color: var(--secondary_back);
    color: var(--secondary_text);
    font-size: 16px;
}

.navbar-nav .nav-link.active, .navbar-nav .nav-link.show {
    --bs-navbar-active-color: var(--primary_fore); /* Color for active/clicked links */
}

.navbar-nav .nav-link.active, .navbar-nav .nav-link:hover {
    color: var(--primary_fore);
}

.sidebar {
    min-height: 100vh;
}
@media (max-width: 768px) {
    #sidebarCollapse {
        width: 250px; /* Adjust width as necessary */
        height: auto; /* Height adjusts to content */
        overflow-y: auto; /* Allows scrolling within the sidebar if content overflows */
    }
    .sidebar.collapse {
        display: none; /* Ensures it does not display when collapsed */
    }
    .sidebar.collapsing {
        position: relative; /* Ensures position is maintained during transition */
        height: auto; /* Ensures height adjusts to content during transition */
        transition: height 0.35s ease;
    }
}

.sidebar.collapse {
    display: none; /* Ensures it does not display when collapsed */
}

.sidebar.collapsing {
    position: fixed; /* Ensures position is maintained during transition */
    height: auto; /* Ensures height adjusts to content during transition */
    transition: height 0.35s ease;
}

.form-check .form-check-input {
    float: none;
}

tr td.form-check.form-switch {
    display: table-cell;
}

/* Ensure that all anchor links with the class 'custom-link' are white and have no underline */
.custom-return-link {
    color: white;
    text-decoration: none;
}

.custom-return-link:hover {
    text-decoration: underline; /* Underline on hover */
}

@media (min-width: 768px) {
    #sidebarCollapse {
        display: block !important; /* Always display sidebar on larger screens */
        top: 0;
        bottom: 0;
        left: 0;
        height: 100vh; /* Ensures sidebar extends to full viewport height */
        overflow-y: auto; /* Allows scrolling within the sidebar if content overflows */
    }
}

.is-valid {
    border-color: #28a745;
    box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.25);
}

.is-invalid {
    border-color: #dc3545;
    box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25);
}