/**
 * RTL (Right-to-Left) CSS Overrides for Frontend Website
 * Academy LMS - Arabic Language Support
 * 
 * This file is loaded only when the active language direction is RTL.
 * It overrides directional CSS properties for proper Arabic interface support.
 */

/* ==========================================================================
   Base RTL Settings
   ========================================================================== */

[dir="rtl"] *, [dir="rtl"] body, [dir="rtl"] html {
    font-family: 'Tajawal', sans-serif !important;
}

[dir="rtl"] body {
    text-align: right;
    direction: rtl;
}

[dir="rtl"] * {
    letter-spacing: normal;
}

/* ==========================================================================
   Typography & Text Alignment
   ========================================================================== */

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

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

[dir="rtl"] h1, [dir="rtl"] h2, [dir="rtl"] h3, 
[dir="rtl"] h4, [dir="rtl"] h5, [dir="rtl"] h6 {
    text-align: right;
}

[dir="rtl"] p {
    text-align: right;
}

/* ==========================================================================
   Margins & Padding
   ========================================================================== */

/* Margin Start/End */
[dir="rtl"] .ms-1, [dir="rtl"] .ms-2, [dir="rtl"] .ms-3, [dir="rtl"] .ms-4, [dir="rtl"] .ms-5 {
    margin-left: 0 !important;
}

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

[dir="rtl"] .me-1, [dir="rtl"] .me-2, [dir="rtl"] .me-3, [dir="rtl"] .me-4, [dir="rtl"] .me-5 {
    margin-right: 0 !important;
}

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

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

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

/* Padding Start/End */
[dir="rtl"] .ps-1, [dir="rtl"] .ps-2, [dir="rtl"] .ps-3, [dir="rtl"] .ps-4, [dir="rtl"] .ps-5 {
    padding-left: 0 !important;
}

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

[dir="rtl"] .pe-1, [dir="rtl"] .pe-2, [dir="rtl"] .pe-3, [dir="rtl"] .pe-4, [dir="rtl"] .pe-5 {
    padding-right: 0 !important;
}

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

/* ==========================================================================
   Float & Position
   ========================================================================== */

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

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

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

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

/* ==========================================================================
   Borders
   ========================================================================== */

[dir="rtl"] .border-start {
    border-left: 0 !important;
    border-right: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important;
}

[dir="rtl"] .border-end {
    border-right: 0 !important;
    border-left: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important;
}

/* ==========================================================================
   Header & Navigation
   ========================================================================== */

[dir="rtl"] .header-area .main-menu ul {
    padding-right: 0;
}

[dir="rtl"] .header-area .main-menu ul li {
    float: right;
}

[dir="rtl"] .header-area .logo {
    float: right;
}

[dir="rtl"] .header-right {
    float: left;
}

[dir="rtl"] .main-menu .dropdown-menu {
    text-align: right;
}

[dir="rtl"] .nav-link i,
[dir="rtl"] .nav-link .icon {
    margin-right: 0;
    margin-left: 8px;
}

/* Mobile Menu */
[dir="rtl"] .mobile-menu {
    right: auto;
    left: 0;
    transform: translateX(-100%);
}

[dir="rtl"] .mobile-menu.show {
    transform: translateX(0);
}

[dir="rtl"] .hamburger-icon {
    float: left;
}

/* Sub Header / Top Bar */
[dir="rtl"] .sub-header-left {
    float: right;
}

[dir="rtl"] .sub-header-right {
    float: left;
}

[dir="rtl"] .right-sub {
    float: left;
}

/* ==========================================================================
   Mega Menu RTL Fixes
   ========================================================================== */

/* Fix main menu ul class */
[dir="rtl"] .header-area .main-menu-ul {
    padding-right: 0;
}

/* Main mega dropdown - flip position from left to right */
[dir="rtl"] .mega-dropdown-menu,
[dir="rtl"] .main-mega-menu {
    text-align: right;
    left: auto !important;
    right: 150px !important;
    transform: translate(50%) !important;
}

/* Mega list container */
[dir="rtl"] .mega_list {
    padding-right: 0;
    padding-left: 0;
    text-align: right;
}

[dir="rtl"] .mega_list li {
    text-align: right;
}

/* Menu item links - use RTL direction so items flow right-to-left naturally */
[dir="rtl"] .mega_list li a {
    text-align: right;
    direction: rtl;
}

/* Fix Bootstrap margin classes inside mega menu */
[dir="rtl"] .mega_list li a > span.me-3 {
    margin-right: 0 !important;
    margin-left: 1rem !important;
}

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

/* Child category submenu - appear on LEFT side in RTL (opposite of parent) */
[dir="rtl"] .child_category_menu {
    left: calc(-100% - 20px) !important;
    right: auto !important;
}

