// Account aside filters
// --------------------------------------------------

@import "../variables/mixins";
@import "../variables/colors";
@import "../variables/sizes";
@import "../variables/progress-bar";

.SideMenu {
  display: block;
  z-index: 10;
  width: 260px;
  min-height: 600px;
  background: transparent;
}

.SideMenu-progress {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  margin: 30px 0;
}

.SideMenu-progressBar {
  @include progress-bar(6px, 9px, true, false);
  width: 140px;
}

.SideMenu-separator {
  display: block;
  position: relative;
  z-index: 0;
  width: 100%;
  height: 1px;
  background-color: $cStructure-darkGrey;
}

.SideMenu-list {
  align-items: center;
  justify-content: space-between;
  margin: 25px 0;
}

.SideMenu-typeItem {
  position: relative;
  line-height: 35px;

  &:first-child {
    margin-left: 0;
  }

  &:last-child {
    margin-right: 0;
  }
}

.SideMenu-typeLink {
  display: inline-block;
  border: none;
  outline: none;
  background: transparent;
  color: #1181FB;
  font-size: 14px;

  &:hover {
    text-decoration: underline;
  }
}

.SideMenu-typeLink.is-selected {
  color: $cTypography-linkSelected;
  font-weight: bold;

  &:hover {
    text-decoration: none;
    cursor: default;
  }
}

.SideMenu-typeLink.is-disabled {
  color: rgba(black, 0.3);

  &:hover {
    color: rgba(black, 0.3);
    text-decoration: none;
    cursor: default;
  }
}

.SideMenu-typeLink.is-disabled {
  color: rgba(black, 0.3);

  &:hover {
    color: rgba(black, 0.3);
    text-decoration: none;
    cursor: default;
  }
}

.SideMenu-helpSegment {
  display: flex;
  flex-direction: row;
  padding: 15px;
  border: 1px solid $cTypography-help;
  border-radius: 4px;
  background: $cStructure-grayBkg;
}

.SideMenu-helpSegment--paragraph {
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin-left: 15px;
  color: $cTypography-paragraphs;
}