{# Minimal theme: navbar partial #}
<header class="navbar navbar-expand-lg border-bottom sticky-top" style="background: transparent;">
  <div class="container-fluid px-4 py-3">
    <div class="d-flex align-items-center gap-2 me-2">
      <a class="navbar-brand fw-semibold d-flex align-items-center mb-0" href="/">
        {% if site_nav_icon_abs %}
        <img class="me-2 rounded-1 flex-shrink-0" src="{{ site_nav_icon_abs|e }}" width="28" height="28" alt="" style="object-fit:contain" loading="lazy" decoding="async" />
        {% else %}
        <svg class="me-2 text-primary flex-shrink-0" width="28" height="28" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
          <path d="M4 19.5A2.5 2.5 0 0 1 6.5 17H20"></path>
          <path d="M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2z"></path>
        </svg>
        {% endif %}
        <span class="text-body">{{ site_display_name() }}</span>
      </a>

      {% if available_locales and available_locales|length > 1 %}
      <form action="/lang" method="post" class="d-inline-flex align-items-center ms-1">
        <input type="hidden" name="next" value="{{ current_path_with_query }}" />
        <select name="locale" class="form-select form-select-sm border-secondary-subtle" onchange="this.form.submit()" aria-label="Limba site-ului">
          {% for loc in available_locales %}
          <option value="{{ loc.code }}" {% if loc.code == current_locale %}selected{% endif %}>
            🌐 {{ loc.code|upper }}
          </option>
          {% endfor %}
        </select>
      </form>
      {% endif %}

      <!-- Dark/Light Theme Switcher -->
      <button type="button" class="btn btn-sm btn-outline-secondary border-secondary-subtle rounded-circle px-2 py-1 ms-1" id="theme-toggle" title="Comută modul Dark / Light" aria-label="Comută modul Dark / Light">
        <span id="theme-icon">🌙</span>
      </button>
    </div>

    <button class="navbar-toggler border-0" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
      <span class="navbar-toggler-icon"></span>
    </button>
    <div class="collapse navbar-collapse" id="navbarNav">
      <ul class="navbar-nav ms-lg-auto mb-2 mb-lg-0 align-items-lg-center flex-wrap column-gap-1 row-gap-2 mt-3 mt-lg-0">
        {% if fixed_nav_posts and fixed_nav_posts|length > 0 %}
          {% for nav_p in fixed_nav_posts %}
          <li class="nav-item">
            <a class="nav-link py-1 px-3 border rounded-pill bg-body-tertiary text-body fw-semibold me-1" 
               href="{{ nav_p.href or nav_p.url or post_public_path(nav_p.slug) }}"
               target="{{ nav_p.target|default('_self')|e }}"
               {% if nav_p.target == '_blank' %}rel="noopener noreferrer"{% endif %}>
              {{ nav_p.fixed_label or nav_p.label }}
            </a>
          </li>
          {% endfor %}
        {% endif %}

        <!-- Plugin Area for Navbar Links -->
        {% if plugin_area_navbar_links %}
          {{ plugin_area_navbar_links | safe }}
        {% endif %}

        <!-- Meniu Utilizator / Autentificare -->
        {% if user %}
        <li class="nav-item dropdown ms-lg-2">
          <a class="nav-link dropdown-toggle d-flex align-items-center gap-2 py-1 px-3 border rounded-pill bg-body-tertiary" href="#" id="userNavDropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">
            {% if user.image_url %}
            <img src="{{ user.image_url }}" alt="{{ user.first_name or user.username }}" class="rounded-circle object-fit-cover" width="24" height="24">
            {% else %}
            <div class="rounded-circle bg-primary text-white d-flex align-items-center justify-content-center fw-bold" style="width:24px; height:24px; font-size:0.75rem;">
              {{ (user.first_name or user.username or 'U')[0]|upper }}
            </div>
            {% endif %}
            <span class="fw-semibold small">{{ user.first_name or user.username or t('ui.member') }}</span>
          </a>
          <ul class="dropdown-menu dropdown-menu-end shadow border-0 rounded-3 mt-1" aria-labelledby="userNavDropdown">
            <li><a class="dropdown-item d-flex align-items-center gap-2" href="/profile">👤 {{ t('ui.profile') }}</a></li>
            {% if is_plugin_active and is_plugin_active('minishop') %}
            <li><a class="dropdown-item d-flex align-items-center gap-2" href="/profile#tab-orders">📦 My Orders</a></li>
            {% endif %}
            {% if plugin_area_user_dropdown %}
            {{ plugin_area_user_dropdown | safe }}
            {% endif %}
            {% if user.role in ['admin', 'editor'] %}
            <li><hr class="dropdown-divider"></li>
            <li><a class="dropdown-item d-flex align-items-center gap-2" href="/admin">⚡ {{ t('ui.admin') }}</a></li>
            <li><a class="dropdown-item d-flex align-items-center gap-2" href="/admin/new">✍️ {{ t('ui.new_post') }}</a></li>
            {% endif %}
            <li><hr class="dropdown-divider"></li>
            <li><a class="dropdown-item d-flex align-items-center gap-2 text-danger" href="/auth/logout">🚪 {{ t('ui.logout') }}</a></li>
          </ul>
        </li>
        {% else %}
        <li class="nav-item ms-lg-2">
          <a class="btn btn-sm btn-primary rounded-pill px-3 fw-semibold" href="/admin/login">
            🔑 {{ t('ui.login') }}
          </a>
        </li>
        {% endif %}
      </ul>
    </div>
  </div>
</header>