/* ============================================================
   SimVida: Brand tokens (high-fi)
   Sourced from simvida-ui/src/tokens/tokens.css.
   Variable names kept backwards-compatible with base.css.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700;800&display=swap');

:root {
  /* ---- Brand primary (logo green) ---- */
  --brand-primary:          #9CCA49;
  --brand-primary-hover:    #8BB83E;
  --brand-primary-active:   #7DA635;
  --brand-primary-disabled: #CEDFB0;

  /* Legacy names used by base.css */
  --brand-ink:          #4A4A4A;
  --brand-ink-soft:     #6b6b6b;
  --brand-accent:       #9CCA49;
  --brand-accent-soft:  #CEDFB0;
  --brand-warn:         #DB624F;
  --brand-ok:           #9CCA49;

  /* Surfaces */
  --brand-bg:           #ffffff;
  --brand-bg-alt:       #F8F8F8;
  --brand-bg-dim:       #F0F0F0;
  --brand-rule:         #DBDBDB;

  /* Feedback hues */
  --brand-error:        #DB624F;
  --brand-error-bg:     #FDF2F0;
  --brand-success:      #9CCA49;
  --brand-success-bg:   #F4F9EC;
  --brand-warning:      #F6C357;
  --brand-warning-bg:   #FEF9EE;
  --brand-info:         #3BB1DB;
  --brand-info-bg:      #EDF7FC;

  /* Shadows */
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.06);
  --shadow-md: 0 4px 8px rgba(0, 0, 0, 0.08);
  --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.12);
  --shadow-xl: 0 16px 48px rgba(0, 0, 0, 0.16);

  /* Type */
  --font-display: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-body:    'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-mono:    'Montserrat', -apple-system, BlinkMacSystemFont, sans-serif;

  /* Type scale */
  --fs-xs:   12px;
  --fs-sm:   14px;
  --fs-base: 16px;
  --fs-md:   18px;
  --fs-lg:   22px;
  --fs-xl:   28px;
  --fs-2xl:  36px;
  --fs-3xl:  48px;
  --fs-4xl:  64px;

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

  /* Radius */
  --r-sm:   4px;
  --r-md:   8px;
  --r-lg:   16px;
  --r-xl:   24px;
  --r-pill: 999px;
  --r-card: 20px;   /* SimVida card radius */
  --r-btn:  4px;    /* SimVida button radius */

  /* Container */
  --container-max: 1120px;
  --gutter: 24px;
}
