{% extends "nextcloud/base.html" %}

{% load static i18n %}

{% block title %} Request Details {% endblock %}

{% block content %} 
    <div class="row mt-3 mb-4">
      <div class="col-lg-12 mx-auto mb-4">
        <div class="row widget-steps">
          <div class="col-4 step complete">
            <div class="step-name">{%trans "Details" %}</div>
            <div class="progress">
              <div class="progress-bar"></div>
            </div>
            <a href="#" class="step-dot"></a> 
          </div>
          <div class="col-4 step complete">
            <div class="step-name">{%trans "Confirm" %}</div>
            <div class="progress">
              <div class="progress-bar"></div>
            </div>
            <a href="#" class="step-dot"></a> 
          </div>
          <div class="col-4 step complete">
            <div class="step-name">{%trans "Success" %}</div>
            <div class="progress">
              <div class="progress-bar"></div>
            </div>
            <a href="#" class="step-dot"></a> 
          </div>
        </div>
      </div>
    </div>
    <div class="row">
      <div class="col-md-9 col-lg-7 col-xl-6 mx-auto"> 
        <div class="bg-white text-center shadow-sm rounded p-3 pt-sm-4 pb-sm-5 px-sm-5 mb-4">
          <div class="my-4">
            <p class="text-success text-20 line-height-07"><i class="fas fa-check-circle"></i></p>
            <p class="text-success text-8 font-weight-500 line-height-07">{%trans "Success!" %}</p>
            <p class="lead">{%trans "Order has been successfully added. Your VM will be up and running in a few moments. " %}</p>
          </div>
          <p class="text-3 mb-4">{%trans "We will send you a confirmation email as soon as it is ready." %} {%trans "Go to your dashboard" %} <a class="btn-link" href="{% url 'uncloud_pay:bills' %}">{%trans "Billing" %}</a>.</p>
          <a href="{% url 'uncloud_pay:invoice_download' bill_id=bill_id %}" class="btn btn-white border border-success text-success" role="button"><i class="fas fa-print"></i> {%trans "Download Invoice" %}</a>
        </div>
      </div>
    </div>
{% endblock %} 

{% block js_extra %}
{% endblock js_extra %}