/* ============================================================
   GMA — هوية المتجر الكاملة (صفحة المنتج + التصنيفات + القوائم)
   تُلصق في: لوحة سلة ← تطبيق "الأكواد المخصصة" (CSS مخصص)
   تنطبق على كل صفحات المتجر تلقائيًا.
   اللوحة: صنوبري #1C3A33 · كتاني #E8E5DD · عسلي #B7995F
   ============================================================ */

/* ---------- 1) الخطوط (تحميل + فرض على كل الصفحات) ---------- */
@import url('https://fonts.googleapis.com/css2?family=El+Messiri:wght@500;600;700&family=IBM+Plex+Sans+Arabic:wght@300;400;500;600;700&family=IBM+Plex+Mono:wght@400;500&display=swap');

:root{
  --gma-pine:#1C3A33;
  --gma-pine2:#152C26;
  --gma-linen:#E8E5DD;
  --gma-card:#F5F2EB;
  --gma-honey:#B7995F;
  --gma-ink:#222B27;
  --gma-line:#CDC6B8;
  /* متغيّر اللون الأساسي في ثيم رائد (Tailwind) — قنوات RGB */
  --color-primary:28 58 51;
}

body, button, input, select, textarea,
.s-block, p, span, a, li, label, div {
  font-family:"IBM Plex Sans Arabic", system-ui, sans-serif;
}

/* العناوين بخط El Messiri */
h1, h2, h3, h4,
.product-title, .entry-title, .s-block-title,
.section-title, .product-entry-title, [class*="title"] {
  font-family:"El Messiri", serif !important;
}

/* الأسعار وأكواد المنتج بخط مونو */
.product-price, .s-price, salla-product-price, .total-price, .price {
  font-family:"IBM Plex Mono", monospace !important;
  letter-spacing:.01em;
}

/* ---------- 2) خلفية الصفحات الكتانية ---------- */
body, .s-block, main, .main-content, #app, .index, .page-content {
  background-color:var(--gma-linen);
}

/* ---------- 3) الأزرار: إضافة للسلة / اشترِ الآن → صنوبري ---------- */
.btn-primary, .btn--primary, button.btn-add-to-cart, .add-to-cart-btn,
salla-add-product-button, salla-button[type="button"], salla-button,
.s-button-element, .btn-buy-now, .quick-buy, [class*="add-to-cart"] button,
.product-form button[type="submit"] {
  background-color:var(--gma-pine) !important;
  border-color:var(--gma-pine) !important;
  color:var(--gma-linen) !important;
  border-radius:3px !important;
  font-family:"IBM Plex Sans Arabic" !important;
  font-weight:600 !important;
  transition:.25s ease !important;
}
.btn-primary:hover, .btn--primary:hover, salla-button:hover,
.s-button-element:hover, .product-form button[type="submit"]:hover {
  background-color:var(--gma-pine2) !important;
  border-color:var(--gma-pine2) !important;
}

/* زر "اشترِ الآن" الثانوي (مفرّغ) — لو كان للمتجر زر شراء مباشر منفصل */
.btn-outline, .btn--outline, .btn-secondary {
  background:transparent !important;
  border:1px solid var(--gma-pine) !important;
  color:var(--gma-pine) !important;
  border-radius:3px !important;
}
.btn-outline:hover, .btn--outline:hover, .btn-secondary:hover {
  background:var(--gma-pine) !important;
  color:var(--gma-linen) !important;
}

/* الروابط والعناصر التفاعلية باللون الصنوبري */
a:hover, .s-block a:hover { color:var(--gma-honey); }

/* ---------- 4) صفحة المنتج ---------- */
/* مسار التنقل */
.breadcrumb, .breadcrumbs, nav.breadcrumb {
  font-family:"IBM Plex Mono", monospace !important;
  font-size:11px; letter-spacing:.06em; color:#6C7068;
}
/* عنوان المنتج */
.product-title, h1.product-entry-title {
  color:var(--gma-pine) !important;
  font-weight:700 !important;
  letter-spacing:-.01em;
}
/* السعر الأساسي */
.product-price, salla-product-price .total-price, .product-entry .price {
  color:var(--gma-pine) !important;
  font-weight:500 !important;
}
/* السعر القديم مشطوب */
.is-discounted, .product-price del, .old-price, del {
  color:#6C7068 !important; text-decoration:line-through;
}
/* بطاقة الكمية */
.quantity, .s-quantity-input, .product-quantity {
  border:1px solid var(--gma-pine) !important; border-radius:3px !important;
}
/* اللون الواحد للمنتج — دائرة الخيار */
.product-options .color, .s-color-option, .option-color {
  box-shadow:0 0 0 1px rgba(0,0,0,.15) inset, 0 0 0 4px var(--gma-linen), 0 0 0 5px var(--gma-line);
}
/* شارات / وسوم */
.badge, .label-tag, .s-label, .product-label {
  background:var(--gma-honey) !important; color:#2a2410 !important;
  font-family:"IBM Plex Mono", monospace !important; border-radius:2px !important;
}

/* ---------- 5) صفحة قائمة المنتجات + التصنيفات ---------- */
/* عنوان التصنيف */
.category-title, .archive-title, .page-title, .section-header h2 {
  color:var(--gma-pine) !important; font-family:"El Messiri", serif !important;
}
/* بطاقات المنتج في الشبكة */
.product-entry, .s-product-card-entry, .product-card {
  background:var(--gma-card) !important;
  border:1px solid var(--gma-line) !important;
  border-radius:3px !important;
}
.product-entry .product-entry-title, .s-product-card-content-title {
  font-family:"El Messiri", serif !important; color:var(--gma-ink) !important;
}
/* شريط الفرز/الفلترة */
.filters, .sorting, .s-sort, .products-filter {
  border-color:var(--gma-line) !important;
}
.filter-chip, .sort-item, .s-filter-pill {
  border:1px solid var(--gma-line) !important; border-radius:30px !important;
  background:var(--gma-card) !important; color:var(--gma-ink) !important;
}
.filter-chip.active, .s-filter-pill.active {
  background:var(--gma-pine) !important; color:var(--gma-linen) !important;
}
/* زر "تحميل المزيد" / ترقيم الصفحات */
.load-more, .pagination .active, .s-pagination-item.active {
  background:var(--gma-pine) !important; color:var(--gma-linen) !important;
  border-color:var(--gma-pine) !important; border-radius:3px !important;
}

/* ---------- 6) الهيدر والفوتر (تناسق مع الصنوبري) ---------- */
/* الهيدر والفوتر عندهم وضع داكن مفعّل من إعدادات الثيم؛
   لو تبيهم صنوبري بالضبط بدّل القيم التالية: */
/*
header.s-header, .store-header { background-color:var(--gma-pine) !important; }
footer.s-footer, .store-footer { background-color:var(--gma-pine) !important; }
*/

/* ============================================================
   ملاحظة: بعض الأصناف (classes) قد تختلف بإصدار رائد.
   لو لقيت عنصر ما تأثّر، أرسل لي لقطة شاشة من الصفحة وأضبط المحدد بدقة.
   ============================================================ */