/*!
 / pin.sass
 / Copyright (c) 2019, Texx
 / License: MIT
 /     See https://github.com/texxme/Texx/blob/master/LICENSE
 /

.title
  color: #d4d1cc

.columns
  min-height: 100%

.enter-pin
  position: relative
  width: 60vw
  margin: 0 auto
  top: 50%
  transform: translateY(-50%)

.pin-wrapper
  padding: 0
  margin: 0
  align-items: center
  justify-content: center

.pin-wrapper > .column
  align-items: center
  justify-content: center

.pin-wrapper > .column input
  width: 10vw
  height: 10vw
  font-size: 10vw
  background-color: $gray
  color: transparent
  text-shadow: 0 0 0 #000
  border: none
  border-radius: 20%
  text-align: center

.pin-wrapper > .column input::-webkit-outer-spin-button, .pin-wrapper > .column input::-webkit-inner-spin-button
  -webkit-appearance: none
  margin: 0

.pin-wrapper > .column input:focus
  background-color: $light-gray
  border-color: inherit
  -webkit-box-shadow: none
  box-shadow: none
  outline: none