/* RTL Direction Styles for Frontend */
/* This file contains direction-specific styles for Arabic (RTL) layout */

/* Base Direction */
html[dir="rtl"] {
    direction: rtl;
    text-align: right;
}

/* General RTL Adjustments */
html[dir="rtl"] body {
    text-align: right;
}

/* Header Styles */
html[dir="rtl"] .header .header-links {
    flex-direction: row;
}

html[dir="rtl"] .header .cart-icon {
    flex-direction: row;
}

/* Search Input */
html[dir="rtl"] .header .search input {
    padding-right: 16px;
    padding-left: 40px;
}

html[dir="rtl"] .header .search .search-icon {
    right: auto;
    left: 12px;
}

/* Mobile Navigation */
html[dir="rtl"] .mobile-navigation .mobile-sidebar {
    right: auto;
    left: -300px;
}

html[dir="rtl"] .mobile-navigation.active .mobile-sidebar {
    right: 0;
    z-index: 999999 !important;
}

/* Dropdowns and Menus */
html[dir="rtl"] .profile-dropdown-menu {
    right: 0;
    left: auto;
}

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

/* Hero Section */
html[dir="ltr"] .hero .single-item-1 .item-text {
    right: 59px;
    left: auto;
    border-start-end-radius: 40px !important;
    border-end-end-radius: 40px !important;
}

html[dir="rtl"] .hero .single-item-2 .item-content,
html[dir="rtl"] .hero .single-item-3 .item-content {
    border-start-end-radius: 40px;
    border-end-end-radius: 40px;
    border-start-start-radius: 0;
    border-end-start-radius: 0;
}

/* Quran Section */
html[dir="rtl"] .quran-card .quran-img {
    left: 0;
    right: auto;
}

/* Service Cards Arrow */
html[dir="rtl"] .services-cards .card-arrow {
    left: 12px;
    right: auto;
}

html[dir="rtl"] .services-cards .card-arrow svg {
    transform: rotate(0deg);
}

html[dir="rtl"] .services-cards .card-arrow:hover svg {
    transform: rotate(-45deg);
}

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

html[dir="rtl"] .footer-content-bottom {
    flex-direction: row;
}

/* Breadcrumbs */
html[dir="rtl"] .pages svg {
    transform: rotate(0deg);
}

/* Cards */
html[dir="rtl"] .package-name {
    flex-direction: row;
}

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

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

/* Login Button Alignment */
html[dir="rtl"] .dropdown-item button {
    text-align: right;
}

/* About Section Image */
html[dir="rtl"] .about-section .about-img {
    right: 0;
    left: auto;
}

/* Cart Summary */
html[dir="rtl"] .cart .total-price {
    flex-direction: row;
}

/* Language Toggle Button */
.language-toggle {
    display: flex;
    align-items: center;
}

.language-toggle .lang-btn,
.lang-btn-mobile {
    display: flex;
    align-items: center;
    gap: 8px;
    background: transparent;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    padding: 8px 12px;
    cursor: pointer;
    transition: all 0.3s ease;
    font-size: 14px;
    color: #2d3e50;
}

.language-toggle .lang-btn:hover,
.lang-btn-mobile:hover {
    background: #f5f5f5;
    border-color: #ccc;
}

.language-toggle .lang-btn svg,
.lang-btn-mobile svg {
    width: 20px;
    height: 20px;
}

html[dir="rtl"] .language-toggle .lang-btn,
html[dir="rtl"] .lang-btn-mobile {
    direction: ltr;
}

/* Swiper Navigation - Flip arrows for RTL */
html[dir="rtl"] .swiper-button-prev::after {
    content: "next";
}

html[dir="rtl"] .swiper-button-next::after {
    content: "prev";
}

/* Contact Us Section */
html[dir="rtl"] .contact-us .text {
    text-align: right ;

    @media (max-width:768px) {
        text-align: center ;
    }
}

/* Student Dashboard */
html[dir="rtl"] .student-sidebar {
    right: 0;
    left: auto;
}

/* Table Alignment */
html[dir="rtl"] table th,
html[dir="rtl"] table td {
    text-align: right;
}

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

/* Alert Messages */
html[dir="rtl"] .alert {
    text-align: right;
}

/* Price Display */
html[dir="rtl"] .package-price {
    text-align: right;
}

/* List Items */
html[dir="rtl"] ul,
html[dir="rtl"] ol {
    padding-right: 2rem;
    padding-left: 0;
}

/* Check Icons in Features */
html[dir="rtl"] .single-special {
    flex-direction: row;
}

html[dir="rtl"] .single-special svg {
    margin-left: 8px;
    margin-right: 0;
}