From b9406728d301b06e10e367ad66877ed4b606dc1b Mon Sep 17 00:00:00 2001
From: mauro-balades <mauro.balades@tutanota.com>
Date: Sun, 22 Sep 2024 20:38:07 +0200
Subject: [PATCH] Fix vertical tabs styling issue with pinned tabs container

---
 .../zen-styles/zen-tabs/vertical-tabs.css     | 19 +++++++++++++++----
 1 file changed, 15 insertions(+), 4 deletions(-)

diff --git a/src/browser/base/content/zen-styles/zen-tabs/vertical-tabs.css b/src/browser/base/content/zen-styles/zen-tabs/vertical-tabs.css
index 643971f6c..05f3db0ba 100644
--- a/src/browser/base/content/zen-styles/zen-tabs/vertical-tabs.css
+++ b/src/browser/base/content/zen-styles/zen-tabs/vertical-tabs.css
@@ -293,10 +293,21 @@
       display: none !important;
     }
 
-    &:has(#newtab-button-container tab:not([hidden])) #vertical-pinned-tabs-container {
-      padding-bottom: 5px !important;
-      margin-bottom: 5px !important;
-      border-bottom: 1px solid var(--zen-colors-border) !important;
+    & #vertical-pinned-tabs-container:has(tab:not([hidden])) {
+      margin-bottom: 8px;
+      position: relative;
+
+      &::after {
+        bottom: -4px;
+        content: '';
+        display: block;
+        height: 1px;
+        background: color-mix(in srgb, var(--zen-colors-border) 80%, transparent 20%);
+        width: 70%;
+        left: 50%;
+        transform: translateX(-50%);
+        position: absolute;
+      }
     }
 
     & #zen-workspaces-button[as-button='true']::after {