/* Add custom CSS styles below */ 
@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@200..1000&display=swap');

/* تطبيق الخط على كل النصوص مع استثناء الأيقونات */
body,
body *:not([class*="sicon"]):not(i):not(.icon):not(.fa):not(svg) {
    font-family: 'Cairo', sans-serif !important;
}

/* استثناء pseudo-elements للأيقونات */
body *:not([class*="sicon"]):not(i):not(.icon):not(.fa):not(svg)::before,
body *:not([class*="sicon"]):not(i):not(.icon):not(.fa):not(svg)::after {
    font-family:sallaicons !important;
}

@media (min-width: 1025px) {
    section.section[data-type="banner"]:first-of-type {
        margin-top: -1.5rem !important;
    }
}


/* ==============================
   3- إعدادات اللازي لود (Lazy Loading)
============================== */
.lazy__bg.lazy.entered.loaded {
    background-size: contain;      /* ملاءمة الخلفية بدون قص */
    background-repeat: no-repeat;  /* منع التكرار */
}


/* ==============================
   4- إعدادات الصور والبنرات
============================== */
a.banner-entry.square-photos {
    background: transparent; /* خلفية شفافة */
}

.banner-entry {
    transition:
        transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94),       /* حركة تكبير/تصغير */
        background-size 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94), /* انتقال حجم الخلفية */
        background-position 0.6s ease;                             /* انتقال موضع الخلفية */
}

.banner-entry:hover {
    transform: scale(1.05) translateY(-10px); /* تكبير وتحريك لأعلى عند الهوفر */
}

img {
    background: transparent !important; /* إزالة خلفية الصور */
    border-radius: 0;                   /* إزالة الزوايا الدائرية */
}




section.s-block.s-block--fixed-banner.wide-placeholder:first-of-type {
    margin-top: 0;
}
/* =============================
   صف واحد لكل العناصر في category-grid
============================= */
.category-grid {
    display: flex;          /* تحويل الشبكة إلى صف */
    flex-wrap: nowrap;      /* كل العناصر في صف واحد بدون انكسار */
    gap: 1rem;              /* مسافة بين العناصر */
    overflow-x: auto;       /* يسمح بالتمرير الأفقي لو ما ظهرش كله */
    justify-content: space-between;
  padding-bottom: 0.5rem; /* مساحة تحت للتمرير */
}

.category-grid > div {
    flex: 0 0 auto;         /* كل عنصر يحتل حجمه الطبيعي بدون تمدد */
    width: 200px;            /* تحدد عرض موحد لكل عنصر */
}

/* الصور داخل كل عنصر */
.category-featured img.cat-featured-img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 8px;     /* شكل حلو للصور */
    object-fit: cover;
}

/* ميديا كويري للشاشات الصغيرة */
@media (max-width: 768px) {
    .category-grid > div {
        width: 100px !important; /* تصغير حجم العناصر على الموبايل */
    }
  section.section[data-type="banner"]:first-of-type {
        margin-top: -2rem !important;
    }
}

.salla-theme_6 .category-grid>div:first-child .category-featured {
        height: 210px;
    }

body .category-featured a {
    background-size: contain;
}