/**
 * BANC Datablocks Widgets — frontend styles.
 *
 * ALL brand values live in the design-token layer below (CSS custom
 * properties); component rules only ever reference var(--banc-mfn-*).
 * Rebrand for a new client by overriding tokens — in the theme:
 *   :root { --banc-mfn-color-primary: #123456; }
 * or from PHP via the `banc_datablocks_css_vars` filter (inline override
 * printed after this sheet). Defaults below match the Kambi HiFi Figma.
 */

:root {
	/* Colors */
	--banc-mfn-color-primary: #00355c;   /* headings, table headers, active states */
	--banc-mfn-color-accent: #ff4858;    /* CTAs, highlights */
	--banc-mfn-color-on-primary: #fbfcfd;
	--banc-mfn-color-on-accent: #fbfcfd;
	--banc-mfn-color-text: #00355c;
	--banc-mfn-color-text-muted: #64748b;
	--banc-mfn-color-surface: #ffffff;
	--banc-mfn-color-surface-alt: #f0f6fb;
	--banc-mfn-color-border: #bdd2ff;
	--banc-mfn-color-positive: #00a32a;
	--banc-mfn-color-negative: #d63638;
	--banc-mfn-color-error-bg: #f8d7da;
	--banc-mfn-color-error-text: #721c24;

	/* Typography */
	--banc-mfn-font-heading: "Sora", sans-serif;
	--banc-mfn-font-body: "DM Sans", sans-serif;
	--banc-mfn-heading-weight: 400;
	--banc-mfn-body-size: 16px;

	/* Shape & spacing */
	--banc-mfn-radius: 16px;
	--banc-mfn-radius-small: 8px;
	--banc-mfn-radius-pill: 20px;
	--banc-mfn-border-width: 2px;
	--banc-mfn-card-padding: 24px;
	--banc-mfn-gap: 20px;
	--banc-mfn-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);

	/* Tabs */
	--banc-mfn-tab-bg: var(--banc-mfn-color-surface-alt);
	--banc-mfn-tab-text: var(--banc-mfn-color-text);
	--banc-mfn-tab-active-bg: var(--banc-mfn-color-primary);
	--banc-mfn-tab-active-text: var(--banc-mfn-color-on-primary);
}

/* --- Generic widget card ------------------------------------------------- */
.banc-datablocks-widget {
	background: var(--banc-mfn-color-surface);
	border: var(--banc-mfn-border-width) solid var(--banc-mfn-color-border);
	border-radius: var(--banc-mfn-radius);
	padding: var(--banc-mfn-card-padding);
	font-family: var(--banc-mfn-font-body);
	overflow-x: auto;
}

.banc-datablocks-fallback {
	background: var(--banc-mfn-color-error-bg);
	color: var(--banc-mfn-color-error-text);
	padding: var(--banc-mfn-gap);
	border-radius: var(--banc-mfn-radius-small);
	text-align: center;
	font-family: var(--banc-mfn-font-body);
	font-size: 14px;
}

/* --- Stock price ticker -------------------------------------------------- */
.banc-stock-ticker {
	display: inline-flex;
	align-items: baseline;
	gap: 12px;
	font-family: var(--banc-mfn-font-body);
	color: var(--banc-mfn-color-text);
}

.banc-stock-ticker__price {
	font-family: var(--banc-mfn-font-heading);
	font-weight: 600;
	font-size: 1.5em;
}

.banc-stock-ticker__change--up { color: var(--banc-mfn-color-positive); }
.banc-stock-ticker__change--down { color: var(--banc-mfn-color-negative); }

.banc-stock-ticker__meta {
	color: var(--banc-mfn-color-text-muted);
	font-size: 0.85em;
}

/* --- Composite tab groups (share info / insider) ------------------------- */
.banc-mfn-tabs {
	background: var(--banc-mfn-color-surface);
	border: var(--banc-mfn-border-width) solid var(--banc-mfn-color-border);
	border-radius: var(--banc-mfn-radius);
	padding: var(--banc-mfn-card-padding);
	font-family: var(--banc-mfn-font-body);
}

