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

/* Theme */
v-messages($material)
  color: $material.text.secondary

v-messages-rtl()
  text-align: right

theme(v-messages, "v-messages")
rtl(v-messages-rtl, "v-messages")

.v-messages
  flex: 1 1 auto
  font-size: 12px
  min-height: 12px
  min-width: 1px // Ensure takes up space with no messages and inside of flex
  position: relative

  &__message
    line-height: 1
    word-break: break-word
    overflow-wrap: break-word
    word-wrap: break-word
    hyphens: auto