/* aincare Design System Tokens
   Source of truth for spacing, typography, color, and shape. */

:root {
  /* --- Colors (from app theme + Stitch) --- */
  --primary:            #005A50;
  --primary-container:  #006B5F;
  --on-primary:         #FFFFFF;
  --secondary:          #546073;
  --secondary-container:#D8E3FA;
  --surface:            #F9F9FF;
  --surface-dim:        #F0F0F5;
  --surface-container:  #EEEEF3;
  --on-surface:         #1C3354;
  --on-surface-muted:   #4A6083;
  --outline:            #667CA0;
  --outline-variant:    #9DB3DA;
  --teal-50:            #E8F5F3;
  --teal-100:           #B2DFDB;
  --error:              #A83836;
  --white:              #FFFFFF;
  --black:              #000000;

  /* --- Spacing (8-point grid) --- */
  --space-xs:   4px;
  --space-sm:   8px;
  --space-md:   16px;
  --space-lg:   24px;
  --space-xl:   32px;
  --space-2xl:  48px;
  --space-3xl:  64px;
  --space-4xl:  96px;

  /* --- Typography --- */
  --font-family:    'Lexend', sans-serif;
  --text-sm:        16px;
  --text-base:      18px;
  --text-lg:        20px;
  --text-xl:        22px;
  --text-2xl:       28px;
  --text-3xl:       36px;
  --text-4xl:       48px;
  --weight-regular: 400;
  --weight-medium:  500;
  --weight-semibold:600;
  --weight-bold:    700;
  --leading-tight:  1.3;
  --leading-normal: 1.5;
  --leading-relaxed:1.6;

  /* --- Shape --- */
  --radius-sm:  4px;
  --radius-md:  8px;
  --radius-lg:  12px;
  --radius-xl:  16px;
  --radius-full:9999px;

  /* --- Layout --- */
  --container-width:   960px;
  --container-narrow:  800px;
}