@import "tailwindcss";

:root {
  --background: #fff;
  --foreground: #09090b;
  --card: #fff;
  --card-foreground: #09090b;
  /* color-slate-800 */
  --primary: oklch(20.8% 0.042 265.755);
  --primary-foreground: #fafafa;
  --secondary: #f4f4f5;
  --secondary-foreground: #574747;
  --muted: #f4f4f5;
  --muted-foreground: #71717a;
  --faint: #fafafa;
  --accent: #f4f4f5;
  --danger: #df514c;
  --danger-foreground: #fafafa;
  --success: #4caf50;
  --success-foreground: #fafafa;
  --warning: #ff8c00;
  --warning-foreground: #09090b;
  --border: #d4d4d8;
  --input: #d4d4d8;
  --ring: #574747;
}

@theme inline {
  --color-background: var(--background);
  --color-foreground: var(--foreground);
  --color-card: var(--card);
  --color-card-foreground: var(--card-foreground);
  --color-primary: var(--primary);
  --color-primary-foreground: var(--primary-foreground);
  --color-secondary: var(--secondary);
  --color-secondary-foreground: var(--secondary-foreground);
  --color-muted: var(--muted);
  --color-muted-foreground: var(--muted-foreground);
  --color-faint: var(--faint);
  --color-accent: var(--accent);
  --color-danger: var(--danger);
  --color-danger-foreground: var(--danger-foreground);
  --color-success: var(--success);
  --color-success-foreground: var(--success-foreground);
  --color-warning: var(--warning);
  --color-warning-foreground: var(--warning-foreground);
  --color-border: var(--border);
  --color-input: var(--input);
  --color-ring: var(--ring);

  --color-subtext: var(--color-gray-500)
}