.custom-inputs {
    display: flex;
    flex-direction: column;
    position: relative;
}

.custom-inputs label.custom-label {
    font-size: 0.75rem !important;
    font-weight: 700 !important;
    position: absolute !important;
    top: -0.5rem !important;
    margin: 0 0 0 7px !important;
    padding: 0 3px !important;
    background: white !important;
    width: fit-content !important;
    z-index: 5 !important;
}

.custom-inputs input.custom-input,
.custom-inputs select.custom-input,
.custom-inputs textarea.custom-input {
    padding: 8px 10px !important;
    font-size: 0.85rem !important;
    border: 1px #d5d3d3 solid !important;
    border-radius: 5px !important;
}

.custom-inputs input.custom-input:focus,
.custom-inputs select.custom-input:focus,
.custom-inputs textarea.custom-input:focus {
    outline: none !important;
    border-color: #afafaf !important;
    box-shadow: 1px 1px 5px rgba(0, 123, 255, 0.1) !important;
    transition: all 0.3s ease-in-out !important;
}

/*inputs com icone*/
.custom-inputs input.ci-icon {
    padding: 8px 10px !important;
    font-size: 0.85rem !important;
    border: 1px #d5d3d3 solid !important;
    border-right: none !important;
    border-radius: 5px 0px 0px 5px !important;
}

.custom-inputs div.custom-input-icon {
    padding: 8px 10px !important;
    font-size: 0.85rem !important;
    border: 1px #d5d3d3 solid !important;
    border-left: none !important;
    border-radius: 0px 5px 5px 0px !important;
    background-color: white !important;
    color: gray;
}

.custom-inputs div.custom-input-icon:hover {
    color: #0d6efd;
    box-shadow: 1px 1px 5px rgba(0, 123, 255, 0.1) !important;
    transition: all 0.3s ease-in-out !important;
}

.custom-inputs input.ci-icon:focus,
.custom-inputs input.ci-icon:focus + div.custom-input-icon {
    outline: none !important;
    border-color: #afafaf !important;
    box-shadow: 0 0 5px rgba(0, 123, 255, 0.1) !important;
    transition: all 0.3s ease-in-out !important;
    z-index: 4 !important;
}

input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0px 1000px white inset !important;
    -webkit-text-fill-color: inherit !important;
    transition: background-color 5000s ease-in-out 0s;
}

.custom-inputs input:-webkit-autofill,
.custom-inputs input:-webkit-autofill:hover, 
.custom-inputs input:-webkit-autofill:focus,
.custom-inputs input:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0px 1000px white inset !important;
    -webkit-text-fill-color: inherit !important;
    box-shadow: inherit !important;
    border-color: #d5d3d3 !important;
    transition: background-color 5000s ease-in-out 0s !important;
    font-size: 0.85rem !important;
    background-clip: content-box !important;
}

.custom-inputs input:autofill {
    background-color: white !important;
    border-color: #d5d3d3 !important;
    color: inherit !important;
    font-size: 0.85rem !important;
}

.disabled {
    pointer-events: none;
    opacity: 0.5;
}