/* =========================================================
   عصر الريادة - كود تحسين شامل للمتجر
   ألوان كحلي + نصوص واضحة + أزرار واضحة + فوتر واضح
========================================================= */

/* ===== 1) ألوان عامة ===== */
:root {
  --primary-color: #151742;
  --primary-dark: #000b19;
  --primary-light: #1d2260;
  --text-light: #ffffff;
  --text-dark: #111111;
  --bg-light: #ffffff;
  --border-light: #e8e8e8;
}

/* ===== 2) إعدادات عامة ===== */
body,
html {
  background: var(--bg-light) !important;
  color: var(--text-dark) !important;
}

* {
  box-sizing: border-box;
}

/* ===== 3) الهيدر العلوي ===== */
header,
.main-header,
.s-header,
.top-navbar,
.navbar {
  background: #ffffff !important;
}

header *,
.main-header *,
.s-header *,
.top-navbar *,
.navbar * {
  color: var(--text-dark) !important;
}

/* الأيقونات الدائرية في الأعلى */
.header-btn,
.s-header .btn,
.s-header .icon-btn,
.top-navbar .btn {
  background: var(--primary-color) !important;
  color: #ffffff !important;
  border-radius: 50% !important;
}

.header-btn svg,
.s-header .btn svg,
.s-header .icon-btn svg,
.top-navbar .btn svg {
  fill: #ffffff !important;
  stroke: #ffffff !important;
}

/* ===== 4) شريط التنبيه / الخصم ===== */
.s-alert,
.s-announcement-bar,
.announcement-bar,
.top-notice,
.notice-bar {
  background: var(--primary-dark) !important;
  color: #ffffff !important;
}

.s-alert *,
.s-announcement-bar *,
.announcement-bar *,
.top-notice *,
.notice-bar * {
  color: #ffffff !important;
}

/* ===== 5) العناوين العامة ===== */
h1, h2, h3, h4, h5, h6,
.section-title,
.section--title,
.title {
  color: var(--text-dark) !important;
}

/* ===== 6) الأقسام والخلفيات ===== */
section,
.main-content,
.s-block,
.container,
.content-area {
  background-color: transparent !important;
}

/* ===== 7) بطاقات المنتجات ===== */
.s-product-card,
.product-card,
.product-entry,
.product-block,
.card {
  background: var(--primary-color) !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  border-radius: 16px !important;
  overflow: hidden !important;
  box-shadow: 0 6px 18px rgba(0,0,0,0.10) !important;
}

/* كل النصوص داخل بطاقات المنتجات */
.s-product-card *,
.product-card *,
.product-entry *,
.product-block *,
.card * {
  color: #ffffff !important;
}

/* عنوان المنتج */
.s-product-card__title,
.s-product-card__title a,
.product-title,
.entry-title,
.card-title {
  color: #ffffff !important;
  font-weight: 700 !important;
}

/* السعر */
.s-product-card-price,
.s-product-card__price,
.price,
.money,
.price-wrapper,
.s-price {
  color: #ffffff !important;
  font-weight: 700 !important;
}

/* السعر قبل الخصم */
.s-product-card .price--before,
.s-product-card del,
.price del,
.old-price {
  color: rgba(255,255,255,0.75) !important;
}

/* الصور داخل البطاقة */
.s-product-card img,
.product-card img,
.card img {
  border-radius: 12px !important;
}

/* إزالة الطبقات السوداء أو الشفافية المسببة للاختفاء */
.s-product-card::before,
.s-product-card::after,
.product-card::before,
.product-card::after,
.card::before,
.card::after {
  display: none !important;
  opacity: 0 !important;
}

/* ===== 8) أزرار إضافة للسلة والأزرار العامة ===== */
button,
.btn,
a.btn,
.s-button-element,
.s-product-card .btn,
.s-product-card button,
.s-product-card-btn,
.btn--primary {
  background: var(--primary-dark) !important;
  color: #ffffff !important;
  border: 1px solid var(--primary-dark) !important;
  border-radius: 14px !important;
  font-weight: 700 !important;
}

