/**
 * Invoicing Pro — design tokens
 * Load order: bootstrap → einvoicingpro-tokens.css → style.css → einvoicingpro-components.css → [page CSS]
 */

/* ── Color ─────────────────────────────────────────────────────────────── */

:root {
    --einvoicingpro-color-brand: #2f80ed;
    --einvoicingpro-color-brand-hover: #1e5bb8;
    --einvoicingpro-color-brand-subtle: rgba(47, 128, 237, 0.08);
    --einvoicingpro-color-brand-rgb: 47, 128, 237;

    --einvoicingpro-color-success: #6cb100;
    --einvoicingpro-color-success-hover: #5da000;
    --einvoicingpro-color-danger: #ef4444;
    --einvoicingpro-color-warning: #f59e0b;
    --einvoicingpro-color-info: #2f80ed;

    --einvoicingpro-color-text-primary: #0f172a;
    --einvoicingpro-color-text-secondary: #64748b;
    --einvoicingpro-color-text-muted: #94a3b8;

    --einvoicingpro-color-surface: #f8fafc;
    --einvoicingpro-color-surface-raised: #ffffff;
    --einvoicingpro-color-border: #e2e8f0;
    --einvoicingpro-color-border-strong: #cbd5e1;

    /* Typography */
    --einvoicingpro-font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --einvoicingpro-text-display-size: 1.5rem;
    --einvoicingpro-text-display-weight: 600;
    --einvoicingpro-text-title-size: 1.125rem;
    --einvoicingpro-text-title-weight: 600;
    --einvoicingpro-text-body-size: 0.875rem;
    --einvoicingpro-text-body-weight: 400;
    --einvoicingpro-text-label-size: 0.8125rem;
    --einvoicingpro-text-label-weight: 500;
    --einvoicingpro-text-caption-size: 0.75rem;
    --einvoicingpro-text-caption-weight: 400;
    --einvoicingpro-text-metric-size: 1.75rem;
    --einvoicingpro-text-metric-weight: 700;

    --einvoicingpro-line-height-body: 1.5;
    --einvoicingpro-line-height-heading: 1.25;
    --einvoicingpro-line-height-metric: 1.1;

    /* Spacing (8px grid) */
    --einvoicingpro-space-1: 0.25rem;
    --einvoicingpro-space-2: 0.5rem;
    --einvoicingpro-space-3: 0.75rem;
    --einvoicingpro-space-4: 1rem;
    --einvoicingpro-space-5: 1.5rem;
    --einvoicingpro-space-6: 2rem;
    --einvoicingpro-space-7: 2.5rem;
    --einvoicingpro-space-8: 3rem;

    /* Radius */
    --einvoicingpro-radius-sm: 6px;
    --einvoicingpro-radius-md: 10px;
    --einvoicingpro-radius-lg: 12px;
    --einvoicingpro-radius-pill: 999px;

    /* Elevation */
    --einvoicingpro-shadow-sm: 0 1px 3px rgba(15, 23, 42, 0.06), 0 1px 2px rgba(15, 23, 42, 0.04);
    --einvoicingpro-shadow-md: 0 4px 12px rgba(15, 23, 42, 0.08), 0 2px 4px rgba(15, 23, 42, 0.04);
    --einvoicingpro-shadow-lg: 0 20px 48px rgba(15, 23, 42, 0.12), 0 8px 16px rgba(15, 23, 42, 0.06);

    /* Motion */
    --einvoicingpro-duration-fast: 150ms;
    --einvoicingpro-duration-normal: 200ms;
    --einvoicingpro-ease: cubic-bezier(0.16, 1, 0.3, 1);

    /* Z-index scale */
    --einvoicingpro-z-dropdown: 1050;
    --einvoicingpro-z-offcanvas: 1045;
    --einvoicingpro-z-dialog: 10500;

    /* Status chips (SaaS — compact, calm, semantic tints) */
    --einvoicingpro-chip-font-size: 0.6875rem;
    --einvoicingpro-chip-line-height: 1.25;
    --einvoicingpro-chip-padding-y: 2px;
    --einvoicingpro-chip-padding-x: 8px;
    --einvoicingpro-chip-radius: 4px;
    --einvoicingpro-chip-weight: 500;
    --einvoicingpro-chip-border-width: 1px;

    --einvoicingpro-chip-brand-bg: rgba(47, 128, 237, 0.1);
    --einvoicingpro-chip-brand-text: #1d4ed8;
    --einvoicingpro-chip-brand-border: rgba(29, 78, 216, 0.16);

    --einvoicingpro-chip-success-bg: #ecfdf3;
    --einvoicingpro-chip-success-text: #15803d;
    --einvoicingpro-chip-success-border: rgba(21, 128, 61, 0.18);

    --einvoicingpro-chip-warning-bg: #fffbeb;
    --einvoicingpro-chip-warning-text: #b45309;
    --einvoicingpro-chip-warning-border: rgba(180, 83, 9, 0.18);

    --einvoicingpro-chip-danger-bg: #fef2f2;
    --einvoicingpro-chip-danger-text: #b91c1c;
    --einvoicingpro-chip-danger-border: rgba(185, 28, 28, 0.16);

    --einvoicingpro-chip-neutral-bg: #f1f5f9;
    --einvoicingpro-chip-neutral-text: #64748b;
    --einvoicingpro-chip-neutral-border: rgba(100, 116, 139, 0.16);

    --einvoicingpro-chip-info-bg: rgba(47, 128, 237, 0.08);
    --einvoicingpro-chip-info-text: #2563eb;
    --einvoicingpro-chip-info-border: rgba(37, 99, 235, 0.14);

    /* Data tables (list pages — chrome only) */
    --einvoicingpro-table-font-size: 0.75rem;
    --einvoicingpro-table-meta-size: 0.6875rem;
    --einvoicingpro-table-header-size: 0.6875rem;
    --einvoicingpro-table-header-weight: 600;
    --einvoicingpro-table-cell-py: 0.25rem;
    --einvoicingpro-table-cell-px: 0.625rem;
    --einvoicingpro-table-header-py: 0.375rem;
    --einvoicingpro-table-action-size: 1.75rem;
    --einvoicingpro-table-header-bg: var(--einvoicingpro-color-surface);
    --einvoicingpro-table-header-color: var(--einvoicingpro-color-text-secondary);
    --einvoicingpro-table-row-border: var(--einvoicingpro-color-border);
    --einvoicingpro-table-row-hover: #f4f8fe;
    --einvoicingpro-table-container-radius: var(--einvoicingpro-radius-md);
    --einvoicingpro-table-container-border: var(--einvoicingpro-color-border);

    /* Bridge → applied after style.css via components layer */
}

/* Re-declared in einvoicingpro-components.css after style.css load */

@media (prefers-reduced-motion: reduce) {
    :root {
        --einvoicingpro-duration-fast: 0ms;
        --einvoicingpro-duration-normal: 0ms;
    }
}