{% extends "base.html" %}
{% load static %}

{% block body_class %}portal-body{% endblock %}

{% block content %}
<div class="dashboard-shell">
  <aside class="dashboard-sidebar" aria-label="Workspace navigation">
    <div class="dashboard-sidebar__profile">
      <div class="dashboard-avatar" aria-hidden="true">
        <img src="{% if user.client_profile.avatar %}{{ user.client_profile.avatar.url }}{% else %}{% static 'images/tecvico/default-avatar.png' %}{% endif %}" alt="" />
      </div>
      <div class="dashboard-sidebar__identity">
        <strong>{{ user.get_full_name|default:user.username }}</strong>
        <span>{{ user.email }}</span>
      </div>
    </div>

    <nav class="dashboard-nav">
      <p class="dashboard-nav__label">Workspace</p>
      <a href="{% url 'projects:dashboard' %}" class="dashboard-nav__link{% if request.resolver_match.url_name == 'dashboard' or request.resolver_match.url_name == 'detail' %} is-active{% endif %}">
        <span class="dashboard-nav__icon" aria-hidden="true">⌂</span>
        <span>Overview</span>
      </a>
      <a href="{% url 'projects:dashboard' %}#project-briefs" class="dashboard-nav__link">
        <span class="dashboard-nav__icon" aria-hidden="true">▤</span>
        <span>Project briefs</span>
      </a>
      <a href="{% url 'projects:create' %}" class="dashboard-nav__link{% if request.resolver_match.url_name == 'create' %} is-active{% endif %}">
        <span class="dashboard-nav__icon" aria-hidden="true">＋</span>
        <span>New project brief</span>
      </a>
      <a href="{% url 'accounts:profile' %}" class="dashboard-nav__link{% if request.resolver_match.url_name == 'profile' %} is-active{% endif %}">
        <span class="dashboard-nav__icon" aria-hidden="true">○</span>
        <span>Profile &amp; account</span>
      </a>

      <p class="dashboard-nav__label dashboard-nav__label--secondary">Resources</p>
      <a href="{% url 'products:overview' %}" class="dashboard-nav__link">
        <span class="dashboard-nav__icon" aria-hidden="true">◇</span>
        <span>Scientific products</span>
      </a>
      <a href="{% url 'pages:faq' %}" class="dashboard-nav__link">
        <span class="dashboard-nav__icon" aria-hidden="true">i</span>
        <span>Knowledge &amp; FAQ</span>
      </a>
      <a href="{% url 'pages:contact' %}" class="dashboard-nav__link">
        <span class="dashboard-nav__icon" aria-hidden="true">?</span>
        <span>Help &amp; support</span>
      </a>
      <a href="{% url 'pages:home' %}" class="dashboard-nav__link">
        <span class="dashboard-nav__icon" aria-hidden="true">↗</span>
        <span>Back to website</span>
      </a>
    </nav>

    <div class="dashboard-sidebar__footer">
      <div class="dashboard-security-note">
        <span class="dashboard-security-note__mark" aria-hidden="true"></span>
        <span><strong>Secure workspace</strong>Your project data is private.</span>
      </div>
      <form method="post" action="{% url 'accounts:logout' %}">
        {% csrf_token %}
        <button type="submit" class="dashboard-signout">Sign out</button>
      </form>
    </div>
  </aside>

  <main class="dashboard-main">
    <header class="dashboard-header">
      <div>
        <p class="dashboard-eyebrow">Tecvico client workspace</p>
        <h1 id="dashboard-page-title">{% block portal_title %}Dashboard{% endblock %}</h1>
        <p>{% block portal_subtitle %}{% endblock %}</p>
      </div>
      <div class="dashboard-header__actions">{% block portal_actions %}{% endblock %}</div>
    </header>
    <div class="dashboard-content" aria-labelledby="dashboard-page-title">
      {% block portal_content %}{% endblock %}
    </div>
  </main>
</div>
{% endblock %}

{% block footer %}{% endblock %}