/* Flip the chevron icon direction - point LEFT for RTL */
[dir="rtl"] .mega_list li a .fi-sr-angle-small-right::before,
[dir="rtl"] .mega_list li a .fi-rr-angle-small-right::before,
[dir="rtl"] .fi-sr-angle-small-right::before {
    content: "\e02a"; /* angle-small-left */
}

/* ==========================================================================
   Hero Banner
   ========================================================================== */

[dir="rtl"] .hero-content {
    text-align: right;
}

[dir="rtl"] .hero-content .btn {
    margin-right: 0;
    margin-left: 15px;
}

/* ==========================================================================
   Course Cards
   ========================================================================== */

[dir="rtl"] .course-card .course-content {
    text-align: right;
}

[dir="rtl"] .course-card .course-meta {
    text-align: right;
}

[dir="rtl"] .course-card .course-price {
    text-align: left;
}

[dir="rtl"] .course-card .rating-star {
    direction: ltr;
}

[dir="rtl"] .course-thumb .wishlist-btn {
    left: 15px;
    right: auto;
}

[dir="rtl"] .course-thumb .course-badge {
    right: 15px;
    left: auto;
}

/* ==========================================================================
   Categories
   ========================================================================== */

[dir="rtl"] .category-card {
    text-align: right;
}

[dir="rtl"] .category-card .category-icon {
    margin-right: 0;
    margin-left: 15px;
}

/* ==========================================================================
   Instructor Cards
   ========================================================================== */

[dir="rtl"] .instructor-card {
    text-align: right;
}

[dir="rtl"] .instructor-card .instructor-img {
    margin-right: 0;
    margin-left: 15px;
}

/* ==========================================================================
   Forms & Inputs
   ========================================================================== */

[dir="rtl"] .form-control,
[dir="rtl"] .form-select,
[dir="rtl"] input,
[dir="rtl"] textarea {
    text-align: right;
}

[dir="rtl"] .form-check {
    padding-left: 0;
    padding-right: 1.5em;
}

[dir="rtl"] .form-check .form-check-input {
    float: right;
    margin-left: 0;
    margin-right: -1.5em;
}

[dir="rtl"] .input-group > :first-child {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    border-top-right-radius: var(--bs-border-radius);
    border-bottom-right-radius: var(--bs-border-radius);
}

[dir="rtl"] .input-group > :last-child {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    border-top-left-radius: var(--bs-border-radius);
    border-bottom-left-radius: var(--bs-border-radius);
}

[dir="rtl"] .search-box .search-icon {
    left: auto;
    right: 15px;
}

[dir="rtl"] .search-box input {
    padding-left: 15px;
    padding-right: 45px;
}

/* Nice Select */
[dir="rtl"] .nice-select {
    text-align: right;
}

[dir="rtl"] .nice-select:after {
    right: auto;
    left: 12px;
}

[dir="rtl"] .nice-select .current {
    padding-left: 25px;
    padding-right: 0;
}

/* ==========================================================================
   Footer
   ========================================================================== */

[dir="rtl"] .footer-widget {
    text-align: right;
}

[dir="rtl"] .footer-widget ul {
    padding-right: 0;
}

[dir="rtl"] .footer-widget .social-links li {
    margin-right: 0;
    margin-left: 10px;
}

[dir="rtl"] .footer-bottom {
    text-align: right;
}

/* ==========================================================================
   Breadcrumb
   ========================================================================== */

[dir="rtl"] .breadcrumb {
    padding-right: 0;
}

[dir="rtl"] .breadcrumb-item + .breadcrumb-item::before {
    float: right;
    padding-left: 0.5rem;
    padding-right: 0;
}

[dir="rtl"] .breadcrumb-item + .breadcrumb-item {
    padding-left: 0;
    padding-right: 0.5rem;
}

/* ==========================================================================
   Pagination
   ========================================================================== */

[dir="rtl"] .pagination {
    padding-right: 0;
}

[dir="rtl"] .page-item:first-child .page-link {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    border-top-right-radius: var(--bs-pagination-border-radius);
    border-bottom-right-radius: var(--bs-pagination-border-radius);
}

[dir="rtl"] .page-item:last-child .page-link {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    border-top-left-radius: var(--bs-pagination-border-radius);
    border-bottom-left-radius: var(--bs-pagination-border-radius);
}

/* ==========================================================================
   Icons & Chevrons
   ========================================================================== */

[dir="rtl"] .fa-chevron-left::before {
    content: "\f054";
}

[dir="rtl"] .fa-chevron-right::before {
    content: "\f053";
}

[dir="rtl"] .fa-arrow-left::before {
    content: "\f061";
}

[dir="rtl"] .fa-arrow-right::before {
    content: "\f060";
}

