$button-group__class: '#{$prefix}-button-group';

$button-group__font-size: rem-calc(14);
$button-group__border-size: rem-calc(1);
$button-group__border: $button-group__border-size solid $md-gray-20;
$button-group__color: $md-black-100;
$button-group__background: transparent;
$button-group__line-height: rem-calc(16);
$button-group__padding: rem-calc(8) rem-calc(18);
$button-group-active__color: $md-gray-100;
$button-group-active__background: $md-blue-10;
$button-group-disabled__color: $md-gray-50;
$button-group-hover__background: $black-04;
$button-group__border-radius-pill: rem-calc(25);
$button-group__border-radius: rem-calc(4);
$button-group-icon__padding: rem-calc(10);

$button-group__font-size--dark: rem-calc(14);
$button-group__line-height--dark: rem-calc(22);
$button-group__padding--dark: rem-calc(5) rem-calc(18);
$button-group__border--dark: $button-group__border-size solid $md-gray-80;
$button-group__color--dark: $md-white-100;
$button-group-active__color--dark: $md-white-100;
$button-group-active__background--dark: $md-gray-80;
$button-group-disabled__color--dark: $md-gray-70;
$button-group-hover__background--dark: $white-12;