feat(styles): update searchGrid layout for improved responsiveness and control width

ts_web/elements/dees-table/styles.ts

@@ -93,13 +93,24 @@ export const tableStyles: CSSResult[] = [
       .searchGrid {
         display: grid;
         grid-gap: 16px;
-        grid-template-columns: 1fr 200px;
+        grid-template-columns: 1fr minmax(280px, 420px);
         padding: 16px 24px;
         background: ${cssManager.bdTheme('hsl(210 40% 98%)', 'hsl(0 0% 3.9%)')};
         border-bottom: 1px solid ${cssManager.bdTheme('hsl(0 0% 89.8%)', 'hsl(0 0% 14.9%)')};
         transition: all 0.2s ease;
       }
 
+      @media (max-width: 900px) {
+        .searchGrid {
+          grid-template-columns: 1fr;
+        }
+      }
+
+      /* ensure the control fills its column */
+      .searchGrid dees-input-multitoggle {
+        width: 100%;
+      }
+
       .searchGrid.hidden {
         height: 0px;
         opacity: 0;