/*
 * Maple Corporate Services – brand layer over Consultio.
 * Palette is sampled from the Maple logo; keep values in sync with the Consultio theme options.
 */
:root {
	--maple-teal: #009aaa;      /* logo bright teal – buttons, accents, icons */
	--maple-teal-deep: #006b73; /* logo deep teal – hovers, secondary accents */
	--maple-ink: #0d3236;       /* dark sections, top bar, footer */
	--maple-link: #007f8c;      /* text links: AA contrast on white */
	--maple-tint: #e8f6f7;      /* light section backgrounds */
	--maple-radius: 10px;
}

/* Top bar – parent layout 6 hard-codes near-black with a two-ID selector, matched here */
#ct-header-wrap #ct-header-top.ct-header-top6 {
	background-color: var(--maple-ink);
}

/* Logo – parent header layout caps it at 50px, too small for the stacked wordmark */
#ct-header-wrap .ct-header-branding img,
#ct-header-wrap .logo-dark img,
#ct-header-wrap .logo-light img {
	max-height: 60px;
	width: auto;
}
#ct-header-wrap.h-fixed .ct-header-branding img,
#ct-header-wrap.h-fixed .logo-dark img {
	max-height: 48px;
}
@media (max-width: 991px) {
	#ct-header-wrap .ct-header-branding img,
	#ct-header-wrap .logo-dark img,
	#ct-header-wrap .logo-light img {
		max-height: 44px;
	}
}

/* Body text links meet WCAG AA; headings and buttons keep the brighter teal */
.entry-content a:not(.btn):not(.elementor-button),
.elementor-text-editor a {
	color: var(--maple-link);
}
.entry-content a:not(.btn):not(.elementor-button):hover,
.elementor-text-editor a:hover {
	color: var(--maple-teal-deep);
}

/* Language switcher (Polylang) – flag + name dropdown in the main header bar and beside the mobile menu button */
.maple-lang { position: relative; display: inline-flex; align-items: center; }
.maple-lang__dd { position: relative; }
.maple-lang__toggle {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 40px;
	padding: 6px 4px;
	border: 0;
	background: transparent;
	color: var(--maple-ink);
	font-size: 0.9rem;
	font-weight: 500;
	line-height: 1;
	cursor: pointer;
	list-style: none;
	user-select: none;
	transition: color .2s;
}
.maple-lang__toggle::-webkit-details-marker { display: none; }
.maple-lang__toggle:hover,
.maple-lang__dd[open] > .maple-lang__toggle { color: var(--maple-link); }
.maple-lang__flag {
	inline-size: 22px;
	block-size: 15px;
	flex: none;
	border-radius: 2px;
	box-shadow: 0 0 0 1px rgba(13, 50, 54, 0.15);
}
.maple-lang__caret {
	inline-size: 7px;
	block-size: 7px;
	border-right: 2px solid currentColor; /* physical sides: the arrow points down in both directions */
	border-bottom: 2px solid currentColor;
	transform: translateY(-2px) rotate(45deg);
	transition: transform .2s;
}
.maple-lang__dd[open] .maple-lang__caret { transform: translateY(2px) rotate(-135deg); }
.maple-lang__menu {
	position: absolute;
	inset-block-start: calc(100% + 8px);
	inset-inline-end: 0;
	z-index: 1000;
	min-inline-size: 170px;
	margin: 0;
	padding: 6px;
	list-style: none;
	background: #fff;
	border: 1px solid #e3eef0;
	border-radius: 10px;
	box-shadow: 0 12px 30px rgba(13, 50, 54, 0.14);
}
.maple-lang__menu a {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 9px 12px;
	border-radius: 6px;
	color: var(--maple-ink);
	font-size: 0.95rem;
	line-height: 1.3;
	text-decoration: none;
}
.maple-lang__menu a:hover,
.maple-lang__menu a:focus-visible { background: var(--maple-tint); color: var(--maple-teal-deep); }
.maple-lang__menu .is-current a { font-weight: 600; }
.maple-lang__menu .is-current a::after {
	content: "";
	margin-inline-start: auto;
	inline-size: 6px;
	block-size: 11px;
	border-right: 2px solid var(--maple-teal); /* physical sides so the tick is never mirrored */
	border-bottom: 2px solid var(--maple-teal);
	transform: rotate(45deg);
}
#ct-header-wrap .ct-header-meta .h-lang { display: flex; align-items: center; margin-inline-end: 12px; }

/* Desktop menu bar and the switcher share one brand colour scheme (same in English and Arabic):
   deep-teal bar like the top bar, white links, teal for hover/current. */
