Dodatkowy dymek

src/islands/Internet/InternetAddonsModal.jsx

@@ -349,6 +349,13 @@ export default function InternetAddonsModal({ isOpen, onClose, plan }) {
                   </div>
                 </div>
               </div>
+
+              <div class="f-floating-total" onClick={(e) => e.stopPropagation()}>
+                <div class="f-floating-total-inner">
+                  <span class="f-floating-total-label">Suma</span>
+                  <span class="f-floating-total-value">{totalMonthly.toFixed(2)} zł/mies.</span>
+                </div>
+              </div>
             </>
           )}
         </div>

src/islands/jambox/JamboxAddonsModal.jsx

@@ -379,6 +379,14 @@ export default function JamboxAddonsModal({ isOpen, onClose, pkg }) {
                   </div>
                 </div>
               </div>
+
+              {/* FLOATING TOTAL (dymek jak czat) */}
+              <div class="f-floating-total" onClick={(e) => e.stopPropagation()}>
+                <div class="f-floating-total-inner">
+                  <span class="f-floating-total-label">Suma</span>
+                  <span class="f-floating-total-value">{totalMonthly.toFixed(2)} zł/mies.</span>
+                </div>
+              </div>
             </>
           )}
         </div>

src/styles/modal.css

@@ -205,3 +205,44 @@
 .f-addon-checkbox {
   align-items: center;
 }
+
+
+/* ===========================
+   FLOATING TOTAL (dymek jak czat)
+   =========================== */
+
+.f-floating-total {
+  position: fixed;
+  right: 1rem;
+  bottom: 1rem;
+  z-index: 10000; /* wyżej niż overlay (9999) */
+  pointer-events: auto;
+}
+
+.f-floating-total-inner {
+  @apply flex items-center gap-3;
+  @apply px-4 py-3 rounded-2xl shadow-xl border;
+  border-color: rgba(148, 163, 184, 0.5);
+  background: color-mix(in srgb, var(--f-background) 92%, transparent);
+  backdrop-filter: blur(10px);
+}
+
+.f-floating-total-label {
+  @apply text-sm opacity-80;
+}
+
+.f-floating-total-value {
+  @apply font-bold whitespace-nowrap;
+  font-size: 1.1rem;
+  color: var(--fuz-accent, #2563eb);
+}
+
+/* na bardzo małych ekranach lekko mniejszy dymek */
+@media (max-width: 420px) {
+  .f-floating-total-inner {
+    @apply px-3 py-2;
+  }
+  .f-floating-total-value {
+    font-size: 1rem;
+  }
+}