/*
 * AdvertUp RTL layer: loaded only on right-to-left (Arabic) pages, after site.css.
 * Replaces the Arabic parts of Additional CSS (#6277) and WPCode 17441, 17442, 17443, 17447 (CSS).
 * Logical properties where the theme uses physical ones. Findings: GAP6-01, GAP6-03, GAP6-04, GAP6-05,
 * GAP6-12, GAP6-13, GAP5-02, GAP5-06.
 */

/* ---------- Testimonials (GAP6-01 stop-gap, live since 26 Sep): owl runs with rtl:false. ---------- */
.elementor-widget-ft-testimonials.slide-review,
.elementor-widget-ft-testimonials.slide-right {
	direction: ltr;
}

/* ---------- Arabic font (Almarai is loaded for RTL pages only, see rtl.php) ---------- */
h1:lang(ar), h2:lang(ar), h3:lang(ar), h4:lang(ar), h5:lang(ar), h6:lang(ar),
p:lang(ar), span:lang(ar), a:lang(ar), div:lang(ar), body:lang(ar),
li:lang(ar), ul:lang(ar), ol:lang(ar), button:lang(ar), table:lang(ar),
input:lang(ar), select:lang(ar), textarea:lang(ar) {
	font-family: var(--au-font-ar) !important;
}

/* ---------- Base alignment: the theme loads the LTR bootstrap.min.css (body{text-align:left}) ---------- */
body {
	text-align: right;
}

.ft-tabs-nav,
.ft-tabs-content,
.royalstudio-card {
	text-align: right;
}

.team-meta-block {
	text-align: right !important;
}

.sidebar {
	margin-right: auto !important;
}

/* Post cards on theme templates (blog, search, archives, related posts) carry Bootstrap's .text-left. */
.blog-grid-content.text-left {
	text-align: right !important;
}

/* ---------- Stretched sections: Elementor's stretch() leaves a 15 px sideways scroll with a
   left-hand scrollbar (GAP6-03). The Full Width template already spans the page. ---------- */
.elementor-section.elementor-section-stretched {
	right: 0 !important;
	left: auto !important;
}

/* ---------- Header (GAP6-05): mirror the logo gap and the hamburger position ---------- */
.site-header-main .logo-main.mr-10 {
	margin-right: 0;
	margin-left: 5rem;
}

.site-header-main #menu-toggle.ml-auto {
	margin-left: 0 !important;
	margin-right: auto !important;
}

/* Fullscreen trigger spacing (was WPCode 17441). */
.extra-menu-button.fullscreen-menu-btn > a.nav-link {
	margin-left: 15px;
}

/* ---------- Mobile side menu: slides in from the left, items right-aligned ---------- */
.royalstudio-side-menu {
	right: auto;
	left: 0;
	transform: translate3d(-425px, 0, 0);
	-webkit-transform: translate3d(-425px, 0, 0);
	text-align: right;
}

.royalstudio-side-opened .royalstudio-side-menu {
	transform: translate3d(0, 0, 0);
	-webkit-transform: translate3d(0, 0, 0);
}

.royalstudio-side-menu .royalstudio-side-top,
.royalstudio-side-menu .royalstudio-side-inner {
	transform: translateX(-50px);
}

.royalstudio-side-opened .royalstudio-side-menu .royalstudio-side-top,
.royalstudio-side-opened .royalstudio-side-menu .royalstudio-side-inner {
	transform: translateX(0);
}

.royalstudio-side-menu .royalstudio-side-inner,
.royalstudio-side-inner ul.royalstudio-side-inner-menu,
.royalstudio-side-inner ul li {
	float: right;
}

.close-side-menu-icon {
	float: left;
	margin-right: 0;
	margin-left: -6px;
}

/* ---------- Fullscreen menu (was WPCode 17442) ---------- */
.fullscreen-menu-panel,
.fullscreen-menu .widget-content {
	direction: rtl;
	text-align: right;
}

.fullscreen-menu-content .row {
	display: flex;
	flex-direction: row-reverse;
	align-items: flex-start;
}

.fullscreen-menu-content .col-lg-8,
.fullscreen-menu-content .col-lg-4,
ul.fullscreen-menu,
ul.fullscreen-menu li {
	text-align: right;
}

ul.fullscreen-menu {
	padding-right: 0;
	padding-left: 0;
}

ul.fullscreen-menu li a.nav-link {
	direction: rtl;
	text-align: right;
	justify-content: flex-start;
}

.fullscreen-menu .widget-content {
	line-height: 1.9;
}

.fullscreen-menu .widget-content h3 {
	margin-bottom: 10px;
}

.fullscreen-menu-content {
	overflow: visible;
}

.fullscreen-menu-panel {
	overflow-y: auto;
}

@media (max-width: 991px) {
	.fullscreen-menu-content .row {
		display: block;
	}

	ul.fullscreen-menu li a.nav-link {
		font-size: 36px;
		line-height: 1.3;
	}
}

/* Home hero on phones (GAP6-04): the teal circle is mirrored at the source by CONTENT migration 0406
   (#15865 d3e4719 _margin_mobile), and the typed word moves into the heading; no CSS needed here. */

