input.input,
textarea.input {
    border: 1.5px solid #ecedec;
    border-radius: 10px;
    display: flex;
    align-items: center;
    padding-left: 10px;
    padding-right: 10px;
    transition: 0.2s all ease-in-out;
}

input.input {
    height: 50px;
}

input.input.fullWidth,
textarea.input.fullWidth {
    width: 100%;
}

input.input[type="date"] {
    position: relative;
    box-sizing: border-box;
}

input.input[type="date"]::-webkit-calendar-picker-indicator {
    position: absolute;
    right: 10px;
    cursor: pointer;
}

input.input[type="date"]::-webkit-datetime-edit {
    color: rgb(200, 200, 200);
}

input.input[type="file"] {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}

input.input[type="file"]::file-selector-button {
    font-weight: normal;
    border: none;
    background: rgba(var(--color-muted-var), 0.2);
    vertical-align: middle;
    align-self: center;
    height: 100%;
    margin-left: -10px;
}

input.input[data-type="money"] {
    text-align: start;
}

input.input.end[data-type="money"] {
    text-align: end;
}

input.input[data-type="money"]::placeholder {
    text-align: start;
}

input.input:focus-within,
textarea.input:focus-within {
    border: 1.5px solid var(--color-primary);
}

textarea.input {
    padding-top: 10px;
    padding-bottom: 10px;
    resize: none;
    min-height: 100px;
}

div.form-control {
    position: relative;
    display: flex;
    flex-direction: row;
    align-items: center;
    width: 100%;
}

div.form-control input.input {
    flex-grow: 1;
    width: 100%;
}

div.form-control div.adornment {
    position: absolute;
}

div.form-control div.adornment[data-position="start"] {
    left: 10px;
}

div.form-control div.adornment[data-position="end"] {
    right: 10px;
}

div.form-control input.input[data-adornment="start"],
div.form-control input.input[data-adornment="both"] {
    padding-left: 40px;
}

div.form-control input.input[data-adornment="end"],
div.form-control input.input[data-adornment="both"] {
    padding-right: 40px;
}

div.form-group {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

input.input.valid,
div.form-group.valid input.input,
textarea.input.valid,
div.form-group.valid textarea.input {
    border: 1.5px solid #66bb6a;
}

input.input.valid:focus-within,
div.form-group.valid input.input:focus-within,
textarea.input.valid:focus-within,
div.form-group.valid textarea.input:focus-within {
    outline: 0.5px solid #66bb6a;
}

input.input.invalid,
div.form-group.invalid input.input,
textarea.input.invalid,
div.form-group.invalid textarea.input {
    border: 1.5px solid #f44336;
}

input.input.invalid:focus-within,
div.form-group.invalid input.input:focus-within,
textarea.input.invalid:focus-within,
div.form-group.invalid textarea.input:focus-within {
    outline: 0.5px solid #f44336;
}

div.form-group.valid div.helper-text {
    color: #66bb6a;
}

div.form-group.invalid div.helper-text {
    color: #f44336;
}
