@use "sizes" as *;
@use "../typography/sizes" as *;

@mixin dx-toolbar-sizing($height, $padding, $label-font-size, $item-spacing) {
  padding: $padding;
  overflow: visible;

  .dx-toolbar-before {
    padding-inline-end: $material-toolbar-section-padding;
  }

  .dx-toolbar-after {
    padding-inline-start: $material-toolbar-section-padding;
  }

  .dx-toolbar-before:empty,
  .dx-toolbar-after:empty {
    padding: 0;
  }

  .dx-toolbar-items-container {
    height: $height;
    overflow: visible;
  }

  .dx-toolbar-menu-container {
    padding: 0;
    padding-inline-start: $item-spacing;
  }

  .dx-toolbar-item {
    padding: 0;
    padding-inline-end: $item-spacing;

    &.dx-toolbar-first-in-group {
      padding-left: $material-toolbar-item-spacing * 4;
    }

    &:last-child {
      padding: 0;
    }
  }

  .dx-toolbar-label {
    font-size: $label-font-size;
    font-weight: 500;
  }
}

@mixin dx-toolbar-item-padding($padding) {
  padding: 0;
  padding-inline-start: $padding;

  &:last-child {
    padding-inline-start: $padding;
  }

  &:first-child {
    padding: 0;
  }
}