/* DroidFarm Design Tokens - Uber-Inspired Design System */

:root {
  /* Colors - Primary */
  --color-black: #000000;
  --color-white: #ffffff;

  /* Colors - Brand (from DroidFarm logo) */
  --color-brand: #385045;
  --color-brand-dark: #2C4038;
  --color-brand-light: #E6EDEA;
  --color-accent: #25A55E;
  --color-accent-dark: #1E8E4E;
  --color-accent-light: #E5F5EC;

  /* Colors - Interactive */
  --color-hover-gray: #e2e2e2;
  --color-hover-light: #f3f3f3;
  --color-chip-gray: #efefef;

  /* Colors - Text */
  --color-body-gray: #4b4b4b;
  --color-muted-gray: #afafaf;

  /* Colors - Links */
  --color-link-blue: #0000ee;

  /* Shadows */
  --shadow-card: 0px 4px 16px 0px rgba(0, 0, 0, 0.12);
  --shadow-medium: 0px 4px 16px 0px rgba(0, 0, 0, 0.16);
  --shadow-float: 0px 2px 8px 0px rgba(0, 0, 0, 0.16);
  --shadow-press: 0px 0px 0px 999px rgba(0, 0, 0, 0.08) inset;
  --shadow-focus: 0px 0px 0px 2px rgb(255, 255, 255) inset;

  /* Fonts */
  --font-display: 'DM Sans', system-ui, -apple-system, 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --font-body: 'DM Sans', system-ui, -apple-system, 'Helvetica Neue', Helvetica, Arial, sans-serif;

  /* Font Sizes */
  --text-display: 3.25rem;    /* 52px */
  --text-h1: 2.25rem;         /* 36px */
  --text-h2: 2rem;            /* 32px */
  --text-h3: 1.5rem;          /* 24px */
  --text-h4: 1.25rem;         /* 20px */
  --text-nav: 1.125rem;       /* 18px */
  --text-body: 1rem;          /* 16px */
  --text-caption: 0.875rem;   /* 14px */
  --text-micro: 0.75rem;      /* 12px */

  /* Font Weights */
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-bold: 700;

  /* Line Heights */
  --leading-tight: 1.22;
  --leading-snug: 1.25;
  --leading-normal: 1.33;
  --leading-relaxed: 1.5;
  --leading-loose: 1.67;

  /* Spacing (8px grid) */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-20: 80px;
  --space-24: 96px;

  /* Border Radius */
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-pill: 999px;
  --radius-circle: 50%;

  /* Layout */
  --container-max: 1136px;
  --nav-height: 72px;

  /* Transitions */
  --transition-fast: 150ms ease;
  --transition-normal: 250ms ease;
  --transition-slow: 350ms ease;
}