/* =====================================================
   1) WHITE STORE BACKGROUND
   جعل خلفية المتجر بيضاء بالكامل
   ===================================================== */

html,
body,
#app,
#main-content,
main {
    background-color: #ffffff !important;
}

/* أقسام الصفحة الرئيسية */

.s-block,
.s-block--full-bg,
.bg-gray-100 {
    background-color: #ffffff !important;
}
/* =========================================================
   3) PREMIUM COMPACT FOOTER
   تصميم الفوتر بالكامل
   ========================================================= */


/* =========================================================
   FOOTER BASE
   ========================================================= */

.store-footer__inner {
    position: relative !important;

    background: linear-gradient(
        180deg,
        #ffffff 0%,
        #fbfdff 48%,
        #f5f9ff 100%
    ) !important;

    color: #111318 !important;

    padding-top: 18px !important;
    padding-bottom: 14px !important;

    overflow: hidden !important;

    border-top: 0 !important;

    box-shadow:
        0 -10px 30px rgba(8, 104, 247, 0.025) !important;
}


/* =========================================================
   BLUE LINE ABOVE FOOTER
   ========================================================= */

.store-footer__inner::before {
    content: "" !important;

    position: absolute !important;

    top: 0 !important;
    left: 50% !important;

    transform: translateX(-50%) !important;

    width: 94% !important;
    max-width: 1450px !important;

    height: 2px !important;

    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(8,104,247,0.05) 10%,
        rgba(8,104,247,0.35) 25%,
        #0868F7 42%,
        #5CB6FF 50%,
        #0868F7 58%,
        rgba(8,104,247,0.35) 75%,
        rgba(8,104,247,0.05) 90%,
        transparent 100%
    ) !important;

    background-size: 180% 100% !important;

    border-radius: 100px !important;

    box-shadow:
        0 0 5px rgba(8,104,247,0.25),
        0 0 14px rgba(8,104,247,0.08) !important;

    animation:
        madarFooterLight 5s ease-in-out infinite alternate !important;

    pointer-events: none !important;
}


@keyframes madarFooterLight {

    0% {
        background-position: 0% 50%;
        opacity: .72;
    }

    50% {
        opacity: 1;
    }

    100% {
        background-position: 100% 50%;
        opacity: .78;
    }

}


/* الخط السفلي */

.store-footer__inner::after {

    content: "" !important;

    position: absolute !important;

    bottom: 0 !important;
    left: 50% !important;

    transform: translateX(-50%) !important;

    width: 80% !important;
    height: 1px !important;

    background: linear-gradient(
        90deg,
        transparent,
        rgba(8,104,247,0.10),
        rgba(8,104,247,0.30),
        rgba(8,104,247,0.10),
        transparent
    ) !important;

    pointer-events: none !important;
}


/* =========================================================
   DESKTOP LAYOUT
   ========================================================= */

.store-footer__inner > .container {

    display: grid !important;

    grid-template-columns:
        minmax(320px, 1.7fr)
        minmax(170px, .8fr)
        minmax(240px, 1fr) !important;

    gap: 26px !important;

    align-items: start !important;
}


/* =========================================================
   STORE INFORMATION
   ========================================================= */

.store-footer__inner
> .container
> div:first-child {

    display: grid !important;

    grid-template-columns:
        minmax(180px, 1fr)
        auto !important;

    column-gap: 16px !important;

    row-gap: 3px !important;

    align-items: center !important;
}


/* اسم المتجر */

.store-footer__inner
.lg\:col-span-2 > a {

    margin: 0 !important;
}


.store-footer__inner
.lg\:col-span-2 > a h3 {

    font-size: 17px !important;

    font-weight: 800 !important;

    line-height: 1.25 !important;

    margin: 0 0 3px !important;

    color: #080b10 !important;
}


/* وصف المتجر */

.store-footer__inner .max-w-sm {

    margin: 0 !important;
}


.store-footer__inner .max-w-sm p {

    font-size: 11px !important;

    line-height: 1.45 !important;

    color: #626d7c !important;

    margin: 0 !important;
}


