{% extends "merchant_base.html" %}
{% load static %}
{% load crispy_forms_tags %}


{% block Style %}

 <style>
 .icons{
    font-size: 50px;
 }
 .dashboard-grid:hover .icons{
     font-size: 70px;
 }
 .dashboard-grid {
    padding: 15px;
}
 </style>
 
{% endblock Style %}

{% block MainContent %}


<div class="dashboard-grids">
<div class="row">
    <div class="col-sm-6 col-md-4 col-lg-3">
      <div class="dashboard-grid" style="background-color: #ec8440;">
          <div class="icons">
            <i class="fa fa-money" aria-hidden="true"></i>
          </div>
          <div class="grid-text">
              <h3>{{working_styles}}</h3>
                <h4>Working Inquiries</h4>
          </div>
          <a href="#">Working Inquiries</a>
      </div>
  </div>
    <div class="col-sm-6 col-md-4 col-lg-3">
        <div class="dashboard-grid" style="background-color: #446561;"  >
            <div class="icons">
              <i class="fa fa-check" aria-hidden="true"></i>
            </div>
            <div class="grid-text">
                <h3>{{inquiry_approvals}}</h3>
                  <h4>Inquiry Approvals</h4>
            </div>
            <a href="#">Inquiry Approvals</a>
        </div>
    </div>
   

    <div class="col-sm-6 col-md-4 col-lg-3">
        <div class="dashboard-grid" style="background-color: #2cac64;">
            <div class="icons">
              <i class="fa fa-adjust" aria-hidden="true"></i>
            </div>
          <div class="grid-text">
            <h3>{{adjustment_approval}}</h3>
            <h4>Quotation Adjustment</h4>
            </div>
            <a href="#">Quotation Adjustment</a>
        </div>
    </div>
    <div class="col-sm-6 col-md-4 col-lg-3">
        <div class="dashboard-grid" style="background-color: #7e7e8e;">
            <div class="icons">
              <i class="fa fa-tasks" aria-hidden="true"></i>
            </div>
          <div class="grid-text">
            <h3>{{po_numbers}}</h3>
            <h4>Purchase Order</h4>
            </div>
            <a href="#">Purchase Orders</a>
        </div>
    </div>
    

</div>

</div>













        
<!-- dashboard-grids -->
<!-- dashboard-grids -->

{% endblock MainContent %}
{% block meassage %}

{% include 'notifications/notifications.html' %}

{% endblock meassage %}


{% block JS %}

{% endblock JS %}