Context {
  display: flex

  div.level {
    width: 11rem
    border-right: 1px gainsboro solid

    div.Option {}

  }
}

Option {
  min-width: 8rem
  padding: .5rem 1rem
  display: flex
  align-items: center

  -selected {
    $backgroundSelected
  }

  div.circle {
    width: 3.6rem
    position: relative

    div.alert {
      position: absolute
      width: 1.2rem
      height: 1.2rem
      border-radius: 1rem
      top: -.2rem
      left: -.2rem

      background-color: red
      color: #fff
      font-size: .8rem

      display: flex
      justify-content: center
      align-items: center
    }
    
    a img {
   
    }
    i {
      $avatarSmall
      $colorPrimary
      font-size: 1.3rem
      display: flex
      justify-content: center
      align-items: center
    }

  }

  div.Link {
    flex-grow: 1

    display: flex
    align-items: center
    height: 3rem
  }

}