[dir="rtl"] .fa-angle-left::before {
    content: "\f105";
}

[dir="rtl"] .fa-angle-right::before {
    content: "\f104";
}

/* Flat Icons */
[dir="rtl"] .fi-rr-angle-small-left::before {
    content: "\e02b";
}

[dir="rtl"] .fi-rr-angle-small-right::before {
    content: "\e02a";
}

/* ==========================================================================
   Sliders & Carousels
   ========================================================================== */

[dir="rtl"] .owl-carousel,
[dir="rtl"] .swiper {
    direction: ltr;
}

[dir="rtl"] .owl-carousel .owl-item,
[dir="rtl"] .swiper-slide {
    direction: rtl;
}

[dir="rtl"] .owl-nav .owl-prev {
    left: auto;
    right: 0;
}

[dir="rtl"] .owl-nav .owl-next {
    right: auto;
    left: 0;
}

[dir="rtl"] .swiper-button-prev {
    left: auto;
    right: 10px;
}

[dir="rtl"] .swiper-button-next {
    right: auto;
    left: 10px;
}

/* ==========================================================================
   Course Details Page
   ========================================================================== */

[dir="rtl"] .course-details-content {
    text-align: right;
}

[dir="rtl"] .course-sidebar {
    text-align: right;
}

[dir="rtl"] .curriculum-list {
    padding-right: 0;
}

[dir="rtl"] .curriculum-list li {
    padding-left: 0;
    padding-right: 15px;
}

[dir="rtl"] .curriculum-list li::before {
    left: auto;
    right: 0;
}

[dir="rtl"] .course-requirements ul,
[dir="rtl"] .course-outcomes ul {
    padding-right: 0;
}

[dir="rtl"] .course-requirements ul li,
[dir="rtl"] .course-outcomes ul li {
    padding-left: 0;
    padding-right: 25px;
}

[dir="rtl"] .course-requirements ul li::before,
[dir="rtl"] .course-outcomes ul li::before {
    left: auto;
    right: 0;
}

/* ==========================================================================
   Student Dashboard
   ========================================================================== */

[dir="rtl"] .student-sidebar {
    text-align: right;
}

[dir="rtl"] .student-sidebar .nav-link i {
    margin-right: 0;
    margin-left: 10px;
}

[dir="rtl"] .my-courses-card {
    text-align: right;
}

/* ==========================================================================
   Checkout & Cart
   ========================================================================== */

[dir="rtl"] .cart-item {
    text-align: right;
}

[dir="rtl"] .cart-item .item-img {
    margin-right: 0;
    margin-left: 15px;
}

[dir="rtl"] .cart-summary {
    text-align: right;
}

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

/* ==========================================================================
   Blog
   ========================================================================== */

[dir="rtl"] .blog-card {
    text-align: right;
}

[dir="rtl"] .blog-content {
    text-align: right;
}

[dir="rtl"] .blog-meta span {
    margin-right: 0;
    margin-left: 15px;
}

[dir="rtl"] .blog-meta span i {
    margin-right: 0;
    margin-left: 5px;
}

/* ==========================================================================
   Testimonials
   ========================================================================== */

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

[dir="rtl"] .testimonial-card .author-img {
    margin-right: 0;
    margin-left: 15px;
}

/* ==========================================================================
   FAQ / Accordion
   ========================================================================== */

[dir="rtl"] .accordion-button {
    text-align: right;
}

[dir="rtl"] .accordion-button::after {
    margin-left: 0;
    margin-right: auto;
}

/* ==========================================================================
   Modals
   ========================================================================== */

[dir="rtl"] .modal-header .btn-close {
    margin: -0.5rem auto -0.5rem -0.5rem;
}

[dir="rtl"] .modal-body {
    text-align: right;
}

/* ==========================================================================
   Dropdowns
   ========================================================================== */

[dir="rtl"] .dropdown-menu {
    text-align: right;
}

[dir="rtl"] .dropdown-item i {
    margin-right: 0;
    margin-left: 8px;
}

/* ==========================================================================
   Alerts & Notifications
   ========================================================================== */

[dir="rtl"] .alert {
    text-align: right;
}

[dir="rtl"] .alert-dismissible {
    padding-right: 1rem;
    padding-left: 3rem;
}

[dir="rtl"] .alert-dismissible .btn-close {
    right: auto;
    left: 0;
}

/* ==========================================================================
   Lists
   ========================================================================== */

[dir="rtl"] ul:not(.list-unstyled):not(.list-inline),
[dir="rtl"] ol:not(.list-unstyled):not(.list-inline) {
    padding-right: 2rem;
    padding-left: 0;
}

[dir="rtl"] .list-unstyled,
[dir="rtl"] .list-inline {
    padding-right: 0;
}

[dir="rtl"] li {
    text-align: right;
}