/* =========================================================
   CR + VAT
   ========================================================= */

.store-footer__inner
> .container
> div:first-child
> .flex.gap-4 {

    grid-column: 2 !important;

    grid-row: 1 / span 2 !important;

    display: flex !important;

    align-items: center !important;

    gap: 9px !important;

    margin: 0 !important;

    flex-wrap: nowrap !important;
}


.store-footer__inner
.s-trust-badges-wrapper {

    gap: 5px !important;

    margin: 0 !important;
}


.store-footer__inner
.s-trust-badges-image {

    width: 30px !important;
    height: 30px !important;
}


.store-footer__inner
img[alt="value added tax"] {

    width: 26px !important;
    height: 31px !important;
}


.store-footer__inner
.s-trust-badges-label,

.store-footer__inner
.text-text-grey {

    font-size: 9px !important;

    line-height: 1.15 !important;

    margin: 0 !important;

    color: #768293 !important;
}


.store-footer__inner
.s-trust-badges-number,

.store-footer__inner
.flex.gap-4 b {

    font-size: 9px !important;

    line-height: 1.15 !important;

    color: #252b34 !important;
}


/* =========================================================
   SECTION TITLES
   ========================================================= */

.store-footer__inner h3,
.store-footer__inner .s-contacts-title {

    font-size: 13px !important;

    line-height: 1.25 !important;

    margin: 0 0 5px !important;

    color: #090b0f !important;

    font-weight: 700 !important;
}


/* =========================================================
   FOOTER LINKS
   ========================================================= */

.store-footer__inner
.s-menu-footer-list {

    gap: 1px !important;
}


.store-footer__inner
.s-menu-footer-item {

    font-size: 10.5px !important;

    line-height: 1.35 !important;

    padding: 1px 0 !important;

    color: #515d6d !important;
}


.store-footer__inner
.s-menu-footer-item:hover {

    color: #0868F7 !important;
}


/* =========================================================
   CONTACTS
   ========================================================= */

.store-footer__inner
.s-contacts-list {

    gap: 2px !important;
}


.store-footer__inner
.s-contacts-item {

    min-height: 0 !important;

    padding: 1px 0 !important;

    gap: 5px !important;

    font-size: 10.5px !important;

    line-height: 1.25 !important;

    color: #515d6d !important;
}


.store-footer__inner
.s-contacts-icon {

    width: 22px !important;
    height: 22px !important;

    min-width: 22px !important;

    border-radius: 6px !important;

    background: linear-gradient(
        145deg,
        #f5f9ff,
        #edf5ff
    ) !important;

    border: 1px solid #deebfb !important;

    color: #0868F7 !important;
}


.store-footer__inner
.s-contacts-icon svg {

    width: 11px !important;
    height: 11px !important;

    fill: currentColor !important;
}


/* =========================================================
   SOCIAL MEDIA
   ========================================================= */

.store-footer__inner
.s-social-list {

    gap: 5px !important;

    margin: 5px 0 0 !important;
}


.store-footer__inner
.s-social-link a {

    width: 27px !important;
    height: 27px !important;

    border-radius: 7px !important;

    background: #ffffff !important;

    border: 1px solid #dce8f7 !important;

    color: #0868F7 !important;

    box-shadow:
        0 3px 8px rgba(8,104,247,.05) !important;
}


.store-footer__inner
.s-social-icon,

.store-footer__inner
.s-social-icon svg {

    width: 13px !important;
    height: 13px !important;

    fill: currentColor !important;
}


/* إخفاء التطبيقات إذا كانت فارغة */

.store-footer__inner
salla-apps-icons:empty {

    display: none !important;
}


/* =========================================================
   MOBILE FOOTER
   ========================================================= */

