body {
    height: 100vh;
}

.page-wrapper {
    height: 100%;
}

.page-logo,
.page-sidebar,
.nav-footer,
.bg-brand-gradient {
    background: none;
}

.page-logo img {
    width: unset;
    height: 80px;
}

.page-logo {
    box-shadow: none;
    padding: 0;
    width: 90px;
    height: 80px;
}

.page-logo-text {
    color: var(--primary-950);
}

.page-sidebar {
    background-color: white;
    padding: 0;
    width: 240px;
    max-width: 240px;
    gap: 16px;
}

.page-sidebar-logo-container {
    height: 72px;
    border-bottom: 1px solid transparent;
    border-image: repeating-linear-gradient(to right, var(--primary-200) 0%, var(--primary-200) 4px, transparent 4px, transparent 8px) 1;
    padding: 16px 0px 16px 16px;
    gap: 16px;
}



/* #region MARK: Page Header */
.page-header {
    box-shadow: none;
    height: 72px;
    border-bottom: 1px solid transparent;
    border-image: repeating-linear-gradient(to right, var(--primary-200) 0%, var(--primary-200) 4px, transparent 4px, transparent 8px) 1;
}

.header-icon:not(.btn)>[class*='fa-']:first-child,
.header-icon:not(.btn)>.ni:first-child {
    color: var(--primary-500);
}

.header-icon:not(.btn):hover>[class*='fa-']:only-child,
.header-icon:not(.btn):hover>.ni {
    color: var(--primary-200);
}

/* #endregion Page Header */

.page-content {
    color: var(--primary-900);
    overflow-x: hidden;
}

/* #region MARK: Left Nav */
.primary-nav {
    padding: 0px 16px 16px 16px;
    gap: 16px;
}

.primary-nav .nav-menu:first-of-type {
    margin-bottom: 0;
    margin-top: 0;
}

.nav-menu li {
    margin-bottom: 16px;
}

.nav-menu li:last-of-type {
    margin-bottom: 0;
}

.nav-menu li a {
    gap: 12px;
    font-size: 16px !important;
    color: var(--bs-black);
    border-radius: 8px;
    margin-bottom: 16px;

    padding: 8px 16px !important;
}

.nav-menu li:hover>a,
.nav-menu li.open>a,
.nav-menu li a:focus,
.nav-menu li>ul>li:hover a {
    background-color: var(--primary-100);
    color: var(--bs-black);
}

.nav-menu li.active>a {
    background-color: var(--primary-300);
    color: var(--bs-black);
    border-radius: 8px;
    box-shadow: none;
}

.nav-menu li a>[class*='fa-'],
.nav-menu li a>.ni,
.nav-menu li:hover a>[class*='fa-'],
.nav-menu li:hover a>.ni .nav-menu li.active>a:hover>[class*='fa-'],
.nav-menu li.active>a:hover>.ni,
.nav-menu li>ul li a,
.nav-menu li:hover>ul li a,
.nav-menu li b.collapse-sign {
    color: var(--bs-black) !important;
}

.nav-menu li.active:not(.open)>a:before {
    content: none;
}

.nav-menu li>ul li.active>a {
    background-color: var(--primary-300);
}

.nav-menu li>ul {
    background: none;
    margin-left: 16px;
}


.mod-nav-link:not(.nav-function-top):not(.nav-function-minify):not(.mod-hide-nav-icons) ul.nav-menu:not(.nav-menu-compact)>li>ul:before {
    content: none;
}

.mod-nav-link:not(.nav-function-top):not(.nav-function-minify):not(.mod-hide-nav-icons) ul.nav-menu:not(.nav-menu-compact)>li>ul>li a:after {
    content: none;
}

/* #endregion Left Nav */

/* #region MARK: Dropdown */
.dropdown-item.active,
.dropdown-item:active {
    color: var(--primary-500);
}

.dropdown-item:hover,
.dropdown-item:focus {
    color: var(--primary-500);
    background-color: var(--primary-50);
}

/* #endregion Dropdown */

/* #region MARK: Page item */
.page-item.active .page-link {
    background-color: var(--primary-500);
    color: var(--bs-black);
}

.pagination .page-link:hover {
    background-color: var(--primary-300) !important;
    color: var(--bs-black);
}

/* #endregion Page item */

/* #region MARK: Profile image */
.profile-image p {
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    filter: invert(1) grayscale(1) contrast(9);
    background-color: inherit;

    font-weight: 600;
}

.profile-image {
    --profile-image-size: 32px;
    --profile-image-bg: lavender;
    --profile-image-border-radius: 0.5rem;
    height: var(--profile-image-size);
    width: var(--profile-image-size);
    border-radius: var(--profile-image-border-radius);
    display: flex;
    align-items: center;
    justify-content: center;
    user-select: none;
    background-color: var(--profile-image-bg);
    padding: inherit;
}

.profile-image.profile-image-round {
    --profile-image-border-radius: 50%;
}

.profile-image-medium {
    --profile-image-size: 40px;
}

.profile-image-medium>p {
    font-size: 14px;
}

.profile-image-big {
    --profile-image-size: 48px;
}

.profile-image-big>p {
    font-size: 14px;
}

.profile-image-bigger {
    --profile-image-size: 64px;
}

.profile-image-bigger>p {
    font-size: 23px;
}

.profile-image-small {
    --profile-image-size: 24px;
}

.profile-image-small>p {
    font-size: 12px;
}

/* #endregion Profile image */

/* #region MARK: Col */
.col-1,
.col-2,
.col-3,
.col-4,
.col-5,
.col-6,
.col-7,
.col-8,
.col-9,
.col-10,
.col-11,
.col-12,
.col,
.col-auto,
.col-sm-1,
.col-sm-2,
.col-sm-3,
.col-sm-4,
.col-sm-5,
.col-sm-6,
.col-sm-7,
.col-sm-8,
.col-sm-9,
.col-sm-10,
.col-sm-11,
.col-sm-12,
.col-sm,
.col-sm-auto,
.col-md-1,
.col-md-2,
.col-md-3,
.col-md-4,
.col-md-5,
.col-md-6,
.col-md-7,
.col-md-8,
.col-md-9,
.col-md-10,
.col-md-11,
.col-md-12,
.col-md,
.col-md-auto,
.col-lg-1,
.col-lg-2,
.col-lg-3,
.col-lg-4,
.col-lg-5,
.col-lg-6,
.col-lg-7,
.col-lg-8,
.col-lg-9,
.col-lg-10,
.col-lg-11,
.col-lg-12,
.col-lg,
.col-lg-auto,
.col-xl-1,
.col-xl-2,
.col-xl-3,
.col-xl-4,
.col-xl-5,
.col-xl-6,
.col-xl-7,
.col-xl-8,
.col-xl-9,
.col-xl-10,
.col-xl-11,
.col-xl-12,
.col-xl,
.col-xl-auto {
    padding-left: 0;
    padding-right: 0;
}

/* #endregion Col */

/* #region MARK: Sub Header */
@media only screen and (max-width: 992px) {
    .page-wrapper .page-content .subheader {
        margin-bottom: 0;
    }
}

/* #endregion Sub Header */

/* #region MARK: page-content */
@media (min-width: 992px) {
    .page-content {
        padding: 0;
    }
}

/* #endregion page-content */