/* Add custom CSS styles below */ 
/* تغيير لون خلفية الهيدر بالكامل */
header.store-header {
    background-color: #d4b28c !important;
}

/* التأكد من أن الحاوية الداخلية للهيدر تأخذ نفس اللون */
.store-header #mainnav {
    background-color: transparent !important;
}


/* تغيير خلفية الموقع بالكامل */
body#app {
    background-color: #f9f4ef !important; /* درجة فاتحة جداً تليق مع لون اللوجو */
}

/* التأكد من أن الحاويات الداخلية شفافة لتظهر الخلفية */
.app-inner {
    background-color: transparent !important;
}

/* تغيير لون خلفية الفوتر بالكامل */
.store-footer {
    background-color: #d4b28c !important; /* نفس لون الهيدر واللوجو */
}

/* تعديل خلفية الجزء الداخلي للفوتر */
.store-footer .store-footer__inner {
    background-color: transparent !important;
    border: none !important; /* إزالة أي حدود أو فواصل */
}

/* تغيير لون نصوص الفوتر للأبيض عشان تظهر بوضوح على الخلفية الجديدة */
.store-footer, 
.store-footer p, 
.store-footer h1, 
.store-footer h2, 
.store-footer h3, 
.store-footer h4, 
.store-footer a, 
.store-footer span {
    color: #ffffff !important;
}


/* إخفاء النص القديم لإظهار اللوجو مكانه */
.store-footer__inner .grid > div:nth-of-type(1) > a h3 {
    display: none !important;
}

/* إضافة اللوجو الجديد في الفوتر */
.store-footer__inner .grid > div:nth-of-type(1) > a::after {
    content: "";
    background-image: url("	https://cdn.files.salla.network/theme/1429417934/acc194c0-c5f7-479a-b745-327431cf0595.webp") !important;
    background-size: contain; /* عشان الصورة تظبط مقاسها تلقائياً */
    background-repeat: no-repeat !important;
    display: block;
    width: 150px; /* تقدر تغير العرض حسب ما تشوفه مناسب */
    height: 70px;  /* تقدر تغير الطول حسب ما تشوفه مناسب */
    margin-top: 10px; /* مسافة بسيطة من الأعلى */
}



a.navbar-brand {
    height: 80px !important;
    display: flex;
    align-items: center;
}

a.navbar-brand img {
    height: 100% !important;
    width: auto !important;
    max-height: none !important;
}