<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>{{ resume.title }}</title>
  <style>
    body {
      font-family: "Poppins", sans-serif;
      background: #ffffff;
      color: #333;
      margin: 0;
      padding: 30px;
    }
    .header {
      text-align: center;
      border-bottom: 3px solid #007bff;
      padding-bottom: 10px;
      margin-bottom: 25px;
    }
    .header h1 {
      font-size: 32px;
      margin-bottom: 5px;
      color: #007bff;
    }
    .section {
      margin-bottom: 25px;
    }
    h2 {
      border-bottom: 2px solid #007bff;
      padding-bottom: 5px;
      color: #007bff;
      font-size: 18px;
      text-transform: uppercase;
    }
    .sub-item {
      margin-bottom: 10px;
      line-height: 1.5;
    }
    .skill-badge {
      display: inline-block;
      background: #007bff;
      color: white;
      padding: 6px 12px;
      border-radius: 15px;
      margin: 4px;
      font-size: 13px;
    }
  </style>
</head>
<body>

<div class="header">
  <h1>{{ resume.personal_info.full_name }}</h1>
  <p>{{ resume.personal_info.email }} | {{ resume.personal_info.phone }}</p>
  {% if resume.personal_info.linkedin %}<p>LinkedIn: {{ resume.personal_info.linkedin }}</p>{% endif %}
</div>

{% if resume.summary %}
<div class="section">
  <h2>Summary</h2>
  <p>{{ resume.summary }}</p>
</div>
{% endif %}

{% if resume.education.all %}
<div class="section">
  <h2>Education</h2>
  {% for edu in resume.education.all %}
  <div class="sub-item">
    <strong>{{ edu.degree }}</strong>, {{ edu.institution }}
    <br><small>{{ edu.start_year }} - {{ edu.end_year|default:"Present" }}</small>
  </div>
  {% endfor %}
</div>
{% endif %}

{% if resume.experience.all %}
<div class="section">
  <h2>Experience</h2>
  {% for exp in resume.experience.all %}
  <div class="sub-item">
    <strong>{{ exp.job_title }}</strong> at {{ exp.company }}
    <br><small>{{ exp.start_date }} - {{ exp.end_date|default:"Present" }}</small>
    <br>{{ exp.responsibilities }}
  </div>
  {% endfor %}
</div>
{% endif %}

{% if resume.skills.all %}
<div class="section">
  <h2>Skills</h2>
  {% for skill in resume.skills.all %}
  <span class="skill-badge">{{ skill.name }}</span>
  {% endfor %}
</div>
{% endif %}

{% if resume.projects.all %}
<div class="section">
  <h2>Projects</h2>
  {% for project in resume.projects.all %}
  <div class="sub-item">
    <strong>{{ project.title }}</strong> - {{ project.description }}
  </div>
  {% endfor %}
</div>
{% endif %}

{% if resume.certifications.all %}
<div class="section">
  <h2>Certifications</h2>
  <ul>
    {% for cert in resume.certifications.all %}
      <li>{{ cert.name }} - {{ cert.issued_by }} ({{ cert.year }})</li>
    {% endfor %}
  </ul>
</div>
{% endif %}

</body>
</html>
