/* ------------ LIGHT MODE VARIABLES ------------ */
:root
{
    --navy: #0d1b2a;
    --orange: #ff7a00;
    --soft-bg: #f6f7f9;
    --card-bg: #ffffff;
    --text: #0f172a;
    --text-muted: #555;
    --border: #e6e9ee;
    --sidebar-bg: #ffffff; /* --sidebar-link: #24303a; */
    --sidebar-link: #545456;
    --muted: #6b7280;
    --shadow: 0 8px 30px rgba(13,27,42,0.06);
}

/* ------------ DARK MODE VARIABLES ------------ */
body.dark
{
    --soft-bg: #0E0F11;
    --card-bg: #191A1E;
    --sidebar-bg: #191A1E;
    --border: #30425f;
    --text: #ffffff;
    --text-muted: #cbd5e1;
    --muted: #cbd5e1;
    --sidebar-link: #f8fafc;
    --orange: #ff8c1a;
    --shadow: 0 8px 30px rgba(0,0,0,.25);
}

/* Apply globally */
body.dark
{
    background: var(--soft-bg);
    color: var(--text);
}

.app-wrapper
{
    background: var(--soft-bg) !important;
}

/* override sidebar colors */
body.dark .sidebar
{
    background: var(--sidebar-bg) !important;
    border-color: var(--border) !important;
}

body.dark .nav-link
{
    color: var(--sidebar-link);
}

body.dark .nav-link:hover, body.dark .nav-link.active
{
    background: rgba(255,255,255,0.05);
}

/* cards */
body.dark .card, body.dark .filters-card, body.dark .stats-card, body.dark .table-card
{
    background: var(--card-bg) !important;
    border-color: var(--border) !important;
    box-shadow: var(--shadow) !important;
    color: var(--text) !important;
}

.stat-number
{
    color: var(--text) !important;
}

body.dark  .action-icons .icon {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
    cursor: pointer;
    transition: transform .12s ease, background-color .12s ease, color .12s ease;
    color: #ff5d02;
    background: rgba(13, 27, 42, 0.03);
    text-decoration: none;




body.dark label, body.dark span, body.dark p, body.dark small, body.dark strong,  
{
    color: var(--text) !important;
}