// .pages{font-size:12px;padding-bottom:20px;color:#888}
// .pages a,.pages span{display:inline-block;padding:4px 9px;margin:0 2px}
// .pages a{border:1px solid #ddd;color:#42b1e6}
// .pages a.current,.pages a:hover{border-color:#42b1e6;background-color:#42b1e6;color:#fff}
// .pages span{background-color:#efefef;border:1px solid #efefef}
@use '../../base/variable';
.pagination{
  font-size: 16px;
  color: #999;
  text-align: center;
  &.jewelry-pagination{
    span{
      &.active{
        color: #1F1D32;
        background-color: rgba($color: #fff, $alpha: .2);
      }
    }
    a{
      color: #445A6E;
      background-color: rgba($color: #fff, $alpha: .03);
      &:hover{
        color: #1F1D32;
        background-color: rgba($color: #fff, $alpha: .2);
      }
    }
  }
  span{
    margin: 0 3px;
    &.active{
      display: inline-block;
      width: 36px;
      height: 36px;
      line-height: 36px;
      text-align: center;
      color: #fff;
      background-color: $defaultColor;
    }
  }
  a{
    margin: 0 3px;
    display: inline-block;
    width: 36px;
    height: 36px;
    line-height: 36px;
    text-align: center;
    color: #999;
    background-color: #f0f0f0;
    &.jump-btn{
      background-color: inherit;
      color: #999;
    }
  }
  input[type=text]{
    width: 30px;
    border: 1px solid #eee;
  }
}