@font-face {
    font-family: 'MyCustomFont';
    src: url('/font/dana\ medium.ttf') format('woff2'),
         url('/font/dana\ medium.ttf') format('truetype');

  }


  
  .product-image {
    width: 100%;
    height: 200px;
    object-fit: contain;
    padding: 8px;
  }
  
  
  .pill-small {
    font-size: 0.75rem;   /* کوچکتر از معمول */
    padding: 4px 10px;
    border-radius: 50px;
  }
  
/* تغییر رنگ دایره زمانی که انتخاب شده */
.custom-radio:checked {
    accent-color: #0d6efd; /* رنگ آبی یا هر رنگی */
  }
  
  /* تغییر استایل لیبل وقتی انتخاب شده */
  .custom-radio:checked + label {
    font-weight: bold;
    color: #0d6efd;
    background-color: #e7f1ff;
    padding: 4px 8px;
    border-radius: 12px;
  }
  
  .dropdown-menu.show {
    transform: translateY(0px) !important;
    top: 120% !important;
  }

  




  .nav-link.active {
    box-shadow: inset 0.313rem 0.188rem 0.255rem #55555c57, inset -0.153rem -0.188rem 0.1rem rgba(255, 255, 255, 0.651) !important;
    background-color: rgb(255 255 255 / 30%) !important;
  }
  
  body, html {
    overflow-y: auto !important;
  }
  

p , span{
    font-size: .9rem;
}

* {
 
    text-transform: capitalize !important;
    line-height: 1;
    text-align: justify;
    font-family: 'myCustomFont';
    color: #747474; /* طوسی روشن */
}

  
.navbar-nav .nav-item {
    margin-left: 15px;
    margin-right: 15px;
  }

  .btn{
    color: #747474; /* طوسی روشن */
  }
  form[role="search"] .form-control {
    color: #747474; /* طوسی روشن */
  }
.form-control::placeholder {
    color: #747474; /* طوسی روشن */
    opacity: 1; /* برای مرورگرهایی که مقدار پیش‌فرضش کمه */
  }
  
.navbar .navbar-nav .nav-link {
    color: #747474; /* طوسی روشن */
  }
  
  .navbar .navbar-nav .nav-link:hover {
    color: #747474; /* طوسی روشن */
  }
  
.bg {
    background-color: #d6d6e7;
}

.shadows {

    box-shadow: 0.213rem 0.188rem 0.325rem #90909eb7, -0.1rem -0.1rem 0.4rem#ececff !important;

}

a:hover {
    box-shadow: inset -0.313rem -0.188rem 0.255rem #55555c57, inset 0.153rem 0.188rem 0.1rem rgba(255, 255, 255, 0.651) !important;
    background-color: rgb(255 255 255 / 30%) !important;


}

a:focus {
    box-shadow: inset 0.313rem 0.188rem 0.255rem #55555c57, inset -0.153rem -0.188rem 0.1rem rgba(255, 255, 255, 0.651) !important;
    background-color: rgb(255 255 255 / 30%) !important;
}

.bg-pri {
    color: rgb(72, 87, 224) !important;
    background-color: #d6d6e7 !important;

}

.bg-primary {
    background-color: rgb(72, 87, 224) !important;
    padding: .7rem !important;
}

.sh {
    background-color: #d6d6e7 !important;
    box-shadow: inset 0.313rem 0.188rem 0.255rem #55555c57, inset -0.153rem -0.188rem 0.1rem rgba(255, 255, 255, 0.651) !important;
}

.form-control:focus {
    box-shadow: inset 0.313rem 0.188rem 0.255rem #55555c57, inset -0.153rem -0.188rem 0.1rem rgba(255, 255, 255, 0.651) !important;
    background-color: rgb(255 255 255 / 30%) !important;
    border: none !important;
}

.accordion-body {
    box-shadow: inset -0.313rem -0.188rem 0.255rem #55555c57, inset 0.153rem 0.188rem 0.1rem rgba(255, 255, 255, 0.651) !important;
    background-color: rgb(255 255 255 / 30%) !important;

}

.accordion-header {
    box-shadow: 0.213rem 0.188rem 0.325rem #90909eb7, -0.1rem -0.1rem 0.4rem#ececff !important;

}

.backcolorx {
    box-shadow: inset -0.313rem -0.188rem 0.255rem #55555c57, inset 0.153rem 0.188rem 0.1rem rgba(255, 255, 255, 0.651) !important;
    background-color: #d6d6e7 !important;
}

.backcolor {
    box-shadow: 0.213rem 0.188rem 0.225rem #90909eb7, -0.1rem -0.1rem 0.4rem#ececff !important;
    background-color: #d6d6e7 !important;
}

.backco {
    box-shadow: .213rem 0.188rem 0.225rem rgba(38, 47, 124, 0.479), .1rem -0.1rem 0.2rem rgba(32, 39, 102, 0.671), inset 0.188rem 0.125rem rgba(38, 47, 124, 0.479), inset .1rem -0.1rem 0.2rem rgba(32, 39, 102, 0.671) !important;
    background-color: rgb(72, 87, 224) !important;

}

.trt {

    filter: drop-shadow(1px 1px 1px #ffffff) !important;
}

.mov {
    animation: moving 2s infinite alternate-reverse;


}

@keyframes moving {
    from {
        transform: translateY(0px);

    }

    to {
        transform: translateY(30px);

    }

}
.carousel-indicators{
        bottom: -60px;
        color: white;
      
        
    }
  
    .dropdown-menu {
        position: absolute !important;
        top: 160% !important;
        right: 0 !important; /* 👈 از راست باز شود */
        left: auto !important; /* غیر فعال‌سازی چپ */
        margin-top: 0 !important;
        border: none;
        padding: 0.5rem;
        border-radius: 0.75rem;
  
        z-index: 1000;
        direction: rtl; /* 👈 جهت متن آیتم‌ها هم راست به چپ بشه */
        text-align: right;
      }
      
      .dropdown-menu .dropdown-item {
        color: #747474; /* طوسی روشن */
     display: block;
     margin-top: 0.7rem !important;
     margin-bottom: 0.7rem !important;
      }  