{% extends 'default.html' %}

{% set active_page = "dashboard" %}

{% block head %}
  <script src="https://cdn.paddle.com/paddle/paddle.js"></script>
  <script>
    if (window.Paddle === undefined) {
      console.log("cannot load Paddle from CDN");
      document.write('<script src="/static/vendor/paddle.js"><\/script>')
    }
  </script>

  <style type="text/css">
      html.mvc__a.mvc__lot.mvc__of.mvc__classes.mvc__to.mvc__increase.mvc__the.mvc__odds.mvc__of.mvc__winning.mvc__specificity, html.mvc__a.mvc__lot.mvc__of.mvc__classes.mvc__to.mvc__increase.mvc__the.mvc__odds.mvc__of.mvc__winning.mvc__specificity > body {
          position: static;
      }
  </style>

{% endblock %}

{% block title %}
  Coupon
{% endblock %}

{% block default_content %}
  {% if can_use_coupon %}
    <div class="card">
      <div class="card-body">
        <h1 class="h2">Coupon</h1>

        <div class="mb-4">
          Please enter the coupon here to upgrade your account or extend your current subscription.
        </div>

        <form method="post">
          {{ coupon_form.csrf_token }}

          {{ coupon_form.code(class="form-control", placeholder="Licence Code") }}
          {{ render_field_errors(coupon_form.code) }}
          <button class="btn btn-success mt-2">Apply</button>
        </form>
      </div>
    </div>
  {% endif %}

  <div class="card">
    <div class="card-body">
      <h2>1-year coupon</h2>
      <div class="mb-3">
        You can buy a 1-year coupon that allows anyone to have the SimpleLogin premium for 1 year.
        Can be an idea for a gift card :).
        After the payment, the coupon will be sent to you by email.
      </div>
      <div class="alert alert-info">
        The coupon must be used before {{ max_coupon_date.date().isoformat() }}
      </div>
      <a href="#!" class="paddle_button btn btn-primary" data-product="{{ PADDLE_COUPON_ID }}">Buy 1-year SimpleLogin
        coupon</a>
    </div>
  </div>


{% endblock %}

{% block script %}
  <script type="text/javascript">
    Paddle.Setup({vendor: {{PADDLE_VENDOR_ID}}});
  </script>
{% endblock %}