fix(input,label): correct validation state attribute handling in text inputs and refine label description icon styling

ts_web/elements/00group-layout/dees-label/dees-label.ts

@@ -67,11 +67,26 @@ export class DeesLabel extends DeesElement {
         margin-left: 2px;
       }
 
-      dees-icon {
-        font-size: 12px;
-        margin-left: 4px;
+      .description-icon {
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        width: 24px;
+        height: 24px;
+        margin: -6px 0 -6px 2px;
+        border-radius: 4px;
+        cursor: default;
+        transition: background 0.15s ease, color 0.15s ease;
         color: ${cssManager.bdTheme('hsl(0 0% 45.1%)', 'hsl(0 0% 63.9%)')};
-        cursor: help;
+      }
+
+      .description-icon:hover {
+        background: ${cssManager.bdTheme('hsl(0 0% 0% / 0.06)', 'hsl(0 0% 100% / 0.08)')};
+        color: ${cssManager.bdTheme('hsl(0 0% 25%)', 'hsl(0 0% 80%)')};
+      }
+
+      .description-icon dees-icon {
+        font-size: 14px;
       }
     `,
   ];
@@ -85,7 +100,9 @@ export class DeesLabel extends DeesElement {
               ${this.required ? html`<span class="required">*</span>` : ''}
               ${this.description
                 ? html`
-                    <dees-icon .icon=${'lucide:info'}></dees-icon>
+                    <div class="description-icon">
+                      <dees-icon .icon=${'lucide:info'}></dees-icon>
+                    </div>
                     <dees-speechbubble .text=${this.description}></dees-speechbubble>
                   `
                 : html``}