.banc-mfn-tabs__top { margin-bottom: var(--banc-mfn-gap); overflow-x: auto; }

.banc-mfn-tabs__nav {
	display: flex;
	gap: 12px;
	justify-content: center;
	flex-wrap: wrap;
	margin: 0 0 var(--banc-mfn-gap);
	padding: 0;
	list-style: none;
}

.banc-mfn-tabs__button {
	font-family: var(--banc-mfn-font-heading);
	font-weight: 600;
	font-size: 14px;
	padding: 10px 22px;
	border: 0;
	border-radius: var(--banc-mfn-radius-small);
	background: var(--banc-mfn-tab-bg);
	color: var(--banc-mfn-tab-text);
	cursor: pointer;
	transition: background 0.2s ease, color 0.2s ease;
}

.banc-mfn-tabs__button:hover { background: var(--banc-mfn-color-border); }

.banc-mfn-tabs__button.is-active {
	background: var(--banc-mfn-tab-active-bg);
	color: var(--banc-mfn-tab-active-text);
}

.banc-mfn-tabs__panel { overflow-x: auto; }
.banc-mfn-tabs__panel[hidden] { display: none; }

/* Nested widgets inside a tab card should not double the card chrome. */
.banc-mfn-tabs .banc-datablocks-widget {
	border: 0;
	padding: 0;
	border-radius: 0;
}

/* Small-print notes under the tab panels (e.g. insider transaction types). */
.banc-mfn-tabs__footer {
	margin-top: var(--banc-mfn-gap);
	color: var(--banc-mfn-color-text-muted);
	font-size: 12px;
}
.banc-mfn-tabs__footer p { margin: 0 0 0.75em; }
.banc-mfn-tabs__footer strong { color: var(--banc-mfn-color-text); }

/* --- Ownership structure (stacked owner-* widget cards) ------------------ */
.banc-mfn-owners__section + .banc-mfn-owners__section { margin-top: var(--banc-mfn-gap); }

/* --- KPI tab panel (text beside widget) ----------------------------------- */
.banc-mfn-kpi-tab {
	display: grid;
	grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
	gap: calc(var(--banc-mfn-gap) * 2);
	align-items: center;
}

.banc-mfn-kpi-tab__text > :first-child { margin-top: 0; }

/* Widget on the left, copy on the right (KWB-189). Placed on the grid rather
   than reordered with `order`, and the wider column travels with the widget so
   the chart keeps the room it needs whichever side it sits on. Source order is
   untouched: the copy is still read first, and still stacks first on mobile. */
.banc-mfn-kpi-tab--widget-first { grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); }
.banc-mfn-kpi-tab--widget-first .banc-mfn-kpi-tab__widget { grid-column: 1; grid-row: 1; }
.banc-mfn-kpi-tab--widget-first .banc-mfn-kpi-tab__text { grid-column: 2; grid-row: 1; }

@media ( max-width: 782px ) {
	.banc-mfn-kpi-tab { grid-template-columns: 1fr; }

	/* One column, so the placement above would stack both in the same cell.
	   Released back to auto-flow, which also leaves the theme's mobile
	   widget-first ordering to decide the order on its own. */
	.banc-mfn-kpi-tab--widget-first .banc-mfn-kpi-tab__widget,
	.banc-mfn-kpi-tab--widget-first .banc-mfn-kpi-tab__text { grid-column: auto; grid-row: auto; }
}

/* --- Stats band ----------------------------------------------------------- */
.banc-mfn-stats {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	gap: var(--banc-mfn-gap);
	background: var(--banc-mfn-color-surface);
	border: var(--banc-mfn-border-width) solid var(--banc-mfn-color-border);
	border-radius: var(--banc-mfn-radius);
	padding: calc(var(--banc-mfn-card-padding) * 1.5) var(--banc-mfn-card-padding);
	font-family: var(--banc-mfn-font-body);
	text-align: center;
}

