/* Bootstrap 5 CSS variables – aligned with _variables.scss and theme_data.py */
:root {
	/* Named colors */
	--bs-blue: #0d6efd;
	--bs-indigo: #6610f2;
	--bs-purple: #6f42c1;
	--bs-pink: #d63384;
	--bs-red: #dc3545;
	--bs-orange: #fd7e14;
	--bs-yellow: #ffc107;
	--bs-green: #198754;
	--bs-teal: #20c997;
	--bs-cyan: #0dcaf0;
	--bs-black: #000;
	--bs-white: #fff;
	--bs-gray: #6c757d;
	--bs-gray-dark: #343a40;
	/* Gray scale – from _variables.scss where defined */
	--bs-gray-100: #dfe0ea;
	--bs-gray-200: #e9ecef;
	--bs-gray-300: #b7b8ce;
	--bs-gray-400: #ced4da;
	--bs-gray-500: #adb5bd;
	--bs-gray-600: #80818e;
	--bs-gray-700: #495057;
	--bs-gray-800: #3e3f44;
	--bs-gray-900: #212529;
	/* Theme colors – from _variables.scss */
	--bs-primary: #282bcf;
	--bs-secondary: #2c68ff;
	--bs-success: #198754;
	--bs-info: #dfe0ea;
	--bs-warning: #ffc107;
	--bs-danger: #dc3545;
	--bs-light: #dfe0ea;
	--bs-dark: #3e3f44;
	/* RGB variants for rgba() usage */
	--bs-primary-rgb: 40, 43, 207;
	--bs-secondary-rgb: 44, 104, 255;
	--bs-success-rgb: 25, 135, 84;
	--bs-info-rgb: 223, 224, 234;
	--bs-warning-rgb: 255, 193, 7;
	--bs-danger-rgb: 220, 53, 69;
	--bs-light-rgb: 223, 224, 234;
	--bs-dark-rgb: 62, 63, 68;
	--bs-white-rgb: 255, 255, 255;
	--bs-black-rgb: 0, 0, 0;
	/* Text emphasis – darker shades for text on light bg */
	--bs-primary-text-emphasis: #1a1d84;
	--bs-secondary-text-emphasis: #1a3d99;
	--bs-success-text-emphasis: #0a3622;
	--bs-info-text-emphasis: #8b8d95;
	--bs-warning-text-emphasis: #664d03;
	--bs-danger-text-emphasis: #58151c;
	--bs-light-text-emphasis: #495057;
	--bs-dark-text-emphasis: #495057;
	/* Subtle backgrounds */
	--bs-primary-bg-subtle: #d4d5f5;
	--bs-secondary-bg-subtle: #d6e0ff;
	--bs-success-bg-subtle: #d1e7dd;
	--bs-info-bg-subtle: #f4f4f7;
	--bs-warning-bg-subtle: #fff3cd;
	--bs-danger-bg-subtle: #f8d7da;
	--bs-light-bg-subtle: #fcfcfd;
	--bs-dark-bg-subtle: #ced4da;
	/* Subtle borders */
	--bs-primary-border-subtle: #a9abf0;
	--bs-secondary-border-subtle: #adc2ff;
	--bs-success-border-subtle: #a3cfbb;
	--bs-info-border-subtle: #e8e9ed;
	--bs-warning-border-subtle: #ffe69c;
	--bs-danger-border-subtle: #f1aeb5;
	--bs-light-border-subtle: #e9ecef;
	--bs-dark-border-subtle: #adb5bd;
	/* Body, emphasis, links */
	--bs-body-color: #212529;
	--bs-body-color-rgb: 33, 37, 41;
	--bs-body-bg: #fff;
	--bs-body-bg-rgb: 255, 255, 255;
	--bs-emphasis-color: #000;
	--bs-emphasis-color-rgb: 0, 0, 0;
	--bs-secondary-color: rgba(33, 37, 41, 0.75);
	--bs-secondary-color-rgb: 33, 37, 41;
	--bs-secondary-bg: #e9ecef;
	--bs-secondary-bg-rgb: 233, 236, 239;
	--bs-tertiary-color: rgba(33, 37, 41, 0.5);
	--bs-tertiary-color-rgb: 33, 37, 41;
	--bs-tertiary-bg: #f8f9fa;
	--bs-tertiary-bg-rgb: 248, 249, 250;
	--bs-heading-color: inherit;
	--bs-link-color: #282bcf;
	--bs-link-color-rgb: 40, 43, 207;
	--bs-link-decoration: underline;
	--bs-link-hover-color: #1f22a3;
	--bs-link-hover-color-rgb: 31, 34, 163;
	--bs-code-color: #d63384;
	--bs-highlight-color: #212529;
	--bs-highlight-bg: #fff3cd;
	/* Borders, radius, shadows – from _variables.scss */
	--bs-border-width: 1px;
	--bs-border-style: solid;
	--bs-border-color: #dee2e6;
	--bs-border-color-translucent: rgba(0, 0, 0, 0.175);
	--bs-border-radius: 0.375rem;
	--bs-border-radius-sm: 0.25rem;
	--bs-border-radius-lg: 0.4rem;
	--bs-border-radius-xl: 1rem;
	--bs-border-radius-xxl: 2rem;
	--bs-border-radius-2xl: var(--bs-border-radius-xxl);
	--bs-border-radius-pill: 50rem;
	--bs-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
	--bs-box-shadow-sm: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
	--bs-box-shadow-lg: 0 1rem 3rem rgba(0, 0, 0, 0.175);
	--bs-box-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, 0.075);
	/* Forms */
	--bs-form-valid-color: #198754;
	--bs-form-valid-border-color: #198754;
	--bs-form-invalid-color: #dc3545;
	--bs-form-invalid-border-color: #dc3545;
	/* Focus ring */
	--bs-focus-ring-width: 0.25rem;
	--bs-focus-ring-opacity: 0.25;
	--bs-focus-ring-color: rgba(40, 43, 207, 0.25);
	/* Fonts – from _variables.scss */
	--bs-font-sans-serif: "Roboto", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
	--bs-font-monospace: "PT Mono", SFMono-Regular, Menlo, Monaco, Consolas, monospace;
	--bs-body-font-family: var(--bs-font-sans-serif);
	--bs-body-font-size: 1rem;
	--bs-body-font-weight: 400;
	--bs-body-line-height: 1.5;
	--bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
}

