/* ==========================================================================
   ARABIC SPECIFIC STYLES
   Dot Design — Arabic Version with Readex Pro & Alexandria
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. ARABIC TYPOGRAPHY OVERRIDES
   -------------------------------------------------------------------------- */
[dir="rtl"] body,
html[lang="ar"] body {
    font-family: var(--md-sys-typescale-font-family-plain-ar);
    line-height: 1.8;
}

[dir="rtl"] .display-large,
[dir="rtl"] .display-medium,
[dir="rtl"] .display-small,
[dir="rtl"] .headline-large,
[dir="rtl"] .headline-medium,
[dir="rtl"] .headline-small,
[dir="rtl"] .card-title,
[dir="rtl"] .cta-title {
    font-family: var(--md-sys-typescale-font-family-brand-ar);
    font-weight: 700;
}

[dir="rtl"] .label-large,
[dir="rtl"] .label-medium {
    font-family: var(--md-sys-typescale-font-family-brand-ar);
    letter-spacing: 0.02em;
    text-transform: none;
    font-weight: 600;
}

[dir="rtl"] .body-large,
[dir="rtl"] .body-medium,
[dir="rtl"] .card-body {
    font-family: var(--md-sys-typescale-font-family-plain-ar);
    line-height: 1.9;
}

/* --------------------------------------------------------------------------
   2. HERO SECTION ARABIC
   -------------------------------------------------------------------------- */
[dir="rtl"] .hero-title {
    font-size: clamp(2.5rem, 2rem + 4vw, 5rem);
    line-height: 1.2;
}

[dir="rtl"] .hero-subtitle {
    font-size: 1.25rem;
    line-height: 2;
    max-width: 650px;
}

[dir="rtl"] .hero-overline {
    display: inline-flex;
    align-items: center;
    gap: var(--md-sys-spacing-2);
}

[dir="rtl"] .hero-overline::before {
    content: '//';
    color: var(--md-sys-color-primary);
}

/* --------------------------------------------------------------------------
   3. BUTTONS ARABIC
   -------------------------------------------------------------------------- */
[dir="rtl"] .btn {
    font-family: var(--md-sys-typescale-font-family-brand-ar);
    font-weight: 600;
    padding: var(--md-sys-spacing-4) var(--md-sys-spacing-8);
}

[dir="rtl"] .btn-lg {
    padding: var(--md-sys-spacing-5) var(--md-sys-spacing-10);
    font-size: 1rem;
}

/* --------------------------------------------------------------------------
   4. CARDS ARABIC
   -------------------------------------------------------------------------- */
[dir="rtl"] .card {
    padding: var(--md-sys-spacing-8);
}

[dir="rtl"] .card-title {
    font-size: 1.375rem;
    margin-bottom: var(--md-sys-spacing-3);
}

[dir="rtl"] .card-body {
    font-size: 1rem;
    line-height: 1.9;
}

[dir="rtl"] .card-overline {
    font-size: 0.875rem;
}

[dir="rtl"] .card-actions {
    border-top: 1px solid var(--md-sys-color-outline-variant);
    padding-top: var(--md-sys-spacing-4);
    margin-top: var(--md-sys-spacing-6);
}

/* --------------------------------------------------------------------------
   5. SECTION HEADERS ARABIC
   -------------------------------------------------------------------------- */
[dir="rtl"] .section-header {
    max-width: 800px;
}

[dir="rtl"] .section-title {
    line-height: 1.3;
}

[dir="rtl"] .section-description {
    font-size: 1.125rem;
    line-height: 2;
}

[dir="rtl"] .section-overline {
    display: inline-flex;
    align-items: center;
    gap: var(--md-sys-spacing-2);
}

/* --------------------------------------------------------------------------
   6. STATS ARABIC
   -------------------------------------------------------------------------- */
[dir="rtl"] .stat-value {
    font-family: var(--md-sys-typescale-font-family-brand-ar);
    font-size: clamp(2rem, 1.5rem + 2vw, 3rem);
    font-weight: 800;
}

[dir="rtl"] .stat-label {
    font-family: var(--md-sys-typescale-font-family-plain-ar);
    font-size: 0.875rem;
    text-transform: none;
    letter-spacing: 0;
}

