.s-block--full-bg:first-of-type {
    margin-top: 30px; /* cite: 1 */
}
.header-inner.inner.bg-white.da-bgm {
    background-color: #ec6233; /* cite: 2 */
    color: aliceblue; /* cite: 2 */
    padding: 5px; /* cite: 6 */
}

.sicon-menu:before {
    content: "\ed7f"; /* cite: 70 */
    color: #33003f00; /* cite: 70 */
    background-image: url(https://cdn.salla.sa/YgydAp/b3550afe-ce40-4279-8c50-687a69868c5e-1000x1000-PuPCML9R60ZWC5ckHv9G0wEXBHHcpzsF7Otjj6pU.png); /* cite: 70 */
    background-size: contain; /* cite: 70 */
    background-repeat: no-repeat; /* cite: 70 */
}

.sicon-search:before {
    content: "\ef09"; /* cite: 72 */
    color: #ec623300; /* cite: 72 */
    background-image: url(https://cdn.salla.sa/YgydAp/RbqjVoWFcSi2YKbKBNivchQVJuPckwm0QV2Mfa0C.png); /* cite: 72 */
    background-size: contain; /* cite: 72 */
    background-repeat: no-repeat; /* cite: 72 */
}
.sicon-user:before {
    content: "\f078"; /* cite: 71 */
    color: #33003f00; /* cite: 71 */
    background-image: url(https://cdn.salla.sa/YgydAp/TPDvG4NisDfh99RjIZmBTypydn0iSfIqXRWNlHPY.png); /* cite: 71 */
    background-size: contain; /* cite: 71 */
    background-repeat: no-repeat; /* cite: 71 */
}
.sicon-shopping-bag2:before {
    content: "\e906"; /* cite: 4 */
    color: #ec6233; /* cite: 4 */
}
/* تم تعديل هذا ليحل محله الأيقونة الجديدة في sicon-shopping:before */
/* .sicon-shopping-bag2:before {
    content: "\e906";
    color: #ec6233;
} */
.sicon-shopping:before {
    content: "\ef39"; /* cite: 73 */
    color: #ec623300; /* cite: 73 */
    background-image: url(https://cdn.salla.sa/YgydAp/NO9CEmYIKdvEdckIRlVEWji6wZ9fIBMcEbPYWpL0.png); /* cite: 73 */
    background-size: contain; /* cite: 73 */
    background-repeat: no-repeat; /* cite: 73 */
}
header.store-header.fixed-sticky {
    background-color: #ec6233; /* cite: 4 */
}
div#mainnav {
    background-color: #ec6233; /* cite: 5 */
}

.header-container.container {
    border-radius: 50px; /* cite: 7 */
    background-color: #ffffff; /* cite: 7 */
    margin-top: 10px; /* cite: 7 */
    margin-bottom: 10px; /* cite: 7 */
    border: solid 1px #ff875e; /* cite: 7 */
}

.custom-mega-menu {
    background-color: #36564d00; /* cite: 8 */
    padding: 0; /* cite: 8 */
    text-align: center; /* cite: 8 */
    z-index: 9999; /* cite: 8 */
}

.swiper.s-slider-container.swiper-fade.swiper-initialized.swiper-horizontal.swiper-rtl.swiper-watch-progress.swiper-backface-hidden {
    border-radius: 30px; /* cite: 8 */
}

.menu-items a {
    color: #ffffff; /* cite: 9 */
    text-decoration: none; /* cite: 9 */
    font-size: 16px; /* cite: 9 */
    padding: 8px 12px; /* cite: 9 */
    display: inline-block; /* cite: 9 */
    transition: color 0.3s; /* cite: 9 */
}


section.s-block.s-block--features.angel-features.bg-gray-100.da-bgg.py-8.mask-block {
    background-color: #ffffff; /* cite: 9 */
    margin-top: 40px; /* cite: 9 */
    border: solid 1px #dee2e6; /* cite: 10 */
    padding: 64px 0; /* cite: 10 */
}

section.s-block.s-block--angel-products.angel-products-4.angel-products {
    background-color: #ffffff; /* cite: 10 */
    border: solid 1px #dee2e6; /* cite: 10 */
}


footer.store-footer {
    background-color: #ed6a3d; /* cite: 11 */
    color: aliceblue; /* cite: 11 */
    border-radius: 50px 50px 0px 0px; /* cite: 11 */
}

p.text-gray-400.mb-2\.5.md\:mb-0 {
    color: #ffffff; /* cite: 12 */
}
.store-footer h3 {
    color: #ffffff; /* cite: 13 */
}

button.rtl\:rounded-r-none.ltr\:rounded-l-none.rtl\:rounded-l-md.ltr\:rounded-r-md.s-button-wrap.hydrated.s-button-element.s-button-btn.s-button-solid.s-button-primary.s-button-loader-center {
    background-color: #faa141; /* cite: 13 */
    border: solid 1px; /* cite: 13 */
}

.store-footer a:hover {
    color: #ffe5c9 !important; /* cite: 14 */
}

.store-footer .footer-container {
    justify-content: space-between; /* cite: 14 */
    gap: 1rem; /* cite: 14 */
    border-bottom-width: 1px; /* cite: 14 */
    --tw-border-opacity: 1; /* cite: 14 */
    border-color: rgba(229, 231, 235, 1); /* cite: 14 */
    border-color: rgb(249 127 85); /* cite: 15 */
    padding-top: 2rem; /* cite: 15 */
    padding-bottom: 2rem; /* cite: 15 */
    text-align: center; /* cite: 15 */
}

.store-footer__inner {
  border-color: currentColor; /* cite: 15 */
  border-color: initial; /* cite: 15 */
  padding: 60px; /* cite: 16 */
}

@media (max-width: 991px) {
  .store-footer__inner {
    padding: 20px; /* cite: 17 */
  }
}

@media (max-width: 576px) {
  .store-footer__inner {
    padding: 5px; /* cite: 18 */
  }
}

p.text-gray-400.mb-2\.5.md\:mb-0 {
    color: #ffffff; /* cite: 18 */
}

.footer-bottom.flex.flex-col.lg\:flex-row.items-center.justify-between.py-4.gap-4 {
    margin-top: 20px; /* cite: 19 */
    background-color: #ff946f; /* cite: 19 */
    padding: 20px; /* cite: 19 */
    border-radius: 50px; /* cite: 19 */
}

.contact-links a {
    min-width: 3.5rem; /* cite: 19 */
    border-radius: 0.375rem; /* cite: 19 */
    background-color: #ff946f; /* cite: 20 */
    --tw-bg-opacity: 0.5; /* cite: 20 */
    padding: 0.5rem; /* cite: 20 */
}

section.s-block.s-block--faqs {
    background-color: #ffffff; /* cite: 20 */
    border: solid 1px #dee2e6; /* cite: 21 */
    padding-top: 50px; /* cite: 21 */
    padding-bottom: 50px; /* cite: 21 */
}

label.block.cursor-pointer.p-6.pe-16.text-sm.font-primary.leading-6.transition {
    color: #FFF; /* cite: 21 */
}

.sicon-add:before {
    content: "\e90c"; /* cite: 22 */
    color: #fc7546; /* cite: 22 */
}

.flex.h-full.transition-shadow.duration-500.hover\:shadow-default.bg-white.da-bgg.rounded-lg.relative {
    background-color: #f5f7f6; /* cite: 22 */
    border: solid 1px #e5e5e5; /* cite: 22 */
    HEIGHT: 200PX; /* cite: 22 */
}

.testimonial__avatar.overflow-hidden.h-24.w-24.flex.z-1.rounded-full.transition-shadow.duration-500.hover\:shadow-default {
    border-radius: 0px; /* cite: 23 */
}

.angel-feature.flex-center.flex-col {
    display: flex; /* cite: 23 */
    flex-direction: row; /* cite: 23 */
}

/* ==========  QUISTIONS  ==========       */
.border-transparent {
    border-color: transparent; /* cite: 24 */
    border-radius: 14px; /* cite: 24 */
    background: #e36430 !important; /* cite: 24 */
    border: 0; /* cite: 24 */
}

.s-block--faqs .faqs-list input:checked+div label {
    color: #fff!important; /* cite: 25 */
    background: #813414; /* cite: 25 */
}

.dark .faqs-list__item {
    background-color: var(--dark-grey) !important; /* cite: 25 */
}

.s-block--testimonials .end-4 {
    left: 1rem; /* cite: 26 */
}

[dir=rtl] .pe-16 {
    font-size: 15px; /* cite: 26 */
    font-weight: 400!important; /* cite: 27 */
    padding: 5px 18px 5px 5px; /* cite: 27 */
    display: flex; /* cite: 27 */
    justify-content: space-between; /* cite: 27 */
    height: auto; /* cite: 27 */
    width: auto; /* cite: 27 */
    font-weight: 700 !important; /* cite: 27 */
    align-items: flex-end; /* cite: 27 */
}

.angel_anime .pe-16:before {
    font-size: 18px; /* cite: 28 */
    content: ""; /* cite: 28 */
    font-weight: 700!important; /* cite: 28 */
    height: 20px; /* cite: 28 */
    background: #ffffff; /* cite: 28 */
    width: 5px; /* cite: 28 */
    border-radius: 6px; /* cite: 29 */
    position: absolute; /* cite: 29 */
    top: 9px; /* cite: 29 */
    right: 6px; /* cite: 29 */
}

.angel_anime input:checked+div .pe-16:before  {
    font-size: 18px; /* cite: 29 */
    content: ""; /* cite: 29 */
    font-weight: 700!important; /* cite: 30 */
    height: 20px; /* cite: 30 */
    background: #fff; /* cite: 30 */
    width: 5px; /* cite: 30 */
    border-radius: 6px; /* cite: 30 */
    position: absolute; /* cite: 30 */
    top: 9px; /* cite: 30 */
    right: 6px; /* cite: 30 */
}

.s-block--faqs .faqs-list input:checked+div .open-badge {
    background: #e36430; /* cite: 31 */
    background-color: #e36430 !important; /* cite: 31 */
}

.faq-item {
    background: #ffffff; /* cite: 31 */
    color: #ededf2; /* cite: 32 */
    font-size: 14px; /* cite: 32 */
}

.h-8 {
    height: 26px; /* cite: 32 */
}

.s-block--faqs .w-8 {
    width: 26px; /* cite: 33 */
}

.w-8 {
    width: auto; /* cite: 33 */
}

.top-5 {
    position: relative; /* cite: 33 */
    top: 0; /* cite: 34 */
}

.rounded-full {
    border-radius: 10px; /* cite: 34 */
}

/* ======      NAV      ======      */
.mobile-menu .links-menu .footer-list a:hover {
    color: #716bae!important; /* cite: 35 */
}

.dark .social-menu .bubble-show {
    background-color: var(--dark-grey); /* cite: 35 */
}

.aspect-square {
    aspect-ratio: auto; /* cite: 36 */
}

.social-menu .w-8 {
    width: 36px; /* cite: 36 */
}

.social-menu .social-links .icon {
    margin: auto!important; /* cite: 37 */
    width: 36px!important; /* cite: 37 */
    font-size: 20px; /* cite: 37 */
    justify-content: center; /* cite: 37 */
    display: flex; /* cite: 37 */
}

.lazy__bg.lazy_menu {
    height: 2.5rem; /* cite: 38 */
    width: 2.5rem; /* cite: 38 */
}

.main-menu .contact-links a {
    background: #ededf2!important; /* cite: 39 */
    flex-direction: row; /* cite: 39 */
    padding: 5px 10px !important; /* cite: 39 */
    align-items: stretch; /* cite: 39 */
    color: #7e88b7; /* cite: 39 */
}

.dark .main-menu .contact-links a {
    background: var(--dark-grey) !important; /* cite: 40 */
    color: #fff; /* cite: 40 */
}

.main-menu .contact-links a:hover {
    background: #212b5c!important; /* cite: 41 */
    color: #fff; /* cite: 41 */
}

.dark .main-menu .contact-links a:hover {
    background: #fff!important; /* cite: 42 */
    color: #212b5c; /* cite: 42 */
}

.main-menu .contact-links span {
    font-size: 14px; /* cite: 42 */
}

.mobile-menu .offers-link {
    align-items: center; /* cite: 43 */
}

i.sicon-link.me-2, i.sicon-headphones.me-2 {
    font-size: 24px; /* cite: 43 */
    padding: 6px 8px; /* cite: 44 */
    color: #21c5ca; /* cite: 44 */
}

#mobile-menu > ul > li.links.text-sm.font-bold.md\:text-lg > span, #mobile-menu > ul > li.social.text-sm.md\:text-lg.font-bold > span {
    display: flex; /* cite: 45 */
    align-items: center; /* cite: 45 */
}

.navbar-brand {
    align-items: center; /* cite: 46 */
    display: flex; /* cite: 46 */
    margin-bottom: .5rem; /* cite: 46 */
    margin-top: .5rem; /* cite: 46 */
    padding: 0; /* cite: 46 */
}

.sicon-menu {
    color: #fff; /* cite: 46 */
}

.sicon-dollar-coin-stack:before {
    font-size: 24px; /* cite: 47 */
    padding-right: 9px; /* cite: 47 */
    color: #89acae; /* cite: 47 */
    padding-left: 6px; /* cite: 47 */
}

.mm-spn li a, .mm-spn li span:not(.s-user-menu-dropdown-item-badge) {
    display: flex; /* cite: 48 */
    align-items: center; /* cite: 48 */
}

.dark .mobile-menu .swiper-backface-hidden .swiper-slide {
    background: #0000; /* cite: 48 */
}

.dark .mobile-menu-slider .swiper-backface-hidden .swiper-slide {
    background: #0000; /* cite: 50 */
}

.mm-spn.mm-spn--light {
    border-radius: 25px 0 0 25px; /* cite: 51 */
}
.mm-spn ul {
    -webkit-overflow-scrolling: touch; /* cite: 51 */
    position: fixed; /* cite: 52 */
    top: 0; /* cite: 52 */
    left: 100%; /* cite: 52 */
    bottom: 0; /* cite: 52 */
    z-index: 2; /* cite: 52 */
    width: calc(100% + 30%); /* cite: 52 */
    width: calc(100% + var(--mm-spn-panel-offset)); /* cite: 52 */
    padding-right: 30%; /* cite: 52 */
    padding-right: var(--mm-spn-panel-offset); /* cite: 52 */
    line-height: 24px; /* cite: 52 */
    line-height: var(--mm-spn-line-height); /* cite: 52 */
    overflow: visible; /* cite: 52 */
    overflow-y: auto; /* cite: 53 */
    background: #fff2ed; /* cite: 53 */
    transition: left .3s ease 0s; /* cite: 53 */
    cursor: default; /* cite: 53 */
}
.mm-spn li:after {
    content: ''; /* cite: 53 */
    position: absolute; /* cite: 54 */
    width: 15px; /* cite: 54 */
    transform: translateY(50%); /* cite: 54 */
    bottom: 50%; /* cite: 54 */
    height: 30px; /* cite: 54 */
    background: #ec6233; /* cite: 54 */
    transition: all .1s linear; /* cite: 54 */
    left: 0; /* cite: 54 */
    border: 0; /* cite: 55 */
    opacity: 1; /* cite: 55 */
    z-index: -1; /* cite: 55 */
    border-radius: 0px 15px 15px 0px; /* cite: 55 */
}

.mm-spn li:hover:after {
    width: 45px !important; /* cite: 56 */
}

#mobile-menu > ul>li {
    background: #0000; /* cite: 56 */
    border-bottom: #ffffff2b solid 1px; /* cite: 57 */
}

#mobile-menu > ul>li>ul {
    background: #fff; /* cite: 58 */
    border-bottom: #ffffff2b solid 1px; /* cite: 58 */
}

