/* ===================================================
   Cotton Apps — Design Tokens
   Fonte: cotton_design_system (palette.dart + const_values.dart + light_theme.dart)
   Para alterar o visual do site, edite apenas este arquivo.
   =================================================== */

:root {

  /* ---------- Cores Principais ---------- */
  --color-primary:        #749E78;
  --color-primary-light:  #83A17D;
  --color-primary-accent: #E2EDDF;
  --color-secondary:      #CB9E79;

  /* ---------- Neutros ---------- */
  --color-white:          #FFFFFF;
  --color-light:          #ECECEC;
  --color-dark:           #313131;
  --color-dark-accent:    #3F3F3F;

  /* ---------- Cores de Módulos ---------- */
  --color-cultiva:  #637CFF;   /* Palette.blue */
  --color-regula:   #83A17D;   /* Palette.primaryLight */
  --color-aduba:    #CB9E79;   /* Palette.secondary */
  --color-estima:   #F2994A;   /* Palette.orange */
  --color-orange:   #F2994A;   /* alias → --color-estima */
  --color-educa:    #F36A6A;   /* Palette.red */
  --color-mapeia:   #8D6E63;   /* hex literal do app */

  /* ---------- Escala de Cinza ---------- */
  --color-gray:       #9F9F9F;
  --color-gray-light: #E0E0E0;
  --color-gray-dark:  #424242;
  --color-gray-100:   #F5F5F5;
  --color-gray-200:   #EEEEEE;
  --color-gray-300:   #E0E0E0;
  --color-gray-400:   #BDBDBD;
  --color-gray-500:   #9E9E9E;
  --color-gray-600:   #757575;
  --color-gray-700:   #616161;
  --color-gray-800:   #424242;
  --color-gray-900:   #212121;

  /* ---------- Tipografia ---------- */
  --font-title: 'Oswald', sans-serif;
  --font-body:  'Roboto', sans-serif;

  --fs-xs:   10px;
  --fs-sm:   12px;
  --fs-base: 14px;
  --fs-md:   16px;
  --fs-lg:   18px;
  --fs-xl:   20px;
  --fs-2xl:  24px;
  --fs-3xl:  28px;

  /* ---------- Espaçamento ---------- */
  --space-2xs: 2px;
  --space-xs:  4px;
  --space-sm:  8px;
  --space-md:  16px;
  --space-lg:  24px;
  --space-xl:  32px;
  --space-2xl: 48px;

  /* ---------- Border Radius ---------- */
  --radius-xs: 4px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --radius-2xl: 28px;

  /* ---------- Elevação / Sombras ---------- */
  --shadow-sm:  0 2px 8px rgba(0,0,0,0.06);
  --shadow-md:  0 4px 16px rgba(0,0,0,0.09);
  --shadow-lg:  0 8px 32px rgba(0,0,0,0.12);
  --shadow-primary: 0 8px 24px rgba(116,158,120,0.20);

  /* ---------- Transições ---------- */
  --transition-fast:   0.15s ease;
  --transition-normal: 0.25s ease;

  /* ---------- Layout ---------- */
  --navbar-h: 64px;
}