:root {
	--wm-market-green: #002766;
	--wm-market-green-deep: #0d3d3a;
	--wm-market-gold: #48b848;
	--wm-market-ink: #15231d;
	--wm-market-muted: #718078;
	--wm-market-line: #dfe8f0;
	--wm-market-bg: #f3f7f4;
	--wm-market-white: #fff;
	--wm-market-up: #1f7655;
	--wm-market-down: #c94545;
}

.wm-market-ticker,
.wm-market-ticker * {
	box-sizing: border-box;
}

.wm-market-ticker {
	position: relative;
	z-index: 9998;
	display: grid;
	grid-template-columns: 210px minmax(0, 1fr);
	width: 100%;
	min-height: 76px;
	margin: 0;
	border-bottom: 1px solid rgba(20, 83, 80, .14);
	background: #fff;
	box-shadow: 0 5px 18px rgba(15, 52, 42, .07);
	color: var(--wm-market-ink);
	font-family: inherit;
	line-height: 1.2;
	overflow: hidden;
}

.wm-market-ticker a {
	text-decoration: none !important;
}

.wm-market-ticker-brand {
	position: relative;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	gap: 3px;
	min-width: 0;
	padding: 10px 18px;
	border-right: 1px solid var(--wm-market-line);
	background: linear-gradient(135deg, #fff, #f5faf7);
}

.wm-market-ticker-brand a {
	display: flex;
	align-items: center;
	justify-content: center;
	max-width: 100%;
	color: var(--wm-market-green) !important;
}

.wm-market-ticker-brand small {
	color: var(--wm-market-muted);
	font-size: 9px;
	font-weight: 800;
	letter-spacing: .14em;
	text-transform: uppercase;
}

.wm-market-ticker-logo-image {
	display: block;
	width: auto;
	max-width: 165px;
	height: 34px;
	object-fit: contain;
}

.wm-market-wordmark {
	font-size: 22px;
	font-weight: 900;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.wm-market-ticker-viewport {
	min-width: 0;
	overflow: hidden;
}

.wm-market-ticker-track {
	display: flex;
	width: max-content;
	min-width: 100%;
	animation: wm-market-marquee var(--wm-market-ticker-speed, 300s) linear infinite;
	will-change: transform;
}

.wm-market-ticker:hover .wm-market-ticker-track,
.wm-market-ticker:focus-within .wm-market-ticker-track {
	animation-play-state: paused;
}

.wm-market-ticker--static .wm-market-ticker-track {
	animation: none;
}

.wm-market-ticker--static .wm-market-ticker-sequence[aria-hidden="true"] {
	display: none;
}

.wm-market-ticker-sequence {
	display: flex;
	align-items: stretch;
	flex: 0 0 auto;
}

.wm-market-ticker-category {
	display: flex;
	align-items: stretch;
	flex: 0 0 auto;
	border-right: 1px solid var(--wm-market-line);
}

.wm-market-category-label {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	flex: 0 0 138px;
	width: 138px;
	min-width: 138px;
	padding: 0 14px;
	border-left: 1px solid var(--wm-market-line);
	background: #eef5f1;
	color: var(--wm-market-green);
	text-align: center;
	white-space: nowrap;
}

.wm-market-category-label img {
	flex: 0 0 22px;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	object-fit: cover;
}

.wm-market-category-label b {
	overflow: hidden;
	font-size: 11px;
	font-weight: 900;
	letter-spacing: .06em;
	text-overflow: ellipsis;
	text-transform: uppercase;
}

.wm-market-ticker-item {
	display: grid;
	grid-template-columns: 42px minmax(0, 1fr) 58px;
	align-items: center;
	gap: 10px;
	flex: 0 0 320px;
	width: 320px;
	min-width: 320px;
	max-width: 320px;
	min-height: 76px;
	padding: 9px 14px;
	border-left: 1px solid rgba(220, 230, 223, .72);
	background: #fff;
	color: var(--wm-market-ink) !important;
	transition: background .16s ease;
}

.wm-market-ticker-item:hover {
	background: #f7faf8;
}

.wm-market-ticker-icons {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 5px;
	min-width: 0;
}

.wm-market-separator-image,
.wm-market-commodity-icon {
	display: block;
	flex: 0 0 20px;
	width: 20px;
	height: 20px;
	border-radius: 5px;
	object-fit: contain;
}

.wm-market-separator-fallback {
	display: grid;
	place-items: center;
	flex: 0 0 20px;
	width: 20px;
	height: 20px;
	border-radius: 5px;
	background: var(--wm-market-green);
	color: #fff;
	font-size: 8px;
	font-weight: 900;
}

.wm-market-ticker-copy {
	display: grid;
	min-width: 0;
	gap: 5px;
}

.wm-market-ticker-name {
	display: block;
	min-width: 0;
	font-size: 14px;
	font-weight: 750;
	line-height: 1.25;
	overflow-wrap: anywhere;
	white-space: normal;
}

.wm-market-ticker-price {
	display: flex;
	align-items: baseline;
	gap: 5px;
	min-width: 0;
	white-space: nowrap;
}

.wm-market-ticker-price strong {
	font-size: 14px;
	font-weight: 850;
}

.wm-market-ticker-price small {
	color: var(--wm-market-muted);
	font-size: 9px;
	font-weight: 750;
}

.wm-market-ticker-change {
	display: grid;
	justify-items: end;
	gap: 4px;
	min-width: 0;
	font-size: 10px;
	font-weight: 750;
	line-height: 1.2;
	white-space: nowrap;
}

.wm-market-ticker-change b {
	font-size: 17px;
	line-height: 1;
}

.wm-market-ticker-change span {
	display: block;
	overflow: hidden;
	max-width: 58px;
	text-overflow: ellipsis;
}

.wm-market-ticker-item--up .wm-market-ticker-change { color: var(--wm-market-up); }
.wm-market-ticker-item--down .wm-market-ticker-change { color: var(--wm-market-down); }
.wm-market-ticker-item--flat .wm-market-ticker-change { color: var(--wm-market-muted); }

@keyframes wm-market-marquee {
	from { transform: translate3d(0, 0, 0); }
	to { transform: translate3d(-50%, 0, 0); }
}

@media (prefers-reduced-motion: reduce) {
	.wm-market-ticker-track { animation: none; }
	.wm-market-ticker-viewport { overflow-x: auto; }
	.wm-market-ticker-sequence[aria-hidden="true"] { display: none; }
}

.wm-market-page,
.wm-market-page * {
	box-sizing: border-box;
}

.wm-market-page {
	margin: 0;
	padding: 48px 20px 76px;
	background:
		radial-gradient(circle at 10% 0%, rgba(188, 151, 92, .09), transparent 26%),
		linear-gradient(180deg, #f7faf8, var(--wm-market-bg));
	color: var(--wm-market-ink);
	font-family: inherit;
}

.wm-market-page-inner {
	width: min(1320px, 100%);
	margin: 0 auto;
}

.wm-market-breadcrumb {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 24px;
	color: var(--wm-market-muted);
	font-size: 12px;
}

.wm-market-breadcrumb a {
	color: var(--wm-market-green) !important;
	text-decoration: none !important;
}

.wm-market-page-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 28px;
	margin-bottom: 26px;
	padding: 30px;
	border: 1px solid var(--wm-market-line);
	border-radius: 24px;
	background: rgba(255, 255, 255, .96);
	box-shadow: 0 22px 56px rgba(17, 59, 45, .08);
}

.wm-market-page-title {
	display: flex;
	align-items: center;
	gap: 20px;
	min-width: 0;
}

.wm-market-page-icon {
	display: grid;
	place-items: center;
	flex: 0 0 74px;
	width: 74px;
	height: 74px;
	overflow: hidden;
	border-radius: 20px;
	background: #eaf5fb;
	color: var(--wm-market-green);
	font-size: 28px;
	font-weight: 900;
}

.wm-market-page-icon img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.wm-market-kicker {
	display: inline-block;
	margin-bottom: 5px;
	color: var(--wm-market-green);
	font-size: 11px;
	font-weight: 900;
	letter-spacing: .14em;
	text-transform: uppercase;
}

.wm-market-page-title h1 {
	margin: 0;
	font-size: clamp(30px, 4vw, 50px);
	line-height: 1.05;
	letter-spacing: -.04em;
}

.wm-market-page-title h1 small {
	color: var(--wm-market-muted);
	font-size: .38em;
	font-weight: 650;
	letter-spacing: 0;
}

.wm-market-page-title p {
	margin: 9px 0 0;
	color: var(--wm-market-muted);
	font-size: 14px;
}

.wm-market-latest {
	display: grid;
	gap: 4px;
	min-width: 230px;
	padding: 18px 22px;
	border-left: 3px solid var(--wm-market-gold);
	border-radius: 14px;
	background: #faf8f2;
}

.wm-market-latest small,
.wm-market-stat-grid article > span {
	color: var(--wm-market-muted);
	font-size: 11px;
	font-weight: 750;
	letter-spacing: .05em;
	text-transform: uppercase;
}

.wm-market-latest strong {
	font-size: 32px;
	line-height: 1.1;
}

.wm-market-latest strong:not(:empty)::after {
	content: ' SAR/kg';
	color: var(--wm-market-muted);
	font-size: 11px;
	font-weight: 700;
}

.wm-market-latest > span {
	color: var(--wm-market-muted);
	font-size: 11px;
}

.wm-market-stat-grid {
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	gap: 12px;
	margin-bottom: 24px;
}

.wm-market-stat-grid article {
	display: grid;
	gap: 6px;
	min-width: 0;
	padding: 19px;
	border: 1px solid var(--wm-market-line);
	border-radius: 16px;
	background: #fff;
	box-shadow: 0 10px 28px rgba(17, 59, 45, .05);
}

.wm-market-stat-grid strong {
	font-size: clamp(21px, 2vw, 29px);
	line-height: 1.1;
	overflow-wrap: anywhere;
}

.wm-market-stat-grid small {
	color: var(--wm-market-muted);
	font-size: 10px;
}

.wm-market-chart-card {
	overflow: hidden;
	border: 1px solid var(--wm-market-line);
	border-radius: 24px;
	background: #fff;
	box-shadow: 0 24px 60px rgba(17, 59, 45, .08);
}

.wm-market-chart-toolbar {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 24px;
	padding: 24px 26px 18px;
	border-bottom: 1px solid var(--wm-market-line);
}

.wm-market-chart-toolbar > div:first-child > span {
	color: var(--wm-market-green);
	font-size: 10px;
	font-weight: 900;
	letter-spacing: .13em;
	text-transform: uppercase;
}

.wm-market-chart-toolbar h2 {
	margin: 5px 0 0;
	font-size: 21px;
}

.wm-market-toolbar-groups {
	display: flex;
	align-items: flex-end;
	flex-wrap: wrap;
	justify-content: flex-end;
	gap: 16px;
}

.wm-market-control-group {
	display: grid;
	gap: 6px;
}

.wm-market-control-group small {
	color: var(--wm-market-muted);
	font-size: 9px;
	font-weight: 800;
	letter-spacing: .09em;
	text-transform: uppercase;
}

.wm-market-control-group > div {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 4px;
	padding: 4px;
	border: 1px solid var(--wm-market-line);
	border-radius: 11px;
	background: #f6f9f7;
}

.wm-market-control-group button,
.wm-market-custom-range button {
	appearance: none;
	min-height: 34px;
	padding: 0 11px;
	border: 0 !important;
	border-radius: 8px;
	background: transparent !important;
	box-shadow: none !important;
	color: var(--wm-market-muted) !important;
	font: inherit;
	font-size: 11px;
	font-weight: 750;
	line-height: 1;
	cursor: pointer;
}

.wm-market-control-group button:hover,
.wm-market-control-group button.is-active {
	background: var(--wm-market-green) !important;
	color: #fff !important;
}

.wm-market-custom-range {
	display: flex;
	align-items: flex-end;
	justify-content: flex-end;
	gap: 10px;
	padding: 14px 26px;
	border-bottom: 1px solid var(--wm-market-line);
	background: #fafcfb;
}

.wm-market-custom-range[hidden] { display: none !important; }

.wm-market-custom-range label {
	display: grid;
	gap: 5px;
	color: var(--wm-market-muted);
	font-size: 10px;
	font-weight: 750;
}

.wm-market-custom-range input {
	min-height: 38px;
	padding: 7px 10px;
	border: 1px solid #ccd8d0;
	border-radius: 9px;
	background: #fff;
	font: inherit;
}

.wm-market-custom-range button {
	min-height: 38px;
	padding-inline: 16px;
	background: var(--wm-market-green) !important;
	color: #fff !important;
}

.wm-market-chart-wrap {
	position: relative;
	min-height: 480px;
	padding: 10px 14px 0;
}

.wm-market-chart-wrap canvas {
	display: block;
	max-width: 100%;
	transition: opacity .2s ease;
}

.wm-market-chart-loading,
.wm-market-chart-empty {
	position: absolute;
	inset: 0;
	display: grid;
	place-content: center;
	justify-items: center;
	gap: 10px;
	padding: 30px;
	background: rgba(255, 255, 255, .86);
	text-align: center;
}

.wm-market-chart-loading[hidden],
.wm-market-chart-empty[hidden] { display: none !important; }

.wm-market-chart-loading span {
	width: 34px;
	height: 34px;
	border: 3px solid #d8e5de;
	border-top-color: var(--wm-market-green);
	border-radius: 50%;
	animation: wm-market-spin .75s linear infinite;
}

.wm-market-chart-loading p,
.wm-market-chart-empty p {
	margin: 0;
	color: var(--wm-market-muted);
	font-size: 13px;
}

.wm-market-chart-empty strong { font-size: 20px; }

@keyframes wm-market-spin { to { transform: rotate(360deg); } }

.wm-market-chart-tooltip {
	position: absolute;
	z-index: 5;
	display: grid;
	gap: 5px;
	min-width: 180px;
	padding: 13px;
	border: 1px solid rgba(255, 255, 255, .1);
	border-radius: 12px;
	background: rgba(13, 61, 58, .94);
	box-shadow: 0 12px 28px rgba(0, 0, 0, .2);
	color: #fff;
	font-size: 11px;
	pointer-events: none;
}

.wm-market-chart-tooltip[hidden] { display: none !important; }
.wm-market-chart-tooltip strong { margin-bottom: 3px; font-size: 12px; }
.wm-market-chart-tooltip span { display: flex; justify-content: space-between; gap: 20px; color: rgba(255, 255, 255, .75); }
.wm-market-chart-tooltip b { color: #fff; }

.wm-market-chart-footer {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 18px;
	padding: 14px 26px 18px;
	border-top: 1px solid var(--wm-market-line);
	color: var(--wm-market-muted);
	font-size: 10px;
}

.wm-market-chart-footer span {
	display: inline-flex;
	align-items: center;
	gap: 6px;
}

.wm-market-chart-footer i {
	width: 9px;
	height: 9px;
	border-radius: 2px;
}

.wm-market-legend-up { background: var(--wm-market-up); }
.wm-market-legend-down { background: var(--wm-market-down); }

@media (max-width: 1100px) {
	.wm-market-stat-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.wm-market-chart-toolbar { align-items: flex-start; flex-direction: column; }
	.wm-market-toolbar-groups { justify-content: flex-start; }
}

@media (max-width: 780px) {
	.wm-market-ticker { grid-template-columns: 132px minmax(0, 1fr); min-height: 68px; }
	.wm-market-ticker-brand { padding: 8px 10px; }
	.wm-market-ticker-logo-image { max-width: 106px; height: 27px; }
	.wm-market-wordmark { font-size: 16px; }
	.wm-market-category-label { flex-basis: 116px; width: 116px; min-width: 116px; padding-inline: 10px; }
	.wm-market-ticker-item { grid-template-columns: 36px minmax(0, 1fr) 50px; flex-basis: 280px; width: 280px; min-width: 280px; max-width: 280px; min-height: 68px; padding: 8px 11px; gap: 8px; }
	.wm-market-ticker-name,
	.wm-market-ticker-price strong { font-size: 12px; }
	.wm-market-ticker-change { font-size: 9px; }
	.wm-market-ticker-change span { max-width: 50px; }

	.wm-market-page { padding: 30px 14px 52px; }
	.wm-market-page-header { align-items: stretch; flex-direction: column; padding: 22px; }
	.wm-market-latest { min-width: 0; border-left: 0; border-top: 3px solid var(--wm-market-gold); }
	.wm-market-stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.wm-market-chart-toolbar { padding: 20px; }
	.wm-market-toolbar-groups { width: 100%; }
	.wm-market-control-group { width: 100%; }
	.wm-market-control-group > div { overflow-x: auto; flex-wrap: nowrap; }
	.wm-market-control-group button { flex: 0 0 auto; }
	.wm-market-custom-range { align-items: stretch; flex-direction: column; padding: 14px 20px; }
	.wm-market-chart-wrap { min-height: 390px; padding-inline: 5px; }
	.wm-market-chart-footer { padding-inline: 20px; }
}

@media (max-width: 480px) {
	.wm-market-ticker { grid-template-columns: 82px minmax(0, 1fr); min-height: 62px; }
	.wm-market-ticker-brand { padding-inline: 7px; }
	.wm-market-ticker-brand small { display: none; }
	.wm-market-ticker-logo-image { max-width: 68px; height: 22px; }
	.wm-market-category-label { flex-basis: 92px; width: 92px; min-width: 92px; padding-inline: 8px; gap: 5px; }
	.wm-market-category-label img { width: 18px; height: 18px; flex-basis: 18px; }
	.wm-market-category-label b { font-size: 8px; letter-spacing: .03em; }
	.wm-market-ticker-item { grid-template-columns: 22px minmax(0, 1fr) 42px; flex-basis: 244px; width: 244px; min-width: 244px; max-width: 244px; min-height: 62px; padding: 7px 9px; gap: 7px; }
	.wm-market-ticker-icons { gap: 0; }
	.wm-market-separator-image,
	.wm-market-separator-fallback { width: 18px; height: 18px; flex-basis: 18px; }
	.wm-market-commodity-icon { display: none; }
	.wm-market-ticker-copy { gap: 3px; }
	.wm-market-ticker-name,
	.wm-market-ticker-price strong { font-size: 11px; }
	.wm-market-ticker-price small { font-size: 8px; }
	.wm-market-ticker-change { font-size: 8px; }
	.wm-market-ticker-change b { font-size: 14px; }
	.wm-market-ticker-change span { max-width: 42px; }

	.wm-market-page-title { align-items: flex-start; }
	.wm-market-page-icon { flex-basis: 54px; width: 54px; height: 54px; border-radius: 15px; }
	.wm-market-page-title h1 small { display: block; margin-top: 5px; font-size: 13px; }
	.wm-market-stat-grid { grid-template-columns: 1fr; }
	.wm-market-stat-grid article { grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
	.wm-market-stat-grid article > span,
	.wm-market-stat-grid article > small { grid-column: 1; }
	.wm-market-stat-grid strong { grid-column: 2; grid-row: 1 / span 2; }
}


/* v0.7.3: keep complete commodity names visible in responsive ticker cards. */
.wm-market-ticker-name {
	max-width: none;
	text-overflow: clip;
}

@media (max-width: 780px) {
	.wm-market-ticker-name {
		font-size: 12px;
		line-height: 1.2;
	}
}

@media (max-width: 480px) {
	.wm-market-ticker-name {
		font-size: 11px;
		line-height: 1.18;
	}
}

@media (max-width: 360px) {
	.wm-market-ticker { grid-template-columns: 72px minmax(0, 1fr); }
	.wm-market-ticker-logo-image { max-width: 58px; }
	.wm-market-category-label { flex-basis: 82px; width: 82px; min-width: 82px; }
	.wm-market-ticker-item {
		grid-template-columns: 20px minmax(0, 1fr) 38px;
		flex-basis: 226px;
		width: 226px;
		min-width: 226px;
		max-width: 226px;
		padding-inline: 8px;
	}
	.wm-market-ticker-name { font-size: 10.5px; }
	.wm-market-ticker-change span { max-width: 38px; }
}

/* v0.7.5 — Worthiom market-data brand enforcement. */
.wm-market-ticker a,
.wm-market-chart-page a,
.wm-market-stat-card a {
	text-decoration: none !important;
	text-decoration-line: none !important;
	border-bottom: 0 !important;
	box-shadow: none !important;
}

