/* RTL/LTR Support CSS */
/* This file provides better support for both Arabic (RTL) and English (LTR) layouts */

/* Arabic (RTL) specific styles */
[dir="rtl"] {
    direction: rtl;
    text-align: right;
}

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

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

[dir="rtl"] .ms-auto {
    margin-right: auto !important;
    margin-left: 0 !important;
}

[dir="rtl"] .me-auto {
    margin-left: auto !important;
    margin-right: 0 !important;
}

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

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

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

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

/* English (LTR) specific styles */
[dir="ltr"] {
    direction: ltr;
    text-align: left;
}

[dir="ltr"] .text-start {
    text-align: left !important;
}

[dir="ltr"] .text-end {
    text-align: right !important;
}

/* Flexbox direction support */
[dir="rtl"] .flex-row {
    flex-direction: row-reverse !important;
}

[dir="ltr"] .flex-row {
    flex-direction: row !important;
}

/* Icon positioning */
[dir="rtl"] .icon-left {
    margin-right: 0.5rem;
    margin-left: 0;
}

[dir="rtl"] .icon-right {
    margin-left: 0.5rem;
    margin-right: 0;
}

[dir="ltr"] .icon-left {
    margin-left: 0.5rem;
    margin-right: 0;
}

[dir="ltr"] .icon-right {
    margin-right: 0.5rem;
    margin-left: 0;
}

/* Border radius adjustments for RTL */
[dir="rtl"] .border-start {
    border-right: 1px solid !important;
    border-left: none !important;
}

[dir="rtl"] .border-end {
    border-left: 1px solid !important;
    border-right: none !important;
}

[dir="ltr"] .border-start {
    border-left: 1px solid !important;
    border-right: none !important;
}

[dir="ltr"] .border-end {
    border-right: 1px solid !important;
    border-left: none !important;
}

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

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

[dir="ltr"] .float-start {
    float: left !important;
}

[dir="ltr"] .float-end {
    float: right !important;
}

/* Position adjustments */
[dir="rtl"] .position-start {
    right: 0 !important;
    left: auto !important;
}

[dir="rtl"] .position-end {
    left: 0 !important;
    right: auto !important;
}

[dir="ltr"] .position-start {
    left: 0 !important;
    right: auto !important;
}

[dir="ltr"] .position-end {
    right: 0 !important;
    left: auto !important;
}

/* Animation direction support */
[dir="rtl"] .slide-in-left {
    animation: slideInRight 0.5s ease-out;
}

[dir="rtl"] .slide-in-right {
    animation: slideInLeft 0.5s ease-out;
}

[dir="ltr"] .slide-in-left {
    animation: slideInLeft 0.5s ease-out;
}

[dir="ltr"] .slide-in-right {
    animation: slideInRight 0.5s ease-out;
}

@keyframes slideInLeft {
    from {
        transform: translateX(-100%);
        opacity: 0;
    }
    to {
        transform: translateX(0);
        opacity: 1;
    }
}

@keyframes slideInRight {
    from {
        transform: translateX(100%);
        opacity: 0;
    }
    to {
        transform: translateX(0);
        opacity: 1;
    }
}

/* Responsive adjustments */
@media (max-width: 768px) {
    [dir="rtl"] .mobile-text-center {
        text-align: center !important;
    }
    
    [dir="ltr"] .mobile-text-center {
        text-align: center !important;
    }
}