.banc-mfn-stats__value {
	font-family: var(--banc-mfn-font-heading);
	font-weight: 600;
	font-size: 40px;
	line-height: 1.1;
	color: var(--banc-mfn-color-primary);
}

.banc-mfn-stats__label {
	margin-top: 6px;
	color: var(--banc-mfn-color-text-muted);
	font-size: 14px;
}

/* --- Buyback programmes (accordion + tables) ----------------------------- */
.repurchase-widget-container { width: 100%; padding: var(--banc-mfn-gap) 0; font-family: var(--banc-mfn-font-body); }

.repurchase-program-section {
	background: var(--banc-mfn-color-surface);
	border-radius: var(--banc-mfn-radius);
	margin-bottom: var(--banc-mfn-gap);
	box-shadow: var(--banc-mfn-shadow);
	overflow: hidden;
}

.repurchase-program-section .program-header {
	padding: 18px var(--banc-mfn-card-padding);
	background: var(--banc-mfn-color-primary);
	color: var(--banc-mfn-color-on-primary);
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	/* Header is a <button> for keyboard accessibility — undo UA styles. */
	width: 100%;
	border: 0;
	font: inherit;
	text-align: left;
}

.repurchase-program-section .program-header .toggle-arrow { transition: transform 0.2s ease; }
.repurchase-program-section .program-header.is-open .toggle-arrow,
.repurchase-program-section .program-header[aria-expanded="true"] .toggle-arrow { transform: rotate(180deg); }

.repurchase-program-section .program-header h3 {
	margin: 0;
	font-family: var(--banc-mfn-font-heading);
	font-weight: 600;
	font-size: 18px;
	color: inherit;
	flex: 1;
}

.repurchase-program-section.completed-program .program-header { opacity: 0.85; }

.program-status.active {
	background: var(--banc-mfn-color-positive);
	color: var(--banc-mfn-color-on-primary);
	padding: 3px 12px;
	border-radius: var(--banc-mfn-radius-pill);
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
}

.program-content { padding: var(--banc-mfn-card-padding); background: var(--banc-mfn-color-surface-alt); }

.program-description,
.program-dates {
	background: var(--banc-mfn-color-surface);
	padding: 12px var(--banc-mfn-gap);
	border-radius: var(--banc-mfn-radius-small);
	margin-bottom: var(--banc-mfn-gap);
	border-left: 4px solid var(--banc-mfn-color-primary);
}

.program-dates .date-label { font-weight: 600; color: var(--banc-mfn-color-primary); margin-right: 8px; }

.repurchase-table-content,
.repurchase-table-simple { background: var(--banc-mfn-color-surface); border-radius: var(--banc-mfn-radius-small); overflow-x: auto; }

/* Flat (non-accordion) layout: heading + intro text above each table, like
   the old Share information page. */
.repurchase-table-simple + .repurchase-table-simple { margin-top: calc(var(--banc-mfn-gap) * 2); }
.repurchase-table-simple .program-title {
	margin: 0 0 12px;
	font-family: var(--banc-mfn-font-heading);
	font-weight: 700;
	font-size: 20px;
	color: var(--banc-mfn-color-primary);
}
.repurchase-table-simple .program-description {
	background: none;
	border-left: 0;
	padding: 0;
	margin-bottom: var(--banc-mfn-gap);
}

/* Datablocks repurchase table skin */
.repurchase-table-content table,
.repurchase-table-simple table {
	width: 100%;
	border-collapse: collapse;
	font-size: 14px;
	border: none;
	border-radius: var(--banc-mfn-radius-small);
	overflow: hidden;
}

