.suse {
  $primary: hsl(225, 100%, 57%);
  $info:  mix($primary, $secondary, 50%);
  $selected: rgba($primary, .5);

  --primary                    : #{$primary};
  --primary-text               : #fff;
  --primary-hover-bg           : #{darken($primary, 10%)};
  --primary-hover-text         : #{saturate($lightest, 20%)};
  --primary-active-bg          : #{darken($primary, 25%)};
  --primary-active-text        : #{contrast-color(darken($primary, 25%))};
  --primary-border             : #{$primary};
  --primary-banner-bg          : #{rgba($primary, 0.15)};
  --primary-light-bg           : #{rgba($primary, 0.05)};
  --primary-keyboard-focus     : hsl(from var(--primary) h s calc(l - 10));

  --info                    : #{$info};
  --info-text               : #{contrast-color($info)};
  --info-hover-bg           : #{darken($info, 10%)};
  --info-hover-text         : #{saturate($lightest, 20%)};
  --info-active-bg          : #{darken($info, 25%)};
  --info-active-text        : #{contrast-color(darken($info, 25%))};
  --info-border             : #{$info};
  --info-banner-bg          : #{rgba($info, 0.15)};
  --info-light-bg           : #{rgba($info, 0.05)};

}