/* RTL CSS for Product Page - Handle English text in RTL context */

/* Force LTR direction for product names, titles, and descriptions */
/* This ensures English text displays correctly even when page is in RTL mode */

/* Product names in grid - respect dir attribute but keep centered */
.product-name {
    unicode-bidi: embed;
    text-align: center; /* Keep centered regardless of language */
}

/* Category titles */
.category-title {
    direction: ltr;
    text-align: center;
    unicode-bidi: embed;
}

/* Product detail title - respect dir attribute */
.detail-title {
    unicode-bidi: embed;
}

.detail-title[dir="ltr"] {
    text-align: left;
}

.detail-title[dir="rtl"] {
    text-align: right;
}

/* Product detail description - respect dir attribute */
.detail-description {
    unicode-bidi: embed;
}

.detail-description[dir="ltr"] {
    text-align: left;
}

.detail-description[dir="rtl"] {
    text-align: right;
}

/* Price display */
.rp {
    direction: ltr;
    text-align: center;
    unicode-bidi: embed;
}

/* Product card container - maintain center alignment but LTR text */
.product-card {
    direction: ltr;
}

/* Ensure product images maintain proper alignment */
.product-image {
    direction: ltr;
}

/* Detail content container */
.detail-content {
    direction: ltr;
}

/* Make wrapper a flex container for both English and Arabic */
/* This ensures image and description are side by side */
.detail-content-wrapper {
    display: flex;
    gap: 2rem;
    align-items: flex-start;
    position: relative;
}

/* For Arabic content, reverse the layout */
/* This will put image on right, description and button on left */
.detail-content-wrapper.has-arabic-content {
    flex-direction: row-reverse;
}

/* Adjust close button position for Arabic layout - move to left side */
.detail-content.has-arabic-content .close-detail-btn {
    left: -10px;
    right: auto;
}

/* Buy online button alignment for Arabic layout - left align */
.detail-content-wrapper.has-arabic-content .detail-info .btn.btn-primary {
    align-self: flex-start;
}

/* Detail image container */
.detail-image {
    direction: ltr;
}

/* Detail info container */
.detail-info {
    direction: ltr;
}

/* Carousel content - maintain LTR for product listings */
.carousel-content {
    direction: ltr;
}

/* Products grid - maintain LTR layout */
.products-grid {
    direction: ltr;
}

/* Responsive adjustments for RTL mode */
@media (max-width: 991px) {
    .detail-title {
        text-align: left;
    }
    
    .detail-description {
        text-align: left;
    }
}

@media (max-width: 767px) {
    .detail-title {
        text-align: left;
    }
    
    .detail-description {
        text-align: left;
    }
}

@media (max-width: 575px) {
    .detail-title {
        text-align: left;
    }
    
    .detail-description {
        text-align: left;
    }
}

