/*
 * PRIX Constructions — child theme styles (prix.sa)
 * Loaded after TheGem's generated CSS (see functions.php: prix_child_styles).
 * Arabic (RTL) is the main site; English (LTR) lives at /en/.
 */

/* ---------- 1. RTL arrows (Arabic only) ----------
   Button and footer/custom-menu arrows sit after the text and point left. */
html[dir="rtl"] .gem-button.gem-button-icon-position-right .gem-inner-wrapper-btn {
	flex-direction: row !important;
}
html[dir="rtl"] .gem-button.gem-button-icon-position-right .gem-button-icon {
	margin-left: 0 !important;
	margin-right: 15px !important;
}
html[dir="rtl"] .gem-button .gem-button-icon {
	transform: scaleX(-1);
}
html[dir="rtl"] .elementor-widget-thegem-custom-menu .icon i {
	display: inline-block;
	transform: scaleX(-1);
}
html[dir="rtl"] .elementor-widget-thegem-custom-menu a .icon {
	order: 2;
	margin-left: 0 !important;
	margin-right: 8px !important;
}

/* ---------- 2. English hero slogan (English only) ----------
   "Precision built.. / Excellence delivered" — each line fits its band. */
html:not([dir="rtl"]) #thegem-heading-413ed2d .thegem-heading-word,
html:not([dir="rtl"]) #thegem-heading-d44f44e .thegem-heading-word {
	font-size: .8em;
}

/* ---------- 3. Service accordion collages (Home 33362, Services 32899) ----------
   Demo proportions: square / 3:2 / ~5:4, so the collage has no empty corners. */
.elementor-33362 .elementor-element-adb6839 img,
.elementor-33362 .elementor-element-ba8f811 img,
.elementor-33362 .elementor-element-dfd169f img,
.elementor-33362 .elementor-element-00b9f1d img,
.elementor-32899 .elementor-element-dc92adf img,
.elementor-32899 .elementor-element-05a592a img,
.elementor-32899 .elementor-element-b6be919 img,
.elementor-32899 .elementor-element-3650585 img {
	aspect-ratio: 1 / 1;
	object-fit: cover;
	width: 100%;
	height: auto;
}

.elementor-33362 .elementor-element-8bf9afe img,
.elementor-33362 .elementor-element-933d3e0 img,
.elementor-33362 .elementor-element-3a85de6 img,
.elementor-33362 .elementor-element-8478334 img,
.elementor-32899 .elementor-element-ee087bf img,
.elementor-32899 .elementor-element-747eae3 img,
.elementor-32899 .elementor-element-8d0ef01 img,
.elementor-32899 .elementor-element-71c447d img {
	aspect-ratio: 3 / 2;
	object-fit: cover;
	width: 100%;
	height: auto;
}

.elementor-33362 .elementor-element-e45f638 img,
.elementor-33362 .elementor-element-97f775f img,
.elementor-33362 .elementor-element-7845c0d img,
.elementor-33362 .elementor-element-c6f34bf img,
.elementor-32899 .elementor-element-cf8a20d img,
.elementor-32899 .elementor-element-6ea15d0 img,
.elementor-32899 .elementor-element-1c9b350 img,
.elementor-32899 .elementor-element-44db8c0 img {
	aspect-ratio: 500 / 408;
	object-fit: cover;
	width: 100%;
	height: auto;
}

/* Two images side by side share the row equally and sit on a common baseline (like the demo). */
.elementor-33362 .e-n-accordion .e-con:has(> .elementor-widget-image + .elementor-widget-image),
.elementor-32899 .e-n-accordion .e-con:has(> .elementor-widget-image + .elementor-widget-image) {
	align-items: flex-end;
}
.elementor-33362 .e-n-accordion .elementor-widget-image,
.elementor-32899 .e-n-accordion .elementor-widget-image {
	flex: 1 1 0;
	min-width: 0;
}
.elementor-33362 .e-n-accordion .elementor-widget-image img,
.elementor-32899 .e-n-accordion .elementor-widget-image img {
	border-radius: 15px;
}

/* ---------- 4. Button alignment (Arabic only) ----------
   Buttons set to "left" in the demo layout start on the right in RTL (and vice versa).
   The prix-btn-pos-* classes are added in functions.php. */
html[dir="rtl"] .prix-btn-pos-left .gem-button-container {
	text-align: right !important;
}
html[dir="rtl"] .prix-btn-pos-right .gem-button-container {
	text-align: left !important;
}

/* Accordion text column vs. small image (Arabic only): mirror the demo's inner paddings
   so the gap sits between text and image (start/end swapped for RTL). */
