

#MiniProfile {
  background-color: $background-primary;
  border-radius: 5px;
  border: 1px solid $deprecated-text-input-border;
  #Profile {
    background-color: $background-tertiary;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    margin-right: 2px;
    #Nickname {
      font-weight: 400;
      line-height: 18px;
      color: $header-primary;
      font-size: 16px;
      margin-top: 12px;
    }
    #Username {
      line-height: 18px;
      color: $header-secondary;
      font-size: 14px;
    }
    #CustomStatusLabel {
      margin-top: 12px;
      #Text {
        text-align: center;
        color: $header-primary;
        font-size: 14px;
      }
    }
    #StatusIndicator {
      border: 6px solid $background-tertiary;
      border-radius: 14px;
      &[color="online"] {
        background-color: #43b581;
      }
      &[color="idle"] {
        background-color: #faa61a;
      }
      &[color="dnd"] {
        background-color: #f04747;
      }
      &[color="offline"],
      &[color="invisible"] {
        background-color: #747f8d;
      }
    }
    &[isPlaying="true"] {
      background-color: $blurple;
      #StatusIndicator {
        border-color: $blurple;
        background-color: white;
      }
      #Nickname {
        color: white;
      }
    }
  }
  #ProfilePresence {
    background-color: darken($blurple, 2);
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    #Header {
      text-transform: uppercase;
      color: $header-primary;
      font-size: 12px;
      line-height: 16px;
      font-weight: 600;
    }
    #Label {
      font-size: 14px;
    }
  }

  #SectionHeader {
    color: $header-secondary;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 12px;
    border: none;
    background: none;
  }

  #RolesSection {
    #RoleBadge {
      border: 1px solid;
      border-radius: 11px;
      border-color: #bbbe99;
      #Circle {
        border-radius: 6px;
      }
      #RoleName {
        font-size: 12px;
        color: $header-primary;
      }
    }
    QListWidget {
      outline: none;
      background: $background-secondary;
      border-radius: 3px;
      padding: 6px;
      &::item {
        padding: 4px 2px;
        margin-bottom: 2px;
        border-radius: 3px;
        text-align: left;
        font-size: 14px;
        line-height: 20px;
        color: $interactive-normal;
        &:hover {
          background-color: $background-modifier-hover;
          color: $interactive-hover;
        }
        /*&:active {
          background-color: $background-modifier-active;
          color: $interactive-active;
        }*/
        &:selected {
          background-color: $background-modifier-selected;
          color: $interactive-active;
        }
      }
      QScrollBar {
        border-color: $background-secondary;
      }
    }
  }
}
