@import "@/common/styles/colors"

.status-title
  display: flex
  flex-direction: row
  align-items: center

.status-title h2
  color: $white
  flex-grow: 1

.status-title hr
  flex-grow: 15
  height: 5px
  border: none
  background-color: $gray-white
  border-radius: 50px

.shards
  display: flex
  flex-wrap: wrap

.shard
  display: flex
  justify-content: center
  align-items: center
  color: $white
  font-size: 24pt
  font-weight: 700
  margin: 10px 15px 20px
  width: 70px
  height: 70px
  background-color: $lime
  border-radius: 15px
  filter: drop-shadow(0px 0px 12px $lime)

.shard-inactive
  background-color: $red
  filter: drop-shadow(0px 0px 12px $red)