html[dir="rtl"] .e-n-accordion .e-con:has(> .elementor-widget-thegem-styledbutton) {
	padding-left: 20px !important;
	padding-right: 0 !important;
}
html[dir="rtl"] .e-n-accordion .e-con:has(> .elementor-widget-image:only-child) {
	padding-right: 20px !important;
	padding-left: 0 !important;
}

/* About: experience counter (+14) is set to "left" for English; mirror it on the Arabic site. */
html[dir="rtl"] .elementor-32575 .elementor-element.elementor-element-b8c304c {
	text-align: right !important;
}

/* Big headings (title areas, hero, section titles, footer) sit on a rule that clips at the
   baseline. Arabic letters (ن، ي، ع...) drop below it, so move the rule down on the Arabic site only. */
html[dir="rtl"] .thegem-heading.title-xlarge {
	padding-bottom: .24em;
}

/* Breadcrumbs (title areas, posts, projects): put the separator between items on the Arabic site. */
html[dir="rtl"] [class*="-breadcrumbs"] ul li:not(:last-child) {
	padding-right: 0 !important;
	margin-right: 0 !important;
	padding-left: 20px !important;
	margin-left: 5px !important;
}
html[dir="rtl"] [class*="-breadcrumbs"] ul li:not(:last-child)::after {
	right: auto !important;
	left: 0 !important;
}

/* Legal & support pages (Privacy Policy 6858, Terms & Conditions 33828, Support 33829). */
.page-id-6858 .page-title-block .thegem-heading.title-xlarge,
.page-id-33828 .page-title-block .thegem-heading.title-xlarge {
	font-size: min(120px, 8.5vw);
	line-height: 1;
}
.page-id-6858 .entry-content,
.page-id-33828 .entry-content,
.page-id-33829 .entry-content {
	max-width: 900px;
	padding: 70px 0 90px;
}
.page-id-6858 .entry-content h2,
.page-id-33828 .entry-content h2,
.page-id-33829 .entry-content h2 {
	font-size: 30px;
	line-height: 1.3;
	margin: 45px 0 15px;
}
.page-id-6858 .entry-content p,
.page-id-33828 .entry-content p,
.page-id-33829 .entry-content p,
.page-id-6858 .entry-content li,
.page-id-33828 .entry-content li,
.page-id-33829 .entry-content li {
	font-size: 17px;
	line-height: 1.8;
}
.page-id-6858 .entry-content ul,
.page-id-33828 .entry-content ul,
.page-id-33829 .entry-content ul {
	list-style: disc;
	padding-inline-start: 1.3em;
	margin: 0 0 15px;
}
.page-id-6858 .entry-content li,
.page-id-33828 .entry-content li,
.page-id-33829 .entry-content li {
	margin-bottom: 8px;
}
.page-id-6858 .entry-content a,
.page-id-33828 .entry-content a,
.page-id-33829 .entry-content a {
	color: #F05E22;
}
@media (max-width: 767px) {
	.page-id-6858 .entry-content,
	.page-id-33828 .entry-content,
	.page-id-33829 .entry-content { padding: 40px 0 60px; }
	.page-id-6858 .entry-content h2,
	.page-id-33828 .entry-content h2,
	.page-id-33829 .entry-content h2 { font-size: 24px; margin-top: 35px; }
}

/* Vertical custom menus (footer Company / Services): on the Arabic site the arrow follows the last
   line of the text, so two-line items do not leave the arrow floating far from the words. */
html[dir="rtl"] .thegem-menu-custom--vertical li > a:has(> .icon > i) {
	display: block !important;
}
html[dir="rtl"] .thegem-menu-custom--vertical li > a:has(> .icon > i) > .icon {
	display: none !important;
}
html[dir="rtl"] .thegem-menu-custom--vertical li > a:has(> .icon > i) > .text {
	display: inline !important;
}
html[dir="rtl"] .thegem-menu-custom--vertical li > a:has(> .icon > i)::after {
	content: "$" !important;
	position: static !important;
	opacity: 1 !important;
	background: none !important;
	width: auto !important;
	height: auto !important;
	font-family: "ElegantIcons";
	font-size: 16px;
	line-height: 1;
	display: inline-block;
	vertical-align: middle;
	transform: scaleX(-1);
	margin-right: 8px;
	speak: none;
}

/* Horizontal custom menus (footer legal links): TheGem pulls the first item to the left edge;
   on the Arabic site the first item is on the right, so pull it right instead. */
html[dir="rtl"] .thegem-menu-custom.thegem-menu-custom--horizontal.thegem-menu-custom--left ul.nav-menu-custom li:first-child a {
	margin-left: 0 !important;
	margin-right: -0.7em !important;
}
