/* Add custom CSS styles below */ 
.s-search-input::placeholder {
    color: #ffffff !important; /* أبيض */
}

.s-search-input:focus::placeholder {
    color: #ffffff !important; /* أبيض عند التركيز */
}

#app > div.app-inner.flex.flex-col.min-h-full > header > div.top-navbar > div > div > div.header-search.flex-1 > salla-search > div > div > div.s-search-input-wrapper > span > span > svg path {
    fill: #ffffff !important; /* أبيض */
}

/* تغيير لون خلفية الشريط العلوي */
.top-navbar {
    background-color: #F47A42 !important; /* لون الخلفية للشريط العلوي */
    color: #ffffff !important; /* أبيض للنص */
}

/* تغيير لون النص لجميع العناصر داخل الشريط العلوي */
.top-navbar,
.top-navbar * {
    color: #ffffff !important; /* أبيض للنص */
}

/* تغيير لون خلفية الشريط الثاني */
.inner.bg-inherit {
    background-color: #3C9130 !important; /* لون الخلفية للشريط الثاني */
    color: #ffffff !important; /* أبيض للنص */
}

/* تغيير لون النص لجميع العناصر داخل الشريط الثاني */
.inner.bg-inherit,
.inner.bg-inherit * {
    color: #ffffff !important; /* أبيض للنص */
}

/* استهدف العنصر الذي يحتوي على الشعار */
.navbar-brand {
    transform: scale(1.2) !important; /* تكبير بنسبة 50% */
}