.elementor-3432 .elementor-element.elementor-element-4b5d067c{--display:flex;}.elementor-3432 .elementor-element.elementor-element-5131fde9{--display:flex;}.elementor-3432 .elementor-element.elementor-element-4958c4cd{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-3432 .elementor-element.elementor-element-2206de0e{--display:flex;}.elementor-3432 .elementor-element.elementor-element-66ec0c58{--display:flex;}.elementor-3432 .elementor-element.elementor-element-4add3ca{--display:flex;}.elementor-widget .tippy-tooltip .tippy-content{text-align:center;}/* Start custom CSS *//* CSS da includere UNA SOLA VOLTA */
/* Stili generali (body, etc. potrebbero già essere nel tema) */
body { /* Probabilmente non necessario se già nel tema */
    font-family: 'Arial', sans-serif;
}

/* Contenitore per ciascun widget */
.product-info-widget .container { /* Rendi più specifico se necessario */
    background-color: #ffffff;
    padding: 30px;
    border-radius: 10px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    text-align: center;
    width: 100%;
    max-width: 450px; /* O rimuovi per larghezza piena del widget */
    box-sizing: border-box;
    margin: 20px auto; /* Aggiunge spazio tra i widget */
}

.product-info-widget h1 {
    color: #0056b3;
    margin-top: 0;
    margin-bottom: 10px;
    font-size: 1.9em;
    border-bottom: 1px solid #eee;
    padding-bottom: 15px;
}

.product-info-widget .description {
    text-align: center;
    font-size: 0.95em;
    color: #666;
    margin-top: -5px;
    margin-bottom: 25px;
    line-height: 1.4;
    padding-left: 10px;
    padding-right: 10px;
}

/* Stili per il messaggio di stato/avviso */
.product-info-widget .status-message { /* Usa la classe */
    padding: 12px 15px;
    margin-bottom: 25px;
    border-radius: 6px;
    text-align: center;
    font-weight: bold;
    line-height: 1.5;
    display: none; /* Nascosto di default */
}

.product-info-widget .status-message.warning { /* Usa la classe */
    background-color: #fff3cd;
    border: 1px solid #ffeeba;
    color: #856404;
    display: block; /* Visibile */
}

.product-info-widget .display-group {
    margin-bottom: 20px;
    text-align: left;
    background-color: #f9f9f9;
    padding: 15px;
    border-radius: 6px;
    border: 1px solid #e9e9e9;
}

.product-info-widget .display-group p:first-child {
    margin: 0 0 8px 0;
    font-weight: bold;
    font-size: 1em;
    color: #555;
}

/* Stile per i valori visualizzati */
.product-info-widget .display-group p:last-child {
    margin: 0;
    font-weight: normal;
    /* Usa le classi per i colori specifici sotto */
    font-size: 1.2em;
    min-height: 1.2em;
}

/* Colori specifici per i valori (ora con classi) */
.product-info-widget .days-passed-display { font-weight: bold; color: #333; }
.product-info-widget .current-date-display { color: #007bff; }
.product-info-widget .activation-date-display { color: #5cb85c; }
.product-info-widget .expiry-date-display { color: #ff7f50; } /* Default */

/* Se scaduto, cambia colore alla data di scadenza */
.product-info-widget .status-message.warning ~ .display-group .expiry-date-display { /* Usa le classi */
    color: #dc3545;
    font-weight: bold;
}
<script>
document.addEventListener('DOMContentLoaded', () => {
    // Opzioni comuni per formattare la data
    const opzioniFormatoData = { year: 'numeric', month: '2-digit', day: '2-digit' };

    // Trova TUTTI i widget che hanno la nostra classe designata
    const allWidgets = document.querySelectorAll('.product-info-widget');

    console.log(`Trovati ${allWidgets.length} widget product-info-widget`);

    // Itera su ciascun widget trovato
    allWidgets.forEach((widget, index) => {
        console.log(`Processing widget ${index + 1}`);

        // Leggi la data di attivazione specifica per QUESTO widget dall'attributo data-*
        const dataAttivazioneCodice = widget.getAttribute('data-activation-date');

        // Se manca l'attributo data, salta questo widget e logga un errore
        if (!dataAttivazioneCodice) {
            console.error(`Attributo 'data-activation-date' mancante per il widget ${index + 1}:`, widget);
            return; // Vai al prossimo widget
        }
        console.log(`Widget ${index + 1}: Data Attivazione letta = ${dataAttivazioneCodice}`);

        // Trova gli elementi INTERNI a questo specifico widget usando le classi
        const activationDateDisplay = widget.querySelector('.activation-date-display');
        const currentDateDisplay    = widget.querySelector('.current-date-display');
        const daysPassedDisplay     = widget.querySelector('.days-passed-display');
        const expiryDateDisplay     = widget.querySelector('.expiry-date-display');
        const statusMessage         = widget.querySelector('.status-message');

        // Verifica che tutti gli elementi necessari siano stati trovati DENTRO questo widget
        if (!activationDateDisplay || !currentDateDisplay || !daysPassedDisplay || !expiryDateDisplay || !statusMessage) {
             console.error(`Uno o più elementi di display mancanti per il widget ${index + 1}:`, widget);
             // Potresti voler mostrare un errore all'interno del widget stesso qui
             if (statusMessage) {
                 statusMessage.textContent = 'Errore struttura interna widget.';
                 statusMessage.className = 'status-message warning'; // Mostra errore
             }
             return; // Vai al prossimo widget
        }

        // --- Logica di calcolo e visualizzazione (ora specifica per 'widget') ---
        try {
            // Resetta il messaggio di stato per questo widget
            statusMessage.textContent = '';
            statusMessage.className = 'status-message'; // Rimuove classi come 'warning'

            // 1. Data Attuale (uguale per tutti)
            const dataAttuale = new Date();
            currentDateDisplay.textContent = dataAttuale.toLocaleDateString('it-IT', opzioniFormatoData);
            dataAttuale.setHours(0, 0, 0, 0);

            // 2. Data Attivazione (specifica del widget)
            const partiAttivazione = dataAttivazioneCodice.split('-');
            const dataAttivazione = new Date(partiAttivazione[0], partiAttivazione[1] - 1, partiAttivazione[2]);
            dataAttivazione.setHours(0, 0, 0, 0);

            if (isNaN(dataAttivazione.getTime())) {
               throw new Error(`Data di attivazione non valida (${dataAttivazioneCodice}) nel widget ${index + 1}`);
            }
            activationDateDisplay.textContent = dataAttivazione.toLocaleDateString('it-IT', opzioniFormatoData);

            // 3. Giorni Trascorsi
            if (dataAttivazione > dataAttuale) {
                daysPassedDisplay.textContent = "Attivazione futura";
            } else {
                const differenzaInMs = dataAttuale.getTime() - dataAttivazione.getTime();
                const differenzaInGiorni = Math.floor(differenzaInMs / (1000 * 60 * 60 * 24));
                daysPassedDisplay.textContent = differenzaInGiorni;
            }

            // 4. Data Scadenza (Calcolata)
            const dataScadenzaCalcolata = new Date(dataAttivazione);
            dataScadenzaCalcolata.setFullYear(dataScadenzaCalcolata.getFullYear() + 1);
            expiryDateDisplay.textContent = dataScadenzaCalcolata.toLocaleDateString('it-IT', opzioniFormatoData);

            // 5. Controllo Scadenza
            const isExpired = dataScadenzaCalcolata < dataAttuale;
            console.log(`Widget ${index + 1}: Controllo scadenza (scadenza < attuale) = ${isExpired}`);

            if (isExpired) {
                console.log(`Widget ${index + 1}: Prodotto scaduto.`);
                statusMessage.innerHTML = `⚠️ <strong>Attenzione: Prodotto Scaduto!</strong><br>Licenza scaduta il ${dataScadenzaCalcolata.toLocaleDateString('it-IT', opzioniFormatoData)}. Rinnovare al più presto.`;
                statusMessage.classList.add('warning'); // Usa classList per aggiungere
            } else {
                 console.log(`Widget ${index + 1}: Prodotto NON scaduto.`);
                 // statusMessage.textContent = 'Prodotto attivo.'; // Messaggio opzionale
                 // statusMessage.classList.add('info'); // Classe opzionale
            }

        } catch (error) {
            console.error(`ERRORE nell'aggiornamento widget ${index + 1}:`, error);
            statusMessage.textContent = 'Errore durante il caricamento dei dati.';
            statusMessage.className = 'status-message warning'; // Usa la classe per consistenza
            // Pulisci gli altri campi in caso di errore grave per questo widget
            activationDateDisplay.textContent = "Errore";
            daysPassedDisplay.textContent = "Errore";
            expiryDateDisplay.textContent = "Errore";
            currentDateDisplay.textContent = "Errore";
        }
    }); // Fine ciclo forEach sui widget

}); // Fine DOMContentLoaded
</script>/* End custom CSS */