.repurchase-table-content th,
.repurchase-table-simple th {
	background: var(--banc-mfn-color-primary) !important;
	color: var(--banc-mfn-color-on-primary) !important;
	padding: 13px 12px;
	text-align: left;
	font-weight: 600;
	font-size: 13px;
	white-space: nowrap;
	border: none !important;
}

.repurchase-table-content td,
.repurchase-table-simple td { padding: 13px 12px; border: none; font-size: 14px; }

.repurchase-table-content tbody tr:nth-child(even),
.repurchase-table-simple tbody tr:nth-child(even) { background: var(--banc-mfn-color-surface-alt); }

.repurchase-table-content tbody tr:hover,
.repurchase-table-simple tbody tr:hover { background: var(--banc-mfn-color-primary); }

.repurchase-table-content tbody tr:hover td,
.repurchase-table-simple tbody tr:hover td { color: var(--banc-mfn-color-on-primary); }

/* --- Analyst consensus dashboard ----------------------------------------- */
.analysts-dashboard { width: 100%; margin: 0; padding: 0; font-family: var(--banc-mfn-font-body); }

.analysts-dashboard .dashboard-intro {
	margin-bottom: calc(var(--banc-mfn-gap) * 1.5);
	padding: var(--banc-mfn-gap);
	background: var(--banc-mfn-color-surface-alt);
	border-radius: var(--banc-mfn-radius-small);
	line-height: 1.6;
}

.analysts-dashboard .dashboard-intro p { margin: 0; font-size: 14px; color: var(--banc-mfn-color-text-muted); }

.analysts-dashboard .dashboard-section { margin-bottom: calc(var(--banc-mfn-gap) * 2); }

.analysts-dashboard .dashboard-section h3 {
	margin: 0 0 var(--banc-mfn-gap) 0;
	font-family: var(--banc-mfn-font-heading);
	font-weight: var(--banc-mfn-heading-weight);
	font-size: 24px;
	color: var(--banc-mfn-color-primary);
	padding: 10px 0;
}

.analysts-dashboard .widget-container {
	background: var(--banc-mfn-color-surface);
	border: var(--banc-mfn-border-width) solid var(--banc-mfn-color-border);
	border-radius: var(--banc-mfn-radius);
	padding: var(--banc-mfn-gap);
	margin-bottom: var(--banc-mfn-gap);
}

.analysts-dashboard .widget-container iframe { width: 100% !important; border: none !important; min-height: 300px; }

.analysts-dashboard .widget-container .banc-datablocks-widget { border: 0; padding: 0; border-radius: 0; }

.analysts-dashboard .two-column-layout,
.analysts-dashboard .three-column-layout { display: flex; gap: calc(var(--banc-mfn-gap) * 1.5); flex-wrap: wrap; }

.analysts-dashboard .three-column-layout { gap: var(--banc-mfn-gap); }

.analysts-dashboard .two-column-layout .column { flex: 1; min-width: 300px; }
.analysts-dashboard .three-column-layout .column { flex: 1; min-width: 250px; }

/* --- Responsive ----------------------------------------------------------- */
@media (max-width: 768px) {
	.analysts-dashboard .two-column-layout,
	.analysts-dashboard .three-column-layout { flex-direction: column; }

	.analysts-dashboard .two-column-layout .column,
	.analysts-dashboard .three-column-layout .column { min-width: 100%; }

	.analysts-dashboard .dashboard-section h3 { font-size: 20px; }

	.banc-mfn-tabs,
	.banc-datablocks-widget { padding: var(--banc-mfn-gap); }

	.banc-mfn-tabs__button { padding: 8px 14px; font-size: 13px; }
}

/* --- Datablocks widget internals — unified skin ---------------------------
   The raw widget HTML (mf-* tables, mfn-archive) ships nearly unstyled;
   this skin aligns every widget to the same token-driven design (modelled
   on the customised buyback/analyst styling from the old Kambi site). */

