/* =========================================================
   Arabic Font
   ========================================================= */

/* استبدل Cairo بـ Tajawal */
@import url('https://fonts.googleapis.com/css2?family=Tajawal:wght@400;500;700;800&display=swap');

html[lang="ar"] body,
html[lang="ar"] button,
html[lang="ar"] input,
html[lang="ar"] select,
html[lang="ar"] textarea,
html[lang="ar"] .navmenu,
html[lang="ar"] .navmenu a,
html[lang="ar"] h1,
html[lang="ar"] h2,
html[lang="ar"] h3,
html[lang="ar"] h4,
html[lang="ar"] h5,
html[lang="ar"] h6,
html[lang="ar"] p,
html[lang="ar"] span,
html[lang="ar"] a,
html[lang="ar"] label,
html[lang="ar"] li,
html[lang="ar"] small,
html[lang="ar"] strong {
    font-family: "Tajawal", sans-serif !important;
}


/* =========================================================
   Header Brand / Logo
   ========================================================= */

.dahim-brand {
    display: flex !important;
    align-items: center !important;
    gap: 14px;
    text-decoration: none;
    flex-shrink: 0;
}

.dahim-brand .dahim-logo {
    width: 58px;
    height: 58px;
    object-fit: contain;
    flex-shrink: 0;
}

.dahim-brand .sitename {
    margin: 0 !important;
    padding: 0 !important;
    font-weight: 700;
    line-height: 1.2;
    white-space: nowrap;
}

/* English */
html[lang="en"] .dahim-brand .sitename {
    font-family: "Montserrat", sans-serif !important;
    font-size: 21px;
    font-weight: 700;
}

/* Arabic */
html[lang="ar"] .dahim-brand {
    direction: rtl;
    gap: 16px; /* نزود المسافة بين اللوجو والاسم */
}

html[lang="ar"] .dahim-brand .sitename {
    font-family: "Tajawal", sans-serif !important;
    font-size: 17px;   /* أصغر علشان يبقى متناسق */
    font-weight: 800;
    line-height: 1.35;
    letter-spacing: 0;
    white-space: nowrap;
}

/* مسافة إضافية بسيطة بين النص واللوجو */
html[lang="ar"] .dahim-brand .dahim-logo {
    margin-left: 2px;
    margin-right: 0;
}


/* =========================================================
   Top Bar Contact Info
   ========================================================= */

.topbar .contact-info i {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px;
    font-style: normal;
}

/* مهم جدًا: الأيقونة نفسها تاخد مسافة سليمة */
.topbar .contact-info i::before {
    margin: 0 !important;
    display: inline-block;
    font-style: normal;
}

/* الإيميل والرقم */
.topbar .contact-info a,
.topbar .contact-info span {
    display: inline-block;
    line-height: 1.2;
}

/* العربي */
html[lang="ar"] .topbar .container {
    direction: rtl;
}

html[lang="ar"] .topbar .contact-info {
    display: flex;
    align-items: center;
    gap: 18px;
}

html[lang="ar"] .topbar .contact-info i {
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px;
}

/* نلغي ms-4 القديمة لأنها أحيانًا تعمل لخبطة في RTL */
html[lang="ar"] .topbar .contact-info .ms-4 {
    margin-right: 0 !important;
    margin-left: 0 !important;
}

/* السوشيال */
html[lang="ar"] .topbar .social-links {
    display: flex;
    align-items: center;
    gap: 14px;
}


/* =========================================================
   Language Button / Icons spacing
   ========================================================= */

[data-language-switch] {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px;
}

[data-language-switch] i {
    margin: 0 !important;
}


/* =========================================================
   Navigation tweaks in Arabic
   ========================================================= */

html[lang="ar"] .navmenu > ul {
    direction: rtl;
    align-items: center;
}

html[lang="ar"] .navmenu a {
    display: flex;
    align-items: center;
    gap: 4px;
}

html[lang="ar"] .navmenu .toggle-dropdown {
    margin-right: 4px !important;
    margin-left: 0 !important;
}


/* =========================================================
   Responsive
   ========================================================= */

@media (max-width: 991px) {
    html[lang="ar"] .dahim-brand .sitename {
        font-size: 15px;
    }

    .dahim-brand .dahim-logo {
        width: 50px;
        height: 50px;
    }
}

