/* form */

.form-control,
.form-select {
	/* --bs-border-color: var(--color-platinum); */
}

/* disabled input -- lighter styles */
.form-control:disabled {
	background-color: var(--bs-tertiary-bg);
}

.form-floating>.form-control:disabled ~ label::after {
	background-color: var(--bs-tertiary-bg);
}



.form-select--compact {
	background-position: right .5rem center;
	white-space: nowrap;
	text-overflow: ellipsis;
}


.form-check--xs,
.form-check--sm,
.form-check--base,
.form-check--md,
.form-check--lg,
.form-check--xl {
	display: flex;
	align-items: center;
	padding-left: 0;
	min-height: unset;
}

.form-check--xs,
.form-check--sm {
	gap: .25rem;
}

.form-check--base,
.form-check--md {
	gap: .5rem;
}

.form-check--lg,
.form-check--xl {
	gap: 1rem;
}

.form-check--xs .form-check-input,
.form-check--sm .form-check-input,
.form-check--base .form-check-input,
.form-check--md .form-check-input,
.form-check--lg .form-check-input,
.form-check--xl .form-check-input {
	margin: 0;
	float: none;
}

.form-check--xs .form-check-input {
	height: .75rem;
	width: .75rem;
}

.form-check--sm .form-check-input {
	height: .875rem;
	width: .875rem;
}

.form-check--base .form-check-input {
	height: 1rem;
	width: 1rem;
}


.form-check--md .form-check-input {
	height: 1.25em;
	width: 1.25em;
}

.form-check--lg .form-check-input {
	height: 1.5em;
	width: 1.5em;
}

.form-check--xl .form-check-input {
	height: 2em;
	width: 2em;
}

.form-check--xs .form-check-label,
.form-check--sm .form-check-label,
.form-check--base .form-check-label,
.form-check--md .form-check-label,
.form-check--lg .form-check-label {
	line-height: 1;
}

.form-check--base .form-check-label {
	font-size: 1rem;
}

.form-check--md .form-check-label,
.form-check--lg .form-check-label,
.form-check--xl .form-check-label {
	font-size: 1.125rem;
}

.form-check--input-only {
	display: block;
}

.form-check-input:checked {
	background-color: var(--brand-light);
	border-color: var(--brand-light);
}

/* form-switch */

.form-switch--md {
	display: flex;
	gap: 0.5rem;
	align-items: center;
	padding-left: 0;
}

.form-switch--md .form-check-input {
	margin: 0;
    float: none;
	height: 1.25rem;
	width: 2.25rem;
}

.form-switch--md .form-check-label {
	font-size: 1.125rem;
	line-height: 1;
}

/* form remove appearance */

.form-control.form-control--remove-appearance::-webkit-outer-spin-button,
.form-control.form-control--remove-appearance::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

.form-control.form-control--remove-appearance[type=number] {
	-moz-appearance: textfield;
}

/* form control plaintext */

.form-control-plaintext--styled {
	background-color: var(--bs-light);
	border: var(--bs-border-width) solid var(--bs-border-color);
	border-radius: var(--bs-border-radius);
}

.form-floating > .form-control-plaintext--styled ~ label::after {
	background: transparent;
}

/* warning variation (similar to is-invalid) */

.form-control.is-warning,
.form-select.is-warning {
    border-color: var(--bs-warning);
    padding-right: calc(1.5em + .75rem);
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23ffc107'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23ffc107' stroke='none'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right calc(.375em + .1875rem) center;
    background-size: calc(.75em + .375rem) calc(.75em + .375rem);
}

.form-control.is-warning:focus,
.form-select.is-warning:focus {
    border-color: var(--bs-warning);
    box-shadow: 0 0 0 .25rem rgba(var(--bs-warning-rgb), .25);
}


textarea.form-control {
  --base-height: 37px;
  --row-height: 20px;
}

textarea.form-control[rows="2"] {
  /* Expected: 37 + 20*2 = 77px */
  min-height: calc(var(--base-height) + var(--row-height) * 2);
}

textarea.form-control[rows="3"] {
  /* Expected: 37 + 20*3 = 97px */
  min-height: calc(var(--base-height) + var(--row-height) * 3);
}

textarea.form-control[rows="4"] {
  /* Expected: 37 + 20*4 = 117px */
  min-height: calc(var(--base-height) + var(--row-height) * 4);
}

textarea.form-control[rows="5"] {
  /* Expected: 37 + 20*5 = 137px */
  min-height: calc(var(--base-height) + var(--row-height) * 5);
}