/* =================================================================
   TOPBAR + TÉMA VÁLTÓ + LOGOUT — kiszedve base.html-ből 2026-06-04 F1
   Forrás: projects/templates/projects/base.html <style> 259–309 sorok
   ================================================================= */

.topbar {
    background: var(--topbar-bg);
    color: var(--topbar-text);
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
    border-bottom: 1px solid var(--topbar-border);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    position: relative;
    z-index: var(--z-topbar, 1002);
}

.theme-toggle {
    width: 40px;
    height: 40px;
    border: none;
    border-radius: 8px;
    background: var(--topbar-bg);
    color: var(--topbar-text);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    transition: background 0.2s, color 0.2s;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
}
html[data-theme="dark"] .theme-toggle { background: var(--bg-hover); color: var(--topbar-text); }
.theme-toggle:hover { opacity: 0.9; filter: brightness(1.1); }

/* Kilépés gomb — pure CSS hover (QW7, volt: JS onmouseover/onmouseout) */
.logout-btn {
    background: none;
    border: none;
    cursor: pointer;
    padding: 8px;
    border-radius: 6px;
    display: flex;
    align-items: center;
    gap: 6px;
    color: var(--gray-600);
    transition: background 0.2s, color 0.2s;
}
.logout-btn:hover {
    background: var(--danger-100);
    color: var(--danger-500);
}
html[data-theme="dark"] .logout-btn { color: var(--text-secondary); }
html[data-theme="dark"] .logout-btn:hover { background: var(--danger-overlay); color: var(--danger-soft); }