/* ===================================================
   ALBANAFSJ FINAL PREMIUM THEME
=================================================== */

/* الخط السعودي الحديث */

@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Arabic:wght@300;400;500;600;700&display=swap');

:root{
  --main:#ad74c3;
  --main-light:#c084d4;
  --dark:#111827;
  --text:#4b5563;
  --border:#f3ebf7;
  --bg:#fcfcfd;
}

/* =========================
   الخط العام
========================= */

body,
button,
input,
textarea,
select,
a,
span,
p,
h1,
h2,
h3,
h4,
h5,
h6{

  font-family:
  'IBM Plex Sans Arabic',
  sans-serif !important;
}

/* الخلفية */

body{
  background:var(--bg);
  color:var(--text);
  overflow-x:hidden;
  line-height:1.7;
}

/* =========================
   الهيدر
========================= */

header{

  background:#fff !important;

  border-bottom:1px solid var(--border);

  box-shadow:0 2px 10px rgba(0,0,0,.03);

  backdrop-filter:blur(10px);
}

/* =========================
   البنرات
========================= */

.s-slider-block,
.main-slider{

  border-radius:22px !important;

  overflow:hidden;

  box-shadow:
  0 10px 28px rgba(173,116,195,.08);
}

/* =========================
   بطاقات المنتجات
========================= */

.s-product-item,
.product{

  background:#fff;

  border-radius:20px !important;

  border:1px solid var(--border);

  transition:.3s ease;

  overflow:hidden;

  box-shadow:
  0 4px 14px rgba(173,116,195,.04);
}

/* Hover */

.s-product-item:hover,
.product:hover{

  transform:translateY(-4px);

  box-shadow:
  0 12px 28px rgba(173,116,195,.12);
}

/* =========================
   الصور
========================= */

.s-product-item img,
.product img{

  transition:.4s ease;
}

.s-product-item:hover img,
.product:hover img{

  transform:scale(1.03);
}

/* =========================
   اسم المنتج
========================= */

.s-product-name,
.product-title{

  font-weight:700 !important;

  color:var(--dark) !important;

  line-height:1.7;
}

/* =========================
   السعر
========================= */

.s-product-price,
.price{

  color:var(--main) !important;

  font-weight:800 !important;

  font-size:20px !important;
}

/* =========================
   الأزرار
========================= */
```css
/* =========================
   PREMIUM BUTTONS
========================= */

button,
.btn,
.btn-primary,
.s-button-element{

  background:
  linear-gradient
(
    135deg,
    #c89ad8,
    #ad74c3
  ) !important;

  color:#fff !important;

  border:none !important;

  border-radius:14px !important;

  font-weight:700 !important;

  padding:12px 20px !important;

  transition:
  transform .25s ease,
  box-shadow .25s ease,
  opacity .25s ease,
  background .25s ease;

  box-shadow:
  0 8px 20px rgba(173,116,195,.14);

}

/* Hover */

button:hover,
.btn:hover,
.btn-primary:hover,
.s-button-element:hover{

  transform:translateY(-2px);

  background:
  linear-gradient(
    135deg,
    #c084d4,
    #a96abd
  ) !important;

  box-shadow:
  0 12px 26px rgba(173,116,195,.20);

  opacity:.98;
}

/* الضغط */

button:active,
.btn:active,
.btn-primary:active,
.s-button-element:active{

  transform:scale(.98);
}

/* أزرار المنتجات */

.s-product-item .btn,
.s-product-item button{

  width:88%;

  margin:14px auto;

  display:block;
}
```

/* =========================
   الحقول
========================= */

input,
textarea,
select{

  border-radius:12px !important;

  border:1px solid #e5e7eb !important;
}

/* =========================
   الفوتر
========================= */

footer{

  background:#fff !important;

  border-top:1px solid var(--border);
}

/* =========================
   السكرول بار
========================= */

::-webkit-scrollbar{

  width:10px;
}

::-webkit-scrollbar-thumb{

  background:
  linear-gradient(
    180deg,
    var(--main),
    var(--main-light)
  );

  border-radius:20px;
}

/* =========================
   الجوال
========================= */

@media(max-width:768px){

  .s-product-item,
  .product{

    border-radius:16px !important;
  }

  .s-slider-block,
  .main-slider{

    border-radius:18px !important;
  }

}