/*
 * ManTrA enterprise (light) theme.
 *
 * Pages are converted one at a time. MainLayout adds `ent-light` to .modern-app only for routes listed in
 * MainLayout.LightRoutes, so unconverted pages keep the dark theme untouched. A converted page uses the
 * tokens below for its own colours. When every page is converted, the route list and the dark styles go.
 *
 * Rules: white page and panels, dark text, ONE accent for primary actions/links/selection, status colours
 * only for status (and mostly for what needs attention), no gradients, icons neutral.
 */
:root {
    --ent-page: #f4f6f9;          /* page background */
    --ent-panel: #ffffff;         /* cards, panels, header, menus */
    --ent-panel-alt: #f8f9fb;     /* table headers, zebra rows, inset areas */
    --ent-border: #dde2e8;
    --ent-border-strong: #c5ccd5;
    --ent-text: #1f2937;
    --ent-text-muted: #5b6573;
    --ent-text-faint: #8a94a3;

    --ent-accent: #4a55c8;        /* primary buttons, links, selected item */
    --ent-accent-hover: #3b45ad;
    --ent-accent-soft: #eceefb;

    --ent-success: #1b7f3b;  --ent-success-soft: #e7f4ec;
    --ent-warning: #a85b00;  --ent-warning-soft: #fdf1e1;
    --ent-danger: #c0392b;   --ent-danger-soft: #fbeae8;
    --ent-info: #0b6bcb;     --ent-info-soft: #e7f0fb;

    --ent-radius: 6px;
    --ent-shadow: 0 1px 2px rgba(16, 24, 40, 0.06);
}

/* ---- Shell (header, menu, page) on converted pages ---- */
.modern-app.ent-light {
    background: var(--ent-page);
    color: var(--ent-text);
}

.modern-app.ent-light .modern-header {
    background: var(--ent-panel);
    backdrop-filter: none;
    border-bottom: 1px solid var(--ent-border);
    box-shadow: var(--ent-shadow);
}

.modern-app.ent-light .app-link { color: var(--ent-text); }
.modern-app.ent-light .app-link:hover { color: var(--ent-accent); }
.modern-app.ent-light .app-subtitle { color: var(--ent-text-muted); }
.modern-app.ent-light .user-time { color: var(--ent-text-muted); }
.modern-app.ent-light .user-welcome { color: var(--ent-text); }

.modern-app.ent-light .modern-nav {
    background: var(--ent-panel);
    backdrop-filter: none;
    border-bottom: 1px solid var(--ent-border);
}

.modern-app.ent-light .nav-item {
    background: transparent;
    border-color: transparent;
    color: var(--ent-text-muted);
}

.modern-app.ent-light .nav-item:hover {
    background: var(--ent-panel-alt);
    border-color: var(--ent-border);
    color: var(--ent-text);
}

.modern-app.ent-light .nav-item.active {
    background: var(--ent-accent-soft);
    border-color: transparent;
    color: var(--ent-accent);
    box-shadow: inset 0 -2px 0 var(--ent-accent);
}

.modern-app.ent-light .nav-item span {
    background: var(--ent-text);
    color: #ffffff;
}

.modern-app.ent-light .nav-item span::after { border-bottom-color: var(--ent-text); }

/* ---- Shared building blocks for converted pages ---- */
.modern-app.ent-light .ent-panel {
    background: var(--ent-panel);
    border: 1px solid var(--ent-border);
    border-radius: var(--ent-radius);
    box-shadow: var(--ent-shadow);
}

.modern-app.ent-light .ent-muted { color: var(--ent-text-muted); }

.modern-app.ent-light .ent-btn-primary {
    background: var(--ent-accent);
    border: 1px solid var(--ent-accent);
    color: #ffffff;
}
.modern-app.ent-light .ent-btn-primary:hover { background: var(--ent-accent-hover); border-color: var(--ent-accent-hover); }

.modern-app.ent-light .ent-btn-secondary {
    background: var(--ent-panel);
    border: 1px solid var(--ent-border-strong);
    color: var(--ent-text);
}
.modern-app.ent-light .ent-btn-secondary:hover { background: var(--ent-panel-alt); }