/* FacePass design tokens — the single source of truth for colour, type, radius and shadow.
   Loaded by both layouts BEFORE fp.css. White-label tenants override --brand (set inline in the
   layout head) and every brand-coloured component derives from --fp-brand, which follows it. */
:root {
    /* Brand (indigo) */
    --fp-brand-50: #eef2ff;
    --fp-brand-100: #e0e7ff;
    --fp-brand-600: #4f46e5;
    --fp-brand-700: #4338ca;
    /* --brand is the tenant accent (white-label). Platform default = indigo 600. Components use
       --fp-brand so a tenant colour flows through automatically. */
    --brand: #4f46e5;
    --fp-brand: var(--brand, #4f46e5);

    /* Ink (text) */
    --fp-ink-900: #0f172a;
    --fp-ink-700: #334155;
    --fp-ink-500: #64748b;
    --fp-ink-400: #94a3b8;

    /* Lines + surfaces */
    --fp-line: #e2e8f0;
    --fp-line-soft: #f1f5f9;
    --fp-surface: #f8fafc;
    --fp-white: #ffffff;

    /* Status */
    --fp-success: #16a34a;
    --fp-success-bg: #f0fdf4;
    --fp-warning: #b45309;
    --fp-warning-bg: #fffbeb;
    --fp-danger: #dc2626;
    --fp-danger-bg: #fef2f2;

    /* Radius */
    --fp-r-8: 8px;
    --fp-r-12: 12px;
    --fp-r-16: 16px;
    --fp-r-24: 24px;

    /* Shadows */
    --fp-shadow-sm: 0 1px 2px rgba(15, 23, 42, .06), 0 1px 3px rgba(15, 23, 42, .04);
    --fp-shadow-md: 0 10px 30px -12px rgba(15, 23, 42, .18), 0 2px 6px rgba(15, 23, 42, .05);
    --fp-shadow-brand: 0 10px 24px -10px rgba(79, 70, 229, .55);

    /* Type */
    --fp-font: 'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --fp-t-12: 12px;
    --fp-t-13: 13px;
    --fp-t-14: 14px;
    --fp-t-16: 16px;
    --fp-t-20: 20px;
    --fp-t-24: 24px;
    --fp-t-32: 32px;
    --fp-t-40: 40px;

    /* Motion */
    --fp-ease: cubic-bezier(.4, 0, .2, 1);
}