@media (min-width: 1200px) {
	#ct-header-wrap.ct-header-layout15 #ct-header:not(.h-fixed) .ct-header-navigation-bg { background-color: var(--maple-ink); }
	#ct-header-wrap.ct-header-layout15 #ct-header:not(.h-fixed) .ct-main-menu > li > a { color: #fff; padding-inline: 18px; }
	/* Keep menu, switcher, search and the offices link on one row in both languages */
	#ct-header-wrap.ct-header-layout15 #ct-header .ct-header-navigation-bg { flex-wrap: nowrap; }
	#ct-header-wrap.ct-header-layout15 #ct-header .ct-main-navigation { flex: 1 1 auto; min-width: 0; }
	#ct-header-wrap.ct-header-layout15 #ct-header .ct-header-meta { flex: none; flex-wrap: nowrap; }
	#ct-header-wrap.ct-header-layout15 #ct-header:not(.h-fixed) .ct-main-menu > li:hover > a,
	#ct-header-wrap.ct-header-layout15 #ct-header:not(.h-fixed) .ct-main-menu > li.current-menu-item > a,
	#ct-header-wrap.ct-header-layout15 #ct-header:not(.h-fixed) .ct-main-menu > li.current-menu-ancestor > a { color: #7fd6df; }
	#ct-header-wrap.ct-header-layout15 #ct-header:not(.h-fixed) .h-lang .maple-lang__toggle {
		color: #fff;
	}
	#ct-header-wrap.ct-header-layout15 #ct-header:not(.h-fixed) .h-lang .maple-lang__toggle:hover,
	#ct-header-wrap.ct-header-layout15 #ct-header:not(.h-fixed) .h-lang .maple-lang__dd[open] > .maple-lang__toggle {
		color: #7fd6df;
	}
}

/* Mobile: compact toggle beside the hamburger; the desktop copy hides with the menu bar */
.maple-lang--mobile { display: none; }
@media (max-width: 1199px) {
	#ct-header-wrap .ct-header-meta .h-lang { display: none; }
	.maple-lang--mobile {
		display: inline-flex;
		position: absolute;
		inset-block-start: 50%;
		inset-inline-end: 72px;
		transform: translateY(-50%);
		z-index: 99;
	}
	.maple-lang--mobile .maple-lang__toggle { padding: 6px 10px; }
	.maple-lang--mobile .maple-lang__name { font-size: 0.85rem; }
}
@media (max-width: 400px) {
	.maple-lang--mobile .maple-lang__toggle .maple-lang__name { display: none; }
}

/* Arabic typography: IBM Plex Sans Arabic (OFL). Elementor globals are overridden at the kit level,
   theme elements via a broad rule that skips icon fonts. Arabic script must never be letter-spaced. */
:root { --maple-font-ar: "IBM Plex Sans Arabic", "Segoe UI", Tahoma, sans-serif; }
html[lang="ar"] body[class*="elementor-kit-"] {
	--e-global-typography-primary-font-family: "IBM Plex Sans Arabic";
	--e-global-typography-secondary-font-family: "IBM Plex Sans Arabic";
	--e-global-typography-text-font-family: "IBM Plex Sans Arabic";
	--e-global-typography-accent-font-family: "IBM Plex Sans Arabic";
}
html[lang="ar"] body,
html[lang="ar"] body *:not(i):not([class*="fa-"]):not([class*="flaticon"]):not([class*="fac-"]):not([class*="eicon"]):not([class*="fab"]) {
	font-family: var(--maple-font-ar);
	letter-spacing: normal;
}

/* Visible keyboard focus everywhere */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
	outline: 3px solid var(--maple-teal);
	outline-offset: 2px;
}

/* Visually hidden text that stays available to screen readers (used for descriptive "Read more" links) */
.screen-reader-text {
	position: absolute !important;
	inline-size: 1px;
	block-size: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* WPBot launcher uses the wide logo: keep its proportions inside the round button */
#wp-chatbot-ball img { object-fit: contain; }

/* Archive / posts-page heading (child template-parts/page-title.php) */
body #pagetitle.maple-archive-head {
	background: var(--maple-ink);
	padding-block: 64px;
	color: #fff;
	text-align: center;
}
#pagetitle.maple-archive-head .page-title { color: #fff; margin: 0 0 12px; font-size: clamp(1.75rem, 3.5vw, 2.5rem); }
#pagetitle.maple-archive-head .maple-archive-head__desc { color: rgba(255, 255, 255, 0.88); max-inline-size: 680px; margin-inline: auto; }
#pagetitle.maple-archive-head .maple-archive-head__desc p { margin: 0; }
#pagetitle.maple-archive-head a { color: #9fd9df; }