.grecaptcha-badge { visibility: hidden; }

form {
	width: 100%;
	display: block;
	grid-template-columns: repeat(auto-fit,minmax(9rem,1fr));
	line-height: 1;
}

form .row {
	display: flex;
	flex-wrap: wrap;
	gap: 2rem;
}

:where(form:has(.dm-in) .row) > :where(*) {
	min-width: 13rem;
	flex-grow: 1;
}

form [class*='col-']:not(.dm-in) {
	margin-bottom: 3rem;
}

:first-child:is(h2,h3,h4) {
	margin-top: 0;
}

form :is(h1,h2,h3,h4) {
	grid-column: 1 / -1 !important;
	margin-top: calc((1.8em - 1rem) * 2);
	margin-bottom: .5em;
}

form h4 em { font-weight: normal; }

form :is(select,input,optgroup) {
	line-height: 1.15;
}

form label.opt {
	justify-content: space-between;
	width: 100%;
	gap: .5rem;
}

form .req::after,
.dm-in:not(.c):where(:has(:is(input,select,textarea)[required])) .label::after {
	font-size: 1rem;
	line-height: 1px;
	margin-inline: 2px;
	position: relative;
	display: inline-block;
	content: "*";
	color: var(--red);
	font-weight: bold;
}

form .err {
	color: var(--red);
}

form button.primary:last-of-type {
	margin-top: 2rem;
	margin-bottom: 1rem;
}

/* ALL INPUTS */

.dm-in, form :is(.address,.first-last,.phone-email) {
	max-width: 60rem;
}

.dm-in {
	position: relative;
	margin-top: 1rem;
}

form label {
	display: flex;
}

.dm-in:is(.t, .ta, .s) .label,
.dm-in.c legend.label {
	/* display: inline-block; */
	padding-inline: calc(var(--radius) * .5);
	margin-bottom: .3rem;

	.dm-in:not(.ta) & {
		display: inline-block;
	}
}

.dm-in .ring {
	position: relative;
	border-color: var(--back-3);
	--offset: 0;
	transition-duration: .15s;
	transition-timing-function: ease-out;
	border-radius: var(--radius);
	/* border-top-left-radius: 0; */
}

.dm-in .ring::before {
	content: "";
	display: block;
	position: absolute;
	top: var(--offset);
	bottom: var(--offset);
	left: var(--offset);
	right: var(--offset);
	border-width: var(--border-1);
	border-style: solid;
	border-color: inherit;
	transition: inherit;
	border-radius: inherit;
	z-index: -1;
}

.dm-in:is(:hover,:focus-within) {
	z-index: 2;
}

.dm-in:is(.t,.c):is(:hover,:focus-within) .ring {
	border-color: var(--blue);
	--offset: calc(-1 * var(--border-1));
	--offset: 0;
}

.dm-in:is(.disabled, :has(:is(input,select,textarea):disabled)) {
	pointer-events: none;
	color: var(--text-2);

	&:is(.t, .c) .ring,
	& select {
		border-color: hsl(from var(--text-1) h s l / 5%);
		background: hsl(from var(--text-1) h s l / 5%);
	}
}

.dm-in:has(.error:not(:empty)):not(:focus-within) {
	& .ring {
		border-color: var(--text-0);
	}
}

.dm-in .error {
	color: var(--red);
}

/* CHECK STYLE INPUTS */

fieldset.dm-in.c {
	border: none;
	padding: 0;
	margin-inline: 0;
}

.dm-in.c {
	&:has(input[type=radio]) + :has(input[type=radio]),
	&:has(input[type=checkbox]) + :has(input[type=checkbox]) {
		&.dm-in.c:not(fieldset) {
			margin-top: calc(var(--border-1) * -.5);
		}
	}
}