/* Ensures page content fills the Loading area so the loading overlay/spinner is full-height and centered (e.g. challenge_leaderboard, bpm_scorecard). */
.page-content-wrapper {
	min-height: 0;
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	overflow-y: auto;
}

.footer-text {
    font-size: .9rem;
    font-weight:normal;
    color:white;
}


.tab-label {
    font-size:1.1rem;
    font-weight:bold !important;
}

/* Overview trend tabs: compact styling */
.overview-trend-tabs .nav-link {
    font-size: 0.875rem;
    padding: 0.35rem 0.75rem;
}

.tab-label-active {
    size:1.1rem;
    font-weight: bold !important;
}

/* Hide MapLibre attribution */
.mapboxgl-ctrl-attrib,
.leaflet-control-attribution,
.maplibregl-ctrl-attrib {
    display: none !important;
}
.maplibregl-ctrl-attrib {
    opacity: 0 !important;
    pointer-events: none !important;
}
/* BOOTSTRAP 5 STACK & GAP SHIMS FOR BOOTSTRAP 4 THEMES */
.hstack { display: flex; flex-direction: row; align-items: center; align-self: stretch; }
.vstack { display: flex; flex: 1 1 auto; flex-direction: column; align-self: stretch; }
.gap-0 { gap: 0 !important; }
.gap-1 { gap: 0.25rem !important; }
.gap-2 { gap: 0.5rem !important; }
.gap-3 { gap: 1rem !important; }
.gap-4 { gap: 1.5rem !important; }
.gap-5 { gap: 3rem !important; }

/* Bootstrap 5 utility shims (B4 build has different/absent class names) */
.flex-column { flex-direction: column !important; }
.flex-wrap { flex-wrap: wrap !important; }
@media (min-width: 768px) {
	.flex-md-row { flex-direction: row !important; }
}
.fw-bold { font-weight: 700 !important; }
.fs-5 { font-size: 1.25rem !important; }
.ms-auto { margin-left: auto !important; }
.ms-1 { margin-left: 0.25rem !important; }
.ms-3 { margin-left: 1rem !important; }
.me-1 { margin-right: 0.25rem !important; }
.me-3 { margin-right: 1rem !important; }
.border-end { border-right: 1px solid rgba(0, 0, 0, 0.1) !important; }

