/**
 * BestERP design tokens — Linear density × bestERP brand
 * Accent follows company theme settings (theme-1…10 or custom-color)
 */
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap');

body.erp-ui-page {
    --erp-font: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

    /* Surfaces — pure white (Linear light) */
    --erp-bg: #ffffff;
    --erp-surface: #ffffff;
    --erp-surface-raised: #ffffff;
    --erp-border: #e8e8e8;
    --erp-border-strong: #d4d4d4;
    --erp-text: #000000;
    --erp-text-secondary: #475569;
    --erp-text-muted: #000000;

    /* Accent defaults (theme-1 / bestERP green) */
    --erp-accent: #10b981;
    --erp-accent-hover: #059669;
    --erp-accent-soft: rgba(16, 185, 129, 0.1);
    --erp-accent-ring: rgba(16, 185, 129, 0.22);

    /* Controls */
    --erp-control-h: 36px;
    --erp-pagination-h: 38px;

    /* Shape */
    --erp-radius-sm: 6px;
    --erp-radius-md: 10px;
    --erp-radius-lg: 12px;

    /* Spacing */
    --erp-space-1: 4px;
    --erp-space-2: 8px;
    --erp-space-3: 12px;
    --erp-space-4: 16px;
    --erp-space-5: 20px;
    --erp-space-6: 24px;

    font-family: var(--erp-font);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

html.erp-dark body.erp-ui-page,
body.erp-ui-page.erp-dark {
    --erp-bg: #0b0f14;
    --erp-surface: #151b23;
    --erp-surface-raised: #1a222d;
    --erp-border: #2a3441;
    --erp-border-strong: #3d4a5c;
    --erp-text: #f1f5f9;
    --erp-text-secondary: #cbd5e1;
    --erp-text-muted: #64748b;
}

/* Modernized theme presets — respects settings, updated palette */
body.erp-ui-page.theme-1 {
    --erp-accent: #10b981; --erp-accent-hover: #059669;
    --erp-accent-soft: rgba(16, 185, 129, 0.1); --erp-accent-ring: rgba(16, 185, 129, 0.22);
    --theme-color: #10b981;
}
body.erp-ui-page.theme-2 {
    --erp-accent: #22c55e; --erp-accent-hover: #16a34a;
    --erp-accent-soft: rgba(34, 197, 94, 0.1); --erp-accent-ring: rgba(34, 197, 94, 0.22);
    --theme-color: #22c55e;
}
body.erp-ui-page.theme-3 {
    --erp-accent: #6366f1; --erp-accent-hover: #4f46e5;
    --erp-accent-soft: rgba(99, 102, 241, 0.1); --erp-accent-ring: rgba(99, 102, 241, 0.22);
    --theme-color: #6366f1;
}
body.erp-ui-page.theme-4 {
    --erp-accent: #0ea5e9; --erp-accent-hover: #0284c7;
    --erp-accent-soft: rgba(14, 165, 233, 0.1); --erp-accent-ring: rgba(14, 165, 233, 0.22);
    --theme-color: #0ea5e9;
}
body.erp-ui-page.theme-5 {
    --erp-accent: #f43f5e; --erp-accent-hover: #e11d48;
    --erp-accent-soft: rgba(244, 63, 94, 0.1); --erp-accent-ring: rgba(244, 63, 94, 0.22);
    --theme-color: #f43f5e;
}
body.erp-ui-page.theme-6 {
    --erp-accent: #3b82f6; --erp-accent-hover: #2563eb;
    --erp-accent-soft: rgba(59, 130, 246, 0.1); --erp-accent-ring: rgba(59, 130, 246, 0.22);
    --theme-color: #3b82f6;
}
body.erp-ui-page.theme-7 {
    --erp-accent: #a855f7; --erp-accent-hover: #9333ea;
    --erp-accent-soft: rgba(168, 85, 247, 0.1); --erp-accent-ring: rgba(168, 85, 247, 0.22);
    --theme-color: #a855f7;
}
body.erp-ui-page.theme-8 {
    --erp-accent: #eab308; --erp-accent-hover: #ca8a04;
    --erp-accent-soft: rgba(234, 179, 8, 0.12); --erp-accent-ring: rgba(234, 179, 8, 0.25);
    --theme-color: #eab308;
}
body.erp-ui-page.theme-9 {
    --erp-accent: #64748b; --erp-accent-hover: #475569;
    --erp-accent-soft: rgba(100, 116, 139, 0.1); --erp-accent-ring: rgba(100, 116, 139, 0.22);
    --theme-color: #64748b;
}
body.erp-ui-page.theme-10 {
    --erp-accent: #14b8a6; --erp-accent-hover: #0d9488;
    --erp-accent-soft: rgba(20, 184, 166, 0.1); --erp-accent-ring: rgba(20, 184, 166, 0.22);
    --theme-color: #14b8a6;
}

/* Custom brand color from company settings */
body.erp-ui-page.custom-color {
    --erp-accent: var(--color-customColor, #10b981);
    --erp-accent-hover: color-mix(in srgb, var(--color-customColor, #10b981) 82%, #000);
    --erp-accent-soft: color-mix(in srgb, var(--color-customColor, #10b981) 12%, #fff);
    --erp-accent-ring: color-mix(in srgb, var(--color-customColor, #10b981) 24%, transparent);
}