/* جعل خلفية الجسم بالكامل بيضاء */
body {
    background-color: #ffffff; /* الخلفية البيضاء */
    color: #000000; /* النص أسود ليكون مقروءًا */
}

/* جعل جميع النصوص باللون الأسود */
body,
body *:not(button):not(input):not(textarea):not(select):not(option):not(optgroup):not(svg *):not(iframe):not(canvas):not(script):not(style):not(link):not(meta):not(title):not(head):not(html) {
    color: #000000; /* اللون الأسود */
}

/* التأكد من أن الروابط باللون الأسود */
a {
    color: #000000; /* اللون الأسود */
    text-decoration: none; /* إزالة التسطير الافتراضي */
    transition: color 0.3s ease, text-decoration 0.3s ease; /* إضافة انتقال سلس */
}

/* تغيير لون الروابط عند التحويم */
a:hover {
    text-decoration: underline; /* تسطير النص عند التحويم */
}

/* التأكد من أن الأزرار باللون الأسود */
button {
    color: #000000; /* اللون الأسود */
}

/* التأكد من أن النصوص داخل حقول الإدخال باللون الأسود */
input,
textarea,
select,
option {
    color: #000000; /* اللون الأسود */
}

/* جعل خلفية الـ Header بيضاء */
header.store-header {
    background-color: #ffffff; /* الخلفية البيضاء */
}

/* تغيير الخلفية للأقسام الأخرى إلى بيضاء */
section, 
footer {
    background-color: #ffffff; /* الخلفية البيضاء */
}

/* جعل النص في .s-block__title باللون الأسود */
.s-block__title {
    color: #000000; /* اللون الأسود */
}

/* تغيير خلفية عنصر .s-product-card-entry إلى اللون الأبيض */
.s-product-card-entry {
    background-color: #ffffff; /* اللون الأبيض */
}

/* تغيير لون النص داخل عنصر .s-product-card-content-title a إلى اللون الأسود */
.s-product-card-content-title a {
    color: #000000; /* اللون الأسود */
    background-color: #ffffff; /* الخلفية البيضاء */
    text-decoration: none; /* إزالة التسطير الافتراضي */
}

/* تغيير لون النص إلى الأسود وتسطيره عند تحريك المؤشر */
.s-product-card-content-title a:hover {
    text-decoration: underline; /* تسطير النص عند التحويم */
}

/* تغيير لون زر .s-button-wide إلى اللون الأبيض */
.s-button-wide {
    background-color: #ffffff; /* لون الخلفية أبيض */
    color: #000000; /* لون النص أسود */
    border: 1px solid #000000; /* لون الحدود أسود */
    transition: background-color 0.3s ease; /* إضافة انتقال سلس */
}

/* تغيير لون الزر عند التحويم */
.s-button-wide:hover {
    background-color: #f0f0f0; /* تغيير لون الخلفية عند التحويم */
}

/* توسيط الصورة داخل الحاوية وجعل خلفيتها بيضاء */
.s-product-card-image-contain {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    background-color: #ffffff; /* خلفية بيضاء */
}    

.s-product-card-image-contain img {
    max-width: 100%;
    max-height: 100%;
    width: 100%;
    height: auto;
    object-fit: contain;
}

/* تحديد ألوان النصوص لعناصر معينة باللون الأسود */
.text-xl,
h1, h2, h3, h4, h5, h6,
blockquote, dl, dd, hr, figure, p, pre {
    color: #000000; /* النص باللون الأسود */
}

/* تحديد لون الروابط عند الضغط عليها */
a:active {
    color: #000000; /* لون النص الأسود عند الضغط */
}

/* تحديد لون عناصر .s-breadcrumb-item إلى اللون الأسود وجعل الخط عريض */
.s-breadcrumb-item {
    color: #000000; /* اللون الأسود */
    font-weight: bold; /* جعل الخط عريض */
}

/* تحديد لون النص لعناصر h2.total-price إلى اللون الأسود */
h2.total-price {
    color: #000000; /* اللون الأسود */
}

