Sync styleguide 2026.05.18.1

docs/styleguide/styles/21-patterns-options-row.css

@@ -18,6 +18,7 @@
   --layout-help-panel-width: var(--layout-options-row-help-panel-width);
   margin-top: var(--layout-options-row-margin-top);
   display: flex;
+  min-width: 0;
   justify-content: space-between;
   gap: var(--layout-options-row-main-gap);
   padding:
@@ -36,6 +37,7 @@
 .sg-options-row__left,
 .sg-options-row__right {
   display: flex;
+  min-width: 0;
   flex-wrap: wrap;
   gap: var(--layout-options-row-group-gap);
   align-items: center;
@@ -55,6 +57,11 @@
   flex: 0 0 auto;
 }
 
+.sg-options-row__left > .sg-pulldown-demo {
+  min-width: 0;
+  box-sizing: border-box;
+}
+
 @media (max-width: 48rem) {
   .sg-options-row {
     flex-direction: column;
@@ -109,6 +116,21 @@
   .sg-options-row__left > .sg-input-single-line-wrap .sg-input-single-line,
   .sg-options-row__left > .sg-pulldown-demo .sg-pulldown {
     width: 100%;
+    min-width: 0;
+    max-width: 100%;
+    box-sizing: border-box;
+  }
+
+  .sg-options-row__left > .sg-pulldown-demo {
+    width: 100%;
+    max-width: 100%;
+  }
+
+  .sg-options-row .sg-pulldown-panel {
+    width: 100%;
+    min-width: 0;
+    max-width: 100%;
+    box-sizing: border-box;
   }
 
   .sg-options-row[data-pattern="multiselektions-pulldown"] .sg-pulldown-panel {