/* ==========================================================================
   MedyaAI — Studio identity layer
   Loaded after the theme CSS (Settings › Code Before Head).
   Light: bone paper + deep-green ink. Dark: night-green studio.
   Lime is a signal only: active marker, arrow dot, number chips.
   ========================================================================== */

/* ---------- 1. Tokens (light) ---------- */
body,
body.theme-light {
	--mb-green: #163A36;
	--mb-deep: #0F2B27;
	--mb-mid: #1E4D46;
	--mb-lime: #A6C732;
	--mb-page: #FBFAF7;
	--mb-bone: #F6F3EE;
	--mb-sand: #ECE6DA;
	--mb-sand-2: #D8CBB2;
	--mb-ivory: #EBE5D8;
	--mb-ink: #14201E;
	--mb-text: #474747;
	--mb-muted: #5F6B68;
	--mb-line: rgba(22, 58, 54, .12);
	--mb-line-soft: rgba(22, 58, 54, .07);
	--mb-line-strong: rgba(22, 58, 54, .22);
	--mb-card: #FFFFFF;
	--mb-input: #F6F3EE;
	--mb-lift: 0 1px 2px rgba(20, 32, 30, .04), 0 8px 24px -12px rgba(20, 32, 30, .10);
	--mb-pop: 0 0 0 1px rgba(22, 58, 54, .08), 0 18px 40px -16px rgba(20, 32, 30, .22);
	--mb-ease: cubic-bezier(.23, 1, .32, 1);

	--mb-font-ui: "Bricolage Grotesque", "IBM Plex Sans Arabic", system-ui, sans-serif;
	--mb-font-display: "Bricolage Grotesque", "Zain", "IBM Plex Sans Arabic", system-ui, sans-serif;

	/* theme tokens (HSL triplets as the theme expects) */
	--font-body: var(--mb-font-ui);
	--font-heading: var(--mb-font-display);
	--headings-font-weight: 700;
	--headings-letter-spacing: -.01em;
	--background: 37 31% 95%;
	--foreground: 170 23% 10%;
	--heading-background: 0 0% 100%;
	--heading-foreground: 173 45% 16%;
	--primary: 173 45% 16%;
	--primary-foreground: 41 32% 88%;
	--secondary: 40 32% 89%;
	--secondary-foreground: 173 45% 16%;
	--accent: 73 60% 49%;
	--accent-foreground: 171 48% 11%;
	--border: 173 45% 16% / .12;
	--label: 165 6% 40%;
	--surface: 40 32% 89%;
	--surface-light: 45 33% 98%;
	--surface-background: 0 0% 100%;
	--clay: 40 32% 89%;
	--card-background: 0 0% 100%;
	--card-foreground: 170 23% 10%;
	--card-border: 173 45% 16% / .12;
	--card-shadow: none;
	--card-rounded: 20px;
	--input-background: 37 31% 95%;
	--input-foreground: 170 23% 10%;
	--input-border: 173 45% 16% / .12;
	--input-rounded-multiplier: 1;
	--button-rounded: 9999px;
	--button-border: 173 45% 16% / .12;
	--dropdown-background: 0 0% 100%;
	--dropdown-foreground: 170 23% 10%;
	--dropdown-border: 173 45% 16% / .12;
	--dropdown-rounded: 16px;
	--header-background: 37 31% 95% / 0;
	--header-border: 0 0% 0% / 0;
	--folder-background: 40 32% 89%;
	--gradient-1: 173 45% 16%;
	--gradient-2: 171 44% 21%;
	--gradient-3: 73 60% 49%;
	--gradient-4: 171 44% 21%;
	--gradient-5: 173 45% 16%;
	--gradient-from: 173 45% 16%;
	--gradient-via: 171 44% 21%;
	--gradient-to: 73 60% 49%;
	--gradient-stops: #163A36, #1E4D46, #A6C732;
	--shadow: var(--mb-lift);
	--scrollbar-thumb: 39 33% 77%;
	--scrollbar-thumb-hover: 173 45% 16%;
	--scrollbar-track: 37 31% 95%;

	/* sidebar: the deep-green studio wall */
	--navbar-background: 171 48% 11%;
	--navbar-foreground: 41 32% 88%;
	--navbar-background-hover: 41 32% 88%;
	--navbar-foreground-hover: 45 33% 98%;
	--navbar-background-active: 41 32% 88%;
	--navbar-foreground-active: 45 33% 98%;
	--navbar-icon-background: 0 0% 0% / 0;
	--navbar-icon-foreground: 41 32% 88%;
	--navbar-icon-background-hover: 0 0% 0% / 0;
	--navbar-icon-foreground-hover: 45 33% 98%;
	--navbar-icon-background-active: 0 0% 0% / 0;
	--navbar-icon-foreground-active: 73 60% 49%;
	--navbar-border: 0 0% 100% / 0;
	--navbar-divider: 41 32% 88% / .08;
	--navbar-link-rounded: 14px;

	/* legacy tabler pages */
	--tblr-primary: #163A36;
	--tblr-primary-rgb: 22, 58, 54;
	--tblr-green: #2E7D5B;
	--tblr-green-rgb: 46, 125, 91;
	--tblr-red: #B42318;
	--tblr-red-rgb: 180, 35, 24;
	--tblr-body-bg: #F6F3EE;
	--tblr-body-color: #14201E;
	--tblr-muted: #5F6B68;
	--tblr-border-color: rgba(22, 58, 54, .12);
	--tblr-card-border-color: rgba(22, 58, 54, .12);
	--tblr-border-radius: 14px;
	--lqd-heading-color: #163A36;
	--lqd-header-search-bg: #FFFFFF;
	--lqd-vertical-nav-link-color: #EBE5D8;
}

