$color-primary: #c6a0f6;
$color-sec: #f5bde6;
$color-bg: #24273a;
$color-plane: #5a2d85;
$color-light: #5b6078;

.bar {
  background-color: $color-bg;
  border-radius: 12px;
  border: 3px solid $color-light;
}

.bat {
  color: $color-primary;
}
.circle {
  margin-top: -2.5rem;
  color: $color-primary;
}

.workspace-entry {
  border: 2px solid $color-primary;
  border-radius: 20px;
  margin: 2px;

  &.empty {}

  &.occupied{
    background-color: $color-light;
  }

  &.current {
    background-color: $color-plane;
  }
}

.power {
  color: $color-primary;
  font-size: 18;
  padding-right: 3px;
  padding-bottom: 2px;
  margin-bottom: 5px;
  // margin-left: 1px;
  margin: 5px 2px;
  background-color: $color-plane;
  border: 2px solid;
  border-radius: 15px;
}

.cal {
  background-color: $color-primary;
  border-radius: 8px;
  padding: 5px;
}

.clock {
  color: $color-primary;
  background-color: $color-plane;
  border: 2px solid $color-primary;
  border-radius: 3px;
  padding: 2px;
  margin: 2px;
}