/* Add custom CSS styles below */ 
/* اللون الأساسي */
:root {
  --color-primary: #00ff88;
  --color-primary-dark: #00cc6a;
  --color-secondary: #071a17;
  --color-bg: #050505;
}

/* الخلفية العامة */
body {
  background-color: #050505 !important;
  color: #ffffff !important;
}

/* الهيدر */
header, .header {
  background-color: #071a17 !important;
  border-bottom: 1px solid #00ff88;
}

/* الأزرار */
.btn-primary,
button,
.s-button-element {
  background: linear-gradient(135deg, #00ff88, #00cc6a) !important;
  border: none !important;
  color: #000 !important;
  border-radius: 10px !important;
  font-weight: bold;
}

/* تأثير hover */
.btn-primary:hover,
button:hover {
  box-shadow: 0 0 15px #00ff88 !important;
  transform: translateY(-2px);
}

/* الكروت */
.product,
.category,
.card {
  background: #071a17 !important;
  border-radius: 15px !important;
  border: 1px solid rgba(0,255,136,0.2) !important;
}

/* النصوص المهمة */
a, .link {
  color: #00ff88 !important;
}

/* الفوتر */
footer {
  background: #050505 !important;
  border-top: 1px solid #00ff88;
}

/* تغيير الخلفية بالكامل */
body,
html,
.main-content,
#app,
.app,
.salla-theme,
.container,
main {
    background: #050505 !important;
}

/* خلفية الأقسام */
section,
.s-block,
.content-wrapper {
    background: #050505 !important;
}

/* خلفية شبكة المنتجات */
.products-grid,
.categories-grid,
.product-list {
    background: #050505 !important;
}

/* الهيدر */
header,
.header {
    background: #071a17 !important;
}

/* الفوتر */
footer {
    background: #050505 !important;
}