{{-- Modal Fondo Condominiale --}}
<div id="modal-fondo" 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-piggy-bank 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-fondo">
                    Nuovo Fondo Condominiale
                </h3>
                
                <div class="mt-4">
                    <form id="form-fondo" class="space-y-4">
                        <input type="hidden" id="fondo_id" name="id">
                        
                        <div>
                            <label for="fondo_nome" class="block text-sm font-medium text-gray-700 dark:text-gray-300">
                                Nome Fondo *
                            </label>
                            <input type="text" 
                                   id="fondo_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. Fondo Ordinario, Fondo Riserva">
                        </div>
                        
                        <div>
                            <label for="fondo_tipo" class="block text-sm font-medium text-gray-700 dark:text-gray-300">
                                Tipo *
                            </label>
                            <select id="fondo_tipo" 
                                    name="tipo" 
                                    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">
                                <option value="">Seleziona tipo</option>
                                <option value="ordinario">Ordinario</option>
                                <option value="straordinario">Straordinario</option>
                                <option value="riserva">Riserva</option>
                                <option value="lavori">Lavori</option>
                                <option value="manutenzione">Manutenzione</option>
                                <option value="altro">Altro</option>
                            </select>
                        </div>
                        
                        <div>
                            <label for="fondo_saldo_iniziale" class="block text-sm font-medium text-gray-700 dark:text-gray-300">
                                Saldo Iniziale (€)
                            </label>
                            <input type="number" 
                                   id="fondo_saldo_iniziale" 
                                   name="saldo_iniziale" 
                                   step="0.01"
                                   value="0.00"
                                   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">
                        </div>
                        
                        <div>
                            <label for="fondo_obiettivo_saldo" class="block text-sm font-medium text-gray-700 dark:text-gray-300">
                                Obiettivo Saldo (€)
                            </label>
                            <input type="number" 
                                   id="fondo_obiettivo_saldo" 
                                   name="obiettivo_saldo" 
                                   step="0.01"
                                   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="Saldo target da raggiungere">
                        </div>
                        
                        <div>
                            <label for="fondo_descrizione" class="block text-sm font-medium text-gray-700 dark:text-gray-300">
                                Descrizione
                            </label>
                            <textarea id="fondo_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 del fondo e del suo utilizzo"></textarea>
                        </div>
                        
                        <div class="flex items-center">
                            <input type="checkbox" 
                                   id="fondo_attivo" 
                                   name="attivo" 
                                   checked
                                   class="h-4 w-4 text-blue-600 focus:ring-blue-500 border-gray-300 rounded">
                            <label for="fondo_attivo" class="ml-2 block text-sm text-gray-900 dark:text-gray-100">
                                Fondo attivo
                            </label>
                        </div>
                        
                        <div class="mt-6 flex justify-end space-x-3">
                            <button type="button" 
                                    onclick="closeModal('modal-fondo')"
                                    class="bg-gray-300 hover:bg-gray-400 text-gray-800 font-bold py-2 px-4 rounded">
                                Annulla
                            </button>
                            <button type="button" 
                                    onclick="saveFondo()"
                                    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>