{{template "base" .}}

{{define "naslov"}}Podešavanja — Opšte — NTech{{end}}

{{define "sadrzaj"}}
<div class="stranica-stack" style="width:100%;max-width:100%;">

    {{if .Sacuvano}}
    <div class="poruka-uspeh">Podešavanja su uspešno sačuvana.</div>
    {{end}}

    <!-- logo kartica: dve forme su sestre unutar div.kartica, nisu ugnježdene -->
    <div class="kartica animiraj" style="margin-bottom:16px;">
        <div style="display:flex;align-items:center;gap:10px;margin-bottom:16px;padding-bottom:12px;border-bottom:0.5px solid var(--ivica);">
            <svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="var(--sb-akcent)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="18" height="18" rx="2"/><circle cx="8.5" cy="8.5" r="1.5"/><polyline points="21 15 16 10 5 21"/></svg>
            <span style="font-size:15px;font-weight:500;color:var(--tekst-glavni);">Logo firme</span>
        </div>
        {{if .LogoPutanja}}
        <div style="display:flex;align-items:center;gap:12px;margin-bottom:12px;">
            <img src="{{.LogoPutanja}}" alt="Trenutni logo"
                style="max-height:60px;max-width:200px;object-fit:contain;border:0.5px solid var(--ivica);border-radius:8px;padding:6px;background:var(--kartica);flex-shrink:0;">
            <form method="POST" action="/podesavanja/logo/ukloni" style="margin:0;">
                <input type="hidden" name="_csrf" value="{{.CsrfToken}}">
                <button type="submit"
                    style="padding:6px 14px;background:none;border:0.5px solid #dc2626;color:#dc2626;border-radius:8px;font-size:13px;cursor:pointer;white-space:nowrap;">
                    Ukloni sliku
                </button>
            </form>
        </div>
        {{end}}
        <form method="POST" action="/podesavanja/logo" enctype="multipart/form-data">
            <input type="hidden" name="_csrf" value="{{.CsrfToken}}">
            <div style="display:flex;gap:10px;align-items:center;flex-wrap:wrap;">
                <input type="file" id="logo-file" name="logo" accept=".png,.jpg,.jpeg,.svg"
                    style="display:none;"
                    onchange="var s=document.getElementById('logo-ime');s.textContent=this.files[0]?this.files[0].name:'Nijedan fajl nije izabran'">
                <label for="logo-file"
                    style="padding:8px 16px;background:var(--sb-akcent);color:#fff;border:none;border-radius:8px;font-size:13px;cursor:pointer;white-space:nowrap;font-weight:500;">
                    Izaberi fajl
                </label>
                <span id="logo-ime" class="pomocni-tekst">Nijedan fajl nije izabran</span>
                <button type="submit"
                    style="padding:8px 16px;background:var(--sb-aktivan);color:var(--tekst-jak);border:0.5px solid var(--ivica);border-radius:8px;font-size:13px;cursor:pointer;white-space:nowrap;transition:opacity 0.2s;"
                    onmouseover="this.style.opacity='0.8'" onmouseout="this.style.opacity='1'">
                    Otpremi logo
                </button>
            </div>
            <div class="pomocni-tekst" style="font-size:12px;margin-top:6px;">PNG, JPG ili SVG — maksimum 2 MB</div>
        </form>
    </div>

    <!-- firma: naziv, podnazlov, adresa, telefon, PIB, logo zona -->
    <form method="POST" action="/podesavanja/sacuvaj" data-autosave>
        <input type="hidden" name="_csrf" value="{{.CsrfToken}}">
        <input type="hidden" name="_next" value="/admin/podesavanja/opste">
        <input type="hidden" name="_sekcija_firma" value="1">
        <div class="kartica animiraj" style="margin-bottom:16px;">
            <div style="display:flex;align-items:center;gap:10px;margin-bottom:16px;padding-bottom:12px;border-bottom:0.5px solid var(--ivica);">
                <svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="var(--sb-akcent)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><polyline points="9 22 9 12 15 12 15 22"/></svg>
                <span style="font-size:15px;font-weight:500;color:var(--tekst-glavni);">Firma</span>
            </div>

            <div class="kolona" style="gap:14px;">
                <div class="forma-grid-2">
                    <div>
                        <label class="polje-labela">Naziv firme</label>
                        <input type="text" name="naziv_firme" value="{{.NazivFirme}}"
                            style="width:100%;padding:8px 12px;border:0.5px solid var(--ivica);border-radius:8px;font-size:14px;background:var(--pozadina);color:var(--tekst-glavni);outline:none;"
                            placeholder="npr. NTech">
                    </div>
                    <div>
                        <label class="polje-labela">Podnazlov</label>
                        <input type="text" name="podnazlov" value="{{.Podnazlov}}"
                            style="width:100%;padding:8px 12px;border:0.5px solid var(--ivica);border-radius:8px;font-size:14px;background:var(--pozadina);color:var(--tekst-glavni);outline:none;"
                            placeholder="npr. Servis računara">
                    </div>
                </div>

                <div class="forma-grid-2">
                    <div>
                        <label class="polje-labela">Adresa</label>
                        <input type="text" name="adresa" value="{{.Adresa}}"
                            style="width:100%;padding:8px 12px;border:0.5px solid var(--ivica);border-radius:8px;font-size:14px;background:var(--pozadina);color:var(--tekst-glavni);outline:none;"
                            placeholder="npr. Ulica i broj, Grad">
                    </div>
                    <div>
                        <label class="polje-labela">Telefon</label>
                        <input type="text" name="telefon" value="{{.Telefon}}"
                            style="width:100%;padding:8px 12px;border:0.5px solid var(--ivica);border-radius:8px;font-size:14px;background:var(--pozadina);color:var(--tekst-glavni);outline:none;"
                            placeholder="npr. +381 11 123 4567">
                    </div>
                </div>

                <div class="forma-grid-2">
                    <div>
                        <label class="polje-labela">PIB</label>
                        <input type="text" name="pib" value="{{.PIB}}"
                            style="width:100%;padding:8px 12px;border:0.5px solid var(--ivica);border-radius:8px;font-size:14px;background:var(--pozadina);color:var(--tekst-glavni);outline:none;"
                            placeholder="npr. 123456789">
                    </div>
                    <div>
                        <label class="polje-labela">Matični broj</label>
                        <input type="text" name="maticni_broj" value="{{.MaticniBroj}}"
                            style="width:100%;padding:8px 12px;border:0.5px solid var(--ivica);border-radius:8px;font-size:14px;background:var(--pozadina);color:var(--tekst-glavni);outline:none;"
                            placeholder="npr. 12345678">
                    </div>
                </div>

                <div style="display:flex;align-items:center;justify-content:space-between;padding:10px 14px;border:0.5px solid var(--ivica);border-radius:8px;">
                    <div>
                        <div style="font-size:13px;font-weight:500;color:var(--tekst-glavni);">Prikaži logo u gornjoj traci</div>
                        <div style="font-size:12px;color:var(--tekst-sporedni);">Logo slika se prikazuje pored naslova stranice</div>
                    </div>
                    <label class="toggl">
                        <input type="checkbox" name="topbar_logo_slika" value="1" {{if .TopbarLogoSlika}}checked{{end}}>
                        <span class="toggl-klizac"></span>
                    </label>
                </div>

            </div>
        </div>
    </form>

    <!-- poslovna jedinica: podaci koje fiskalizacija (SUF) traži uz svaki račun -->
    <form method="POST" action="/podesavanja/sacuvaj" data-autosave>
        <input type="hidden" name="_csrf" value="{{.CsrfToken}}">
        <input type="hidden" name="_next" value="/admin/podesavanja/opste">
        <div class="kartica animiraj" style="margin-bottom:16px;">
            <div style="display:flex;align-items:center;gap:10px;margin-bottom:16px;padding-bottom:12px;border-bottom:0.5px solid var(--ivica);">
                <svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="var(--sb-akcent)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><path d="M9 22V12h6v10"/></svg>
                <span style="font-size:15px;font-weight:500;color:var(--tekst-glavni);">Poslovna jedinica</span>
            </div>

            <div class="kolona" style="gap:14px;">
                <div class="forma-grid-2">
                    <div>
                        <label class="polje-labela">Naziv poslovne jedinice</label>
                        <input type="text" name="poslovna_jedinica_naziv" value="{{.NazivPJ}}"
                            style="width:100%;padding:8px 12px;border:0.5px solid var(--ivica);border-radius:8px;font-size:14px;background:var(--pozadina);color:var(--tekst-glavni);outline:none;"
                            placeholder="npr. Prodavnica centar">
                    </div>
                    <div>
                        <label class="polje-labela">Oznaka poslovne jedinice</label>
                        <input type="text" name="poslovna_jedinica_oznaka" value="{{.OznakaPJ}}"
                            style="width:100%;padding:8px 12px;border:0.5px solid var(--ivica);border-radius:8px;font-size:14px;background:var(--pozadina);color:var(--tekst-glavni);outline:none;"
                            placeholder="npr. BU-001">
                    </div>
                </div>

                <div class="forma-grid-2">
                    <div>
                        <label class="polje-labela">Opština</label>
                        <input type="text" name="opstina" value="{{.Opstina}}"
                            style="width:100%;padding:8px 12px;border:0.5px solid var(--ivica);border-radius:8px;font-size:14px;background:var(--pozadina);color:var(--tekst-glavni);outline:none;"
                            placeholder="npr. Savski venac">
                    </div>
                    <div>
                        <label class="polje-labela">Grad</label>
                        <input type="text" name="grad" value="{{.Grad}}"
                            style="width:100%;padding:8px 12px;border:0.5px solid var(--ivica);border-radius:8px;font-size:14px;background:var(--pozadina);color:var(--tekst-glavni);outline:none;"
                            placeholder="npr. Beograd">
                    </div>
                </div>
            </div>
        </div>
    </form>

    <!-- profil firme: pravni/poreski status (Faza 0) — određuje koji se zakonski moduli pale -->
    <form method="POST" action="/podesavanja/sacuvaj" data-autosave>
        <input type="hidden" name="_csrf" value="{{.CsrfToken}}">
        <input type="hidden" name="_next" value="/admin/podesavanja/opste">
        <div class="kartica animiraj" style="margin-bottom:16px;">
            <div style="display:flex;align-items:center;gap:10px;margin-bottom:16px;padding-bottom:12px;border-bottom:0.5px solid var(--ivica);">
                <svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="var(--sb-akcent)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="2" y="7" width="20" height="14" rx="2"/><path d="M16 21V5a2 2 0 0 0-2-2h-4a2 2 0 0 0-2 2v16"/></svg>
                <span style="font-size:15px;font-weight:500;color:var(--tekst-glavni);">Pravni i poreski status</span>
            </div>

            <div class="kolona" style="gap:18px;">

                <!-- pravni oblik -->
                <div>
                    <label class="polje-labela">Pravni oblik</label>
                    <div style="display:flex;gap:10px;flex-wrap:wrap;">
                        <label style="display:flex;align-items:center;gap:8px;padding:10px 14px;border:0.5px solid var(--ivica);border-radius:8px;cursor:pointer;flex:1;{{if eq .FirmaPravniOblik "pausalac"}}border-color:var(--sb-akcent);background:var(--pozadina);{{end}}">
                            <input type="radio" name="firma_pravni_oblik" value="pausalac" {{if eq .FirmaPravniOblik "pausalac"}}checked{{end}} style="accent-color:var(--sb-akcent);">
                            <span style="font-size:13px;color:var(--tekst-glavni);">Paušalac</span>
                        </label>
                        <label style="display:flex;align-items:center;gap:8px;padding:10px 14px;border:0.5px solid var(--ivica);border-radius:8px;cursor:pointer;flex:1;{{if eq .FirmaPravniOblik "preduzetnik_knjige"}}border-color:var(--sb-akcent);background:var(--pozadina);{{end}}">
                            <input type="radio" name="firma_pravni_oblik" value="preduzetnik_knjige" {{if eq .FirmaPravniOblik "preduzetnik_knjige"}}checked{{end}} style="accent-color:var(--sb-akcent);">
                            <span style="font-size:13px;color:var(--tekst-glavni);">Preduzetnik (knjige)</span>
                        </label>
                        <label style="display:flex;align-items:center;gap:8px;padding:10px 14px;border:0.5px solid var(--ivica);border-radius:8px;cursor:pointer;flex:1;{{if eq .FirmaPravniOblik "doo"}}border-color:var(--sb-akcent);background:var(--pozadina);{{end}}">
                            <input type="radio" name="firma_pravni_oblik" value="doo" {{if eq .FirmaPravniOblik "doo"}}checked{{end}} style="accent-color:var(--sb-akcent);">
                            <span style="font-size:13px;color:var(--tekst-glavni);">DOO</span>
                        </label>
                    </div>
                </div>

                <!-- režim rada -->
                <div>
                    <label class="polje-labela">Režim rada</label>
                    <div style="display:flex;gap:10px;flex-wrap:wrap;">
                        <label style="display:flex;align-items:center;gap:8px;padding:10px 14px;border:0.5px solid var(--ivica);border-radius:8px;cursor:pointer;flex:1;{{if eq .FirmaRezim "pun"}}border-color:var(--sb-akcent);background:var(--pozadina);{{end}}">
                            <input type="radio" name="firma_rezim" value="pun" {{if eq .FirmaRezim "pun"}}checked{{end}} style="accent-color:var(--sb-akcent);">
                            <span style="font-size:13px;color:var(--tekst-glavni);">Pun (vodi poslovne knjige)</span>
                        </label>
                        <label style="display:flex;align-items:center;gap:8px;padding:10px 14px;border:0.5px solid var(--ivica);border-radius:8px;cursor:pointer;flex:1;{{if eq .FirmaRezim "samo_evidencija"}}border-color:var(--sb-akcent);background:var(--pozadina);{{end}}">
                            <input type="radio" name="firma_rezim" value="samo_evidencija" {{if eq .FirmaRezim "samo_evidencija"}}checked{{end}} style="accent-color:var(--sb-akcent);">
                            <span style="font-size:13px;color:var(--tekst-glavni);">Samo evidencija</span>
                        </label>
                    </div>
                    <div class="pomocni-tekst" style="font-size:12px;margin-top:6px;">„Samo evidencija" gasi ceo zakonski sloj — program vodi servis i zalihe, ali ne izdaje fiskalne ni poreske dokumente.</div>
                </div>

                <!-- PDV obveznik -->
                <div>
                    <label class="polje-labela">U sistemu PDV-a</label>
                    <div style="display:flex;gap:10px;flex-wrap:wrap;">
                        <label style="display:flex;align-items:center;gap:8px;padding:10px 14px;border:0.5px solid var(--ivica);border-radius:8px;cursor:pointer;flex:1;{{if eq .FirmaPdvObveznik "da"}}border-color:var(--sb-akcent);background:var(--pozadina);{{end}}">
                            <input type="radio" name="firma_pdv_obveznik" value="da" {{if eq .FirmaPdvObveznik "da"}}checked{{end}} style="accent-color:var(--sb-akcent);">
                            <span style="font-size:13px;color:var(--tekst-glavni);">Da</span>
                        </label>
                        <label style="display:flex;align-items:center;gap:8px;padding:10px 14px;border:0.5px solid var(--ivica);border-radius:8px;cursor:pointer;flex:1;{{if eq .FirmaPdvObveznik "ne"}}border-color:var(--sb-akcent);background:var(--pozadina);{{end}}">
                            <input type="radio" name="firma_pdv_obveznik" value="ne" {{if eq .FirmaPdvObveznik "ne"}}checked{{end}} style="accent-color:var(--sb-akcent);">
                            <span style="font-size:13px;color:var(--tekst-glavni);">Ne</span>
                        </label>
                    </div>
                </div>

                <!-- fiskalizacija — zasivljena i forsirana na „Ne" kad je režim „samo evidencija" (vidi skriptu na dnu) -->
                <div id="fiskalizacija-grupa">
                    <label class="polje-labela">Izdaje fiskalne račune (promet građanima)</label>
                    <div style="display:flex;gap:10px;flex-wrap:wrap;">
                        <label style="display:flex;align-items:center;gap:8px;padding:10px 14px;border:0.5px solid var(--ivica);border-radius:8px;cursor:pointer;flex:1;{{if eq .FirmaFiskalizacija "da"}}border-color:var(--sb-akcent);background:var(--pozadina);{{end}}">
                            <input type="radio" name="firma_fiskalizacija" value="da" {{if eq .FirmaFiskalizacija "da"}}checked{{end}} style="accent-color:var(--sb-akcent);">
                            <span style="font-size:13px;color:var(--tekst-glavni);">Da</span>
                        </label>
                        <label style="display:flex;align-items:center;gap:8px;padding:10px 14px;border:0.5px solid var(--ivica);border-radius:8px;cursor:pointer;flex:1;{{if eq .FirmaFiskalizacija "ne"}}border-color:var(--sb-akcent);background:var(--pozadina);{{end}}">
                            <input type="radio" name="firma_fiskalizacija" value="ne" {{if eq .FirmaFiskalizacija "ne"}}checked{{end}} style="accent-color:var(--sb-akcent);">
                            <span style="font-size:13px;color:var(--tekst-glavni);">Ne</span>
                        </label>
                    </div>
                </div>

            </div>
        </div>
    </form>

    <!-- informativna tabela: koji moduli se pale po profilu -->
    <div class="kartica animiraj" style="margin-bottom:16px;">
        <div style="display:flex;align-items:center;gap:10px;margin-bottom:16px;padding-bottom:12px;border-bottom:0.5px solid var(--ivica);">
            <svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="var(--sb-akcent)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><line x1="12" y1="16" x2="12" y2="12"/><line x1="12" y1="8" x2="12.01" y2="8"/></svg>
            <span style="font-size:15px;font-weight:500;color:var(--tekst-glavni);">Pregled — šta se pali po profilu</span>
        </div>
        <div style="overflow-x:auto;">
            <table style="width:100%;border-collapse:collapse;font-size:13px;">
                <thead>
                    <tr style="border-bottom:0.5px solid var(--ivica);">
                        <th style="text-align:left;padding:8px 12px;color:var(--tekst-sporedni);font-weight:500;">Pravni oblik</th>
                        <th style="text-align:center;padding:8px 12px;color:var(--tekst-sporedni);font-weight:500;">PDV evidencija</th>
                        <th style="text-align:center;padding:8px 12px;color:var(--tekst-sporedni);font-weight:500;">Fiskalizacija</th>
                        <th style="text-align:center;padding:8px 12px;color:var(--tekst-sporedni);font-weight:500;">KPO</th>
                        <th style="text-align:center;padding:8px 12px;color:var(--tekst-sporedni);font-weight:500;">Dvojno knjig.</th>
                        <th style="text-align:right;padding:8px 12px;color:var(--tekst-sporedni);font-weight:500;">Limit prihoda</th>
                    </tr>
                </thead>
                <tbody>
                    <tr style="border-bottom:0.5px solid var(--ivica);">
                        <td style="padding:10px 12px;font-weight:500;color:var(--tekst-glavni);">Paušalac</td>
                        <td style="text-align:center;padding:10px 12px;color:var(--tekst-sporedni);font-size:12px;">opciono *</td>
                        <td style="text-align:center;padding:10px 12px;color:var(--zelena);">✔ obavezno</td>
                        <td style="text-align:center;padding:10px 12px;color:var(--zelena);">✔</td>
                        <td style="text-align:center;padding:10px 12px;color:var(--crvena);">—</td>
                        <td style="text-align:right;padding:10px 12px;color:var(--tekst-sporedni);">6.000.000 RSD</td>
                    </tr>
                    <tr style="border-bottom:0.5px solid var(--ivica);">
                        <td style="padding:10px 12px;font-weight:500;color:var(--tekst-glavni);">Preduzetnik (knjige)</td>
                        <td style="text-align:center;padding:10px 12px;color:var(--tekst-sporedni);font-size:12px;">preko 8M</td>
                        <td style="text-align:center;padding:10px 12px;color:var(--zelena);">✔ obavezno</td>
                        <td style="text-align:center;padding:10px 12px;color:var(--zelena);">✔</td>
                        <td style="text-align:center;padding:10px 12px;color:var(--tekst-sporedni);font-size:12px;">opciono **</td>
                        <td style="text-align:right;padding:10px 12px;color:var(--tekst-sporedni);">bez limita</td>
                    </tr>
                    <tr>
                        <td style="padding:10px 12px;font-weight:500;color:var(--tekst-glavni);">DOO</td>
                        <td style="text-align:center;padding:10px 12px;color:var(--tekst-sporedni);font-size:12px;">preko 8M</td>
                        <td style="text-align:center;padding:10px 12px;color:var(--zelena);">✔ obavezno</td>
                        <td style="text-align:center;padding:10px 12px;color:var(--crvena);">—</td>
                        <td style="text-align:center;padding:10px 12px;color:var(--zelena);">✔ obavezno</td>
                        <td style="text-align:right;padding:10px 12px;color:var(--tekst-sporedni);">bez limita</td>
                    </tr>
                </tbody>
            </table>
        </div>
        <div style="margin-top:12px;padding-top:10px;border-top:0.5px solid var(--ivica);font-size:11px;color:var(--tekst-sporedni);line-height:1.6;">
            * Paušalac može dobrovoljno ući u PDV. Preko 8M — obavezno izlazi iz paušala i ulazi u PDV.<br>
            ** Preduzetnik koji vodi knjige može birati prosto ili dvojno knjigovodstvo.<br>
            Fiskalizacija je obavezna za sve koji izdaju račune građanima (maloprodaja) — bez obzira na pravni oblik.<br>
            PDV prag: 8.000.000 RSD u prethodnih 12 meseci (Zakon o PDV-u, čl. 33). Paušalni limit: 6.000.000 RSD (Zakon o porezu na dohodak građana, čl. 40).
        </div>
    </div>

