.tomo-pagination {
    margin: 30px 0;
  
    .page-item {
        margin-right: 15px;
        &:nth-child(1), &:nth-child(2), &:nth-last-child(-n + 2){
            .page-link{
                background-color: transparent !important;
            }
        }
        &>span{
            background: transparent !important;
        }
        .page-link {
            color: $color-text;
            background-color: transparent;
            height: 30px;
            min-width: 30px;
            line-height: 30px;
            text-align: center;
            border: 0px;
            padding: 0 5px;
            color: $color-white;
            &:hover {
                color: $color-white;
                background-color: $color-primary;
            }
            &:focus, &:focus-visible{
                box-shadow: none;
            }
        }
        a.page-link{
            background: #292929;
        }
  
        &.active a.page-link {
            background-color: #424242;
        }
    
        // &.disabled:not([role="separator"]) .page-link {
        //     background-color: #373658;
        // }
    
        &:first-child,
        &:nth-child(2),
        &:nth-last-child(2),
        &:last-child {
            font-size: 0;

            span:before,
            a:before {
                font-size: 16px;
                line-height: 30px;
                display: inline-block;
                vertical-align: middle;
        
                @extend %tm-icon;
            }
        }
  
        &:first-child span:before,
        &:first-child a:before {
            content: '\e914';
        }
    
        &:nth-child(2) span:before,
        &:nth-child(2) a:before {
            content: '\e915';
        }
    
        &:nth-last-child(2) span:before,
        &:nth-last-child(2) a:before {
            content: '\e917';
        }
    
        &:last-child span:before,
        &:last-child a:before {
            content: '\e916';
        }
      
       
        
    }
  
    @include media-breakpoint-up(md) {
        margin-bottom: 50px;
    }
  
    @include media-breakpoint-up(lg) {
        margin-bottom: 100px;
    }
  }
  