/*
 * Customer theme — TechFX apps for end users.
 *
 * Apps that use this theme: Payroll, Accounting, Exchange.
 *
 * Values derived from Payroll's migrated Figma screens (the cleanest state
 * of the design system today). Collisions resolved with canonical decisions
 * documented in `engines/ui/docs/token-decisions.md`.
 *
 * Import order in consuming apps:
 *
 *   @import "ui/base";
 *   @import "ui/themes/customer";
 */

:root {
  /* Backgrounds */
  --color-background: #ffffff;
  --color-background-secondary: #f9fafb;
  --color-background-tertiary: #f9f5ff;
  --color-background-tertiary-hover: #f4ebff;

  /* Brand surfaces — distinct from --color-background to avoid the Figma
     collision where brand purple and app body white shared one name. */
  --color-brand-surface: #380e7a;
  --color-brand-surface-hover: #2a0a5c;
  --color-brand-surface-strong: #461199;

  /* Brand */
  --color-brand: #380e7a;
  --color-brand-hover: #2a0a5c;
  --color-brand-secondary: #6639ad;
  --color-brand-tertiary: #8660c0;
  --color-brand-tertiary-hover: #461199;

  /* Text — neutral */
  --color-text-neutral-primary: #1d2939;
  --color-text-neutral-secondary: #667085;
  --color-text-neutral-tertiary: #a6b0bf;

  /* Text — inverse (for dark surfaces) */
  --color-text-inverse-primary: #ffffff;
  --color-text-inverse-secondary: #f9fafb;

  /* Text — brand */
  --color-text-brand-primary: #380e7a;
  --color-text-brand-secondary: #6639ad;
  --color-text-brand-tertiary: #a588d4;

  /* Borders */
  --color-border-default: #d8dce3;
  --color-border-active: #6639ad;
  --color-border-accent: #e5d7fb;
  --color-border-disabled: #a6b0bf;
  --color-border-neutral: #1d2939;

  /* Positive (success) */
  --color-positive: #0eba7a;
  --color-positive-hover: #0b8c5c;
  --color-positive-secondary: #b8f8e0;
  --color-positive-tertiary: #e7fdf5;
  --color-text-positive-secondary: #0b8c5c;
  --color-text-positive-tertiary: #075d3d;

  /* Warning */
  --color-warning: #f79009;
  --color-warning-secondary-hover: #fec84b;
  --color-warning-tertiary: #fff7e2;
  --color-warning-tertiary-hover: #fef0c7;
  --color-text-warning-secondary: #dc6803;

  /* Error / danger */
  --color-error-600: #f04438;
  --color-error-700: #d92d20;
  --color-danger-secondary: #ffc9c9;
  --color-danger-tertiary: #fef2f2;
  --color-text-danger-secondary: #d92d20;
  --color-text-danger-tertiary: #f04438;

  /* Neutrals */
  --color-neutral: #1d2939;
  --color-neutral-secondary: #a6b0bf;
  --color-neutral-tertiary: #f2f4f7;

  /* Pure */
  --color-white: #ffffff;
  --color-black: #07020f;

  /* Shadows */
  --shadow-xs: 0 1px 2px 0 rgb(16 24 40 / 0.05);
  --shadow-sm: 0 1px 2px 0 rgb(16 24 40 / 0.06), 0 1px 3px 0 rgb(16 24 40 / 0.1);
  --shadow-md: 0 2px 5px -2px rgb(16 24 40 / 0), 0 9px 17px -2px rgb(16 24 40 / 0.05);
  --shadow-lg: 0 4px 6px -2px rgb(16 24 40 / 0.05), 0 12px 20px -4px rgb(16 24 40 / 0.1);
  --shadow-xl: 0 8px 8px -4px rgb(16 24 40 / 0.03), 0 20px 24px -4px rgb(16 24 40 / 0.03);
}