{% extends "base.html" %}

{% block content %}
<div class="card" style="max-width: 600px; margin: 50px auto;">
    <h2 style="text-align: center; margin-bottom: 30px;">ℹ️ About Medical Center</h2>
    
    <div style="background: #f8f9fa; padding: 20px; border-radius: 8px; margin-bottom: 20px;">
        <h3>🏥 System Information</h3>
        <p><strong>Version:</strong> 2.0</p>
        <p><strong>Developed by:</strong> Medical Center Team</p>
        <p><strong>User:</strong> {{ user.username }} ({{ user.role }})</p>
    </div>
    
    <div style="background: #f8f9fa; padding: 20px; border-radius: 8px; margin-bottom: 20px;">
        <h3>🔑 Registration Status</h3>
        {% if user.is_activated %}
            <p style="color: #27ae60; font-weight: bold;">✅ Activated</p>
        {% elif user.is_trial %}
            <p style="color: #e67e22; font-weight: bold;">⏱️ Trial ({{ trial_days }} days remaining)</p>
        {% else %}
            <p style="color: #e74c3c; font-weight: bold;">❌ Expired</p>
        {% endif %}
    </div>
    
    <div style="background: #f8f9fa; padding: 20px; border-radius: 8px; margin-bottom: 20px;">
        <h3>✨ Features</h3>
        <ul style="text-align: left; padding-left: 20px;">
            <li>Patient Management</li>
            <li>Doctor Management</li>
            <li>Appointment Scheduling</li>
            <li>Medicine Inventory</li>
            <li>Billing System</li>
            <li>Reports & Analytics</li>
            <li>User Authentication</li>
            <li>Backup & Restore</li>
            <li>Prescription Background Management</li>
        </ul>
    </div>
    
    <div style="text-align: center; margin-top: 30px;">
        <p style="color: #666;">© 2024 Medical Center Management System<br>All rights reserved.</p>
        <a href="/dashboard" class="btn btn-primary" style="text-decoration: none;">⬅️ Back to Dashboard</a>
    </div>
</div>
{% endblock %}