/* ================================================================
   يَرْوِي (YARWI) — Master Custom CSS v4.0 (مخصص لثيم رائد)
   المنصة: سلة
   ================================================================ */

/* ── 1. الخط الأساسي ── */
@import url('https://fonts.googleapis.com/css2?family=Tajawal:wght@300;400;500;700;800;900&display=swap');

:root {
  --y-blue:       #005C97;
  --y-blue-dark:  #004578;
  --y-blue-light: #E8F4FD;
  --y-accent:     #00AEEF;
  --y-white:      #FFFFFF;
  --y-text:       #1A2340;
  --y-red:        #E53E3E;
  --y-green:      #27AE60;
  --y-gold:       #F39C12;
  --y-radius:     12px;
  --y-shadow:     0 2px 12px rgba(0,92,151,0.06);
  --y-shadow-hover: 0 6px 20px rgba(0,92,151,0.12);
}

/* ── 2. تعديلات عامة بدون تعارض قوي ── */
body, h1, h2, h3, h4, h5, h6,
p, span, a, button, input, label,
.salla-product-card, .product-entry {
  font-family: 'Tajawal', sans-serif;
}

/* ── 3. تحسين شكل أزرار "إضافة للسلة" لثيم رائد ── */
.product-entry .salla-add-product-btn,
.product-page .salla-add-product-btn,
[data-action="add-to-cart"],
button.add-to-cart {
  background: var(--y-blue) !important;
  color: var(--y-white) !important;
  border: none;
  font-weight: 800;
  border-radius: 50px !important;
  box-shadow: 0 3px 10px rgba(0,92,151,0.2) !important;
  transition: all 0.25s ease;
}

.product-entry .salla-add-product-btn:hover,
.product-page .salla-add-product-btn:hover,
[data-action="add-to-cart"]:hover {
  background: var(--y-blue-dark) !important;
  transform: translateY(-2px);
  box-shadow: 0 5px 15px rgba(0,92,151,0.3) !important;
}

/* ── 4. جماليات كروت المنتجات ── */
.product-entry, .product-card, .salla-product-card {
  border-radius: var(--y-radius) !important;
  border: 1px solid rgba(0,92,151,0.05);
  box-shadow: var(--y-shadow);
  transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}

.product-entry:hover, .product-card:hover, .salla-product-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--y-shadow-hover);
  border-color: rgba(0,92,151,0.15);
}

.product-entry__title, .product-title, .product-name {
  font-weight: 700 !important;
  color: var(--y-text);
}

.product-price, .price-current {
  font-weight: 800 !important;
  color: var(--y-blue) !important;
}

/* ── 5. الهيدر وأيقونة السلة ── */
.site-header, .salla-header {
  box-shadow: 0 1px 10px rgba(0,92,151,0.05) !important;
}

.salla-header .cart-icon, .header-cart-icon {
  color: var(--y-blue) !important;
}

/* ── 6. زر الجوال الثابت ── */
@media (max-width: 768px) {
  .product-page .product-form .salla-add-product-btn,
  .product-single__actions .salla-add-product-btn {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    border-radius: 0 !important;
    padding: 16px !important;
    font-size: 1.1rem !important;
    z-index: 9990 !important;
    box-shadow: 0 -4px 18px rgba(0,92,151,0.15) !important;
    margin: 0 !important;
  }
  
  .product-page .product-form, .product-single__actions {
    padding-bottom: 70px !important;
  }
}

/* ── 7. إخفاء العناصر غير المرغوبة (تحديث بدون إخفاء سلة المشتريات) ── */
aside.sidebar-categories:not(.cart-drawer),
.related-searches {
  display: none !important;
}

/* ── 8. أنيميشن لظهور المنتجات بسلاسة ── */
@keyframes yarwi-fade-up {
  from { opacity: 0; transform: translateY(15px); }
  to   { opacity: 1; transform: translateY(0); }
}
.product-entry, .salla-product-card {
  animation: yarwi-fade-up 0.4s ease-out both;
}