Zmiany w modalach

src/islands/jambox/JamboxCards.jsx

@@ -133,7 +133,7 @@ function JamboxPackageCard({ pkg, onShowChannels, onConfigureAddons }) {
   const hasPrice = basePrice != null;
 
   return (
-    <div class="f-card">
+     <div class="f-card" id={`pkg-${pkg.id}`} data-pkgid={pkg.id}>
       <div class="f-card-header">
         <div class="f-card-name">{pkg.name}</div>
 

src/islands/jambox/JamboxChannelsSearch.jsx

@@ -61,6 +61,17 @@ export default function JamboxChannelsSearch() {
     return `Znaleziono: ${items.length}`;
   }, [q, loading, err, items]);
 
+  function scrollToPackage(packageId) {
+    const el = document.getElementById(`pkg-${packageId}`);
+    if (!el) return;
+
+    el.scrollIntoView({ behavior: "smooth", block: "start" });
+
+    el.classList.add("is-target");
+    setTimeout(() => el.classList.remove("is-target"), 1200);
+  }
+
+
   return (
     <div class="fuz-chsearch">
       <h1 class="f-section-title">Wyszukiwanie kanałów w pakietach telewizji</h1>
@@ -114,11 +125,21 @@ export default function JamboxChannelsSearch() {
                 <div class="fuz-chsearch__packages">
                   Dostępny w:&nbsp;
                   {c.packages.map((p, i) => (
-                    <span class="fuz-chsearch__pkg" key={p.id}>
+                    // <span class="fuz-chsearch__pkg" key={p.id}>
+                    //   {p.name}{" "}
+                    //   <span class="fuz-chsearch__pkgnum">(kanał {p.number})</span>
+                    //   {i < c.packages.length - 1 ? ", " : ""}
+                    // </span>
+                    <button
+                      type="button"
+                      class="fuz-chsearch__pkg"
+                      key={p.id}
+                      onClick={() => scrollToPackage(p.id)}
+                    >
                       {p.name}{" "}
                       <span class="fuz-chsearch__pkgnum">(kanał {p.number})</span>
                       {i < c.packages.length - 1 ? ", " : ""}
-                    </span>
+                    </button>
                   ))}
                 </div>
               )}

src/styles/offers/offers-table.css

@@ -324,3 +324,23 @@ obszar ze scrollem wewnątrz modala
   opacity: 0.75;
   margin-bottom: 0.5rem;
 }
+
+.f-card.is-target {
+  outline: 2px solid rgba(59, 130, 246, 0.55);
+  /* var(--f-link); */
+  outline-offset: 4px;
+}
+
+.fuz-chsearch__pkg {
+  background: transparent;
+  border: 0;
+  padding: 0;
+  cursor: pointer;
+  font: inherit;
+  color: var(--f-link, var(--f-link));
+  text-decoration: underline;
+}
+
+.fuz-chsearch__pkg:hover {
+  text-decoration-thickness: 2px;
+}