/* Econytics Elementor widgets */

.ecx-lang {
	display: inline-flex;
	gap: 14px;
	align-items: center;
}

.ecx-lang a {
	color: inherit;
	text-decoration: none;
	border-bottom: 1px solid currentColor;
	padding: 4px 2px;
	font-weight: 700;
	opacity: .85;
	transition: opacity .2s, color .2s;
}

.ecx-lang a:hover,
.ecx-lang a[aria-current] {
	opacity: 1;
}

.ecx-lang a[lang="ar"] {
	font-family: "IBM Plex Sans Arabic", sans-serif;
}

/* ===================================================== Signal visual */
.ecx-signal {
	position: relative;
	min-height: 490px;
	display: flex;
	align-items: center;
	justify-content: center;
	direction: ltr;
}
.ecx-signal__orbit {
	position: absolute;
	width: 410px;
	height: 410px;
	border: 1px solid rgba(127,217,245,.13);
	border-radius: 50%;
	box-shadow: 0 0 0 42px rgba(142,214,240,.025), 0 0 0 94px rgba(142,214,240,.015);
}
.ecx-signal__orbit--two { width: 292px; height: 292px; border-color: rgba(0,172,221,.16); box-shadow: none; }
.ecx-signal__svg { width: 100%; height: 440px; filter: drop-shadow(0 0 8px rgba(0,172,221,.18)); position: relative; }
.ecx-signal__card {
	position: absolute;
	background: rgba(18,48,78,.88);
	border: 1px solid rgba(127,190,230,.22);
	border-radius: 12px;
	-webkit-backdrop-filter: blur(16px);
	backdrop-filter: blur(16px);
	color: #EEF6FB;
	box-shadow: 0 20px 70px rgba(0,17,24,.3);
}
.ecx-signal__card small { display: block; font: 10px/1.5 ui-monospace, SFMono-Regular, Menlo, monospace; color: #8EB4D0; letter-spacing: .06em; text-transform: uppercase; }
.ecx-signal__card strong { display: block; font: 800 26px/1.2 Manrope, sans-serif; letter-spacing: -.05em; margin: 7px 0; }
.ecx-signal__card strong.is-text { font-size: 17px; letter-spacing: -.02em; }
.ecx-signal__card--top { right: -10px; top: 7px; padding: 15px 19px; width: 210px; }
.ecx-signal__card--bottom { left: -10px; bottom: 30px; padding: 16px 18px; width: 222px; }
.ecx-signal__bars { height: 28px; display: flex; align-items: flex-end; gap: 5px; margin-top: 8px; }
.ecx-signal__bars b { flex: 1; height: var(--h); border-radius: 2px 2px 0 0; background: #00ACDD; transform-origin: bottom; }
.ecx-signal__bars b:nth-child(3n) { background: #7FA3C2; }
.ecx-signal__bars b:last-child { background: #96BC33; }

/* Animation */
.ecx-signal.is-animated .ecx-signal__line { stroke-dasharray: 1; stroke-dashoffset: 1; animation: ecx-draw 2.4s cubic-bezier(.6,.05,.3,1) .2s forwards; }
.ecx-signal.is-animated .ecx-signal__line--b { animation-delay: .6s; }
.ecx-signal.is-animated .ecx-signal__dots circle { opacity: 0; animation: ecx-fade .5s ease forwards; }
.ecx-signal.is-animated .ecx-signal__dots circle:nth-child(1) { animation-delay: 1.0s; }
.ecx-signal.is-animated .ecx-signal__dots circle:nth-child(2) { animation-delay: 1.5s; }
.ecx-signal.is-animated .ecx-signal__dots circle:nth-child(3) { animation-delay: 1.9s; }
.ecx-signal.is-animated .ecx-signal__dots circle:nth-child(4) { animation-delay: 2.3s; }
.ecx-signal.is-animated .ecx-signal__pulse { transform-box: fill-box; transform-origin: center; animation: ecx-pulse 4s ease-in-out infinite; }
.ecx-signal.is-animated .ecx-signal__mesh { animation: ecx-breathe 9s ease-in-out infinite; }
.ecx-signal.is-animated .ecx-signal__card { animation: ecx-float 7s ease-in-out infinite; }
.ecx-signal.is-animated .ecx-signal__card--bottom { animation-delay: -3.5s; }
.ecx-signal.is-animated .ecx-signal__bars b { animation: ecx-grow 1s cubic-bezier(.3,.7,.3,1) both; animation-delay: calc(1.2s + var(--i) * 80ms); }

@keyframes ecx-draw { to { stroke-dashoffset: 0; } }
@keyframes ecx-fade { to { opacity: 1; } }
@keyframes ecx-pulse { 0%, 100% { transform: scale(.7); opacity: .55; } 50% { transform: scale(1.5); opacity: .1; } }
@keyframes ecx-breathe { 0%, 100% { opacity: .4; } 50% { opacity: .18; } }
@keyframes ecx-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }
@keyframes ecx-grow { from { transform: scaleY(0); } to { transform: scaleY(1); } }

@media (max-width: 1024px) {
	.ecx-signal { min-height: 400px; }
	.ecx-signal__svg { height: 350px; }
	.ecx-signal__orbit { width: 310px; height: 310px; }
}
@media (max-width: 767px) {
	.ecx-signal { min-height: 340px; }
	.ecx-signal__svg { height: 320px; }
	.ecx-signal__card--top { right: 0; width: 180px; padding: 12px 14px; }
	.ecx-signal__card--bottom { left: 0; width: 190px; padding: 12px 14px; }
	.ecx-signal__card strong { font-size: 21px; }
}

/* ===================================================== Scenario lab */
.ecx-lab {
	display: grid;
	grid-template-columns: 340px 1fr;
	background: #fff;
	border: 1px solid #D3E1EA;
	box-shadow: 0 40px 90px rgba(0,40,70,.08);
	min-height: 492px;
	color: #0E2A44;
}
.ecx-lab__input { padding: 33px; border-inline-end: 1px solid #DDE8EF; }
.ecx-lab__kicker { font: 800 10px/1.6 Inter, sans-serif; letter-spacing: .22em; text-transform: uppercase; color: #00729B; margin: 0; }
.ecx-lab__kicker::before { content: ""; display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: #96BC33; margin-inline-end: 9px; vertical-align: 1px; }
.ecx-lab__title { font: 800 25px/1.2 Manrope, sans-serif; letter-spacing: -.05em; margin: 14px 0 10px; color: #0E2A44; }
.ecx-lab__text, .ecx-lab__note { font-size: 13px; line-height: 1.65; color: #5B6F80; margin: 0; }
.ecx-lab__note { margin-top: 12px; min-height: 4.95em; padding: 10px 12px; background: #F3F7FA; border-inline-start: 2px solid #00ACDD; color: #3A4F63; }
.ecx-lab__label { display: flex; justify-content: space-between; align-items: center; font-size: 12px; font-weight: 800; margin: 26px 0 12px; color: #0E2A44; }
.ecx-lab__val { color: #00729B; font: 800 15px Manrope, sans-serif; }
.ecx-lab__pills { display: flex; gap: 6px; flex-wrap: wrap; }
.ecx-lab button.ecx-lab__pill {
	font: 800 11px/1 Inter, sans-serif;
	color: #3A5A75;
	background: #F1F6F9;
	border: 1px solid #D6E3EC;
	border-radius: 18px;
	padding: 9px 12px;
	cursor: pointer;
	transition: background-color .2s, color .2s, border-color .2s;
}
.ecx-lab button.ecx-lab__pill:hover { border-color: #00ACDD; background: #F1F6F9; color: #3A5A75; }
.ecx-lab button.ecx-lab__pill.is-on, .ecx-lab button.ecx-lab__pill.is-on:hover { background: #004166; color: #FFFFFF; border-color: #004166; }
.ecx-lab__range { width: 100%; accent-color: #004166; cursor: pointer; }
.ecx-lab button.ecx-lab__reset {
	margin-top: 28px;
	font: 700 11px/1 Inter, sans-serif;
	padding: 12px 17px;
	border-radius: 40px;
	border: 1px solid #C6D6E1;
	background: transparent;
	color: #0E2A44;
	cursor: pointer;
}
.ecx-lab button.ecx-lab__reset:hover { border-color: #004166; background: transparent; color: #004166; }
.ecx-lab__result { background: #FAFCFE; padding: 32px 38px; min-width: 0; }
.ecx-lab__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.ecx-lab__head h4 { font: 800 15px/1.3 Manrope, sans-serif; margin: 3px 0; color: #0E2A44; letter-spacing: -.01em; }
.ecx-lab__head p { font: 10px ui-monospace, monospace; letter-spacing: .08em; color: #7F93A3; margin: 0; }
.ecx-lab__status { background: #E3F5FC; color: #00729B; border: 1px solid #BFE6F5; border-radius: 30px; padding: 7px 10px; font-size: 9px; letter-spacing: .06em; font-weight: 800; text-transform: uppercase; white-space: nowrap; }
.ecx-lab__chart { width: 100%; height: 250px; margin-top: 20px; display: block; direction: ltr; }
.ecx-lab__line, .ecx-lab__base, .ecx-lab__area, .ecx-lab__dot { transition: d .35s ease, cx .35s ease, cy .35s ease; }
.ecx-lab__key { display: flex; gap: 20px; font-size: 11px; color: #4F6577; flex-wrap: wrap; }
.ecx-lab__key i { width: 8px; height: 8px; border-radius: 50%; display: inline-block; vertical-align: middle; margin-inline-end: 6px; }
.ecx-lab__metrics { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 20px; }
.ecx-lab__metrics > div { padding: 14px 12px 12px; background: #fff; border: 1px solid #E1EBF1; }
.ecx-lab__metrics label { font-size: 10px; color: #637889; display: block; line-height: 1.4; }
.ecx-lab__metrics strong { font: 800 24px Manrope, sans-serif; letter-spacing: -.04em; display: block; margin: 4px 0 0; color: #0E2A44; }
.ecx-lab__metrics strong.is-up { color: #00729B; }
.ecx-lab__metrics strong.is-down { color: #B4552E; }
.ecx-lab__metrics span { font-size: 10px; color: #7F93A3; }
.ecx-lab__disclaimer { font-size: 11px; color: #7F93A3; margin: 16px 0 0; line-height: 1.6; }

@media (max-width: 1024px) {
	.ecx-lab { grid-template-columns: 300px 1fr; }
}
@media (max-width: 767px) {
	.ecx-lab { grid-template-columns: 1fr; }
	.ecx-lab__input { border-inline-end: 0; border-bottom: 1px solid #DDE8EF; padding: 24px; }
	.ecx-lab__result { padding: 24px; }
	.ecx-lab__chart { height: 200px; }
	.ecx-lab__metrics { gap: 6px; }
	.ecx-lab__metrics > div { padding: 10px 8px; }
	.ecx-lab__metrics strong { font-size: 19px; }
}

/* Arabic */
[dir="rtl"] .ecx-lab__kicker, [dir="rtl"] .ecx-lab__title, [dir="rtl"] .ecx-lab__pill,
[dir="rtl"] .ecx-lab__head h4, [dir="rtl"] .ecx-lab__metrics strong, [dir="rtl"] .ecx-lab__reset {
	font-family: "IBM Plex Sans Arabic", Inter, sans-serif;
	letter-spacing: 0;
}

@media (prefers-reduced-motion: reduce) {
	.ecx-signal * { animation: none !important; stroke-dashoffset: 0 !important; opacity: 1; }
}
