/**
 * Paperbrand — Canonical Design Tokens (CSS Custom Properties)
 * Used across: Rails Dashboard, Generated PDFs, API Docs, Landing Page, and Canva Mini App.
 *
 * Font Packaging Rule:
 * Before deploying PDF rendering in production, verify OFL licenses (see FONT_LICENSES.md)
 * and package the font files in ./fonts/ with the rendering environment so PDF engines
 * never rely on OS-installed fonts.
 */

@import url('https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&family=Inter:wght@400;500;600;700&family=Manrope:wght@500;600;700;800&display=swap');

:root {
  /* ==========================================================================
     1. PAPERBRAND CORE PALETTE (Canva Brand Kit Canonical Colors)
     ========================================================================== */
  --pb-blue: #244FE5;           /* Primary brand color, links, CTAs, app icon */
  --pb-blue-hover: #1B3FC4;     /* Interactive hover state */
  --pb-blue-subtle: #EDF1FD;    /* Focus rings and active badges */

  --pb-ink: #171918;            /* Headings, body text, document titles */
  --pb-ink-secondary: #4A4F4D;  /* Supporting copy, metadata labels */
  --pb-ink-muted: #727875;      /* Captions, footnotes, table column headers */

  --pb-ivory: #F7F5EF;          /* Landing pages, brand presentations, warm surfaces */
  --pb-ivory-warm: #EFECE3;     /* Secondary warm container border/fill */

  --pb-mist: #E7EBF4;           /* Subtle UI backgrounds, dividers, secondary cards */
  --pb-mist-border: #D3DAE8;    /* Crisp structural hairlines & table borders */

  --pb-white: #FFFFFF;          /* Primary document paper surface & card background */

  /* Semantic Status Colors (Restrained, editorial tone) */
  --pb-success: #146C43;
  --pb-success-bg: #E8F5EE;
  --pb-warning: #9A5B13;
  --pb-warning-bg: #FDF4E7;
  --pb-danger: #B42318;
  --pb-danger-bg: #FDECEB;

  /* ==========================================================================
     2. TYPOGRAPHY SYSTEM
     ========================================================================== */
  --pb-font-heading: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --pb-font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --pb-font-editorial: 'DM Serif Display', Georgia, 'Times New Roman', serif;
  --pb-font-mono: 'JetBrains Mono', 'SFMono-Regular', Menlo, Consolas, monospace;

  /* Type Scale (Web & UI) */
  --pb-text-xs: 0.75rem;        /* 12px — labels, legal footers, table headers */
  --pb-text-sm: 0.875rem;       /* 14px — dense UI, line items */
  --pb-text-base: 1rem;         /* 16px — default body copy */
  --pb-text-lg: 1.125rem;       /* 18px — lead paragraphs */
  --pb-text-xl: 1.375rem;       /* 22px — card & section headings */
  --pb-text-2xl: 1.75rem;       /* 28px — document titles */
  --pb-text-3xl: 2.375rem;      /* 38px — editorial display headings */
  --pb-text-4xl: 3.25rem;       /* 52px — hero statements */

  /* ==========================================================================
     3. SPACING, RADIUS & ELEVATION
     ========================================================================== */
  --pb-space-1: 0.25rem;        /* 4px */
  --pb-space-2: 0.5rem;         /* 8px */
  --pb-space-3: 0.75rem;        /* 12px */
  --pb-space-4: 1rem;           /* 16px */
  --pb-space-6: 1.5rem;         /* 24px */
  --pb-space-8: 2rem;           /* 32px */
  --pb-space-12: 3rem;          /* 48px */
  --pb-space-16: 4rem;          /* 64px */

  --pb-radius-sm: 4px;
  --pb-radius-md: 8px;
  --pb-radius-lg: 12px;

  --pb-shadow-paper: 0 1px 3px rgba(23, 25, 24, 0.06), 0 12px 32px -4px rgba(23, 25, 24, 0.07);

  /* ==========================================================================
     4. CUSTOMER DOCUMENT THEME TOKENS (Overridable per Tenant / Document)
     For generated business documents, keep backgrounds predominantly white
     and use the accent color sparingly. Customers can replace these with
     their own brand palette and typography.
     ========================================================================== */
  --doc-surface: #FFFFFF;
  --doc-ink: var(--pb-ink);
  --doc-muted: var(--pb-ink-muted);
  --doc-accent: var(--pb-blue);
  --doc-border: var(--pb-mist);
  --doc-table-stripe: #FAFBFD;
  --doc-font-heading: var(--pb-font-heading);
  --doc-font-body: var(--pb-font-body);
  --doc-font-editorial: var(--pb-font-editorial);
}

/* Tabular numerals rule for all financial tables, invoices, quotations, and totals */
.pb-tabular-nums,
table.pb-document-table td,
table.pb-document-table th {
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1, "zero" 1;
}