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

.application
  display: flex

  a
    cursor: pointer

  &--is-rtl
    direction: rtl

  &--wrap
    flex: 1 1 auto
    backface-visibility: hidden
    display: flex
    flex-direction: column
    min-height: 100vh
    max-width: 100%
    position: relative

application($material)
  background: $material.background
  color: $material.text.primary

  .text
    &--primary
      color: $material.text.primary !important

    &--secondary
      color: $material.text.secondary !important

    &--disabled
      color: $material.text.disabled !important

theme(application, 'application')

+firefox()
  @media print
    .application
      display: block

      &--wrap
        display: block