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

v-dataiterator($material)
  .v-data-iterator__actions
    color: rgba($material.fg-color, $material.secondary-text-percent)

    &__select
      .v-select
        .v-select__selection--comma
          color: rgba($material.fg-color, $material.secondary-text-percent) !important

        .v-input__append-inner
          color: rgba($material.fg-color, $material.secondary-text-percent) !important

theme(v-dataiterator, "v-data-iterator")

/** Actions */
.v-data-iterator__actions
  display: flex
  justify-content: flex-end
  align-items: center
  font-size: 12px
  flex-wrap: wrap-reverse

  .v-btn
    color: inherit

    &:last-of-type
      margin-left: 14px

  &__range-controls
    display: flex
    align-items: center
    min-height: 48px

  &__pagination
    display: block
    text-align: center
    margin: 0 32px 0 24px

  &__select
    display: flex
    align-items: center
    justify-content: flex-end
    margin-right: 14px
    white-space: nowrap

    .v-select
      flex: 0 1 0
      margin: 13px 0 13px 34px
      padding: 0
      position: initial

    .v-select__selections
      flex-wrap: nowrap

      .v-select__selection--comma
        font-size: 12px