mantenimento-app 2.1.4 → 2.1.5

package/app.js

@@ -4371,8 +4371,10 @@ const defaultExpenseItems = [
             .join("");
           mainHtml = `
             <span class="result-main-line">${escapeHtml(tr("calcNoTransferSuggested"))}</span>
-            <span class="result-main-sub">${escapeHtml(tr("calcCompBenefitsLabel"))}</span>
-            <ul class="result-benefits-list">${benefitsHtml}</ul>
+            <div class="result-benefits-box">
+              <span class="result-main-sub">${escapeHtml(tr("calcCompBenefitsLabel"))}</span>
+              <ul class="result-benefits-list">${benefitsHtml}</ul>
+            </div>
           `;
         } else if (benefitsInline) {
           mainHtml = `<span class="result-main-line">${escapeHtml(msg("calcNoTransferWithBenefits", { benefits: benefitsInline }))}</span>`;

package/frontend/public/app.js

@@ -4371,8 +4371,10 @@ const defaultExpenseItems = [
             .join("");
           mainHtml = `
             <span class="result-main-line">${escapeHtml(tr("calcNoTransferSuggested"))}</span>
-            <span class="result-main-sub">${escapeHtml(tr("calcCompBenefitsLabel"))}</span>
-            <ul class="result-benefits-list">${benefitsHtml}</ul>
+            <div class="result-benefits-box">
+              <span class="result-main-sub">${escapeHtml(tr("calcCompBenefitsLabel"))}</span>
+              <ul class="result-benefits-list">${benefitsHtml}</ul>
+            </div>
           `;
         } else if (benefitsInline) {
           mainHtml = `<span class="result-main-line">${escapeHtml(msg("calcNoTransferWithBenefits", { benefits: benefitsInline }))}</span>`;

package/frontend/public/index.html

@@ -501,7 +501,17 @@
           <p class="note">
             Questo strumento e solo orientativo e non sostituisce una valutazione legale/professionale del caso concreto.
           </p>
-          <div id="spiegPanel" class="spieg-panel"></div>
+          <div id="spiegPanel" class="spieg-panel">
+            <details class="spieg-details" open>
+              <summary class="spieg-title">💡 Perche questo risultato?</summary>
+              <div class="spieg-grid">
+                <div class="spieg-item">
+                  <div class="spieg-item-label">Stato calcolo</div>
+                  <div class="spieg-item-body">Sezione in aggiornamento automatico: modifica i dati per vedere la spiegazione dettagliata del risultato.</div>
+                </div>
+              </div>
+            </details>
+          </div>
         </div>
       </section>
     </div>
@@ -576,6 +586,7 @@
   <script src="supabase.min.js"></script>
   <script src="fabric.min.js"></script>
   <script src="html2pdf.bundle.min.js"></script>
-    <script src="app.js?v=2.1.4"></script>
+    <script src="app.js?v=2.1.5"></script>
 </body>
 </html>
+

package/frontend/public/styles.css

@@ -2155,7 +2155,16 @@
       border: 1px solid #bfd6d0;
       border-radius: 999px;
       padding: 3px 9px;
-      margin-bottom: 8px;
+      margin-bottom: 0;
+    }
+
+    .result-benefits-box {
+      border: 1px solid #bdd6cf;
+      border-radius: 12px;
+      background: linear-gradient(180deg, rgba(249, 253, 252, 0.92), rgba(241, 249, 246, 0.92));
+      padding: 8px;
+      display: grid;
+      gap: 8px;
     }
 
     .result-benefits-list {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mantenimento-app",
-  "version": "2.1.4",
+  "version": "2.1.5",
   "description": "Frontend + backend architecture for the mantenimento calculator",
   "type": "commonjs",
   "main": "backend/calculate-model.js",