/* 
 * Arabic Home Page Specific CSS
 * This file contains FORCEFUL text-align: right rules for Arabic home page
 * Loaded ONLY when LANGUAGE_CODE == 'ar' on home page
 */

/* ============================================
   ALL TITLES - Force Right Alignment
   ============================================ */

/* All title text elements */
body.home-rtl .f-case-title-text,
body.home-rtl .f-case-title-text.services-slider-title,
body.home-rtl .f-case-title-text.work-page,
html[dir="rtl"] body.home-rtl .f-case-title-text,
html[lang="ar"] body.home-rtl .f-case-title-text {
    text-align: right !important;
    direction: rtl !important;
}

/* All heading elements */
body.home-rtl h1,
body.home-rtl h2,
body.home-rtl h3,
body.home-rtl h4,
body.home-rtl h5,
body.home-rtl h6,
body.home-rtl .h1,
body.home-rtl .h2,
body.home-rtl .h3,
body.home-rtl .h4,
body.home-rtl .h5,
body.home-rtl .h6,
html[dir="rtl"] body.home-rtl h1,
html[dir="rtl"] body.home-rtl h2,
html[dir="rtl"] body.home-rtl h3,
html[dir="rtl"] body.home-rtl h4,
html[dir="rtl"] body.home-rtl h5,
html[dir="rtl"] body.home-rtl h6,
html[lang="ar"] body.home-rtl h1,
html[lang="ar"] body.home-rtl h2,
html[lang="ar"] body.home-rtl h3,
html[lang="ar"] body.home-rtl h4,
html[lang="ar"] body.home-rtl h5,
html[lang="ar"] body.home-rtl h6 {
    text-align: right !important;
    direction: rtl !important;
}

/* Small headers */
body.home-rtl .small-header,
body.home-rtl .small-header._2,
html[dir="rtl"] body.home-rtl .small-header,
html[lang="ar"] body.home-rtl .small-header {
    text-align: right !important;
    direction: rtl !important;
}

/* ============================================
   ABOUT US SECTION - Force Right Alignment
   ============================================ */

/* About Services Section */
body.home-rtl .about-services-h3-holder,
body.home-rtl .about-services-list-text,
body.home-rtl .about-service-tag-holder,
body.home-rtl .about-services-list-holder,
html[dir="rtl"] body.home-rtl .about-services-h3-holder,
html[lang="ar"] body.home-rtl .about-services-h3-holder,
html[dir="rtl"] body.home-rtl .about-services-list-text,
html[lang="ar"] body.home-rtl .about-services-list-text,
html[dir="rtl"] body.home-rtl .about-service-tag-holder,
html[lang="ar"] body.home-rtl .about-service-tag-holder,
html[dir="rtl"] body.home-rtl .about-services-list-holder,
html[lang="ar"] body.home-rtl .about-services-list-holder {
    text-align: right !important;
    direction: rtl !important;
}

/* Vision/Values/Mission Box - ALL elements */
body.home-rtl .vision-values-mission-box,
body.home-rtl .vision-values-mission-box *,
body.home-rtl .vision-values-mission-box h3,
body.home-rtl .vision-values-mission-box p,
body.home-rtl .vision-values-mission-box div,
body.home-rtl .vision-values-mission-box span,
html[dir="rtl"] body.home-rtl .vision-values-mission-box,
html[dir="rtl"] body.home-rtl .vision-values-mission-box *,
html[dir="rtl"] body.home-rtl .vision-values-mission-box h3,
html[dir="rtl"] body.home-rtl .vision-values-mission-box p,
html[dir="rtl"] body.home-rtl .vision-values-mission-box div,
html[dir="rtl"] body.home-rtl .vision-values-mission-box span,
html[lang="ar"] body.home-rtl .vision-values-mission-box,
html[lang="ar"] body.home-rtl .vision-values-mission-box *,
html[lang="ar"] body.home-rtl .vision-values-mission-box h3,
html[lang="ar"] body.home-rtl .vision-values-mission-box p,
html[lang="ar"] body.home-rtl .vision-values-mission-box div,
html[lang="ar"] body.home-rtl .vision-values-mission-box span {
    text-align: right !important;
    direction: rtl !important;
}

