:root {
    --sidebar-width: 250px;
    --topbar-height: 56px;
}

#wrapper {
    display: flex;
    flex-direction: row;
    height: 100vh;
    overflow: hidden;
}

#sidebar {
    width: var(--sidebar-width);
}

#sidebar .nav-link {
    color: #adb5bd;
    padding-right: 0.5rem;
}

#sidebar .nav-link:hover {
    color: #fff;
}

#sidebar .toggle-icon {
    transition: transform 0.2s;
}

#sidebar .nav-link[aria-expanded="true"] .toggle-icon {
    transform: rotate(90deg);
}

#sidebar ul ul {
    padding-left: 1rem;
}

.table th {
    /*color: var(--nv-color-primary);*/
}

/* TABLE */

.column-sort {
  display: inline-flex;
  align-items: center;
  font-weight: 500;
/*  color: var(--nv-color-primary);*/
  text-decoration: none;
  gap: 0.25rem;
}

.column-sort:hover {
  /*color: var(--nv-color-active);*/
  text-decoration: none;
}

.column-sort .bi {
  font-size: 0.75rem;
  opacity: 0.6;
  transition: transform 0.2s, opacity 0.2s;
}

.column-sort.active {
  /*color: var(--nv-color-active);*/
}

/* -- END TABLE -- */

@media (min-width: 768px) {
    #sidebar {
        position: relative;
        transform: none !important;
        visibility: visible !important;
        height: 100vh;
        z-index: 1020;
    }

    #sidebar .offcanvas-header {
        display: none;
    }
}

#topbar {
    height: var(--topbar-height);
}

#content-area {
    flex: 1;
    display: flex;
    flex-direction: column;
    height: 100vh;
    overflow: hidden;
}

#main {
    flex-grow: 1;
    overflow: auto;
    padding: 1.5rem;
    background: linear-gradient(to bottom, rgba(33, 37, 41, 0.05), transparent 40px),
    var(--bs-gray-100);
}

.overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7); /* Semi-transparent black */
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 2000; /* Above most elements, below Bootstrap modals */
}

.loading-box {
    text-align: center;
    color: white;
}

.loading-box .spinner-border {
    width: 3rem;
    height: 3rem;
}