/* Global scale - 90% of browser default (16px * 0.9 = 14.4px) */
html {
    font-size: 14.4px;
}

/* DnaLims Theme Variables */
:root {
    /* Primary Colors */
    --dna-primary: #003D82;
    --dna-primary-light: #1565C0;

    /* Status Colors */
    --dna-success: #059669;
    --dna-warning: #D97706;
    --dna-error: #DC2626;
    --dna-info: #0EA5E9;

    /* Text Colors */
    --dna-text-primary: #1A2332;
    --dna-text-secondary: #6B7280;
    --dna-text-muted: #9CA3AF;

    /* Surface Colors */
    --dna-background: #F9FAFB;
    --dna-surface: #FFFFFF;
    --dna-border: #E5E7EB;

    /* Drawer */
    --dna-drawer-bg: #1A2332;
}

/* Nav Link Active State - White/Light background for contrast */
.mud-drawer .mud-navlink.active,
.mud-drawer .mud-nav-link.active,
.mud-navmenu .mud-navlink.active,
.mud-navmenu .mud-nav-link.active {
    background-color: rgba(255, 255, 255, 0.18) !important;
    border-left: 3px solid #60A5FA !important;
    padding-left: calc(1rem - 3px) !important;
}

.mud-drawer .mud-navlink.active .mud-nav-link-text,
.mud-drawer .mud-navlink.active .mud-icon-root,
.mud-drawer .mud-nav-link.active .mud-nav-link-text,
.mud-drawer .mud-nav-link.active .mud-icon-root,
.mud-navmenu .mud-navlink.active .mud-nav-link-text,
.mud-navmenu .mud-navlink.active .mud-icon-root {
    color: #FFFFFF !important;
    font-weight: 600 !important;
}

/* Override MudBlazor's default primary color highlight on active nav links */
.mud-drawer .mud-navlink.active,
.mud-navmenu .mud-navlink.active {
    --mud-palette-primary: rgba(255, 255, 255, 0.18) !important;
}

/* Hover state for nav links */
.mud-drawer .mud-navlink:hover:not(.active),
.mud-drawer .mud-nav-link:hover:not(.active),
.mud-navmenu .mud-navlink:hover:not(.active) {
    background-color: rgba(255, 255, 255, 0.08) !important;
}

/* Utility Classes */
.text-primary { color: var(--dna-primary) !important; }
.text-secondary { color: var(--dna-text-secondary) !important; }
.text-muted { color: var(--dna-text-muted) !important; }
.border-default { border-color: var(--dna-border) !important; }
