<!DOCTYPE html>
<html lang="de">
<head>
  <meta charset="UTF-8">
 <style>
  body {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #000;
  }

  h1, h2, h3 {
    margin-bottom: 10px;
  }

  table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 10px;
  }

  th, td {
    border: 1px solid #333;
    padding: 6px;
    text-align: left;
  }

  th {
    background: #f0f0f0;
  }

  .total {
    margin-top: 20px;
    font-weight: bold;
    font-size: 14px;
  }
</style>

</head>
<body>

<h2>Rechnung</h2>

<p>
<strong>Patient:</strong> <%= patient.firstname %> <%= patient.lastname %><br>
<strong>Adresse:</strong><br>
<%= patient.street %> <%= patient.house_number %><br>
<%= patient.postal_code %> <%= patient.city %>
</p>

<table>
  <thead>
    <tr>
      <th>Menge</th>
      <th>Leistung</th>
      <th>Preis</th>
      <th>Summe</th>
    </tr>
  </thead>
  <tbody>
    <% services.forEach(s => { %>
      <tr>
        <td><%= s.quantity %></td>
        <td><%= s.name %></td>
        <td><%= s.price.toFixed(2) %> €</td>
        <td><%= s.total.toFixed(2) %> €</td>
      </tr>
    <% }) %>
  </tbody>
</table>

<h3>Gesamt: <%= total.toFixed(2) %> €</h3>

</body>
</html>