/* Override inline styles in Vision/Values/Mission Box */
body.home-rtl .vision-values-mission-box h3[style],
body.home-rtl .vision-values-mission-box p[style],
body.home-rtl .vision-values-mission-box div[style],
body.home-rtl .vision-values-mission-box span[style],
body.home-rtl .vision-values-mission-box *[style],
html[dir="rtl"] body.home-rtl .vision-values-mission-box *[style],
html[lang="ar"] body.home-rtl .vision-values-mission-box *[style] {
    text-align: right !important;
    direction: rtl !important;
}

/* Override inline styles with text-align in the value */
body.home-rtl .vision-values-mission-box *[style*="text-align"],
html[dir="rtl"] body.home-rtl .vision-values-mission-box *[style*="text-align"],
html[lang="ar"] body.home-rtl .vision-values-mission-box *[style*="text-align"] {
    text-align: right !important;
    direction: rtl !important;
}

/* ============================================
   GRID INFO HOLDER - Force Right Alignment
   ============================================ */

body.home-rtl .f-grid-info-holder,
body.home-rtl .f-grid-info-holder *,
html[dir="rtl"] body.home-rtl .f-grid-info-holder,
html[dir="rtl"] body.home-rtl .f-grid-info-holder *,
html[lang="ar"] body.home-rtl .f-grid-info-holder,
html[lang="ar"] body.home-rtl .f-grid-info-holder * {
    text-align: right !important;
    direction: rtl !important;
}

/* ============================================
   CONTACT SECTION (if on home page)
   ============================================ */

body.home-rtl .about-services-h3-holder.contact-page,
body.home-rtl .about-services-list-holder.contact-page,
body.home-rtl .about-services-list-holder.contact-page *,
html[dir="rtl"] body.home-rtl .about-services-h3-holder.contact-page,
html[lang="ar"] body.home-rtl .about-services-h3-holder.contact-page {
    text-align: right !important;
    direction: rtl !important;
}

/* Small contact text - right align for Arabic home page */
body.home-rtl .small-contact-text,
html[dir="rtl"] body.home-rtl .small-contact-text,
html[lang="ar"] body.home-rtl .small-contact-text {
    text-align: right !important;
    direction: rtl !important;
}

/* ============================================
   MOBILE SPECIFIC - Force Right Alignment
   ============================================ */

@media screen and (max-width: 768px) {
    body.home-rtl .f-case-title-text,
    body.home-rtl .f-grid-info-holder,
    body.home-rtl .vision-values-mission-box,
    body.home-rtl .vision-values-mission-box *,
    body.home-rtl .about-services-h3-holder,
    body.home-rtl .about-services-list-text,
    html[dir="rtl"] body.home-rtl .f-case-title-text,
    html[lang="ar"] body.home-rtl .f-case-title-text {
        text-align: right !important;
        direction: rtl !important;
    }
    
    /* Services Slider Name - Mobile RTL */
    body.home-rtl #services-slider-name-container,
    body.home-rtl .services-slider-name,
    html[dir="rtl"] body.home-rtl #services-slider-name-container,
    html[dir="rtl"] body.home-rtl .services-slider-name,
    html[lang="ar"] body.home-rtl #services-slider-name-container,
    html[lang="ar"] body.home-rtl .services-slider-name {
        right: 4vw !important;
        left: auto !important;
    }
}

/* ============================================
   SERVICES SLIDER NAME - Position on Right for Arabic
   ============================================ */

/* Services slider name container - move from left to right for Arabic */
body.home-rtl #services-slider-name-container,
body.home-rtl .services-slider-name,
html[dir="rtl"] body.home-rtl #services-slider-name-container,
html[dir="rtl"] body.home-rtl .services-slider-name,
html[lang="ar"] body.home-rtl #services-slider-name-container,
html[lang="ar"] body.home-rtl .services-slider-name {
    left: auto !important;
    right: 3vw !important;
    text-align: right !important;
    direction: rtl !important;
}

