/* Pixault Brand System — Radzen theme overrides + CSS custom properties */
:root {
    --px-navy: #0f172a;
    --px-navy-light: #1e293b;
    --px-cyan: #06b6d4;
    --px-blue: #3b82f6;
    --px-cyan-glow: #22d3ee;
    --px-slate: #64748b;
    --px-bg: #f8fafc;
    --px-white: #ffffff;
    --px-gradient: linear-gradient(135deg, #0f172a 0%, #0c4a6e 50%, #06b6d4 100%);

    /* Radzen theme variable overrides */
    --rz-primary: #06b6d4;
    --rz-primary-light: #22d3ee;
    --rz-primary-lighter: #67e8f9;
    --rz-primary-dark: #0891b2;
    --rz-primary-darker: #0e7490;
    --rz-secondary: #3b82f6;
    --rz-info: #3b82f6;
    --rz-base-background-color: #f8fafc;
    --rz-body-background-color: #f8fafc;
}

/* ── Sidebar dark theme ────────────────────────────────── */
/* High specificity to override Radzen defaults            */

.rz-sidebar {
    background: var(--px-navy) !important;
    color: #e2e8f0 !important;
}

/* Kill Radzen's panel menu background — it paints over the dark sidebar */
.rz-sidebar .rz-panel-menu {
    background: transparent !important;
}

/* Default state: light slate text + icons for readability on navy */
.rz-sidebar .rz-navigation-item-link,
.rz-sidebar .rz-navigation-item-link .rz-navigation-item-text,
.rz-sidebar .rz-navigation-item-link .rz-navigation-item-icon,
.rz-sidebar .rz-navigation-item-link span,
.rz-sidebar .rz-navigation-item-link i {
    color: #cbd5e1 !important;
}

/* Hover: bright white text on slightly lighter navy */
.rz-sidebar .rz-navigation-item-link:hover,
.rz-sidebar .rz-navigation-item-link:hover .rz-navigation-item-text,
.rz-sidebar .rz-navigation-item-link:hover .rz-navigation-item-icon,
.rz-sidebar .rz-navigation-item-link:hover span,
.rz-sidebar .rz-navigation-item-link:hover i {
    background: var(--px-navy-light) !important;
    color: #ffffff !important;
}

/* Active: cyan accent text + subtle cyan background */
.rz-sidebar .rz-navigation-item-link.active,
.rz-sidebar .rz-navigation-item-link.active .rz-navigation-item-text,
.rz-sidebar .rz-navigation-item-link.active .rz-navigation-item-icon,
.rz-sidebar .rz-navigation-item-link.active span,
.rz-sidebar .rz-navigation-item-link.active i {
    background: color-mix(in srgb, var(--px-cyan) 18%, transparent) !important;
    color: var(--px-cyan-glow) !important;
}