﻿:root {
    --navy: #0F2F53;
    --emerald: #248874;
    --gray: #8A9297;
    --offwhite: #F6F7F8;
}

/* النص العام */
body {
    color: var(--navy) !important;
    background-color: #fff;
}

/* كل العناوين */
h1, h2, h3, h4, h5, h6,
.section-title h3,
.section-title h2,
.section-title h4,
.hero-content-wrapper h2,
.hero-content-wrapper h4,
.about-content-wrapper h3,
.single-feature .content h5,
.single-team .info h6,
.footer-widget h6 {
    color: var(--navy) !important;
}

/* الفقرات والنصوص */
p,
span,
li,
label,
.text,
.desc,
.single-feature .content p,
.about-content-wrapper p,
.contact-section p,
.footer-widget p {
    color: var(--navy) !important;
}

/* اللينكات */
a,
.navbar-nav .nav-item a,
.page-scroll,
.footer a,
.links li a {
    color: var(--navy) !important;
    transition: all 0.3s ease;
}

    a:hover,
    .navbar-nav .nav-item a:hover,
    .page-scroll:hover,
    .footer a:hover,
    .links li a:hover {
        color: var(--emerald) !important;
    }

    /* اللينك النشط */
    .navbar-nav .nav-item a.active,
    .page-scroll.active {
        color: var(--navy) !important;
    }

/* الأيقونات */
.icon i,
.single-feature .icon i,
.single-item .icon i,
.socials li a i,
.lni {
    color: var(--navy) !important;
    transition: all 0.3s ease;
}

    .icon i:hover,
    .single-feature .icon i:hover,
    .single-item .icon i:hover,
    .socials li a:hover i,
    .lni:hover {
        color: var(--emerald) !important;
    }

/* الأزرار */
.button,
.button.button-sm,
.button.button-lg,
.btn,
button,
a.button {
    background-color: var(--navy) !important;
    border-color: var(--navy) !important;
    color: #fff !important;
    transition: all 0.3s ease;
}

    .button:hover,
    .button.button-sm:hover,
    .button.button-lg:hover,
    .btn:hover,
    button:hover,
    a.button:hover {
        background-color: var(--emerald) !important;
        border-color: var(--emerald) !important;
        color: #fff !important;
    }

    /* لو في نص أسود inline داخل زر */
    .button[style],
    a.button[style] {
        color: #fff !important;
    }

/* الفوتر */
.footer {
    background-color: var(--navy) !important;
}

    .footer,
    .footer p,
    .footer h6,
    .footer a,
    .footer .desc,
    .footer .links li a,
    .footer .socials li a i {
        color: #fff !important;
    }

        .footer a:hover,
        .footer .links li a:hover,
        .footer  a:hover i {
            color: var(--emerald) !important;
        }

/* scroll top */
.scroll-top {
    background-color: #9c9ea1 !important;
    color: #fff !important;
}

.scroll-top:hover {
    background-color: var(--emerald) !important;
    color: #fff !important;

}



