/* ============================================
   Frontend Theme RTL Stylesheet
   Comprehensive RTL overrides for frontend UI components
   ============================================ */

/* ============================================
   1. Navigation & Header (Priority: Critical)
   ============================================ */

/* Navbar alignment */
.rtl .navbar .navbar-nav {
    margin-left: 0;
    margin-right: auto;
    text-align: right;
}

/* Nav link padding and margins */
.rtl .nav-link {
    padding-right: 1rem;
    padding-left: 1rem;
    text-align: right;
}

.rtl .nav-link i,
.rtl .nav-link .bi {
    margin-right: 0;
    margin-left: 0.5rem;
}

/* Dropdown menu positioning */
.rtl .navbar .dropdown-menu {
    left: auto;
    right: 0;
    text-align: right;
}

.rtl .navbar .dropdown-menu-end {
    left: 0;
    right: auto;
}

/* Navbar toggler icon */
.rtl .navbar-toggler {
    margin-left: 0;
    margin-right: auto;
}

/* Language selector dropdown */
.rtl .language-selector {
    text-align: right;
}

.rtl .language-selector .dropdown-menu {
    left: auto;
    right: 0;
}

/* Bottom nav icon spacing (mobile) */
.rtl .bottom-nav .nav-link i,
.rtl .bottom-nav .nav-link .bi {
    margin-right: 0;
    margin-left: 0.25rem;
}

.rtl .bottom-nav {
    direction: rtl;
}

/* ============================================
   2. Hero Section
   ============================================ */

/* Hero content text alignment */
.rtl .hero-content {
    text-align: right;
}

.rtl .hero-content h1,
.rtl .hero-content p {
    text-align: right;
}

/* Hero image positioning */
.rtl .hero-img {
    order: 1;
}

.rtl .hero-content {
    order: 2;
}

/* Hero button icon margins */
.rtl .hero-btn i,
.rtl .hero-btn .bi {
    margin-right: 0;
    margin-left: 0.5rem;
}

/* Round text animation direction */
.rtl .round-text {
    transform: scaleX(-1);
}

/* ============================================
   3. Gallery & Category Grids
   ============================================ */

/* Gallery item hover overlay */
.rtl .gallery-item .overlay {
    left: auto;
    right: 0;
}

/* Author image positioning in gallery cards */
.rtl .gallery-item .author-img {
    left: auto;
    right: 15px;
}

.rtl .gallery-item .author-img img {
    margin-right: 0;
    margin-left: 0.5rem;
}

/* Category box text alignment */
.rtl .category-box .text-box {
    text-align: right;
    padding-right: 1rem;
    padding-left: 0;
}

/* Action button positioning */
.rtl .action-btn {
    left: auto;
    right: 15px;
}

.rtl .action-btn i {
    margin-right: 0;
    margin-left: 0.25rem;
}

/* ============================================
   4. Product/Shop Cards
   ============================================ */

/* Product card badge positioning */
.rtl .product-card .product-img .badge,
.rtl .product-card .product-img .discount-badge {
    top: 15px;
    left: 15px;
    right: auto;
}

/* Product meta icon margins */
.rtl .product-meta i,
.rtl .product-meta .bi {
    margin-right: 0;
    margin-left: 0.5rem;
}

/* Product action button alignment */
.rtl .product-action {
    text-align: left;
}

.rtl .product-action .btn {
    margin-right: 0;
    margin-left: 0.5rem;
}

/* Price and discount badge */
.rtl .price {
    text-align: right;
}

.rtl .discount-badge {
    margin-right: 0;
    margin-left: 0.5rem;
}

/* ============================================
   5. Author Profile Section
   ============================================ */

/* Author profile image box float */
.rtl .author-profile .img-box {
    float: right;
    margin-right: 0;
    margin-left: 1.5rem;
}

/* User info text alignment */
.rtl .user-info {
    text-align: right;
}

.rtl .user-info h3,
.rtl .user-info p {
    text-align: right;
}

/* Social reaction button order */
.rtl .social-reaction {
    direction: rtl;
}

.rtl .social-reaction .btn {
    margin-right: 0;
    margin-left: 0.5rem;
}

/* Follower count icon spacing */
.rtl .follower-count i,
.rtl .follower-count .bi {
    margin-right: 0;
    margin-left: 0.5rem;
}

/* ============================================
   6. Blog Cards & Sidebar
   ============================================ */

/* Blog card image float */
.rtl .blog-card .blog-img {
    float: right;
    margin-right: 0;
    margin-left: 1rem;
}

/* Blog meta icon margins */
.rtl .blog-meta i,
.rtl .blog-meta .bi {
    margin-right: 0;
    margin-left: 5px;
}