/* B5 border width utilities (B4 lacks border-1 … border-5) */
.border-0 { border-width: 0 !important; }
.border-1 { border-width: 1px !important; }
.border-2 { border-width: 2px !important; }
.border-3 { border-width: 3px !important; }
.border-4 { border-width: 4px !important; }
.border-5 { border-width: 5px !important; }

/* B5 bg-opacity shim: B4 lacks --bs-bg-opacity; override common bg-* when paired with bg-opacity-50 */
.bg-success.bg-opacity-50 { background-color: rgba(40, 167, 69, 0.5) !important; }
.bg-primary.bg-opacity-50 { background-color: rgba(40, 43, 207, 0.5) !important; }
.bg-warning.bg-opacity-50 { background-color: rgba(255, 193, 7, 0.5) !important; }
.bg-danger.bg-opacity-50 { background-color: rgba(220, 53, 69, 0.5) !important; }
.bg-info.bg-opacity-50 { background-color: rgba(23, 162, 184, 0.5) !important; }

/* Hoverable Sidebar CSS */
.hover-sidebar {
	width: 64px;
	overflow-x: hidden;
	white-space: nowrap;
	z-index: 1050;
	background-color: #ffffff;
	backdrop-filter: blur(10px);
	border-right: 1px solid rgba(0, 0, 0, 0.06);
	transition:
		width 0.32s cubic-bezier(0.22, 0.61, 0.36, 1),
		box-shadow 0.26s ease,
		background-color 0.26s ease,
		border-color 0.26s ease;
}
.hover-sidebar:hover {
	width: 260px;
	box-shadow: 0 18px 40px rgba(15, 23, 42, 0.18);
	border-color: rgba(15, 23, 42, 0.08);
}

/* Sidebar header/logo – align with nav icons */
.hover-sidebar .sidebar-header {
	padding: 0.6rem 0.95rem;
}
.hover-sidebar .sidebar-logo {
	width: 22px;
	height: 22px;
	flex-shrink: 0;
	object-fit: contain;
}

/* Sidebar header title – hide when collapsed, slide/fade in on hover */
.hover-sidebar .sidebar-title {
	opacity: 0;
	transform: translateX(-8px);
	text-wrap: wrap;
	white-space: nowrap;
	max-width: 0;
	margin-left: 0;
	overflow: hidden;
	transition:
		opacity 0.24s ease,
		transform 0.24s ease,
		max-width 0.24s ease,
		margin 0.24s ease;
}
.hover-sidebar:hover .sidebar-title {
	opacity: 1;
	transform: translateX(0);
	text-wrap: wrap;
	max-width: 220px;
	margin-left: 10px;
}

/* Floating bug-report help button: subdued, fully visible (no clipping) */
.bug-report-help-container {
	position: fixed;
	right: 1.5rem;
	bottom: 1.5rem; /* fully in view, never negative */
	z-index: 1080;
}

.bug-report-help-button {
	width: 2.5rem;
	height: 2.5rem;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.125rem;
	padding: 0;
	/* Subdued: light fill and border so it doesn't compete with content */
	background-color: var(--bs-body-bg) !important;
	border: 1px solid var(--bs-border-color) !important;
	color: var(--bs-gray-600) !important;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
	transition: box-shadow 0.2s ease, transform 0.2s ease, background-color 0.2s ease, border-color 0.2s ease;
}

.bug-report-help-button:hover {
	background-color: var(--bs-gray-100) !important;
	border-color: var(--bs-gray-400) !important;
	color: var(--bs-gray-700) !important;
	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
	transform: scale(1.05);
}

@media (max-width: 576px) {
	.bug-report-help-container {
		right: 1rem;
		bottom: 1.25rem;
	}
}

