{% load static %}
{% include 'dashboard/visitors_dashboard/header.html' %}
{% include 'dashboard/visitors_dashboard/body.html' %}
<!-- Right side column. Contains the navbar and content of the page -->
<div class="content-wrapper">
    <!-- Content Header (Page header) -->
    <section class="content-header">
      <h1>
        Dashboard
        <small>Control panel</small>
      </h1>
      <ol class="breadcrumb">
        <li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
        <li class="active">Dashboard</li>
      </ol>
    </section>
 <!-- Main content -->
 <section class="content">
    <!-- Small boxes (Stat box) -->
    <div class="row">
      <div class="col-lg-3 col-xs-6">
        <!-- small box -->
        <div class="small-box bg-aqua">
          <div class="inner">
            <h3>{{all_appointment}}</h3>
            <p>Appointment</p>
          </div>
          <div class="icon">
            <i class="fa fa-calendar"></i>
          </div>
          <a href="{% url 'visitors_appointment' %}" class="small-box-footer">More info <i class="fa fa-arrow-circle-right"></i></a>
        </div>
      </div><!-- ./col -->
      <div class="col-lg-3 col-xs-6">
        <!-- small box -->
        <div class="small-box bg-green">
          <div class="inner">
            <h3>{{Upcoming_appointment}}</h3>
            <p>Upcoming Appointment</p>
          </div>
          <div class="icon">
            <i class="fa fa-calendar-o"></i>
          </div>
          <a href="{% url 'visitors_appointment_upcoming_appointment' %}" class="small-box-footer">More info <i class="fa fa-arrow-circle-right"></i></a>
        </div>
      </div><!-- ./col -->
    </div><!-- /.row -->
    <!-- Main row -->

  </section>
</div>
{% include 'dashboard/visitors_dashboard/footer.html' %}