@import "@/common/styles/colors"

.available-integrations
  display: flex
  flex-direction: column
  gap: 0.5rem
  user-select: none
  overflow-x: hidden
  overflow-y: scroll

.integration-tab
  display: flex
  align-items: center
  gap: 0.5rem
  color: $darker-white
  padding: 0.6rem 0.7rem
  border: 2px solid transparent
  border-radius: 1rem
  cursor: pointer

  svg
    width: 1.3rem
    height: 1.3rem
  p
    margin: 0
    font-size: 14pt

.integration-active
  background-color: $light-gray
  color: $white

@media (max-width: 781px)
  .available-integrations
    flex-direction: row
    overflow-x: scroll
    overflow-y: hidden
    gap: 0.5rem