@media (max-width: 575px) {
    html[lang="ar"] .dahim-brand {
        gap: 10px;
    }

    html[lang="ar"] .dahim-brand .sitename {
        font-size: 13px;
        line-height: 1.3;
    }

    .dahim-brand .dahim-logo {
        width: 42px;
        height: 42px;
    }
}



/* =========================================================
   Shared Footer - Arabic / English Fixes
   ========================================================= */

/* كل عنصر Contact */
.footer .contact-item {
    display: flex !important;
    align-items: center !important;
    gap: 10px;
    margin-bottom: 12px;
}

/* الأيقونة */
.footer .contact-item > i {
    flex: 0 0 auto;
    width: 22px;
    margin: 0 !important;
    text-align: center;
}

/* النص / الرابط */
.footer .contact-item > span,
.footer .contact-item > a {
    margin: 0 !important;
}


/* =========================
   Arabic Footer
   ========================= */

html[lang="ar"] .footer {
    font-family: "Tajawal", sans-serif !important;
}

html[lang="ar"] .footer .brand-section {
    direction: rtl;
    text-align: right;
}

html[lang="ar"] .footer .contact-info {
    direction: rtl;
}

/*
   دي أهم واحدة:
   icon + text بمسافة واضحة
*/
html[lang="ar"] .footer .contact-item {
    direction: rtl;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start;
    gap: 12px !important;
}

/* نلغي أي margins جاية من الـ template */
html[lang="ar"] .footer .contact-item i {
    margin: 0 !important;
}

html[lang="ar"] .footer .contact-item a,
html[lang="ar"] .footer .contact-item span {
    margin: 0 !important;
}


/* رقم الهاتف والإيميل نفسهم LTR
   علشان مايتقلبوش في العربي */
html[lang="ar"] .footer .contact-phone,
html[lang="ar"] .footer .contact-email {
    direction: ltr;
    unicode-bidi: isolate;
    display: inline-block;
}


/* Footer Columns */
html[lang="ar"] .footer-nav-wrapper {
    direction: rtl;
}

html[lang="ar"] .footer .nav-column {
    text-align: right;
}

html[lang="ar"] .footer .footer-nav {
    text-align: right;
}

html[lang="ar"] .footer .footer-nav a {
    justify-content: flex-start;
}


/* Footer Titles */
html[lang="ar"] .footer h6 {
    font-family: "Tajawal", sans-serif !important;
    font-weight: 700;
}


/* Copyright */
html[lang="ar"] .footer-bottom {
    direction: rtl;
}

html[lang="ar"] .footer-bottom .copyright {
    text-align: right;
}

html[lang="ar"] .footer-bottom .legal-links {
    direction: rtl;
}


/* =========================================================
   Topbar icons spacing
   ========================================================= */

.header .topbar .contact-info i {
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
}

.header .topbar .contact-info i::before {
    margin: 0 !important;
}

html[lang="ar"] .header .topbar .contact-info {
    direction: rtl;
    gap: 20px;
}

html[lang="ar"] .header .topbar .contact-info i {
    gap: 8px !important;
}

/* رقم وإيميل التوب بار */
html[lang="ar"] .header .topbar .contact-info a,
html[lang="ar"] .header .topbar .contact-info span {
    direction: ltr;
    unicode-bidi: isolate;
}















/* =========================================================
   Departments Service Items - Arabic RTL Spacing Fix
   ========================================================= */

.departments-tabs .service-item {
    display: flex;
    align-items: flex-start;
    gap: 16px;
}

.departments-tabs .service-item .service-icon {
    flex: 0 0 auto;
    margin: 0 !important;
}

.departments-tabs .service-item .service-content {
    flex: 1;
    min-width: 0;
}


/* =========================
   Arabic
   ========================= */

html[lang="ar"] .departments-tabs .service-item {
    direction: rtl;
    display: flex !important;
    align-items: flex-start !important;
    gap: 18px !important;
}

html[lang="ar"] .departments-tabs .service-item .service-icon {
    margin: 0 !important;
    flex-shrink: 0;
}

html[lang="ar"] .departments-tabs .service-item .service-content {
    direction: rtl;
    text-align: right;
}

html[lang="ar"] .departments-tabs .service-item .service-content h4 {
    margin-top: 0;
    margin-bottom: 6px;
}

