Revert "Merge remote-tracking branch 'origin/hide-closebutton-at-pinn…

…ed' #10"

This reverts commit 8fefe8a, reversing
changes made to e30cf6f.

userChrome.css

@@ -419,6 +419,51 @@
     margin-left: 0px !important;
   }
 
+  /** Pinned Tab - Replace Favicon to Close Button at Selected ****************/
+  .tabbrowser-tab[pinned][visuallyselected]:not([busy]) .tab-close-button {
+    display: -moz-box !important;
+    -moz-box-ordinal-group: 0 !important;
+    transform: translateX(-1px);
+
+    /* Looks like hover */
+    width: 24px !important;
+    height: 24px !important;
+    padding: 7px !important;
+  }
+  .tabbrowser-tab[pinned][visuallyselected] .tab-icon-image {
+    display: none !important;
+  }
+
+  /* Left Padding - Assume the icon size is 17px */
+  .tabbrowser-tab[pinned][visuallyselected]:not([busy]) .tab-content {
+    padding-inline: 7.5px !important; /* Original: 10px */
+  }
+
+  /* Right Padding - Assume the icon size is 17px */
+  .tabbrowser-tab[pinned][visuallyselected]:not([busy]) .tab-icon-stack {
+    width: 8.5px !important;
+  }
+  .tabbrowser-tab[pinned][visuallyselected]:not([busy]) .tab-content {
+    padding-inline-end: 0px !important;
+  }
+
+  .tabbrowser-tab[pinned][visuallyselected][busy] .tab-content {
+    padding-inline-end: 9.5px !important;
+  }
+  .tabbrowser-tab[pinned][busy] .tab-content {
+    padding-inline: 10.5px !important;
+  }
+
+  /* Sound Tab - Don't move overlay */
+  .tabbrowser-tab[pinned][busy] .tab-icon-overlay:is([soundplaying], [muted], [activemedia-blocked]) {
+    transform: translateX(.5px) translateY(-2px) !important;
+  }
+
+  .tabbrowser-tab[pinned][visuallyselected]:not([busy]) .tab-icon-overlay {
+    transform: translateX(-9px) translateY(-2px) !important;
+    left: 0 !important;
+  }
+
   /** Container Tab - Color line at icon's bottom *****************************/
   .tab-context-line {
     display: none;
@@ -431,6 +476,27 @@
     border-bottom: 2px solid var(--identity-icon-color);
   }
 
+  /* None exist favicon & Pinned to select */
+  .tabbrowser-tab:not([image]):not([pinned], [sharing], [crashed]):not([soundplaying], [muted], [activemedia-blocked]) .tab-content::before,
+  .tabbrowser-tab[pinned][visuallyselected]:not([busy]):not(:hover) .tab-content::before {
+    /* Box Model */
+    content: '';
+    display: block;
+    position: absolute !important;
+    transition: 0.2s !important;
+    transform: translateY(10px) !important;
+
+    /* Shape */
+    border-bottom: 2px solid var(--identity-icon-color);
+    width: 16px;
+  }
+  .tabbrowser-tab:not([image]):not([pinned], [sharing], [crashed]):not([soundplaying], [muted], [activemedia-blocked]) .tab-content::before {
+    transform: translateY(10px) !important; /* None exist favicon */
+  }
+  .tabbrowser-tab[pinned][visuallyselected]:not([busy]):not(:hover) .tab-content::before {
+    transform: translateX(2.5px) translateY(10px) !important; /* Pinned to select */
+  }
+
   /* None exist favicon - With Sound */
   .tabbrowser-tab:not([image]) .tab-icon-overlay:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) {
     box-sizing: content-box;