/* ============================================================
   INDUSTRVERSE DESIGN TOKENS
   Matches the industrverse.com app design system
   ============================================================ */

:root {
  /* Brand colors */
  --green:       #4caf50;
  --green-dark:  #388e3c;
  --green-light: #e8f5e9;
  --green-mid:   #c8e6c9;

  /* Surfaces */
  --bg:          #f5f5f5;
  --white:       #ffffff;

  /* Text */
  --text:        #1a1a1a;
  --text-2:      #424242;
  --text-3:      #757575;

  /* Borders */
  --border:      #e0e0e0;

  /* Elevation */
  --shadow-sm:   0 1px 3px rgba(0,0,0,0.08), 0 1px 2px rgba(0,0,0,0.06);
  --shadow:      0 4px 12px rgba(0,0,0,0.08), 0 2px 4px rgba(0,0,0,0.05);
  --shadow-lg:   0 8px 32px rgba(0,0,0,0.10), 0 4px 8px rgba(0,0,0,0.06);

  /* Radius */
  --r-sm:  8px;
  --r:     12px;
  --r-lg:  16px;
  --r-xl:  24px;

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

  /* Typography */
  --font:        'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-size-xs:  11px;
  --font-size-sm:  13px;
  --font-size-md:  14px;
  --font-size-lg:  16px;
  --font-size-xl:  18px;
  --font-size-2xl: 24px;
  --font-size-3xl: 32px;
  --font-size-4xl: 40px;
}