@import "./root.css";
@import "./classes.css";
@import "./font-sizes.css";
@import "./base.css";
@import "./buttons.css";
@import "./header.css";
@import "./footer.css";

.table > :not(caption) > * > * {
	padding: 0.75rem;
}
.table > :not(caption) > * > th {
	font-size: var(--text-lg);
	color: var(--color-white);
	background-color: var(--color-blue);

	&:first-child {
		padding: 0.75rem 2rem;
	}
}
.table > :not(caption) > * > td {
	&:first-child {
		padding: 0.75rem 2rem;
	}
}
.table-striped > tbody > tr:nth-of-type(odd) > * {
	--bs-table-bg-type: var(--color-lightgray);
  border-bottom: 0;
}


.form-section {
	.scroll-next {
		display: none;
	}

	> .container {
		padding-top: 0 !important;
		padding-inline: initial;
	}

	select.form-control {
		--bs-form-select-bg-img: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
		-webkit-appearance: none;
		-moz-appearance: none;
		appearance: none;
		background-color: var(--bs-body-bg);
		background-image: var(--bs-form-select-bg-img),var(--bs-form-select-bg-icon,none);
		background-repeat: no-repeat;
		background-position: right .75rem center;
		background-size: 16px 12px;
	}

	.card {
		border: none;

		.card-body {
			padding: initial;
		}

		.question {
			padding-bottom: 0 !important;
		}

		.invest-experience-title {
			display: none;
		}

		.net-worth-question,
		.years-of-investment-question {
			margin-bottom: 2rem !important;
		}
	}

	@media (width < 576px) {
		.card {
			.form-row {
				flex-wrap: wrap;
				row-gap: 1rem;
				.col-md-6 {
					width: 100%;
				}
			}
			.form-group.row {
				margin-bottom: 1rem !important;
			}
		}
	}
}