@breadcrumb-prefix-cls: ~"@{css-prefix}breadcrumb";
@breadcrumb-back-prefix-cls: ~'@{breadcrumb-prefix-cls}-back';

.@{breadcrumb-prefix-cls} {
  color: @breadcrumb-text-color;
  font-size: @font-size-middle;
  
  .@{breadcrumb-back-prefix-cls} a,
  a {
    color: @primary-color;
    transition: color @transition-time @ease-in-out;
    background: transparent;
    text-decoration: none;
    outline: none;
    cursor: pointer;
    font-weight: normal;
    &:hover {
      color: @breadcrumb-hover-color;
    }
    &:active {

      color: @primary-color;
    }
  }

  & > span:last-child &-item-separator {
    display: none;
  }
 
  &-item-separator {
    margin: 0 12px;
    color: @breadcrumb-separator-color;
  }

  &-item-link {
    &:hover {
      background-color: @gray-50;
      padding: 3px 6px;
      color: @breadcrumb-hover-color;
     }
     &:active {
      background-color:#090a0e; // ★待定
     }
    > .haloe-icon{
      margin-right: 4px;
    }
  }

  &-btn-back {
    margin-right: 10px;
    vertical-align: baseline;
    .haloe-icon {
      vertical-align: baseline;
    }
  }

  &-item-disabled {
    cursor: not-allowed;
    &:hover {
      background-color: @gray-50;
      padding: 3px 6px;
     }
     &:active {
      background-color:@blue-50;
     }
    a {
      pointer-events: none;
      color: @breadcrumb-disabled-color;
    }
    
  }
}