
/* =========================================================
   LA BELLA — EASY ORDERS DEFAULT FOOTER
   Paste this entire <style> block inside Global Header.
========================================================= */

footer.bg-white.bg-skin-primary.text-skin-a11y {
    --lbf-plum:#3A123D;
    --lbf-purple:#6D0482;
    --lbf-purple-light:#A55AB2;
    --lbf-champagne:#D4AF37;
    --lbf-champagne-soft:#EBCF7B;
    --lbf-blush:#F7EEF2;
    --lbf-white:#FFFFFF;
    --lbf-muted:rgba(255,255,255,.68);
    --lbf-line:rgba(235,207,123,.24);

    position:relative;
    isolation:isolate;
    overflow:hidden;
    direction:rtl;
    color:var(--lbf-white) !important;
    background:
        radial-gradient(circle at 12% 20%, rgba(165,90,178,.28), transparent 31%),
        radial-gradient(circle at 88% 78%, rgba(212,175,55,.16), transparent 30%),
        linear-gradient(135deg, #2B0C30 0%, var(--lbf-plum) 46%, #54145D 100%) !important;
    border-top:1px solid rgba(212,175,55,.45);
    box-shadow:0 -18px 55px rgba(58,18,61,.12);
    font-family:"Tajawal","Segoe UI",Arial,sans-serif;
}

footer.bg-white.bg-skin-primary.text-skin-a11y::before {
    content:"";
    position:absolute;
    z-index:-1;
    inset:0;
    pointer-events:none;
    background:
        linear-gradient(115deg, transparent 0 42%, rgba(255,255,255,.025) 42% 43%, transparent 43% 100%),
        repeating-radial-gradient(circle at 100% 0, transparent 0 34px, rgba(235,207,123,.035) 35px 36px);
}

footer.bg-white.bg-skin-primary.text-skin-a11y::after {
    content:"LA BELLA";
    position:absolute;
    z-index:-1;
    inset-inline-start:-18px;
    bottom:-48px;
    color:rgba(255,255,255,.035);
    font-family:Georgia,"Times New Roman",serif;
    font-size:clamp(86px,14vw,210px);
    font-weight:700;
    line-height:.8;
    letter-spacing:.04em;
    white-space:nowrap;
    pointer-events:none;
    user-select:none;
}

footer.bg-white.bg-skin-primary.text-skin-a11y > div {
    position:relative;
    z-index:2;
    width:min(1500px,94%) !important;
    max-width:none !important;
    margin-inline:auto !important;
    padding-top:clamp(52px,6vw,86px) !important;
    padding-bottom:max(56px,calc(36px + env(safe-area-inset-bottom))) !important;
}

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

footer.bg-white.bg-skin-primary.text-skin-a11y > div > div.hidden {
    grid-template-columns:minmax(270px,1.35fr) minmax(170px,.78fr) minmax(190px,.9fr) minmax(240px,1.12fr) !important;
    gap:clamp(28px,4vw,72px) !important;
    align-items:start;
}

footer.bg-white.bg-skin-primary.text-skin-a11y > div > div.hidden > div {
    min-width:0;
}

/* Brand panel built inside Easy Orders' first empty column */
footer.bg-white.bg-skin-primary.text-skin-a11y > div > div.hidden > div:first-child {
    display:flex;
    flex-direction:column;
    justify-content:center;
    min-height:218px;
    margin:0 !important;
    padding:30px;
    border:1px solid var(--lbf-line);
    border-radius:26px;
    background:
        linear-gradient(145deg, rgba(255,255,255,.105), rgba(255,255,255,.035));
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.12),
        0 24px 55px rgba(18,4,22,.16);
    backdrop-filter:blur(16px);
    -webkit-backdrop-filter:blur(16px);
}

footer.bg-white.bg-skin-primary.text-skin-a11y > div > div.hidden > div:first-child::before {
    content:"LA BELLA";
    display:block;
    color:var(--lbf-champagne-soft);
    font-family:Georgia,"Times New Roman",serif;
    font-size:clamp(33px,3.25vw,54px);
    font-weight:700;
    line-height:1;
    letter-spacing:.08em;
    text-align:start;
    text-shadow:0 7px 28px rgba(212,175,55,.16);
}

footer.bg-white.bg-skin-primary.text-skin-a11y > div > div.hidden > div:first-child::after {
    content:"PERFUME  ·  CAIRO\Aعطر يترك أثرًا قبل أن يُروى.";
    display:block;
    margin-top:17px;
    color:var(--lbf-muted);
    font-size:13px;
    font-weight:600;
    line-height:2;
    letter-spacing:.12em;
    white-space:pre-line;
    text-align:start;
}

