:root {
  
  /* Helios Neo */
  /** Buttons **/
  /*** primary ***/
  --button-primary-icon: light-dark(var(--light-100-white), var(--dark-neutral900));
  --button-primary-text: light-dark(var(--light-100-white), var(--dark-neutral900));
  --button-primary-bg-default: light-dark(var(--blue700), var(--blue200));
  --button-primary-bg-hover: light-dark(var(--blue800), var(--blue100));
  --button-primary-bg-pressed: light-dark(var(--blue900), var(--light-100-white));
  --button-primary-focus: light-dark(var(--blue200), var(--blue200));

      --button-primary-color: var(--button-primary-text);
      --button-primary-border-color: var(--button-primary-text);
      --button-primary-outline-color: #a3d7ff;  /* ??? */
      --button-primary-color-disabled: rgba(0, 90, 160, 0.5); /* --neo-main-blue opacity: 0.5 */

  /*** secondary ***/
  --button-secondary-icon: light-dark(var(--blue700), var(--blue200));
  --button-secondary-text: light-dark(var(--blue700), var(--blue200));
  /*--button-secondary-bg-default: light-dark(var(--dark-alpha-white-0), var(--light-alpha-dark-0));*/  /* to do recheck colors */
  --button-secondary-bg-default: light-dark(var(--dark-alpha-white-96), var(--light-alpha-dark-96));
  
  --button-secondary-bg-hover: light-dark(var(--blue100), var(--dark-alpha-white-16));
  --button-secondary-bg-pressed: light-dark(var(--blue200), var(--dark-alpha-white-20));
  --button-secondary-bg-border-default: light-dark(var(--blue700), var(--blue200));
  --button-secondary-border: light-dark(var(--blue700), var(--blue200));
  --button-secondary-focus: light-dark(var(--blue200), var(--blue200));

      --button-secondary-color: var(--button-secondary-text);
      --button-secondary-border-color: var(--button-secondary-border);
      --button-secondary-outline-color: #a3d7ff; /* ??? */
      --button-secondary-color-disabled: rgba(0, 90, 160, 0.5); /* --neo-main-blue opacity: 0.5 */

  /*** tertiary ***/
  --button-tertiary-icon: light-dark(var(--light-neutral700), var(--light-neutral700));
      --button-tertiary-icon-default: light-dark(var(--light-neutral700), var(--light-neutral700));
  --button-tertiary-text: light-dark(var(--light-neutral700), var(--light-neutral700));
      --button-tertiary-text-default: light-dark(var(--light-neutral700), var(--light-neutral700));
  --button-tertiary-bg-default: light-dark(var(--dark-alpha-white-0), var(--light-alpha-neutral-dark-0));
  --button-tertiary-bg-hover: light-dark(var(--light-neutral100), var(--light-neutral100));
  --button-tertiary-bg-pressed: light-dark(var(--light-neutral200), var(--dark-alpha-white-32));
  --button-tertiary-focus_ring: light-dark(var(--light-neutral200), var(--light-neutral200));
  --button-tertiary-border: light-dark(var(--light-neutral300), var(--light-neutral300));

      --button-tertiary-color: var(--button-tertiary-text);
      --button-tertiary-border-color: var(--button-tertiary-border);
      --button-tertiary-outline-color: #eaecf0;  /* ??? */
      --button-tertiary-color-disabled: var(--button-tertiary-border); /* ??? */
    
  /*** success ***/    
  --button-success-icon: light-dark(var(--light-neutral25), var(--light-neutral25));
  --button-success-text: light-dark(var(--light-100-white), var(--dark-neutral900));
  --button-success-bg-default: light-dark(var(--green600), var(--green300));
  --button-success-bg-hover: light-dark(var(--green700), var(--green200));
  --button-success-bg-pressed: light-dark(var(--green800), var(--green100));
  --button-success-focus: light-dark(var(--green200), var(--blue200));
    
    
  /*** text button ***/
  --button-text-icon: light-dark(var(--blue700), var(--blue700));
  --button-text-text: light-dark(var(--blue700), var(--blue700));
  --button-text-bg-default: light-dark(var(--dark-alpha-white-0), var(--light-alpha-neutral-dark-0));
  --button-text-bg-hover: light-dark(var(--blue100), var(--dark-alpha-white-16));
  --button-text-bg-pressed: light-dark(var(--blue200), var(--dark-alpha-white-20));
  --button-text-focus: light-dark(var(--blue200), var(--dark-alpha-white-20));

  /*** primary error ***/    
  --button-primary-error-icon: light-dark(var(--light-neutral25), var(--light-neutral25));
  --button-primary-error-text: light-dark(var(--light-neutral25), var(--light-neutral25));
  --button-primary-error-bg-default: light-dark(var(--red600), var(--red300));
  --button-primary-error-bg-hover: light-dark(var(--red700), var(--red200));
  --button-primary-error-bg-pressed: light-dark(var(--red800), var(--red100));
  --button-primary-error-focus: light-dark(var(--red200), var(--dark-alpha-white-20));
 
   /*** text button error ***/
  --button-text-error-text: light-dark(var(--red700), var(--red700));
  --button-text-error-icon: light-dark(var(--red700), var(--red700));
  --button-text-error-bg-default: light-dark(var(--dark-alpha-white-0), var(--dark-alpha-white-0));
  --button-text-error-bg-hover: light-dark(var(--red100, var(--dark-alpha-white-16));
  --button-text-error-bg-pressed: light-dark(var(--red200, var(--dark-alpha-white-20));
  --button-text-error-border: light-dark(var(--red600, var(--red300));
  --button-text-error-focus: light-dark(var(--red200), var(--dark-alpha-white-20));
}