{% extends 'base.html.twig' %}

{% block title %}{{ serviceProvider ? 'Edit' : 'Add' }} Service Provider - Admin{% endblock %}

{% block body %}
    <section class="admin-header">
        <div class="container">
            <div class="admin-header-content">
                <div>
                    <h1>{{ serviceProvider ? 'Edit Service Provider' : 'Add New Service Provider' }}</h1>
                    <p>{{ serviceProvider ? 'Update provider information' : 'Create a new service provider account' }}</p>
                </div>
                <div class="admin-header-actions">
                    <a href="{{ path('app_admin_service_providers') }}" class="btn btn-secondary">Back to List</a>
                </div>
            </div>
        </div>
    </section>

    <section class="admin-content">
        <div class="container">
            <div class="admin-grid">
                <aside class="admin-sidebar">
                    <nav class="admin-nav">
                        <a href="{{ path('app_admin_dashboard') }}" class="admin-nav-item">
                            <span class="nav-icon">📊</span>
                            Dashboard
                        </a>
                        <a href="{{ path('app_admin_bookings') }}" class="admin-nav-item">
                            <span class="nav-icon">📅</span>
                            All Bookings
                        </a>
                        <a href="{{ path('app_admin_service_providers') }}" class="admin-nav-item active">
                            <span class="nav-icon">👥</span>
                            Service Providers
                        </a>
                        <a href="{{ path('app_admin_support_tickets') }}" class="admin-nav-item">
                            <span class="nav-icon">💬</span>
                            Support Tickets
                        </a>
                    </nav>
                </aside>

                <main class="admin-main">
                    <div class="admin-section">
                        <h2>Provider Information</h2>
                        {{ form_start(form, {'attr': {'class': 'admin-form'}}) }}
                            <div class="form-section">
                                <h3>Account Details</h3>
                                <div class="form-row">
                                    <div class="form-group">
                                        {{ form_label(form.firstName) }}
                                        {{ form_widget(form.firstName) }}
                                        {{ form_errors(form.firstName) }}
                                    </div>
                                    <div class="form-group">
                                        {{ form_label(form.lastName) }}
                                        {{ form_widget(form.lastName) }}
                                        {{ form_errors(form.lastName) }}
                                    </div>
                                </div>

                                <div class="form-row">
                                    <div class="form-group">
                                        {{ form_label(form.email) }}
                                        {{ form_widget(form.email) }}
                                        {{ form_errors(form.email) }}
                                    </div>
                                    <div class="form-group">
                                        {{ form_label(form.phone) }}
                                        {{ form_widget(form.phone) }}
                                        {{ form_errors(form.phone) }}
                                    </div>
                                </div>
                            </div>

                            <div class="form-section">
                                <h3>Professional Information</h3>
                                <div class="form-group">
                                    {{ form_label(form.bio) }}
                                    {{ form_widget(form.bio) }}
                                    {{ form_errors(form.bio) }}
                                </div>

                                <div class="form-row">
                                    <div class="form-group">
                                        {{ form_label(form.yearsOfExperience) }}
                                        {{ form_widget(form.yearsOfExperience) }}
                                        {{ form_errors(form.yearsOfExperience) }}
                                    </div>
                                    <div class="form-group">
                                        {{ form_label(form.hourlyRate) }}
                                        {{ form_widget(form.hourlyRate) }}
                                        {{ form_errors(form.hourlyRate) }}
                                    </div>
                                </div>
                            </div>

                            <div class="form-section">
                                <h3>Status Settings</h3>
                                <div class="form-group">
                                    <div class="checkbox-group">
                                        {{ form_widget(form.isAvailable) }}
                                        {{ form_label(form.isAvailable) }}
                                    </div>
                                    <small class="form-text">Provider will be visible and bookable on the public site</small>
                                </div>

                                <div class="form-group">
                                    <div class="checkbox-group">
                                        {{ form_widget(form.isVerified) }}
                                        {{ form_label(form.isVerified) }}
                                    </div>
                                    <small class="form-text">Shows verification badge on provider profile</small>
                                </div>
                            </div>

                            {% if not serviceProvider %}
                                <div class="alert alert-info">
                                    <strong>Note:</strong> Default password will be set to: <code>password123</code>
                                    <br>Provider can change this after logging in.
                                </div>
                            {% endif %}

                            <div class="form-actions">
                                <button type="submit" class="btn btn-primary btn-large">
                                    {{ serviceProvider ? 'Update Provider' : 'Create Provider' }}
                                </button>
                                <a href="{{ path('app_admin_service_providers') }}" class="btn btn-secondary btn-large">Cancel</a>
                            </div>
                        {{ form_end(form) }}
                    </div>
                </main>
            </div>
        </div>
    </section>
{% endblock %}