/* --------------------------------------------------------------------------
   7. FOOTER ARABIC
   -------------------------------------------------------------------------- */
[dir="rtl"] .footer-tagline {
    line-height: 1.9;
}

[dir="rtl"] .footer-nav-title {
    font-family: var(--md-sys-typescale-font-family-brand-ar);
    text-transform: none;
    letter-spacing: 0;
}

[dir="rtl"] .footer-nav-link {
    font-family: var(--md-sys-typescale-font-family-plain-ar);
}

[dir="rtl"] .footer-copyright {
    font-family: var(--md-sys-typescale-font-family-plain-ar);
    letter-spacing: 0;
}

/* --------------------------------------------------------------------------
   8. MOBILE MENU ARABIC
   -------------------------------------------------------------------------- */
[dir="rtl"] .mobile-menu-link {
    font-family: var(--md-sys-typescale-font-family-brand-ar);
    font-size: var(--md-sys-typescale-headline-medium-size);
}

/* --------------------------------------------------------------------------
   9. MARQUEE ARABIC
   -------------------------------------------------------------------------- */
[dir="rtl"] .marquee-item {
    font-family: var(--md-sys-typescale-font-family-brand-ar);
    font-size: 1rem;
    text-transform: none;
    letter-spacing: 0;
}

/* --------------------------------------------------------------------------
   10. BLOCKQUOTE ARABIC
   -------------------------------------------------------------------------- */
[dir="rtl"] blockquote {
    font-family: var(--md-sys-typescale-font-family-brand-ar);
    font-size: 1.25rem;
    line-height: 2;
    font-style: normal;
}

/* --------------------------------------------------------------------------
   11. NAVIGATION ARABIC
   -------------------------------------------------------------------------- */
[dir="rtl"] .top-app-bar-link {
    font-family: var(--md-sys-typescale-font-family-brand-ar);
    font-size: 0.875rem;
    text-transform: none;
    letter-spacing: 0.01em;
}

/* --------------------------------------------------------------------------
   12. CTA SECTION ARABIC
   -------------------------------------------------------------------------- */
[dir="rtl"] .cta-title {
    line-height: 1.3;
}

[dir="rtl"] .cta-description {
    font-size: 1.125rem;
    line-height: 2;
}

/* --------------------------------------------------------------------------
   13. FORM ELEMENTS ARABIC
   -------------------------------------------------------------------------- */
[dir="rtl"] input,
[dir="rtl"] textarea,
[dir="rtl"] select,
[dir="rtl"] .form-label,
[dir="rtl"] .form-input {
    font-family: var(--md-sys-typescale-font-family-plain-ar);
}

[dir="rtl"] input::placeholder,
[dir="rtl"] textarea::placeholder {
    font-family: var(--md-sys-typescale-font-family-plain-ar);
}

/* --------------------------------------------------------------------------
   14. RESPONSIVE ARABIC ADJUSTMENTS
   -------------------------------------------------------------------------- */
@media (max-width: 768px) {
    [dir="rtl"] .hero-title {
        font-size: clamp(2rem, 1.5rem + 3vw, 3rem);
    }

    [dir="rtl"] .hero-subtitle {
        font-size: 1.125rem;
    }

    [dir="rtl"] .display-small {
        font-size: clamp(1.75rem, 1.25rem + 2vw, 2.5rem);
    }

    [dir="rtl"] .card {
        padding: var(--md-sys-spacing-6);
    }
}

/* --------------------------------------------------------------------------
   15. SPECIAL GRADIENT TEXT FOR ARABIC
   -------------------------------------------------------------------------- */
[dir="rtl"] .text-gradient,
[dir="rtl"] .text-gradient-animated {
    font-family: var(--md-sys-typescale-font-family-brand-ar);
}

/* --------------------------------------------------------------------------
   16. WHATSAPP BUTTON ARABIC TOOLTIP
   -------------------------------------------------------------------------- */
[dir="rtl"] .whatsapp-tooltip {
    font-family: var(--md-sys-typescale-font-family-plain-ar);
    font-size: 0.875rem;
}