@import url('../CloudTheme.css');

div.root {
  overflow: visible;
  flex-shrink: 0;
}

.spacer {
  display: none;
}

div.toolbar {
  display: flex;
  align-items: center;
  height: 28px;
  min-height: 28px;

  div.actions {
    display: flex;
    align-items: center;
    gap: 8px;

    margin-left: 24px;
  }

  .selectLabel,
  .select {
    color: $black-black2;
  }

  .displayedRows {
    font-weight: 500;

    strong {
      font-weight: 500;
    }
  }

  .selectRoot {
    margin-left: 12px;
    margin-right: 24px;

    div.select {
      padding: 0;
      padding-left: 0;
      font-weight: 500;

      padding-right: 4px;

      &:focus {
        background-color: transparent;
      }
    }

    .selectIcon {
      top: auto;
      bottom: auto;

      path {
        fill: $black-black2;
      }
    }
  }
}

button.iconBtnRoot {
  padding: 6px;
  border-radius: 4px;
  border: 1px solid $stroke-stroke1;
  color: $black-black2;
  background-color: #fff;
  box-shadow: $shadow-light;

  path {
    fill: $black-black2;
  }

  &.iconBtnDisabled {
    color: $black-black4;
    border-color: $black-black4;

    path {
      fill: $stroke-stroke2;
    }
  }

  &:hover {
    background-color: $black-black5;
  }
}
