/* ═══════════════════════════════════════════════════════════
   desktop-shell.css — وضع الكمبيوتر (من 900px وأعلى)
   ═══════════════════════════════════════════════════════════ */

:root {
    --fp-bottom-nav-height: 72px;
    --fp-safe-bottom: env(safe-area-inset-bottom, 0px);
}

.fp-header-nav, .fp-header-profile, .fp-footer, .fp-totop { display: none; }

@media (min-width: 900px) {
    :root { --fp-bottom-nav-height: 0px; }

    .fp-bottom-nav { display: none !important; }
    .fp-app { padding-bottom: 8px; }

    /* ═══ Header ═══ */
    .fp-header-inner { max-width: 1280px !important; margin: 0 auto !important; padding: 0 24px !important; }
    .fp-header-nav { display: flex !important; align-items: center; gap: 4px; margin-inline-start: 20px; }
    .fp-header-nav a {
        display: inline-flex; align-items: center; height: 40px; padding: 0 14px;
        font-size: 14px; font-weight: 700; color: var(--fp-text-2); text-decoration: none;
        border-radius: var(--fp-radius-full); transition: color .2s, background .2s;
    }
    .fp-header-nav a:hover { color: var(--fp-text); background: var(--fp-surface-2); }
    .fp-header-nav a.active { color: var(--fp-primary); background: var(--fp-primary-light); }
    .fp-header-profile { display: flex !important; }
    .fp-header-actions { margin-inline-start: auto; }
    .fp-header-spacer { flex: 1; }

    /* ═══ Footer (Perfect Fix) ═══ */
    .fp-footer {
        display: block !important;
        width: 100% !important;
        margin-top: 40px !important;
        padding: 48px 0 24px !important;
        background: #0A0B10 !important;
        border-top: 1px solid rgba(233, 211, 160, 0.12) !important;
        direction: rtl !important;
        text-align: right !important;
        box-sizing: border-box !important;
    }
    .fp-footer-inner {
        max-width: 1280px !important; margin: 0 auto !important;
        padding: 0 24px !important; width: 100% !important;
        display: flex !important; flex-direction: column !important; gap: 32px !important;
    }
    .fp-footer-grid {
        display: grid !important;
        grid-template-columns: 1.5fr 1fr 1fr 1.5fr !important;
        gap: 40px !important; width: 100% !important;
    }
    .fp-footer-col { display: block !important; }

    /* الشعار */
    .fp-footer-logo {
        display: inline-flex !important; align-items: center !important;
        gap: 10px !important; margin-bottom: 16px !important; text-decoration: none !important;
    }
    .fp-footer-logo-mark {
        width: 44px !important; height: 44px !important; border-radius: 14px !important;
        background: linear-gradient(135deg, #E9D3A0 0%, #CFA24D 100%) !important;
        color: #0A0B10 !important; display: grid !important; place-items: center !important;
        font-weight: 900 !important; font-size: 14px !important;
    }
    .fp-footer-logo-text {
        font-family: 'Tajawal', sans-serif !important; font-size: 24px !important;
        font-weight: 700 !important; color: #F5F1E8 !important;
    }
    .fp-footer-logo-text span { color: #DCBB78 !important; }

    .fp-footer-desc {
        font-size: 13.5px !important; line-height: 1.8 !important;
        color: #B8B3A8 !important; margin-bottom: 20px !important; max-width: 340px !important;
    }
    .fp-footer-wa {
        display: inline-flex !important; align-items: center !important; gap: 8px !important;
        height: 42px !important; padding: 0 18px !important;
        border: 1px solid rgba(207, 162, 77, .5) !important; border-radius: 999px !important;
        color: #DCBB78 !important; font-size: 13.5px !important; font-weight: 800 !important;
        text-decoration: none !important; transition: all .2s !important;
    }
    .fp-footer-wa:hover { background: #CFA24D !important; color: #0A0B10 !important; }

    /* العناوين والروابط */
    .fp-footer-title {
        font-size: 17px !important; font-weight: 700 !important;
        color: #F5F1E8 !important; margin-bottom: 18px !important;
    }
    .fp-footer-links {
        list-style: none !important; padding: 0 !important; margin: 0 !important;
        display: flex !important; flex-direction: column !important; gap: 8px !important;
    }
    .fp-footer-links a {
        color: #B8B3A8 !important; text-decoration: none !important;
        font-size: 13.5px !important; font-weight: 600 !important;
        display: flex !important; align-items: center !important; gap: 8px !important;
        transition: color 0.2s !important;
    }
    .fp-footer-links a i { font-size: 9px !important; color: #7A7568 !important; }
    .fp-footer-links a:hover { color: #DCBB78 !important; }
    .fp-footer-links a:hover i { color: #DCBB78 !important; }

    /* التواصل */
    .fp-footer-contact { display: flex !important; flex-direction: column !important; gap: 16px !important; }
    .fp-footer-contact-item {
        display: flex !important; align-items: center !important; gap: 12px !important;
        text-decoration: none !important; color: inherit !important;
    }
    .fp-footer-contact-ico {
        width: 42px !important; height: 42px !important; border-radius: 12px !important;
        background: rgba(207, 162, 77, 0.12) !important;
        border: 1px solid rgba(207, 162, 77, 0.22) !important;
        color: #DCBB78 !important; display: flex !important; align-items: center !important;
        justify-content: center !important; font-size: 15px !important; flex-shrink: 0 !important;
    }
    .fp-footer-contact-body { display: flex !important; flex-direction: column !important; gap: 3px !important; }
    .fp-footer-contact-label { font-size: 11.5px !important; color: #8C8678 !important; font-weight: 600 !important; }
    .fp-footer-contact-value { font-size: 13.5px !important; color: #F5F1E8 !important; font-weight: 700 !important; }

    /* طرق الدفع */
    .fp-footer-pay {
        display: flex !important; align-items: center !important; flex-wrap: wrap !important;
        gap: 14px !important; padding: 22px 0 !important;
        border-top: 1px solid rgba(233, 211, 160, 0.12) !important;
        border-bottom: 1px solid rgba(233, 211, 160, 0.12) !important;
    }
    .fp-footer-pay-label { font-size: 13px !important; font-weight: 700 !important; color: #B8B3A8 !important; }
    .fp-footer-pay-list { display: flex !important; flex-wrap: wrap !important; gap: 10px !important; }
    .fp-footer-pay-list span {
        display: inline-flex !important; align-items: center !important; gap: 7px !important;
        padding: 7px 14px !important; border: 1px solid rgba(233, 211, 160, .14) !important;
        border-radius: 999px !important; font-size: 12.5px !important; font-weight: 700 !important; color: #F5F1E8 !important;
    }
    .fp-footer-pay-list i { color: #DCBB78 !important; font-size: 12px !important; }

    /* الحقوق */
    .fp-footer-bottom {
        display: flex !important; justify-content: space-between !important;
        align-items: center !important; flex-wrap: wrap !important;
        padding-top: 24px !important; font-size: 13px !important; color: #8C8678 !important;
    }
    .fp-footer-bottom strong { color: #F5F1E8 !important; }

    /* زر العودة لأعلى */
    .fp-totop {
        position: fixed !important; bottom: 24px !important; inset-inline-end: 24px !important;
        z-index: 998 !important; width: 48px !important; height: 48px !important; border-radius: 50% !important;
        display: grid !important; place-items: center !important;
        background: rgba(21, 24, 36, .92) !important; border: 1px solid rgba(233, 211, 160, .25) !important;
        color: #DCBB78 !important; font-size: 15px !important; cursor: pointer !important;
        box-shadow: 0 12px 30px rgba(0, 0, 0, .4) !important;
        opacity: 0; visibility: hidden; transform: translateY(16px);
        transition: opacity .25s, transform .25s, visibility .25s, background .2s !important;
    }
    .fp-totop.visible { opacity: 1 !important; visibility: visible !important; transform: none !important; }
    .fp-totop:hover { background: #CFA24D !important; color: #0A0B10 !important; }
}

@media (min-width: 900px) and (max-width: 1099px) {
    .fp-footer-grid { grid-template-columns: 1fr 1fr !important; gap: 32px !important; }
    .fp-footer-brand { grid-column: 1 / -1 !important; }
}