Magacin: modal za premeštanje + ujednačen slajder na svim brauzerima

Premeštanje artikla:
- Padajući <details> meni zamenjen nativnim <dialog> modalom (showModal),
koji ide u „top layer" pa je uvek iznad svega bez obzira na z-index/overflow.
- Dodato zatamnjenje pozadine (::backdrop) i fade in/out animacije
(@starting-style + transition-behavior: allow-discrete).
- Klik van modala, × dugme i Escape zatvaraju; klik na kategoriju i dalje
odmah premešta artikal.
Tema i HTMX:
- CSS modala premešten iz magacin.html (dodatni-css u headeru) u main.css,
jer se header ne menja pri HTMX navigaciji (hx-select=#glavni-sadrzaj),
pa je stil sada uvek prisutan.
- Modal prati svetlu/tamnu temu preko CSS promenljivih; kad je aktivna
pozadinska slika, glass-override u base.html ga čini providnim i zamućenim
kao kartice.
- Modal centriran (margin:auto, jer reset gazi UA podrazumevano) i pojačana senka.
Slajder (input[type=range]):
- Dodata zajednička klasa .klizac sa ručnim stilom za oba motora
(::-webkit-slider-* i ::-moz-range-*), da svuda izgleda kao u Firefox-u.
- Plava popunjenost pre glave: Firefox preko ::-moz-range-progress, Chromium
preko gradijenta i CSS promenljive --popunjeno koju postavlja JS.
- Svih 12 slajdera (profil_tema, podesavanja_izgled, podesavanja) prešlo sa
inline accent-color stila na klasu .klizac.

web/static/js/ntech.js

@@ -257,3 +257,30 @@ document.addEventListener('alpine:init', () => {
 // za prvo učitavanje (defer script) — sprečava animaciju podmenia koji su inicijalno otvoreni
 ntechInicijalizujPodmeni()
 ntechDodajPodmeniListenere()
+
+// klizač (input[type=range].klizac): popunjava plavom deo pre glave u Chromium-u
+// preko CSS promenljive --popunjeno. Firefox to radi sam (::-moz-range-progress).
+function ntechAzurirajKlizac(el) {
+    var min = parseFloat(el.min) || 0
+    var max = parseFloat(el.max)
+    if (isNaN(max)) max = 100
+    var v = parseFloat(el.value) || 0
+    var procenat = max > min ? ((v - min) / (max - min)) * 100 : 0
+    el.style.setProperty('--popunjeno', procenat + '%')
+}
+function ntechInicijalizujKlizace() {
+    document.querySelectorAll('input[type="range"].klizac').forEach(ntechAzurirajKlizac)
+}
+(function() {
+    if (window._ntechKlizacDodato) return
+    window._ntechKlizacDodato = true
+    // delegirani listener — hvata i klizače ubačene kasnije (HTMX swap)
+    document.addEventListener('input', function(e) {
+        var t = e.target
+        if (t && t.classList && t.classList.contains('klizac')) ntechAzurirajKlizac(t)
+    })
+    // početno popunjavanje: posle učitavanja, posle HTMX swap-a i kad Alpine postavi vrednosti
+    document.addEventListener('DOMContentLoaded', ntechInicijalizujKlizace)
+    document.addEventListener('htmx:afterSettle', ntechInicijalizujKlizace)
+    document.addEventListener('alpine:initialized', ntechInicijalizujKlizace)
+})()