/* Brand layer over Filament (docs/06-design.md): navy sidebar, orange accent on the active item. */
:root {
    --brand-navy: #1b254f;
    --brand-navy-light: #2a3769;
    --brand-orange: #d26e1e;
}

.fi-body {
    font-variant-numeric: tabular-nums;
}

.fi-main-sidebar,
.fi-main-sidebar .fi-sidebar-header {
    background-color: var(--brand-navy);
}

/* The word mark follows the logo: navy letters over a line that starts orange. */
.fi-logo {
    color: var(--brand-navy);
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    padding-bottom: 3px;
    border-bottom: 4px solid var(--brand-navy);
    border-image: linear-gradient(to right, var(--brand-orange) 0 14%, var(--brand-navy) 14% 100%) 1;
}

.fi-main-sidebar .fi-sidebar-group-label {
    color: #8f98bd;
}

.fi-main-sidebar .fi-sidebar-item-btn {
    border-left: 3px solid transparent;
    border-radius: 0;
}

.fi-main-sidebar .fi-sidebar-item-btn .fi-sidebar-item-label,
.fi-main-sidebar .fi-sidebar-item-btn .fi-sidebar-item-icon,
.fi-main-sidebar .fi-sidebar-group-collapse-btn,
.fi-main-sidebar .fi-sidebar-header .fi-icon-btn {
    color: #c9cfe6;
}

.fi-main-sidebar .fi-sidebar-item-btn:hover,
.fi-main-sidebar .fi-sidebar-item.fi-active > .fi-sidebar-item-btn {
    background-color: var(--brand-navy-light);
}

.fi-main-sidebar .fi-sidebar-item.fi-active > .fi-sidebar-item-btn {
    border-left-color: var(--brand-orange);
}

.fi-main-sidebar .fi-sidebar-item.fi-active > .fi-sidebar-item-btn .fi-sidebar-item-label,
.fi-main-sidebar .fi-sidebar-item.fi-active > .fi-sidebar-item-btn .fi-sidebar-item-icon {
    color: #fff;
}