button *,
.btn *,
a.btn *,
.s-button-element *,
.s-product-card .btn *,
.s-product-card button *,
.s-product-card-btn *,
.btn--primary * {
  color: #ffffff !important;
}

button svg,
.btn svg,
a.btn svg,
.s-button-element svg,
.s-product-card .btn svg,
.s-product-card button svg,
.s-product-card-btn svg,
.btn--primary svg {
  fill: #ffffff !important;
  stroke: #ffffff !important;
}

/* Hover */
button:hover,
.btn:hover,
a.btn:hover,
.s-button-element:hover,
.s-product-card .btn:hover,
.s-product-card button:hover,
.s-product-card-btn:hover,
.btn--primary:hover {
  background: var(--primary-light) !important;
  border-color: var(--primary-light) !important;
  color: #ffffff !important;
}

/* ===== 9) بطاقات الماركات / التصنيفات / المربعات ===== */
[class*="brand"],
[class*="category"],
[class*="feature"],
[class*="item-box"],
[class*="box-item"] {
  background: var(--primary-color) !important;
  border-radius: 14px !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
}

[class*="brand"] *,
[class*="category"] *,
[class*="feature"] *,
[class*="item-box"] *,
[class*="box-item"] * {
  color: #ffffff !important;
  opacity: 1 !important;
  visibility: visible !important;
}

/* ===== 10) السلايدر والنقاط ===== */
.s-slider-block,
.swiper,
.s-swiper-container {
  background: transparent !important;
}

.swiper-pagination-bullet {
  background: #cfcfd6 !important;
  opacity: 1 !important;
}

.swiper-pagination-bullet-active {
  background: var(--primary-color) !important;
}

/* ===== 11) صفحات داخلية / صناديق عامة ===== */
.panel,
.box,
.widget,
.sidebar-box,
.info-box,
.content-box {
  background: #ffffff !important;
  color: var(--text-dark) !important;
  border: 1px solid var(--border-light) !important;
  border-radius: 14px !important;
}

.panel *,
.box *,
.widget *,
.sidebar-box *,
.info-box *,
.content-box * {
  color: var(--text-dark) !important;
}

/* ===== 12) الحقول والنماذج ===== */
input,
textarea,
select {
  background: #ffffff !important;
  color: #111111 !important;
  border: 1px solid #d8d8d8 !important;
  border-radius: 10px !important;
}

input::placeholder,
textarea::placeholder {
  color: #666666 !important;
}

/* ===== 13) الروابط ===== */
a {
  color: var(--primary-color);
}

a:hover {
  color: var(--primary-light);
}

/* ===== 14) الفوتر ===== */
footer,
.s-footer,
.site-footer,
.footer,
.s-footer__content,
.s-footer__container {
  background: var(--primary-dark) !important;
  color: #ffffff !important;
}

/* كل ما داخل الفوتر */
footer *,
.s-footer *,
.site-footer *,
.footer *,
.s-footer__content *,
.s-footer__container * {
  color: #ffffff !important;
  opacity: 1 !important;
  visibility: visible !important;
}

/* روابط الفوتر */
footer a,
.s-footer a,
.site-footer a,
.footer a {
  color: #ffffff !important;
}

/* الأيقونات داخل الفوتر */
footer svg,
footer i,
.s-footer svg,
.s-footer i,
.site-footer svg,
.site-footer i,
.footer svg,
.footer i {
  fill: #ffffff !important;
  stroke: #ffffff !important;
  color: #ffffff !important;
}

/* إزالة طبقات تعتيم الفوتر */
footer::before,
footer::after,
.s-footer::before,
.s-footer::after,
.site-footer::before,
.site-footer::after,
.footer::before,
.footer::after {
  display: none !important;
  opacity: 0 !important;
}

/* ===== 15) واتساب / الدردشة / الزر العائم ===== */
[class*="whatsapp"],
[class*="chat"],
[class*="floating"] {
  opacity: 1 !important;
}

/* ===== 16) الجداول إن وجدت ===== */
table {
  background: #ffffff !important;
  color: #111111 !important;
  border-collapse: collapse !important;
}

