html[dir="rtl"] body {
    direction: rtl;
    text-align: right;
    font-family: "Tajawal", "Work Sans", sans-serif;
}

html[dir="rtl"] .space-x-8 > :not([hidden]) ~ :not([hidden]) {
    --tw-space-x-reverse: 1;
}

html[dir="rtl"] .swiper-button-next,
html[dir="rtl"] .swiper-rtl .swiper-button-next {
    left: var(--swiper-navigation-sides-offset, 10px);
    right: auto;
}

html[dir="rtl"] .swiper-button-prev,
html[dir="rtl"] .swiper-rtl .swiper-button-prev {
    right: var(--swiper-navigation-sides-offset, 10px);
    left: auto;
}

html[dir="rtl"] .material-symbols-outlined {
    direction: ltr;
}