footer.bg-white.bg-skin-primary.text-skin-a11y h3 {
    position:relative;
    width:max-content;
    max-width:100%;
    margin:4px 0 25px !important;
    padding-bottom:12px;
    color:var(--lbf-white) !important;
    font-size:16px !important;
    font-weight:800 !important;
    line-height:1.4;
    text-wrap:balance;
}

footer.bg-white.bg-skin-primary.text-skin-a11y h3::after {
    content:"";
    position:absolute;
    inset-inline-start:0;
    bottom:0;
    width:34px;
    height:2px;
    border-radius:999px;
    background:linear-gradient(90deg,var(--lbf-champagne),var(--lbf-champagne-soft));
    box-shadow:0 0 18px rgba(212,175,55,.3);
}

footer.bg-white.bg-skin-primary.text-skin-a11y ul {
    margin:0;
    padding:0;
    list-style:none;
}

footer.bg-white.bg-skin-primary.text-skin-a11y li {
    position:relative;
    margin:0 !important;
}

footer.bg-white.bg-skin-primary.text-skin-a11y li + li {
    margin-top:4px !important;
}

footer.bg-white.bg-skin-primary.text-skin-a11y li a {
    position:relative;
    display:flex;
    align-items:center;
    min-height:42px;
    padding:8px 19px 8px 8px;
    border-radius:12px;
    color:var(--lbf-muted) !important;
    font-size:14px;
    font-weight:600;
    line-height:1.55;
    text-decoration:none !important;
    overflow-wrap:anywhere;
    touch-action:manipulation;
    -webkit-tap-highlight-color:rgba(235,207,123,.14);
    transition:
        color 180ms ease,
        background-color 180ms ease,
        transform 180ms ease;
}

footer.bg-white.bg-skin-primary.text-skin-a11y li a::before {
    content:"";
    position:absolute;
    inset-inline-start:5px;
    width:5px;
    height:5px;
    border-radius:50%;
    background:var(--lbf-champagne);
    box-shadow:0 0 0 4px rgba(212,175,55,.09);
    transition:transform 180ms ease, box-shadow 180ms ease;
}

footer.bg-white.bg-skin-primary.text-skin-a11y li a:hover {
    color:var(--lbf-white) !important;
    background:rgba(255,255,255,.065);
    transform:translateX(-4px);
}

footer.bg-white.bg-skin-primary.text-skin-a11y li a:hover::before {
    transform:scale(1.25);
    box-shadow:0 0 0 6px rgba(212,175,55,.1);
}

footer.bg-white.bg-skin-primary.text-skin-a11y a:focus-visible,
footer.bg-white.bg-skin-primary.text-skin-a11y button:focus-visible {
    outline:3px solid rgba(235,207,123,.82);
    outline-offset:4px;
}

/* Promise panel built inside Easy Orders' last empty column */
footer.bg-white.bg-skin-primary.text-skin-a11y > div > div.hidden > div:last-child {
    display:flex !important;
    flex-direction:column;
    justify-content:center;
    min-height:218px;
    gap:0 !important;
    padding:28px;
    border:1px solid rgba(212,175,55,.22);
    border-radius:26px;
    background:
        radial-gradient(circle at 85% 0, rgba(212,175,55,.17), transparent 42%),
        rgba(255,255,255,.045);
}

footer.bg-white.bg-skin-primary.text-skin-a11y > div > div.hidden > div:last-child::before {
    content:"THE ART OF SCENT";
    display:block;
    color:var(--lbf-champagne-soft);
    font-family:Georgia,"Times New Roman",serif;
    font-size:19px;
    font-weight:700;
    letter-spacing:.13em;
    line-height:1.4;
    text-align:start;
}

footer.bg-white.bg-skin-primary.text-skin-a11y > div > div.hidden > div:last-child::after {
    content:"عطور مختارة بعناية\Aجودة تليق بحضورك\Aتوصيل سريع وآمن";
    display:block;
    margin-top:18px;
    padding-top:18px;
    border-top:1px solid var(--lbf-line);
    color:var(--lbf-muted);
    font-size:13px;
    font-weight:600;
    line-height:2.1;
    white-space:pre-line;
    text-align:start;
}

/* =========================
   MOBILE ACCORDION
========================= */

footer.bg-white.bg-skin-primary.text-skin-a11y > div > div[class~="lg:hidden"] {
    position:relative;
}

footer.bg-white.bg-skin-primary.text-skin-a11y > div > div[class~="lg:hidden"] > div:first-child {
    display:flex;
    flex-direction:column;
    justify-content:center;
    min-height:166px;
    margin:0 0 26px !important;
    padding:25px 22px;
    border:1px solid var(--lbf-line);
    border-radius:22px;
    background:linear-gradient(145deg,rgba(255,255,255,.1),rgba(255,255,255,.035));
    box-shadow:inset 0 1px 0 rgba(255,255,255,.1);
}

