/* Keep Filament's native responsive layout, collapse controls and tooltips. */
.fi-main-sidebar {
    background: #11151b;
    border-inline-end: 1px solid #242b33;
    color: #f0f2ed;
}

.fi-main-sidebar .fi-sidebar-header {
    background: #11151b;
    box-shadow: none;
    border-bottom: 1px solid #242b33;
}

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

.fi-main-sidebar .fi-logo {
    max-width: 100%;
}

.cogsys-panel-brand {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
    height: 100%;
    text-align: start;
}

.cogsys-panel-wordmark {
    color: #11151b;
    font-size: 1.625rem;
    font-weight: 600;
    line-height: 1;
    letter-spacing: -0.075em;
}

.cogsys-panel-wordmark > span {
    color: #b7f34a;
}

.cogsys-panel-company {
    overflow: hidden;
    margin-top: 0.375rem;
    color: #68736f;
    font-size: 0.6875rem;
    font-weight: 400;
    line-height: 1;
    text-overflow: ellipsis;
    white-space: nowrap;
    letter-spacing: 0;
}

.fi-main-sidebar .cogsys-panel-wordmark,
.dark .cogsys-panel-wordmark {
    color: #f0f2ed;
}

.fi-main-sidebar .cogsys-panel-company,
.dark .cogsys-panel-company {
    color: #9ba49f;
}

.fi-main-sidebar .fi-sidebar-nav {
    padding: 1.25rem 1rem;
    scrollbar-color: #38414b transparent;
    scrollbar-width: thin;
}

.fi-main-sidebar .fi-sidebar-nav-groups {
    gap: 1.5rem;
}

.fi-main-sidebar .fi-sidebar-group-items {
    gap: 0.25rem;
}

.fi-main-sidebar .fi-sidebar-group-btn {
    padding-inline: 0.75rem;
}

.fi-main-sidebar .fi-sidebar-group-label {
    color: #9ba49f;
    font-size: 0.625rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.fi-main-sidebar .fi-sidebar-item-btn {
    min-height: 2.625rem;
    padding: 0.625rem 0.75rem;
    border-radius: 0.625rem;
    transition: background-color 150ms ease, color 150ms ease;
}

.fi-main-sidebar .fi-sidebar-item-label {
    color: #c9cec6;
    font-size: 0.8125rem;
    font-weight: 500;
}

.fi-main-sidebar .fi-sidebar-item-icon {
    width: 1.25rem;
    height: 1.25rem;
    color: #8c9895;
}

.fi-main-sidebar .fi-sidebar-item-btn:hover {
    background: #1d242c;
}

.fi-main-sidebar .fi-sidebar-item-btn:hover :is(.fi-sidebar-item-label, .fi-sidebar-item-icon) {
    color: #f0f2ed;
}

.fi-main-sidebar .fi-sidebar-item.fi-active > .fi-sidebar-item-btn {
    background: #b7f34a12;
    box-shadow: inset 0 0 0 1px #b7f34a24;
}

.fi-main-sidebar .fi-sidebar-item.fi-active > .fi-sidebar-item-btn :is(.fi-sidebar-item-label, .fi-sidebar-item-icon) {
    color: #c5f580;
}

.fi-main-sidebar .fi-icon-btn {
    color: #9ba49f;
}

.fi-main-sidebar .fi-icon-btn:hover {
    color: #f0f2ed;
    background: #242b33;
}

.fi-main-sidebar :is(a, button):focus-visible {
    outline: 2px solid #b7f34a;
    outline-offset: 2px;
}

@media (min-width: 1024px) {
    .fi-main-sidebar:not(.fi-sidebar-open) .fi-sidebar-nav-groups {
        gap: 1rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .fi-main-sidebar .fi-sidebar-item-btn {
        transition: none;
    }
}
