/* شبّك بسيط فوق Bootstrap */

/* ============================
   Product Cards (ظل + ألوان زاهية)
   ============================ */

.product-card {
  border: 1px solid var(--glass-border) !important;
  border-radius: 20px !important;
  overflow: hidden;
  position: relative;
  background: var(--glass-bg);
  box-shadow: var(--shadow-md);
  transition: transform var(--transition-smooth), box-shadow var(--transition-smooth);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

.product-card:hover {
  transform: translateY(-5px);
  box-shadow: var(--shadow-xl);
}


.product-card .card-body {
  padding: clamp(.72rem, .3vw + .62rem, .95rem) clamp(.62rem, .28vw + .56rem, .9rem);
}

.product-title {
  font-weight: 800;
  font-size: clamp(.9rem, .2vw + .84rem, .98rem);
  color: var(--ink, #0f172a);
  line-height: 1.3;
  min-height: 2.7em;
}

/* صورة الكارت */
.product-img-wrap {
  overflow: hidden;
  background: #fff;
}

.product-img {
  height: clamp(136px, 20vw, 170px);
  width: 100%;
  object-fit: contain;
  background:
    radial-gradient(80% 60% at 50% 40%, rgba(0, 195, 137, .20), rgba(255, 255, 255, 0) 60%),
    radial-gradient(65% 50% at 80% 20%, rgba(14, 165, 233, .14), rgba(255, 255, 255, 0) 58%),
    linear-gradient(180deg, rgba(248, 250, 252, 1), rgba(255, 255, 255, 1));
  border-bottom: 1px solid var(--border);
  padding: 12px;
  transition: transform var(--transition-smooth);
}

.product-card:hover .product-img {
  transform: scale(1.08);
}


/* Favorite button */
.fav-btn {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 2;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  border: 0;
  background: rgba(255, 255, 255, .95);
  color: #233b52;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 8px 18px rgba(15, 23, 42, .16);
  transition: transform .16s ease, box-shadow .16s ease, color .16s ease;
  visibility: hidden;
}

body.favs-ready .fav-btn {
  visibility: visible;
}

.fav-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 12px 22px rgba(15, 23, 42, .18);
}

.fav-btn.is-fav {
  color: #e11d48;
}

/* Favorites filter */
.fav-hidden {
  display: none !important;
}

/* ثمن المنتج */
.product-card .text-success {
  color: var(--brand-2, #00a86b) !important;
}

/* زر الإضافة للسلة + زر الخيارات (نفس الشكل) */
.add-to-cart,
.add-to-cart.btn,
.add-to-cart.btn-warning,
.options-btn,
.options-btn.btn,
.options-btn.btn-warning,
.btn-add {
  border: 0 !important;
  border-radius: 14px !important;
  min-height: 44px;
  font-weight: 800;
  font-size: clamp(.86rem, .18vw + .82rem, .95rem);
  letter-spacing: .2px;
  background: linear-gradient(135deg, var(--brand-2, #00a86b), var(--brand-3, #0ea5e9)) !important;
  color: #ffffff !important;
  box-shadow: 0 10px 20px rgba(0, 168, 107, 0.2);
  transition: all var(--transition-fast);
  position: relative;
  overflow: hidden;
}

.add-to-cart::after,
.options-btn::after,
.btn-add::after {
  content: "";
  position: absolute;
  top: -50%;
  left: -60%;
  width: 20%;
  height: 200%;
  background: rgba(255, 255, 255, 0.2);
  transform: rotate(30deg);
  transition: none;
}

.add-to-cart:hover::after,
.options-btn:hover::after,
.btn-add:hover::after {
  left: 120%;
  transition: left 0.6s ease-in-out;
}

.add-to-cart:hover,
.options-btn:hover,
.btn-add:hover {
  transform: translateY(-2px);
  box-shadow: 0 15px 30px rgba(0, 168, 107, 0.3);
  filter: brightness(1.1);
}

.add-to-cart:active,
.options-btn:active,
.btn-add:active {
  transform: scale(0.96);
}


/* منع تغيير لون الزر فـ :focus (باش مايبانش "بلا ألوان" حتى تضغط) */
.add-to-cart:focus,
.options-btn:focus,
.btn-add:focus {
  outline: none;
  box-shadow: 0 14px 28px rgba(0, 168, 107, .22);
}

@media (pointer: coarse) {
  .fav-btn {
    width: 40px;
    height: 40px;
  }
}

@media (max-width: 360px) {
  .product-title {
    font-size: .88rem;
    min-height: 2.55em;
  }

  .add-to-cart,
  .options-btn,
  .btn-add {
    min-height: 42px;
    font-size: .84rem;
    padding-inline: .4rem;
  }
}

/* (ملاحظة) .product-img تعرّفت فوق مع خلفية جميلة */

/* شريط البحث (نسخة Bootstrap input-group) */
.search-wrap {
  display: block;
}


@media (min-width: 992px) {
  .search-wrap {
    display: none !important;
  }
}

/* لا نتائج */
#no-results {
  display: none;
}

#no-results.show {
  display: block;
}