/* تحديد لون الزر #btn-show-more إلى الأسود وجعل الخط عريض */
#btn-show-more {
    color: #000000; /* اللون الأسود */
    font-weight: bold; /* جعل الخط عريض */
    text-decoration: none; /* إزالة التسطير الافتراضي */
}

/* إضافة سطر تحت الزر عند التحويم */
#btn-show-more:hover {
    text-decoration: underline; /* تسطير النص عند التحويم */
}

/* تغيير لون الزر إلى الأبيض */
button.s-button-element {
    background-color: #ffffff; /* الخلفية البيضاء */
    color: #000000; /* النص باللون الأسود */
    border: 1px solid #000000; /* تحديد حدود باللون الأسود */
    transition: background-color 0.3s ease; /* إضافة انتقال سلس */
}

/* تغيير لون النص داخل الزر عند التحويم */
button.s-button-element:hover {
    background-color: #f0f0f0; /* تغيير اللون عند التحويم */
}

/* تغيير أيقونة السلة داخل الزر */
button.s-button-element i {
    color: #000000; /* جعل الأيقونة باللون الأسود */
}

/* تغيير النص داخل الزر */
button.s-button-element .s-button-text {
    color: #000000; /* النص داخل الزر باللون الأسود */
}

.sicon-menu {
    color: #000000; /* تغيير اللون إلى الأسود */
}

.s-product-card-price {
    color: #000000; /* تغيير اللون إلى الأسود */
}

.s-breadcrumb-item a {
    color: #000000; /* تغيير لون الروابط إلى الأسود */
    text-decoration: none; /* إلغاء أي خطوط تحت النصوص */
}

/* جعل خلفية .store-footer__inner بيضاء والنصوص والأيقونات سوداء */
.store-footer__inner {
    background-color: #ffffff; /* الخلفية البيضاء */
    color: #000000; /* لون النص الأسود */
}

/* تغيير لون النصوص داخل .store-footer__inner إلى الأسود */
.store-footer__inner,
.store-footer__inner p,
.store-footer__inner a,
.store-footer__inner span,
.store-footer__inner div {
    color: #000000; /* لون النص الأسود */
}

/* تغيير لون الروابط داخل .store-footer__inner إلى الأسود */
.store-footer__inner a {
    text-decoration: none; /* إزالة التسطير الافتراضي */
}

/* تغيير لون الروابط عند التحويم */
.store-footer__inner a:hover {
    text-decoration: underline; /* تسطير النص عند التحويم */
}

/* تغيير لون الأيقونات داخل .store-footer__inner إلى الأسود */
.store-footer__inner i,
.store-footer__inner svg,
.store-footer__inner .icon {
    color: #000000; /* لون الأيقونات الأسود */
    fill: #000000; /* لون العناصر SVG الأسود */
}

/* تغيير خلفية .topnav-is-dark .top-navbar إلى اللون الأبيض وإطاره إلى الأسود مع حواف مدورة */
.topnav-is-dark .top-navbar {
    background-color: #ffffff; /* الخلفية البيضاء */
    border: 1px solid #000000; /* إطار أسود */
    border-radius: 10px; /* حواف مدورة */
}

/* تغيير لون النص داخل <h1> إلى الأسود */
h1.text-xl {
    color: #000000; /* اللون الأسود مع تجاوز أي أنماط أخرى */
}

/* تغيير لون النص داخل عنصر السعر إلى الأسود */
.product-price {
    color: #000000; /* اللون الأسود */
}


.s-product-card-content-title a:hover {
    color: #000000 !important; /* تغيير اللون إلى الأسود عند التحويم */
}


.s-search-product-price {
    color: black; /* تغيير لون الخط إلى الأسود */
}








.s-localization-modal-input[type="radio"] {
    appearance: none; /* إزالة المظهر الافتراضي */
    width: 16px;
    height: 16px;
    border: 2px solid black; /* إطار أسود */
    border-radius: 50%; /* جعله دائريًا */
    position: relative;
}

.s-localization-modal-input[type="radio"]:checked::before {
    content: '';
    display: block;
    width: 8px;
    height: 8px;
    background-color: black; /* لون التحديد أسود */
    border-radius: 50%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}







.navbar-brand img {
    max-height: 8rem;
    width: auto;
    max-width: 100px;
}