.root {
  display: flex;
  padding: 10px 16px;
  min-height: 40px;
  gap: 16px;
  align-items: center;
  width: 100%;
  background: none;
  border: none;
  outline: none;
  cursor: pointer;
  box-sizing: border-box;

  &:hover {
    background: var(--fill9);
  }

  &:active {
    background: var(--fill9);
  }

  &:disabled,
  &__disabled {
    opacity: 40%;
    cursor: default;
    background: none;
  }

  &__withSubtitle {
    min-height: 56px;
    padding: 8px 16px;
  }

  &__loading {
    background: none;

    .center {
      gap: 4px;
    }
  }

  &__noHover {
    background: none !important;
    cursor: default;

    &:active, &:hover {
      background: none !important;
    }
  }
}

.center {
  display: flex;
  flex-direction: column;
  flex: 1;
}

.reversed {
  flex-direction: column-reverse;
}