/* ==========================================================================
   Tables
   ========================================================================== */

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

/* ==========================================================================
   Buttons
   ========================================================================== */

[dir="rtl"] .btn i,
[dir="rtl"] .btn .icon {
    margin-right: 0;
    margin-left: 8px;
}

[dir="rtl"] .btn-group > .btn:first-child {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    border-top-right-radius: var(--bs-btn-border-radius);
    border-bottom-right-radius: var(--bs-btn-border-radius);
}

[dir="rtl"] .btn-group > .btn:last-child {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    border-top-left-radius: var(--bs-btn-border-radius);
    border-bottom-left-radius: var(--bs-btn-border-radius);
}

/* ==========================================================================
   Tab Navigation
   ========================================================================== */

[dir="rtl"] .nav-tabs,
[dir="rtl"] .nav-pills {
    padding-right: 0;
}

/* ==========================================================================
   Progress Bar
   ========================================================================== */

[dir="rtl"] .progress-bar {
    float: right;
}

/* ==========================================================================
   Badges
   ========================================================================== */

[dir="rtl"] .badge {
    margin-left: 0;
    margin-right: 5px;
}

/* ==========================================================================
   Login/Register Modal
   ========================================================================== */

[dir="rtl"] .login-modal .modal-body {
    text-align: right;
}

[dir="rtl"] .login-modal .form-group {
    text-align: right;
}

/* ==========================================================================
   Offcanvas
   ========================================================================== */

[dir="rtl"] .offcanvas-start {
    left: auto;
    right: 0;
    transform: translateX(100%);
}

[dir="rtl"] .offcanvas-start.show {
    transform: none;
}

[dir="rtl"] .offcanvas-end {
    right: auto;
    left: 0;
    transform: translateX(-100%);
}

[dir="rtl"] .offcanvas-end.show {
    transform: none;
}

/* ==========================================================================
   Responsive Adjustments
   ========================================================================== */

@media (max-width: 991.98px) {
    [dir="rtl"] .navbar-collapse {
        text-align: right;
    }
    
    [dir="rtl"] .navbar-nav {
        text-align: right;
    }
}

@media (max-width: 767.98px) {
    [dir="rtl"] .footer-widget {
        text-align: center;
    }
    
    [dir="rtl"] .hero-content {
        text-align: center;
    }
}

/* ==========================================================================
   Counter Section
   ========================================================================== */

[dir="rtl"] .counter-item {
    text-align: right;
}

/* ==========================================================================
   Features Section
   ========================================================================== */

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

[dir="rtl"] .feature-card .feature-icon {
    margin-right: 0;
    margin-left: 15px;
}

/* ==========================================================================
   About Section
   ========================================================================== */

[dir="rtl"] .about-content {
    text-align: right;
}

/* ==========================================================================
   Newsletter
   ========================================================================== */

[dir="rtl"] .newsletter-form .input-group .btn {
    border-top-left-radius: var(--bs-btn-border-radius) !important;
    border-bottom-left-radius: var(--bs-btn-border-radius) !important;
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

[dir="rtl"] .newsletter-form .input-group input {
    border-top-right-radius: var(--bs-btn-border-radius) !important;
    border-bottom-right-radius: var(--bs-btn-border-radius) !important;
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}

/* ==========================================================================
   Wishlist Button
   ========================================================================== */

[dir="rtl"] .add-wishlist {
    left: 15px;
    right: auto;
}

/* ==========================================================================
   Course Filter
   ========================================================================== */

[dir="rtl"] .filter-sidebar {
    text-align: right;
}

[dir="rtl"] .filter-widget {
    text-align: right;
}

/* ==========================================================================
   Rating Stars - Keep LTR
   ========================================================================== */

[dir="rtl"] .rating,
[dir="rtl"] .rating-star,
[dir="rtl"] .star-rating {
    direction: ltr;
    display: inline-flex;
}

/* ==========================================================================
   LTR Content (Phone Numbers, Emails, URLs)
   ========================================================================== */

/* Force LTR for phone numbers, emails, URLs */
[dir="rtl"] .ltr-content,
.ltr-content {
    direction: ltr;
    unicode-bidi: isolate;
    display: inline-block;
}

/* ==========================================================================
   Frontend Language Dropdown RTL
   ========================================================================== */

[dir="rtl"] .sub-header .img-text-select .selected-show {
    padding-right: 0;
    padding-left: 20px;
}

[dir="rtl"] .sub-header .img-text-select .selected-show:after {
    right: auto;
    left: 0;
}

[dir="rtl"] .sub-header .img-text-select .drop-content {
    right: auto;
    left: 0;
}

[dir="rtl"] .sub-header .img-text-select .drop-content ul li a i {
    margin-left: 4px;
    margin-right: 0;
}
