Right-to-left structure setup for Arabic Language can be achieved using a custom script added to the Head:
<style>
div{direction:rtl !important;}
</style>
<style>
@import url('https://fonts.googleapis.com/css2?family=Barlow:wght@200;500&display=swap');
body * {
font-family: 'Barlow', sans-serif;
}
[class*=SearchInput]::placeholder {
font-family: 'Barlow', sans-serif;
font-weight: 200;
color: #d0b48f !important;
}
[class*=Breadcrumbs] [class*=Path] {
color: white;
transition: color 250ms ease;
}
[class*=Breadcrumbs] [class*=Path]:hover {
color: #d0b48f;
}
[class*=MenuItem] [class*=Href] {
color: #d0b48f;
transition: color 250ms ease;
}
[class*=MenuItem] [class*=Href]:hover {
color: white;
}
[class*=SearchInput]:focus{
border-bottom: 1px solid #d0b48f;
}
[class*=MagnifyingLabel] [class*=ColoredIcon], [class*=CrossIcon] [class*=ColoredIcon] {
fill: #d0b48f;
}
[class*=HeaderHolder], [class*=HeaderZone], [class*=MainZone], [class*=SidebarHolder], [class*=BreadcrumbsHolder] {
background-color: rgb(54 54 54);
}
h1[class*=H1], [class*=TotalResults] {
color: white;
font-family: 'Barlow', sans-serif;
font-weight: 200;
}
[class*=SectionLabel] [class*=SectionLabel__label], [class*=RecommendationsLink] {
font-family: 'Barlow', sans-serif;
font-weight: 200;
color: white;
}
[class*=FooterHolder]{
background-color: #ececec;
}
[class*=FooterCell]{
color: rgb(45, 45, 45);
}
[class*=Article] {
color: white;
}
[class*=Article] h1 {
color: white;
}
[class*=Title] {
color: #d0b48f;
}
[class*=Article] h2, [class*=Article] h3, [class*=Article] h4, [class*=Article] h5 {
color: #d0b48f !important;
}
[class*=CategoryLabel], [class*=MetaItem], [class*=Error] {
color: #d0b48f !important;
}
a[class*=Cell] {
background-color: #ffffff;
}
[class*=TitleHolder] h3[class*=H3] {
color: #363636;
}
[class*=Article] * {
background-color: transparent !important;
}
[class*=Article] * {
color: white;
}
[class*=FolderHref] {
color: #363636;
font-weight: 200;
}
</style>