{{-- Modal Tabella Millesimale --}}
<div id="modal-tabella" class="fixed inset-0 bg-gray-600 bg-opacity-50 overflow-y-auto h-full w-full hidden">
    <div class="relative top-20 mx-auto p-5 border w-96 shadow-lg rounded-md bg-white dark:bg-gray-800">
        <div class="mt-3">
            <div class="mx-auto flex items-center justify-center h-12 w-12 rounded-full bg-green-100">
                <i class="fas fa-table text-green-600"></i>
            </div>
            
            <div class="mt-5 text-center">
                <h3 class="text-lg leading-6 font-medium text-gray-900 dark:text-gray-100" id="modal-title">
                    Nuova Tabella Millesimale
                </h3>
                
                <div class="mt-4">
                    <form id="form-tabella" class="space-y-4">
                        <input type="hidden" id="tabella_id" name="id">
                        
                        <div>
                            <label for="tabella_nome" class="block text-sm font-medium text-gray-700 dark:text-gray-300">
                                Nome Tabella *
                            </label>
                            <input type="text" 
                                   id="tabella_nome" 
                                   name="nome" 
                                   required
                                   class="mt-1 block w-full border-gray-300 dark:border-gray-600 rounded-md shadow-sm focus:ring-blue-500 focus:border-blue-500 dark:bg-gray-700 dark:text-white"
                                   placeholder="es. Proprietà, Scale, Ascensore">
                        </div>
                        
                        <div>
                            <label for="tabella_descrizione" class="block text-sm font-medium text-gray-700 dark:text-gray-300">
                                Descrizione
                            </label>
                            <textarea id="tabella_descrizione" 
                                      name="descrizione" 
                                      rows="3"
                                      class="mt-1 block w-full border-gray-300 dark:border-gray-600 rounded-md shadow-sm focus:ring-blue-500 focus:border-blue-500 dark:bg-gray-700 dark:text-white"
                                      placeholder="Descrizione della tabella millesimale"></textarea>
                        </div>
                        
                        <div class="mt-6 flex justify-end space-x-3">
                            <button type="button" 
                                    onclick="closeModal('modal-tabella')"
                                    class="bg-gray-300 hover:bg-gray-400 text-gray-800 font-bold py-2 px-4 rounded">
                                Annulla
                            </button>
                            <button type="button" 
                                    onclick="saveTabella()"
                                    class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded">
                                Salva
                            </button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>