.banc-datablocks-widget table,
.banc-mfn-tabs table {
	width: 100%;
	border-collapse: collapse;
	font-size: 14px;
	border: none;
}

/* Table headers: primary-filled, spaced (mf-tbl-head covers headerless tables) */
.banc-datablocks-widget table thead th,
.banc-mfn-tabs table thead th,
.banc-datablocks-widget .mf-tbl-head,
.banc-mfn-tabs .mf-tbl-head {
	background: var(--banc-mfn-color-primary);
	color: var(--banc-mfn-color-on-primary);
	padding: 13px 14px;
	text-align: left;
	font-family: var(--banc-mfn-font-heading);
	font-weight: 600;
	font-size: 13px;
	white-space: nowrap;
	border: none;
}

.banc-datablocks-widget table thead th:first-child,
.banc-mfn-tabs table thead th:first-child { border-top-left-radius: var(--banc-mfn-radius-small); }

.banc-datablocks-widget table thead th:last-child,
.banc-mfn-tabs table thead th:last-child { border-top-right-radius: var(--banc-mfn-radius-small); }

.banc-datablocks-widget table td,
.banc-mfn-tabs table td {
	padding: 12px 14px;
	border: none;
	color: var(--banc-mfn-color-text);
	font-size: 14px;
}

/* Zebra + hover: data tables only (.mf-table), never the archive accordion */
.banc-datablocks-widget .mf-table tbody tr:nth-child(even) td,
.banc-mfn-tabs .mf-table tbody tr:nth-child(even) td { background: var(--banc-mfn-color-surface-alt); }

.banc-datablocks-widget .mf-table tbody tr:hover td,
.banc-mfn-tabs .mf-table tbody tr:hover td {
	background: var(--banc-mfn-color-primary);
	color: var(--banc-mfn-color-on-primary);
}

/* Positive / negative values (Datablocks marks cells with *-positive/-negative) */
.banc-datablocks-widget td[class*="-positive"],
.banc-mfn-tabs td[class*="-positive"] { color: var(--banc-mfn-color-positive); font-weight: 600; }

.banc-datablocks-widget td[class*="-negative"],
.banc-mfn-tabs td[class*="-negative"] { color: var(--banc-mfn-color-negative); font-weight: 600; }

.banc-datablocks-widget .mf-table tbody tr:hover td[class*="-positive"],
.banc-datablocks-widget .mf-table tbody tr:hover td[class*="-negative"],
.banc-mfn-tabs .mf-table tbody tr:hover td[class*="-positive"],
.banc-mfn-tabs .mf-table tbody tr:hover td[class*="-negative"] { color: var(--banc-mfn-color-on-primary); }

/* "Powered by Modular Finance" footer */
.banc-datablocks-widget .mf-powered-by,
.banc-mfn-tabs .mf-powered-by {
	display: block;
	text-align: right;
	margin-top: 8px;
	font-size: 11px;
	color: var(--banc-mfn-color-text-muted);
}

/* --- Reports archive accordion (mfn-archive) ------------------------------ */
.banc-datablocks-widget .mfn-archive-header {
	/* Background lives on the td ONLY (clipped to padding-box): some engines
	   paint a row background behind the cells' transparent border areas,
	   which would fill the year-gap with navy. */
	background: transparent !important;
	color: var(--banc-mfn-color-on-primary) !important;
	cursor: pointer;
	/* Some themes fade collapsed rows (opacity .7) which washes the brand
	   navy to slate — collapsed state is already signalled by the arrow. */
	opacity: 1 !important;
}

.banc-datablocks-widget .mfn-archive-header td {
	/* !important beats theme table-striping rules that paint td over the tr background. */
	background: var(--banc-mfn-color-primary) !important;
	padding: 14px 16px;
	color: var(--banc-mfn-color-on-primary) !important;
	border-radius: var(--banc-mfn-radius-small);
}

