html {
	font-size: 14px;
}

@media (min-width: 768px) {
	html {
		font-size: 16px;
	}
}

.bg-gray-lightest {
	background-color: #f8f9fa !important;
}

.cursor-pointer {
	cursor: pointer;
}

.top-color {
	border-top: 2px solid rgba(56, 92, 180, 1) !important;
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
	box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

.form-check {
}

html {
	position: relative;
	min-height: 100%;
}

body {
	margin-bottom: 60px;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
	color: var(--bs-secondary-color);
	text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
	text-align: start;
}

/* ===================================================================
   3D WEALTH BRAND THEME - BOOTSTRAP 5.3 OVERRIDES
   =================================================================== */
:root {
	/* ===== PRIMARY BRAND COLOR: #4580AD (Blue) ===== */
	--bs-primary: #4580AD;
	--bs-primary-rgb: 69, 128, 173;
	--primary-color: #4580AD;
	/* ===== SECONDARY BRAND COLOR: #A0C3E5 (Light Blue) ===== */
	--bs-secondary: #A0C3E5;
	--bs-secondary-rgb: 160, 195, 229;
	--secondary-color: #A0C3E5;
	/* Primary Variations */
	--bs-primary-bg-subtle: #d4e4f1;
	--bs-primary-border-subtle: #a8c9df;
	--bs-primary-text-emphasis: #2f5977;
	/* Secondary Variations */
	--bs-secondary-bg-subtle: #e8f1f8;
	--bs-secondary-border-subtle: #c4d9ec;
	--bs-secondary-text-emphasis: #6fa0cc;
	/*primary navy*/
	--bs-primary-navy-rgb: 26, 42, 76;
	--bs-primary-navy: #1A2A4C;
	/* Link Colors */
	--bs-link-color: #4580AD;
	--bs-link-color-rgb: 69, 128, 173;
	--bs-link-hover-color: #3a6d94;
	--bs-link-hover-color-rgb: 58, 109, 148;
	/* Focus Ring (for accessibility) */
	--bs-focus-ring-width: 0.25rem;
	--bs-focus-ring-opacity: 0.25;
	--bs-focus-ring-color: rgba(69, 128, 173, 0.25);
	/*Present Colors*/
	--present-color: #4559AD;
	--present-rgb: 69, 89, 173;
	/*Future Colors*/
	--future-color: #364C1A;
	--future-rgb: 64, 76, 24;
	/* 3D Wealth Dimension Colors */
	--dimension-foundational: #EAAD55;
	--dimension-foundational-rgb: 234, 173, 85;
	--dimension-intellectual: #801423;
	--dimension-intellectual-rgb: 128, 20, 35;
	--dimension-financial: #578662;
	--dimension-financial-rgb: 87, 134, 98;
	/* Standard Transitions */
	--transition-fast: all 0.2s ease;
	--transition-smooth: all 0.3s ease;
	--transition-progress: width 1s ease-out;
	/* ===== BODY & TEXT COLORS ===== */
	--bs-body-color: #212529;
	--bs-body-color-rgb: 33, 37, 41;
	--bs-body-bg: #ffffff;
	--bs-body-bg-rgb: 255, 255, 255;
	--bs-emphasis-color: #000000;
	--bs-emphasis-color-rgb: 0, 0, 0;
	--bs-secondary-color: #6c757d;
	--bs-secondary-color-rgb: 108, 117, 125;
	--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;
	/* ===== BORDER COLORS ===== */
	--bs-border-color: #dee2e6;
	--bs-border-color-translucent: rgba(0, 0, 0, 0.175);
	/* ===== HEADING COLORS ===== */
	--bs-heading-color: #212529;
	/* ===== CODE COLORS ===== */
	--bs-code-color: #d63384;
	--bs-highlight-bg: #fff3cd;
	/* ===== FORM COLORS ===== */
	--bs-form-valid-color: #198754;
	--bs-form-valid-border-color: #198754;
	--bs-form-invalid-color: #dc3545;
	--bs-form-invalid-border-color: #dc3545;
	--bs-success: #198754;
	--bs-success-rgb: 25, 135, 84;
	--success-color: #38A169;
	--text-muted: #718096;
}

/* ===================================================================
   BUTTON COMPONENT OVERRIDES - PRIMARY
   =================================================================== */
.btn-primary {
	--bs-btn-color: #fff;
	--bs-btn-bg: #4580AD;
	--bs-btn-border-color: #4580AD;
	--bs-btn-hover-color: #fff;
	--bs-btn-hover-bg: #3a6d94;
	--bs-btn-hover-border-color: #356687;
	--bs-btn-focus-shadow-rgb: 69, 128, 173;
	--bs-btn-active-color: #fff;
	--bs-btn-active-bg: #356687;
	--bs-btn-active-border-color: #2f5977;
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
	--bs-btn-disabled-color: #fff;
	--bs-btn-disabled-bg: #4580AD;
	--bs-btn-disabled-border-color: #4580AD;
}

/* ===================================================================
   BUTTON COMPONENT OVERRIDES - OUTLINE PRIMARY
   =================================================================== */
.btn-outline-primary {
	--bs-btn-color: #4580AD;
	--bs-btn-border-color: #4580AD;
	--bs-btn-hover-color: #fff;
	--bs-btn-hover-bg: #4580AD;
	--bs-btn-hover-border-color: #4580AD;
	--bs-btn-focus-shadow-rgb: 69, 128, 173;
	--bs-btn-active-color: #fff;
	--bs-btn-active-bg: #4580AD;
	--bs-btn-active-border-color: #4580AD;
	--bs-btn-disabled-color: #4580AD;
	--bs-btn-disabled-bg: transparent;
	--bs-btn-disabled-border-color: #4580AD;
}

.btn-primary:hover {
	transform: translateY(-2px);
	box-shadow: 0 4px 12px rgba(69, 128, 173, 0.3);
}

.btn-primary:active {
	transform: translateY(0);
}

/* ===================================================================
   LINK COLORS
   =================================================================== */
.link-primary {
	color: #4580AD !important;
	text-decoration-color: #4580AD !important;
}

	.link-primary:hover,
	.link-primary:focus {
		color: #3a6d94 !important;
		text-decoration-color: #3a6d94 !important;
	}

/* ===================================================================
   TEXT UTILITIES
   =================================================================== */
.text-primary {
	--bs-text-opacity: 1;
	color: rgba(var(--bs-primary-rgb), var(--bs-text-opacity)) !important;
}

.text-primary-emphasis {
	color: #2f5977 !important;
}

.text-secondary {
	--bs-text-opacity: 1;
	color: rgba(var(--bs-secondary-rgb), var(--bs-text-opacity)) !important;
}

.text-secondary-emphasis {
	color: #6fa0cc !important;
}

.text-primary-navy {
	color: rgb(var(--bs-primary-navy-rgb));
}
/* ===================================================================
   BACKGROUND UTILITIES
   =================================================================== */
.bg-primary {
	--bs-bg-opacity: 1;
	background-color: rgba(69, 128, 173, var(--bs-bg-opacity)) !important;
}

.bg-primary-subtle {
	background-color: #d4e4f1 !important;
}

.bg-secondary {
	--bs-bg-opacity: 1;
	background-color: rgba(var(--bs-secondary-rgb), var(--bs-bg-opacity)) !important;
}

.bg-secondary-subtle {
	background-color: #e8f1f8 !important;
}

.bg-secondary-rgba {
	background-color: rgb(var(--bs-secondary-color-rgb),.5) !important;
}

.bg-primary-navy {
	background-color: var(--bs-primary-navy) !important;
}

.bg-muted {
	background-color: var(--text-muted) !important;
}
/* ===================================================================
   BORDER UTILITIES
   =================================================================== */
.border-primary {
	--bs-border-opacity: 1;
	border-color: rgba(69, 128, 173, var(--bs-border-opacity)) !important;
}

.border-primary-subtle {
	border-color: #a8c9df !important;
}

.border-secondary {
	--bs-border-opacity: 1;
	border-color: rgba(var(--bs-secondary-rgb), var(--bs-border-opacity)) !important;
}

.border-secondary-subtle {
	border-color: #c4d9ec !important;
}

.border-2px {
	border-width: 2px;
}

/* ===================================================================
   ALERT COMPONENTS
   =================================================================== */
.alert-primary {
	--bs-alert-color: #2f5977;
	--bs-alert-bg: #d4e4f1;
	--bs-alert-border-color: #a8c9df;
	--bs-alert-link-color: #264860;
}

.alert-secondary {
	--bs-alert-color: #6fa0cc;
	--bs-alert-bg: #e8f1f8;
	--bs-alert-border-color: #c4d9ec;
	--bs-alert-link-color: #5a85a8;
}

/* ===================================================================
   BADGE COMPONENTS
   =================================================================== */
.badge.bg-primary {
	background-color: #4580AD !important;
}

.badge.text-bg-primary {
	color: #fff !important;
	background-color: #4580AD !important;
}

.badge.bg-secondary {
	background-color: #A0C3E5 !important;
	color: #000 !important;
}

.badge.text-bg-secondary {
	color: #000 !important;
	background-color: #A0C3E5 !important;
}

/* ===================================================================
   LIST GROUP COMPONENTS
   =================================================================== */
.list-group-item-primary {
	--bs-list-group-color: #2f5977;
	--bs-list-group-bg: #d4e4f1;
	--bs-list-group-border-color: #a8c9df;
	--bs-list-group-action-hover-color: #2f5977;
	--bs-list-group-action-hover-bg: #c4d9ec;
	--bs-list-group-action-active-color: #fff;
	--bs-list-group-action-active-bg: #4580AD;
	--bs-list-group-active-color: #fff;
	--bs-list-group-active-bg: #4580AD;
	--bs-list-group-active-border-color: #4580AD;
}

.list-group-item-secondary {
	--bs-list-group-color: #6fa0cc;
	--bs-list-group-bg: #e8f1f8;
	--bs-list-group-border-color: #c4d9ec;
	--bs-list-group-action-hover-color: #6fa0cc;
	--bs-list-group-action-hover-bg: #d4e4f1;
	--bs-list-group-action-active-color: #000;
	--bs-list-group-action-active-bg: #A0C3E5;
	--bs-list-group-active-color: #000;
	--bs-list-group-active-bg: #A0C3E5;
	--bs-list-group-active-border-color: #A0C3E5;
}

/* ===================================================================
   TABLE COMPONENTS
   =================================================================== */
.table-primary {
	--bs-table-color: #000;
	--bs-table-bg: #d4e4f1;
	--bs-table-border-color: #bfccd9;
	--bs-table-striped-bg: #c9ddeb;
	--bs-table-striped-color: #000;
	--bs-table-active-bg: #bfccd9;
	--bs-table-active-color: #000;
	--bs-table-hover-bg: #c4d9ec;
	--bs-table-hover-color: #000;
}

.table-secondary {
	--bs-table-color: #000;
	--bs-table-bg: #e8f1f8;
	--bs-table-border-color: #d1dfe9;
	--bs-table-striped-bg: #dce8f2;
	--bs-table-striped-color: #000;
	--bs-table-active-bg: #d1dfe9;
	--bs-table-active-color: #000;
	--bs-table-hover-bg: #d7e5f0;
	--bs-table-hover-color: #000;
}

/* ===================================================================
   PROGRESS BAR COMPONENTS
   =================================================================== */
.progress-bar {
	background-color: #4580AD;
}

	.progress-bar.bg-primary {
		background-color: #4580AD !important;
	}

	.progress-bar.bg-secondary {
		background-color: #A0C3E5 !important;
	}

	.progress-bar.foundational {
		background-color: var(--dimension-foundational);
	}

	.progress-bar.intellectual {
		background-color: var(--dimension-intellectual);
	}

	.progress-bar.financial {
		background-color: var(--dimension-financial);
	}

/* ===================================================================
   PAGINATION COMPONENTS
   =================================================================== */
.pagination {
	--bs-pagination-color: #4580AD;
	--bs-pagination-hover-color: #3a6d94;
	--bs-pagination-focus-color: #3a6d94;
	--bs-pagination-active-bg: #4580AD;
	--bs-pagination-active-border-color: #4580AD;
}

.levelup-title {
	font-size: 1.5rem;
	font-weight: 700;
	color: var(--bs-primary);
	margin-bottom: 1rem;
	text-transform: uppercase;
	letter-spacing: 0.5px;
}

.levelup-subtitle {
	font-size: 1.25rem;
	color: var(--bs-primary);
	margin-bottom: .5rem;
}

.levelup-resource img {
	width: 70px;
	height: 75px;
}

.levelup-resource p {
	line-height: 1.4;
}

.levelup-header {
	font-size: 1.15em !important;
}

.levelup-category-list .levelup-area-col .card {
	background-color: var(--bs-border-color);
}

.levelup-category-list .principle-header {
	background-color: var(--bs-border-color);
	border-radius: 8px;
	padding: 0.5rem 0.75rem;
}

.levelup-printbutton {
	line-height: .75rem;
	margin: 0 0 0 .5rem !important;
}

.levelup-category-list .levelup-action-mobile-label {
	display: none;
}

.levelup-outcome-group-label-col {
	width: 2.5rem;
}

.levelup-outcome-group-label-text {
	writing-mode: vertical-rl;
	transform: rotate(180deg);
	letter-spacing: 0.1em;
	white-space: nowrap;
}

.levelup-outcome-card-single {
	min-height: 8.75rem;
}

.levelup-quote {
	display: block;
	margin: 1rem 0 0;
}

@media (max-width: 991.98px) {
	#levelup.levelup-outcome-resource {
		margin-bottom: 0.5rem;
		padding: clamp(0.75rem, 2.25vw, 1rem);
		border-radius: 8px;
	}

	.levelup-outcome-resource .levelup-title {
		display: flex;
		align-items: center;
		gap: 0.5rem;
		margin-bottom: 0.85rem;
		font-size: clamp(1.35rem, 4vw, 1.85rem);
		line-height: 1.15;
	}

	.levelup-outcome-resource .levelup-subtitle {
		display: block;
		margin-bottom: 0.75rem;
		font-size: clamp(1rem, 2.9vw, 1.25rem);
		line-height: 1.45;
	}

	.levelup-outcome-resource .options-list {
		margin-left: 0;
		margin-right: 0;
	}

	.levelup-outcome-resource .options-list > .mt-2 {
		width: 100%;
		margin-top: 0.4rem !important;
	}

	.levelup-outcome-resource .levelup-outcome-group {
		display: grid !important;
		grid-template-columns: minmax(7.5rem, 0.28fr) minmax(0, 1fr);
		gap: 0.75rem;
		align-items: stretch !important;
		margin-bottom: 1rem !important;
	}

	.levelup-outcome-resource .levelup-outcome-group-label-col,
	.levelup-outcome-resource .levelup-outcome-group-content {
		width: auto !important;
		max-width: none !important;
		flex: unset !important;
		min-width: 0;
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	.levelup-outcome-resource .levelup-outcome-group-label-col {
		display: flex !important;
	}

	.levelup-outcome-resource .levelup-outcome-group-label {
		min-height: 100%;
		padding: 0.65rem 0.75rem !important;
		border-radius: 8px !important;
	}

	.levelup-outcome-resource .levelup-outcome-group-label-text {
		writing-mode: horizontal-tb;
		transform: none;
		white-space: normal;
		text-align: center;
		line-height: 1.15;
	}

	.levelup-outcome-resource .levelup-outcome-card {
		min-height: 0;
		border-radius: 8px !important;
	}

	.levelup-outcome-resource .levelup-outcome-card-body-has-outcome {
		display: grid !important;
		grid-template-columns: minmax(0, 1fr) minmax(11rem, 0.42fr);
		gap: 0.9rem;
		align-items: center !important;
		padding: 0.9rem !important;
	}

	.levelup-outcome-resource .levelup-outcome-card-body-link-only {
		display: block !important;
		padding: 0.9rem !important;
	}

	.levelup-outcome-resource .levelup-outcome-text {
		width: auto !important;
		max-width: none !important;
		flex: unset !important;
		min-width: 0;
	}

	.levelup-outcome-resource .levelup-outcome-text p {
		font-size: clamp(0.9rem, 2.2vw, 1rem);
		line-height: 1.45;
	}

	.levelup-outcome-resource .levelup-outcome-link {
		display: block;
		min-width: 0;
		padding-left: 0 !important;
	}

	.levelup-outcome-resource .levelup-resource {
		min-width: 0;
	}

	.levelup-outcome-resource .levelup-resource img {
		width: clamp(52px, 7.5vw, 64px);
		height: clamp(52px, 7.5vw, 64px);
		object-fit: contain;
	}

	.levelup-outcome-resource .levelup-resource p {
		width: 100%;
		color: #111827;
		font-size: clamp(0.84rem, 2.1vw, 0.95rem);
		font-weight: 500;
		line-height: 1.28;
	}

	.levelup-outcome-resource .levelup-quote {
		margin-top: 0.85rem;
		padding: 0.85rem 1rem;
		border-left: 4px solid var(--bs-primary);
		background: #fff;
		border-radius: 0 8px 8px 0;
		line-height: 1.5;
	}

	#levelup.levelup-category-list {
		margin-bottom: 0.5rem;
		padding: clamp(0.75rem, 2.25vw, 1rem);
		border-radius: 8px;
	}

	.levelup-category-list .levelup-title {
		display: flex;
		align-items: center;
		gap: 0.5rem;
		margin-bottom: 0.85rem;
		font-size: clamp(1.35rem, 4vw, 1.85rem);
		line-height: 1.15;
	}

	.levelup-category-list .levelup-subtitle {
		display: block;
		margin-bottom: 0.75rem;
		font-size: clamp(1rem, 2.9vw, 1.25rem);
		line-height: 1.45;
	}

	.levelup-category-list .options-list {
		margin-left: 0;
		margin-right: 0;
	}

	.levelup-category-list .options-list > .mt-2 {
		width: 100%;
		margin-top: 0.4rem !important;
	}

	.levelup-category-list .levelup-table {
		max-height: min(80dvh, 52rem);
		overflow-x: hidden;
		overflow-y: auto;
		overscroll-behavior: contain;
		padding-right: 0.15rem;
		scrollbar-gutter: stable;
		-webkit-overflow-scrolling: touch;
	}

	.levelup-category-list .levelup-table-header {
		display: grid !important;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 0.55rem;
		position: sticky;
		top: 0;
		z-index: 20;
		margin: 0 0 0.85rem !important;
		padding-bottom: 0.65rem;
		background: var(--bs-alert-bg, #e9f3fb);
		box-shadow: 0 8px 14px rgba(15, 23, 42, 0.08);
	}

	.levelup-category-list .levelup-table-header > [class*="col-3"] {
		display: block !important;
		width: auto !important;
		max-width: none !important;
		flex: unset !important;
		padding: 0 !important;
	}

	.levelup-category-list .levelup-table-header > [class*="col-3"]:first-child {
		display: none !important;
	}

	.levelup-category-list .levelup-table-header > [class*="col-3"] > div {
		display: flex;
		align-items: center;
		justify-content: center;
		min-height: 2.6rem;
		padding: 0.55rem 0.6rem !important;
		border-radius: 6px !important;
		font-size: clamp(0.68rem, 1.8vw, 0.88rem) !important;
		line-height: 1.12;
		white-space: normal;
	}

	.levelup-category-list .levelup-table-row {
		display: grid !important;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		align-items: stretch !important;
		gap: 0.55rem;
		margin: 0 0 1rem !important;
	}

	.levelup-category-list .levelup-table-row > [class*="col-3"] {
		width: auto !important;
		max-width: none !important;
		flex: unset !important;
		min-width: 0;
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	.levelup-category-list .levelup-area-col {
		grid-column: 1 / -1;
		margin-bottom: 0;
	}

	.levelup-category-list .levelup-area-col .card {
		border-radius: 8px !important;
	}

	.levelup-category-list .levelup-area-col .card-body {
		padding: 0.85rem 1rem !important;
	}

	.levelup-category-list .levelup-area-col .levelup-header {
		font-size: clamp(1rem, 2.8vw, 1.18rem) !important;
		line-height: 1.2;
	}

	.levelup-category-list .levelup-area-col .levelup-subtitle-text {
		display: block;
		margin-top: 0.2rem;
		font-size: 0.78rem;
		line-height: 1.25;
	}

	.levelup-category-list .levelup-action-col {
		display: flex !important;
		flex-direction: column;
		gap: 0.55rem;
	}

	.levelup-category-list .levelup-action-col > a {
		display: block;
		min-width: 0;
	}

	.levelup-category-list .levelup-action-col .card {
		height: 100%;
		border-radius: 8px !important;
	}

	.levelup-category-list .levelup-action-col .card-body {
		height: 100%;
		padding: 0.75rem !important;
	}

	.levelup-category-list .levelup-action-col .levelup-resource {
		flex-direction: column;
		align-items: flex-start !important;
		gap: 0.55rem !important;
	}

	.levelup-category-list .levelup-resource img {
		width: clamp(48px, 7.5vw, 64px);
		height: clamp(48px, 7.5vw, 64px);
		object-fit: contain;
	}

	.levelup-category-list .levelup-resource p {
		width: 100%;
		color: #111827;
		font-size: clamp(0.82rem, 2.1vw, 0.95rem);
		font-weight: 500;
		line-height: 1.28;
	}
}

@media (min-width: 768px) and (max-width: 991.98px) {
	.levelup-outcome-resource .levelup-outcome-group {
		gap: 0.9rem;
	}

	.levelup-category-list .levelup-table-row,
	.levelup-category-list .levelup-table-header {
		gap: 0.7rem;
	}

	.levelup-category-list .levelup-action-col .card-body {
		padding: 0.9rem !important;
	}
}

@media (max-width: 575.98px) {
	.levelup-outcome-resource .levelup-outcome-group {
		grid-template-columns: 1fr;
		gap: 0.6rem;
	}

	.levelup-outcome-resource .levelup-outcome-group-label {
		min-height: 2.35rem;
	}

	.levelup-outcome-resource .levelup-outcome-card-body-has-outcome {
		grid-template-columns: 1fr;
		gap: 0.75rem;
	}

	.levelup-outcome-resource .levelup-resource {
		flex-direction: row;
		align-items: center !important;
	}

	.levelup-outcome-resource .levelup-resource img {
		width: 58px;
		height: 58px;
	}

	.levelup-outcome-resource .levelup-title {
		font-size: 1.35rem;
	}

	.levelup-outcome-resource .levelup-subtitle {
		font-size: 1rem;
	}

	.levelup-category-list .levelup-table {
		max-height: min(80dvh, 46rem);
	}

	.levelup-category-list .levelup-table-header {
		display: none !important;
	}

	.levelup-category-list .levelup-table-row {
		grid-template-columns: 1fr;
		gap: 0.6rem;
	}

	.levelup-category-list .levelup-action-mobile-label {
		display: flex;
		align-items: center;
		justify-content: center;
		min-height: 2.25rem;
		padding: 0.45rem 0.65rem;
		font-size: 0.78rem;
		line-height: 1.15;
	}

	.levelup-category-list .levelup-action-col .levelup-resource {
		flex-direction: row;
		align-items: center !important;
	}

	.levelup-category-list .levelup-resource img {
		width: 58px;
		height: 58px;
	}
}

@media (max-width: 768px) {
	.levelup-outcome-resource .levelup-outcome-group {
		grid-template-columns: 1fr;
		gap: 0.6rem;
	}

	.levelup-outcome-resource .levelup-outcome-group-label {
		min-height: 2.4rem;
	}

	.levelup-outcome-resource .levelup-outcome-card-body-has-outcome {
		grid-template-columns: 1fr;
		gap: 0.75rem;
	}

	.levelup-outcome-resource .levelup-outcome-card-body-has-outcome,
	.levelup-outcome-resource .levelup-outcome-card-body-link-only {
		padding: 0.85rem !important;
	}

	.levelup-outcome-resource .levelup-resource {
		flex-direction: row;
		align-items: center !important;
	}

	.levelup-outcome-resource .levelup-resource img {
		width: 58px;
		height: 58px;
	}
}

/* position/min-height are declared once near the top of this file; body
   margin-bottom likewise. Only the font-size override is unique here.
   NOTE: this 16px applies at all widths, overriding the responsive
   14px/16px base at the top — kept as-is to preserve current rendering. */
html {
	font-size: 16px;
}

.footer {
	position: absolute;
	bottom: 0;
	width: 100%;
	white-space: nowrap;
	line-height: 60px;
}

.thumbnail-container {
	max-height: 300px;
}
/* Card Styles */
.card {
	border: none;
	border-radius: 10px;
}

.card-header {
	border-radius: 10px 10px 0 0 !important;
	padding: 20px;
}

	.card-header.bg-primary.text-white h1,
	.card-header.bg-primary.text-white h2,
	.card-header.bg-primary.text-white h3,
	.card-header.bg-primary.text-white h4,
	.card-header.bg-primary.text-white h5,
	.card-header.bg-primary.text-white h6,
	.card-header.bg-secondary.text-white h1,
	.card-header.bg-secondary.text-white h2,
	.card-header.bg-secondary.text-white h3,
	.card-header.bg-secondary.text-white h4,
	.card-header.bg-secondary.text-white h5,
	.card-header.bg-secondary.text-white h6 {
		--bs-text-opacity: 1;
		color: rgba(var(--bs-white-rgb), var(--bs-text-opacity)) !important;
	}
/* Form Styles */
.form-label {
	color: #2D3748;
	font-size: 14px;
}

.form-control, .form-select {
	border: 2px solid var(--bs-border-color);
	border-radius: 6px;
	padding: 10px 15px;
	font-size: 15px;
}

	.form-control:focus, .form-select:focus {
		border-color: var(--bs-primary);
		box-shadow: 0 0 0 3px rgba(var(--bs-primary-rgb), 0.1);
	}

textarea.form-control {
	resize: vertical;
}

/* Button Styles */
.btn {
	border-radius: 6px;
	padding: 10px 24px;
	font-weight: 600;
	transition: var(--transition-fast);
}

.btn-lg {
	padding: 12px 32px;
	font-size: 18px;
}

/* Success button styles */
.btn-success {
	background-color: var(--success-color);
	border-color: var(--success-color);
}

	.btn-success:hover {
		background-color: #2F855A;
		border-color: #2F855A;
		transform: translateY(-2px);
		box-shadow: 0 4px 12px rgba(56, 161, 105, 0.3);
	}

/* Alert info styles*/
.btn-alert-secondary {
	background-color: #e8f1f8;
	border-color: #6fa0cc;
}

	.btn-alert-secondary:hover,
	.btn-alert-secondary:focus {
		background-color: var(--bs-primary-bg-subtle);
		border-color: var(--bs-primary-border-subtle);
		color: var(--bs-primary-text-emphasis);
	}
/* Alert Styles */
.alert-light {
	background-color: #F7FAFC;
	border-color: var(--bs-border-color);
}

/* Canva Template Links */
.canva-templates {
	display: flex;
	gap: 1rem;
	flex-wrap: wrap;
	margin-top: 1.5rem;
}

.canva-template-link {
	flex: 1;
	min-width: 150px;
	text-align: center;
	padding: 0.75rem 1.5rem;
	border: 2px solid var(--bs-primary);
	border-radius: 4px;
	font-weight: 600;
	transition: var(--transition-smooth);
	text-decoration: none;
	color: var(--bs-primary);
}

	.canva-template-link:hover {
		background-color: var(--bs-primary);
		color: white;
		transform: translateY(-2px);
		box-shadow: 0 4px 8px rgba(var(--bs-primary-rgb), 0.3);
	}

.category-card.foundational,
.border-foundational {
	border-color: var(--dimension-foundational);
}

.category-card.intellectual,
.border-intellectual {
	border-color: var(--dimension-intellectual);
}

.category-card.financial,
.border-financial {
	border-color: var(--dimension-financial);
}
/* ===================================================================
   NAVBAR CUSTOMIZATION
   Migrated from _Layout.cshtml.css
   =================================================================== */

a.navbar-brand {
	white-space: normal;
	text-align: center;
	word-break: break-all;
}


/* ===================================================================
   DIMENSION UTILITY CLASSES
   Shared across tools for consistent 3D dimension theming
   Uses CSS variables defined in :root above
   =================================================================== */

/* Background Colors - Solid */
.bg-dimension-foundational {
	background-color: var(--dimension-foundational) !important;
	color: white !important;
}

.bg-dimension-intellectual {
	background-color: var(--dimension-intellectual) !important;
	color: white !important;
}

.bg-dimension-financial {
	background-color: var(--dimension-financial) !important;
	color: white !important;
}

/* Background Colors - Subtle (for cards, highlights) */
.bg-dimension-foundational-subtle {
	background-color: rgba(var(--dimension-foundational-rgb), 0.1) !important;
	color: var(--dimension-foundational) !important;
}

.bg-dimension-intellectual-subtle {
	background-color: rgba(var(--dimension-intellectual-rgb), 0.1) !important;
	color: var(--dimension-intellectual) !important;
}

.bg-dimension-financial-subtle {
	background-color: rgba(var(--dimension-financial-rgb), 0.1) !important;
	color: var(--dimension-financial) !important;
}

/* Background Gradients (for headers, hero sections) */
.bg-gradient-foundational {
	background: linear-gradient(135deg, #2d8659 0%, #246d47 100%) !important;
	color: white !important;
}

.bg-gradient-intellectual {
	background: linear-gradient(135deg, #2c9fc9 0%, #2380a1 100%) !important;
	color: white !important;
}

.bg-gradient-financial {
	background: linear-gradient(135deg, #d4a017 0%, #b38613 100%) !important;
	color: white !important;
}

/* Text Colors */
.text-dimension-foundational {
	color: var(--dimension-foundational) !important;
}

.text-dimension-intellectual {
	color: var(--dimension-intellectual) !important;
}

.text-dimension-financial {
	color: var(--dimension-financial) !important;
}

/* Border Colors */
.border-dimension-foundational {
	border-color: var(--dimension-foundational) !important;
}

.border-dimension-intellectual {
	border-color: var(--dimension-intellectual) !important;
}

.border-dimension-financial {
	border-color: var(--dimension-financial) !important;
}

/* Border Left Accent (commonly used pattern) */
.border-start-dimension-foundational {
	border-left: 4px solid var(--dimension-foundational) !important;
}

.border-start-dimension-intellectual {
	border-left: 4px solid var(--dimension-intellectual) !important;
}

.border-start-dimension-financial {
	border-left: 4px solid var(--dimension-financial) !important;
}

/* ===================================================================
   DIMENSION BADGE
   Standardized badge styling for dimension indicators
   =================================================================== */

.dimension-badge {
	display: inline-block;
	padding: 0.35rem 0.75rem;
	border-radius: 0.375rem;
	font-weight: 600;
	font-size: 0.875rem;
	text-transform: uppercase;
	letter-spacing: 0.5px;
}

	.dimension-badge.foundational {
		background-color: var(--dimension-foundational);
		color: white;
	}

	.dimension-badge.intellectual {
		background-color: var(--dimension-intellectual);
		color: white;
	}

	.dimension-badge.financial {
		background-color: var(--dimension-financial);
		color: white;
	}

.hover-lift {
	transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
}

	.hover-lift:hover {
		transform: translateY(-5px);
		box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
	}

/* ===================================================================
   COMING SOON - Landing page styles
   =================================================================== */
.coming-soon-thumbnail {
	width: min(100%, 300px);
	max-width: 100%;
	height: auto;
	object-fit: contain;
}

.coming-soon-back-btn {
	background-color: var(--bs-primary-navy);
	border-color: var(--bs-primary-navy);
	color: #fff;
}

	.coming-soon-back-btn:hover,
	.coming-soon-back-btn:focus {
		background-color: #243660;
		border-color: #243660;
		color: #fff;
	}

/* ===================================================================
   TOOL PREVIEW - Shared landing page styles
   =================================================================== */
.tool-preview-thumbnail {
	width: min(100%, 400px);
	max-width: 100%;
	height: auto;
	object-fit: contain;
}

.tool-name.card-title {
	font-size: 1.35rem;
}
/* ===================================================================
   WCAG AA CONTRAST FIXES
   Bootstrap's defaults fail 4.5:1 for small text on light backgrounds.
   =================================================================== */

/* text-muted: #6c757d = 4.1:1 on #f8f9fa — darken to pass */
.text-muted {
	color: #595959 !important;
}