@import '../bootstrap'
@import '../theme'

/* Themes */
v-icon($material)
  color: $material.icons.active

  &.v-icon--disabled
    color: $material.icons.inactive !important

theme(v-icon, "v-icon")

.v-icon
  align-items: center
  display: inline-flex
  font-feature-settings: 'liga'
  font-size: 24px
  justify-content: center
  line-height: 1
  transition: $primary-transition
  vertical-align: text-bottom

  &--right
    margin-left: $grid-gutters.lg
  &--left
    margin-right: $grid-gutters.lg

  &.v-icon.v-icon--link
    cursor: pointer

  &--disabled
    pointer-events: none
    opacity: .6

  &--is-component
    height: 24px