.banc-datablocks-widget .mfn-archive-header span {
	color: inherit !important;
	font-family: var(--banc-mfn-font-heading);
	font-size: 16px !important;
	font-weight: 600 !important;
}

.banc-datablocks-widget .mfn-archive-header:hover { filter: brightness(1.15); }

.banc-datablocks-widget .mfn-year-arrow {
	transition: transform 0.2s ease;
	display: inline-block;
	/* Rotation happens around the glyph centre — without spacing the opened
	   (rotated) arrow touches the year text. */
	margin-inline-end: 10px;
	transform-origin: center;
}

.banc-datablocks-widget .mfn-archive-header-item-type {
	color: var(--banc-mfn-color-primary);
	font-family: var(--banc-mfn-font-heading);
	font-weight: 600;
	font-size: 13px;
}

.banc-datablocks-widget .mfn-archive-event-heading { color: var(--banc-mfn-color-primary); font-weight: 600; }
.banc-datablocks-widget .mfn-archive-event-title { color: var(--banc-mfn-color-text); font-weight: 600; }
.banc-datablocks-widget .mfn-archive-event-date { color: var(--banc-mfn-color-text-muted) !important; font-size: 12px; }

.banc-datablocks-widget td.mfn-archive-item a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 8px;
	border-radius: var(--banc-mfn-radius-small);
	transition: background 0.2s ease;
}

.banc-datablocks-widget td.mfn-archive-item a:hover { background: var(--banc-mfn-color-surface-alt); }

.banc-datablocks-widget .mfn-archive-year > tr:not(.mfn-archive-header):nth-child(even) td { background: none; }

/* --- Widget wrappers shipping inline width:fit-content ------------------- */
/* (insider positions, stock calculator) — span the parent instead.
   !important in an author sheet beats non-important inline styles. */
.banc-datablocks-widget .mf-widget,
.banc-mfn-tabs .mf-widget { width: 100% !important; }

/* --- Stock calculator (Performance tab) ----------------------------------- */
.banc-datablocks-widget .mf-stock-calculator h2,
.banc-mfn-tabs .mf-stock-calculator h2 {
	font-family: var(--banc-mfn-font-heading);
	font-weight: 600;
	font-size: 18px;
	color: var(--banc-mfn-color-primary);
	margin: 0 0 6px;
	padding: 0;
}

.banc-datablocks-widget .mf-stock-calculator p,
.banc-mfn-tabs .mf-stock-calculator p {
	color: var(--banc-mfn-color-text-muted);
	font-size: 14px;
	margin: 0 0 12px;
}

/* Section rhythm: Period / Initial Investment blocks */
.banc-datablocks-widget .mf_date-range,
.banc-datablocks-widget .mf_number-of-shares,
.banc-mfn-tabs .mf_date-range,
.banc-mfn-tabs .mf_number-of-shares {
	padding-block: var(--banc-mfn-gap);
	border-top: 1px solid var(--banc-mfn-color-surface-alt);
}

.banc-datablocks-widget .mf_date-range:first-child,
.banc-mfn-tabs .mf_date-range:first-child { border-top: 0; padding-block-start: 0; }

.banc-datablocks-widget .mf_input-wrapper,
.banc-mfn-tabs .mf_input-wrapper {
	display: inline-flex;
	flex-direction: column;
	gap: 4px;
	margin: 0 16px 8px 0;
}

.banc-datablocks-widget .mf-stock-calculator label,
.banc-mfn-tabs .mf-stock-calculator label {
	font-family: var(--banc-mfn-font-heading);
	font-weight: 600;
	font-size: 13px;
	color: var(--banc-mfn-color-text);
}

