@font-face {
  font-family: 'Vazirmatn-Medium';
  src: url('../font/Vazirmatn-Medium.woff2') format('woff2'),
       url('../fonts/MyCustomFont.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}
body
{
  font-family: 'Vazirmatn-Medium', sans-serif;
 
}

  body {
      font-family: 'Vazirmatn-Medium', sans-serif;
      /* background-color: #f8f9fa; */
      padding: 2rem;
      height: 100vh;
    }

    .scroll-menu-container {
      position: relative;
      display: flex;
      align-items: center;
    }

    .scroll-menu {
      display: flex;
      gap: 1rem;
      overflow-x: hidden;
      scroll-behavior: smooth;
      padding: 0.5rem;
      background-color: #fff;
      border-radius: 6px;
      box-shadow: 0 2px 6px rgba(0,0,0,0.1);
      width: 100%;
    }

    .menu-item {
      flex: 0 0 auto;
      min-width: 130px;
      text-align: center;
      background-color: #e9ecef;
      border-radius: 8px;
      padding: 0.5rem;
      cursor: pointer;
      transition: all .3s;
    }

    .menu-item:hover {
      background-color: #0d6efd;
      color: white;
      transform: translateY(-2px);
    }

    /* دکمه‌های پیمایش */
    .scroll-btn {
      background: none;
      border: none;
      font-size: 1.5rem;
      color: #0d6efd;
      cursor: pointer;
      transition: all .2s;
      padding: 0.5rem;
    }

    .scroll-btn:hover {
      color: #084298;
    }

    .scroll-btn:disabled {
      color: #ccc;
      cursor: default;
    }



     /* استایل سفارشی برای کارت‌ها */
    .product-card {
      height: 100%; /* برای اینکه همه کارت‌ها در یک ردیف هم‌ارتفاع باشند */
      display: flex;
      flex-direction: column;
      border: 1px solid #e0e0e0;
      transition: transform 0.3s, box-shadow 0.3s;
    }
    .product-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 10px 20px rgba(0,0,0,0.1);
    }
    .card-img-top {
      /* تنظیم ارتفاع ثابت برای تصاویر یا تنظیم بر اساس نسبت ابعاد */
      height: 180px; 
      object-fit: cover; /* حفظ نسبت ابعاد تصویر بدون بریدگی زیاد */
    }
    .card-body {
      flex-grow: 1; /* تضمین می‌کند که متن توضیحات فضای موجود را پر کند */
      display: flex;
      flex-direction: column;
    }
    .card-footer {
      /* اطمینان از اینکه قیمت و دکمه همیشه در پایین‌ترین قسمت هستند */
      padding-top: 0.75rem;
    }
    .price {
        font-size: 1.3rem;
        font-weight: bold;
        color: #dc3545; /* قرمز دیجی‌کالا */
    }
    .rating i {
        color: #ffc107; /* ستاره زرد */
    }
    .card-img-top {
      width: 100%;
      height: 200px; /* ارتفاع دلخواه برای عکس در همه دستگاه‌ها */
      object-fit: cover; /* تصویر را بدون کشیدگی پر می‌کند */
      object-position: top center; /* تمرکز تصویر را روی بالا/وسط تنظیم می‌کند */
  }

  
  .product-description {
    white-space: pre-line;
    line-height: 1.9;
    font-size: 15px;
    color: #444;
}

.fixed-title {
  height: 3em; /* ارتفاعی معادل دو خط استاندارد */
  line-height: 1.5em; /* ارتفاع هر خط */
  display: -webkit-box;
  -webkit-line-clamp: 2; /* حداکثر ۲ خط */
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis; /* اگر متن بیشتر از ۲ خط بود، با ... نمایش داده شود */
  margin-bottom: 0.5rem; /* کمی فاصله با آیتم پایینی */
}