.dark #mobile-menu > ul>li>ul {
    background-color: var(--dark-bg-main) !important; /* cite: 58 */
}

.product-index .mm-ocd__content {
    background-color: #0000; /* cite: 59 */
}

.store-header .text-black {
    color: rgb(236 98 51); /* cite: 59 */
}

.header-btn {
    color: #ec6233; /* cite: 60 */
}

.s-cart-summary-total {
    color: #fff; /* cite: 60 */
}

p.da-tm.hidden.text-xl.md\:block.ms-1 {
    font-size: 15px; /* cite: 61 */
    color: #ec6233; /* cite: 61 */
    height: 20px; /* cite: 61 */
}

img.logo-light {
    margin: -20px!important; /* cite: 61 */
    width: 100px!important; /* cite: 61 */
    height: 100px!important; /* cite: 61 */
}

section.s-block.s-block--features.angel-features.no-home-tab.bg-gray-100.da-bgg.py-8.mask-block {
    mask-image: none; /* cite: 62 */
}

.flex-center.flex-col.mt-2 {
    align-items: flex-start; /* cite: 62 */
}

@media (max-width: 640px) {
  .grid.grid-cols-3.items-baseline.gap-2.sm\:gap-6.lg\:gap-4 {
    display: flex; /* cite: 63 */
    flex-wrap: wrap; /* cite: 63 */
    gap: 50px; /* cite: 63 */
    padding-right: 20px; /* cite: 63 */
  }
}