/* ---------- 2. Tokens (dark) — night studio ---------- */
body.theme-dark {
	--mb-page: #0A1E1B;
	--mb-card: #0F2B27;
	--mb-input: #0A1E1B;
	--mb-ink: #EBE5D8;
	--mb-text: #C9CFC9;
	--mb-muted: #9FB0AB;
	--mb-line: rgba(235, 229, 216, .09);
	--mb-line-soft: rgba(235, 229, 216, .05);
	--mb-line-strong: rgba(235, 229, 216, .18);
	--mb-lift: 0 0 0 1px rgba(235, 229, 216, .06);
	--mb-pop: 0 0 0 1px rgba(235, 229, 216, .10), 0 24px 48px -20px rgba(0, 0, 0, .6);

	--background: 171 50% 8%;
	--foreground: 41 32% 88%;
	--heading-background: 171 48% 11%;
	--heading-foreground: 45 33% 98%;
	--primary: 41 32% 88%;
	--primary-foreground: 171 48% 11%;
	--secondary: 172 47% 13%;
	--secondary-foreground: 41 32% 88%;
	--border: 41 32% 88% / .09;
	--label: 162 10% 66%;
	--surface: 172 47% 13%;
	--surface-light: 171 44% 21%;
	--surface-background: 171 48% 11%;
	--clay: 172 47% 13%;
	--card-background: 171 48% 11%;
	--card-foreground: 41 32% 88%;
	--card-border: 41 32% 88% / .09;
	--input-background: 171 50% 8%;
	--input-foreground: 41 32% 88%;
	--input-border: 41 32% 88% / .1;
	--button-border: 41 32% 88% / .12;
	--dropdown-background: 172 47% 13%;
	--dropdown-foreground: 41 32% 88%;
	--dropdown-border: 41 32% 88% / .1;
	--folder-background: 172 47% 13%;
	--header-background: 171 50% 8% / 0;
	--scrollbar-thumb: 171 44% 21%;
	--scrollbar-thumb-hover: 73 60% 49%;
	--scrollbar-track: 171 50% 8%;
	--navbar-background: 171 48% 11%;
	--navbar-divider: 41 32% 88% / .07;
	--tblr-body-bg: #0A1E1B;
	--tblr-bg-surface: #0F2B27;
	--tblr-body-color: #EBE5D8;
	--tblr-border-color: rgba(235, 229, 216, .09);
	--lqd-heading-color: #FBFAF7;
	--lqd-header-search-bg: #0F2B27;
}

/* ---------- 2b. Arabic voice ----------
   In the Arabic UI the Arabic faces lead: Zain for display, IBM Plex Sans Arabic for running text.
   Their own Latin, digits and punctuation keep mixed lines in one voice. Bricolage Grotesque stays
   the face of the English UI and of explicit Latin marks (dir="ltr" wordmarks). */
html[dir="rtl"] body,
html:lang(ar) body {
	--mb-font-ui: "IBM Plex Sans Arabic", system-ui, sans-serif;
	--mb-font-display: "Zain", "IBM Plex Sans Arabic", system-ui, sans-serif;
	font-feature-settings: normal;
}
/* the primary voice of the Arabic UI: navigation, actions and titles speak in Zain; running text stays Plex */
html[dir="rtl"] body :is(.ms-tab, .ms-sheet-title, .lqd-btn, .btn, .sc-cta, .lqd-statistic-title, .lqd-titlebar-title, .lqd-card-title, .sc-tile-title) { font-family: var(--mb-font-display) !important; }
html[dir="rtl"] body .ms-tab { font-weight: 700; }
@media (min-width: 1181px) { html[dir="rtl"] body .ms-tab { padding-inline: 11px; } }
html[dir="rtl"] body :is(.lqd-btn, .btn) { font-weight: 700; }

/* ---------- 3. Base ---------- */
body {
	font-family: var(--mb-font-ui);
	background-color: hsl(var(--background)) !important;
	background-image: none !important;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-feature-settings: "ss01";
}
body.mb-theme-anim,
body.mb-theme-anim * {
	transition: background-color .9s var(--mb-ease), border-color .9s var(--mb-ease), color .6s var(--mb-ease) !important;
}
::selection { background: rgba(166, 199, 50, .45); color: var(--mb-ink); }

h1, h2, h3, h4, .h1, .h2, .h3, .h4,
.lqd-titlebar-title, .lqd-card-title, .lqd-card-head h3, .lqd-card-head h4 {
	font-family: var(--mb-font-display) !important;
	color: hsl(var(--heading-foreground));
	letter-spacing: -.012em;
	text-wrap: balance;
}
:lang(ar) h1, :lang(ar) h2, :lang(ar) h3, [dir="rtl"] h1, [dir="rtl"] h2, [dir="rtl"] h3 { letter-spacing: 0; }
p { text-wrap: pretty; }
.tabular, [class*="statistic"] .lqd-statistic-change, .lqd-statistic-info h3, .lqd-statistic-info .text-2xl { font-variant-numeric: tabular-nums; }

/* page title: Zain display + lime highlighter stroke */
.lqd-titlebar-title,
.lqd-titlebar h1 {
	font-size: clamp(1.6rem, 1.2rem + 1.2vw, 2.25rem) !important;
	line-height: 1.15 !important;
	font-weight: 800 !important;
	position: relative;
	display: inline-block;
	z-index: 0;
}
.lqd-titlebar-title::after,
.lqd-titlebar h1::after {
	content: "";
	position: absolute;
	inset-inline-start: -.15em;
	bottom: .08em;
	width: min(3.2em, 70%);
	height: .38em;
	background: var(--mb-lime);
	opacity: .55;
	border-radius: 3px 10px 4px 12px;
	transform: skewX(-8deg);
	z-index: -1;
}
body.theme-dark .lqd-titlebar-title::after,
body.theme-dark .lqd-titlebar h1::after { opacity: .28; }

