@include export-module('cc-pagination-bar-layout') {
  .co-pagination-bar {
    font-family: $cc-co-pagination-bar-font-family;
    font-size: $cc-co-pagination-bar-font-size;
    width: 100%;
    ul.pagination {
      display: flex;
      justify-content: flex-end;
      flex-wrap: wrap;
      width: 100%;
      list-style-type: none;
    }
    li {
      display: flex;
      align-items: center;
      justify-content: center;
      flex-grow: 0;
      flex-shrink: 0;
      width: $cc-co-pagination-bar-button-size;
      height: $cc-co-pagination-bar-button-size;
      cursor: pointer;
      border-radius: $cc-co-pagination-bar-button-border-radius;
      font-size: $cc-co-pagination-bar-font-size;
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;
      &:not(:last-child) {
        margin-right: $cc-co-pagination-bar-button-margin;
      }
    }
    li.pagination-next, li.pagination-previous {
      //font-size: $cc-co-pagination-bar-font-size-medium;
      cursor: pointer;
      flex-grow: 0;
      min-width: $cc-co-pagination-bar-button-size;
      width: auto;
      text-align: center;
      padding: $cc-co-pagination-bar-button-previous-next-text-padding;
    }

    .pagination-next {
      .pagination-next-arrow {
        content: '';
        display: inline-block;
        padding: 3px;
        transform: rotate(-45deg);
     }
      a {
        margin-right: $cc-co-pagination-bar-button-previous-next-text-margin;
      }
    }
    .pagination-previous {
      .pagination-previous-arrow {
        content: '';
        display: inline-block;
        padding: 3px;
        transform: rotate(135deg);
      }
      a {
        margin-left: $cc-co-pagination-bar-button-previous-next-text-margin;
      }
    }
    li.current {
      font-size: $cc-co-pagination-bar-button-current-font-size;
      font-weight: $cc-co-pagination-bar-button-current-font-weight;
      opacity: 1;
      cursor: default;
    }
    li.disabled {
      div, a {
        opacity: 0.2;
      }
      cursor: default;
    }
  }
}
