{% extends "base.html" %}

{% block title %}QuantumQuickSales - Home{% endblock %}

{% block auth_content %}
<div class="container-fluid">
    <div class="row min-vh-100">
        <div class="col-md-6 d-flex align-items-center justify-content-center" style="background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);">
            <div class="text-center text-white">
                <h1 class="display-4 fw-bold mb-4">QuantumQuickSales</h1>
                <p class="lead mb-4">Advanced Point of Sale System with Inventory Management</p>
                <div class="row text-center">
                    <div class="col-md-6 mb-3">
                        <i class="fas fa-shopping-cart fa-3x mb-3"></i>
                        <h5>Sales Management</h5>
                        <p class="small">Efficient invoice generation and sales tracking</p>
                    </div>
                    <div class="col-md-6 mb-3">
                        <i class="fas fa-warehouse fa-3x mb-3"></i>
                        <h5>Inventory Control</h5>
                        <p class="small">Real-time stock management and alerts</p>
                    </div>
                    <div class="col-md-6 mb-3">
                        <i class="fas fa-chart-line fa-3x mb-3"></i>
                        <h5>Analytics</h5>
                        <p class="small">Comprehensive reporting and insights</p>
                    </div>
                    <div class="col-md-6 mb-3">
                        <i class="fas fa-users fa-3x mb-3"></i>
                        <h5>User Management</h5>
                        <p class="small">Role-based access control</p>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-md-6 d-flex align-items-center justify-content-center">
            <div class="w-75">
                <div class="text-center mb-5">
                    <h2 class="fw-bold text-primary">Welcome Back</h2>
                    <p class="text-muted">Please login to access your dashboard</p>
                </div>
                
                <div class="card shadow">
                    <div class="card-body p-5">
                        <div class="text-center mb-4">
                            <i class="fas fa-user-circle fa-3x text-primary"></i>
                        </div>
                        
                        <div class="d-grid gap-3">
                            <a href="{{ url_for('login') }}" class="btn btn-primary btn-lg">
                                <i class="fas fa-sign-in-alt me-2"></i>Login to System
                            </a>
                        </div>
                        
                        <hr class="my-4">
                        
                        <div class="row text-center">
                            <div class="col-6">
                                <h6 class="text-muted">Admin Access</h6>
                                <p class="small">Username: Bhargav<br>Password: Bhargav</p>
                            </div>
                            <div class="col-6">
                                <h6 class="text-muted">User Access</h6>
                                <p class="small">Contact admin for credentials</p>
                            </div>
                        </div>
                    </div>
                </div>
                
                <div class="text-center mt-4">
                    <small class="text-muted">
                        <i class="fas fa-shield-alt me-1"></i>
                        Secure and reliable POS system
                    </small>
                </div>
            </div>
        </div>
    </div>
</div>
{% endblock %}