{% load i18n %}
<header class="border-b border-charcoal/10 bg-warm-white sticky top-0 z-50">
    <div class="max-w-7xl mx-auto px-6 py-4 flex items-center justify-between">
        <a href="/" class="text-xl font-bold tracking-wider text-charcoal">
            HR <span class="text-burgundy">OBSERVER</span>
        </a>

        <nav class="hidden md:flex items-center space-x-6 text-sm" x-data="{ open: false }">
            <a href="/" class="hover:text-burgundy transition">{% trans "首页" %}</a>
            <a href="/insights/" class="hover:text-burgundy transition">{% trans "洞察" %}</a>
            <a href="/interviews/" class="hover:text-burgundy transition">{% trans "访谈" %}</a>
            <a href="/ai-hr/" class="hover:text-electric-blue transition">{% trans "AI × HR" %}</a>
            <a href="/people/" class="hover:text-burgundy transition">{% trans "人才" %}</a>
            <a href="/tools/" class="hover:text-burgundy transition">{% trans "工具" %}</a>
            <a href="/opinions/" class="hover:text-burgundy transition">{% trans "观点" %}</a>
            <a href="/search/" class="hover:text-burgundy transition">{% trans "搜索" %}</a>
        </nav>

        <div class="flex items-center space-x-4 text-sm">
            {% get_current_language as CURRENT_LANGUAGE %}
            {% if CURRENT_LANGUAGE == 'zh-hans' %}
                <a href="/i18n/set/en/" class="hover:text-burgundy transition">EN</a>
            {% else %}
                <a href="/i18n/set/zh-hans/" class="hover:text-burgundy transition">中</a>
            {% endif %}
            <a href="/newsletter/subscribe/" class="px-4 py-1.5 bg-charcoal text-warm-white rounded hover:bg-burgundy transition">
                {% trans "订阅 Newsletter" %}
            </a>
        </div>
    </div>
</header>