/* Add custom CSS styles below */ 

/* تصميم الكرت */
.olla-card {
  border: 1px solid #ddd;             /* حدود خفيفة رمادية */
  border-radius: 10px;                /* زوايا دائرية */
  padding: 8px;                       /* مسافة داخلية */
  background: #fff;                   /* خلفية بيضاء */
  box-shadow: 0 2px 6px rgba(0,0,0,0.08); 
  overflow: hidden;                   /* يمنع خروج المحتوى */
  transition: transform 0.3s ease, 
              box-shadow 0.3s ease;   /* حركات سلسة عند الهوفر */
}

/* عند تمرير الماوس */
.olla-card:hover {
  transform: translateY(-5px);        /* يرتفع الكرت شوي */
  box-shadow: 0 6px 16px rgba(0,0,0,0.15);
}

/* الصور داخل الكرت */
.olla-card img {
  aspect-ratio: 1/1 !important;       /* مربع يناسب المعدات والدريلات */
  width: 100%;                        /* العرض كامل */
  height: auto;
  object-fit: contain;                /* يحافظ على شكل المنتج */
  display: block;
  border-radius: 8px;                 /* حواف ناعمة للصورة */
  transition: transform 0.3s ease;    /* حركة تكبير ناعمة */
  background: #f9f9f9;                /* خلفية فاتحة للصورة */
  padding: 10px;                      /* فراغ حول المنتج */
}

/* تكبير الصورة عند الهوفر */
.olla-card:hover img {
  transform: scale(1.08);
}