document.addEventListener('DOMContentLoaded', function () {
    // Forza la localizzazione italiana
    const locale = 'it-IT';

    const availability = JSON.parse(JSON.stringify(cbpData.availability));
    const appuntamenti = JSON.parse(JSON.stringify(cbpData.busy));
    const apertura = JSON.parse(JSON.stringify(cbpData.apertura));
    const chiusura = JSON.parse(JSON.stringify(cbpData.chiusura));

    console.log(appuntamenti);
    console.log(apertura);
    console.log(chiusura);

    // Elenco delle festività nazionali italiane
    const italianHolidays = [
        '01/01', // Capodanno
        '06/01', // Epifania
        '25/04', // Festa della Liberazione
        '01/05', // Festa dei Lavoratori
        '02/06', // Festa della Repubblica
        '15/08', // Ferragosto
        '01/11', // Ognissanti
        '08/12', // Immacolata Concezione
        '25/12', // Natale
        '26/12'  // Santo Stefano
    ];

    function getAvailableDays() {
        return availability.map(entry => entry.day_of_week.toLowerCase());
    }

    function getSpecialDays() {
        return apertura.map(entry => entry.day_of_week.toLowerCase());
    }

    function showMedicoSlots() {
        const medicoContainer = document.getElementById('medico-days');
        medicoContainer.innerHTML = '';  // Pulisce il contenitore prima di aggiungere nuove informazioni

        const availableDays = getAvailableDays();  // Ottieni tutti i giorni disponibili
        const displayedDays = new Set(); // Set per tenere traccia dei giorni già visualizzati

        availableDays.forEach(dayOfWeek => {
            if (!displayedDays.has(dayOfWeek)) { // Controlla se il giorno è già stato visualizzato
                const entriesForDay = availability.filter(entry => entry.day_of_week.toLowerCase() === dayOfWeek);
                if (entriesForDay.length > 0) {
                    const medicoHeader = document.createElement('div');
                    medicoHeader.innerHTML = `${dayOfWeek.charAt(0).toUpperCase() + dayOfWeek.slice(1)} `; // Inizializza la scritta del giorno con la prima lettera maiuscola

                    const uniqueEntries = new Set(); // Usa un Set per evitare duplicati
                    entriesForDay.forEach(entry => {
                        const medicoStartTime = new Date(`1970-01-01T${entry.start_time}`).toLocaleTimeString('it-IT', { hour: '2-digit', minute: '2-digit' });
                        const medicoEndTime = new Date(`1970-01-01T${entry.end_time}`).toLocaleTimeString('it-IT', { hour: '2-digit', minute: '2-digit' });
                        uniqueEntries.add(`dalle ${medicoStartTime} alle ${medicoEndTime}`); // Aggiungi solo voci uniche
                    });

                    medicoHeader.textContent += Array.from(uniqueEntries).join(', '); // Unisci le fasce orarie uniche

                    // Rimuove l'ultima virgola e spazio
                    medicoContainer.appendChild(medicoHeader);
                    displayedDays.add(dayOfWeek); // Aggiungi il giorno al Set
                }
            }
        });

        const specialDays = getSpecialDays();  // Ottieni tutti i giorni disponibili
        specialDays.forEach(dayOfWeek => {
            if (!displayedDays.has(dayOfWeek)) { // Controlla se il giorno è già stato visualizzato
                const entriesForDay = apertura.filter(entry => entry.day_of_week.toLowerCase() === dayOfWeek);
                if (entriesForDay.length > 0) {
                    const specialDayHeader = document.createElement('div');
                    specialDayHeader.innerHTML = `${dayOfWeek.split('-')[2]}-${dayOfWeek.split('-')[1]}-${dayOfWeek.split('-')[0]} `;

                    const uniqueEntries = new Set(); // Usa un Set per evitare duplicati
                    entriesForDay.forEach(entry => {
                        const specialDayStartTime = new Date(`1970-01-01T${entry.start_time}`).toLocaleTimeString('it-IT', { hour: '2-digit', minute: '2-digit' });
                        const specialDayEndTime = new Date(`1970-01-01T${entry.end_time}`).toLocaleTimeString('it-IT', { hour: '2-digit', minute: '2-digit' });
                        uniqueEntries.add(`dalle ${specialDayStartTime} alle ${specialDayEndTime}`); // Aggiungi solo voci uniche
                    });

                    specialDayHeader.textContent += Array.from(uniqueEntries).join(', '); // Unisci le fasce orarie uniche

                    // Rimuove l'ultima virgola e spazio
                    medicoContainer.appendChild(specialDayHeader);
                    displayedDays.add(dayOfWeek); // Aggiungi il giorno al Set
                }
            }
        });


    }

    function highlightSelectedDay(selectedDayCell) {
        // Rimuove la classe "selected" da tutti i giorni
        const days = document.querySelectorAll('#calendar .available');
        days.forEach(day => day.classList.remove('selected'));

        // Aggiunge la classe "selected" al giorno cliccato
        selectedDayCell.classList.add('selected');
    }

    function generateCalendar(year, month) {
        const calendar = document.getElementById('calendar');
        const calendarWeekdays = document.getElementById('calendar-weekdays');
        const currentMonthElement = document.getElementById('current-month');

        // Imposta il nome del mese corrente
        const monthNames = [
            'Gennaio', 'Febbraio', 'Marzo', 'Aprile', 'Maggio', 'Giugno',
            'Luglio', 'Agosto', 'Settembre', 'Ottobre', 'Novembre', 'Dicembre'
        ];
        currentMonthElement.textContent = `${monthNames[month]} ${year}`;

        // Intestazione dei giorni della settimana
        const weekdayNames = ['Lun', 'Mar', 'Mer', 'Gio', 'Ven', 'Sab', 'Dom'];
        calendarWeekdays.innerHTML = '';
        weekdayNames.forEach(day => {
            const dayHeader = document.createElement('div');
            dayHeader.textContent = day;
            calendarWeekdays.appendChild(dayHeader);
        });

        calendar.innerHTML = '';
        const date = new Date(year, month, 1);
        // Forza l'inizio della settimana a lunedì (1) invece di domenica (0)
        let firstDay = date.getDay();
        firstDay = firstDay === 0 ? 6 : firstDay - 1; // Converti da domenica=0 a lunedì=0
        const daysInMonth = new Date(year, month + 1, 0).getDate();

        const availableDays = getAvailableDays();

        // Spazi vuoti per i giorni della settimana prima dell'inizio del mese
        for (let i = 0; i < firstDay; i++) {
            const emptyCell = document.createElement('div');
            calendar.appendChild(emptyCell);
        }

        // oggi
        const today = new Date();
        today.setHours(0, 0, 0, 0); // Imposta l'ora a mezzanotte

        const giorniApertura = apertura.map(except => except.day_of_week);
        const giorniChiusura = chiusura.map(except => except.day_of_week);

        // Genera i giorni del mese
        for (let day = 1; day <= daysInMonth; day++) {
            const currentDate = new Date(year, month, day);
            const dayOfWeek = currentDate.toLocaleDateString('it-IT', { weekday: 'long' });
            const dayCell = document.createElement('div');
            dayCell.textContent = day;

            // Formatta la data per il confronto con le festività
            const formattedDay = day.toString().padStart(2, '0');
            const formattedMonth = (month + 1).toString().padStart(2, '0');
            const formattedDate = `${year}-${formattedMonth}-${formattedDay}`;

            // Calcola la data minima considerando il ritardo
            const ritardoMinuti = cbpData.ritardo_minuti || 0;
            let dataMinima = new Date(today);

            if (ritardoMinuti >= 1440) {
                // Se ritardo è in giorni, sposta la data minima
                const giorni = Math.floor(ritardoMinuti / 1440);
                dataMinima.setDate(dataMinima.getDate() + giorni);
                dataMinima.setHours(0, 0, 0, 0); // Inizio giornata
            }

            // Controlla se la data è disponibile considerando il ritardo
            if (currentDate >= dataMinima) {
                if (giorniChiusura.includes(formattedDate)) { // Disabilita i giorni di chiusura
                    dayCell.classList.add('disabled');
                } else if (giorniApertura.includes(formattedDate)) { // Abilita i giorni di apertura
                    dayCell.classList.add('available');
                    dayCell.addEventListener('click', () => {
                        handleDayOfWeekException(formattedDate, day, month, year);
                        highlightSelectedDay(dayCell);
                    });
                } else if (italianHolidays.includes(`${formattedDay}/${formattedMonth}`)) {
                    dayCell.classList.add('disabled'); // Disabilita le festività
                } else if (availableDays.includes(dayOfWeek.toLowerCase())) {
                    dayCell.classList.add('available');
                    dayCell.addEventListener('click', () => {
                        showTimeSlots(dayOfWeek, day, month, year);
                        highlightSelectedDay(dayCell);
                    });
                } else {
                    dayCell.classList.add('disabled');
                }
            } else {
                dayCell.classList.add('disabled'); // Disabilita le date precedenti o entro il ritardo
                if (currentDate >= today && ritardoMinuti >= 1440) {
                    dayCell.title = 'Non disponibile - prenotazione con anticipo richiesto';
                }
            }


            calendar.appendChild(dayCell);
        }
    }


    function showTimeSlots(dayOfWeek, day, month, year) {
        const timeSlots = document.getElementById('time-slots');
        const timeSlotList = document.getElementById('time-slot-list');
        const selectedDayElement = document.getElementById('selected-day');
        timeSlotList.innerHTML = '';  // Resetta la lista degli slot temporali

        // Costruisce la data completa nel formato dd/mm/yyyy
        const formattedDay = day.toString().padStart(2, '0'); // Aggiunge uno zero iniziale se necessario
        const formattedMonth = (month + 1).toString().padStart(2, '0'); // Mesi sono da 0 a 11, quindi aggiungi 1
        const formattedDate = `${formattedDay}/${formattedMonth}/${year}`

        // Imposta il nome del mese corrente
        const monthNames = [
            'Gennaio', 'Febbraio', 'Marzo', 'Aprile', 'Maggio', 'Giugno',
            'Luglio', 'Agosto', 'Settembre', 'Ottobre', 'Novembre', 'Dicembre'
        ];
        // Aggiorna il titolo con la data completa
        selectedDayElement.textContent = `${formattedDay} ${monthNames[month]} ${year}`;

        controlDate = `${year}-${formattedMonth}-${formattedDay}`;

        // Ottieni le fasce orarie per il giorno selezionato
        const availableEntries = availability.filter(entry => entry.day_of_week.toLowerCase() === dayOfWeek.toLowerCase());

        // Imposta la griglia con un numero di colonne fisso
        const columns = 6; // Puoi modificare questo numero in base a quante colonne vuoi nella griglia
        timeSlotList.style.display = 'grid';
        timeSlotList.style.gridTemplateColumns = `repeat(${columns}, 1fr)`;
        timeSlotList.style.gap = '5px'; // Spazio tra gli slot

        availableEntries.forEach(entry => {

            // generazione degli slot
            const startTime = new Date(`1970-01-01T${entry.start_time}`);
            const endTime = new Date(`1970-01-01T${entry.end_time}`);
            const timeIncrement = parseInt(entry.minutes_slots, 10);
            let slots = []; // Reset per ogni fascia oraria

            let currentTime = new Date(startTime);
            while (currentTime <= endTime) {
                slots.push(currentTime.toLocaleTimeString('it-IT', { hour: '2-digit', minute: '2-digit' }));
                currentTime.setMinutes(currentTime.getMinutes() + timeIncrement);
            }
            slots.push('salto'); // aggiunge uno slot di controllo all fine della fascia oraria

            // Usa max_slots specifico per questa fascia oraria
            let maxSlots = entry.max_slots || 0;
            let clickableSlotsCount = 0; // Contatore per gli slot cliccabili
            if (maxSlots == 0) {
                maxSlots = 100;
            }

            slots.forEach(time => {
                const timeSlot = document.createElement('div');
                var currentBookings = 0;
                var testo = '';
                const maxBookings = entry.max_bookings || 0;

                if (time === 'salto') {
                    timeSlot.style.gridColumn = 'span 6';
                    timeSlot.style.height = '20px';
                } else {

                    // Controlla se lo slot è già passato (solo per il giorno corrente)
                    const oggi = new Date();
                    oggi.setHours(0, 0, 0, 0);
                    const giornoSelezionato = new Date(year, month, day);
                    giornoSelezionato.setHours(0, 0, 0, 0);

                    if (oggi.getTime() === giornoSelezionato.getTime()) {
                        // Stesso giorno: controlla se l'orario è già passato
                        const oraCorrente = new Date();
                        const oraSlot = new Date();
                        const [ore, minuti] = time.split(':');
                        oraSlot.setHours(parseInt(ore), parseInt(minuti), 0, 0);

                        // Se l'ora dello slot è già passata, disabilita
                        if (oraSlot <= oraCorrente) {
                            timeSlot.classList.add('time-slot', 'disabled');
                            timeSlot.style.pointerEvents = 'none';
                            timeSlot.title = 'Orario già trascorso';
                            timeSlot.textContent = time;
                            timeSlotList.appendChild(timeSlot);
                            return; // Salta il resto della logica
                        }

                        // Controlla il ritardo per gli slot orari (solo se ritardo < 1 giorno)
                        const ritardoMinuti = cbpData.ritardo_minuti || 0;
                        if (ritardoMinuti > 0 && ritardoMinuti < 1440) {
                            const oraLimite = new Date(oraCorrente.getTime() + ritardoMinuti * 60000);

                            if (oraSlot <= oraLimite) {
                                timeSlot.classList.add('time-slot', 'disabled');
                                timeSlot.style.pointerEvents = 'none';
                                timeSlot.title = `Non disponibile - prenotazione con ${ritardoMinuti} minuti di anticipo`;
                                timeSlot.textContent = time;
                                timeSlotList.appendChild(timeSlot);
                                return; // Salta il resto della logica
                            }
                        }
                    }

                    // conta il numero di prenotazioni per la fascia oraria
                    const bookingsForTimeSlot = appuntamenti.filter(app => {
                        const appDate = new Date(app.date);
                        const appTime = new Date(`1970-01-01T${app.time}`).toLocaleTimeString('it-IT', { hour: '2-digit', minute: '2-digit' });
                        return controlDate === `${appDate.getFullYear()}-${(appDate.getMonth() + 1).toString().padStart(2, '0')}-${appDate.getDate().toString().padStart(2, '0')}` && appTime === time;
                    });
                    currentBookings = bookingsForTimeSlot.length;

                    timeSlot.textContent = time;
                    // aggiunge il numero di prenotazioni al testo
                    if (maxBookings > 1) {
                        const bookingCountText = document.createElement('div'); // Crea un nuovo elemento span
                        bookingCountText.textContent = `Prenotati:  ${currentBookings} / ${maxBookings} `;
                        bookingCountText.style.fontSize = 'x-small'; // Imposta il testo più piccolo
                        timeSlot.appendChild(bookingCountText); // Aggiungi il conteggio come figlio del timeSlot
                    }
                    testo = timeSlot.textContent;

                    // Controlla se lo slot è occupato
                    const isBusy = appuntamenti.some(app => {
                        const appDate = new Date(app.date);
                        const appTime = new Date(`1970-01-01T${app.time}`).toLocaleTimeString('it-IT', { hour: '2-digit', minute: '2-digit' });
                        return controlDate === `${appDate.getFullYear()}-${(appDate.getMonth() + 1).toString().padStart(2, '0')}-${appDate.getDate().toString().padStart(2, '0')}` && appTime === time;
                    });

                    if (isBusy) {
                        // verifica se il numero di prenotazioni è maggiore o uguale al numero di massimo di prenotazioni
                        if (currentBookings >= maxBookings) {
                            timeSlot.classList.add('time-slot', 'busy');
                            timeSlot.style.pointerEvents = 'none';
                        } else {
                            timeSlot.classList.add('time-slot');
                            timeSlot.addEventListener('click', () => selectTimeSlot(formattedDate, time, testo, entry.services));
                            clickableSlotsCount++;
                        }
                    } else if (clickableSlotsCount < maxSlots) {
                        timeSlot.classList.add('time-slot'); // Aggiungi una classe per lo stile    
                        timeSlot.addEventListener('click', () => selectTimeSlot(formattedDate, time, testo, entry.services));
                        clickableSlotsCount++;
                    } else {
                        timeSlot.classList.add('time-slot', 'disabled');
                        timeSlot.style.pointerEvents = 'none';
                    }
                }

                timeSlotList.appendChild(timeSlot);
            });
        });

        timeSlots.style.display = 'block';
    }


    function selectTimeSlot(dayOfWeek, time, testo, services) {
        // Rimuovi la selezione precedente
        const previouslySelectedSlot = document.querySelector('.time-slot.selected');
        if (previouslySelectedSlot) {
            previouslySelectedSlot.classList.remove('selected');
        }

        // Trova e evidenzia lo slot selezionato
        const timeSlots = document.querySelectorAll('.time-slot');
        timeSlots.forEach(slot => {
            if (slot.textContent === testo) {
                slot.classList.add('selected');
            }
        });

        // Aggiorna i campi nascosti
        const PrenotaData = document.getElementById('PrenotaData');
        const PrenotaOra = document.getElementById('PrenotaOra');
        const Prenotazione = document.getElementById('prenotazione');
        PrenotaData.value = dayOfWeek;
        PrenotaOra.value = time;
        Prenotazione.textContent = "Hai selezionato il " + dayOfWeek + " alle ore " + time;

        // Aggiorna la select dei servizi
        const tipoVisitaSelect = document.getElementById('tipo_visita');
        tipoVisitaSelect.innerHTML = ''; // Pulisce le opzioni esistenti

        // Mappa i valori dei servizi ai testi da visualizzare
        const serviceTexts = {
            'rinnovo': 'RINNOVO',
            'conseguimento': 'CONSEGUIMENTO',
            'porto_d_armi': 'PORTO D\'ARMI',
            'estensione': 'ESTENSIONE',
            'duplicato_documento': 'DUPLICATO DOCUMENTO',
            'rinnovo_patente_nautica': 'RINNOVO PATENTE NAUTICA'
        };

        // Assicurati che services sia un array
        let servicesArray = [];
        if (services && services !== '' && services !== null && services !== undefined) {
            // Se services è una stringa, convertila in array
            if (typeof services === 'string') {
                try {
                    const parsed = JSON.parse(services);
                    servicesArray = Array.isArray(parsed) ? parsed : [parsed];
                } catch (e) {
                    // Se non è JSON valido, tratta come stringa singola
                    servicesArray = [services];
                }
            } else if (Array.isArray(services)) {
                servicesArray = services;
            }
        }

        // Se non ci sono servizi specifici o l'array è vuoto, usa tutti i servizi disponibili
        const servicesToUse = (servicesArray && servicesArray.length > 0) ? servicesArray : Object.keys(serviceTexts);

        if (servicesToUse.length > 1) {
            const defaultOption = document.createElement('option');
            defaultOption.value = '';
            defaultOption.textContent = 'Seleziona un servizio';
            tipoVisitaSelect.appendChild(defaultOption);
        }


        // Aggiunge le opzioni in base ai servizi disponibili
        servicesToUse.forEach(service => {
            const option = document.createElement('option');
            option.value = service;
            option.textContent = serviceTexts[service] || service.toUpperCase();
            tipoVisitaSelect.appendChild(option);
        });
    }

    // Controllo della navigazione tra i mesi
    function setupMonthNavigation() {
        let currentYear = new Date().getFullYear();
        let currentMonth = new Date().getMonth();

        document.getElementById('prev-month').addEventListener('click', (event) => {
            event.preventDefault();
            if (currentMonth === 0) {
                currentMonth = 11;
                currentYear--;
            } else {
                currentMonth--;
            }
            generateCalendar(currentYear, currentMonth);
        });

        document.getElementById('next-month').addEventListener('click', (event) => {
            event.preventDefault();
            if (currentMonth === 11) {
                currentMonth = 0;
                currentYear++;
            } else {
                currentMonth++;
            }
            generateCalendar(currentYear, currentMonth);
        });

        generateCalendar(currentYear, currentMonth);
    }

    function handleDayOfWeekException(dayOfWeek, day, month, year) {
        const timeSlots = document.getElementById('time-slots');
        const timeSlotList = document.getElementById('time-slot-list');
        const selectedDayElement = document.getElementById('selected-day');
        timeSlotList.innerHTML = '';  // Resetta la lista degli slot temporali

        // Costruisce la data completa nel formato dd/mm/yyyy
        const formattedDay = day.toString().padStart(2, '0');
        const formattedMonth = (month + 1).toString().padStart(2, '0');
        const formattedDate = `${formattedDay}/${formattedMonth}/${year}`

        // Imposta il nome del mese corrente
        const monthNames = [
            'Gennaio', 'Febbraio', 'Marzo', 'Aprile', 'Maggio', 'Giugno',
            'Luglio', 'Agosto', 'Settembre', 'Ottobre', 'Novembre', 'Dicembre'
        ];
        selectedDayElement.textContent = `${formattedDay} ${monthNames[month]} ${year}`;

        controlDate = `${year}-${formattedMonth}-${formattedDay}`;

        // Ottieni le fasce orarie per il giorno selezionato
        const availableEntries = apertura.filter(entry => entry.day_of_week === dayOfWeek);

        // Imposta la griglia con un numero di colonne fisso
        const columns = 6;
        timeSlotList.style.display = 'grid';
        timeSlotList.style.gridTemplateColumns = `repeat(${columns}, 1fr)`;
        timeSlotList.style.gap = '5px';

        availableEntries.forEach(entry => {
            const startTime = new Date(`1970-01-01T${entry.start_time}`);
            const endTime = new Date(`1970-01-01T${entry.end_time}`);
            const timeIncrement = parseInt(entry.minutes_slots, 10);
            let slots = [];

            let currentTime = new Date(startTime);
            while (currentTime <= endTime) {
                slots.push(currentTime.toLocaleTimeString('it-IT', { hour: '2-digit', minute: '2-digit' }));
                currentTime.setMinutes(currentTime.getMinutes() + timeIncrement);
            }
            slots.push('salto');

            let maxSlots = entry.max_slots || 0;
            let clickableSlotsCount = 0;
            if (maxSlots == 0) {
                maxSlots = 100;
            }

            slots.forEach(time => {
                const timeSlot = document.createElement('div');
                var currentBookings = 0;
                var testo = '';
                const maxBookings = entry.max_bookings || 0;

                if (time === 'salto') {
                    timeSlot.style.gridColumn = 'span 6';
                    timeSlot.style.height = '20px';
                } else {
                    // Controlla se lo slot è già passato (solo per il giorno corrente)
                    const oggi = new Date();
                    oggi.setHours(0, 0, 0, 0);
                    const giornoSelezionato = new Date(year, month, day);
                    giornoSelezionato.setHours(0, 0, 0, 0);

                    if (oggi.getTime() === giornoSelezionato.getTime()) {
                        // Stesso giorno: controlla se l'orario è già passato
                        const oraCorrente = new Date();
                        const oraSlot = new Date();
                        const [ore, minuti] = time.split(':');
                        oraSlot.setHours(parseInt(ore), parseInt(minuti), 0, 0);

                        // Se l'ora dello slot è già passata, disabilita
                        if (oraSlot <= oraCorrente) {
                            timeSlot.classList.add('time-slot', 'disabled');
                            timeSlot.style.pointerEvents = 'none';
                            timeSlot.title = 'Orario già trascorso';
                            timeSlot.textContent = time;
                            timeSlotList.appendChild(timeSlot);
                            return; // Salta il resto della logica
                        }

                        // Controlla il ritardo per gli slot orari nei giorni di apertura straordinaria
                        const ritardoMinuti = cbpData.ritardo_minuti || 0;
                        if (ritardoMinuti > 0 && ritardoMinuti < 1440) {
                            const oraLimite = new Date(oraCorrente.getTime() + ritardoMinuti * 60000);

                            if (oraSlot <= oraLimite) {
                                timeSlot.classList.add('time-slot', 'disabled');
                                timeSlot.style.pointerEvents = 'none';
                                timeSlot.title = `Non disponibile - prenotazione con ${ritardoMinuti} minuti di anticipo`;
                                timeSlot.textContent = time;
                                timeSlotList.appendChild(timeSlot);
                                return; // Salta il resto della logica
                            }
                        }
                    }

                    const bookingsForTimeSlot = appuntamenti.filter(app => {
                        const appDate = new Date(app.date);
                        const appTime = new Date(`1970-01-01T${app.time}`).toLocaleTimeString('it-IT', { hour: '2-digit', minute: '2-digit' });
                        return controlDate === `${appDate.getFullYear()}-${(appDate.getMonth() + 1).toString().padStart(2, '0')}-${appDate.getDate().toString().padStart(2, '0')}` && appTime === time;
                    });
                    currentBookings = bookingsForTimeSlot.length;

                    timeSlot.textContent = time;
                    if (maxBookings > 1) {
                        const bookingCountText = document.createElement('div');
                        bookingCountText.textContent = `Prenotati:  ${currentBookings} / ${maxBookings} `;
                        bookingCountText.style.fontSize = 'x-small';
                        timeSlot.appendChild(bookingCountText);
                    }
                    testo = timeSlot.textContent;

                    const isBusy = appuntamenti.some(app => {
                        const appDate = new Date(app.date);
                        const appTime = new Date(`1970-01-01T${app.time}`).toLocaleTimeString('it-IT', { hour: '2-digit', minute: '2-digit' });
                        return controlDate === `${appDate.getFullYear()}-${(appDate.getMonth() + 1).toString().padStart(2, '0')}-${appDate.getDate().toString().padStart(2, '0')}` && appTime === time;
                    });

                    if (isBusy) {
                        if (currentBookings >= maxBookings) {
                            timeSlot.classList.add('time-slot', 'busy');
                            timeSlot.style.pointerEvents = 'none';
                        } else {
                            timeSlot.classList.add('time-slot');
                            timeSlot.addEventListener('click', () => selectTimeSlot(formattedDate, time, testo, entry.services));
                            clickableSlotsCount++;
                        }
                    } else if (clickableSlotsCount < maxSlots) {
                        timeSlot.classList.add('time-slot');
                        timeSlot.addEventListener('click', () => selectTimeSlot(formattedDate, time, testo, entry.services));
                        clickableSlotsCount++;
                    } else {
                        timeSlot.classList.add('time-slot', 'disabled');
                        timeSlot.style.pointerEvents = 'none';
                    }
                }
                timeSlotList.appendChild(timeSlot);
            });
        });

        timeSlots.style.display = 'block';
    }

    // Gestione dello slot selezionato
    function handleSlotSelection(slot) {
        // Rimuovi la classe selected da tutti gli slot
        document.querySelectorAll('.time-slot').forEach(s => s.classList.remove('selected'));

        // Aggiungi la classe selected allo slot cliccato
        slot.classList.add('selected');

        // Aggiorna il testo della prenotazione
        const selectedDay = document.getElementById('selected-day').textContent;
        const selectedTime = slot.textContent;
        document.getElementById('prenotazione').textContent = `Prenotazione per il ${selectedDay} alle ${selectedTime}`;

        // Aggiorna i campi nascosti
        document.getElementById('PrenotaData').value = selectedDay;
        document.getElementById('PrenotaOra').value = selectedTime;

        // Aggiorna il select dei servizi
        updateServicesSelect(selectedTime);
    }

    // Funzione per aggiornare il select dei servizi
    function updateServicesSelect(selectedTime) {
        const servicesSelect = document.getElementById('tipo_visita');
        const services = cbpData.services || [];

        // Pulisci il select
        servicesSelect.innerHTML = '<option value="">Seleziona un servizio</option>';

        // Filtra i servizi disponibili per lo slot selezionato
        const availableServices = services.filter(service => {
            return service.slots.includes(selectedTime);
        });

        // Aggiungi le opzioni al select
        availableServices.forEach(service => {
            const option = document.createElement('option');
            option.value = service.id;
            option.textContent = service.name;
            servicesSelect.appendChild(option);
        });
    }

    // Inizializza il select dei servizi con tutti i servizi disponibili
    function initializeServicesSelect() {
        const tipoVisitaSelect = document.getElementById('tipo_visita');
        if (!tipoVisitaSelect) return;

        // Mappa i valori dei servizi ai testi da visualizzare
        const serviceTexts = {
            'rinnovo': 'RINNOVO',
            'conseguimento': 'CONSEGUIMENTO',
            'porto_d_armi': 'PORTO D\'ARMI',
            'estensione': 'ESTENSIONE',
            'duplicato_documento': 'DUPLICATO DOCUMENTO',
            'rinnovo_patente_nautica': 'RINNOVO PATENTE NAUTICA'
        };

        // Pulisce le opzioni esistenti
        tipoVisitaSelect.innerHTML = '';

        // Aggiunge l'opzione di default
        const defaultOption = document.createElement('option');
        defaultOption.value = '';
        defaultOption.textContent = 'Seleziona un servizio';
        tipoVisitaSelect.appendChild(defaultOption);

        // Aggiunge tutti i servizi disponibili
        Object.keys(serviceTexts).forEach(service => {
            const option = document.createElement('option');
            option.value = service;
            option.textContent = serviceTexts[service];
            tipoVisitaSelect.appendChild(option);
        });
    }

    showMedicoSlots();
    setupMonthNavigation();
    initializeServicesSelect();
});