.banc-datablocks-widget .mf-stock-calculator input[type="text"],
.banc-mfn-tabs .mf-stock-calculator input[type="text"] {
	font-family: var(--banc-mfn-font-body);
	font-size: 14px;
	color: var(--banc-mfn-color-text);
	background: var(--banc-mfn-color-surface);
	border: 1px solid var(--banc-mfn-color-border);
	border-radius: var(--banc-mfn-radius-small);
	padding: 10px 12px;
	min-width: 200px;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.banc-datablocks-widget .mf-stock-calculator input[type="text"]:focus,
.banc-mfn-tabs .mf-stock-calculator input[type="text"]:focus {
	outline: none;
	border-color: var(--banc-mfn-color-primary);
	box-shadow: 0 0 0 2px color-mix(in srgb, var(--banc-mfn-color-primary) 20%, transparent);
}

/* --- Archive: breathing room between year groups -------------------------- */
/* Margins have no effect on table-row/row-group boxes, so change the display
   model: the outer table becomes a block and each year tbody becomes its own
   display:table box — a real block-level participant that accepts margins.
   Rows/cells inside each tbody keep normal table layout. */
.banc-datablocks-widget--archive table { display: block; }

.banc-datablocks-widget--archive tbody.mfn-archive-year {
	display: table;
	width: 100%;
	border-collapse: collapse;
	margin-bottom: 12px;
	border-radius: var(--banc-mfn-radius-small);
	overflow: hidden;
}

.banc-datablocks-widget--archive tbody.mfn-archive-year:last-child { margin-bottom: 0; }

/* --- Stock card (hero layout) --------------------------------------------- */
/* Token-driven; for the dark hero placement override tokens on the wrapper:
   .hero .banc-stock-card { --banc-mfn-card-bg: rgba(0,0,0,.55); --banc-mfn-color-text: #fff; } */
.banc-stock-card {
	--banc-mfn-card-bg: var(--banc-mfn-color-surface);
	display: inline-block;
	min-width: 320px;
	max-width: 100%;
	background: var(--banc-mfn-card-bg);
	border: var(--banc-mfn-border-width) solid var(--banc-mfn-color-border);
	border-radius: var(--banc-mfn-radius);
	padding: var(--banc-mfn-card-padding);
	font-family: var(--banc-mfn-font-body);
	color: var(--banc-mfn-color-text);
}

.banc-stock-card__header { display: flex; flex-direction: column; gap: 2px; margin-bottom: 14px; }

.banc-stock-card__symbol {
	font-family: var(--banc-mfn-font-heading);
	font-weight: 700;
	font-size: 28px;
	line-height: 1.1;
}

.banc-stock-card__company { font-size: 14px; color: var(--banc-mfn-color-text-muted); text-transform: uppercase; letter-spacing: 0.04em; }
.banc-stock-card__exchange::before { content: "· "; }

.banc-stock-card__price-row { display: flex; align-items: baseline; gap: 12px; }

.banc-stock-card__price {
	font-family: var(--banc-mfn-font-heading);
	font-weight: 700;
	font-size: 40px;
	line-height: 1;
}

.banc-stock-card__currency { font-size: 0.35em; font-weight: 600; margin-left: 2px; letter-spacing: 0.05em; }

.banc-stock-card__change { font-size: 18px; font-weight: 600; }
.banc-stock-card__change--up { color: var(--banc-mfn-color-positive); }
.banc-stock-card__change--down { color: var(--banc-mfn-color-negative); }

.banc-stock-card__meta { margin-top: 6px; font-size: 12px; color: var(--banc-mfn-color-text-muted); text-transform: uppercase; letter-spacing: 0.04em; }

.banc-stock-card__stats { display: flex; flex-wrap: wrap; gap: var(--banc-mfn-gap) calc(var(--banc-mfn-gap) * 1.6); margin-top: var(--banc-mfn-gap); }

.banc-stock-card__stat { display: flex; flex-direction: column; gap: 2px; }
.banc-stock-card__stat-value { font-size: 17px; font-weight: 600; }
.banc-stock-card__stat-label { font-size: 11px; color: var(--banc-mfn-color-text-muted); text-transform: uppercase; letter-spacing: 0.05em; }