.angel-feature.flex-center.flex-col {
    gap: 20px; /* cite: 64 */
}

.flex-center.h-14.w-14.md\:h-20.md\:w-20 {
    width: 50px; /* cite: 65 */
}

.s-product-card-entry {
    display: flex; /* cite: 65 */
    height: 100%; /* cite: 66 */
    width: 100%; /* cite: 66 */
    flex-direction: column; /* cite: 66 */
    overflow: hidden; /* cite: 66 */
    border-width: 2px; /* cite: 66 */
    border-color: #414042; /* cite: 66 */
    border-color: var(--color-primary); /* cite: 66 */
    --tw-bg-opacity: 1; /* cite: 66 */
    background-color: rgb(255 255 255 / 0%); /* cite: 67 */
    transition: transform 0.3s ease, box-shadow 0.3s ease; /* cite: 67 */
}

.s-product-card-entry:hover {
    transform: translateY(-7px); /* cite: 68 */
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); /* cite: 68 */
}
@media (min-width: 1024px) {
  .header-container.container {
    padding-right: 50px; /* cite: 69 */
    padding-left: 50px; /* cite: 69 */
  }
}


document.addEventListener("DOMContentLoaded", function () { /* cite: 74 */    // نشتغل فقط على الكمبيوتر
    if (window.innerWidth < 992) return; /* cite: 74 */

    const headers = document.querySelectorAll('.header-container.container'); /* cite: 74 */

    headers.forEach(header => {
        const computedStyle = window.getComputedStyle(header); /* cite: 74 */
        const position = computedStyle.getPropertyValue('position'); /* cite: 74 */

        // نجرب نعرف إذا كان فعلاً sticky أو fixed عن طريق top position
        
        const rect = header.getBoundingClientRect(); /* cite: 74 */
        const isSticky = position === 'fixed' || position === 'sticky' || rect.top === 0; /* cite: 74 */

        if (!isSticky) {
            const menu = document.createElement('div'); /* cite: 74 */
            menu.className = 'custom-mega-menu'; /* cite: 74 */
            menu.innerHTML = `
                <ul class="menu-items">
      
                    <li><a href="https://brqdigital.com/%D8%A7%D9%84%D8%AE%D8%AF%D9%85%D8%A7%D8%AA-%D8%A7%D9%84%D8%B1%D9%82%D9%85%D9%8A%D8%A9/c1164516075?filters[category_id]=1164516075">الخدمات الرقمية</a></li> /* cite: 75 */
                    <li><a href="https://brqdigital.com/%D8%A7%D9%84%D9%85%D9%86%D8%AA%D8%AC%D8%A7%D8%AA-%D8%A7%D9%84%D8%B1%D9%82%D9%85%D9%8A%D8%A9/c680051953">المنتجات الرقمية</a></li> /* cite: 75 */
                    <li><a href="https://brqdigital.com/%D8%AC%D9%88%D8%A7%D9%84%D8%A7%D8%AA/c2052449266">جوالات</a></li> /* cite: 75 */
                    <li><a href="https://brqdigital.com/%D8%A7%D9%84%D8%A7%D8%B4%D8%AA%D8%B1%D8%A7%D9%83%D8%A7%D8%AA/c639574524">الاشتراكات</a></li> /* cite: 75 */
                </ul>
    
            `; /* cite: 76 */
            header.parentNode.insertBefore(menu, header.nextSibling); /* cite: 76 */
        }
    });

    const style = document.createElement('style'); /* cite: 77 */
    style.innerHTML = `
        .custom-mega-menu {
            background-color: #36564d; /* cite: 78 */
            padding: 15px 0; /* cite: 78 */
            text-align: center; /* cite: 78 */
            z-index: 9999; /* cite: 78 */
        }

        .menu-items {
            list-style: none; /* cite: 79 */
            margin: 0; /* cite: 79 */
            padding: 0; /* cite: 79 */
            display: flex; /* cite: 79 */
            justify-content: center; /* cite: 79 */
            gap: 40px; /* cite: 80 */
        }

        .menu-items li {
            position: relative; /* cite: 81 */
        }

        .menu-items a {
            color: #ccc; /* cite: 82 */
            text-decoration: none; /* cite: 82 */
            font-size: 16px; /* cite: 82 */
            padding: 8px 12px; /* cite: 83 */
            display: inline-block; /* cite: 83 */
            transition: color 0.3s; /* cite: 83 */
        }

        .menu-items a:hover {
            color: #fff; /* cite: 84 */
        }

        .menu-items a::after {
            content: ""; /* cite: 85 */
            position: absolute; /* cite: 85 */
            left: 0; /* cite: 85 */
            bottom: 0; /* cite: 85 */
            width: 100%; /* cite: 85 */
            height: 3px; /* cite: 85 */
            background-color: #f9ae34; /* cite: 86 */
            transform: scaleX(0); /* cite: 86 */
            transform-origin: left; /* cite: 86 */
            transition: transform 0.3s ease; /* cite: 86 */
        }

        .menu-items a:hover::after {
            transform: scaleX(1); /* cite: 87 */
        }
    `;
    document.head.appendChild(style); /* cite: 87 */

    // تغيير الألوان برمجياً (مثال - يمكن تعديل القيمة #new-color)
    document.documentElement.style.setProperty('--primary-color', '#ec6233'); /* cite: 88 */
});