/* ---------- Products listing ---------- */
.pl-section{ background:#fff; padding:40px 0 70px; scroll-margin-top:20px; }

/* tabs bar */
.pl-section .pl-tabs-wrap{
  position:relative;
  max-width:900px;
  margin:0 auto 40px;
  padding: 15px 30px;
  border-radius:50px;
  background: linear-gradient( 180deg, #FFF5F5 0%, #F6F6F6 100%);
}
.pl-section .pl-scroll{
  display:flex; gap:6px;
  overflow-x:auto; scroll-behavior:smooth;
  scrollbar-width:none; -ms-overflow-style:none;
  -webkit-overflow-scrolling:touch; cursor:grab;
}
.pl-section .pl-scroll::-webkit-scrollbar{ display:none; }
.pl-section .pl-scroll.is-dragging{ cursor:grabbing; scroll-behavior:auto; user-select:none; }

.pl-section .pl-tab{
  flex:0 0 auto;
  white-space:nowrap;
  cursor:pointer;
  padding:10px 22px;
  border-radius:30px;
  font: 500 13px/1 "Inter",sans-serif;
  color: #000;
  text-decoration:none;
  transition:.3s;
}
.pl-section .pl-tab:hover{background: var(--btn-color);color: #fff;}
.pl-section .pl-tab.active{ background:var(--btn-color); color:var(--color2); }

/* arrows (sirf tab dikhte hain jab tabs bar se zyada hon) */
.pl-section .pl-arrow{
  display:none;
  position:absolute; top:0; bottom:0; margin:auto;
  height:15px; width:15px; padding:0; border:0; z-index:2;
  background:url(/images/arrow_black.png) no-repeat center / contain;
  cursor:pointer; transition:opacity .3s;
}
.pl-section .pl-arrow svg{ display:none; }      /* markup mein purana svg ho to chhup jaye */
.pl-section .pl-prev{left: 7px;}
.pl-section .pl-next{right: 6px;transform:rotate(180deg);}
.pl-section .pl-tabs-wrap.is-scrollable .pl-arrow{ display:block; }
.pl-section .pl-arrow:hover{ opacity:.6; }
.pl-section .pl-arrow:disabled{ opacity:.25; pointer-events:none; }

/* card */
.pl-section .pl-card{
  height:100%; overflow:hidden; border-radius:14px;
  background:#F4F5F7; border:1px solid transparent;
  transition:background .3s, border-color .3s;
}
.pl-section .pl-img{ display:block; height:230px; overflow:hidden; }
.pl-section .pl-img img{
  width:100%; height:100%; object-fit:cover; display:block; transition:transform .6s;
}
.pl-section .pl-card:hover .pl-img img{ transform:scale(1.05); }

.pl-section .pl-body{ padding:26px 24px 24px; }
.pl-section .pl-name{
  font-size:16px; font-weight:600; line-height:1.4; margin:0 0 18px; min-height:46px;
}
.pl-section .pl-name a{ color:var(--txt-color); text-decoration:none; }
.pl-section .pl-line{ display:block; height:1px; background:rgba(0,0,0,.12); margin-bottom:16px; }
.pl-section .pl-more{
  display:inline-flex; align-items:center; gap:6px;
  font:600 11px/1 "Inter",sans-serif; text-transform:uppercase; letter-spacing:.02em;
  color:var(--txt-color); text-decoration:none; transition:color .3s;
}

/* hover: pink card */
.pl-section .pl-card:hover{ background:#FFE0E5; border-color:var(--btn-color); }
.pl-section .pl-card:hover .pl-more,
.pl-section .pl-card:hover .pl-name a{ color:var(--btn-color); }

.pl-section .pl-empty{ text-align:center; font:400 14px/1.6 "Inter",sans-serif; color:var(--txt-color); opacity:.7; padding:40px 0; }

/* pagination */
.pl-section .pl-pager{ display:flex; justify-content:center; margin-top:50px; }
.pl-section .pl-pager nav{ width:100%; }
.pl-section .pl-pager nav > div:last-child{ justify-content:center !important; }
.pl-section .pl-pager p.small{ display:none; }
.pl-section .pl-pager .pagination{ gap:10px; margin:0; justify-content:center; }
.pl-section .pl-pager .page-link{
  min-width:36px; height:36px; padding:0 10px; border:0; border-radius:6px;
  display:flex; align-items:center; justify-content:center;
  background:#F1F2F4; color:var(--txt-color);
  font:500 12px/1 "Inter",sans-serif; box-shadow:none;
}
.pl-section .pl-pager .page-link:hover{ background:var(--btn-color); color:var(--color2); }
.pl-section .pl-pager .page-item.active .page-link{ background:var(--btn-color); color:var(--color2); }
.pl-section .pl-pager .page-item.disabled .page-link{ opacity:.4; }

.pl-section .pl-search-note{
  text-align:center; margin:0 0 26px;
  font:400 14px/1.6 "Inter",sans-serif; color:var(--txt-color);
}
.pl-section .pl-empty a{ color:var(--btn-color); }

@media (max-width:991px){
  .pl-section{ padding:30px 0 50px; }
  .pl-section .pl-tabs-wrap{ border-radius:30px; }
  .pl-section .pl-img{ height:210px; }

  /* choti screen par arrows bar ke andar (bahar jaate to page sideways scroll hota) */
  .pl-section .pl-prev{ left:8px; }
  .pl-section .pl-next{ right:8px; }
}

@media (max-width:767px){
    .pl-section .pl-name {
        margin-bottom: 5px;
        align-content: center;
        font-size: 14px;
    }
    
    .pl-section .pl-line {
        margin-bottom: 5px;
    }
    
    .pl-section .pl-body {
        padding: 15px;
    }
    
    .pl-section .pl-tabs-wrap.is-scrollable .pl-arrow {
        width: 10px;
        height: 10px;
    }
    
    .pl-section .pl-pager .pagination {
        display: ruby;
    }
}

@media (min-width:768px) and (max-width:992px){

    .pl-section .pl-body {
        padding: 15px;
    }
    
    .pl-section .pl-name {
        font-size: 15px;
        margin-bottom: 5px;
        align-content: center;
    }
    
    .pl-section .pl-line {
        margin-bottom: 5px;
    }
    
}    
    
