/* Add custom CSS styles below */ 
/* Add cus/* ================ لوحة الألوان (مستخرَجة من الشعار) ================ */

:root{

--color-primary:#62499D; /* بنفسجي أساسي */

--color-primary-dark:#4E3A7D; /* بنفسجي داكن */

--color-primary-light:#C0B6D7; /* بنفسجي فاتح */

--color-primary-reverse:#F9E8EE; /* وردي خلفي */


}



/* ================ الشريط العلوي والقائمة ================ */

.main-menu li.root-level>a{font-weight:700;font-size:18px;color:var(--color-primary)}

.main-menu{margin-right:5rem!important}

.main-menu span{font-size:17px}


/* ================ خلفيات مساعدة ================ */

.bg-gray-50{background-color:var(--color-primary-reverse)!important}


/* ================ عنصر أيقونة الرأس ================ */

.header-btn__icon{display:flex;height:2.5rem;width:2.5rem;align-items:center;justify-content:center;border-radius:25% / 50%;border-width:1px;border-color:var(--color-primary-dark);color:var(--color-primary-dark);font-size:20px}


/* ================ عناوين البلوكات والسلايدر ================ */

.s-slider-block__title h2,

.s-block__title h2,

h2.mb-4.text-lg.font-bold.leading-\[1\.2\],

h3.text-lg.font-bold.leading-12{

background:var(--color-primary-dark);

border-radius:2rem 0 0 1rem!important;

font-size:20px!important;

font-weight:700;

color:#fff;

padding-right:10px;

padding-bottom:10px;

}

@media (min-width:1200px){

.s-slider-block__title h2,

.s-block__title h2,

h2.mb-4.text-lg.font-bold.leading-\[1\.2\]{

border-radius:2rem 2rem 1rem 1rem!important;

padding-right:40px;

}

}


/* ================ بطاقات المنتج ================ */

