{% extends "admin_base.html" %}
{% load static %}

{% block title %}System Settings{% endblock %}
{% block page_title %}System Settings{% endblock %}
{% block page_description %}Configure system-wide settings and preferences{% endblock %}

{% block content %}
<div class="row">
    <div class="col-lg-8">
        <div class="admin-card">
            <div class="admin-card-header">
                <h5 class="mb-0">
                    <i class="fas fa-cogs me-2"></i>General Settings
                </h5>
            </div>
            <div class="admin-card-body">
                <form method="post">
                    {% csrf_token %}
                    
                    <div class="row">
                        <div class="col-md-6 mb-3">
                            <label for="system_name" class="form-label">System Name</label>
                            <input type="text" class="form-control" id="system_name" name="system_name" value="Sales Shark">
                        </div>
                        <div class="col-md-6 mb-3">
                            <label for="system_email" class="form-label">System Email</label>
                            <input type="email" class="form-control" id="system_email" name="system_email" value="admin@salesshark.com">
                        </div>
                    </div>
                    
                    <div class="row">
                        <div class="col-md-6 mb-3">
                            <label for="default_trial_days" class="form-label">Default Trial Days</label>
                            <input type="number" class="form-control" id="default_trial_days" name="default_trial_days" value="30">
                        </div>
                        <div class="col-md-6 mb-3">
                            <label for="max_users_per_tenant" class="form-label">Max Users Per Tenant</label>
                            <input type="number" class="form-control" id="max_users_per_tenant" name="max_users_per_tenant" value="10">
                        </div>
                    </div>
                    
                    <div class="mb-3">
                        <label for="maintenance_mode" class="form-label">Maintenance Mode</label>
                        <div class="form-check form-switch">
                            <input class="form-check-input" type="checkbox" id="maintenance_mode" name="maintenance_mode">
                            <label class="form-check-label" for="maintenance_mode">
                                Enable maintenance mode (prevents new registrations)
                            </label>
                        </div>
                    </div>
                    
                    <div class="mb-3">
                        <label for="auto_suspend_expired" class="form-label">Auto Suspend Expired Tenants</label>
                        <div class="form-check form-switch">
                            <input class="form-check-input" type="checkbox" id="auto_suspend_expired" name="auto_suspend_expired" checked>
                            <label class="form-check-label" for="auto_suspend_expired">
                                Automatically suspend tenants when their trial expires
                            </label>
                        </div>
                    </div>
                    
                    <button type="submit" class="btn btn-admin-primary">
                        <i class="fas fa-save me-2"></i>Save Settings
                    </button>
                </form>
            </div>
        </div>
    </div>
    
    <div class="col-lg-4">
        <div class="admin-card">
            <div class="admin-card-header">
                <h5 class="mb-0">
                    <i class="fas fa-envelope me-2"></i>Email Settings
                </h5>
            </div>
            <div class="admin-card-body">
                <form method="post">
                    {% csrf_token %}
                    <input type="hidden" name="form_type" value="email">
                    
                    <div class="mb-3">
                        <label for="smtp_host" class="form-label">SMTP Host</label>
                        <input type="text" class="form-control" id="smtp_host" name="smtp_host" value="mail.salesshark.com">
                    </div>
                    
                    <div class="mb-3">
                        <label for="smtp_port" class="form-label">SMTP Port</label>
                        <input type="number" class="form-control" id="smtp_port" name="smtp_port" value="587">
                    </div>
                    
                    <div class="mb-3">
                        <label for="smtp_username" class="form-label">SMTP Username</label>
                        <input type="text" class="form-control" id="smtp_username" name="smtp_username" value="noreply@salesshark.com">
                    </div>
                    
                    <div class="mb-3">
                        <label for="smtp_password" class="form-label">SMTP Password</label>
                        <input type="password" class="form-control" id="smtp_password" name="smtp_password" placeholder="••••••••">
                    </div>
                    
                    <div class="mb-3">
                        <div class="form-check form-switch">
                            <input class="form-check-input" type="checkbox" id="smtp_tls" name="smtp_tls" checked>
                            <label class="form-check-label" for="smtp_tls">
                                Use TLS
                            </label>
                        </div>
                    </div>
                    
                    <button type="submit" class="btn btn-admin-primary">
                        <i class="fas fa-save me-2"></i>Save Email Settings
                    </button>
                </form>
            </div>
        </div>
        
        <div class="admin-card mt-4">
            <div class="admin-card-header">
                <h5 class="mb-0">
                    <i class="fas fa-chart-line me-2"></i>System Stats
                </h5>
            </div>
            <div class="admin-card-body">
                <div class="d-flex justify-content-between align-items-center mb-2">
                    <span>Total Tenants:</span>
                    <span class="fw-bold">{{ total_tenants|default:0 }}</span>
                </div>
                <div class="d-flex justify-content-between align-items-center mb-2">
                    <span>Active Tenants:</span>
                    <span class="fw-bold text-success">{{ active_tenants|default:0 }}</span>
                </div>
                <div class="d-flex justify-content-between align-items-center mb-2">
                    <span>Trial Tenants:</span>
                    <span class="fw-bold text-warning">{{ trial_tenants|default:0 }}</span>
                </div>
                <div class="d-flex justify-content-between align-items-center">
                    <span>Expired Tenants:</span>
                    <span class="fw-bold text-danger">{{ expired_tenants|default:0 }}</span>
                </div>
            </div>
        </div>
    </div>
</div>
{% endblock %}

{% block extra_js %}
<script>
document.addEventListener('DOMContentLoaded', function() {
    // Form submission handling
    const forms = document.querySelectorAll('form');
    forms.forEach(form => {
        form.addEventListener('submit', function(e) {
            const submitBtn = this.querySelector('button[type="submit"]');
            if (submitBtn) {
                submitBtn.disabled = true;
                submitBtn.innerHTML = '<i class="fas fa-spinner fa-spin me-2"></i>Saving...';
                
                setTimeout(() => {
                    submitBtn.disabled = false;
                    submitBtn.innerHTML = '<i class="fas fa-save me-2"></i>Save Settings';
                }, 3000);
            }
        });
    });
});
</script>
{% endblock %}