.ff-add-button-container {
  position: relative;
  border: none;
  width: 24px;
  height: 24px;
  border-radius: 4px;
  background-color: transparent;
  cursor: pointer;
  .ff-add-button-tree {
    position: relative;
    border: none;
    width: 32px;
    height: 28px;
    bottom: 2px;
    border-radius: 4px;
    background-color: transparent;
    cursor: pointer;
  }
  &.ff-hovered-add-button--primary {
    background-color: var(--hover-color);
  }
  .ff-hovered-add-icon--primary {
    svg {
      path {
        fill: var(--add-icon-hover-color);
      }
    }
  }
  .ff-add-icon--primary {
    svg {
      path {
        fill: var(--brand-color);
      }
    }
  }
  .ff-add-button {
    position: absolute;
    border: none;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 4px;
    background: none;
  }
}