.s-product-card-image{background-color:#fff!important}

.s-product-card-vertical{flex-direction:column;border-radius:30px;border:none;box-shadow:2px 2px 8px #62499d6e}

.s-product-card-entry{box-shadow:0 2px 10px 0 rgba(98,73,157,.25);border:1px solid var(--color-primary)}

.s-product-card-content-title a{font-size:17px;line-height:1.25rem;font-weight:500;color:#5a5a5a}

.s-product-card-content-subtitle{font-size:15px}

.s-product-card-promotion-title{background-color:var(--color-primary-dark)!important;padding:1px 5px 3px!important}


/* ================ أزرار عامة ================ */

.s-button-wide{width:100%;border-radius:15px}

.s-button-primary-outline,

.s-block--features__item .feature-icon{

background:linear-gradient(to right,var(--color-primary-dark),var(--color-primary))!important;

fill:var(--color-primary);color:#fff

}

.btn--rounded-gray{background-color:#fff;box-shadow:0 1px 5px 0 var(--color-primary);border:1px solid var(--color-primary)}


/* ================ صندوق البحث ================ */

.s-search-input{background-color:#fff!important;box-shadow:0 1px 5px 0 var(--color-primary);border:1px solid var(--color-primary)!important;width:20%!important}

@media (max-width:650px){.s-search-input{width:100%!important}}


/* ================ الفوتر ================ */

.footer-is-light .store-footer,

.footer-is-light .store-footer .store-footer__inner{

background-color:var(--color-primary-dark)!important;color:#fff

}

.footer-is-light .store-footer .store-footer__inner{border-bottom-color:var(--color-primary-dark)!important}

.store-footer__inner::before{content:"";background:linear-gradient(180deg,transparent 38%,#fff 94%),url(https://cdn.salla.sa/form-builder/wNtMv6kZ8Kfwn4HwWEwhunZoi5STLtYzRDjaevXg.png);background-size:418%;display:block;background-repeat:round;transform:rotate(180deg);height:104px;margin:-65px -32px 1px 1px}

.footer-is-light .store-footer .social-link{line-height:32px!important;display:block;width:36px;height:36px;font-size:18px;transition:all .2s ease-out;color:#fff;border-radius:25% / 50%;border:1px solid var(--color-primary)}

.store-footer h3{color:#EBC4D4}

/* ================ عربة التسوّق ================ */

section.cart-item.bg-white.p-5.xs\:p-7.rounded-md.mb-5.relative{

box-shadow:5px 10px 30px #2B2D340D;border:1px solid var(--color-primary-dark)

}


/* ================ القائمة الجانبية (mm-spn) ================ */

.mm-spn li{position:relative;background:inherit;cursor:pointer;color:var(--color-primary);font-size:18px;border-bottom:1px solid var(--color-primary-dark)}

.mm-ocd--open .mm-ocd__content{transform:translate3d(0,0,0);box-shadow:-4px 0 7px 0 rgba(0,0,0,.26);border-radius:0 0 0 2rem}

.mm-spn.mm-spn--navbar.mm-spn--main{cursor:default;border-radius:2rem 0 0 2rem}

.mm-ocd-opened .btn--close-sm{opacity:1;visibility:visible;transform:translateY(0);z-index:99999999;border-radius:15px 0 0 15px}


/* ================ شريط التمرير المخصص ================ */

::-webkit-scrollbar{width:10px;height:10px}

::-webkit-scrollbar-track-piece{background-color:rgba(0,0,0,.2)}

::-webkit-scrollbar-thumb:vertical{height:200px;background-color:var(--color-primary-dark)}

::-webkit-scrollbar-thumb:vertical:hover{background-color:#c03}

::-webkit-scrollbar-thumb:horizontal{width:200px;background-color:rgba(125,125,125,.7)}


/* ================ خلفية المتجر ================ */

body{background-color:var(--color-primary-reverse)!important}


/* ================ باقي القواعد كما هي (السلايدر، الميديا كويري… إلخ) ================ */

/* تم الإبقاء عليها بدون تغيير لأنها تعتمد على المتغيرات المحدثة أو لا تتعارض مع الهوية الجديدة */

/* تكبير + توسيط عناوين الأقسام */

.s-block__title h2,

.s-slider-block__title h2,

h2.mb-4.text-lg.font-bold.leading-\[1\.2\],

h3.text-lg.font-bold.leading-12{

font-size:24px !important; /* الحجم الكبير الذي اخترناه */

text-align:center !important; /* يجعل النص في وسط السطر */

display:inline-block; /* يقلِّص العرض إلى محتوى العنوان */

margin-right:auto; /* يوازن الهامشين للحصول على توسيط كامل */

margin-left:auto; /* (يُفيد في RTL و LTR) */

}


/* اختياري: لمسافة إضافية أعلى/أسفل */

.s-block__title h2,

.s-slider-block__title h2{

margin-top:1.5rem;

margin-bottom:1.5rem;

}


/* للجوال: حافظ على التوسيط وقلّل المقاس */

@media (max-width:650px){

.s-block__title h2,

.s-slider-block__title h2,

h2.mb-4.text-lg.font-bold.leading-\[1\.2\],

h3.text-lg.font-bold.leading-12{

font-size:24px !important;

}

}

/* تكبير شكل الخلفية البنفسجية لعناوين الأقسام */

.s-block__title h2,

.s-slider-block__title h2,

h2.mb-4.text-lg.font-bold.leading-\[1\.2\],

h3.text-lg.font-bold.leading-12{

/* ابقِ ما سبق من خصائص (لون، حجم خط، توسيط…) */

padding: 0.5rem 1.5rem !important; /* كان 10px ▼ الآن 20px أعلى/أسفل، 64px يمين/يسار */

border-radius: 3rem 1.5rem 1.5rem 2rem !important; /* زوايا أكبر قليلاً ليتّسع الشكل */

/* يمكنك رفع القيم أكثر إذا أردت مساحة أكبر */

}


/* اختيارياً: صِغره قليلاً على الشاشات الضيقة حتى لا يملأ العرض بالكامل */

@media (max-width:650px){

.s-block__title h2,

.s-slider-block__title h2,

h2.mb-4.text-lg.font-bold.leading-\[1\.2\],

h3.text-lg.font-bold.leading-12{

padding: .75rem 1.5rem !important; /* تقليل الحشوة للجوال */

}

}

tom CSS styles below */