/**
 * RTL (Right-to-Left) Styles for Arabic Language
 * Sigma Smart E-School
 */

/* Base RTL Settings */
html[dir="rtl"],
.rtl {
    direction: rtl;
    text-align: right;
}

/* Arabic Font */
.font-arabic,
.rtl body,
html[dir="rtl"] body {
    font-family: 'Tajawal', 'Inter', sans-serif;
}

/* Flexbox Direction Fixes */
.rtl .flex-row {
    flex-direction: row-reverse;
}

.rtl .space-x-2 > :not([hidden]) ~ :not([hidden]),
.rtl .space-x-3 > :not([hidden]) ~ :not([hidden]),
.rtl .space-x-4 > :not([hidden]) ~ :not([hidden]),
.rtl .space-x-6 > :not([hidden]) ~ :not([hidden]),
.rtl .space-x-8 > :not([hidden]) ~ :not([hidden]) {
    --tw-space-x-reverse: 1;
}

/* Gap Handling */
.rtl .gap-2,
.rtl .gap-3,
.rtl .gap-4,
.rtl .gap-6 {
    direction: rtl;
}

/* Text Alignment */
.rtl .text-left {
    text-align: right;
}

.rtl .text-right {
    text-align: left;
}

/* Margin & Padding Adjustments */
.rtl .ml-2 { margin-left: 0; margin-right: 0.5rem; }
.rtl .ml-3 { margin-left: 0; margin-right: 0.75rem; }
.rtl .ml-4 { margin-left: 0; margin-right: 1rem; }
.rtl .ml-6 { margin-left: 0; margin-right: 1.5rem; }
.rtl .ml-auto { margin-left: 0; margin-right: auto; }

.rtl .mr-2 { margin-right: 0; margin-left: 0.5rem; }
.rtl .mr-3 { margin-right: 0; margin-left: 0.75rem; }
.rtl .mr-4 { margin-right: 0; margin-left: 1rem; }
.rtl .mr-6 { margin-right: 0; margin-left: 1.5rem; }
.rtl .mr-auto { margin-right: 0; margin-left: auto; }

.rtl .pl-2 { padding-left: 0; padding-right: 0.5rem; }
.rtl .pl-3 { padding-left: 0; padding-right: 0.75rem; }
.rtl .pl-4 { padding-left: 0; padding-right: 1rem; }
.rtl .pl-6 { padding-left: 0; padding-right: 1.5rem; }

.rtl .pr-2 { padding-right: 0; padding-left: 0.5rem; }
.rtl .pr-3 { padding-right: 0; padding-left: 0.75rem; }
.rtl .pr-4 { padding-right: 0; padding-left: 1rem; }
.rtl .pr-6 { padding-right: 0; padding-left: 1.5rem; }

/* Border Radius */
.rtl .rounded-l-lg { border-radius: 0 0.5rem 0.5rem 0; }
.rtl .rounded-r-lg { border-radius: 0.5rem 0 0 0.5rem; }
.rtl .rounded-l-full { border-radius: 0 9999px 9999px 0; }
.rtl .rounded-r-full { border-radius: 9999px 0 0 9999px; }
.rtl .rounded-tl-none { border-top-left-radius: 0.5rem; border-top-right-radius: 0; }
.rtl .rounded-tr-none { border-top-right-radius: 0.5rem; border-top-left-radius: 0; }

/* Icons & Arrows */
.rtl .fa-chevron-right::before { content: "\f053"; } /* Flip to left */
.rtl .fa-chevron-left::before { content: "\f054"; } /* Flip to right */
.rtl .fa-arrow-right::before { content: "\f060"; } /* Flip to left */
.rtl .fa-arrow-left::before { content: "\f061"; } /* Flip to right */

/* Transform Adjustments */
.rtl .translate-x-1\/2 { --tw-translate-x: -50%; }
.rtl .-translate-x-1\/2 { --tw-translate-x: 50%; }

/* Navigation Dropdowns */
.rtl .group:hover .group-hover\:translate-x-0 {
    --tw-translate-x: 0;
}

/* Fixed Position Elements */
.rtl .right-0 { right: auto; left: 0; }
.rtl .left-0 { left: auto; right: 0; }
.rtl .right-4 { right: auto; left: 1rem; }
.rtl .left-4 { left: auto; right: 1rem; }
.rtl .right-8 { right: auto; left: 2rem; }
.rtl .left-8 { left: auto; right: 2rem; }