</div>

{{if .LogoGreska}}
<div id="toast-logo" class="toast toast-greska">
    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" style="flex-shrink:0;"><circle cx="12" cy="12" r="10"/><line x1="12" y1="8" x2="12" y2="12"/><line x1="12" y1="16" x2="12.01" y2="16"/></svg>
    {{.LogoGreska}}
</div>
<script>
(function() {
    var t = document.getElementById('toast-logo');
    if (!t) return;
    setTimeout(function() {
        t.classList.add('nestaje');
        setTimeout(function() { t.remove(); }, 300);
    }, 4000);
})();
</script>
{{end}}

<script>
// Fiskalizacija ima smisla samo u punom režimu. Kad je „samo evidencija", grupa se
// zasivi i forsira na „Ne". Ne koristimo disabled (jer disabled polje se ne šalje u
// POST pa bi stara vrednost ostala u bazi) — umesto toga pointer-events:none, a radio
// „Ne" ostaje aktivan i čekiran, pa se uredno sačuva „ne".
(function() {
    var rezim = document.querySelectorAll('input[name="firma_rezim"]');
    var grupa = document.getElementById('fiskalizacija-grupa');
    var fisk = document.querySelectorAll('input[name="firma_fiskalizacija"]');
    if (!grupa || !rezim.length) return;

    function azuriraj() {
        var izabran = document.querySelector('input[name="firma_rezim"]:checked');
        var samoEvidencija = izabran && izabran.value === 'samo_evidencija';
        grupa.style.opacity = samoEvidencija ? '0.45' : '';
        grupa.style.pointerEvents = samoEvidencija ? 'none' : '';
        if (samoEvidencija) {
            fisk.forEach(function(r) {
                r.checked = (r.value === 'ne');
                var lab = r.closest('label');
                if (lab) {
                    lab.style.borderColor = r.checked ? 'var(--sb-akcent)' : 'var(--ivica)';
                    lab.style.background = r.checked ? 'var(--pozadina)' : 'transparent';
                }
            });
        }
    }

    rezim.forEach(function(r) { r.addEventListener('change', azuriraj); });
    azuriraj();
})();
</script>
{{end}}