/* ---------- 4. Sidebar — the studio wall ---------- */
.lqd-navbar {
	background: linear-gradient(180deg, #0F2B27 0%, #12332E 100%) !important;
	color: #EBE5D8;
	border-inline-end: 0 !important;
}
body.theme-dark .lqd-navbar {
	background: #0F2B27 !important;
	box-shadow: inset -1px 0 0 rgba(235, 229, 216, .06);
}
[dir="rtl"] body.theme-dark .lqd-navbar,
body[dir="rtl"].theme-dark .lqd-navbar { box-shadow: inset 1px 0 0 rgba(235, 229, 216, .06); }
@media (min-width: 992px) {
	.lqd-navbar { border-start-end-radius: 28px; border-end-end-radius: 28px; }
}
.lqd-navbar .lqd-navbar-link {
	color: rgba(235, 229, 216, .72) !important;
	font-weight: 500;
	transition: background-color .18s var(--mb-ease), color .18s var(--mb-ease);
}
.lqd-navbar .lqd-navbar-link:hover {
	background-color: rgba(235, 229, 216, .06) !important;
	color: #FBFAF7 !important;
}
.lqd-navbar .lqd-navbar-link .lqd-nav-link-icon { color: rgba(235, 229, 216, .78) !important; }
.lqd-navbar .lqd-navbar-link:hover .lqd-nav-link-icon { color: #FBFAF7 !important; }

/* active: the highlighter mark — lime bar + lime ink on the icon */
.lqd-navbar .lqd-navbar-link.active {
	background-color: rgba(235, 229, 216, .08) !important;
	color: #FBFAF7 !important;
	position: relative;
}
.lqd-navbar .lqd-navbar-link.active .lqd-nav-link-icon { color: var(--mb-lime) !important; }
.lqd-navbar .lqd-navbar-link.active::before {
	content: "" !important;
	position: absolute !important;
	inset-inline-start: -10px !important;
	top: 22% !important;
	height: 56% !important;
	width: 4px !important;
	border-radius: 0 4px 4px 0 !important;
	background: var(--mb-lime) !important;
	opacity: 1 !important;
}
[dir="rtl"] .lqd-navbar .lqd-navbar-link.active::before { border-radius: 4px 0 0 4px !important; }
.lqd-navbar .lqd-navbar-link.active .lqd-nav-link-label { background-image: none !important; font-weight: 600; }

/* section labels: quiet, spaced, with a dotted rule */
.lqd-navbar .lqd-navbar-label {
	color: rgba(235, 229, 216, .42) !important;
	font-size: 11px !important;
	font-weight: 600 !important;
	letter-spacing: .06em;
	display: flex;
	align-items: center;
	gap: 8px;
}
.lqd-navbar .lqd-navbar-label::after {
	content: "";
	flex: 1;
	height: 2px;
	background-image: radial-gradient(circle, rgba(216, 203, 178, .35) 1px, transparent 1.5px);
	background-size: 6px 2px;
	background-repeat: repeat-x;
}
.lqd-navbar .lqd-navbar-dropdown { border-color: rgba(235, 229, 216, .08) !important; }
.lqd-navbar .lqd-navbar-dropdown-link { color: rgba(235, 229, 216, .66) !important; }
.lqd-navbar .lqd-navbar-dropdown-link:hover,
.lqd-navbar .lqd-navbar-dropdown-link.active { color: #FBFAF7 !important; }

/* shrinked rail: flyout dropdowns become deep-green cards, labels stay plain */
.navbar-shrinked .lqd-navbar .lqd-navbar-dropdown {
	background: #0F2B27 !important;
	color: #FBFAF7 !important;
	border-radius: 14px !important;
	box-shadow: 0 0 0 1px rgba(235, 229, 216, .08), 0 16px 32px -12px rgba(0, 0, 0, .45) !important;
}
.navbar-shrinked .lqd-navbar .lqd-nav-link-label {
	background-color: transparent !important;
	box-shadow: none !important;
	border: 0 !important;
	color: inherit !important;
	font-size: 11px;
	line-height: 1.35;
}
.navbar-shrinked .lqd-navbar .lqd-navbar-link.active .lqd-nav-link-label { color: #FBFAF7 !important; background-image: none !important; }

/* swapped Phosphor icons */
/* element-level specificity: utilities such as hidden / lg:hidden / max-lg:hidden must still win over the swapped icon */
html svg:where(.mb-ph) { display: inline-block; flex-shrink: 0; } /* 0,0,2: beats preflight svg{display:block} (loaded after us), loses to any utility class */
.mb-ph:not([width]) { width: 1em; height: 1em; }
.lqd-nav-link-icon .mb-ph { width: var(--navbar-icon-size, 1.25rem); height: var(--navbar-icon-size, 1.25rem); }

/* brand logo area */
.lqd-navbar .navbar-brand img,
.lqd-navbar a[class*="brand"] img { filter: none; }

/* ---------- 5. Header ---------- */
.lqd-header {
	background: transparent !important;
	border-bottom: 1px solid var(--mb-line-soft) !important;
}
.lqd-header .lqd-btn:not(.lqd-btn-primary),
.lqd-header .lqd-dropdown-trigger {
	border-radius: 9999px !important;
}
.lqd-header { color: var(--mb-green); }
body.theme-dark .lqd-header { color: var(--mb-ivory); }
/* icon-only header buttons (tagged .mb-ibtn by medya-ui.js): one quiet round family */
.lqd-header .mb-ibtn {
	width: 40px !important; height: 40px !important;
	min-width: 40px; padding: 0 !important;
	display: inline-grid !important; place-items: center;
	border-radius: 9999px !important;
	background: var(--mb-card) !important;
	background-image: none !important;
	color: var(--mb-green) !important;
	box-shadow: inset 0 0 0 1px var(--mb-line) !important;
	border: 0 !important;
	transition: transform .14s var(--mb-ease), box-shadow .18s var(--mb-ease);
}
body.theme-dark .lqd-header .mb-ibtn { color: var(--mb-ivory) !important; }
.lqd-header .mb-ibtn:hover { box-shadow: inset 0 0 0 1px var(--mb-line-strong) !important; transform: none; }
.lqd-header .mb-ibtn:active { transform: scale(.96); }
.lqd-header .mb-ibtn > svg, .lqd-header .mb-ibtn .mb-ph { width: 20px !important; height: 20px !important; }

/* logo: monochrome in brand ink */
.lqd-header img[src*="logo"],
.lqd-navbar img[src*="logo"],
body.scriptif img[src*="/images/logo/"] {
	filter: brightness(0) invert(17%) sepia(22%) saturate(1500%) hue-rotate(127deg) brightness(.92);
}
body.theme-dark .lqd-header img[src*="logo"],
body.theme-dark .lqd-navbar img[src*="logo"],
body.scriptif.theme-dark img[src*="/images/logo/"] {
	filter: brightness(0) invert(94%) sepia(10%) saturate(380%) hue-rotate(4deg);
}

/* kill the theme's purple/teal glow blobs */
[class*="blur-[150px]"], [class*="blur-[120px]"], [class*="blur-[200px]"] { display: none !important; }
[class*="text-[#6977DE]"], [class*="text-[#9B84FB]"], [class*="text-indigo-"], [class*="text-violet-"], [class*="text-purple-"] { color: var(--mb-green) !important; }
body.theme-dark [class*="text-[#6977DE]"], body.theme-dark [class*="text-[#9B84FB]"], body.theme-dark [class*="text-indigo-"], body.theme-dark [class*="text-violet-"], body.theme-dark [class*="text-purple-"] { color: #C6DE6B !important; }

.header-search-container input,
.lqd-header input[type="search"],
.lqd-header .header-search input {
	background: var(--mb-card) !important;
	border-radius: 9999px !important;
	box-shadow: inset 0 0 0 1px var(--mb-line) !important;
	border: 0 !important;
}

/* ---------- 6. Cards ---------- */
.lqd-card,
.card {
	background-color: var(--mb-card) !important;
	border: 1px solid var(--mb-line) !important;
	border-radius: 20px !important;
	box-shadow: none !important;
}
.lqd-card .lqd-card { border-radius: 14px !important; }
body .lqd-card { --input-background: 37 31% 95%; }
body.theme-dark .lqd-card { --input-background: 171 50% 8%; }
.lqd-card-head {
	border-bottom-color: var(--mb-line-soft) !important;
}
.lqd-card-head h3,
.lqd-card-head h4,
.lqd-card-title { font-weight: 700 !important; font-size: 1.05rem; }

/* statistics: numbers lead, labels step back */
.lqd-statistic-title { color: var(--mb-muted) !important; font-weight: 500; }
.lqd-statistic-info h3,
.lqd-statistic-info .text-2xl,
.lqd-statistic-info .text-3xl {
	font-family: var(--mb-font-display) !important;
	font-weight: 800 !important;
	color: hsl(var(--heading-foreground));
	font-variant-numeric: tabular-nums;
	letter-spacing: -.02em;
}
.lqd-change-indicator { border-radius: 9999px !important; font-weight: 600; }

/* ---------- 7. Buttons ---------- */
.lqd-btn { font-weight: 600; letter-spacing: 0; transition: background-color .18s var(--mb-ease), color .18s var(--mb-ease), box-shadow .18s var(--mb-ease), transform .14s var(--mb-ease); }
.lqd-btn:active { transform: scale(.97); }
.lqd-btn-primary,
.btn-primary {
	background-color: var(--mb-green) !important;
	color: #EBE5D8 !important;
	border-color: transparent !important;
	border-radius: 9999px !important;
	box-shadow: 0 1px 0 rgba(255, 255, 255, .06) inset, 0 6px 16px -8px rgba(15, 43, 39, .55);
}
.lqd-btn-primary:hover,
.btn-primary:hover { background-color: var(--mb-mid) !important; color: #FBFAF7 !important; }
body.theme-dark .lqd-btn-primary,
body.theme-dark .btn-primary { background-color: #EBE5D8 !important; color: #0F2B27 !important; box-shadow: none; }
body.theme-dark .lqd-btn-primary:hover,
body.theme-dark .btn-primary:hover { background-color: #FBFAF7 !important; }

/* signature: lime arrow dot on text CTAs (added by medya-ui.js) */
.mb-arrow { gap: .6rem !important; padding-inline-end: .45rem !important; }
/* the arrow chip sits inside the button: the theme's own button ::after layer (absolute, dark) must not win */
.mb-arrow::after {
	content: "" !important;
	position: static !important;
	inset: auto !important;
	z-index: auto !important;
	opacity: 1 !important;
	width: 1.6em; height: 1.6em;
	flex-shrink: 0;
	border-radius: 9999px !important;
	background:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230F2B27' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17 17 7M8 7h9v9'/%3E%3C/svg%3E") center / 52% no-repeat,
		#A6C732 !important;
	transition: transform .22s var(--mb-ease);
}
[dir="rtl"] .mb-arrow::after { transform: scaleX(-1); }
.mb-arrow:hover::after { transform: rotate(45deg); }
[dir="rtl"] .mb-arrow:hover::after { transform: scaleX(-1) rotate(45deg); }

.lqd-btn-secondary,
.btn-secondary {
	background: var(--mb-card) !important;
	color: var(--mb-green) !important;
	box-shadow: inset 0 0 0 1px var(--mb-line-strong) !important;
	border-radius: 9999px !important;
}
body.theme-dark .lqd-btn-secondary { color: #EBE5D8 !important; }
.lqd-btn-danger, .btn-danger { background: #B42318 !important; color: #fff !important; border-radius: 9999px !important; }
.lqd-btn-success, .btn-success { background: #2E7D5B !important; color: #fff !important; border-radius: 9999px !important; }

/* titlebar CTA: drop the rainbow ring */
.lqd-titlebar-actions .lqd-btn-primary::before { background: transparent !important; }
.lqd-titlebar-actions .lqd-btn-primary::after { display: none; }
.lqd-titlebar-actions .lqd-btn-primary.mb-arrow::after { display: block; }

/* ---------- 8. Forms ---------- */
.lqd-input,
.form-control,
.form-select,
select.lqd-input,
textarea.lqd-input {
	background-color: hsl(var(--input-background)) !important;
	border: 1px solid var(--mb-line) !important;
	border-radius: 12px !important;
	color: var(--mb-ink) !important;
	transition: border-color .15s var(--mb-ease), box-shadow .15s var(--mb-ease), background-color .15s;
}
.lqd-input:hover, .form-control:hover { border-color: var(--mb-line-strong) !important; }
.lqd-input:focus,
.form-control:focus,
.form-select:focus {
	outline: none !important;
	border-color: var(--mb-green) !important;
	box-shadow: 0 0 0 3px rgba(22, 58, 54, .12) !important;
	background-color: var(--mb-card) !important;
}
body.theme-dark .lqd-input:focus,
body.theme-dark .form-control:focus { border-color: #A6C732 !important; box-shadow: 0 0 0 3px rgba(166, 199, 50, .14) !important; }
.lqd-input-label-txt, .form-label { color: var(--mb-ink); font-weight: 600; }
.lqd-input::placeholder, .form-control::placeholder { color: var(--mb-muted); opacity: .8; }

/* switches: green track, lime when on */
.lqd-input-switcher,
.form-switch .form-check-input {
	background-color: var(--mb-sand-2) !important;
	border-color: transparent !important;
}
.lqd-input-switcher:checked,
.form-switch .form-check-input:checked { background-color: var(--mb-green) !important; }
body.theme-dark .lqd-input-switcher:checked { background-color: #A6C732 !important; }
input[type="checkbox"]:checked:not(.lqd-input-switcher):not(.form-check-input),
.form-check-input:checked { accent-color: #163A36; }

/* ---------- 9. Dropdowns, modals, tooltips ---------- */
.lqd-dropdown-dropdown-content,
.dropdown-menu {
	background: var(--mb-card) !important;
	border: 0 !important;
	border-radius: 16px !important;
	box-shadow: var(--mb-pop) !important;
}
.lqd-modal-content,
.modal-content {
	background: var(--mb-card) !important;
	border-radius: 24px !important;
	border: 0 !important;
	box-shadow: var(--mb-pop) !important;
}
.lqd-modal-backdrop, .modal-backdrop { background: rgba(10, 30, 27, .55) !important; backdrop-filter: blur(3px); }
.lqd-tooltip-content {
	background: #0F2B27 !important;
	color: #EBE5D8 !important;
	border-radius: 10px !important;
	font-size: 12px;
}

/* ---------- 10. Tables & lists ---------- */
table thead th,
.table thead th {
	background: var(--mb-bone) !important;
	color: var(--mb-muted) !important;
	font-weight: 600 !important;
	font-size: 12px !important;
	border-bottom: 1px solid var(--mb-line) !important;
}
body.theme-dark table thead th { background: #0A1E1B !important; }
table tbody tr { border-color: var(--mb-line-soft) !important; }
table tbody tr:hover { background: rgba(166, 199, 50, .06); }

/* number chips (badges) */
.badge,
.lqd-badge {
	border-radius: 9999px !important;
	font-weight: 600;
	font-variant-numeric: tabular-nums;
}
.badge.bg-primary, .lqd-badge-primary { background: #A6C732 !important; color: #0F2B27 !important; }

/* accordions */
.lqd-accordion-item { border-color: var(--mb-line) !important; border-radius: 16px !important; }
.lqd-accordion-trigger { font-weight: 600; }

/* links */
.lqd-btn-link, .text-primary, a.link { color: var(--mb-green) !important; }
body.theme-dark .lqd-btn-link, body.theme-dark .text-primary { color: #C6DE6B !important; }

/* status colours */
.text-red-500, .text-danger { color: #B42318 !important; }
.text-green-500, .text-success { color: #2E7D5B !important; }
.text-yellow-500, .text-warning { color: #B7791F !important; }
body.theme-dark .text-green-500, body.theme-dark .text-success { color: #6FC79A !important; }
body.theme-dark .text-red-500, body.theme-dark .text-danger { color: #F2867C !important; }

/* ---------- 11. Theme toggle — tiny sky ---------- */
.mb-sky {
	--d: 1.15s;
	position: relative;
	width: 40px; height: 40px;
	border-radius: 9999px;
	overflow: hidden;
	display: inline-block;
	isolation: isolate;
	box-shadow: inset 0 0 0 1px rgba(22, 58, 54, .14);
	background: #F6F3EE;
	cursor: pointer;
	transition: transform .14s var(--mb-ease);
}
.mb-sky:active { transform: scale(.94); }
.mb-sky > * { position: absolute; pointer-events: none; }
.mb-sky .mb-day,
.mb-sky .mb-night { inset: 0; transition: opacity var(--d) cubic-bezier(.65, 0, .35, 1); }
.mb-sky .mb-day { background: linear-gradient(180deg, #FBFAF7 0%, #F1ECE1 60%, #E6DDCB 100%); opacity: 1; }
.mb-sky .mb-night { background: radial-gradient(120% 90% at 20% 0%, #1E4D46 0%, #0F2B27 60%, #0A1E1B 100%); opacity: 0; }
.mb-sky .mb-stars { inset: 0; opacity: 0; transition: opacity calc(var(--d) * .8) ease; }
.mb-sky .mb-stars i {
	position: absolute; width: 2px; height: 2px; border-radius: 50%;
	background: #EBE5D8;
	animation: mb-twinkle 2.6s ease-in-out infinite;
}
.mb-sky .mb-stars i:nth-child(1) { top: 22%; left: 24%; }
.mb-sky .mb-stars i:nth-child(2) { top: 64%; left: 18%; width: 1.5px; height: 1.5px; animation-delay: .6s; }
.mb-sky .mb-stars i:nth-child(3) { top: 30%; left: 74%; animation-delay: 1.2s; }
.mb-sky .mb-stars i:nth-child(4) { top: 76%; left: 62%; width: 1.5px; height: 1.5px; animation-delay: 1.8s; }
.mb-sky .mb-stars i:nth-child(5) { top: 12%; left: 52%; width: 1.5px; height: 1.5px; animation-delay: .9s; }
@keyframes mb-twinkle { 0%, 100% { opacity: .35; } 50% { opacity: 1; } }

/* sun: lime disc ringed by clear rays, rises from lower-right */
.mb-sky .mb-sun {
	width: 34%; height: 34%; left: 33%; top: 33%;
	border-radius: 50%;
	background: radial-gradient(circle at 35% 35%, #D6EA8C 0%, #A6C732 60%, #8DAE22 100%);
	transform: translate(0, 0) scale(1);
	transition: transform var(--d) cubic-bezier(.34, 1.36, .64, 1), opacity calc(var(--d) * .6) ease;
}
.mb-sky .mb-sun::before {
	content: "";
	position: absolute;
	inset: -62%;
	border-radius: 50%;
	background: repeating-conic-gradient(from 0deg, #6F8E17 0deg 12deg, transparent 12deg 45deg);
	-webkit-mask: radial-gradient(circle, transparent 0 46%, #000 47% 66%, transparent 67%);
	mask: radial-gradient(circle, transparent 0 46%, #000 47% 66%, transparent 67%);
	animation: mb-sun-spin 18s linear infinite;
}
@keyframes mb-sun-spin { to { transform: rotate(360deg); } }
/* moon: ivory crescent, sets to lower-left (slow start) */
.mb-sky .mb-moon {
	width: 44%; height: 44%; left: 28%; top: 28%;
	border-radius: 50%;
	background: #EBE5D8;
	-webkit-mask: radial-gradient(circle at 72% 32%, transparent 38%, #000 39.5%);
	mask: radial-gradient(circle at 72% 32%, transparent 38%, #000 39.5%);
	transform: translate(-120%, 130%) rotate(-30deg);
	opacity: 0;
	transition: transform var(--d) cubic-bezier(.55, 0, .25, 1), opacity calc(var(--d) * .7) ease;
}
body.theme-dark .mb-sky { box-shadow: inset 0 0 0 1px rgba(235, 229, 216, .12); }
body.theme-dark .mb-sky .mb-day { opacity: 0; }
body.theme-dark .mb-sky .mb-night { opacity: 1; }
body.theme-dark .mb-sky .mb-stars { opacity: 1; transition-delay: calc(var(--d) * .25); }
body.theme-dark .mb-sky .mb-sun { transform: translate(120%, 130%) scale(.7); opacity: 0; transition-timing-function: cubic-bezier(.55, 0, .25, 1), ease; }
body.theme-dark .mb-sky .mb-moon { transform: translate(0, 0) rotate(0deg); opacity: 1; transition-timing-function: cubic-bezier(.34, 1.3, .64, 1), ease; }
.mb-sky-host { padding: 0 !important; width: auto !important; height: auto !important; background: transparent !important; box-shadow: none !important; }
.mb-sky-host > svg { display: none !important; }

/* ---------- 12. Scrollbar ---------- */
* { scrollbar-color: hsl(var(--scrollbar-thumb)) transparent; }
.lqd-navbar * { scrollbar-color: rgba(235, 229, 216, .18) transparent; }

/* ---------- 13. Motion safety ---------- */
@media (prefers-reduced-motion: reduce) {
	.mb-sky *, .mb-arrow::after, .lqd-btn { transition-duration: .01ms !important; animation: none !important; }
	body.mb-theme-anim, body.mb-theme-anim * { transition: none !important; }
}

/* ---------- 14. Default avatar -> brand avatar ---------- */
[style*="default-avatar"] { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Ccircle cx='32' cy='32' r='32' fill='%23ECE6DA'/%3E%3Cg transform='translate%2817 16%29 scale%28.1172%29' fill='%23163A36'%3E%3Cpath d='M230.92,212c-15.23-26.33-38.7-45.21-66.09-54.16a72,72,0,1,0-73.66,0C63.78,166.78,40.31,185.66,25.08,212a8,8,0,1,0,13.85,8c18.84-32.56,52.14-52,89.07-52s70.23,19.44,89.07,52a8,8,0,1,0,13.85-8ZM72,96a56,56,0,1,1,56,56A56.06,56.06,0,0,1,72,96Z'/%3E%3C/g%3E%3C/svg%3E") !important; }
.lqd-header [style*="default-avatar"] { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Ccircle cx='32' cy='32' r='32' fill='%23163A36'/%3E%3Cg transform='translate%2817 16%29 scale%28.1172%29' fill='%23EBE5D8'%3E%3Cpath d='M230.92,212c-15.23-26.33-38.7-45.21-66.09-54.16a72,72,0,1,0-73.66,0C63.78,166.78,40.31,185.66,25.08,212a8,8,0,1,0,13.85,8c18.84-32.56,52.14-52,89.07-52s70.23,19.44,89.07,52a8,8,0,1,0,13.85-8ZM72,96a56,56,0,1,1,56,56A56.06,56.06,0,0,1,72,96Z'/%3E%3C/g%3E%3C/svg%3E") !important; }
body.theme-dark [style*="default-avatar"] { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Ccircle cx='32' cy='32' r='32' fill='%231E4D46'/%3E%3Cg transform='translate%2817 16%29 scale%28.1172%29' fill='%23EBE5D8'%3E%3Cpath d='M230.92,212c-15.23-26.33-38.7-45.21-66.09-54.16a72,72,0,1,0-73.66,0C63.78,166.78,40.31,185.66,25.08,212a8,8,0,1,0,13.85,8c18.84-32.56,52.14-52,89.07-52s70.23,19.44,89.07,52a8,8,0,1,0,13.85-8ZM72,96a56,56,0,1,1,56,56A56.06,56.06,0,0,1,72,96Z'/%3E%3C/g%3E%3C/svg%3E") !important; }
body.theme-dark .lqd-header [style*="default-avatar"] { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Ccircle cx='32' cy='32' r='32' fill='%23EBE5D8'/%3E%3Cg transform='translate%2817 16%29 scale%28.1172%29' fill='%230F2B27'%3E%3Cpath d='M230.92,212c-15.23-26.33-38.7-45.21-66.09-54.16a72,72,0,1,0-73.66,0C63.78,166.78,40.31,185.66,25.08,212a8,8,0,1,0,13.85,8c18.84-32.56,52.14-52,89.07-52s70.23,19.44,89.07,52a8,8,0,1,0,13.85-8ZM72,96a56,56,0,1,1,56,56A56.06,56.06,0,0,1,72,96Z'/%3E%3C/g%3E%3C/svg%3E") !important; }
img[src*="default-avatar"] { content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Ccircle cx='32' cy='32' r='32' fill='%23ECE6DA'/%3E%3Cg transform='translate%2817 16%29 scale%28.1172%29' fill='%23163A36'%3E%3Cpath d='M230.92,212c-15.23-26.33-38.7-45.21-66.09-54.16a72,72,0,1,0-73.66,0C63.78,166.78,40.31,185.66,25.08,212a8,8,0,1,0,13.85,8c18.84-32.56,52.14-52,89.07-52s70.23,19.44,89.07,52a8,8,0,1,0,13.85-8ZM72,96a56,56,0,1,1,56,56A56.06,56.06,0,0,1,72,96Z'/%3E%3C/g%3E%3C/svg%3E"); }
body.theme-dark img[src*="default-avatar"] { content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Ccircle cx='32' cy='32' r='32' fill='%231E4D46'/%3E%3Cg transform='translate%2817 16%29 scale%28.1172%29' fill='%23EBE5D8'%3E%3Cpath d='M230.92,212c-15.23-26.33-38.7-45.21-66.09-54.16a72,72,0,1,0-73.66,0C63.78,166.78,40.31,185.66,25.08,212a8,8,0,1,0,13.85,8c18.84-32.56,52.14-52,89.07-52s70.23,19.44,89.07,52a8,8,0,1,0,13.85-8ZM72,96a56,56,0,1,1,56,56A56.06,56.06,0,0,1,72,96Z'/%3E%3C/g%3E%3C/svg%3E"); }
.lqd-header [style*="default-avatar"] { box-shadow: 0 0 0 1px var(--mb-line); }

/* ---------- 15. Gauge (replaces ApexCharts donut/radial gauges) ---------- */
.apexcharts-canvas.mb-gauge-hidden { position: absolute !important; opacity: 0 !important; pointer-events: none !important; height: 0 !important; overflow: hidden !important; }
.mb-gauge {
	position: relative;
	width: min(240px, 80%);
	margin: 8px auto 0;
	aspect-ratio: 1 / 1;
	display: block;
}
.mb-gauge-svg { width: 100%; height: 100%; overflow: visible; }
.mb-g-track, .mb-g-bar { fill: none; stroke-width: 8; stroke-linecap: round; }
.mb-g-track { stroke: #ECE6DA; }
.mb-g-bar {
	stroke-dasharray: 100 100;
	stroke-dashoffset: 100;
	transition: stroke-dashoffset 1.2s cubic-bezier(.23, 1, .32, 1) .2s;
}
.mb-g-s1 { stop-color: #A6C732; }
.mb-g-s2 { stop-color: #1E4D46; }
.mb-g-ticks line { stroke: #D8CBB2; stroke-width: 1.2; stroke-linecap: round; }
.mb-gauge-center {
	position: absolute; inset: 0;
	display: flex; flex-direction: column; align-items: center; justify-content: center;
	gap: 2px;
	text-align: center;
}
.mb-g-num {
	font-family: var(--mb-font-display);
	font-weight: 800;
	font-size: clamp(2.2rem, 1.6rem + 2vw, 3.1rem);
	line-height: 1;
	letter-spacing: -.03em;
	color: var(--mb-green);
	font-variant-numeric: tabular-nums;
}
.mb-g-num::after { content: "%"; font-size: .45em; font-weight: 700; margin-inline-start: 2px; color: var(--mb-muted); }
.mb-g-label { font-size: 12px; color: var(--mb-muted); font-weight: 500; max-width: 70%; }
.mb-gauge-legend {
	position: absolute; left: 50%; bottom: -46px; transform: translateX(-50%);
	display: flex; gap: 8px; white-space: nowrap;
}
.mb-chip {
	display: inline-flex; align-items: center; gap: 6px;
	padding: 5px 10px 5px 12px;
	border-radius: 9999px;
	background: var(--mb-bone);
	box-shadow: inset 0 0 0 1px var(--mb-line);
	font-size: 12px; color: var(--mb-text);
}
.mb-chip i { width: 8px; height: 8px; border-radius: 50%; background: #D8CBB2; }
.mb-chip.is-on i { background: #A6C732; box-shadow: 0 0 0 2px rgba(166, 199, 50, .25); }
.mb-chip b { color: var(--mb-green); font-variant-numeric: tabular-nums; }
.apexcharts-canvas.mb-gauge-hidden + .mb-gauge, .mb-gauge { margin-bottom: 56px; }
body.theme-dark .mb-g-track { stroke: rgba(235, 229, 216, .08); }
body.theme-dark .mb-g-ticks line { stroke: rgba(235, 229, 216, .18); }
body.theme-dark .mb-g-s2 { stop-color: #2E7D5B; }
body.theme-dark .mb-g-num { color: #FBFAF7; }
body.theme-dark .mb-chip { background: #0A1E1B; }
body.theme-dark .mb-chip b { color: #EBE5D8; }
@media (prefers-reduced-motion: reduce) { .mb-g-bar { transition: none; } }
.mb-overlay-hidden { display: none !important; }

/* ---------- 16. Language switch (ع | EN) ---------- */
.mb-lang-src { display: none !important; }
.mb-lang {
	--n: 2; --i: 0; --seg: 38px;
	position: relative;
	display: inline-grid;
	grid-auto-flow: column;
	grid-auto-columns: var(--seg);
	height: 40px;
	padding: 3px;
	border-radius: 9999px;
	background: var(--mb-card);
	box-shadow: inset 0 0 0 1px var(--mb-line);
	isolation: isolate;
	flex-shrink: 0;
}
.mb-lang-thumb {
	position: absolute;
	top: 3px; bottom: 3px;
	inset-inline-start: 3px;
	width: var(--seg);
	border-radius: 9999px;
	background: var(--mb-green);
	z-index: -1;
	transform: translateX(calc(var(--i) * var(--seg)));
	transition: transform .42s cubic-bezier(.34, 1.36, .64, 1), background-color .3s;
}
[dir="rtl"] .mb-lang-thumb { transform: translateX(calc(var(--i) * var(--seg) * -1)); }
.mb-lang-thumb::after {
	content: "";
	position: absolute; top: 4px; inset-inline-end: 5px;
	width: 5px; height: 5px; border-radius: 50%;
	background: var(--mb-lime);
	transform: scale(.6); opacity: 0;
	transition: transform .3s var(--mb-ease) .25s, opacity .2s .25s;
}
.mb-lang:not(.is-going) .mb-lang-thumb::after { transform: scale(1); opacity: 1; }
.mb-lang a {
	display: grid; place-items: center;
	border-radius: 9999px;
	font-family: var(--mb-font-display);
	font-size: 13px; font-weight: 700;
	line-height: 1;
	color: var(--mb-muted);
	text-decoration: none !important;
	transition: color .3s var(--mb-ease), transform .14s var(--mb-ease);
}
.mb-lang a[hreflang="ar"] { font-size: 16px; padding-bottom: 2px; }
.mb-lang a:hover { color: var(--mb-green); }
.mb-lang a.is-on { color: #EBE5D8; }
.mb-lang a:active { transform: scale(.94); }
.mb-lang a:focus-visible { outline: 2px solid var(--mb-lime); outline-offset: 1px; }
body.theme-dark .mb-lang-thumb { background: #EBE5D8; }
body.theme-dark .mb-lang a:hover { color: #FBFAF7; }
body.theme-dark .mb-lang a.is-on { color: #0F2B27; }
@media (prefers-reduced-motion: reduce) { .mb-lang-thumb { transition: none; } }

/* ---------- 17. Marketplace panel — building blocks ---------- */
.lqd-card.mb-promo {
	background: #0F2B27 !important;
	border-color: transparent !important;
	color: #EBE5D8;
	min-height: 210px;
	position: relative;
	overflow: hidden;
	transform: none !important;
}
.lqd-card.mb-promo:hover { background: #12332E !important; }
body.theme-dark .lqd-card.mb-promo { background: #12332E !important; box-shadow: inset 0 0 0 1px rgba(235, 229, 216, .07) !important; }
.mb-promo .lqd-card-body { padding-block: 34px !important; }
.mb-promo h2 {
	color: #FBFAF7 !important;
	font-size: clamp(1.4rem, 1.1rem + 1vw, 1.9rem) !important;
	font-weight: 800 !important;
	display: inline;
	background-image: linear-gradient(transparent 62%, rgba(166, 199, 50, .38) 62%, rgba(166, 199, 50, .38) 90%, transparent 90%);
	padding-inline: 2px;
}
.mb-promo h2 + p, .mb-promo p {
	color: rgba(235, 229, 216, .72) !important;
	margin-top: 12px !important;
	max-width: 46ch;
	font-size: 14px;
	line-height: 1.7;
}
.mb-promo-cta {
	display: inline-flex; align-items: center;
	margin-top: 18px;
	padding: 6px 6px 6px 16px;
	border-radius: 9999px;
	background: #EBE5D8;
	color: #0F2B27;
	font-weight: 700; font-size: 13px;
}
[dir="rtl"] .mb-promo-cta { padding: 6px 16px 6px 6px; }
.mb-promo-art {
	position: absolute !important;
	inset-block: 0 !important;
	inset-inline-end: 0 !important;
	top: 0 !important;
	width: min(44%, 380px) !important;
	max-width: none !important;
	transform: none !important;
	display: flex; align-items: center; justify-content: center;
	pointer-events: none;
	margin: 0 !important;
}
.mb-bricks { width: auto; height: 86%; max-width: 100%; overflow: visible; }
.mb-puzzle .mb-p4 {
	transform-box: fill-box;
	transform-origin: center;
	transform: translate(40px, -30px) rotate(10deg);
	transition: transform .7s cubic-bezier(.34, 1.36, .64, 1);
}
.mb-puzzle .mb-slot { transition: opacity .4s ease .25s; }
.lqd-card.mb-promo:hover .mb-puzzle .mb-p4 { transform: translate(0, 0) rotate(0deg); }
.lqd-card.mb-promo:hover .mb-puzzle .mb-slot { opacity: 0; }
@media (prefers-reduced-motion: reduce) { .mb-puzzle .mb-p4 { transition: none; } }
@media (max-width: 991px) {
	.mb-promo-art { position: relative !important; width: 100% !important; inset: auto !important; margin-top: 12px !important; }
}

/* ---------- 18. Header search — round button that opens into a pill ---------- */
.lqd-header form.header-search {
	position: relative;
	width: 40px !important;
	height: 40px;
	flex-shrink: 0;
	border-radius: 9999px;
	background: var(--mb-card);
	box-shadow: inset 0 0 0 1px var(--mb-line);
	color: var(--mb-green);
	transition: width .38s cubic-bezier(.34, 1.2, .64, 1), box-shadow .18s var(--mb-ease);
}
body.theme-dark .lqd-header form.header-search { color: var(--mb-ivory); }
.lqd-header form.header-search:hover { box-shadow: inset 0 0 0 1px var(--mb-line-strong); }
.lqd-header form.header-search:focus-within { width: 260px !important; box-shadow: inset 0 0 0 1px var(--mb-green); }
body.theme-dark .lqd-header form.header-search:focus-within { box-shadow: inset 0 0 0 1px #A6C732; }
.lqd-header form.header-search .header-search-input-wrap { position: absolute !important; inset: 0; width: 100% !important; height: 100%; }
.lqd-header form.header-search .header-search-icon {
	inset-inline-start: 10px !important;
	width: 20px !important; height: 20px !important;
	opacity: 1 !important;
	color: currentColor;
}
.lqd-header form.header-search .lqd-input-container { position: absolute !important; inset: 0; width: 100% !important; height: 100% !important; }
.lqd-header form.header-search .lqd-input {
	width: 100% !important; height: 100% !important;
	padding-inline-start: 40px !important; padding-inline-end: 14px !important;
	background: transparent !important;
	border: 0 !important; box-shadow: none !important;
	border-radius: 9999px !important;
	font-size: 13px !important;
	cursor: pointer;
	opacity: 0;
	transition: opacity .2s ease;
}
.lqd-header form.header-search:focus-within .lqd-input { opacity: 1; cursor: text; }
.lqd-header form.header-search .header-search-kbd,
.lqd-header form.header-search .header-search-arrow { display: none !important; }

/* ---------- 19. User dashboard hero ---------- */
.lqd-page form.header-search.w-full .lqd-input {
	background: var(--mb-card) !important;
	min-height: 60px;
	border-radius: 9999px !important;
	border: 1px solid var(--mb-line) !important;
	box-shadow: var(--mb-lift) !important;
}
.lqd-page form.header-search.w-full .lqd-input:focus { border-color: var(--mb-green) !important; }
/* recolour the theme's decorative SVG gradients (purple/pink/teal -> lime/green) */
stop[stop-color="#E385FF" i], stop[stop-color="#9B84FB" i], stop[stop-color="#8D65E9" i], stop[stop-color="#C084FC" i] { stop-color: #A6C732 !important; }
stop[stop-color="#B694DD" i], stop[stop-color="#6977DE" i], stop[stop-color="#5949E7" i] { stop-color: #C6DE6B !important; }
stop[stop-color="#65D572" i], stop[stop-color="#8DECD7" i], stop[stop-color="#20C69F" i], stop[stop-color="#3655DF" i] { stop-color: #1E4D46 !important; }
[fill="#8185F4" i], [fill="#9B84FB" i], [fill="#6977DE" i], [fill="#5949E7" i] { fill: #1E4D46 !important; }
[stroke="#8185F4" i], [stroke="#9B84FB" i], [stroke="#6977DE" i] { stroke: #1E4D46 !important; }

/* ---------- 21. Stacked rail: equal space above icon and below label ---------- */
.mb-rail .lqd-navbar .lqd-navbar-link { padding-bottom: 12px !important; }
.mb-rail .lqd-navbar .lqd-nav-link-label { line-height: 1.3 !important; }

/* ---------- 22. Swapped icons: RTL direction + emoji glyphs ---------- */
[dir="rtl"] .mb-ph.mb-dir { transform: scaleX(-1); }
[dir="rtl"] .mb-ph.mb-dir.rotate-180 { transform: scaleX(-1) rotate(180deg); }
.mb-ph.mb-emoji { width: 1.15em; height: 1.15em; vertical-align: -.2em; color: var(--mb-green); margin-inline: .1em; }
body.theme-dark .mb-ph.mb-emoji { color: #C6DE6B; }
img[data-mb^="chatbot"] { width: 100%; height: 100%; object-fit: contain; padding: 8%; }
/* megaphones always face right (Phosphor draws them facing left) */
.mb-ph[data-mb="megaphone"], .mb-ph[data-mb="megaphone-simple"] { transform: scaleX(-1); }
@media (prefers-reduced-motion: reduce) { .mb-sky .mb-sun::before { animation: none; } }