.datis-certificate-gallery-rtl { direction: rtl; }
.datis-certificate-gallery-ltr { direction: ltr; }

.datis-certificate-gallery{
  width: 100%;
  max-width: 1200px;
  margin-inline: auto;

  /* defaults for new vars (اگر کنترل چیزی نده) */
  --datis-thumb-per-row: 2;
  --datis-thumb-gap: 16px;
}

.datis-certificate-gallery-inner{
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  flex-direction: row-reverse;
  gap: 32px;
}

.datis-certificate-sidebar{
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.datis-certificate-sidebar-top{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  margin-bottom: 18px;
}

.datis-certificate-slider-dots{
  display: flex;
  align-items: center;
  gap: 0px;
}

.datis-certificate-slider-dots .swiper-pagination-bullet{
  box-sizing: border-box;
  width: 12px;
  height: 12px;
  border: 1px solid rgba(9, 6, 37, 1);
  border-radius: 999px;
  background: transparent;
}

.datis-certificate-slider-dots .swiper-pagination-bullet-active{
  width: 12px;
  height: 12px;
  background: #ff5f06;
  border: 1px solid #ff5f06;
}

.datis-certificate-thumbs-list{
  display: flex;
  flex-wrap: wrap;
  gap: var(--datis-thumb-gap);
}

/* ✅ محاسبه درست با gap */
.datis-certificate-thumb-item{
  flex: 0 0 calc((100% - ( (var(--datis-thumb-per-row) - 1) * var(--datis-thumb-gap) )) / var(--datis-thumb-per-row));
  border: none;
  padding: 0;
  background: transparent;
  cursor: pointer;
}

.datis-certificate-thumb-item.is-hidden{ display:none; }

.datis-certificate-thumb-image{
  display:block;
  overflow:hidden;
  border-radius:18px;
}

.datis-certificate-thumb-image img{
  display:block;
  width:100% !important;
  height:auto;
  object-fit:cover !important;
}



.datis-certificate-main-column{
  flex: 1 1 auto;
  min-width: 0;
}

.datis-certificate-slider{
  border-radius:32px;
  overflow:hidden;
  background:#f8f7ff;
}

.datis-certificate-slider-wrapper{
  display:flex;
  align-items:center;
}

.datis-certificate-slider-slide{
  display:flex;
  justify-content:center;
}

.datis-certificate-slide-button{
  border:none;
  padding:0;
  margin:0;
  background:transparent;
  cursor: zoom-in;
  width: 100%;
  display:block;
}

.datis-certificate-slide-button img{
  display:block;
  width:100%;
  height:auto; /* ✅ مهم: height:100vh حذف شد */
  object-fit: cover;
  max-height: 430px;
  border-radius : 32px;
}

/* Navigation arrows */
.datis-certificate-slider-arrow{
  border:none;
  background:transparent;
  padding:0;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

.datis-certificate-arrow-icon{ display:block; }

.datis-certificate-arrow-icon-next{
  transform: rotate(180deg);
  transform-origin: center;
}

.datis-certificate-slider-arrow-next,
.datis-certificate-slider-arrow-prev{
  position:relative;
  z-index:0;
}

.architecture-demo .datis-certificate-slider-arrow-next:hover::before,
.architecture-demo .datis-certificate-slider-arrow-prev:hover::before,
.architecture-demo .datis-certificate-slider-arrow-prev::before{
  content:'';
  position:absolute;
  width:20px;
  height:9px;
  border-radius:1000px;
  background: var(--datis-primary-color);
  z-index:-1;
  top:2px;
  right:4px;
  transition: all 300ms;
}

.architecture-demo .datis-certificate-slider-arrow-next:hover::before{
  right:unset;
  left:4px;
}

.datis-certificate-sidebar {
    flex: 0 0 50%;
    max-width: 50%;
}


.datis-certificate-main-column {
    flex: 0 0 50%;
}

.datis-certificate-slider {
    overflow-x: clip !important;
    overflow-y: visible !important;
}


/* =======================
   ✅ Mobile Fix
   thumbs زیر تصویر بزرگ
======================= */
@media (max-width: 768px){

  .datis-certificate-gallery-inner{
    flex-direction: column; /* ✅ نه column-reverse */
    gap: 24px;
  }

  /* main بالا */
  .datis-certificate-main-column{
    order: 1;
  }

  /* sidebar پایین */
  .datis-certificate-sidebar{
    order: 2;
    flex-direction: column-reverse;
  }

  .datis-certificate-thumbs-list{
    flex-wrap: nowrap;
    justify-content: center;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 6px;
    scrollbar-width: none;
  }

  /* موبایل: 3 تا در ردیف (همون رفتار قبلیت) */
  .datis-certificate-thumb-item{
    flex: 0 0 calc(33.333% - 8px);
  }


  /* حتی اگر hideActive فعال بود، روی موبایل نمایش بده */
  .datis-certificate-thumb-item.is-hidden{
    display:inline-flex;
  }

  .datis-certificate-sidebar-top{
    margin-bottom: unset;
    margin-top: 16px;
  }
}



