From 78fef1ba5fc998f50edfd61d4c5942e0bf193628 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Mathias=20Gla=CC=88ser?= <mathias.glaeser@beaufort.ch>
Date: Tue, 19 May 2026 16:00:12 +0200
Subject: [PATCH] Fix desktop pulldown slider remove button overflow

---
 styleguide.css | 46 ++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 46 insertions(+)

diff --git a/styleguide.css b/styleguide.css
index 4b4bc05..c84f691 100644
--- a/styleguide.css
+++ b/styleguide.css
@@ -969,6 +969,52 @@ section + section {
       opacity: var(--disabled-opacity);
     }
 
+    .sg-pulldown-panel .sg-slider-row[data-activatable="true"] {
+      display: grid;
+      grid-template-columns:
+        var(--layout-input-label-width)
+        minmax(0, 1fr)
+        auto
+        var(--interaction-height);
+      align-items: center;
+      column-gap: var(--spacing-small);
+      padding-right: 0;
+    }
+
+    .sg-pulldown-panel .sg-slider-row[data-activatable="true"] .sg-label {
+      min-width: 0;
+      flex: 0 0 auto;
+      grid-column: 1;
+      grid-row: 1;
+    }
+
+    .sg-pulldown-panel .sg-slider-row[data-activatable="true"] .sg-slider {
+      min-width: 0;
+      max-width: 100%;
+      width: 100%;
+      grid-column: 2;
+      grid-row: 1;
+    }
+
+    .sg-pulldown-panel .sg-slider-row[data-activatable="true"] .sg-slider-value {
+      min-width: calc(var(--interaction-height) * 1.25);
+      justify-self: end;
+      align-self: center;
+      white-space: nowrap;
+      grid-column: 3;
+      grid-row: 1;
+    }
+
+    .sg-pulldown-panel .sg-slider-row[data-activatable="true"] .sg-activatable-remove {
+      position: static;
+      top: auto;
+      right: auto;
+      transform: none;
+      margin-left: 0;
+      grid-column: 4;
+      grid-row: 1;
+    }
+
     @media (max-width: 48rem) {
       #component-slider .sg-state-example {
         grid-template-columns: 1fr;