html[lang="ar"] .departments-tabs .service-item .service-content p {
    margin-bottom: 0;
    line-height: 1.8;
}

html[lang="ar"] .departments-tabs .service-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 0 !important;
    margin-right: 0 !important;
}




/* =========================================================
   HOME PAGE - Arabic RTL Fixes
   ========================================================= */

/* =========================
   1) Contact block
   أول صورة: الأيقونة لازقة في رقم التليفون
   ========================= */
html[lang="ar"] .contact-block .contact-actions,
html[dir="rtl"] .contact-block .contact-actions {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 14px;
}

html[lang="ar"] .contact-block .emergency-call,
html[dir="rtl"] .contact-block .emergency-call {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    direction: rtl;
}

html[lang="ar"] .contact-block .emergency-call i,
html[dir="rtl"] .contact-block .emergency-call i {
    margin: 0 !important;
    flex-shrink: 0;
    font-size: 18px;
    line-height: 1;
}

html[lang="ar"] .contact-block .contact-link,
html[dir="rtl"] .contact-block .contact-link {
    text-align: right;
}


/* =========================
   2) Featured departments
   تاني صورة: الأيقونة مش ظاهرة
   ========================= */
html[lang="ar"] .featured-departments .specialty-card .visual-overlay,
html[dir="rtl"] .featured-departments .specialty-card .visual-overlay {
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 3;
}

html[lang="ar"] .featured-departments .specialty-card .visual-overlay i,
html[dir="rtl"] .featured-departments .specialty-card .visual-overlay i {
    display: block;
    font-size: 28px;
    line-height: 1;
    color: var(--accent-color) !important;
}

html[lang="ar"] .featured-departments .specialty-card .specialty-visual,
html[dir="rtl"] .featured-departments .specialty-card .specialty-visual {
    position: relative;
}


/* =========================
   3) Featured services sidebar
   تالت صورة: الأيقونة لازقة في الصورة
   ========================= */
html[lang="ar"] .featured-services .services-sidebar .service-item,
html[dir="rtl"] .featured-services .services-sidebar .service-item {
    direction: rtl;
    display: flex;
    align-items: flex-start;
    gap: 18px !important;
    padding-right: 18px;
    text-align: right;
}

html[lang="ar"] .featured-services .services-sidebar .service-icon-wrapper,
html[dir="rtl"] .featured-services .services-sidebar .service-icon-wrapper {
    flex: 0 0 auto;
    margin: 0 !important;
    flex-shrink: 0;
}

html[lang="ar"] .featured-services .services-sidebar .service-info,
html[dir="rtl"] .featured-services .services-sidebar .service-info {
    flex: 1;
    min-width: 0;
    text-align: right;
}

html[lang="ar"] .featured-services .services-sidebar .service-info h4,
html[dir="rtl"] .featured-services .services-sidebar .service-info h4 {
    margin-top: 0;
    margin-bottom: 10px;
}

html[lang="ar"] .featured-services .services-sidebar .service-info p,
html[dir="rtl"] .featured-services .services-sidebar .service-info p {
    margin-bottom: 10px;
    line-height: 1.9;
}

html[lang="ar"] .featured-services .services-sidebar .service-link,
html[dir="rtl"] .featured-services .services-sidebar .service-link {
    display: inline-block;
}


/* =========================
   4) CTA feature blocks
   رابع صورة: الأيقونات تبقى في النص في العربي
   ========================= */
html[lang="ar"] .call-to-action .features-section .feature-block,
html[dir="rtl"] .call-to-action .features-section .feature-block {
    text-align: center;
}

html[lang="ar"] .call-to-action .features-section .feature-icon,
html[dir="rtl"] .call-to-action .features-section .feature-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px auto;
}

html[lang="ar"] .call-to-action .features-section .feature-icon i,
html[dir="rtl"] .call-to-action .features-section .feature-icon i {
    margin: 0 !important;
    line-height: 1;
}

html[lang="ar"] .call-to-action .features-section .feature-block h3,
html[dir="rtl"] .call-to-action .features-section .feature-block h3,
html[lang="ar"] .call-to-action .features-section .feature-block p,
html[dir="rtl"] .call-to-action .features-section .feature-block p {
    text-align: center;
}