.w-12 {
    width: 68px;
    height: 68px;
}
.text-foreground {
    color: #ffffff;
}
/* =========================================
   1. تخصيص ألوان الفوتر (الجزء السفلي)
========================================= */

/* جعل جميع نصوص الفوتر والروابط والتفاصيل باللون الأبيض */
footer .text-foreground,
footer p,
footer a,
footer span,
footer .text-muted,
footer .text-xs {
    color: #ffffff !important;
}

/* تخصيص عناوين الفوتر (روابط مفيدة، تواصل معنا، تابعنا) باللون الذهبي وخط عريض */
footer h3.text-foreground {
    color: #c9a96f !important;
    font-weight: 700 !important; /* لجعل الخط عريض Bold */
}

/* =========================================
   2. تخصيص عناوين الأقسام الرئيسية والمنتجات
========================================= */

/* جعل عناوين الأقسام (المنتجات الرقمية، باقات الخدمات، الخ) باللون الأزرق الغامق */
section h2.text-foreground {
    color: #1a2b4c !important; /* يمكنك استبدال هذا الكود بدرجة لون شعار العجوة بالضبط */
}

/* جعل نصوص وأسعار المنتجات داخل البطاقات باللون الأزرق الغامق */
.products-embla__slide .text-foreground,
.products-embla__slide h3 a,
.products-embla__slide .text-muted {
    color: #1a2b4c !important;
}

/* إبقاء سعر الخصم (المشطوب) بلونه الأحمر أو الرمادي الافتراضي حتى لا يتأثر */
.products-embla__slide .line-through {
    color: #ef4444 !important; 
}
.qty-input-field {
    height: 100%;
    min-width: calc(var(--spacing) * 12);
    text-align: center;
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: #1a2b4c;
    --tw-outline-style: none;
    font-size: var(--font-body2--size);
    line-height: var(--font-body2--line-height);
    -moz-appearance: textfield;
    background-color: hsl(0, 0%, 93%);
    outline-style: none;
    flex-shrink: 0;
}
/* =========================================
   تخصيص ألوان صفحة المنتج (العنوان والتبويبات)
========================================= */

/* 1. تغيير لون شريط التبويبات (Breadcrumbs) والروابط والأسهم داخله */
nav[aria-label="breadcrumb"] ol,
nav[aria-label="breadcrumb"] a,
nav[aria-label="breadcrumb"] span,
nav[aria-label="breadcrumb"] svg {
    color: #1a365d !important;
}

/* 2. تغيير لون عنوان المنتج الرئيسي في صفحة المنتج */
#product-main-section #header h1.text-foreground {
    color: #1a365d !important;
}
.bg-background, .bg-background\/10 {
    background-color: #1a365d !important;
}
/* =========================================
   تقليل المسافة بين قسم التصنيفات وقسم الجلسات
========================================= */

/* إزالة المسافة السفلية لقسم التصنيفات (حدد مسارك) */
section[section-id="eae8436b-5953-409e-a3ca-7e2e0944ee8c"] {
    padding-bottom: 0px !important;
}

/* تقليل المسافة العلوية لقسم الجلسات الاستشارية (ترك مسافة تنفس بسيطة) */
section[section-id="e1fe4234-8243-4519-ac55-6cfc4a746b31"] {
    padding-top: 24px !important; 
}

/* إخفاء شريط التمرير الفارغ (النقاط/الأسهم المخفية) أسفل قسم التصنيفات لأنه يأخذ مساحة فارغة */
section[section-id="eae8436b-5953-409e-a3ca-7e2e0944ee8c"] .theme-container > .flex.items-center.gap-2 {
    display: none !important;
}