Penetración de estilo vue3: profunda no tiene efecto

Soy nuevo en vue3, hoy necesito modificar las propiedades del componente el-input (eliminar el borde y el texto a la derecha)

Después de buscar en línea, descubrí que la penetración profunda de estilo generalmente se usa para modificar las propiedades de el-input.
 

<div class="input-container">
                    <el-input placeholder="请输入111"/>
                </div>

<style>
    .input-container :deep(.el-input__wrapper) {
    background-color: #FFFFFF;
    box-shadow: 0 0 0 0;
}

.input-container :deep(.el-input__inner) {
        text-align: right;
    }
</style>

El código anterior no tiene ningún efecto después de ejecutarse.

Finalmente encontré la razón, fue porque mi etiqueta de estilo no tenía el atributo de alcance , el estilo se modificó de la siguiente manera:

<style scoped>

.input-container :deep(.el-input__wrapper) {
    background-color: #FFFFFF;
    box-shadow: 0 0 0 0;
}

.input-container :deep(.el-input__inner) {
        text-align: right;
    }

</style>