import os
import shutil

# Correct content with spaces added around == in lines 50, 51, 57 AND fixed split tag on line 141-142
content = """{% extends 'custom_admin/base.html' %}
{% block title %}Jobs Management{% endblock %}
{% block content %}
<!-- Hero Header -->
<div
    class="relative overflow-hidden rounded-2xl mb-6 bg-gradient-to-br from-teal-600 via-green-600 to-emerald-600 p-6 shadow-2xl">
    <div class="absolute inset-0 bg-black opacity-10"></div>
    <div class="relative z-10 flex flex-col sm:flex-row justify-between items-center gap-4">
        <div>
            <h1 class="text-3xl font-bold text-white mb-1">Jobs Management</h1>
            <p class="text-teal-100">Monitor and manage job postings</p>
        </div>
        <a href="{% url 'custom_admin:job_create' %}"
            class="inline-flex items-center px-4 py-2 bg-white/20 backdrop-blur-sm hover:bg-white/30 text-white rounded-lg transition-all duration-300 hover:scale-105 shadow-lg">
            <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4 mr-2" viewBox="0 0 24 24" stroke-width="2"
                stroke="currentColor" fill="none">
                <path stroke="none" d="M0 0h24v24H0z" fill="none" />
                <path d="M12 5l0 14" />
                <path d="M5 12l14 0" />
            </svg>
            Add New Job
        </a>
    </div>
</div>

<div class="page-body">
    <div
        class="bg-white/80 backdrop-blur-xl rounded-2xl shadow-xl border border-white/50 overflow-hidden hover:shadow-2xl transition-all duration-500">
        <div class="p-4 border-b border-gray-100 flex flex-col sm:flex-row justify-between items-center gap-3">
            <div class="flex items-center gap-3">
                <h3 class="text-lg font-semibold text-gray-800">All Jobs</h3>
                <div id="bulkActions" class="hidden flex items-center gap-2">
                    <select id="bulkActionSelect"
                        class="px-3 py-1.5 text-sm border border-gray-200 rounded-lg focus:border-teal-500 focus:ring-2 focus:ring-teal-200">
                        <option value="">Bulk Actions</option>
                        <option value="activate">Activate</option>
                        <option value="deactivate">Deactivate</option>
                        <option value="delete">Delete</option>
                    </select>
                    <button type="button" onclick="applyBulkAction()"
                        class="px-3 py-1.5 bg-teal-600 hover:bg-teal-700 text-white text-sm font-medium rounded-lg transition-colors">Apply</button>
                </div>
            </div>

            <div class="flex items-center gap-3 w-full sm:w-auto">
                <form method="get" class="flex flex-col sm:flex-row gap-2 w-full">
                    <select name="status"
                        class="px-3 py-1.5 text-sm border border-gray-200 rounded-lg bg-gray-50 focus:border-teal-500 focus:ring-2 focus:ring-teal-200 w-full sm:w-28">
                        <option value="">All Status</option>
                        <option value="active" {% if status == 'active' %}selected{% endif %}>Active</option>
                        <option value="inactive" {% if status == 'inactive' %}selected{% endif %}>Inactive</option>
                    </select>
                    <select name="type"
                        class="px-3 py-1.5 text-sm border border-gray-200 rounded-lg bg-gray-50 focus:border-teal-500 focus:ring-2 focus:ring-teal-200 w-full sm:w-32">
                        <option value="">All Types</option>
                        {% for value, label in job_types %}
                        <option value="{{ value }}" {% if job_type == value %}selected{% endif %}>{{ label }}</option>
                        {% endfor %}
                    </select>
                    <input type="text" name="q"
                        class="w-full px-3 py-1.5 text-sm rounded-lg border border-gray-200 bg-white focus:border-teal-500 focus:ring-2 focus:ring-teal-200 transition-all duration-200"
                        placeholder="Search jobs..." value="{{ search_query }}">
                </form>
                <a href="{% url 'custom_admin:jobs_export_csv' %}"
                    class="inline-flex items-center px-3 py-1.5 bg-green-600 hover:bg-green-700 text-white text-sm font-medium rounded-lg transition-colors whitespace-nowrap">
                    <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4 mr-1" viewBox="0 0 24 24" fill="none"
                        stroke="currentColor" stroke-width="2">
                        <path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" />
                        <polyline points="7 10 12 15 17 10" />
                        <line x1="12" y1="15" x2="12" y2="3" />
                    </svg>
                    Export
                </a>
            </div>
        </div>

        <form id="bulkForm" method="post" action="{% url 'custom_admin:jobs_bulk_action' %}">
            {% csrf_token %}
            <input type="hidden" name="action" id="bulkActionInput">
            <div class="overflow-x-auto">
                <table class="w-full text-left border-collapse">
                    <thead>
                        <tr class="bg-gray-50 text-xs uppercase text-gray-500 font-semibold border-b border-gray-100">
                            <th class="px-4 py-3 w-1">
                                <input type="checkbox" id="selectAll"
                                    class="rounded border-gray-300 text-teal-600 focus:ring-teal-500">
                            </th>
                            <th class="px-4 py-3">Job Title</th>
                            <th class="px-4 py-3">Employer</th>
                            <th class="px-4 py-3">Location</th>
                            <th class="px-4 py-3">Type</th>
                            <th class="px-4 py-3">Applications</th>
                            <th class="px-4 py-3">Status</th>
                            <th class="px-4 py-3">Created</th>
                            <th class="px-4 py-3 w-1">Actions</th>
                        </tr>
                    </thead>
                    <tbody class="divide-y divide-gray-100">
                        {% for job in page_obj %}
                        <tr class="hover:bg-teal-50/30 transition-colors duration-200 group">
                            <td class="px-4 py-3">
                                <input type="checkbox" name="job_ids" value="{{ job.id }}"
                                    class="job-checkbox rounded border-gray-300 text-teal-600 focus:ring-teal-500">
                            </td>
                            <td class="px-4 py-3">
                                <div>
                                    <div class="font-medium text-gray-900 group-hover:text-teal-600 transition-colors">
                                        {{ job.title }}</div>
                                    <div class="text-xs text-gray-500 mt-0.5">{{ job.salary_range|default:"-" }}</div>
                                </div>
                            </td>
                            <td class="px-4 py-3 text-sm text-gray-600">{{ job.employer.company_name|default:"Admin" }}
                            </td>
                            <td class="px-4 py-3 text-sm text-gray-600">{{ job.location }}</td>
                            <td class="px-4 py-3">
                                <span
                                    class="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-blue-100 text-blue-800">{{
                                    job.get_job_type_display }}</span>
                            </td>
                            <td class="px-4 py-3">
                                <span
                                    class="inline-flex items-center justify-center px-2 py-0.5 rounded-full text-xs font-medium bg-purple-100 text-purple-800">{{
                                    job.applications_count }}</span>
                            </td>
                            <td class="px-4 py-3">
                                {% if job.is_active %}
                                <span
                                    class="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-green-100 text-green-800">Active</span>
                                {% else %}
                                <span
                                    class="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-gray-100 text-gray-800">Inactive</span>
                                {% endif %}
                            </td>
                            <td class="px-4 py-3 text-sm text-gray-500">{{ job.created_at|date:"M d, Y" }}</td>
                            <td class="px-4 py-3">
                                <div
                                    class="flex items-center gap-1 opacity-0 group-hover:opacity-100 transition-opacity duration-200">
                                    <a href="{% url 'custom_admin:job_detail' job.id %}"
                                        class="px-2 py-1 rounded-lg bg-gray-100 hover:bg-teal-100 text-gray-600 hover:text-teal-600 transition-colors text-xs font-medium">Edit</a>
                                    <a href="{% url 'custom_admin:job_toggle_status' job.id %}"
                                        class="px-2 py-1 rounded-lg border border-gray-200 hover:border-teal-200 hover:bg-teal-50 text-gray-500 hover:text-teal-600 transition-colors text-xs font-medium">{% if job.is_active %}Deactivate{% else %}Activate{% endif %}</a>
                                    <a href="{% url 'custom_admin:job_delete' job.id %}"
                                        onclick="return confirm('Delete this job?')"
                                        class="px-2 py-1 rounded-lg bg-red-50 hover:bg-red-100 text-red-600 transition-colors text-xs font-medium">Delete</a>
                                </div>
                            </td>
                        </tr>
                        {% empty %}
                        <tr>
                            <td colspan="9" class="px-4 py-8 text-center text-gray-500">
                                <div class="flex flex-col items-center justify-center">
                                    <svg xmlns="http://www.w3.org/2000/svg" class="w-12 h-12 text-gray-300 mb-3"
                                        viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" fill="none">
                                        <path stroke="none" d="M0 0h24v24H0z" fill="none" />
                                        <circle cx="12" cy="12" r="9" />
                                        <line x1="9" y1="10" x2="9.01" y2="10" />
                                        <line x1="15" y1="10" x2="15.01" y2="10" />
                                        <path d="M9.5 15.25a3.5 3.5 0 0 1 5 0" />
                                    </svg>
                                    <p class="text-lg font-medium">No jobs found</p>
                                    <p class="text-sm">Try adjusting your search query</p>
                                </div>
                            </td>
                        </tr>
                        {% endfor %}
                    </tbody>
                </table>
            </div>
        </form>

        <!-- Pagination -->
        <div class="px-4 py-3 border-t border-gray-100 bg-gray-50/30 flex items-center justify-between">
            <p class="text-sm text-gray-600 m-0">
                {% if page_obj.paginator.count > 0 %}
                Showing <span class="font-medium">{{ page_obj.start_index }}</span> to <span class="font-medium">{{
                    page_obj.end_index }}</span> of <span class="font-medium">{{ page_obj.paginator.count }}</span>
                entries
                {% else %}
                Showing 0 to 0 of 0 entries
                {% endif %}
            </p>
            <nav class="isolate inline-flex -space-x-px rounded-md shadow-sm" aria-label="Pagination">
                {% if page_obj.has_previous %}
                <a href="?page={{ page_obj.previous_page_number }}{% if search_query %}&q={{ search_query }}{% endif %}{% if status %}&status={{ status }}{% endif %}{% if job_type %}&type={{ job_type }}{% endif %}"
                    class="relative inline-flex items-center rounded-l-md px-2 py-2 text-gray-400 ring-1 ring-inset ring-gray-300 hover:bg-gray-50 focus:z-20 focus:outline-offset-0">
                    <span class="sr-only">Previous</span>
                    <svg class="h-5 w-5" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
                        <path fill-rule="evenodd"
                            d="M12.79 5.23a.75.75 0 01-.02 1.06L8.832 10l3.938 3.71a.75.75 0 11-1.04 1.08l-4.5-4.25a.75.75 0 010-1.08l4.5-4.25a.75.75 0 011.06.02z"
                            clip-rule="evenodd" />
                    </svg>
                </a>
                {% endif %}

                {% for num in page_obj.paginator.page_range %}
                {% if page_obj.number == num %}
                <a href="#" aria-current="page"
                    class="relative z-10 inline-flex items-center bg-teal-600 px-4 py-2 text-sm font-semibold text-white focus:z-20 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-teal-600">{{
                    num }}</a>
                {% elif num > page_obj.number|add:'-3' and num < page_obj.number|add:'3' %} <a
                    href="?page={{ num }}{% if search_query %}&q={{ search_query }}{% endif %}{% if status %}&status={{ status }}{% endif %}{% if job_type %}&type={{ job_type }}{% endif %}"
                    class="relative inline-flex items-center px-4 py-2 text-sm font-semibold text-gray-900 ring-1 ring-inset ring-gray-300 hover:bg-gray-50 focus:z-20 focus:outline-offset-0">
                    {{ num }}</a>
                    {% endif %}
                    {% endfor %}

                    {% if page_obj.has_next %}
                    <a href="?page={{ page_obj.next_page_number }}{% if search_query %}&q={{ search_query }}{% endif %}{% if status %}&status={{ status }}{% endif %}{% if job_type %}&type={{ job_type }}{% endif %}"
                        class="relative inline-flex items-center rounded-r-md px-2 py-2 text-gray-400 ring-1 ring-inset ring-gray-300 hover:bg-gray-50 focus:z-20 focus:outline-offset-0">
                        <span class="sr-only">Next</span>
                        <svg class="h-5 w-5" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
                            <path fill-rule="evenodd"
                                d="M7.21 14.77a.75.75 0 01.02-1.06L11.168 10 7.23 6.29a.75.75 0 111.04-1.08l4.5 4.25a.75.75 0 010 1.08l-4.5 4.25a.75.75 0 01-1.06-.02z"
                                clip-rule="evenodd" />
                        </svg>
                    </a>
                    {% endif %}
            </nav>
        </div>
    </div>
</div>
</div>

<script>
    const selectAll = document.getElementById('selectAll');
    const checkboxes = document.querySelectorAll('.job-checkbox');
    const bulkActions = document.getElementById('bulkActions');

    selectAll?.addEventListener('change', function () {
        checkboxes.forEach(cb => cb.checked = this.checked);
        toggleBulkActions();
    });

    checkboxes.forEach(cb => {
        cb.addEventListener('change', toggleBulkActions);
    });

    function toggleBulkActions() {
        const checked = document.querySelectorAll('.job-checkbox:checked').length;
        if (checked > 0) {
            bulkActions.classList.remove('hidden');
            bulkActions.classList.add('flex');
        } else {
            bulkActions.classList.add('hidden');
            bulkActions.classList.remove('flex');
        }
    }

    function applyBulkAction() {
        const action = document.getElementById('bulkActionSelect').value;
        if (!action) {
            alert('Please select an action');
            return;
        }
        if (action === 'delete' && !confirm('Delete selected jobs?')) {
            return;
        }
        document.getElementById('bulkActionInput').value = action;
        document.getElementById('bulkForm').submit();
    }
</script>
{% endblock %}"""

temp_path = "custom_admin/templates/custom_admin/pages/jobs/list_fixed_v2.html"
final_path = "custom_admin/templates/custom_admin/pages/jobs/list.html"

# Write to temp file
with open(temp_path, "w", encoding="utf-8") as f:
    f.write(content)

print(f"Written temp file {temp_path}")

# Atomic move
shutil.move(temp_path, final_path)
print(f"Moved to {final_path}")