style: fix TextArea custom border style not working

when allowClear is enable

close #38068

components/input/demo/borderless-debug.md

@@ -1,14 +1,14 @@
 ---
 order: 98
 title:
-  zh-CN: Borderless Debug
-  en-US: Borderless Debug
+  zh-CN: Style Debug
+  en-US: Style Debug
 debug: true
 ---
 
 ## zh-CN
 
-Buggy!
+Buggy! 测试一些踩过的样式坑。
 
 ## en-US
 
@@ -29,6 +29,7 @@ const App: React.FC = () => (
     <Input placeholder="Unbordered" bordered={false} allowClear />
     <Input prefix="￥" suffix="RMB" bordered={false} />
     <Input prefix="￥" suffix="RMB" disabled bordered={false} />
+    <TextArea allowClear style={{ border: '2px solid #000' }} />
   </div>
 );
 

components/input/style/affix.less

@@ -28,8 +28,7 @@
       }
     }
 
-    > input.@{ant-prefix}-input {
-      padding: 0;
+    > .@{ant-prefix}-input {
       font-size: inherit;
       border: none;
       outline: none;
@@ -37,6 +36,10 @@
       &:focus {
         box-shadow: none !important;
       }
+
+      &:not(textarea) {
+        padding: 0;
+      }
     }
 
     &::before {

components/input/style/allow-clear.less

@@ -2,8 +2,8 @@
 @input-prefix-cls: ~'@{ant-prefix}-input';
 
 // ========================= Input =========================
-.@{iconfont-css-prefix}.@{ant-prefix}-input-clear-icon,
-.@{ant-prefix}-input-clear-icon {
+.@{iconfont-css-prefix}.@{input-prefix-cls}-clear-icon,
+.@{input-prefix-cls}-clear-icon {
   margin: 0;
   color: @disabled-color;
   font-size: @font-size-sm;
@@ -31,11 +31,10 @@
 }
 
 // ======================= TextArea ========================
-.@{ant-prefix}-input-affix-wrapper-textarea-with-clear-btn {
-  padding: 0 !important;
-  border: 0 !important;
+.@{input-prefix-cls}-affix-wrapper.@{input-prefix-cls}-affix-wrapper-textarea-with-clear-btn {
+  padding: 0;
 
-  .@{ant-prefix}-input-clear-icon {
+  .@{input-prefix-cls}-clear-icon {
     position: absolute;
     top: 8px;
     right: 8px;