:root {
	--track-color-light: #ddd;
	--thumb-color-light: var(--glyph-blue);
	--track-color-dark: #333;
	--thumb-color-dark: var(--glyph-blue);
	--disabled-color-light: #eee;
	--disabled-color-dark: #555;
	--disabled-thumb-color-light: #aaa;
	--disabled-thumb-color-dark: #777;
}

body[data-color-scheme="dark"] {
	--basic-bg-color: #000;
	--basic-bg-alt-color: #000;
	--basic-font-color: #fff;
	--track-color: var(--track-color-dark);
	--thumb-color: var(--thumb-color-dark);
	--disabled-color: var(--disabled-color-dark);
	--disabled-thumb-color: var(--disabled-thumb-color-dark);
}

body[data-color-scheme="light"] {
	--basic-bg-color: #fff;
	--basic-bg-alt-color: #fafafa;
	--basic-font-color: #000;
	--track-color: var(--track-color-light);
	--thumb-color: var(--thumb-color-light);
	--disabled-color: var(--disabled-color-light);
	--disabled-thumb-color: var(--disabled-thumb-color-light);
}

body[data-color-scheme="light"] .bg-alt {
	background-color: #f5f5f7;
}

input[type="range"] {
	-webkit-appearance: none;
	appearance: none;
	width: 100%;
	height: 10px;
	border-radius: 5px;
	background-color: var(--track-color);
	outline: none;
}

input[type="range"]::-webkit-slider-thumb {
	-webkit-appearance: none;
	appearance: none;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background-color: var(--thumb-color);
	cursor: pointer;
}

input[type="range"]::-moz-range-thumb {
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background-color: var(--thumb-color);
	cursor: pointer;
}

input[type="range"]:disabled {
	background-color: var(--disabled-color);
	cursor: not-allowed;
}

input[type="range"]:disabled::-webkit-slider-thumb {
	background-color: var(--disabled-thumb-color);
}

input[type="range"]:disabled::-moz-range-thumb {
	background-color: var(--disabled-thumb-color);
}

.side-by-side-grid {
	display: flex;
	gap: 1.5em;
	justify-content: center;
	align-items: center;
}

.number-label-container {
	padding-left: 0.41176rem;
	padding-right: 0.41176rem;
}

.number-label {
	border-radius: 12px;
	border: 1px solid #d2d2d7;
	padding: 10px;
	min-width: 150px;
	font-size: 17px;
	background-color: #fff;
}

body[data-color-scheme="dark"] .number-label {
	border: 1px solid #424245;
	background-color: rgba(255, 255, 255, 0.04);
}

body[data-color-scheme="light"] .bg-light {
	background-color: #f5f5f7;
}

.lighter-1 {
	color: #777;
}

.smaller-1 {
	line-height: unset !important;
}

.margin-bottom-custom {
	margin-bottom: 10px !important;
}
.margin-top-custom {
	margin-top: 10px !important;
}

@media only screen and (max-width: 735px) {
	.sv-margin-top-cutsom {
		margin-top: 10px !important;
	}
}

.margin-left-custom {
	margin-left: 15px !important;
}

body[data-color-scheme="light"] {
	color-scheme: light;
	--card-color: #d2d2d7;
	--card-bg-color: #f5f5f7;
}

body[data-color-scheme="dark"] {
	color-scheme: dark;
	--card-color: #424245;
	--card-bg-color: #141414;
}

.tile-wrap {
	padding: 30px 20px !important;
	border-radius: 0.5em;
	border: 1px solid var(--card-color);
	transition: box-shadow 0.2s ease-in-out;
	/* height: 100%; */
	margin-top: 37px;
}

.tile-wrap-info {
	padding: 40px;
}

.tile-wrap-results {
	padding: unset !important;
	position: sticky;
	top: 100px;
}

.tile-wrap-result-top {
	padding: 30px 20px 0 !important;
}

.tile-wrap-result-bottom {
	background-color: var(--basic-bg-alt-color);
	border-top: 1px solid var(--card-color);

	border-bottom-left-radius: 0.5em;
	border-bottom-right-radius: 0.5em;
}

.tile-bg-results-botton-inner {
	padding: 20px !important;
}

/* @media only screen and (max-width: 1068px) {
	.tile-wrap {
		padding: 30px !important;
	}
}

@media only screen and (max-width: 735px) {
	.tile-wrap {
		margin-top: 1.5em;
		padding: 25px !important;
	}
} */

.mixed-distro-column {
	display: flex;
	font-size: 12px;
	align-items: center;
}

