.fi {
    --dc-sidebar-bg: #edf8e7;
    --dc-sidebar-bg-soft: #f6fbf2;
    --dc-sidebar-border: #cfe7c3;
    --dc-sidebar-hover: #dff2d6;
    --dc-sidebar-active: #d5edcb;
    --dc-sidebar-text: #3f2414;
    --dc-sidebar-muted: #6b4a35;
    --dc-sidebar-green: #32c84d;
    --dc-sidebar-green-dark: #209638;
}

.fi-sidebar {
    background: var(--dc-sidebar-bg);
    border-right: 1px solid var(--dc-sidebar-border);
    box-shadow: inset -1px 0 0 rgb(255 255 255 / 65%);
}

.fi-main-ctn,
.fi-main,
.fi-page,
.fi-page-main,
.fi-page-content,
.fi-section,
.fi-ta,
.fi-ta-ctn,
.fi-ta-main {
    max-width: 100%;
    min-width: 0;
}

.fi-ta-main {
    overflow-x: auto;
}

.fi-sidebar-header-ctn,
.fi-sidebar-header {
    background: transparent;
    border: 0;
    box-shadow: none;
}

.fi-sidebar-header {
    min-height: 70px;
    padding-inline: 24px 14px;
}

.fi-sidebar-header-logo-ctn {
    min-width: 0;
}

.fi-logo {
    color: var(--dc-sidebar-text);
    font-size: 15px;
    font-weight: 500;
    letter-spacing: 0;
    object-fit: contain;
    width: auto;
}

.fi-sidebar-nav {
    padding: 8px 12px 24px;
}

.fi-sidebar-nav-groups {
    gap: 10px;
}

.fi-sidebar-group {
    gap: 4px;
}

.fi-sidebar-group-btn {
    border-radius: 10px;
    color: var(--dc-sidebar-muted);
    min-height: 38px;
    padding: 8px;
}

.fi-sidebar-group-btn:hover {
    background: var(--dc-sidebar-hover);
    color: var(--dc-sidebar-text);
}

.fi-sidebar-group-label {
    color: var(--dc-sidebar-muted);
    font-size: 15px;
    font-weight: 500;
}

.fi-sidebar-group-collapse-btn {
    color: var(--dc-sidebar-muted);
}

.fi-sidebar-group-items {
    gap: 4px;
    margin-block: 2px 12px;
}

.fi-sidebar-item-btn {
    border-radius: 8px;
    color: var(--dc-sidebar-text);
    min-height: 40px;
    padding: 9px 8px;
    position: relative;
    transition:
        background-color 160ms ease,
        color 160ms ease,
        transform 160ms ease;
}

.fi-sidebar-item-btn:hover {
    background: var(--dc-sidebar-hover);
    color: var(--dc-sidebar-text);
}

.fi-sidebar-item.fi-active > .fi-sidebar-item-btn {
    background: var(--dc-sidebar-active);
    color: var(--dc-sidebar-text);
    font-weight: 600;
}

.fi-sidebar-item.fi-active > .fi-sidebar-item-btn::before {
    background: var(--dc-sidebar-green);
    border-radius: 999px;
    content: '';
    height: 20px;
    inset-inline-start: -18px;
    position: absolute;
    width: 3px;
}

.fi-sidebar-item-icon,
.fi-sidebar-group-btn > svg,
.fi-sidebar-group-dropdown-trigger-btn > svg {
    color: var(--dc-sidebar-muted);
    height: 21px;
    width: 21px;
}

.fi-sidebar-item.fi-active > .fi-sidebar-item-btn .fi-sidebar-item-icon,
.fi-sidebar-item-btn:hover .fi-sidebar-item-icon,
.fi-sidebar-group-btn:hover > svg,
.fi-sidebar-group-dropdown-trigger-btn:hover > svg {
    color: var(--dc-sidebar-green-dark);
}

.fi-sidebar-item-label {
    color: inherit;
    font-size: 15px;
    font-weight: 500;
    letter-spacing: 0;
}

.fi-sidebar-close-collapse-sidebar-btn,
.fi-sidebar-open-collapse-sidebar-btn {
    background: var(--dc-sidebar-text);
    border-radius: 999px;
    color: #fff;
    height: 26px;
    width: 26px;
}

.fi-sidebar-close-collapse-sidebar-btn:hover,
.fi-sidebar-open-collapse-sidebar-btn:hover {
    background: var(--dc-sidebar-green-dark);
    color: #fff;
}

.fi-sidebar:not(.fi-sidebar-open) {
    background: var(--dc-sidebar-bg);
}

.fi-sidebar:not(.fi-sidebar-open) .fi-sidebar-nav {
    padding-inline: 12px;
}

.fi-sidebar:not(.fi-sidebar-open) .fi-sidebar-item-btn,
.fi-sidebar:not(.fi-sidebar-open) .fi-sidebar-group-dropdown-trigger-btn {
    border-radius: 10px;
}