/* Service name text - right aligned */
body.home-rtl .service-name-text,
html[dir="rtl"] body.home-rtl .service-name-text,
html[lang="ar"] body.home-rtl .service-name-text {
    text-align: right !important;
    direction: rtl !important;
    display: inline-block !important;
}

/* Override inline styles on the container */
body.home-rtl #services-slider-name-container[style],
html[dir="rtl"] body.home-rtl #services-slider-name-container[style],
html[lang="ar"] body.home-rtl #services-slider-name-container[style] {
    left: auto !important;
    right: 3vw !important;
    text-align: right !important;
}

/* ============================================
   F-AFTER-CASES-HOLDER-2 - Arabic Spacing
   ============================================ */

/* Adjust spacing for Arabic mode */
body.home-rtl .f-after-cases-holder-2,
html[dir="rtl"] body.home-rtl .f-after-cases-holder-2,
html[lang="ar"] body.home-rtl .f-after-cases-holder-2 {
    z-index: 40 !important;
    letter-spacing: -.01vw !important;
    justify-content: end !important;
}

/* ============================================
   FORM INPUTS - Arabic Text Alignment
   ============================================ */

/* Form inputs and textareas - right aligned in Arabic */
body.home-rtl .form-input,
body.home-rtl .form-textarea,
html[dir="rtl"] body.home-rtl .form-input,
html[dir="rtl"] body.home-rtl .form-textarea,
html[lang="ar"] body.home-rtl .form-input,
html[lang="ar"] body.home-rtl .form-textarea {
    text-align: right !important;
    direction: rtl !important;
}

/* ============================================
   TIME ELEMENT - Remove Margin-Right in Arabic
   ============================================ */

/* Time element - Remove margin-right in Arabic home page */
body.home-rtl .menu-link.right:has(.clock.time),
body.home-rtl .menu-link.right .clock.time,
html[dir="rtl"] body.home-rtl .menu-link.right:has(.clock.time),
html[lang="ar"] body.home-rtl .menu-link.right:has(.clock.time),
html[dir="rtl"] body.home-rtl .menu-links-holder:not(.main) .menu-link.right:has(.clock.time),
html[lang="ar"] body.home-rtl .menu-links-holder:not(.main) .menu-link.right:has(.clock.time) {
    margin-right: 0.75vw !important;
}

/* ============================================
   MOBILE MENU - Home Page RTL Styling
   ============================================ */
/* Note: Mobile menu RTL styles are now unified in rtl.css for all pages */
/* Home page inherits the unified styles from rtl.css */

/* Hamburger Menu Button - Position on LEFT for Arabic Home Page */
@media screen and (max-width: 1024px) {
    html[dir="rtl"] body.home-rtl .hamburger-menu-btn,
    html[lang="ar"] body.home-rtl .hamburger-menu-btn {
        left: 1.5vw !important;
        right: auto !important;
        top: 2.5vw !important;
        position: fixed !important;
        z-index: 10001 !important;
    }
}

@media screen and (max-width: 480px) {
    html[dir="rtl"] body.home-rtl .hamburger-menu-btn,
    html[lang="ar"] body.home-rtl .hamburger-menu-btn {
        left: 1.5rem !important;
        right: auto !important;
        top: 1.5rem !important;
    }
}

/* ============================================
   MAXIMUM SPECIFICITY OVERRIDES
   ============================================ */

/* Use maximum specificity to override any conflicting styles */
html[dir="rtl"] body.home-rtl .f-case-title-text.services-slider-title,
html[lang="ar"] body.home-rtl .f-case-title-text.services-slider-title,
html[dir="rtl"] body.home-rtl .f-case-title-text.services-slider-title.words.chars.splitting.show,
html[lang="ar"] body.home-rtl .f-case-title-text.services-slider-title.words.chars.splitting.show {
    text-align: right !important;
    direction: rtl !important;
}

/* Small header ._2 - Position on right (2vw) for Arabic home page */
body.home-rtl .small-header._2,
html[dir="rtl"] body.home-rtl .small-header._2,
html[lang="ar"] body.home-rtl .small-header._2 {
    right: 2vw !important;
    left: auto !important;
    text-align: right !important;
    direction: rtl !important;
}