Создана кнопка выхода из системы

frontend/src/components/layout/header/Header.astro

@@ -2,6 +2,8 @@
 import Logo from "./Logo.astro";
 import Navbar from "./Navbar.astro";
 import MobileMenu from "./MobileMenu.astro";
+import LoginButton from "./LoginButton.astro";
+import UserMenu from "./UserMenu.astro";
 import { COMPANY } from "@constants";
 ---
 
@@ -20,10 +22,11 @@ import { COMPANY } from "@constants";
       <Navbar />
     </div>
 
-    <!-- Phone -->
+    <!-- Right side -->
     <div class="header-column header-right animate-load" data-delay="200">
-      <div class="header-actions">
-        <a href={`tel:${COMPANY.phoneClean}`} class="header-phone">
+      <div class="header-actions" id="auth-section"></div>
+
+      <a href={`tel:${COMPANY.phoneClean}`} class="header-phone" id="header-phone">
           <svg
             xmlns="http://www.w3.org/2000/svg"
             width="18"
@@ -331,8 +334,120 @@ import { COMPANY } from "@constants";
 </style>
 
 <script>
-  // Анимация при загрузке страницы
+  // Проверка авторизации и отображение правильного меню
+  function initAuth() {
+    const authSection = document.getElementById('auth-section');
+    const phoneEl = document.getElementById('header-phone');
+    if (!authSection) return;
+
+    const token = localStorage.getItem('auth_token');
+    const userData = localStorage.getItem('user');
+
+    if (token && userData) {
+      try {
+        const user = JSON.parse(userData);
+        const firstLetter = (user.name || user.email || 'U').charAt(0).toUpperCase();
+        
+        // Скрываем телефон, показываем аватар и кнопку выхода
+        if (phoneEl) phoneEl.style.display = 'none';
+        
+        authSection.innerHTML = `
+          <div class="user-display">
+            <div class="user-avatar" title="${user.name || user.email}">${firstLetter}</div>
+            <button class="logout-btn" id="logout-btn" title="Выйти">
+              <svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+                <path d="M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4"></path>
+                <polyline points="16 17 21 12 16 7"></polyline>
+                <line x1="21" y1="12" x2="9" y2="12"></line>
+              </svg>
+            </button>
+          </div>
+        `;
+        
+        // Обработчик выхода
+        document.getElementById('logout-btn')?.addEventListener('click', async () => {
+          try {
+            await fetch('/api/auth/logout', { method: 'POST' });
+          } catch (e) {}
+          localStorage.removeItem('auth_token');
+          localStorage.removeItem('user');
+          window.location.href = '/';
+        });
+      } catch (e) {
+        showPhone();
+      }
+    } else {
+      showPhone();
+    }
+  }
+
+  function showPhone() {
+    const authSection = document.getElementById('auth-section');
+    const phoneEl = document.getElementById('header-phone');
+    
+    if (phoneEl) phoneEl.style.display = 'flex';
+    if (authSection) authSection.innerHTML = '';
+  }
+
+  // Стили
+  const authStyle = `
+    .user-display {
+      display: flex;
+      align-items: center;
+      gap: 0.5rem;
+    }
+    .user-avatar {
+      width: 36px;
+      height: 36px;
+      border-radius: 50%;
+      background: linear-gradient(135deg, #eac26e 0%, #ce9f40 100%);
+      color: #fff;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      font-weight: 700;
+      font-size: 0.9rem;
+    }
+    .logout-btn {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      width: 36px;
+      height: 36px;
+      background: #ef4444;
+      border: none;
+      border-radius: 8px;
+      color: #fff;
+      cursor: pointer;
+      transition: all 0.3s ease;
+    }
+    .logout-btn:hover {
+      background: #dc2626;
+      transform: scale(1.05);
+    }
+    @media (max-width: 992px) {
+      .user-avatar {
+        width: 32px;
+        height: 32px;
+        font-size: 0.8rem;
+      }
+      .logout-btn {
+        width: 32px;
+        height: 32px;
+      }
+      .logout-btn svg {
+        width: 16px;
+        height: 16px;
+      }
+    }
+  `;
+
   document.addEventListener("DOMContentLoaded", () => {
+    const styleEl = document.createElement('style');
+    styleEl.textContent = authStyle;
+    document.head.appendChild(styleEl);
+    
+    initAuth();
     const animatedElements = document.querySelectorAll(".animate-load");
 
     animatedElements.forEach((el) => {