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

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

[dir="rtl"] .ml-2,
[dir="rtl"] .ml-3,
[dir="rtl"] .ml-4 {
    margin-left: 0;
    margin-right: 0.5rem;
}

[dir="rtl"] .mr-2,
[dir="rtl"] .mr-3,
[dir="rtl"] .mr-4 {
    margin-right: 0;
    margin-left: 0.5rem;
}

[dir="rtl"] .pl-4 {
    padding-left: 0;
    padding-right: 1rem;
}

[dir="rtl"] .pr-4 {
    padding-right: 0;
    padding-left: 1rem;
}

/* Button and icon adjustments */
[dir="rtl"] .btn i,
[dir="rtl"] .instagram-cta i {
    margin-right: 0;
    margin-left: 8px;
}

[dir="rtl"] .price-tag {
    right: auto;
    left: 20px;
}

[dir="rtl"] .scroll-top {
    right: auto;
    left: 20px;
}

/* Form elements */
[dir="rtl"] .contact-form input,
[dir="rtl"] .contact-form textarea {
    text-align: right;
}

/* Menu items */
[dir="rtl"] .product-card {
    text-align: right;
}

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

/* Contact Section RTL Fixes */
[dir="rtl"] .contact-section {
    text-align: right;
}

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

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

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

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

[dir="rtl"] .contact-info-item {
    padding-right: 30px;
    padding-left: 0;
    position: relative;
}

[dir="rtl"] .contact-info-item i {
    position: absolute;
    right: 0;
    left: auto;
}

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

[dir="rtl"] .contact-form .send-message-btn {
    float: right;
}

[dir="rtl"] .instagram-feed {
    order: 2 !important;
}

[dir="rtl"] .instagram-content {
    order: 1 !important;
    text-align: right !important;
}

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

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

[dir="rtl"] .instagram-content .text-center.md\:text-left {
    text-align: right !important;
}

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

[dir="rtl"] .phone-mockup {
    transform: perspective(1000px) rotateY(-5deg) !important;
}

[dir="rtl"] .instagram-cta i {
    margin-right: 0 !important;
    margin-left: 8px !important;
}

/* Text alignment */
[dir="rtl"] section.py-20.bg-gray-100.relative.overflow-hidden h2,
[dir="rtl"] section.py-20.bg-gray-100.relative.overflow-hidden p {
    text-align: right !important;
}

/* Decorative elements positioning */
[dir="rtl"] section.py-20.bg-gray-100.relative.overflow-hidden .absolute.-right-10 {
    right: auto !important;
    left: -2.5rem !important;
}

[dir="rtl"] section.py-20.bg-gray-100.relative.overflow-hidden .absolute.-left-8 {
    left: auto !important;
    right: -2rem !important;
}

[dir="rtl"] section.py-20.bg-gray-100.relative.overflow-hidden .absolute.top-10.right-0 {
    right: auto !important;
    left: 0 !important;
}

/* Price tag positioning - more precise */
[dir="rtl"] section.py-20.bg-gray-100.relative.overflow-hidden .absolute.-right-10.top-20 {
    right: auto !important;
    left: -2.5rem !important;
    transform: rotate(-12deg) !important;
}

/* Mobile handling improvements */
@media (max-width: 768px) {
    [dir="rtl"] section.py-20.bg-gray-100.relative.overflow-hidden .md\:w-1\/2:first-child,
    [dir="rtl"] section.py-20.bg-gray-100.relative.overflow-hidden .md\:w-1\/2:last-child {
        order: 0 !important; /* Reset ordering on mobile */
        padding-right: 0 !important;
        width: 100% !important;
    }
    
    [dir="rtl"] section.py-20.bg-gray-100.relative.overflow-hidden h2,
    [dir="rtl"] section.py-20.bg-gray-100.relative.overflow-hidden p {
        text-align: center !important;
    }
    
    /* Fix price tag on small screens */
    [dir="rtl"] section.py-20.bg-gray-100.relative.overflow-hidden .absolute.-right-10.top-20 {
        left: 10px !important;
        top: 10px !important;
        transform: rotate(0deg) !important;
    }
}

@media (max-width: 480px) {
    /* Even smaller screens */
    [dir="rtl"] .hero-gradient h2 {
        font-size: 2rem !important;
    }
    
    [dir="rtl"] section.py-20.bg-gray-100.relative.overflow-hidden .absolute.-right-10,
    [dir="rtl"] section.py-20.bg-gray-100.relative.overflow-hidden .absolute.-left-8,
    [dir="rtl"] section.py-20.bg-gray-100.relative.overflow-hidden .absolute.top-10.right-0 {
        display: none !important; /* Hide decorative elements on very small screens */
    }
}

/* Product Detail Section RTL Fixes */
[dir="rtl"] .product-detail-section {
    text-align: right !important;
}

