/* RTL Overrides for Tailwind (when ) */
[dir="rtl"] body {
direction: rtl;
text-align: right;
}
/* Text alignment */
[dir="rtl"] .text-left {
text-align: right !important;
}
[dir="rtl"] .text-right {
text-align: right !important;
}
/* Margin overrides */
[dir="rtl"] .ml-0 {
margin-right: 0 !important;
margin-left: 0 !important;
}
[dir="rtl"] .ml-auto {
margin-right: auto !important;
margin-left: 0 !important;
}
[dir="rtl"] [class*="ml-"] {
margin-right: var(--tw-space-x-reverse, 0) !important;
margin-left: 0 !important;
}
[dir="rtl"] .mr-0 {
margin-left: 0 !important;
margin-right: 0 !important;
}
[dir="rtl"] .mr-auto {
margin-left: auto !important;
margin-right: 0 !important;
}
[dir="rtl"] [class*="mr-"] {
margin-left: var(--tw-space-x-reverse, 0) !important;
margin-right: 0 !important;
}
/* Padding overrides */
[dir="rtl"] [class*="pl-"] {
padding-right: inherit !important;
padding-left: 0 !important;
}
[dir="rtl"] [class*="pr-"] {
padding-left: inherit !important;
padding-right: 0 !important;
}
/* Flex direction (navigation, header, footer, etc.) */
/* Lists */
[dir="rtl"] ul,
[dir="rtl"] ol {
padding-left: 0;
}
/* Common components */
[dir="rtl"] .menu {
text-align: right;
}
[dir="rtl"] .hero-text {
text-align: right;
}
/* Optional: Swiper.js RTL */
[dir="rtl"] .swiper {
direction: rtl;
}
/* Keep header LTR */
[dir="rtl"] header,
[dir="rtl"] .navbar {
direction: ltr !important;
text-align: start !important;
}
/* Ensure main content is RTL */
[dir="rtl"] main {
direction: rtl !important;
text-align: right !important;
}
[dir="rtl"] .hero-text-container,
[dir="rtl"] .timeline-text p,
[dir="rtl"] .press-text p,
[dir="rtl"] .news-card p,
[dir="rtl"] .social-media-text p,
[dir="rtl"] .media-content p,
[dir="rtl"] .timeline-card p,
[dir="rtl"] .card-content p,
[dir="rtl"] .portfolio-card p,
[dir="rtl"] .text-container,
[dir="rtl"] .content-container,
[dir="rtl"] .card-content,
[dir="rtl"] .hero-text-container,
[dir="rtl"] .about-text-container,
[dir="rtl"] .portfolio-text-container,
[dir="rtl"] .timeline-text-container,
[dir="rtl"] .press-text-container,
[dir="rtl"] .news-text-container,
[dir="rtl"] .social-media-text-container,
[dir="rtl"] .media-content-container,
[dir="rtl"] .card-header__description {
text-align: right !important;
}
[dir="rtl"] .mobile-lang-menu .lang-menu-button,
[dir="rtl"] header .navbar .lang .lang-menu-button,
[dir="rtl"] .mobile-lang-menu a,
[dir="rtl"] .mobile-lang-menu button {
text-align: right !important;
}
[dir="rtl"] header .hero .hero-text-container,
[dir="rtl"] header .hero .hero-text-container .hero-text,
[dir="rtl"] header .hero .hero-text-container .hero-text h1,
[dir="rtl"] header .hero .hero-text-container .hero-text h2,
[dir="rtl"] header .hero .hero-text-container .hero-text p {
text-align: right !important;
}
[dir="rtl"] .navbar {
direction: rtl !important;
text-align: right !important;
}
/* Reset hero text to RTL as it's part of the main content */
[dir="rtl"] .hero-text-container,
[dir="rtl"] .hero-text h1,
[dir="rtl"] .hero-text h2,
[dir="rtl"] .hero-text p {
direction: rtl !important;
text-align: right !important;
}
/* Keep navbar items LTR */
[dir="rtl"] .navbar nav,
[dir="rtl"] .navbar h1,
[dir="rtl"] .navbar .menu {
direction: rtl !important;
text-align: right !important;
}
/* --- RTL Portfolio Section Overrides --- */
[dir="rtl"] .portfolio .portfolio-text,
[dir="rtl"] .portfolio .portfolio-text p {
text-align: center !important;
}
.portfolio .portfolio-text {
text-align: center !important;
}
.portfolio .portfolio-container .portfolio-text p {
text-align: center !important;
}
/* --- RTL Footer Overrides --- */
[dir="rtl"] .footer {
direction: rtl;
}
[dir="rtl"] .footer .footer-section-title,
[dir="rtl"] .footer .footer-section-description,
[dir="rtl"] .footer .footer-section-links {
text-align: right;
}
[dir="rtl"] .footer .form input {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
border-top-right-radius: 0.5rem;
border-bottom-right-radius: 0.5rem;
text-align: right;
}
[dir="rtl"] .footer .form button {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
border-top-left-radius: 0.5rem;
border-bottom-left-radius: 0.5rem;
}
[dir="rtl"] .footer-bottom {
flex-direction: row-reverse;
}
[dir="rtl"] .footer-bottom-links {
justify-content: flex-start;
}
/* --- RTL Modal Overrides --- */
[dir="rtl"] .modal-content {
direction: rtl;
text-align: right;
}
[dir="rtl"] .modal-close {
left: 1rem;
right: auto;
}
@media (max-width: 768px) {
[dir="rtl"] header .hero .hero-text-container .hero-text p {
text-align: center !important;
}
}