.article-cart{
  background-color: #fff;
  border-radius: 15px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
  padding: 20px;
}

.article-cart .top{
  position: relative;
  height: 200px;
  border-radius:15px;

}
.article-cart .top img{
  height: 100%;
  filter: grayscale(100%);
  width:100%;
  border-radius:15px;

  
}
.article-cart .bottom .article-title{
  color:#000000;
  font-weight: 500;
  font-size: 17px;
  margin-top: 10px;
}
.article-cart .top::after{
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: transparent;
    background-image: linear-gradient(310deg, #64300099 59%, #0000003f 49%);
    border-radius:15px;
}
.read-more{
 color: rgba(165, 91, 42, 0.74);
 font-weight: bold;
}
.read-more:hover{
 color: rgba(165, 91, 42, 0.74);
}
.description{
  font-size: 14px;
  color:rgb(32, 32, 32);
  margin-top: 5px;
  text-align: justify;
}
.category-name{
  margin-top: 10px;
}
.category-name span{
  background-color:rgba(165, 91, 42, 0.74) ;
  color: #fff;
  font-size: 13px;
  border-radius: 10px;
  padding: 5px;
}




@media (min-width: 576px) {
    .container,.container-sm {
        max-width:540px
    }
}

@media (min-width: 768px) {
    .container,.container-md,.container-sm {
        max-width:1140px
    }
}

@media (min-width: 992px) {
    .container,.container-lg,.container-md,.container-sm {
        max-width:1140px !important
    }
}

@media (min-width: 1200px) {
    .container,.container-lg,.container-md,.container-sm,.container-xl {
        max-width:1140px
    }
}

@media (min-width: 1400px) {
    .container,.container-lg,.container-md,.container-sm,.container-xl,.container-xxl {
        max-width:1320px
    }
}
.spacee{
    margin-top:80px;
}
#articles-container {
  transition: none; /* حذف transition قدیمی */
  position: relative;
  overflow: hidden;
  min-height: 300px; /* ارتفاع ثابت برای جلوگیری از لرزش */
}



.page-item a{
    color: black;
}
.active>.page-link,
.page-link.active {
  z-index:3;
  color:#fff !important;
  background-color:rgba(165, 91, 42, 0.74) !important;
  border-color:rgba(165, 91, 42, 0.74) !important;
}
.page-link{
    border-radius:10px !important;
}
.btns-blog-wrapper {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch; 
}

.btns-blog {
  display: flex;
  justify-content: center;
  flex-wrap: nowrap; 
  gap: 12px;
  padding: 10px;
  min-width: max-content; 
}

.btns-blog-item {
  cursor: pointer;
  background-color: #fff;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
  border-radius: 10px;
  padding: 20px 15px;
  white-space: nowrap; 
  flex: 0 0 auto; 
  text-align: center;
}

.pagination button {
  padding: 5px 10px;
  cursor: pointer;
}

.pagination .btn-primary {
  background-color: rgba(165, 91, 42, 0.74) !important;
  color: white;
}

.pagination .btn-outline-primary {
  border: 1px solid rgba(165, 91, 42, 0.74) !important;;
  color: rgba(165, 91, 42, 0.74) !important;;
  background: transparent;
}