fix(panel): tools tab non-draggable and always shows icon+text

- Make the default panel (Tools) tab non-draggable: set draggable="false"
  on the tab, reject dragstart on it, and reject it as a drop target
- Add bottom-panel-tab-default class to identify the Tools tab in CSS
- Always show the icon alongside the title for the Tools tab in both
  expanded and collapsed modes (other tabs show icons only when collapsed)
- In collapsed mode, the Tools tab keeps its natural width with title
  visible instead of collapsing to a fixed icon-only width

Author: abose

src/styles/Extn-BottomPanelTabs.less

@@ -166,6 +166,13 @@
     display: none;
 }
 
+/* Default panel (Tools) tab: always show the icon alongside the title,
+   in both expanded and collapsed modes, active or inactive. */
+.bottom-panel-tab.bottom-panel-tab-default .bottom-panel-tab-icon {
+    display: inline-flex;
+    margin-right: 0.4rem;
+}
+
 .default-panel-btn .panel-titlebar-icon {
     width: 20px;
     height: 20px;
@@ -240,6 +247,15 @@
     .bottom-panel-tab:not(.active) .bottom-panel-tab-close-btn {
         display: none;
     }
+    /* Default panel (Tools) tab: keep natural width and show its title
+       even in collapsed mode (other tabs collapse to icon-only). */
+    .bottom-panel-tab.bottom-panel-tab-default {
+        min-width: auto;
+        justify-content: flex-start;
+    }
+    .bottom-panel-tab.bottom-panel-tab-default .bottom-panel-tab-title {
+        display: inline;
+    }
 }
 
 .bottom-panel-tab-close-btn {
@@ -301,8 +317,15 @@
     font-size: 0.82rem;
     flex: 0 0 auto;
     white-space: nowrap;
+    user-select: none;
+    -webkit-user-drag: none;
     transition: color 0.12s ease, background-color 0.12s ease;
 
+    img {
+        -webkit-user-drag: none;
+        pointer-events: none;
+    }
+
     .dark & {
         color: #777;
     }

src/view/PanelView.js

@@ -149,7 +149,11 @@ define(function (require, exports, module) {
      */
     function _buildTab(panel, isActive) {
         let title = panel._tabTitle || _getPanelTitle(panel.panelID, panel.$panel);
-        let $tab = $('<div class="bottom-panel-tab" draggable="true"></div>')
+        // Default panel (Tools) tab is not draggable — it's a fixed slot, not a user tab
+        const isDefault = panel.panelID === _defaultPanelId;
+        let $tab = $('<div class="bottom-panel-tab"></div>')
+            .toggleClass('bottom-panel-tab-default', isDefault)
+            .attr('draggable', isDefault ? 'false' : 'true')
             .toggleClass('active', isActive)
             .attr('data-panel-id', panel.panelID);
         const iconSrc = panel._options.iconSvg || "styles/images/panel-icon-default.svg";
@@ -288,6 +292,11 @@ define(function (require, exports, module) {
         }
 
         _$tabBar.on("dragstart", ".bottom-panel-tab", function (e) {
+            // Default panel (Tools) tab is never draggable
+            if ($(this).data("panel-id") === _defaultPanelId) {
+                e.preventDefault();
+                return;
+            }
             draggedTab = this;
             e.originalEvent.dataTransfer.effectAllowed = "move";
             e.originalEvent.dataTransfer.setData("application/x-phoenix-panel-tab", "1");
@@ -302,6 +311,10 @@ define(function (require, exports, module) {
             if (!draggedTab || this === draggedTab) {
                 return;
             }
+            // Don't allow dropping onto the default panel (Tools) tab
+            if ($(this).data("panel-id") === _defaultPanelId) {
+                return;
+            }
             e.preventDefault();
             e.originalEvent.dataTransfer.dropEffect = "move";
             _$tabBar.find(".bottom-panel-tab").removeClass("drag-target");
@@ -766,8 +779,8 @@ define(function (require, exports, module) {
         _defaultPanelId = defaultPanelId;
 
         // Create the "Tools" button inside the scrollable tabs area.
-        _$addBtn = $('<span class="bottom-panel-add-btn" title="' + Strings.BOTTOM_PANEL_DEFAULT_TITLE + '">'
-            + '<img class="app-drawer-tab-icon" src="styles/images/app-drawer.svg"'
+        _$addBtn = $('<span class="bottom-panel-add-btn" draggable="false" title="' + Strings.BOTTOM_PANEL_DEFAULT_TITLE + '">'
+            + '<img class="app-drawer-tab-icon" draggable="false" src="styles/images/app-drawer.svg"'
             + ' style="width:12px;height:12px;vertical-align:middle;margin-right:4px">'
             + Strings.BOTTOM_PANEL_DEFAULT_TITLE + '</span>');
         _$tabsOverflow.append(_$addBtn);