table th,
table td {
  color: #111111 !important;
  border: 1px solid #e5e5e5 !important;
}

/* ===== 17) تحسين عام لظهور النصوص السوداء المختفية ===== */
[style*="color: black"],
[style*="color:#000"],
[style*="color: #000"] {
  color: inherit !important;
}

/* ===== 18) تحسين الجوال ===== */
@media (max-width: 768px) {
  .s-product-card,
  .product-card,
  .product-entry,
  .product-block,
  .card {
    border-radius: 14px !important;
  }

  button,
  .btn,
  a.btn,
  .s-button-element,
  .s-product-card .btn,
  .s-product-card button,
  .s-product-card-btn,
  .btn--primary {
    border-radius: 12px !important;
    font-size: 15px !important;
  }

  h1, h2, h3 {
    line-height: 1.4 !important;
  }
}
/* ===== القائمة الجانبية للأقسام ===== */

/* خلفية القائمة الجانبية */
.s-side-menu,
.s-menu-sidebar,
.sidebar-menu,
.menu-sidebar,
[class*="side-menu"],
[class*="sidebar"] {
  background: #151742 !important;
}

/* كل النصوص داخل القائمة */
.s-side-menu *,
.s-menu-sidebar *,
.sidebar-menu *,
.menu-sidebar *,
[class*="side-menu"] *,
[class*="sidebar"] * {
  color: #ffffff !important;
  opacity: 1 !important;
  visibility: visible !important;
}

/* روابط الأقسام */
.s-side-menu a,
.s-menu-sidebar a,
.sidebar-menu a,
.menu-sidebar a,
[class*="side-menu"] a,
[class*="sidebar"] a {
  color: #ffffff !important;
}

/* عناوين الأقسام */
.s-side-menu .menu-item,
.s-side-menu .item,
.s-menu-sidebar .menu-item,
.sidebar-menu .menu-item,
.menu-sidebar .menu-item,
[class*="side-menu"] .menu-item,
[class*="sidebar"] .menu-item {
  color: #ffffff !important;
  background: transparent !important;
  border-bottom: 1px solid rgba(255,255,255,0.08) !important;
}

/* الأيقونات داخل القائمة */
.s-side-menu svg,
.s-side-menu i,
.s-menu-sidebar svg,
.s-menu-sidebar i,
.sidebar-menu svg,
.sidebar-menu i,
.menu-sidebar svg,
.menu-sidebar i,
[class*="side-menu"] svg,
[class*="side-menu"] i,
[class*="sidebar"] svg,
[class*="sidebar"] i {
  fill: #ffffff !important;
  stroke: #ffffff !important;
  color: #ffffff !important;
}

/* السهم أو علامة فتح القسم */
.s-side-menu .arrow,
.s-side-menu .icon-arrow,
.s-menu-sidebar .arrow,
.sidebar-menu .arrow,
.menu-sidebar .arrow,
[class*="side-menu"] .arrow,
[class*="sidebar"] .arrow {
  color: #ffffff !important;
}

/* عند المرور */
.s-side-menu a:hover,
.s-menu-sidebar a:hover,
.sidebar-menu a:hover,
.menu-sidebar a:hover,
[class*="side-menu"] a:hover,
[class*="sidebar"] a:hover {
  background: #1d2260 !important;
  color: #ffffff !important;
}

/* إزالة أي طبقة تغطي النص */
.s-side-menu::before,
.s-side-menu::after,
.s-menu-sidebar::before,
.s-menu-sidebar::after,
.sidebar-menu::before,
.sidebar-menu::after,
.menu-sidebar::before,
.menu-sidebar::after,
[class*="side-menu"]::before,
[class*="side-menu"]::after,
[class*="sidebar"]::before,
[class*="sidebar"]::after {
  display: none !important;
  opacity: 0 !important;
}
/* حل أقوى لأسماء الأقسام داخل القائمة */
ul li a,
ul li span,
ul li button,
nav li a,
nav li span,
nav li button {
  color: #ffffff !important;
}