@import '../Constants'

.LoginModal
  border-radius: $borderRadius
  background-color: var(--block-color)
  padding: .5rem

  display: flex
  flex-direction: column

  h1
    margin: 0

  .LoginModal__Error
    background-color: #CC0000
    border: red 1px solid
    padding: .5rem .2rem
    border-radius: 3px

  .LoginModal__Form
    display: flex
    flex-direction: column
    margin-top: .5rem

    @media (min-width: 400px)
      width: 24rem

    .LoginModal__Field
      font-size: 1.5rem
      padding: .3rem
      margin: .5rem 0

    .LoginModal__Submit
      margin-top: 1rem
      font-size: 1.2rem
      padding: .5rem

  .LoginModal__Links
    display: flex
    margin-top: .75rem
    margin-left: auto

    p
      margin: 0 .2rem
    *
      margin: 0