/* AI Assistant Button Position */
.rtl #ai-assistant-btn,
.rtl .fixed.bottom-8.right-8 {
    right: auto;
    left: 2rem;
}

/* Lists */
.rtl ul,
.rtl ol {
    padding-right: 1.5rem;
    padding-left: 0;
}

.rtl li::marker {
    unicode-bidi: isolate;
}

/* Form Elements */
.rtl input,
.rtl textarea,
.rtl select {
    text-align: right;
}

.rtl input::placeholder,
.rtl textarea::placeholder {
    text-align: right;
}

/* Checkbox & Radio */
.rtl input[type="checkbox"],
.rtl input[type="radio"] {
    margin-left: 0.5rem;
    margin-right: 0;
}

/* Tables */
.rtl table {
    direction: rtl;
}

.rtl th,
.rtl td {
    text-align: right;
}

/* Cards & Containers */
.rtl .card-content,
.rtl .bento-item {
    text-align: right;
}

/* Scroll Animations */
.rtl .animate-on-scroll {
    transform: translateX(30px);
}

.rtl .animate-on-scroll.visible {
    transform: translateX(0);
}

/* Testimonial Cards */
.rtl .testimonial-card {
    direction: rtl;
}

/* Stats Section */
.rtl .stats-item {
    direction: rtl;
}

/* Footer */
.rtl footer {
    text-align: right;
}

.rtl footer .social-links {
    justify-content: flex-start;
}

/* Hero Section */
.rtl .hero-content {
    text-align: right;
}

/* Feature Cards */
.rtl .feature-icon {
    margin-left: 1rem;
    margin-right: 0;
}

/* Navigation Spacing Fix */
.rtl nav .space-x-6 > * + * {
    margin-left: 0;
    margin-right: 1.5rem;
}

.rtl nav .space-x-4 > * + * {
    margin-left: 0;
    margin-right: 1rem;
}

/* Breadcrumb */
.rtl .breadcrumb {
    direction: rtl;
}

.rtl .breadcrumb-separator {
    transform: scaleX(-1);
}

/* Modal & Dialog */
.rtl .modal-content {
    text-align: right;
}

/* Progress Bar */
.rtl .progress-bar {
    direction: rtl;
}

/* Timeline */
.rtl .timeline::before {
    left: auto;
    right: 50%;
}

/* Grid Items */
.rtl .grid {
    direction: rtl;
}

/* Swiper/Slider */
.rtl .swiper-container {
    direction: rtl;
}

/* Custom Scrollbar for RTL */
.rtl::-webkit-scrollbar {
    width: 8px;
}

/* Special Text Cases - Keep LTR */
.rtl .keep-ltr,
.rtl .email,
.rtl .phone,
.rtl code,
.rtl pre {
    direction: ltr;
    unicode-bidi: embed;
}

/* Logo always LTR */
.rtl .logo-text {
    direction: ltr;
}

/* Numbers */
.rtl .stat-number {
    direction: ltr;
    display: inline-block;
}

/* Button with Icon */
.rtl .btn-icon-right i {
    margin-left: 0;
    margin-right: 0.5rem;
}

.rtl .btn-icon-left i {
    margin-right: 0;
    margin-left: 0.5rem;
}

/* FAQ Accordion */
.rtl .faq-item .faq-icon {
    left: 1rem;
    right: auto;
}

/* Chat Messages */
.rtl #ai-chat-messages .flex.gap-3:not(.justify-end) {
    flex-direction: row-reverse;
}

.rtl #ai-chat-messages .flex.justify-end {
    flex-direction: row;
}

/* Responsive Adjustments */
@media (max-width: 768px) {
    .rtl .mobile-menu {
        text-align: right;
    }
    
    .rtl .mobile-menu a {
        text-align: right;
    }
}

/* Animation Adjustments */
@keyframes slideInRight-rtl {
    from {
        transform: translateX(-100%);
        opacity: 0;
    }
    to {
        transform: translateX(0);
        opacity: 1;
    }
}

@keyframes slideInLeft-rtl {
    from {
        transform: translateX(100%);
        opacity: 0;
    }
    to {
        transform: translateX(0);
        opacity: 1;
    }
}

.rtl .animate-slide-in-right {
    animation: slideInRight-rtl 0.5s ease-out;
}

.rtl .animate-slide-in-left {
    animation: slideInLeft-rtl 0.5s ease-out;
}
