:root {
    --brand: #D02A20;
    --brand-hover: #B4231A;
    --brand-soft: #FDECEA;
    --brand-ring: rgba(208, 42, 32, .22);

    --row-tint: #EEF3FF;
    --row-zebra: #F1F4F9;
    --row-hover: #DDE6F3;
    --grid-line: #DFE3EA;
    --grid-line-2: #CBD2DC;

    --navy: #0E1F33;
    --navy-soft: #16304C;
    --navy-line: rgba(255, 255, 255, .09);

    --bg: #F4F6FA;
    --surface: #FFFFFF;
    --surface-2: #FAFBFD;
    --border: #E3E8F0;
    --border-strong: #CBD5E1;

    --text: #131C27;
    --text-2: #3D4A5C;
    --muted: #64748B;
    --on-dark: #E8EEF6;
    --on-dark-muted: #93A6BD;

    --success: #15803D;
    --success-soft: #E7F6EC;
    --warning: #B45309;
    --warning-soft: #FEF3E2;
    --info: #0369A1;
    --info-soft: #E6F2FA;
    --danger: #B91C1C;
    --danger-soft: #FDECEC;

    --r-sm: 8px;
    --r: 12px;
    --r-lg: 16px;
    --shadow-xs: 0 1px 2px rgba(16, 24, 40, .05);
    --shadow: 0 1px 3px rgba(16, 24, 40, .07), 0 1px 2px rgba(16, 24, 40, .04);
    --shadow-md: 0 4px 12px rgba(16, 24, 40, .08);
    --shadow-lg: 0 12px 32px rgba(16, 24, 40, .12);

    --sidebar-w: 264px;
    --topbar-h: 64px;
}

* { box-sizing: border-box; }

html, body { height: 100%; }

body {
    margin: 0;
    background: var(--bg);
    color: var(--text);
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    font-size: 14px;
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, h5, h6 { color: var(--text); font-weight: 600; line-height: 1.3; margin: 0; }
h1 { font-size: 24px; }
h2 { font-size: 20px; }
h3 { font-size: 18px; }
h4 { font-size: 16px; }
h5 { font-size: 15px; }

p { margin: 0 0 12px; line-height: 1.6; }
a { color: var(--brand); text-decoration: none; }
a:hover { color: var(--brand-hover); text-decoration: underline; }
small, .text-sm { font-size: 12.5px; }

hr { border: 0; border-top: 1px solid var(--border); margin: 20px 0; opacity: 1; }

::selection { background: var(--brand-soft); color: var(--brand-hover); }

:focus-visible {
    outline: 2px solid var(--brand);
    outline-offset: 2px;
    border-radius: 4px;
}

.cursorPointer { cursor: pointer; }
.text-muted-2 { color: var(--muted) !important; }
.fw-500 { font-weight: 500; }
.fw-600 { font-weight: 600; }
.lh-1 { line-height: 1; }

.truncate {
    display: block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mono { font-variant-numeric: tabular-nums; }

[data-lucide] { width: 18px; height: 18px; stroke-width: 1.9; vertical-align: -3px; flex: none; }
.ico-sm [data-lucide], [data-lucide].ico-sm { width: 16px; height: 16px; }
.ico-lg [data-lucide], [data-lucide].ico-lg { width: 22px; height: 22px; }
.ico-xl [data-lucide], [data-lucide].ico-xl { width: 32px; height: 32px; stroke-width: 1.6; }

.custom-loader-wrapper {
    position: fixed;
    inset: 0;
    z-index: 20000;
    display: none;
    align-items: center;
    justify-content: center;
    background: rgba(244, 246, 250, .72);
    backdrop-filter: blur(2px);
}
.custom-loader-wrapper.show { display: flex; }
.custom-loader-wrapper .loader-box {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--r);
    box-shadow: var(--shadow-lg);
    padding: 18px 22px;
    display: flex;
    align-items: center;
    gap: 12px;
    font-weight: 500;
    color: var(--text-2);
}
.custom-loader-wrapper .spinner {
    width: 20px;
    height: 20px;
    border: 2.5px solid var(--brand-soft);
    border-top-color: var(--brand);
    border-radius: 50%;
    animation: spin .7s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

#toast-container > div {
    box-shadow: var(--shadow-lg) !important;
    border-radius: var(--r-sm) !important;
    opacity: 1 !important;
    font-size: 13.5px;
    padding: 14px 16px 14px 48px !important;
    background-position: 15px center !important;
}
#toast-container > .toast-success { background-color: var(--success) !important; }
#toast-container > .toast-error   { background-color: var(--danger)  !important; }
#toast-container > .toast-warning { background-color: var(--warning) !important; }
#toast-container > .toast-info    { background-color: var(--info)    !important; }

@media print {
    .no-print, .app-sidebar, .app-topbar, .custom-loader-wrapper { display: none !important; }
    body { background: #fff; }
}
