docs: fix header and tabs on docs pages

1. Header: on docs pages, use the theme's standard header (text title +
   search) instead of the branded logo header. The homepage keeps the
   logo + 'Docs' link + GitHub icon. Removed replacesTitle so docs
   pages show 'Sentry CLI' as text, not the logo SVG.

2. Tabs: updated PackageManagerCode tabs from underline-style to the
   theme's pill-style (rounded, purple accent background on active tab)
   to match Starlight tab styling from @sentry/starlight-theme.

Author: sentry-junior[bot]

docs/astro.config.mjs

@@ -49,7 +49,6 @@ export default defineConfig({
       favicon: "/favicon.png",
       logo: {
         src: "./src/assets/logo.svg",
-        replacesTitle: true,
       },
       social: [
         {

docs/src/components/Header.astro

@@ -1,42 +1,55 @@
 ---
 /**
- * CLI-specific Header — extends the shared theme's Header pattern
- * with homepage detection, "Docs" nav link, and social icons.
+ * CLI-specific Header — conditionally renders:
+ * - Homepage: branded header with logo, "Docs" link, social icons, no search
+ * - Docs pages: theme's standard header with search (no logo)
  */
 import config from "virtual:starlight/user-config";
 
+import LanguageSelect from "virtual:starlight/components/LanguageSelect";
 import Search from "virtual:starlight/components/Search";
 import SiteTitle from "virtual:starlight/components/SiteTitle";
 import SocialIcons from "virtual:starlight/components/SocialIcons";
+import ThemeSelect from "virtual:starlight/components/ThemeSelect";
 
 const shouldRenderSearch =
   config.pagefind ||
   config.components.Search !== "@astrojs/starlight/components/Search.astro";
 
-// Detect homepage (splash page). In Starlight >=0.33, route data lives on
-// Astro.locals.starlightRoute; the old `slug` field is now `id`.
 const isHomepage = Astro.locals.starlightRoute.id === "";
 
-// Get base path for links
 const baseUrl = import.meta.env.BASE_URL;
 const base = baseUrl.endsWith("/") ? baseUrl : baseUrl + "/";
 ---
 
-<div class:list={["header sentry-header", { "header-homepage": isHomepage }]}>
-  <div class="title-wrapper sl-flex">
-    <SiteTitle />
-  </div>
-  <div class="sentry-header-actions sl-flex print:hidden">
-    {!isHomepage && shouldRenderSearch && <Search />}
-    {isHomepage && (
+{isHomepage ? (
+  <!-- Homepage: branded header -->
+  <div class="header sentry-header header-homepage">
+    <div class="title-wrapper sl-flex">
+      <SiteTitle />
+    </div>
+    <div class="sentry-header-actions sl-flex print:hidden">
       <a href={`${base}getting-started/`} class="header-nav-link">Docs</a>
-    )}
-    {!isHomepage && <span class="header-nav-link header-nav-active">Docs</span>}
-    <div class="sl-hidden md:sl-flex sentry-header-secondary">
-      <SocialIcons />
+      <div class="sl-hidden md:sl-flex sentry-header-secondary">
+        <SocialIcons />
+      </div>
+    </div>
+  </div>
+) : (
+  <!-- Docs pages: theme's standard header with search -->
+  <div class="header sentry-header">
+    <div class="title-wrapper sl-flex">
+      <SiteTitle />
+    </div>
+    <div class="sentry-header-actions sl-flex print:hidden">
+      {shouldRenderSearch && <Search />}
+      <div class="sl-hidden md:sl-flex sentry-header-secondary">
+        <ThemeSelect />
+        <LanguageSelect />
+      </div>
     </div>
   </div>
-</div>
+)}
 
 <style>
   .header-homepage {
@@ -60,13 +73,4 @@ const base = baseUrl.endsWith("/") ? baseUrl : baseUrl + "/";
     opacity: 1;
     background: rgba(255, 255, 255, 0.1);
   }
-
-  .header-nav-active {
-    opacity: 1;
-    cursor: default;
-  }
-
-  .header-nav-active:hover {
-    background: none;
-  }
 </style>

docs/src/components/PackageManagerCode.astro

@@ -51,39 +51,36 @@ const id = `pm-${Math.random().toString(36).substr(2, 9)}`;
   }
 
   .pm-tabs {
-    display: flex;
-    align-items: baseline;
+    display: inline-flex;
+    gap: 0.15rem;
+    border-radius: 8px;
+    background: rgba(255, 255, 255, 0.045);
+    padding: 0.18rem;
   }
 
   .pm-tab {
-    padding: 0.35rem 0.75rem;
-    font-size: 0.8rem;
+    padding: 0.34rem 0.72rem;
+    font-size: 0.82rem;
     font-weight: 500;
-    color: rgba(255, 255, 255, 0.4);
+    color: var(--ve-text-tertiary, rgba(255, 255, 255, 0.4));
     background: none;
     border: none;
+    border-radius: 6px;
     cursor: pointer;
-    transition: color 0.15s ease;
+    transition: background 120ms ease, color 120ms ease;
     font-family: inherit;
-    position: relative;
+    line-height: 1.25;
   }
 
   .pm-tab:hover {
-    color: rgba(255, 255, 255, 0.7);
+    background: rgba(255, 255, 255, 0.055);
+    color: var(--ve-text-secondary, rgba(255, 255, 255, 0.7));
   }
 
   .pm-tab.active {
-    color: #fff;
-  }
-
-  .pm-tab.active::after {
-    content: '';
-    position: absolute;
-    left: 0.75rem;
-    right: 0.75rem;
-    bottom: 0;
-    height: 2px;
-    background: #fff;
+    background: var(--ve-accent-soft, rgba(139, 92, 246, 0.2));
+    color: var(--ve-text, #fafafa);
+    font-weight: 650;
   }
 
   .pm-copy {