/* RTL (Right-to-Left) Styles for Arabic Language */

/* Base RTL styling */
html[dir="rtl"] {
    direction: rtl;
    text-align: right;
    font-family: 'Noto Sans Arabic', 'DM Sans', Arial, sans-serif;
}

html[dir="rtl"] body {
    text-align: right;
    font-family: 'Noto Sans Arabic', 'DM Sans', Arial, sans-serif;
}

/* Navigation and Menu RTL */
html[dir="rtl"] .navbar,
html[dir="rtl"] .header-nav {
    direction: rtl;
}

html[dir="rtl"] .nav-item,
html[dir="rtl"] .menu-item {
    direction: rtl;
}

/* Logo and Brand positioning */
html[dir="rtl"] .logo,
html[dir="rtl"] .brand {
    float: right;
}

/* Content alignment */
html[dir="rtl"] .content,
html[dir="rtl"] .main-content,
html[dir="rtl"] .article-content {
    text-align: right;
    direction: rtl;
}

/* Buttons and form elements */
html[dir="rtl"] .btn,
html[dir="rtl"] button {
    direction: rtl;
}

html[dir="rtl"] input,
html[dir="rtl"] textarea,
html[dir="rtl"] select {
    direction: rtl;
    text-align: right;
}

/* Float adjustments */
html[dir="rtl"] .float-left {
    float: right !important;
}

html[dir="rtl"] .float-right {
    float: left !important;
}

/* Margin and padding adjustments */
html[dir="rtl"] .ml-1 { margin-right: 0.25rem !important; margin-left: 0 !important; }
html[dir="rtl"] .ml-2 { margin-right: 0.5rem !important; margin-left: 0 !important; }
html[dir="rtl"] .ml-3 { margin-right: 0.75rem !important; margin-left: 0 !important; }
html[dir="rtl"] .ml-4 { margin-right: 1rem !important; margin-left: 0 !important; }
html[dir="rtl"] .ml-5 { margin-right: 1.25rem !important; margin-left: 0 !important; }
html[dir="rtl"] .ml-6 { margin-right: 1.5rem !important; margin-left: 0 !important; }

html[dir="rtl"] .mr-1 { margin-left: 0.25rem !important; margin-right: 0 !important; }
html[dir="rtl"] .mr-2 { margin-left: 0.5rem !important; margin-right: 0 !important; }
html[dir="rtl"] .mr-3 { margin-left: 0.75rem !important; margin-right: 0 !important; }
html[dir="rtl"] .mr-4 { margin-left: 1rem !important; margin-right: 0 !important; }
html[dir="rtl"] .mr-5 { margin-left: 1.25rem !important; margin-right: 0 !important; }
html[dir="rtl"] .mr-6 { margin-left: 1.5rem !important; margin-right: 0 !important; }

html[dir="rtl"] .pl-1 { padding-right: 0.25rem !important; padding-left: 0 !important; }
html[dir="rtl"] .pl-2 { padding-right: 0.5rem !important; padding-left: 0 !important; }
html[dir="rtl"] .pl-3 { padding-right: 0.75rem !important; padding-left: 0 !important; }
html[dir="rtl"] .pl-4 { padding-right: 1rem !important; padding-left: 0 !important; }
html[dir="rtl"] .pl-5 { padding-right: 1.25rem !important; padding-left: 0 !important; }
html[dir="rtl"] .pl-6 { padding-right: 1.5rem !important; padding-left: 0 !important; }

html[dir="rtl"] .pr-1 { padding-left: 0.25rem !important; padding-right: 0 !important; }
html[dir="rtl"] .pr-2 { padding-left: 0.5rem !important; padding-right: 0 !important; }
html[dir="rtl"] .pr-3 { padding-left: 0.75rem !important; padding-right: 0 !important; }
html[dir="rtl"] .pr-4 { padding-left: 1rem !important; padding-right: 0 !important; }
html[dir="rtl"] .pr-5 { padding-left: 1.25rem !important; padding-right: 0 !important; }
html[dir="rtl"] .pr-6 { padding-left: 1.5rem !important; padding-right: 0 !important; }

/* Text alignment */
html[dir="rtl"] .text-left {
    text-align: right !important;
}

html[dir="rtl"] .text-right {
    text-align: left !important;
}

/* Flexbox adjustments */
html[dir="rtl"] .justify-start {
    justify-content: flex-end !important;
}

html[dir="rtl"] .justify-end {
    justify-content: flex-start !important;
}

html[dir="rtl"] .items-start {
    align-items: flex-end !important;
}

html[dir="rtl"] .items-end {
    align-items: flex-start !important;
}

/* Border radius adjustments */
html[dir="rtl"] .rounded-l {
    border-top-right-radius: 0.25rem !important;
    border-bottom-right-radius: 0.25rem !important;
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}

html[dir="rtl"] .rounded-r {
    border-top-left-radius: 0.25rem !important;
    border-bottom-left-radius: 0.25rem !important;
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

/* Border adjustments */
html[dir="rtl"] .border-l {
    border-right-width: 1px !important;
    border-left-width: 0 !important;
}

html[dir="rtl"] .border-r {
    border-left-width: 1px !important;
    border-right-width: 0 !important;
}

/* Transform and positioning adjustments */
html[dir="rtl"] .transform {
    transform: scaleX(-1);
}

/* Icons and arrows */
html[dir="rtl"] .arrow-right:before,
html[dir="rtl"] .fa-arrow-right:before {
    content: "\f060"; /* fa-arrow-left */
}

html[dir="rtl"] .arrow-left:before,
html[dir="rtl"] .fa-arrow-left:before {
    content: "\f061"; /* fa-arrow-right */
}

/* Dropdown positioning */
html[dir="rtl"] .dropdown-menu {
    right: 0;
    left: auto;
}

/* Footer adjustments */
html[dir="rtl"] .footer {
    text-align: right;
    direction: rtl;
}

/* Blog and article specific */
html[dir="rtl"] .blog-post,
html[dir="rtl"] .article {
    direction: rtl;
    text-align: right;
}

html[dir="rtl"] .blog-meta,
html[dir="rtl"] .article-meta {
    direction: rtl;
    text-align: right;
}

/* Sidebar positioning */
html[dir="rtl"] .sidebar {
    float: left;
}

html[dir="rtl"] .main-content {
    float: right;
}

/* Form styling */
html[dir="rtl"] .form-group label {
    text-align: right;
}

html[dir="rtl"] .form-control {
    direction: rtl;
    text-align: right;
}

/* Table adjustments */
html[dir="rtl"] table {
    direction: rtl;
}

html[dir="rtl"] th,
html[dir="rtl"] td {
    text-align: right;
}

/* Breadcrumb adjustments */
html[dir="rtl"] .breadcrumb {
    direction: rtl;
}

html[dir="rtl"] .breadcrumb-item + .breadcrumb-item::before {
    content: "\\";
    transform: scaleX(-1);
}

/* Custom Vodlix specific adjustments */
html[dir="rtl"] .hero-section {
    text-align: right;
    direction: rtl;
}

html[dir="rtl"] .feature-box {
    text-align: right;
    direction: rtl;
}

html[dir="rtl"] .testimonial {
    text-align: right;
    direction: rtl;
}

/* Mobile responsiveness for RTL */
@media (max-width: 768px) {
    html[dir="rtl"] .mobile-menu {
        direction: rtl;
        text-align: right;
    }
    
    html[dir="rtl"] .mobile-nav {
        right: 0;
        left: auto;
    }
}

/* Print styles for RTL */
@media print {
    html[dir="rtl"] * {
        direction: rtl !important;
        text-align: right !important;
    }
} 