.percent-desc {
	line-height: 1.5em;
}

#reults-container.margin-bottom:last-of-type:not([style*="display: none"]):not([style*="visibility: hidden"]) {
	margin-bottom: 0 !important;
}

.resource-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	column-gap: 1.5em;
}

@media only screen and (max-width: 735px) {
	.resource-grid {
		grid-template-columns: 1fr;
		column-gap: 0;
		/* row-gap: 0.5em; */
	}
}

#section-results .resource-grid-item {
	padding: 10px 5px 0 !important;
}

@media only screen and (max-width: 735px) {
	#section-results .resource-grid-item {
		padding: 20px 20px !important;
	}
}

#section-results .tile-wrap .column .typography-eyebrow-reduced {
	margin-bottom: 0em !important;
}

#section-results .tile-wrap h5 {
	font-size: 17px;
}

.no-top {
	top: 0;
}

/* .form-tooltip.no-top {
	top: 0;
} */

.inline-container .form-group-label {
	display: inline;
}

#reults-container .typography-eyebrow-super {
	margin-top: 10px !important;
}

.percent-label {
	min-width: 37px;
	display: inline-block;
}

.transparency {
	opacity: 0.6;
}

/* #reults-container.transparency {
	opacity: 0.3;
} */

/* ========== Sticky results ========== */

.sticky-container {
	position: sticky;
	bottom: 0px;
	z-index: 2;
}

@media only screen and (max-width: 1068px) {
	.sticky-container {
		position: unset;
		bottom: unset;
	}
}

body[data-color-scheme="light"] .section-results {
	background-color: #e5eef8;
	/* border-top: 1px solid #d2d2d7; */
}

body[data-color-scheme="light"] .form-label-custom {
	border-color: #d2d2d7;
}

body[data-color-scheme="light"] .form-label-custom:disabled {
	border-color: #d2d2d7;
	background-color: rgba(255, 255, 255, 0.8);
	opacity: 0.32;
	cursor: auto;
}

body[data-color-scheme="dark"] .form-label-custom {
	background-color: rgba(255, 255, 255, 0.04) !important;
}

body[data-color-scheme="dark"] .form-label-custom:disabled {
	border-color: #424245;
	background-color: rgba(255, 255, 255, 0.04);
	opacity: 0.32;
	cursor: auto;
}

button.link-button {
	outline: none;
	font-size: 12px;
}

button.link-button:hover {
	text-decoration: underline;
	opacity: 0.75;
}

button.link-button-active,
button.link-button-active:hover {
	color: var(--basic-font-color) !important;
	text-decoration: none;
	font-weight: bold;
	opacity: 1;
}

.form-toolkit.form-tooltip-currency {
	top: 0 !important;
}

.pattern-selectors-custom {
	margin-bottom: 41px !important;
}
@media only screen and (max-width: 734px) {
	.pattern-selectors-custom {
		margin-bottom: 28px;
	}
}

ul.form-selector-group-withgutters > li:first-child,
ul.form-selector-group-withgutters > li:nth-child(3) {
	padding-left: 0 !important;
}

ul.form-selector-group-withgutters > li:nth-child(2),
ul.form-selector-group-withgutters > li:nth-child(4) {
	padding-right: 0 !important;
}

.form-group-3-columns {
	margin-top: 0.25em !important;
	margin-bottom: 0.5em !important;
}

ul.form-selector-group-withgutters.form-group-3-columns > li:first-child {
	padding-right: 0.41176rem !important;
	padding-left: 0 !important;
}

ul.form-selector-group-withgutters.form-group-3-columns > li:nth-child(2) {
	padding-right: 0.41176rem !important;
	padding-left: 0.41176rem !important;
}

ul.form-selector-group-withgutters.form-group-3-columns > li:nth-child(3) {
	padding-right: 0;
	padding-left: 0.41176rem !important;
}

/* ========== Grid ========== */
#main section.section {
	padding-top: 4em;
	padding-bottom: 4em;
}

#main section.section.section-results {
	padding-top: 1.5em;
	padding-bottom: 1.5em;
}

#main section.section.section-resources {
	padding-bottom: 2em;
}

#main section .section-content .row {
	margin-left: 0;
	margin-right: 0;
}

@media only screen and (max-width: 1068px) {
	#main section .section-content .row {
		margin-left: 0;
		margin-right: 0;
	}
}

@media only screen and (max-width: 735px) {
	#main section.section {
		padding-top: 2em;
		padding-bottom: 2em;
	}

	#main section .section-content .row {
		margin-left: 0;
		margin-right: 0;
	}
}