/* Nav links + labels – modern hover + slide-in for text */
.hover-sidebar .nav-link {
	display: flex;
	align-items: center;
	border-radius: 0.75rem;
	padding: 0.6rem 0.95rem;
	color: #495057;
	margin: 0.1rem 0.6rem;
	transition:
		background-color 0.18s ease,
		color 0.18s ease,
		padding 0.18s ease,
		transform 0.16s ease;
}
.hover-sidebar .nav-link:hover {
	background-color: #f1f5f9;
	transform: translateX(2px);
}
.hover-sidebar .nav-link.active {
	background: linear-gradient(135deg, var(--bs-primary) 0%, #6366f1 90%);
	color: #ffffff !important;
}

.hover-sidebar .nav-link span {
	opacity: 0;
	transform: translateX(-8px);
	max-width: 0;
	margin-left: 0;
	overflow: hidden;
	font-weight: 500;
	transition:
		opacity 0.24s ease,
		transform 0.24s ease,
		max-width 0.24s ease,
		margin 0.24s ease;
}
.hover-sidebar:hover .nav-link span {
	opacity: 1;
	transform: translateX(0);
	max-width: 180px;
	margin-left: 10px;
}

.hover-sidebar .nav-icon {
	width: 22px;
	text-align: center;
	font-size: 1.2rem;
	flex-shrink: 0;
}

/* Navbar: title bar with primary, context, secondary */
.navbar-bar {
	display: flex !important;
	flex-direction: row;
	align-items: center;
	flex-wrap: nowrap;
	padding-left: 1.25rem;
	padding-right: 1.25rem;
	padding-top: 0.75rem;
	padding-bottom: 0.75rem;
	min-height: 60px;
}
.navbar-title-area {
	display: flex !important;
	align-items: center;
	flex: 1;
	min-width: 0;
	visibility: visible;
	overflow: visible;
}
.navbar-title-stack {
	display: flex !important;
	flex-direction: column;
	align-items: flex-start;
	min-width: 0;
	overflow: hidden;
	gap: 0;
}
.navbar-title-primary {
	font-size: 1.25rem;
	font-weight: 700;
	color: #1f2933;
	line-height: 1.3;
}
.navbar-title-context {
	font-size: 0.75rem;
	font-weight: 500;
	line-height: 1.2;
}
.navbar-title-secondary {
	font-size: 0.875rem;
	line-height: 1.2;
}
.navbar-extras {
	display: flex;
	align-items: center;
}
/* Rep scorecard controls in navbar: compact so they don't dominate */
.navbar-rep-controls .rep-month-selector-dropdown {
	font-size: 0.9rem !important;
	min-width: 10rem !important;
}
.navbar-rep-controls .btn {
	font-size: 0.875rem;
	padding: 0.35rem 0.75rem;
	min-height: 36px;
	height: auto;
}
.navbar-divider {
	height: 24px;
	opacity: 0.5;
}
@media (max-width: 767.98px) {
	.navbar-title-primary {
		font-size: 1rem;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}
	.navbar-title-secondary {
		display: none;
	}
	.rep-month-selector-dropdown {
		min-width: 0 !important;
	}
	.rep-scorecard-business-card img,
	.rep-scorecard-business-card .bi-person-circle {
		max-height: 120px !important;
		object-fit: cover;
	}
	.rep-scorecard-business-card .card {
		min-width: 0;
	}
}

/* Entity selector modal: taller dropdown menu and modal body */
.entity-selector-modal .modal-dialog {
	max-width: 75vw;
}
.entity-selector-modal .modal-body {
	min-height: 50vh;
}

/* Taller dropdown options list - menu is portaled to body; scope by modal open */
body:has(#rep-selector-modal.show) [class*="MenuList"],
body:has(#bpms-selector-modal.show) [class*="MenuList"],
body:has(#rep-selector-modal.show) .Select-menu-outer,
body:has(#bpms-selector-modal.show) .Select-menu-outer {
	max-height: 400px !important;
}

/* Data cells: monospace for numbers/values */
.gen-table-cell {
	font-variant-numeric: tabular-nums;
	font-family: ui-monospace, 'SF Mono', 'Cascadia Code', 'Consolas', monospace;
}

/* Overview page: scroll indicator bar */
.overview-page-layout {
	display: flex;
	flex-direction: row;
	position: relative;
	align-items: flex-start;
	width: 100%;
	gap: 0;
}
.overview-page-layout #overview-scroll-container {
	flex: 1;
	min-width: 0;
	max-height: 80vh;
	overflow-y: auto;
}
.overview-scroll-indicator {
	position: sticky;
	top: 1rem;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.5rem;
	padding: 0.75rem 0.5rem;
	margin-left: 1rem;
	flex-shrink: 0;
}
.overview-scroll-indicator .overview-indicator-badge {
	display: block;
	width: 100%;
	min-width: 4rem;
	padding: 0.35rem 0.6rem;
	font-size: 1rem;
	font-weight: bold;
	border: 1px solid var(--bs-border-color);
	border-radius: 0.5rem;
	background: var(--bs-light, #f8f9fa);
	color: var(--bs-secondary, #6c757d);
	opacity: 0.75;
	transform: scale(0.9);
	cursor: pointer;
	transition: opacity 0.2s ease, transform 0.2s ease, color 0.2s ease, background-color 0.2s ease;
	text-align: center;
}
.overview-scroll-indicator .overview-indicator-badge:hover {
	opacity: .9;
}
.overview-scroll-indicator.overview-indicator-active-0 .overview-indicator-badge:nth-child(1),
.overview-scroll-indicator.overview-indicator-active-1 .overview-indicator-badge:nth-child(2),
.overview-scroll-indicator.overview-indicator-active-2 .overview-indicator-badge:nth-child(3),
.overview-scroll-indicator.overview-indicator-active-3 .overview-indicator-badge:nth-child(4),
.overview-scroll-indicator.overview-indicator-active-4 .overview-indicator-badge:nth-child(5),
.overview-scroll-indicator.overview-indicator-active-5 .overview-indicator-badge:nth-child(6),
.overview-scroll-indicator.overview-indicator-active-6 .overview-indicator-badge:nth-child(7) {
	opacity: 1;
	transform: scale(1.1);
	background: var(--bs-primary);
	color: white;
	border-color: var(--bs-primary);
}

/* Shared clickable card (link_card in ui_kit): hover lift + shadow for Overview and Brand Service Changes */
a.clickable-card {
	transition: transform 0.2s ease;
}
a.clickable-card:hover {
	transform: translateY(-3px);
}
a.clickable-card .card {
	transition: box-shadow 0.2s ease;
}
a.clickable-card:hover .card {
	box-shadow: 0 14px 32px rgba(0, 0, 0, 0.12);
}

/* Shared scroll hint for card headers with scrollable content (e.g. Brand Service Changes timeline) */
.scroll-hint-subtitle {
	font-size: 0.875rem;
	font-weight: 400;
	color: var(--bs-secondary);
}

/* Edge fade for horizontal scroll: implies more content without literal text.
   Fade must be on a wrapper (not the scrolling element) so ::before/::after stay
   fixed to the viewport frame; if applied to the overflow element they scroll with content. */
.scroll-fade-edges {
	position: relative;
	overflow: visible;
	width: 100%;
}
.scroll-fade-edges::before,
.scroll-fade-edges::after {
	content: '';
	position: absolute;
	top: 0;
	bottom: 8px;
	width: 24px;
	pointer-events: none;
	z-index: 1;
}
.scroll-fade-edges::before {
	left: 0;
	background: linear-gradient(to right, var(--bs-light), transparent);
}
.scroll-fade-edges::after {
	right: 0;
	background: linear-gradient(to left, var(--bs-light), transparent);
}

/* Finance page: let react-select menus escape cards (dropdowns were clipped). */
.finance-page {
	overflow: visible;
}
.finance-page .finance-card,
.finance-page .finance-builder-layer,
.finance-page .finance-card-body,
.finance-page .finance-builder-card-header,
.finance-page .finance-results-block,
.finance-page .finance-filters-editor,
.finance-page .finance-filter-card .card-body,
.finance-page .finance-console-card,
.finance-page .finance-console-sidebar,
.finance-page .finance-main-inner,
.finance-page .finance-console-row,
.finance-page .finance-sql-console-card,
.finance-page .finance-main-loading,
.finance-page .finance-main-loading > div {
	overflow: visible;
}
.finance-page .finance-filter-card {
	overflow: visible;
	max-width: 52rem;
}
/* Dash dcc.Dropdown (react-select) menu portal / legacy menu */
.finance-page .Select-menu-outer,
.finance-page div[class*='-menu'] {
	z-index: 10050 !important;
}
.finance-filters-stack {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
}
.finance-filters-editor {
	max-width: 52rem;
}
.finance-filter-label {
	font-size: 0.7rem;
	line-height: 1.2;
}
.finance-filter-remove {
	min-width: 2rem;
}
.finance-info-bar-chips {
	max-width: min(100%, 28rem);
}
.finance-filter-chip-badge {
	font-size: 0.7rem !important;
	font-weight: 500;
	padding: 0.25em 0.55em !important;
}
/* Clickable filter summary in info bar (removes rule on click) */
.finance-filter-chip-btn {
	font-size: 0.7rem !important;
	font-weight: 500;
	padding: 0.25em 0.65em !important;
	line-height: 1.25 !important;
	border-radius: 50rem !important;
	font-family: var(--bs-font-monospace), ui-monospace, monospace;
	white-space: normal;
	text-align: start;
	max-width: 100%;
}
.finance-builder-card-title {
	font-size: 1rem;
	letter-spacing: -0.01em;
}
.finance-builder-card-header .finance-ai-toggle {
	white-space: nowrap;
}

/* Finance page: type scale (title vs body vs AI disclosure) */
.finance-page .finance-page-title {
	font-size: clamp(1.35rem, 2.5vw, 1.6rem);
	font-weight: 600;
	line-height: 1.25;
}
.finance-page .finance-page-lead {
	font-size: 0.9375rem;
	line-height: 1.45;
	max-width: 42rem;
}

/* AI query: collapsed by default; link-style entry */
.finance-ai-disclosure {
	margin-bottom: 0.25rem;
}
/* Builder: presets + AI on first row (AI right-aligned) */
.finance-builder-start.finance-ai-disclosure {
	margin-bottom: 0;
}
.finance-builder-start-row {
	min-width: 0;
}
.finance-ai-toggle {
	font-size: 0.8125rem;
	font-weight: 500;
	line-height: 1.4;
	color: var(--bs-secondary) !important;
}
.finance-ai-toggle:hover,
.finance-ai-toggle:focus {
	color: var(--bs-primary) !important;
}
.finance-ai-toggle-icon {
	font-size: 0.875rem;
	margin-right: 0.35rem;
	vertical-align: -0.05em;
	opacity: 0.85;
}
.finance-ai-toggle-text {
	font-size: 0.8125rem;
}
.finance-ai-chevron {
	font-size: 0.65rem;
	opacity: 0.7;
	transition: transform 0.2s ease;
	vertical-align: 0.1em;
}
.finance-ai-disclosure:has(.collapse.show) .finance-ai-chevron {
	transform: rotate(-180deg);
}
.finance-ai-instructions {
	font-size: 0.8125rem;
	line-height: 1.5;
	max-width: 36rem;
}
.finance-ai-field-label {
	font-size: 0.75rem;
	font-weight: 500;
	margin-bottom: 0.25rem;
}
.finance-ai-textarea {
	font-size: 0.875rem;
	line-height: 1.45;
}
.finance-ai-thread {
	max-height: 200px;
	overflow-y: auto;
	font-size: 0.8125rem;
	line-height: 1.45;
}
.finance-ai-msg {
	padding: 0.35rem 0.5rem;
	margin-bottom: 0.35rem;
	border-radius: 0.25rem;
	max-width: min(100%, 34rem);
}
.finance-ai-msg-user {
	margin-left: auto;
	background: rgba(var(--bs-primary-rgb, 40, 43, 207), 0.08);
	border-left: 2px solid var(--bs-primary);
}
.finance-ai-msg-asst {
	background: var(--bs-light, #f8f9fa);
	border-left: 2px solid rgba(0, 0, 0, 0.12);
}
.finance-ai-msg-success {
	border-left-color: var(--bs-success);
}
.finance-ai-success-icon {
	color: var(--bs-success);
	font-size: 0.95rem;
	flex-shrink: 0;
	margin-top: 0.1rem;
}

/*
 * Stacking (root cause of misplaced clicks):
 * — Siblings paint in DOM order; later siblings cover earlier ones. The results block
 *   (toolbar + AG Grid) follows the Builder card, so it was covering Builder dropdowns.
 * — Fix: Builder forms one stacking layer above the whole results block (z-index 1 vs 0).
 * — Inside results only, toolbar + filter editor stay above the grid (1 vs 0) without
 *   competing with Builder (those values are scoped under .finance-results-layer).
 */
.finance-builder-layer {
	position: relative;
	z-index: 1;
}
.finance-page .finance-sql-console-card {
	position: relative;
	z-index: 1;
}
/* Builder below SQL card in DOM but must paint above raw-details + results for dropdown menus */
.finance-page .finance-builder-layer {
	z-index: 2;
}
.finance-page .finance-raw-details {
	position: relative;
	z-index: 0;
}
.finance-results-layer {
	position: relative;
	z-index: 0;
}
.finance-above-grid {
	position: relative;
	z-index: 1;
}
.finance-grid-mount {
	position: relative;
	z-index: 0;
}
.finance-info-bar-row {
	width: 100%;
}
.finance-info-bar-text {
	line-height: 1.4;
}
.finance-info-k {
	font-weight: 500;
	color: var(--bs-body-color);
	margin-right: 0.15rem;
}
.finance-info-v {
	font-weight: 400;
}
.finance-preset-chip {
	font-size: 0.8125rem !important;
	font-weight: 500;
}