@charset "UTF-8";

/* =====================================================
   ARWAD FOOTER — Custom Footer (Dynamic Menus)
   ===================================================== */

/* =====================================================
   1. Hide Divi Default Footer
   ===================================================== */
#main-footer,
.et-l--footer,
.et-l.et-l--footer {
    display: none !important;
}

/* Hide footer in Divi builder parent frame (JS adds this class) */
body.arwad-is-builder-parent .arwad-footer {
    display: none !important;
}

/* =====================================================
   2. Footer Main Container
   ===================================================== */
.arwad-footer {
    background: var(--color-primary-dark, #2a0e30);
    color: rgba(255, 255, 255, 0.8);
    direction: rtl;
    font-family: var(--font-body, 'Noto Naskh Arabic', serif);
    position: relative;
}

.arwad-footer *,
.arwad-footer *::before,
.arwad-footer *::after {
    box-sizing: border-box;
}

/* =====================================================
   3. Footer Content Grid (columns set inline by PHP)
   ===================================================== */
.arwad-footer__content {
    max-width: var(--container-lg, 1400px);
    margin: 0 auto;
    padding: var(--space-16, 4rem) var(--section-x, 40px) var(--space-12, 3rem);
    display: grid;
    gap: var(--space-10, 2.5rem);
}

/* =====================================================
   4. Logo & Description Column
   ===================================================== */
.arwad-footer__brand {
    display: flex;
    flex-direction: column;
    gap: var(--space-4, 1rem);
}

.arwad-footer__logo {
    display: inline-flex;
    align-items: center;
    text-decoration: none;
}

.arwad-footer__logo img {
    max-height: 60px;
    width: auto;
    filter: brightness(0) invert(1);
    transition: opacity var(--transition-fast, 150ms ease);
}

.arwad-footer__logo:hover img {
    opacity: 0.8;
}

/* Fallback text logo */
.arwad-footer__logo-text {
    font-family: var(--font-heading, 'Cairo', sans-serif);
    font-size: var(--text-2xl, 1.5rem);
    font-weight: var(--weight-bold, 700);
    color: var(--color-text-light, #fff);
    text-decoration: none;
}

.arwad-footer__logo-text span {
    color: var(--color-accent, #A54055);
}

.arwad-footer__tagline {
    font-size: var(--text-base, 1rem);
    line-height: var(--leading-relaxed, 1.8);
    color: rgba(255, 255, 255, 0.6);
    max-width: 280px;
}

/* =====================================================
   5. Menu Columns (wp_nav_menu output)
   ===================================================== */
.arwad-footer__heading {
    font-family: var(--font-heading, 'Cairo', sans-serif);
    font-size: var(--text-lg, 1.125rem);
    font-weight: var(--weight-semibold, 600);
    color: var(--color-text-light, #fff);
    margin: 0 0 var(--space-5, 1.25rem);
    position: relative;
    padding-bottom: var(--space-3, 0.75rem);
}

.arwad-footer__heading::after {
    content: '';
    position: absolute;
    bottom: 0;
    right: 0;
    width: 40px;
    height: 2px;
    background: var(--color-accent, #A54055);
    border-radius: 1px;
}

/* wp_nav_menu generates <ul class="arwad-footer__links"> with <li><a> */
.arwad-footer__links {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-3, 0.75rem);
}

.arwad-footer__links li {
    margin: 0;
    padding: 0;
}

.arwad-footer__links a {
    color: rgba(255, 255, 255, 0.7);
    text-decoration: none;
    font-size: var(--text-base, 1rem);
    transition: color var(--transition-fast, 150ms ease), padding-right var(--transition-fast, 150ms ease);
    display: inline-block;
}

.arwad-footer__links a:hover {
    color: var(--color-accent-light, #c25a6e);
    padding-right: var(--space-2, 0.5rem);
}

/* =====================================================
   6. Contact Column
   ===================================================== */
.arwad-footer__contact-list {
    list-style: none;
    margin: 0 0 var(--space-6, 1.5rem);
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-3, 0.75rem);
}

.arwad-footer__contact-item {
    display: flex;
    align-items: center;
    gap: var(--space-3, 0.75rem);
}

.arwad-footer__contact-icon {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    fill: var(--color-accent, #A54055);
}

.arwad-footer__contact-item a,
.arwad-footer__contact-item span {
    color: rgba(255, 255, 255, 0.7);
    text-decoration: none;
    font-size: var(--text-base, 1rem);
    transition: color var(--transition-fast, 150ms ease);
}

.arwad-footer__contact-item a[dir="ltr"] {
    direction: ltr;
    unicode-bidi: embed;
}

.arwad-footer__contact-item a:hover {
    color: var(--color-accent-light, #c25a6e);
}

/* =====================================================
   7. Social Icons
   ===================================================== */
.arwad-footer__social-label {
    font-family: var(--font-heading, 'Cairo', sans-serif);
    font-size: var(--text-sm, 0.875rem);
    font-weight: var(--weight-medium, 500);
    color: rgba(255, 255, 255, 0.5);
    margin-bottom: var(--space-3, 0.75rem);
}

.arwad-footer__social {
    display: flex;
    gap: var(--space-3, 0.75rem);
}

.arwad-footer__social-link {
    width: 40px;
    height: 40px;
    border-radius: var(--radius-md, 8px);
    background: rgba(255, 255, 255, 0.08);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background var(--transition-fast, 150ms ease), transform var(--transition-fast, 150ms ease);
    text-decoration: none;
}

.arwad-footer__social-link:hover {
    background: rgba(255, 255, 255, 0.18);
    transform: translateY(-2px);
}

.arwad-footer__social-link svg {
    width: 18px;
    height: 18px;
    fill: var(--color-text-light, #fff);
}

/* =====================================================
   8. Bottom Bar
   ===================================================== */
.arwad-footer__bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.arwad-footer__bottom-inner {
    max-width: var(--container-lg, 1400px);
    margin: 0 auto;
    padding: var(--space-5, 1.25rem) var(--section-x, 40px);
    display: flex;
    justify-content: center;
    align-items: center;
}

.arwad-footer__copyright {
    font-family: var(--font-heading, 'Cairo', sans-serif);
    font-size: var(--text-sm, 0.875rem);
    color: rgba(255, 255, 255, 0.4);
}

/* =====================================================
   9. Responsive
   ===================================================== */

/* Tablet */
@media (max-width: 980px) {
    .arwad-footer__content {
        grid-template-columns: 1fr 1fr !important;
        gap: var(--space-8, 2rem);
    }

    .arwad-footer__brand {
        grid-column: 1 / -1;
    }
}

/* Mobile */
@media (max-width: 600px) {
    .arwad-footer__content {
        grid-template-columns: 1fr !important;
        gap: var(--space-6, 1.5rem);
        padding: var(--space-10, 2.5rem) var(--space-6, 1.5rem) var(--space-8, 2rem);
    }

    .arwad-footer__brand {
        text-align: center;
        align-items: center;
    }

    .arwad-footer__nav,
    .arwad-footer__contact {
        text-align: center;
    }

    .arwad-footer__tagline {
        max-width: 100%;
    }

    .arwad-footer__heading,
    .arwad-footer__social-label {
        text-align: center;
    }

    .arwad-footer__links,
    .arwad-footer__contact-list {
        align-items: center;
    }

    .arwad-footer__contact-item {
        justify-content: center;
    }

    .arwad-footer__heading::after {
        right: 50%;
        transform: translateX(50%);
    }

    .arwad-footer__links a:hover {
        padding-right: 0;
    }

    .arwad-footer__social {
        justify-content: center;
    }

    .arwad-footer__bottom-inner {
        padding: var(--space-4, 1rem) var(--space-6, 1.5rem);
    }
}