.rtl .blog-meta span {
    margin-right: 0;
    margin-left: 1rem;
}

/* Sidebar widget alignment */
.rtl .sidebar-widget {
    text-align: right;
}

.rtl .sidebar-widget h4,
.rtl .sidebar-widget h5 {
    text-align: right;
}

/* Tag list item spacing */
.rtl .tag-list li {
    margin-right: 0;
    margin-left: 0.5rem;
    float: right;
}

.rtl .tag-list li:last-child {
    margin-left: 0;
}

/* ============================================
   7. Forms & Search
   ============================================ */

/* Search box icon positioning */
.rtl .search-box i,
.rtl .search-box .bi {
    left: auto;
    right: 15px;
}

.rtl .search-box input {
    padding-right: 45px;
    padding-left: 15px;
}

/* Form control with icons */
.rtl .form-control + i,
.rtl .form-control + .bi {
    left: auto;
    right: 15px;
}

.rtl .input-group .form-control {
    padding-right: 45px;
    padding-left: 15px;
}

/* Select2 dropdown arrow */
.rtl .select2-container--default .select2-selection--single .select2-selection__arrow {
    left: 1px;
    right: auto;
}

/* IntlTelInput flag positioning */
.rtl .intl-tel-input {
    direction: rtl;
}

.rtl .intl-tel-input .flag-container {
    right: 0;
    left: auto;
}

/* ============================================
   8. Modals & Offcanvas
   ============================================ */

/* Modal header close button */
.rtl .modal-header .btn-close {
    margin-left: auto;
    margin-right: 0;
    order: -1;
}

/* Offcanvas end slide direction */
.rtl .offcanvas-end {
    left: 0;
    right: auto;
    transform: translateX(-100%);
}

.rtl .offcanvas-end.show {
    transform: translateX(0);
}

/* Modal footer button alignment */
.rtl .modal-footer {
    direction: rtl;
    justify-content: flex-start;
}

.rtl .modal-footer .btn {
    margin-right: 0;
    margin-left: 0.5rem;
}

/* ============================================
   9. Footer
   ============================================ */

/* Footer widget text alignment */
.rtl .footer-widget {
    text-align: right;
}

.rtl .footer-widget h4,
.rtl .footer-widget h5 {
    text-align: right;
}

/* Footer link icon margins */
.rtl .footer-link i,
.rtl .footer-link .bi {
    margin-right: 0;
    margin-left: 0.5rem;
}

/* Social link order */
.rtl .social-link {
    margin-right: 0;
    margin-left: 0.75rem;
}

.rtl .social-link:last-child {
    margin-left: 0;
}

/* Newsletter form button positioning */
.rtl .newsletter-form .btn {
    margin-right: 0;
    margin-left: 0.5rem;
}

.rtl .newsletter-form .input-group {
    direction: rtl;
}

/* ============================================
   10. Breadcrumbs & Pagination
   ============================================ */

/* Breadcrumb separator */
.rtl .breadcrumb-item + .breadcrumb-item::before {
    float: right;
    padding-right: 0;
    padding-left: 0.5rem;
    content: var(--bs-breadcrumb-divider, "/");
}

/* Pagination arrow icons */
.rtl .pagination .page-link i,
.rtl .pagination .page-link .bi {
    transform: scaleX(-1);
}

/* Pagination alignment */
.rtl .pagination {
    direction: rtl;
    justify-content: flex-start;
}

.rtl .pagination .page-item {
    margin-right: 0;
    margin-left: 0.25rem;
}

/* ============================================
   11. Listing & Details Pages
   ============================================ */

/* Listing topbar filter alignment */
.rtl .listing-topbar {
    text-align: right;
}

.rtl .listing-topbar .filter-btn {
    margin-left: 0;
    margin-right: auto;
}

/* Listing sidebar positioning */
.rtl .listing-sidebar {
    order: 2;
}

.rtl .listing-content {
    order: 1;
}

/* Map section sticky positioning */
.rtl .map-section {
    left: auto;
    right: 0;
}

/* Feature list icon margins */
.rtl .feature-list i,
.rtl .feature-list .bi {
    margin-right: 0;
    margin-left: 0.75rem;
}

.rtl .feature-list li {
    text-align: right;
    padding-right: 2rem;
    padding-left: 0;
}

/* ============================================
   12. Cart & Checkout
   ============================================ */

/* Cart table column alignment */
.rtl .cart-table th,
.rtl .cart-table td {
    text-align: right;
}

.rtl .cart-table th:last-child,
.rtl .cart-table td:last-child {
    text-align: left;
}

