/* ==========================================================================
   Config
   ========================================================================== */

@use "sass:math";

$button-group-default-background: $neutral-lightest;

/* ==========================================================================
   Styles
   ========================================================================== */

.gui-button-group {
  background: $button-group-default-background;
  padding: 0 $layout-spacing-base * 0.5;
  border-radius: $btn-border-radius;
  display: flex;
  align-items: center;

  .gui-button {
    margin: 0;
    border-radius: 0;
    padding: math.div($layout-spacing-base, 1.5);
  }

  .gui-button--icon-only {
    &:hover path {
      fill: $neutral-dark;
    }

    &:active path {
      fill: $neutral-base;
    }
  }
}

/* ==========================================================================
   Modifiers
   ========================================================================== */