/* RTL overrides — applied when */
[dir="rtl"] {
text-align: right;
}
/* Chat FAB and panel — flip to left side in RTL */
[dir="rtl"] .chat-fab {
right: auto;
left: 24px;
}
[dir="rtl"] .chat-panel {
right: auto;
left: 24px;
transform-origin: bottom left;
}
/* Chat message bubbles */
[dir="rtl"] .user-message {
align-self: flex-start;
border-bottom-right-radius: var(--radius-md, 10px);
border-bottom-left-radius: 4px;
}
[dir="rtl"] .bot-message {
align-self: flex-end;
border-bottom-left-radius: var(--radius-md, 10px);
border-bottom-right-radius: 4px;
}
[dir="rtl"] .product-card {
align-self: flex-end;
}
/* Discount badge — flip to top-left */
[dir="rtl"] .discount-badge {
right: auto;
left: var(--space-3, 12px);
}
/* Highlighted card label — flip to right */
[dir="rtl"] .product-card-highlighted::before {
left: auto;
right: 0;
border-radius: 0 0 0 var(--radius-sm, 6px);
}
/* Back link arrow */
[dir="rtl"] .back-link {
direction: rtl;
}
/* View deal arrow flip */
[dir="rtl"] .view-deal-btn-arrow {
transform: rotate(180deg);
}
[dir="rtl"] .view-deal-btn:hover .view-deal-btn-arrow {
transform: rotate(180deg) translateX(2px);
}
/* Product features check icon */
[dir="rtl"] .product-detail-features li::before {
order: 1;
}
/* Category intro border */
[dir="rtl"] .category-intro {
border-left: none;
border-right: 3px solid var(--accent, #ff9900);
padding-left: 0;
padding-right: var(--space-4, 16px);
}
/* Pagination arrows */
[dir="rtl"] .pagination {
flex-direction: row-reverse;
}
/* Comparison panel product order */
[dir="rtl"] .comparison-products {
flex-direction: row-reverse;
}
/* Search hero RTL */
[dir="rtl"] .search-hero-input {
text-align: right;
padding-left: var(--space-5, 20px);
padding-right: var(--space-9, 48px);
}
[dir="rtl"] .search-input-icon {
left: auto;
right: var(--space-4, 16px);
}
[dir="rtl"] .was-price {
margin-right: 0;
margin-left: 6px;
}
/* Scroll arrows flip */
[dir="rtl"] .scroll-arrow-left {
left: auto;
right: -18px;
}
[dir="rtl"] .scroll-arrow-right {
right: auto;
left: -18px;
}
/* Scroll gradient flip */
[dir="rtl"] .product-grid-horizontal {
mask-image: linear-gradient(to left, transparent, black 2%, black 98%, transparent);
-webkit-mask-image: linear-gradient(to left, transparent, black 2%, black 98%, transparent);
}
/* Footer layout */
[dir="rtl"] .footer-inner {
text-align: right;
}
/* Collapsible chevron */
[dir="rtl"] .collapsible-icon {
margin-inline-start: 0;
margin-inline-end: var(--space-3, 12px);
}
/* Breadcrumb */
[dir="rtl"] .breadcrumb {
flex-direction: row-reverse;
}
/* Noon pages */
[dir="rtl"] .noon-marketplace-hero h1 {
flex-direction: row-reverse;
}
@media (max-width: 480px) {
[dir="rtl"] .chat-panel {
left: 8px;
right: auto;
}
}
@media (max-width: 768px) {
[dir="rtl"] .footer-inner {
text-align: center;
}
}