@media (max-width: 767px) {

    .store-footer__inner {

        padding-top: 12px !important;
        padding-bottom: 9px !important;

        background: linear-gradient(
            180deg,
            #ffffff 0%,
            #f7faff 100%
        ) !important;
    }


    .store-footer__inner::before {

        width: 90% !important;

        height: 2px !important;
    }


    .store-footer__inner::after {

        width: 72% !important;
    }


    /* تقسيم الفوتر إلى عمودين */

    .store-footer__inner > .container {

        display: grid !important;

        grid-template-columns:
            minmax(0, 1fr)
            minmax(0, 1fr) !important;

        column-gap: 14px !important;

        row-gap: 7px !important;

        align-items: start !important;
    }


    /* معلومات المتجر بعرض كامل */

    .store-footer__inner
    > .container
    > div:first-child {

        grid-column: 1 / -1 !important;

        display: grid !important;

        grid-template-columns:
            minmax(0, 1fr)
            auto !important;

        column-gap: 8px !important;

        row-gap: 1px !important;

        align-items: center !important;
    }


    .store-footer__inner
    .lg\:col-span-2 > a h3 {

        font-size: 14px !important;

        margin: 0 0 2px !important;

        line-height: 1.2 !important;
    }


    .store-footer__inner
    .max-w-sm {

        margin: 0 !important;
    }


    .store-footer__inner
    .max-w-sm p {

        font-size: 9px !important;

        line-height: 1.35 !important;

        margin: 0 !important;
    }


    /* السجل والضريبة */

    .store-footer__inner
    > .container
    > div:first-child
    > .flex.gap-4 {

        grid-column: 2 !important;

        grid-row: 1 / span 2 !important;

        display: flex !important;

        flex-wrap: nowrap !important;

        align-items: center !important;

        justify-content: flex-end !important;

        gap: 5px !important;

        margin: 0 !important;
    }


    .store-footer__inner
    .s-trust-badges-image {

        width: 24px !important;
        height: 24px !important;
    }


    .store-footer__inner
    img[alt="value added tax"] {

        width: 21px !important;
        height: 25px !important;
    }


    .store-footer__inner
    .s-trust-badges-label,

    .store-footer__inner
    .s-trust-badges-number,

    .store-footer__inner
    .text-text-grey,

    .store-footer__inner
    .flex.gap-4 b {

        font-size: 7.5px !important;

        line-height: 1.1 !important;

        margin: 0 !important;
    }


    /* العناوين */

    .store-footer__inner h3,
    .store-footer__inner .s-contacts-title {

        font-size: 11px !important;

        line-height: 1.2 !important;

        margin: 0 0 3px !important;
    }


    /* الروابط */

    .store-footer__inner
    .s-menu-footer-list {

        gap: 0 !important;
    }


    .store-footer__inner
    .s-menu-footer-item {

        font-size: 9px !important;

        line-height: 1.25 !important;

        padding: 1px 0 !important;
    }


    /* التواصل */

    .store-footer__inner
    .s-contacts-list {

        gap: 1px !important;
    }


    .store-footer__inner
    .s-contacts-item {

        font-size: 9px !important;

        line-height: 1.2 !important;

        padding: 0 !important;

        gap: 4px !important;
    }


    .store-footer__inner
    .s-contacts-icon {

        width: 18px !important;
        height: 18px !important;

        min-width: 18px !important;

        border-radius: 5px !important;
    }


    .store-footer__inner
    .s-contacts-icon svg {

        width: 9px !important;
        height: 9px !important;
    }


    .store-footer__inner
    .s-contacts-item .unicode {

        font-size: 8.5px !important;

        overflow-wrap: anywhere !important;
    }


    /* السوشيال */

    .store-footer__inner
    .contact-social {

        margin-top: 3px !important;
    }


    .store-footer__inner
    .s-social-list {

        gap: 4px !important;

        margin: 3px 0 0 !important;
    }


    .store-footer__inner
    .s-social-link a {

        width: 23px !important;
        height: 23px !important;

        border-radius: 6px !important;
    }


    .store-footer__inner
    .s-social-icon,

    .store-footer__inner
    .s-social-icon svg {

        width: 11px !important;
        height: 11px !important;
    }


    .store-footer__inner
    salla-apps-icons {

        grid-column: 1 / -1 !important;

        margin: 0 !important;
    }


    .store-footer__inner
    salla-apps-icons:empty {

        display: none !important;
    }

}