footer.bg-white.bg-skin-primary.text-skin-a11y > div > div[class~="lg:hidden"] > div:first-child::before {
    content:"LA BELLA";
    color:var(--lbf-champagne-soft);
    font-family:Georgia,"Times New Roman",serif;
    font-size:37px;
    font-weight:700;
    line-height:1;
    letter-spacing:.08em;
}

footer.bg-white.bg-skin-primary.text-skin-a11y > div > div[class~="lg:hidden"] > div:first-child::after {
    content:"PERFUME  ·  CAIRO\Aعطر يترك أثرًا قبل أن يُروى.";
    margin-top:14px;
    color:var(--lbf-muted);
    font-size:12px;
    font-weight:600;
    line-height:1.9;
    letter-spacing:.08em;
    white-space:pre-line;
}

footer.bg-white.bg-skin-primary.text-skin-a11y > div > div[class~="lg:hidden"] > div[class*="border-t"] {
    border-color:var(--lbf-line) !important;
}

footer.bg-white.bg-skin-primary.text-skin-a11y > div > div[class~="lg:hidden"] button {
    min-height:62px;
    padding:17px 4px !important;
    color:var(--lbf-white) !important;
    text-align:start !important;
    touch-action:manipulation;
    -webkit-tap-highlight-color:rgba(235,207,123,.12);
}

footer.bg-white.bg-skin-primary.text-skin-a11y > div > div[class~="lg:hidden"] button h3 {
    margin:0 !important;
    padding:0 !important;
    font-size:15px !important;
}

footer.bg-white.bg-skin-primary.text-skin-a11y > div > div[class~="lg:hidden"] button h3::after {
    display:none;
}

footer.bg-white.bg-skin-primary.text-skin-a11y > div > div[class~="lg:hidden"] button svg {
    width:21px;
    height:21px;
    color:var(--lbf-champagne-soft);
    transform-origin:center;
    transition:transform 200ms ease, color 200ms ease;
}

footer.bg-white.bg-skin-primary.text-skin-a11y > div > div[class~="lg:hidden"] button[aria-expanded="true"] {
    color:var(--lbf-champagne-soft) !important;
}

footer.bg-white.bg-skin-primary.text-skin-a11y > div > div[class~="lg:hidden"] button[aria-expanded="true"] svg {
    color:var(--lbf-white);
    transform:rotate(90deg);
}

footer.bg-white.bg-skin-primary.text-skin-a11y > div > div[class~="lg:hidden"] ul {
    padding:0 4px 17px !important;
}

footer.bg-white.bg-skin-primary.text-skin-a11y > div > div[class~="lg:hidden"] li a {
    min-height:45px;
}

footer.bg-white.bg-skin-primary.text-skin-a11y > div > div[class~="lg:hidden"] > div:last-child {
    display:flex !important;
    min-height:86px;
    margin-top:28px !important;
    padding:19px 20px;
    border:1px solid rgba(212,175,55,.2);
    border-radius:18px;
    background:rgba(255,255,255,.04);
}

footer.bg-white.bg-skin-primary.text-skin-a11y > div > div[class~="lg:hidden"] > div:last-child::before {
    content:"عطور مختارة بعناية  ·  توصيل سريع وآمن";
    margin:auto;
    color:var(--lbf-muted);
    font-size:12px;
    font-weight:700;
    line-height:1.8;
    text-align:center;
    text-wrap:balance;
}

/* =========================
   RESPONSIVE REFINEMENTS
========================= */

@media (max-width:1100px) and (min-width:1024px) {
    footer.bg-white.bg-skin-primary.text-skin-a11y > div > div.hidden {
        grid-template-columns:1.2fr .8fr .95fr 1fr !important;
        gap:28px !important;
    }

    footer.bg-white.bg-skin-primary.text-skin-a11y > div > div.hidden > div:first-child,
    footer.bg-white.bg-skin-primary.text-skin-a11y > div > div.hidden > div:last-child {
        padding:23px;
    }
}

@media (max-width:767px) {
    footer.bg-white.bg-skin-primary.text-skin-a11y > div {
        width:100% !important;
        padding-inline:18px !important;
        padding-top:44px !important;
    }

    footer.bg-white.bg-skin-primary.text-skin-a11y::after {
        inset-inline-start:-6px;
        bottom:-12px;
        font-size:72px;
    }
}

@media (prefers-reduced-motion:reduce) {
    footer.bg-white.bg-skin-primary.text-skin-a11y *,
    footer.bg-white.bg-skin-primary.text-skin-a11y *::before,
    footer.bg-white.bg-skin-primary.text-skin-a11y *::after {
        scroll-behavior:auto !important;
        animation-duration:.01ms !important;
        animation-iteration-count:1 !important;
        transition-duration:.01ms !important;
    }
}