/* ================= HEADER ================= */
.header.header-2 {
    background: linear-gradient(90deg, #0f5c63 0%, #0F2F53 100%) !important;
}

    .header.header-2 .navbar-area {
        background: transparent !important;
        box-shadow: none !important;
    }

    .header.header-2 .navbar {
        min-height: 90px;
        align-items: center;
    }

        /* روابط الهيدر فوق الخلفية الغامقة */
        .header.header-2 .navbar .navbar-nav .nav-item a,
        .header.header-2 .navbar .navbar-nav .nav-item a.page-scroll {
            color: #ffffff !important;
        }

            .header.header-2 .navbar .navbar-nav .nav-item a:hover,
            .header.header-2 .navbar .navbar-nav .nav-item a.active,
            .header.header-2 .navbar .navbar-nav .nav-item a.page-scroll:hover {
                color: #d7f3ec !important;
            }

    /* زر الهيدر */
    .header.header-2 .button,
    .header.header-2 .button.button-sm,
    .header.header-2 .button.button-lg {
        background-color: #ffffff !important;
        border-color: #ffffff !important;
        color: #0F2F53 !important;
    }

        .header.header-2 .button:hover,
        .header.header-2 .button.button-sm:hover,
        .header.header-2 .button.button-lg:hover {
            background-color: #248874 !important;
            border-color: #248874 !important;
            color: #ffffff !important;
        }

    /* اللوجو */
    .header.header-2 .navbar-brand {
        display: flex;
        align-items: center;
        padding: 0;
        margin: 0;
    }

        .header.header-2 .navbar-brand img {
            max-height: 68px;
            width: auto;
            object-fit: contain;
            display: block;
        }

/* لو بدك أصغر أكثر */
@media (max-width: 991px) {
    .header.header-2 .navbar-brand img {
        max-height: 54px;
    }
}

/* ================= HEADER FINAL ================= */

/* الهيدر الأساسي */
.header.header-2 {
    background: linear-gradient(90deg, #0f5c63 0%, #0F2F53 100%) !important;
}

    .header.header-2 .navbar-area {
        background: transparent !important;
        box-shadow: none !important;
    }

    .header.header-2 .navbar {
        min-height: 90px;
        align-items: center;
    }

        /* روابط الهيدر على الديسكتوب: أبيض دائمًا وبدون هوفر أخضر */
        .header.header-2 .navbar .navbar-nav .nav-item a,
        .header.header-2 .navbar .navbar-nav .nav-item a.page-scroll,
        .header.header-2 .navbar .navbar-nav .nav-item a.active {
            color: #ffffff !important;
        }

            .header.header-2 .navbar .navbar-nav .nav-item a:hover,
            .header.header-2 .navbar .navbar-nav .nav-item a.page-scroll:hover,
            .header.header-2 .navbar .navbar-nav .nav-item a.active:hover {
                color: #ffffff !important;
            }

    /* اللوجو */
    .header.header-2 .navbar-brand {
        display: flex;
        align-items: center;
        padding: 0;
        margin: 0;
    }

        .header.header-2 .navbar-brand img {
            max-height: 68px;
            width: auto;
            object-fit: contain;
            display: block;
        }

/* حاوية الأزرار */
.header-actions {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-right: 18px;
}

/* أزرار الهيدر */
.header.header-2 .header-btn {
    background-color: #ffffff !important;
    border-color: #ffffff !important;
    color: #0F2F53 !important;
    white-space: nowrap;
}

    .header.header-2 .header-btn:hover {
        background-color: #ffffff !important;
        border-color: #ffffff !important;
        color: #0F2F53 !important;
    }

/* زر الثلث شحطات */
.header.header-2 .navbar-toggler {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0;
}

    .header.header-2 .navbar-toggler:hover,
    .header.header-2 .navbar-toggler:focus,
    .header.header-2 .navbar-toggler:active {
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
        outline: none !important;
    }

    /* خطوط زر الموبايل */
    .header.header-2 .navbar-toggler .toggler-icon {
        background-color: #ffffff !important;
    }

/* ================= MOBILE ================= */
@media (max-width: 991px) {

    /* صغر اللوجو بالموبايل */
    .header.header-2 .navbar-brand img {
        max-height: 54px;
    }

    /* المينيو المفتوح يصير أبيض */
    .header.header-2 .navbar-collapse {
        background: #ffffff !important;
        padding: 20px;
        margin-top: 15px;
        border-radius: 12px;
    }

        /* روابط المينيو المفتوح تصير كحلي */
        .header.header-2 .navbar-collapse .navbar-nav .nav-item a,
        .header.header-2 .navbar-collapse .navbar-nav .nav-item a.page-scroll,
        .header.header-2 .navbar-collapse .navbar-nav .nav-item a.active {
            color: #0F2F53 !important;
        }

            .header.header-2 .navbar-collapse .navbar-nav .nav-item a:hover,
            .header.header-2 .navbar-collapse .navbar-nav .nav-item a.page-scroll:hover,
            .header.header-2 .navbar-collapse .navbar-nav .nav-item a.active:hover {
                color: #0F2F53 !important;
            }

    /* الأزرار تظهر بالموبايل تحت القائمة */
    .header-actions {
        display: flex !important;
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
        margin-right: 0;
        margin-top: 15px;
        width: 100%;
    }

    .header.header-2 .header-btn {
        display: flex !important;
        justify-content: center;
        align-items: center;
        width: 100%;
        background-color: #0F2F53 !important;
        border-color: #0F2F53 !important;
        color: #ffffff !important;
    }

        .header.header-2 .header-btn:hover {
            background-color: #0F2F53 !important;
            border-color: #0F2F53 !important;
            color: #ffffff !important;
        }

    /* الثلث شحطات تبقى بيضاء خارج القائمة */
    .header.header-2 .navbar-toggler .toggler-icon {
        background-color: #ffffff !important;
    }
}
/* ================= CONTACT INFO ================= */
.contact-info-list {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.contact-info-item {
    display: flex;
    align-items: center;
    gap: 18px;
    direction: rtl;
    text-align: right;
}

    .contact-info-item .icon {
        width: 60px;
        height: 60px;
        min-width: 60px;
        border-radius: 50%;
        background-color: #3b82f6;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
    }

        .contact-info-item .icon i {
            color: #0F2F53 !important;
            font-size: 24px;
            line-height: 1;
        }

    .contact-info-item .text {
        flex: 1;
        min-width: 0;
    }

        .contact-info-item .text p {
            margin: 0;
            color: var(--navy) !important;
            font-size: 28px;
            line-height: 1.8;
            word-break: break-word;
        }

/* تواصل معنا - الشاشات المتوسطة */
@media (max-width: 991px) {
    .contact-info-list {
        gap: 20px;
    }

    .contact-info-item {
        gap: 14px;
        align-items: center;
    }

        .contact-info-item .icon {
            width: 54px;
            height: 54px;
            min-width: 54px;
        }

            .contact-info-item .icon i {
                font-size: 22px;
            }

        .contact-info-item .text p {
            font-size: 18px;
            line-height: 1.7;
        }
}

/* تواصل معنا - الموبايل */
@media (max-width: 575px) {
    .contact-info-item {
        gap: 12px;
        align-items: flex-start;
    }

        .contact-info-item .icon {
            width: 48px;
            height: 48px;
            min-width: 48px;
            margin-top: 4px;
        }

            .contact-info-item .icon i {
                font-size: 20px;
            }

        .contact-info-item .text p {
            font-size: 16px;
            line-height: 1.8;
        }
}

