:root {
    --oliva-900: #1f2d16;
    --oliva-700: #3f5a2a;
    --oliva-500: #6b8f47;
    --oliva-100: #e8efe0;
    --dorado-500: #c9a227;

    --bs-primary: var(--oliva-700);
    --bs-primary-rgb: 63, 90, 42;
    --sidebar-ancho: 15.5rem;
}

[data-bs-theme="dark"] {
    --bs-primary: var(--oliva-500);
    --bs-primary-rgb: 107, 143, 71;
}

.btn-primary {
    --bs-btn-bg: var(--oliva-700);
    --bs-btn-border-color: var(--oliva-700);
    --bs-btn-hover-bg: var(--oliva-900);
    --bs-btn-hover-border-color: var(--oliva-900);
}

.app-sidebar {
    width: var(--sidebar-ancho);
    background: var(--oliva-900);
    color: #cfd8c4;
}

.app-sidebar a {
    color: #cfd8c4;
    text-decoration: none;
    border-radius: .375rem;
}

.app-sidebar a:hover,
.app-sidebar a.activo {
    background: rgba(255, 255, 255, .08);
    color: #fff;
}

.app-sidebar .grupo {
    font-size: .6875rem;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #8fa07c;
}

.app-contenido {
    margin-left: var(--sidebar-ancho);
}

@media (max-width: 991.98px) {
    .app-sidebar {
        position: fixed;
        inset: 0 auto 0 0;
        z-index: 1045;
        transform: translateX(-100%);
        transition: transform .2s ease;
    }

    .app-sidebar.abierta {
        transform: none;
    }

    .app-contenido {
        margin-left: 0;
    }
}

.kpi .valor {
    font-size: 1.75rem;
    font-weight: 600;
    line-height: 1.1;
}