[dir="rtl"] .product-detail-section .image-container {
    order: 2 !important; /* Force image to right side */
}

[dir="rtl"] .product-detail-section .text-container {
    order: 1 !important; /* Force text to left side */
    text-align: right !important;
    padding-left: 2rem !important;
    padding-right: 0 !important;
}

/* Fix for single product display (like the latte) */
[dir="rtl"] .menu-item-detail {
    text-align: right !important;
}

[dir="rtl"] .menu-item-detail .product-image {
    float: right !important;
    margin-left: 2rem !important;
    margin-right: 0 !important;
}

[dir="rtl"] .menu-item-detail .product-desc {
    text-align: right !important;
    float: left !important;
}

[dir="rtl"] .menu-item-detail .price-tag {
    right: auto !important;
    left: 20px !important;
}

[dir="rtl"] .menu-item-detail .learn-more-btn {
    float: left !important;
}

/* Force the image to right side in RTL */
[dir="rtl"] section.py-20.bg-gray-100.relative.overflow-hidden .md\:w-1\/2:first-child {
    order: 2 !important;
}

[dir="rtl"] section.py-20.bg-gray-100.relative.overflow-hidden .md\:w-1\/2:last-child {
    order: 1 !important;
    padding-right: 3rem !important;
    padding-left: 0 !important;
}

/* Ensure text alignment is correct */
[dir="rtl"] section.py-20.bg-gray-100.relative.overflow-hidden h2,
[dir="rtl"] section.py-20.bg-gray-100.relative.overflow-hidden p {
    text-align: right !important;
}

/* Button alignment */
[dir="rtl"] section.py-20.bg-gray-100.relative.overflow-hidden .btn-primary {
    float: right !important;
}

/* Fix promotional banner decorative elements positions */
[dir="rtl"] section.py-20.bg-gray-100.relative.overflow-hidden .absolute.-right-10 {
    right: auto !important;
    left: -2.5rem !important;
}

[dir="rtl"] section.py-20.bg-gray-100.relative.overflow-hidden .absolute.-left-8 {
    left: auto !important;
    right: -2rem !important;
}

[dir="rtl"] section.py-20.bg-gray-100.relative.overflow-hidden .absolute.top-10.right-0 {
    right: auto !important;
    left: 0 !important;
}

/* Price tag positioning */
[dir="rtl"] section.py-20.bg-gray-100.relative.overflow-hidden .absolute.-right-10.top-20 {
    right: auto !important;
    left: -2.5rem !important;
}

/* Responsive Fixes for Small Screens */
@media (max-width: 768px) {
    [dir="rtl"] section.py-20.bg-gray-100.relative.overflow-hidden .md\:w-1\/2:last-child {
        padding-right: 0 !important;
    }
    
    /* Fix image positioning on small screens */
    [dir="rtl"] section.py-20.bg-gray-100.relative.overflow-hidden .absolute.-right-10.top-20 {
        left: 10px !important;
        top: 10px !important;
    }
}

@media (max-width: 480px) {
    [dir="rtl"] .hero-gradient h2 {
        font-size: 2rem !important;
    }
    
    [dir="rtl"] section.py-20.bg-gray-100.relative.overflow-hidden .md\:w-1\/2 {
        text-align: right !important;
    }
}

/* Footer RTL Styles - Updated for simplified footer */
[dir="rtl"] footer {
    text-align: right !important;
}

/* Fix logo alignment in footer */
[dir="rtl"] footer .flex.items-center img {
    margin-right: 0 !important;
    margin-left: 0.5rem !important;
}

/* Align the social media section in RTL mode */
[dir="rtl"] footer .flex.flex-col.items-start.md\:items-end {
    align-items: flex-start !important;
}

@media (min-width: 768px) {
    [dir="rtl"] footer .flex.flex-col.items-start.md\:items-end {
        align-items: flex-start !important;
    }
}

/* Fix social media icons spacing */
[dir="rtl"] footer .flex.space-x-4 {
    display: flex !important;
    flex-direction: row !important;
}

[dir="rtl"] footer .flex.space-x-4 > * {
    margin-left: 0 !important;
}

[dir="rtl"] footer .flex.space-x-4 > * + * {
    margin-right: 1rem !important;
}

/* Fix footer bottom section alignment */
[dir="rtl"] footer .flex.flex-col.md\:flex-row {
    text-align: right !important;
}

@media (max-width: 768px) {
    /* Center align footer on mobile */
    [dir="rtl"] footer .grid > div,
    [dir="rtl"] footer .flex.flex-col.md\:flex-row .text-sm.text-gray-500 {
        text-align: center !important;
    }
    
    /* Center social icons on mobile */
    [dir="rtl"] footer .flex.space-x-4 {
        justify-content: center !important;
    }

    [dir="rtl"] footer .flex.flex-col.items-start.md\:items-end {
        align-items: center !important;
    }
} 