/* Quantity control button order */
.rtl .quantity-control {
    direction: rtl;
}

.rtl .quantity-control .btn {
    margin-right: 0;
    margin-left: 0.25rem;
}

/* Cart summary positioning */
.rtl .cart-summary {
    text-align: right;
}

.rtl .cart-summary .summary-item {
    justify-content: space-between;
    direction: rtl;
}

/* Payment method icon spacing */
.rtl .payment-method i,
.rtl .payment-method .bi {
    margin-right: 0;
    margin-left: 0.75rem;
}

.rtl .payment-method label {
    padding-right: 2rem;
    padding-left: 0;
}

/* ============================================
   13. Testimonials & FAQ
   ============================================ */

/* Testimonial profile thumb positioning */
.rtl .testimonial-box .profile-thumb {
    margin-right: 0;
    margin-left: 1rem;
    float: right;
}

.rtl .testimonial-box .testimonial-content {
    text-align: right;
}

/* FAQ accordion icon alignment */
.rtl .faq-accordion .accordion-button {
    text-align: right;
    padding-right: 1.25rem;
    padding-left: 3rem;
}

.rtl .faq-accordion .accordion-button::after {
    left: 1rem;
    right: auto;
    margin-right: 0;
    margin-left: auto;
}

/* Quote icon positioning */
.rtl .quote-icon {
    left: auto;
    right: 20px;
}

.rtl .quote-icon i {
    transform: scaleX(-1);
}

/* ============================================
   14. Dashboard (User Panel)
   ============================================ */

/* Dashboard sidebar positioning */
.rtl .dashboard-sidebar {
    left: auto;
    right: 0;
}

/* Dashboard card icon margins */
.rtl .dashboard-card .icon {
    margin-right: 0;
    margin-left: 1rem;
}

/* Stat widget alignment */
.rtl .stat-widget {
    text-align: right;
}

.rtl .stat-widget .icon {
    left: auto;
    right: 1rem;
}

/* User avatar positioning */
.rtl .user-avatar {
    margin-right: 0;
    margin-left: 1rem;
}

/* ============================================
   15. Utility & Component Overrides
   ============================================ */

/* Text alignment utilities */
.rtl .text-start {
    text-align: right !important;
}

.rtl .text-end {
    text-align: left !important;
}

/* Float utilities */
.rtl .float-start {
    float: right !important;
}

.rtl .float-end {
    float: left !important;
}

/* Margin utilities */
.rtl .ms-1 { margin-right: 0.25rem !important; margin-left: 0 !important; }
.rtl .ms-2 { margin-right: 0.5rem !important; margin-left: 0 !important; }
.rtl .ms-3 { margin-right: 1rem !important; margin-left: 0 !important; }
.rtl .ms-4 { margin-right: 1.5rem !important; margin-left: 0 !important; }
.rtl .ms-5 { margin-right: 3rem !important; margin-left: 0 !important; }

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

/* Padding utilities */
.rtl .ps-1 { padding-right: 0.25rem !important; padding-left: 0 !important; }
.rtl .ps-2 { padding-right: 0.5rem !important; padding-left: 0 !important; }
.rtl .ps-3 { padding-right: 1rem !important; padding-left: 0 !important; }
.rtl .ps-4 { padding-right: 1.5rem !important; padding-left: 0 !important; }
.rtl .ps-5 { padding-right: 3rem !important; padding-left: 0 !important; }

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

/* Common button icon spacing */
.rtl .cmn-btn i,
.rtl .cmn-btn .bi {
    margin-right: 0;
    margin-left: 0.5rem;
}

/* Badge positioning */
.rtl .badge {
    margin-right: 0;
    margin-left: 0.5rem;
}

/* ============================================
   16. Animations & Transitions
   ============================================ */

/* Slide-in animations */
@keyframes slideInRight {
    from {
        transform: translateX(100%);
    }
    to {
        transform: translateX(0);
    }
}

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

.rtl .slide-in-right {
    animation: slideInLeft;
}

.rtl .slide-in-left {
    animation: slideInRight;
}

/* Marquee direction for brands section */
.rtl .brands-section .marquee {
    direction: rtl;
    animation-direction: reverse;
}

/* Carousel navigation arrows */
.rtl .carousel-control-prev,
.rtl .carousel-control-next {
    transform: scaleX(-1);
}

.rtl .owl-carousel .owl-nav .owl-prev,
.rtl .owl-carousel .owl-nav .owl-next {
    transform: scaleX(-1);
}

/* Swiper navigation */
.rtl .swiper-button-prev,
.rtl .swiper-button-next {
    transform: scaleX(-1);
}