.input-container {
    position: relative;
    flex: 1 1 auto;
    display: flex;
    align-items: center;
}

    .input-container .icon {
        position: absolute;
        cursor: pointer;
        z-index: 10;
        color: #888;
    }


    .input-container .close-icon {
        right: 10px;
        top: 50%;
        transform: translateY(-50%);
        display: none; /* Esconde o ícone inicialmente */
    }

    .input-container input {
        width: 100%;
        padding: 10px 30px; /* Espaço para os ícones */
        box-sizing: border-box; /* Para incluir o padding no tamanho total do input */
        border-radius: 0 10px 10px 0;
    }

        .input-container input:not(:placeholder-shown) ~ .close-icon {
            display: inline; /* Mostra o ícone quando o campo não está vazio */
        }