/* ---------- Arrows: the theme's vendor-red arrows point right (GAP6-05) ---------- */
.post-read-more + svg,
.team-open-link svg {
	transform: scaleX(-1);
	margin-left: 0 !important;
	margin-right: 16px !important;
}

/* Footer menu bullets (Genericons arrow on li::before) point the reading direction. */
.widget_nav_menu li::before {
	display: inline-block;
	transform: scaleX(-1);
}

/* ---------- Contact form rows: -15px row margins scroll the AR contact page sideways (GAP6-12) ---------- */
.wpcf7 .row {
	margin-inline: 0;
}

/* ---------- Arabic blog template (was WPCode 17443/17447; header image and subtitle now come from page #16037) ---------- */
body.page-template-template-blog-classic .page-content,
body.page-template-template-blog-classic .page-sidebar,
body.page-template-template-blog-classic .blog-grid-content,
body.page-template-template-blog-classic .sidebar,
body.page-template-template-blog-classic .blog-grid-meta,
body.page-template-template-blog-classic .meta-holder,
body.page-template-template-blog-classic .post-details,
body.page-template-template-blog-classic .widget,
body.page-template-template-blog-classic .widget-content,
body.page-template-template-blog-classic .widget-title-container {
	direction: rtl;
	text-align: right;
}

body.page-template-template-blog-classic .page-content article .blog-grid-meta {
	display: none !important;
}

body.page-template-template-blog-classic .author-avatar {
	margin-left: 15px;
	margin-right: 0;
}

body.page-template-template-blog-classic .blog-grid-image img {
	width: 100%;
	height: 400px;
	object-fit: cover;
}

body.page-template-template-blog-classic .search-form {
	direction: rtl;
}

body.page-template-template-blog-classic .search-field {
	text-align: right;
}

body.page-template-template-blog-classic .categories__list {
	direction: rtl;
	text-align: right;
	padding-right: 0;
}

body.page-template-template-blog-classic .categories__list li {
	margin-left: 28px;
	margin-right: 0;
}

@media (max-width: 991px) {
	body.page-template-template-blog-classic .page-content {
		padding-right: 0 !important;
	}

	body.page-template-template-blog-classic .blog-grid-image img {
		height: auto;
	}

	body.page-template-template-blog-classic #main.site-main {
		display: block !important;
	}

	body.page-template-template-blog-classic .page-content.with-right-sidebar,
	body.page-template-template-blog-classic .page-sidebar.sidebar-right {
		width: 100% !important;
		max-width: 100% !important;
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	body.page-template-template-blog-classic .page-sidebar .royalstudio-widget-list .blog-grid-image {
		height: 220px !important;
	}
}

@media (min-width: 992px) {
	body.page-template-template-blog-classic #main.site-main {
		display: flex !important;
		flex-direction: row-reverse !important;
		align-items: flex-start !important;
		gap: 60px !important;
	}

	body.page-template-template-blog-classic .page-content.with-right-sidebar {
		width: calc(100% - 360px) !important;
		max-width: calc(100% - 360px) !important;
		float: none !important;
		order: 1 !important;
		padding-right: 0 !important;
		padding-left: 3rem !important;
	}

	body.page-template-template-blog-classic .page-sidebar.sidebar-right {
		width: 300px !important;
		max-width: 300px !important;
		float: none !important;
		order: 2 !important;
		margin-top: 0 !important;
		clear: none !important;
	}
}

body.page-template-template-blog-classic .page-sidebar .royalstudio-widget-list .blog-grid-image {
	width: 100% !important;
	height: 193px !important;
	overflow: hidden !important;
	border-radius: 4px !important;
	margin-bottom: 26px !important;
}

body.page-template-template-blog-classic .page-sidebar .royalstudio-widget-list .blog-grid-image a {
	display: block !important;
	width: 100% !important;
	height: 100% !important;
}

body.page-template-template-blog-classic .page-sidebar .royalstudio-widget-list .blog-grid-image img {
	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	object-fit: cover !important;
	object-position: center center !important;
	display: block !important;
}

body.page-template-template-blog-classic .page-sidebar .royalstudio-widget-list li {
	padding-bottom: 34px !important;
	margin-bottom: 34px !important;
	border-bottom: 1px solid #e5e5e5 !important;
}

body.page-template-template-blog-classic .page-sidebar .royalstudio-widget-list li:last-child {
	border-bottom: 0 !important;
}

/* ---------- Pagination (server-side labels from i18n.php): arrows point the reading direction ---------- */
.navigation.pagination .prev.page-numbers,
.navigation.pagination .next.page-numbers {
	display: inline-flex;
	align-items: center;
	gap: 6px;
}


/* The theme's rtl.css (Twenty Sixteen leftovers) gives .entry-content fixed side margins from 710 px up. RoyalStudio
   uses that class on a full-width .container, so AR posts scrolled sideways by 52-60 px at 768-1280 px (GAP6-03).
   Keep the container centred as in the English layout. */
html[dir="rtl"] .container.entry-content {
	margin-left: auto;
	margin-right: auto;
}