<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>WHY 2025 Traffic Police</title>
  <link rel="stylesheet" href="/assets/css/pico.min.css" />
  <link rel="stylesheet" href="/assets/css/pico.colors.min.css" />
</head>
<body>
  <main class="container">
    <div style="text-align: center;"><img src="/assets/img/traffic_police.svg" style="max-width: 300px" alt="WHY Traffic Police"></div>
    <article>
      <header>Traffic Violation</header>
      <div class="grid">
        <div>

      Dear beeing,<br />
      <p>we have found that you have violated WHY2025 traffic rules. At {{.Ticket.CreatedAt.Format "15:04:05"}} on the
        {{.Ticket.CreatedAt.Format "02.01.2006" }} you exceeded the maximum allowed Speed of <b>{{.Ticket.AllowedSpeed}}km/h</b> by
        {{.Exceeded}}km/h, reaching a speed of <b>{{.Ticket.Speed}}km/h</b></p>
      
      <p>Consider this a warning, your next violation might include a hefty fine.</p>
        </div>
        <div style="text-align:center">
                {{ if ne .Ticket.ImagePath "" }}
                <div style="margin: var(--pico-block-spacing-vertical) 0;"><img src="{{ .Ticket.ImagePath }}" alt="Proof"></div>
                {{ end }}
                {{ if ne .Ticket.KIImagePath "" }}
                <div style="margin: var(--pico-block-spacing-vertical) 0;"><img src="{{ .Ticket.KIImagePath }}" alt="Proof"></div>
                {{ end }}
        </div>
      </div>
      <footer>This document is generated by a machine and therefore does not need a signature.</footer>
    </article>
    <div  style="margin: var(--pico-block-spacing-vertical) 0;">
      <a href="/ticket/{{.Ticket.ID}}/delete" role="button">Delete this ticket including the images</a>
    </div>
  </main>
</body>
</html>