.dm-in.c .ring {
	align-items: start;
	border-color: transparent;
	display: flex;
	min-height: var(--min-button);
	margin-block: 0;
	padding-block: calc(0.5 * (var(--min-button) - 1rem - 6px));
	width: 100%;

	&:not(:hover) {
		border-color: transparent;
		--offset: 0;
	}

	& .label {
		padding-block: 3px;
		padding-inline-end: .75rem;
	}
}

.dm-in.c input {
	width: 1rem;
	height: 1rem;
	margin-inline: 0.75rem 0.5rem;
	transform: scale(1.1);
}

.dm-in.c.dm-toggle-buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;

	& > .label,
	& > .error {
		width: 100%;
	}

	& > .ring {
		width: max-content;
		color: var(--text-2);
		padding-inline: 1rem;
		gap: 0.5rem;

		&::after {
			background: var(--back);
			content: "+";
			display: inline-block;
			order: -1;
			transform: translateY(-0.09em) scale(130%);
			line-height: 0.6em;
		}

		& input {
			display: none;
		}

		& .label {
			padding: 0;
			font-weight: bold;
			padding-right: 0;
		}

		&:not(:hover) {
			border-color: var(--back-3);
		}

		&:has(:checked) {
			border-color: var(--blue);
			color: var(--blue);

			&::after {
				transform: translateY(-0.09em) scale(150%) rotate(45deg);
				order: unset;
			}
		}
	}
}

/* TEXT STYLE INPUTS */

.dm-in.t:hover .ring::before,
.dm-in.ta textarea:hover {
	box-shadow: var(--shadow-inset);
}

.dm-in.t input {
	border: 0;
	outline: none;
	padding-block: .5em;
	min-height: var(--min-button);
	width: 100%;
	background: none;
	z-index: 2;
	padding-inline: .75rem;
}

/* SPECIFIC INPUT TYPES */

.dm-in textarea,
.dm-in select {
	width: 100%;
	max-width: 40rem;
	border: var(--border);
	border-radius: var(--radius);
	transition-duration: .15s;
	transition-timing-function: ease-out;
}

.dm-in textarea {
	resize: vertical;
	width: 100%;
	min-height: calc(
		var(--min-button) * 2
		+ 1rem
		+ var(--font-size-mini)
		+ var(--border-1) * 4);
	padding: .5rem .75rem;
}

.dm-in.s {
	max-width: max-content;
}

.dm-in.s .caret {
	--size: calc(var(--min-button) - (var(--border-1) * 2));
	position: absolute;
	bottom: var(--border-1);
	right: var(--border-1);
	border-radius: var(--radius);
	height: var(--size);
	background: linear-gradient(to right, #0000, var(--back-1) 1rem);
	color: var(--text-3);
	display: grid;
	align-items: center;
	justify-items: end;
	padding-inline: 1.5rem .5rem;
	pointer-events: none;
}

.dm-in select {
	padding-block: .25rem;
	padding-inline: .75rem 1.5rem;
	min-height: var(--min-button);
	/* border-top-left-radius: 0; */
	/* min-width: max-content; */
}

.dm-in textarea:not(:is(:focus, :hover)),
.dm-in:not(:is(:focus-within,:hover)) select {
	border-color: var(--back-3);
}

.dm-in textarea:hover,
.dm-in:hover select {
	box-shadow: var(--shadow);
}

/* COMMON INPUT GROUPS */

form .phone-email,
form .first-last {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
}

form .phone-email .email {
	flex: 2;
}

form .phone-email .phone {
	min-width: calc(1.5rem + 13ch);
	flex: 1;
}

form .address {
	display: flex;
	flex-wrap: wrap;
}
form .address .street {
	flex: 4;
	min-width: calc(1.5rem + 20ch);
}
form .address .city {
	flex: 2;
	min-width: calc(1.5rem + 10ch);
}
/* form .address .state {
	flex: 0 1 auto;
} */
form .address .zip {
	/* flex: 1; */
	width: calc(1.5rem + 6ch);
}
form .address .dm-in {
	margin-right: calc(var(--border-1) * -1);
}