@charset "utf-8";
@import (optional, reference) "var.less";
/*Pagination*/
._pagination {
  --_page-c-sel: var(--_c-prim);
  --_page-c-txt: var(--_c-text);
  --_page-h: var(--_sz-body);
  --_page-fs: var(--_sz-ignore);
  --_page-m: var(--_sz-min);
  --_page-a: center;
  color: var(--_page-c-txt);
  font-size: var(--_page-fs);
  line-height: var(--_page-h);
  margin: var(--_m) auto;
  display: flex;
  align-items: center;
  justify-content: var(--_page-a);
  [rep=pages],
  [rep=main],
  [rep=other] {
    display: inline-flex;
    align-items: center;
  }
  &[align=left] {
    --_page-a: flex-start;
    [rep=other] {
      flex: auto;
      text-align: right;
    }
  }
  &[align=right] {
    --_page-a: flex-end;
    [rep=other] {
      flex: auto;
      text-align: left;
    }
  }
  &[align=left]:has([rep=main]) {
    [rep=main] :first-child {
      margin-left: 0;
    }
  }
  &[align=right]:has([rep=main]) {
    [rep=main] :last-child {
      margin-right: 0;
    }
  }
  &[align=left]:not(:has([rep=main])) {
    & :first-child {
      margin-left: 0;
    }
  }
  &[align=right]:not(:has([rep=main])) {
    & :last-child {
      margin-right: 0;
    }
  }
  [class*="icon"] {
    font-size: 1.0rem;
  }
/* 
  [rep=first] *:not([class*="icon"]),
  [rep=prev] *:not([class*="icon"]) {
    margin-right: var(--_page-m);
    margin-left: calc(-1*var(--_page-m));
  }
  [rep=last] *:not([class*="icon"]),
  [rep=next] *:not([class*="icon"]) {
    margin-left: var(--_page-m);
    margin-right: calc(-1*var(--_page-m));
  } */
  a,
  &[type=group] [rep=main] span {
    color: var(--_page-c-txt);
    height: auto;
    line-height: var(--_sz-font);
    border: 1px solid var(--_c-text-bd);
    border-radius: var(--_r);
    background-image: none;
    padding: .6rem .9rem;
    margin: 0 calc(var(--_page-m)/2);
    background-color: #fff;
    .v3-trans-all(var(--_dur-1));
    position: relative;
  }
  span {
    margin: 0 calc(var(--_page-m)/2);
  }
  [selected] {
    color: #fff;
    height: auto;
    line-height: var(--_sz-font);
    border: 1px solid var(--_page-c-sel);
    border-radius: var(--_r);
    background-image: none;
    padding: .6rem .9rem;
    margin: 0 calc(var(--_page-m)/2);
    background-color: var(--_page-c-sel);
    position: relative;
  }
  [disabled] {
    opacity: var(--_o-disabled);
  }
  a:where(:not([rep=total], [selected])):hover {
    color: var(--_page-c-sel);
    border-color: var(--_page-c-sel);
    text-decoration: none;
    background-color: var(--_c-prim-bg);
    z-index: 2;
  }
  &[type=group] {
    --_page-m: 0;
    [rep=main]>* {
      border-radius: 0;
      &:not(:last-child) {
        margin-right: -0.1rem;
      }
      &:first-child {
        border-radius: var(--_r) 0 0 var(--_r);
      }
      &:last-child {
        border-radius: 0 var(--_r) var(--_r) 0;
      }
    }
  }
  /*   [rep=group]>span {
    border: 1px solid var(--_c-text-bd);
    background-color: #fff;
    height: auto;
    line-height: 1.4rem;
    margin: 0;
    padding: .6rem .9rem;
  }
 */
  /*   [rep=group] [rep=pages] * {
    border-radius: 0;
    margin-left: 0;
    margin-right: 0;
  }
  [rep=group] [rep=pages] *:not(:last-child) {
    margin-right: -0.1rem;
  }
 */
  &[type=plain] a:not([selected]),
  &[type=plain] span:not([selected]),
  &[type=plain] a:not([selected]):hover,
  &[type=plain] span:not([selected]):hover {
    background: transparent;
    border: none;
  }
  /*  &[type=plain] a:where(:not([rep=total]))[selected] {
    height: var(--_sz-body);
    min-width: var(--_sz-body);
    text-align: center;
    line-height: var(--_sz-body);
    border-radius: var(--_sz-body);
    border-width: 0;
    padding: 0;
  } */
  li {
    display: inline-block;
  }
  .pagination {
    text-align: center;
  }
  &[turning] {
    padding: calc(var(--_sz-body)/2) 0;
  }
}
