{% extends 'base.html' %}
{% load static i18n %}

{% block title %}{% trans "Home" %} — Munavvarkhon Mukhitdinova{% endblock %}
{% block description %}{% trans "Doctor of Science in Economics, Associate Professor | AI & Digital Economy Researcher." %}{% endblock %}

{% block content %}
<!-- ================= HERO ================= -->
<section class="hero fade-in">
  <div class="container hero-grid">
    <div class="hero-text">
      <h1>
        <span data-i18n="hero_title_1">{% trans "Doctor of Science in Economics" %}</span><br>
        <span><span data-i18n="hero_title_2">{% trans "Associate Professor" %}</span></span>
      </h1>
      <p data-i18n="hero_sub">{% trans "AI & Digital Economy Researcher" %}</p>
      <a class="btn" href="{% url 'about' %}" data-i18n="hero_btn">{% trans "About Me" %}</a>
    </div>
    <div class="image-placeholder" aria-hidden="true">
      <img src="{% static 'img/Image 16-12-25 at 11.59.jpg' %}" alt="Munavvarkhon Mukhitdinova">
    </div>
  </div>
</section>

<!-- ================= INTRO ================= -->
<section class="section fade-in">
  <div class="container">
    <h2 class="h2" data-i18n="intro_title">{% trans "Welcome" %}</h2>
    <p class="p" data-i18n="intro_text">{% trans "Welcome to my professional academic website. I specialize in digital economy, artificial intelligence applications in economics, and big data analytics." %}</p>
    <div style="margin-top:18px;">
      <a class="btn" href="{% static 'files/Resume_Mukhitdinova_Variant1_Academic.docx' %}" download data-i18n="cv_btn">
        {% trans "Download CV" %}
      </a>
    </div>
  </div>
</section>

<!-- ================= FEATURED CONTENT ================= -->
<section class="section-muted fade-in">
  <div class="container">
    <h2 class="h2" data-i18n="featured_content">{% trans "Featured Content" %}</h2>
    <div class="featured-grid">

      <!-- Featured Publications -->
      {% if featured_publications %}
      <div class="featured-section">
        <h3 data-i18n="pub_title">{% trans "Recent Publications" %}</h3>
        <div class="featured-items">
          {% for pub in featured_publications %}
          <div class="featured-item">
            <h4><a href="{% url 'publication_detail' pub.pk %}">{{ pub.title|truncatewords:10 }}</a></h4>
            <p class="meta">{{ pub.journal }}, {{ pub.year }}</p>
            {% if pub.citation_count %}
            <span class="citation">{{ pub.citation_count }} {% trans "citations" %}</span>
            {% endif %}
          </div>
          {% endfor %}
        </div>
        <a href="{% url 'publications' %}" class="btn-small">{% trans "View All Publications" %}</a>
      </div>
      {% endif %}

      <!-- Recent Conferences -->
      {% if recent_conferences %}
      <div class="featured-section">
        <h3 data-i18n="featured_conferences">{% trans "Recent Conferences" %}</h3>
        <div class="featured-items">
          {% for conf in recent_conferences %}
          <div class="featured-item">
            <h4><a href="{% url 'conference_detail' conf.pk %}">{{ conf.title|truncatewords:8 }}</a></h4>
            <p class="meta">{{ conf.location }}, {{ conf.date|date:"M Y" }}</p>
            <span class="role">{{ conf.role }}</span>
          </div>
          {% endfor %}
        </div>
        <a href="{% url 'conferences' %}" class="btn-small">{% trans "View All Conferences" %}</a>
      </div>
      {% endif %}

      <!-- Ongoing Projects -->
      {% if ongoing_projects %}
      <div class="featured-section">
        <h3 data-i18n="featured_projects">{% trans "Current Projects" %}</h3>
        <div class="featured-items">
          {% for project in ongoing_projects %}
          <div class="featured-item">
            <h4><a href="{% url 'projects' %}">{{ project.title|truncatewords:8 }}</a></h4>
            <p class="meta">{{ project.get_project_type_display }}</p>
            <span class="status">{% trans "Ongoing" %}</span>
          </div>
          {% endfor %}
        </div>
        <a href="{% url 'projects' %}" class="btn-small">{% trans "View All Projects" %}</a>
      </div>
      {% endif %}

      <!-- Video Lessons -->
      {% if video_lessons %}
      <div class="featured-section">
        <h3 data-i18n="featured_videos">{% trans "Video Lessons" %}</h3>
        <div class="featured-items">
          {% for video in video_lessons %}
          <div class="featured-item">
            <h4><a href="{% url 'video_detail' video.pk %}">{{ video.title|truncatewords:8 }}</a></h4>
            <p class="meta">{{ video.duration }} • {{ video.views }} {% trans "views" %}</p>
            <span class="language">{{ video.get_language_display }}</span>
          </div>
          {% endfor %}
        </div>
        <a href="{% url 'video_lessons' %}" class="btn-small">{% trans "View All Videos" %}</a>
      </div>
      {% endif %}

    </div>
  </div>
</section>

<!-- ================= METRICS ================= -->
{% if metrics %}
<section class="section fade-in">
  <div class="container">
    <h2 class="h2" data-i18n="research_impact">{% trans "Research Impact" %}</h2>
    <div class="metrics-summary">
      <div class="metric-item">
        <span class="metric-value">{{ metrics.h_index }}</span>
        <span class="metric-label" data-i18n="pub_m1">h-index</span>
      </div>
      <div class="metric-item">
        <span class="metric-value">{{ metrics.citations }}</span>
        <span class="metric-label" data-i18n="pub_m2">{% trans "Citations" %}</span>
      </div>
      <div class="metric-item">
        <span class="metric-value">{{ total_publications }}</span>
        <span class="metric-label" data-i18n="pub_m3">{% trans "Publications" %}</span>
      </div>
    </div>
    <div style="text-align: center; margin-top: 30px;">
      <a href="{% url 'metrics_dashboard' %}" class="btn">{% trans "View Detailed Metrics" %}</a>
    </div>
  </div>
</section>
{% endif %}

<!-- ================= WORK ================= -->
<section class="section-muted fade-in">
  <div class="container">
    <h2 class="h2" data-i18n="work_title">{% trans "Professional Activities" %}</h2>
    <div class="cards">
      <div class="card">
        <h3 data-i18n="work_r_title">{% trans "Research" %}</h3>
        <p data-i18n="work_r_text">{% trans "Leading research in digital transformation and AI applications in economic systems." %}</p>
      </div>
      <div class="card">
        <h3 data-i18n="work_e_title">{% trans "Education" %}</h3>
        <p data-i18n="work_e_text">{% trans "Teaching courses on digital economy, big data analytics, and artificial intelligence." %}</p>
      </div>
      <div class="card">
        <h3 data-i18n="work_c_title">{% trans "Consulting" %}</h3>
        <p data-i18n="work_c_text">{% trans "Consulting for government and private sector on digital transformation strategies." %}</p>
      </div>
    </div>
  </div>
</section>

<!-- ================= QUOTE ================= -->
<section class="section-muted fade-in">
  <div class="container">
    <p class="quote" data-i18n="quote">{% trans "The future belongs to those who understand that digital transformation is not just about technology, but about changing mindsets and creating new economic paradigms." %}</p>
  </div>
</section>
{% endblock %}