UX: General chat composer tweaks (#21639)

- prevent hover on disabled state
- more contrast between focus and not focus for send button

plugins/chat/assets/stylesheets/common/chat-composer-dropdown.scss

@@ -6,6 +6,17 @@
   }
 }
 
+.chat-composer.is-disabled {
+  .no-touch & {
+    .chat-composer-dropdown__trigger-btn:hover {
+      cursor: default;
+      .d-icon {
+        color: var(--primary-low-mid);
+      }
+    }
+  }
+}
+
 .chat-composer-dropdown__trigger-btn {
   .d-icon {
     padding: 5px;
@@ -13,6 +24,10 @@
     color: var(--primary-high);
     background: var(--secondary-very-high);
     border-radius: 100%;
+
+    .is-disabled & {
+      color: var(--primary-low-mid);
+    }
   }
 
   .no-touch & {

plugins/chat/assets/stylesheets/common/chat-composer.scss

@@ -73,6 +73,12 @@
       }
     }
 
+    .chat-composer.is-focused.is-send-disabled & {
+      .d-icon {
+        color: var(--primary-high);
+      }
+    }
+
     .chat-composer.is-sending & {
       animation: sendingScales 1s infinite linear;
     }
@@ -101,7 +107,7 @@
       cursor: default;
 
       .d-icon {
-        color: var(--primary-high);
+        color: var(--primary-low-mid);
       }
 
       &:hover {
@@ -127,7 +133,6 @@
     align-items: center;
     box-sizing: border-box;
     width: 100%;
-    padding: 0 5px;
     align-self: stretch;
   }