.form-flids input, .form-flids select, .form-flids textarea {
	height: 45px;
	padding: 15px;
	border-width: 0 0 2px;
	border-image: initial;
	border: 1px solid rgb(211 211 211);
	border-radius: 8px;
}

.form-flids textarea {
    height: 100px
}

.form-flids input, .form-flids select, .form-flids textarea {
	color: #172b43;
	font-size: 17px;
	width: 100%;
	margin: 0 0 20px;
	background: var(--bs-white);
	outline: 0;
}
.form-flids input::placeholder, .form-flids select::placeholder, .form-flids textarea::placeholder {
color: #acacac;
	font-size: 16px;
}
.floating-input,
.floating-select {
    font-size: 14px;
    padding: 4px;
    display: block;
    width: 100%;
    height: 45px;
    background-color: transparent;
    border: none;
    border-bottom: 1px solid #c5c5c5
}

.floating-input:focus,
.floating-select:focus {
    outline: none;
    box-shadow: 0 23px 36px #00000029;
    border: 1px solid #b8bdbf
}

label.floating-label {
	color: #110a32;
	font-size: 15px;
	font-weight: 500;
	position: absolute;
	pointer-events: none;
	left: 19px;
	top: 5px;
	transition: .2s ease all;
	-moz-transition: .2s ease all;
	-webkit-transition: .2s ease all;
	margin-bottom: 0;
	padding: 5px;
}

.floating-input:focus ~ label, .floating-input:not(:placeholder-shown) ~ label, .floating-select:focus ~ label, .floating-select:not([value=""]):valid ~ label {
	top: -21px;
	font-size: 12px;
	color: #000;
	width: fit-content;
	padding: 0 4px;
	left: 11px;
}
 

/* Theme Error
====================== */
input.error,
select.error,
textarea.error {
    border-bottom: 1px solid var(--bs-danger)
}

input.valid,
select.valid,
textarea.valid {
    border-bottom: 1px solid var(--bs-success)
}

input.valid,
textarea.valid {
    background-image: url(../image/common/icons/success_icon.webp);
    background-repeat: no-repeat;
    background-position: 98% center;
    background-size: 15px
}
input.valid,
select.valid,
textarea.valid {
    border-bottom: 1px solid var(--bs-success)
}
input.error,
textarea.error {
    background-image: url(../image/common/icons/error_icon.webp);
    background-repeat: no-repeat;
    background-position: 98% center;
    background-size: 15px
}

textarea.error,
textarea.valid {
    background-position-x: 98%;
    background-position-y: 10px
}

.form-flids input, .form-flids select, .form-flids textarea {
	padding: 8px 30px 10px 15px;
}
.error {
	position: relative;
	margin-top: -20px;
	margin-bottom: 10px;
} 