{% extends "base.html" %}
{% block title %}Tồn kho — {{ brand.ten_app }}{% endblock %}
{% block page_subtitle %}Tồn kho{% endblock %}

{% block content %}

  <!-- ── Tóm tắt ─────────────────────────────────────── -->
  <div id="summary-bar" class="so-tong grid grid-cols-2 sm:grid-cols-3 gap-3"></div>

  {% if xem_tong %}
  <!-- ── Báo cáo tồn kho: khối to, nổi bật — CHỈ người có quyền "Xem báo cáo" (máy chủ chặn cả trang lẫn API) ── -->
  <a href="/inventory/report" class="inv-bao-cao" id="inv-bao-cao">
    <span class="ibc-ico">📊</span>
    <span class="ibc-chu">
      <span class="ibc-tieu-de">Báo cáo tồn kho</span>
      <span class="ibc-mo-ta">Giá trị tồn kho · giá vốn · lãi dự kiến · theo loại vàng, nhà sản xuất</span>
    </span>
    <span class="ibc-mui-ten">Mở báo cáo →</span>
  </a>
  {% endif %}

  <!-- ── Form nhập hàng mới ─────────────────────────── -->
  <div id="add-product-form" class="ios-card p-5 space-y-4" style="border:1.5px solid #fde68a">
    <!-- Băng báo đang nhân bản từ sản phẩm nào (ẩn khi nhập mới bình thường) -->
    <div id="nhan-ban-banner" class="hidden items-center gap-2 flex-wrap rounded-xl px-4 py-2.5 text-sm"
      style="background:linear-gradient(135deg,#ecfeff,#cffafe);border:1.5px solid #67e8f9;color:#0e7490">
      <span class="font-bold">📄 Đang nhân bản từ:</span>
      <span id="nhan-ban-nguon" class="font-semibold"></span>
      <span class="text-xs" style="color:#0891b2">— sửa lại thông tin bên dưới rồi bấm Lưu. Mã hàng đã cấp mã mới.</span>
      <button type="button" onclick="huyNhanBan()"
        class="ml-auto text-xs font-bold px-3 py-1 rounded-lg"
        style="background:#fff;border:1.5px solid #67e8f9;color:#0e7490">✕ Bỏ nhân bản</button>
    </div>

    <div class="flex flex-wrap justify-between items-center gap-2">
      <h2 class="font-bold text-gray-700">➕ Nhập hàng mới</h2>
      <div class="flex items-center gap-2">
        <span id="user-role-badge" class="hidden text-xs bg-amber-100 text-amber-800 font-semibold rounded-full px-3 py-1"></span>
        <input id="pin-input" type="password" inputmode="numeric" maxlength="10" placeholder="Mã PIN..."
          class="input-ios text-sm font-bold text-center tracking-widest w-28">
      </div>
    </div>

    <!-- Thông tin cơ bản -->
    <div class="grid grid-cols-2 sm:grid-cols-3 gap-3">
      <div>
        <div class="flex gap-1.5">
          <input id="f-ma" placeholder="Mã hàng"
            class="flex-1 min-w-0 input-ios" onblur="checkMaTrung()" oninput="_maWarnClear()">
          <button type="button" class="scan-btn !px-2.5" title="Quét camera QR"
            onclick="openScanner('product','f-ma')">📷</button>
          <button type="button" class="scan-btn !px-2.5" style="background:#eff6ff;color:#2563eb;border-color:#bfdbfe"
            title="Quét máy barcode — click rồi quét, nhấn Enter khi xong"
            onclick="activateBarcodeMode('f-ma')">⌨️</button>
        </div>
        <div id="f-ma-warn" class="hidden text-xs font-semibold text-red-600 mt-1"></div>
      </div>
      <input id="f-ten" placeholder="Tên sản phẩm *"
        class="input-ios" list="ten-options" autocomplete="off">
      <datalist id="ten-options"></datalist>
      <input id="f-loai" placeholder="Loại vàng"
        class="input-ios"
        list="loai-options" oninput="schedCalc()">
      <datalist id="loai-options"></datalist>
      <div class="flex gap-2">
        <select id="f-don-vi" class="input-ios text-sm flex-1 min-w-0">
          <option value="Chỉ">Chỉ vàng (Chỉ)</option>
          <option value="gram">Gram</option>
          <option value="cái">Cái</option>
          <option value="đôi">Đôi</option>
          <option value="bộ">Bộ</option>
          <option value="sợi">Sợi</option>
          <option value="chiếc">Chiếc</option>
          <option value="món">Món</option>
        </select>
        <div class="flex gap-1 flex-1 min-w-0">
          <select id="f-loai-sp" class="input-ios text-sm flex-1 min-w-0">
            <option value="">-- Loại sản phẩm --</option>
          </select>
          <button type="button" title="Thêm loại sản phẩm mới"
            onclick="addLoaiSP('f-loai-sp')"
            class="scan-btn !px-2.5 shrink-0">+</button>
        </div>
      </div>
    </div>

    <!-- KLT · KL Đá → KL Vàng tự tính + Tiền công + Tiền đá -->
    <div>
      <div class="text-xs font-bold text-gray-400 uppercase mb-2">Trọng lượng &amp; thông số</div>
      <div class="grid grid-cols-2 sm:grid-cols-5 gap-3">
        <input id="f-tl" type="number" step="0.0001" placeholder="KL Tổng (chỉ)"
          class="input-ios"
          oninput="calcKLVang()">
        <input id="f-kl-da" type="number" step="0.0001" placeholder="KL Đá (chỉ)"
          class="input-ios"
          oninput="calcKLVang()">
        <div class="relative">
          <input id="f-kl-vang" type="number" step="0.0001" placeholder="KLV tự tính"
            class="w-full input-ios font-semibold text-amber-800" style="background:#fffbeb;border:1.5px solid #fde68a"
            readonly title="Tự động: KL Vàng = KL Tổng − KL Đá">
          <span class="absolute right-2 top-2.5 text-amber-400 text-xs select-none">⚡</span>
        </div>
        <input id="f-tien-cong" type="number" step="1000" placeholder="Tiền công (đồng)"
          class="input-ios"
          oninput="schedCalc()">
        <input id="f-tien-da" type="number" step="1000" placeholder="Tiền đá (đồng)"
          class="input-ios"
          oninput="schedCalc()">
      </div>
    </div>

    <!-- Giá + kí hiệu + TCCS -->
    <div class="grid grid-cols-2 sm:grid-cols-4 gap-3">
      <input id="f-von" type="text" inputmode="numeric" placeholder="Giá vốn (đồng) — BẮT BUỘC *"
        class="input-ios" oninput="onSplitAmtInput(this)">
      <!-- Giá bán: 2 chế độ -->
      <div>
        <div class="flex rounded-xl overflow-hidden border-2 border-gray-200 mb-1.5 text-xs font-bold">
          <button type="button" id="price-tab-manual"
            onclick="setPriceMode('manual')"
            class="flex-1 py-1.5 bg-white text-gray-400 hover:bg-gray-50 transition-all">✏️ Thủ công</button>
          <button type="button" id="price-tab-formula"
            onclick="setPriceMode('formula')"
            class="flex-1 py-1.5 bg-amber-500 text-white transition-all">📐 CT tự động</button>
        </div>
        <input id="f-ban" type="text" inputmode="numeric" placeholder="Giá bán (đồng)"
          class="w-full input-ios" oninput="onSplitAmtInput(this)">
      </div>
      <input id="f-ki-hieu" placeholder="Kí hiệu (mã nội bộ)"
        class="input-ios">
      <input id="f-tccs" placeholder="TCCS (tự điền khi chọn NSX)"
        class="input-ios" style="background:#eff6ff"
        title="Tiêu chuẩn cơ sở — tự điền khi chọn nhà sản xuất">
    </div>

    <!-- Công thức tính giá bán — chỉ hiện khi ở chế độ thủ công -->
    <div id="price-calc-hint" class="hidden bg-amber-50 border border-amber-200 rounded-xl px-4 py-2 text-sm text-amber-800 flex items-center gap-2 flex-wrap">
      <span class="font-semibold">💡 Giá công thức:</span>
      <span id="price-calc-detail"></span>
      <button onclick="applyCalcPrice()" id="btn-apply-price"
        class="ml-auto bg-amber-600 text-white text-xs font-bold px-3 py-1 rounded-lg hover:bg-amber-700 hidden">
        ✓ Áp dụng
      </button>
    </div>

    <!-- Nguồn gốc -->
    <div class="border-t pt-3">
      <div class="text-xs font-bold text-gray-400 uppercase mb-2">Nguồn gốc</div>
      <div class="grid grid-cols-2 sm:grid-cols-3 gap-3">
        <!-- NSX -->
        <div class="flex gap-1.5">
          <select id="f-nha-sx" onchange="onNSXChange('add')"
            class="flex-1 min-w-0 input-ios cursor-pointer text-sm">
            <option value="">— Chọn NSX —</option>
          </select>
          <button type="button" id="btn-edit-nsx-add" title="Sửa NSX đang chọn"
            onclick="openMfEdit('f-nha-sx','add')"
            class="scan-btn !px-2.5 !text-base hidden" style="background:#eff6ff;color:#2563eb;border-color:#bfdbfe">✏️</button>
          <button type="button" title="Thêm NSX mới" onclick="openMfModal('nsx','add')"
            class="scan-btn !px-2.5 !text-base">➕</button>
        </div>
        <input id="f-dc-nsx" placeholder="Địa chỉ NSX (tự điền)"
          class="input-ios text-sm" style="background:#ececf0;color:#8a8a8e">
        <!-- NPP -->
        <div class="flex gap-1.5">
          <select id="f-nha-pp" onchange="onNPPChange('add')"
            class="flex-1 min-w-0 input-ios cursor-pointer text-sm">
            <option value="">— Chọn NPP —</option>
          </select>
          <button type="button" id="btn-edit-npp-add" title="Sửa NPP đang chọn"
            onclick="openMfEdit('f-nha-pp','add')"
            class="scan-btn !px-2.5 !text-base hidden" style="background:#eff6ff;color:#2563eb;border-color:#bfdbfe">✏️</button>
          <button type="button" title="Thêm NPP mới" onclick="openMfModal('npp','add')"
            class="scan-btn !px-2.5 !text-base">➕</button>
        </div>
        <input id="f-dc-npp" placeholder="Địa chỉ NPP (tự điền)"
          class="input-ios text-sm" style="background:#ececf0;color:#8a8a8e">
        <input id="f-xuat-xu" placeholder="Xuất xứ" value="Việt Nam"
          class="input-ios text-sm">
      </div>
    </div>

    <!-- Quản lý nhập kho -->
    <div class="border-t pt-3">
      <div class="text-xs font-bold text-gray-400 uppercase mb-2">Quản lý nhập kho</div>
      <div class="grid grid-cols-2 sm:grid-cols-3 gap-3">
        <input id="f-ma-hd"      placeholder="Mã HĐ đầu vào"
          class="input-ios">
        <input id="f-ly-do-nhap" placeholder="Lý do nhập"
          class="input-ios">
        <div class="relative">
          <label class="absolute -top-2 left-3 text-[10px] font-bold text-amber-600 bg-white px-1 z-10 tracking-wide uppercase">Thời gian nhập</label>
          <input id="f-ngay-nhap" type="date" lang="vi"
            class="input-ios w-full font-medium"
            style="background:linear-gradient(135deg,#fffbeb,#fef3c7);border:1.5px solid #f59e0b;color:#92400e;padding-top:10px">
        </div>
        <div class="flex gap-1.5">
          <input id="f-rfid" placeholder="RFID UID"
            autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false"
            data-lpignore="true" data-form-type="other"
            class="flex-1 min-w-0 input-ios">
          <button type="button" title="Quét RFID camera" onclick="openScanner('product','f-rfid')"
            class="scan-btn !px-2.5">📡</button>
          <button type="button" class="scan-btn !px-2.5" style="background:#eff6ff;color:#2563eb;border-color:#bfdbfe"
            title="Quét máy barcode" onclick="activateBarcodeMode('f-rfid')">⌨️</button>
        </div>
      </div>
      <!-- Ảnh sản phẩm: chụp trực tiếp (điện thoại mở camera) hoặc chọn file -->
      <div class="mt-3 flex items-center gap-3 flex-wrap">
        <input type="file" id="f-anh" accept="image/*" capture="environment" class="hidden"
          onchange="onPhotoPicked(this, 'add')">
        <button type="button" onclick="document.getElementById('f-anh').click()"
          class="scan-btn !px-3">📷 Chụp / chọn ảnh sản phẩm</button>
        <div id="f-anh-preview-wrap" class="hidden items-center gap-2" style="display:none">
          <img id="f-anh-preview" class="w-14 h-14 object-cover rounded-xl border-2 border-amber-300 shadow-sm">
          <button type="button" onclick="clearPhoto('add')"
            class="text-red-500 hover:text-red-700 text-xs font-semibold">✕ Bỏ ảnh</button>
        </div>
        <span class="text-[11px] text-gray-400">Ảnh sẽ in kèm trên giấy đảm bảo khi bán sản phẩm này.</span>
      </div>
    </div>

    <div class="flex items-center gap-3 flex-wrap">
      <button onclick="addProduct()"
        class="btn-ios btn-ios-gold px-6 py-2.5">
        Lưu sản phẩm
      </button>
      <!-- Số bản sao: tạo nhiều món GIỐNG NHAU trong 1 lần bấm (mỗi món 1 mã riêng) -->
      <div class="flex items-center gap-1.5 rounded-xl px-3 py-1.5"
        style="background:#f0fdfa;border:1.5px solid #99f6e4">
        <label for="f-so-ban-sao" class="text-xs font-bold" style="color:#0f766e">Số bản</label>
        <input id="f-so-ban-sao" type="number" min="1" max="50" step="1" value="1"
          class="input-ios w-16 text-center font-bold" style="padding:6px 4px"
          title="Tạo nhiều món giống nhau cùng lúc — mỗi món được cấp một mã riêng (tối đa 50)">
      </div>
      <span id="add-msg" class="text-sm flex-1"></span>
      {% if quyen_in_tem == 'in' %}
      <a id="btn-print-new" href="#" target="_blank"
        class="hidden btn-ios btn-ios-secondary text-amber-700 font-semibold text-sm px-4 py-2 whitespace-nowrap">
        🏷️ In tem ngay
      </a>
      {% endif %}
    </div>
  </div>

  <!-- ── Import từ Excel ────────────────────────────── -->
  <div id="import-excel-section" class="ios-card p-5">
    <div class="flex flex-wrap justify-between items-center gap-3 mb-3">
      <h2 class="font-bold text-gray-700">📥 Import hàng loạt từ Excel</h2>
      <a href="/api/pos/products/import-template" download
        class="text-xs font-bold text-green-700 border border-green-300 hover:bg-green-50 rounded-lg px-3 py-1.5 transition">
        ⬇️ Tải file mẫu (.xlsx)
      </a>
    </div>
    <div class="flex flex-wrap items-center gap-3">
      <input type="file" id="import-file" accept=".xlsx"
        class="flex-1 min-w-0 border-2 border-dashed border-gray-300 rounded-xl px-3 py-2 text-sm outline-none cursor-pointer file:mr-2 file:font-semibold file:rounded-lg file:border-0 file:bg-amber-50 file:text-amber-700 file:px-3 file:py-1">
      <button onclick="importExcel()"
        class="btn-ios bg-green-600 hover:bg-green-700 text-white font-bold px-5 py-2.5 shadow-sm whitespace-nowrap">
        ⬆️ Upload & Import
      </button>
      <span id="import-msg" class="text-sm w-full sm:w-auto"></span>
    </div>
  </div>


  <!-- ── Danh sách tồn kho ──────────────────────────── -->
  <div class="ios-card overflow-hidden">
    <div class="px-5 py-3.5 flex flex-wrap justify-between items-center gap-2" style="background:linear-gradient(135deg,#fff7ed,#fffbeb)">
      <span class="font-extrabold text-gray-800">📦 Danh sách hàng tồn kho</span>
      <div class="flex items-center gap-2 flex-wrap">
        <input id="search-input" type="text" placeholder="🔍 Tìm theo tên, mã SP..."
          oninput="filterTable()"
          class="input-ios text-sm flex-1 min-w-[140px] !py-1.5">
        <button type="button" class="scan-btn flex-shrink-0" onclick="openScanner('product', 'search-input')">📷 Camera</button>
        <a id="btn-export-inv" href="/api/pos/products/export?status=con_hang"
          class="btn-ios btn-ios-secondary text-xs font-bold text-amber-700 px-3 py-1.5 whitespace-nowrap">
          ⬇️ Xuất Excel
        </a>
        {# In tem theo quyền "In tem" (Phân quyền vai trò, 15/10/2026): Sửa / In tem → in thẳng; Xem → xin duyệt
           rồi in đúng lô đã duyệt; không có quyền → không có nút in. Gán tem RFID · báo cáo giữ theo quyền Báo cáo. #}
        <span id="so-da-chon" class="text-xs font-bold text-gray-600 px-2 py-1.5 whitespace-nowrap hidden"
          title="Số sản phẩm đang tick chọn trong danh sách đang hiển thị">☑️ Đã chọn: <b id="so-da-chon-n">0</b></span>
        {% if quyen_xoa %}
        {# Xóa NHIỀU sản phẩm (15/10/2026): quyền "Xóa sản phẩm tồn kho" RIÊNG — Sửa / In tem không kèm quyền này.
           Máy chủ kiểm lại quyền + điều kiện từng món; xóa có ảnh chụp, khôi phục ở trang Khôi phục xóa. #}
        <button onclick="xoaSanPhamDaChon()" id="btn-xoa-da-chon"
          class="btn-ios text-xs font-bold text-white px-3 py-1.5 whitespace-nowrap"
          style="background:linear-gradient(135deg,#b91c1c,#dc2626)"
          title="Tick chọn sản phẩm rồi bấm — xem trước điều kiện, xác nhận rồi mới xóa">
          🗑️ Xóa sản phẩm đã chọn
        </button>
        {% endif %}
        {% if quyen_in_tem == 'in' %}
        <button onclick="printSelectedLabels()"
          class="btn-ios text-xs font-bold text-white px-3 py-1.5 whitespace-nowrap"
          style="background:linear-gradient(135deg,#c2410c,#ea580c)"
          title="Tick chọn sản phẩm trong danh sách rồi bấm để in tem các món đã chọn">
          🏷️ In tem đã chọn
        </button>
        <button onclick="printNewLabels()" id="btn-print-moi"
          class="btn-ios text-xs font-bold text-white px-3 py-1.5 whitespace-nowrap"
          style="background:linear-gradient(135deg,#0369a1,#0284c7)"
          title="In tem hàng mới chưa in lần nào, theo thứ tự nhập — BẮT BUỘC chọn 'Đợt nhập' trước">
          🆕 In tem hàng mới
        </button>
        {% elif quyen_in_tem == 'xem' %}
        <button onclick="xinDuyetInTem()"
          class="btn-ios text-xs font-bold text-white px-3 py-1.5 whitespace-nowrap"
          style="background:linear-gradient(135deg,#1d4ed8,#2563eb)"
          title="Tick chọn sản phẩm rồi bấm — Giám đốc duyệt xong bạn in được đúng lô đó">
          📤 Xin duyệt in tem
        </button>
        {# Nút in CHỈ hiện khi Giám đốc ĐÃ DUYỆT lô của người này (dùng 1 lần) #}
        {% if duyet_in_tem %}
        <button onclick="inLoDaDuyet()"
          class="btn-ios text-xs font-bold text-white px-3 py-1.5 whitespace-nowrap"
          style="background:linear-gradient(135deg,#047857,#059669)"
          title="Giám đốc đã duyệt lô này — in được 1 lần">
          ✅ In tem đã duyệt ({{ duyet_in_tem|length }})
        </button>
        {% endif %}
        {% endif %}
        {% if xem_tong %}
        <!-- RFID:GAN-TEM — nút mở modal gán tem (spec 2026-07-28-rfid-design.md) -->
        <button onclick="rfOpenGan()"
          class="btn-ios text-xs font-bold text-white px-3 py-1.5 whitespace-nowrap"
          style="background:linear-gradient(135deg,#7c3aed,#8b5cf6)"
          title="Đặt tem (+món) lên khay RFID rồi quét mã hàng để gán — gắn liên tiếp được">
          📡 Gán tem RFID
        </button>
        {% endif %}
      </div>
    </div>

    <!-- ── Bộ lọc: mỗi ô 1 nhãn riêng · ô đang chọn tô vàng · hàng chip hiện đang lọc gì ── -->
    <div class="inv-filter">
      <div class="inv-filter-grid">
        <div class="ff">
          <label class="ff-lbl">💎 Loại vàng</label>
          <select id="f-loai-vang" onchange="filterTable()" class="ff-sel"><option value="">Tất cả</option></select>
        </div>
        <div class="ff">
          <label class="ff-lbl" for="f-loc-loai-sp">📦 Loại sản phẩm</label>
          <select id="f-loc-loai-sp" onchange="filterTable()" class="ff-sel"><option value="">Tất cả</option></select>
        </div>
        <div class="ff">
          <label class="ff-lbl">🏭 Nhà sản xuất</label>
          <select id="f-nsx" onchange="filterTable()" class="ff-sel"><option value="">Tất cả</option></select>
        </div>
        <div class="ff">
          <label class="ff-lbl">📅 Đợt nhập</label>
          <select id="f-ngay" onchange="filterTable()" class="ff-sel"><option value="">Tất cả ngày</option></select>
        </div>
        <div class="ff">
          <label class="ff-lbl">🏷️ Trạng thái tem</label>
          <select id="f-tem" onchange="filterTable()" class="ff-sel">
            <option value="">Tất cả</option>
            <option value="chua">🆕 Chưa in tem lần nào</option>
            <option value="roi">✔️ Đã in tem</option>
            <option value="cu">⏰ Tem cũ — dữ liệu đã đổi</option>
          </select>
        </div>
        <div class="ff">
          <label class="ff-lbl" for="f-thieu">⚠️ Thiếu thông tin</label>
          <select id="f-thieu" onchange="filterTable()" class="ff-sel"><option value="">Tất cả</option></select>
        </div>
        <div class="ff ff-tt-o">
          <label class="ff-lbl ff-lbl-tt" for="filter-status">📌 Trạng thái</label>
          <select id="filter-status" onchange="loadProducts()" class="ff-sel ff-tt">
            <option value="con_hang">✅ Còn hàng</option>
            <option value="da_ban">🧾 Đã bán</option>
            <option value="that_lac">❓ Thất lạc</option>
            <option value="">📋 Tất cả</option>
          </select>
        </div>
      </div>
      <div class="inv-filter-active" id="filter-active">
        <span class="fa-lead">🔎 Đang lọc:</span>
        <span id="filter-chips"></span>
        <span class="fa-hint">Chưa áp bộ lọc — chọn tiêu chí phía trên để lọc nhanh</span>
        <button onclick="resetFilters()" class="fa-clear">↺ Bỏ tất cả lọc</button>
        <span id="filter-count" class="fa-count"></span>
      </div>
    </div>
    <div id="inv-list">
      <!-- Header (chỉ hiện trên máy tính) -->
      <div class="inv-head">
        <label class="inv-c-chk"><input type="checkbox" id="chk-all" onchange="toggleCheckAll(this.checked)"
            class="rounded cursor-pointer accent-amber-500"></label>
        <span class="inv-c-photo"></span>
        <span class="inv-c-ma">Mã hàng</span>
        <span class="inv-c-ten">Tên sản phẩm</span>
        <span class="inv-c-loai">Loại vàng</span>
        <span class="inv-c-klt">KLT</span>
        <span class="inv-c-klv">KLV</span>
        <span class="inv-c-von">Giá vốn</span>
        <span class="inv-c-gia">Giá bán</span>
        <span class="inv-c-tt">Trạng thái</span>
        <span class="inv-c-act">Thao tác</span>
      </div>
      <div id="prod-tbody"></div>
      <div id="table-empty" class="hidden text-center text-gray-300 py-10 text-sm">Không tìm thấy sản phẩm</div>
    </div>
    <div id="table-count" class="px-5 py-2 text-xs text-gray-400 border-t"></div>
  </div>

  <!-- ── Modal thêm / sửa NSX / NPP ───────────────── -->
  <div id="mf-modal" class="fixed inset-0 z-[60] hidden ios-backdrop bg-black/40 flex items-center justify-center p-4">
    <div class="bg-white rounded-[24px] shadow-xl w-full max-w-sm overflow-hidden">
      <div class="flex justify-between items-center px-5 py-3.5" style="background:linear-gradient(135deg,#fff7ed,#fffbeb)">
        <h3 id="mf-modal-title" class="font-extrabold text-gray-800">➕ Thêm Nhà sản xuất</h3>
        <button onclick="closeMfModal()" class="text-gray-400 hover:text-gray-700 text-2xl leading-none">&times;</button>
      </div>
      <div class="p-5 space-y-3">
        <input type="hidden" id="mf-id"     value="">
        <input type="hidden" id="mf-loai"   value="nsx">
        <input type="hidden" id="mf-target" value="add">
        <div>
          <label class="lbl">Tên NSX / NPP *</label>
          <input id="mf-ten" class="inp" placeholder="{{ brand.ten_hien_thi }}">
        </div>
        <div>
          <label class="lbl">Địa chỉ</label>
          <input id="mf-dia-chi" class="inp" placeholder="123 Đường A, TP.HCM">
        </div>
        <div>
          <label class="lbl">TCCS (Tiêu chuẩn cơ sở)</label>
          <input id="mf-tccs" class="inp" placeholder="TCCS 01:2024/VBTHI">
        </div>
        <div>
          <label class="lbl">Ghi chú</label>
          <input id="mf-ghi-chu" class="inp" placeholder="">
        </div>
      </div>
      <div class="px-5 pb-5 flex items-center gap-2 flex-wrap">
        <button onclick="saveMfModal()"
          class="btn-ios btn-ios-gold px-5 py-2 flex-1 min-w-0">
          💾 Lưu
        </button>
        <button id="mf-btn-delete" onclick="deleteMfModal()"
          class="hidden btn-ios bg-red-50 hover:bg-red-100 text-red-600 border border-red-200 font-semibold px-3 py-2 text-sm whitespace-nowrap">
          🗑️ Xóa
        </button>
        <span id="mf-msg" class="text-xs text-red-500 w-full"></span>
        <button onclick="closeMfModal()" class="text-gray-400 text-sm hover:text-gray-600">Hủy</button>
      </div>
    </div>
  </div>

  <!-- ── Modal chỉnh sửa ────────────────────────────── -->
  <div id="xoa-modal" class="fixed inset-0 z-[70] hidden ios-backdrop bg-black/40 flex items-center justify-center p-4">
    <div class="ios-card w-full max-w-lg max-h-[90vh] overflow-y-auto p-5 space-y-3">
      <div class="font-extrabold text-red-700 text-lg">🗑️ Xóa sản phẩm đã chọn</div>
      <div id="xoa-noi-dung" class="text-sm text-gray-700 space-y-2"></div>
      <label id="xoa-tem-wrap" class="hidden flex items-start gap-2 text-sm font-semibold text-red-700">
        <input type="checkbox" id="xoa-tem-ok" class="mt-1 w-4 h-4">
        <span id="xoa-tem-txt"></span>
      </label>
      <div class="flex gap-2 justify-end pt-1">
        <button onclick="dongXoaModal()" class="btn-ios btn-ios-secondary px-4 py-2 text-sm font-bold">Hủy</button>
        <button id="xoa-xac-nhan" onclick="xacNhanXoa()" class="btn-ios text-white px-4 py-2 text-sm font-bold"
          style="background:linear-gradient(135deg,#b91c1c,#dc2626)">Xóa</button>
      </div>
      <div id="xoa-msg" class="text-sm"></div>
    </div>
  </div>

  <div id="edit-modal" class="fixed inset-0 z-50 hidden ios-backdrop bg-black/40 flex items-center justify-center p-4">
    <div class="bg-white rounded-[24px] shadow-xl w-full max-w-2xl max-h-[90vh] overflow-y-auto overflow-x-hidden">
      <div class="flex justify-between items-center px-6 py-3.5 sticky top-0 z-10" style="background:linear-gradient(135deg,#fff7ed,#fffbeb)">
        <h3 class="font-extrabold text-gray-800 text-lg">✏️ Chỉnh sửa sản phẩm</h3>
        <button onclick="closeEdit()" class="text-gray-400 hover:text-gray-700 text-2xl leading-none">&times;</button>
      </div>
      <div class="p-6 space-y-4">
        <input type="hidden" id="edit-id">
        <div class="grid grid-cols-1 sm:grid-cols-2 gap-3">
          <div><label class="lbl">Mã hàng</label><input id="edit-ma"          class="inp"></div>
          <div><label class="lbl">Tên sản phẩm *</label><input id="edit-ten"  class="inp" list="ten-options" autocomplete="off"></div>
          <div><label class="lbl">Loại vàng</label><input id="edit-loai"      class="inp" list="loai-options" oninput="schedCalcEdit()"></div>
          <div><label class="lbl">Đơn vị tính</label>
            <select id="edit-don-vi" class="inp">
              <option value="Chỉ">Chỉ vàng (Chỉ)</option>
              <option value="gram">Gram</option>
              <option value="cái">Cái</option>
              <option value="đôi">Đôi</option>
              <option value="bộ">Bộ</option>
              <option value="sợi">Sợi</option>
              <option value="chiếc">Chiếc</option>
              <option value="món">Món</option>
            </select>
          </div>
          <div><label class="lbl">Loại sản phẩm</label>
            <div class="flex gap-1">
              <select id="edit-loai-sp" class="inp flex-1">
                <option value="">-- Loại sản phẩm --</option>
              </select>
              <button type="button" title="Thêm loại sản phẩm mới"
                onclick="addLoaiSP('edit-loai-sp')"
                class="px-2 rounded-lg border border-gray-200 text-gray-500 hover:bg-gray-50 shrink-0 text-lg font-bold">+</button>
            </div>
          </div>
          <div><label class="lbl">Số lượng</label><input id="edit-so-luong" class="inp" type="number" step="1" min="1" placeholder="1"></div>
          <div><label class="lbl">KL Tổng (chỉ)</label><input id="edit-tl"    class="inp" type="number" step="0.0001" oninput="calcKLVangEdit()"></div>
          <div><label class="lbl">KL Đá (chỉ)</label><input id="edit-kl-da"   class="inp" type="number" step="0.0001" oninput="calcKLVangEdit()"></div>
          <div>
            <label class="lbl">KL Vàng (chỉ) <span style="color:#f59e0b">⚡ tự tính</span></label>
            <input id="edit-kl-vang" class="inp" type="number" step="0.0001" readonly
              style="background:#fffbeb;color:#92400e;font-weight:600"
              title="Tự động: KL Vàng = KL Tổng − KL Đá">
          </div>
          <div><label class="lbl">Kí hiệu</label><input id="edit-ki-hieu" class="inp" placeholder="Mã nội bộ"></div>
          <div><label class="lbl">TCCS</label><input id="edit-tccs" class="inp" placeholder="Tiêu chuẩn cơ sở"></div>
          <div><label class="lbl">Tiền công (đồng)</label><input id="edit-tien-cong" class="inp" type="number" step="1000" oninput="schedCalcEdit()"></div>
          <div><label class="lbl">Tiền đá (đồng)</label><input id="edit-tien-da"    class="inp" type="number" step="1000" oninput="schedCalcEdit()"></div>
          <div><label class="lbl">Giá vốn (đồng)</label><input id="edit-von"  class="inp" type="text" inputmode="numeric" oninput="onSplitAmtInput(this)"></div>
          <div>
            <label class="lbl">Giá bán (đồng)</label>
            <div class="flex rounded-lg overflow-hidden border border-gray-200 mb-1.5 text-xs font-bold">
              <button type="button" id="price-tab-manual-edit" onclick="setPriceModeEdit('manual')"
                class="flex-1 py-1 bg-amber-500 text-white transition-all">✏️ Thủ công</button>
              <button type="button" id="price-tab-formula-edit" onclick="setPriceModeEdit('formula')"
                class="flex-1 py-1 bg-white text-gray-400 hover:bg-gray-50 transition-all">📐 CT tự động</button>
            </div>
            <input id="edit-ban" class="inp" type="text" inputmode="numeric" oninput="onSplitAmtInput(this)">
            <label class="flex items-center gap-2 mt-1 text-xs cursor-pointer select-none">
              <input type="checkbox" id="edit-gia-co-dinh" class="w-4 h-4">
              <span>🔒 <strong>Giá cố định</strong> — bán đúng giá trên, KHÔNG chạy theo giá vàng
                <span class="text-gray-400">(bỏ tick = tự tính realtime)</span></span>
            </label>
            <div id="edit-calc-hint" class="hidden text-xs text-amber-700 mt-1 flex items-center gap-2">
              <span id="edit-calc-detail"></span>
              <button onclick="applyCalcPriceEdit()" class="underline font-semibold">Áp dụng</button>
            </div>
          </div>
        </div>
        <div class="border-t pt-3">
          <div class="text-xs font-bold text-gray-400 uppercase mb-2">Nguồn gốc</div>
          <div class="grid grid-cols-1 sm:grid-cols-2 gap-3">
            <div>
              <label class="lbl">Nhà sản xuất</label>
              <div class="flex gap-1.5">
                <select id="edit-nha-sx" onchange="onNSXChange('edit')"
                  class="flex-1 min-w-0 inp cursor-pointer">
                  <option value="">— Chọn NSX —</option>
                </select>
                <button type="button" id="btn-edit-nsx-edit" title="Sửa NSX đang chọn"
                  onclick="openMfEdit('edit-nha-sx','edit')"
                  class="border-2 rounded-xl px-2.5 text-base hover:bg-blue-50 hidden"
                  style="border-color:#bfdbfe;color:#2563eb">✏️</button>
                <button type="button" onclick="openMfModal('nsx','edit')"
                  class="border-2 border-gray-200 rounded-xl px-2.5 text-base hover:bg-gray-50">➕</button>
              </div>
            </div>
            <div><label class="lbl">Địa chỉ NSX</label><input id="edit-dc-nsx" class="inp" style="background:#ececf0;color:#8a8a8e"></div>
            <div>
              <label class="lbl">Nhà phân phối</label>
              <div class="flex gap-1.5">
                <select id="edit-nha-pp" onchange="onNPPChange('edit')"
                  class="flex-1 min-w-0 inp cursor-pointer">
                  <option value="">— Chọn NPP —</option>
                </select>
                <button type="button" id="btn-edit-npp-edit" title="Sửa NPP đang chọn"
                  onclick="openMfEdit('edit-nha-pp','edit')"
                  class="border-2 rounded-xl px-2.5 text-base hover:bg-blue-50 hidden"
                  style="border-color:#bfdbfe;color:#2563eb">✏️</button>
                <button type="button" onclick="openMfModal('npp','edit')"
                  class="border-2 border-gray-200 rounded-xl px-2.5 text-base hover:bg-gray-50">➕</button>
              </div>
            </div>
            <div><label class="lbl">Địa chỉ NPP</label><input id="edit-dc-npp" class="inp" style="background:#ececf0;color:#8a8a8e"></div>
            <div><label class="lbl">Xuất xứ</label><input id="edit-xuat-xu" class="inp"></div>
          </div>
        </div>
        <div class="border-t pt-3">
          <div class="text-xs font-bold text-gray-400 uppercase mb-2">Trạng thái & quản lý</div>
          <div class="grid grid-cols-1 sm:grid-cols-2 gap-3">
            <div><label class="lbl">Trạng thái</label>
              <select id="edit-tt" class="inp">
                <option value="con_hang">Còn hàng</option>
                <option value="da_ban">Đã bán</option>
                <option value="that_lac">Thất lạc</option>
                <option value="xuat_xuong">Xuất xưởng (gia công)</option>
              </select></div>
            <div><label class="lbl">Ngày xuất</label><input id="edit-ngay-xuat"   class="inp" placeholder="DD/MM/YYYY"></div>
            <div><label class="lbl">Lý do nhập</label><input id="edit-ly-do-nhap" class="inp"></div>
            <div>
              <label class="lbl">Thời gian nhập</label>
              <input id="edit-ngay-nhap" type="date" lang="vi" class="inp font-medium"
                style="background:linear-gradient(135deg,#fffbeb,#fef3c7);border:1.5px solid #f59e0b;color:#92400e">
            </div>
            <div><label class="lbl">Lý do xuất</label><input id="edit-ly-do-xuat" class="inp"></div>
            <div><label class="lbl">Mã HĐ đầu vào</label><input id="edit-ma-hd"   class="inp"></div>
            <div><label class="lbl">RFID UID</label><input id="edit-rfid"          class="inp" placeholder="UID thẻ RFID"
              autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false" data-lpignore="true" data-form-type="other"></div>
          </div>
          <!-- Ảnh sản phẩm -->
          <div class="mt-3">
            <label class="lbl">📷 Ảnh sản phẩm</label>
            <div class="flex items-center gap-3 flex-wrap">
              <input type="file" id="edit-anh" accept="image/*" capture="environment" class="hidden"
                onchange="onPhotoPicked(this, 'edit')">
              <img id="edit-anh-preview" class="hidden w-20 h-20 object-cover rounded-xl border-2 border-amber-300 shadow-sm cursor-zoom-in"
                onclick="window.open(this.src, '_blank')">
              <button type="button" onclick="document.getElementById('edit-anh').click()"
                class="scan-btn !px-3">📷 Chụp / thay ảnh</button>
              <button type="button" id="edit-anh-remove" onclick="clearPhoto('edit')"
                class="hidden text-red-500 hover:text-red-700 text-xs font-semibold">✕ Xóa ảnh</button>
            </div>
          </div>
        </div>
      </div>
      <div class="px-6 pb-6 flex items-center gap-3">
        <button onclick="saveEdit()"
          class="btn-ios btn-ios-gold px-6 py-2.5">
          💾 Lưu thay đổi
        </button>
        <span id="edit-msg" class="text-sm flex-1"></span>
        {% if quyen_in_tem == 'in' %}
        <a id="edit-print-btn" href="#" target="_blank"
          class="btn-ios btn-ios-secondary text-amber-700 text-sm font-semibold px-3 py-2">
          🏷️ In tem
        </a>
        {% endif %}
        <button onclick="closeEdit()" class="text-gray-400 hover:text-gray-700 text-sm">Đóng</button>
      </div>
    </div>
  </div>

  <!-- RFID:TIM-MON — tìm món bằng khay: đặt từng khay hàng lên đầu đọc tới khi thấy -->
  <div id="rf-tim-modal" class="fixed inset-0 z-50 hidden ios-backdrop bg-black/40 flex items-center justify-center p-4">
    <div class="bg-white rounded-[24px] shadow-xl w-full max-w-md overflow-hidden">
      <div class="px-5 py-4 text-white flex items-center justify-between"
           style="background:linear-gradient(135deg,#7c3aed,#8b5cf6)">
        <div class="font-bold">🔍 Tìm món bằng khay RFID</div>
        <button onclick="rfTimDong()" class="text-white/80 hover:text-white text-xl leading-none">✕</button>
      </div>
      <div class="p-5 space-y-3 text-center">
        <div id="rf-tim-sp" class="text-sm font-bold text-gray-800"></div>
        <div id="rf-tim-tt" class="rounded-2xl px-4 py-8 text-lg font-black transition-all"></div>
        <div class="text-xs text-slate-500">Đặt lần lượt TỪNG khay hàng lên đầu đọc — thấy món là báo xanh + kêu ngay.</div>
        <button type="button" id="rf-tim-chuong" class="text-xs font-bold rounded-xl border px-3 py-2"
                style="background:#f5f3ff;color:#5b21b6;border-color:#ddd6fe">🔔 Chuông</button>
      </div>
    </div>
  </div>

  {# Modal gán tem RFID — chỉ Giám đốc/Phó GĐ (nhân viên không có nút mở) #}
  {% if xem_tong %}
  <!-- RFID:GAN-TEM — modal gán tem RFID (spec 2026-07-28-rfid-design.md) -->
  <div id="rf-gan-modal" class="fixed inset-0 z-50 hidden ios-backdrop bg-black/40 flex items-center justify-center p-4">
    <div class="bg-white rounded-[24px] shadow-xl w-full max-w-lg max-h-[90vh] overflow-y-auto">
      <div class="px-5 py-4 text-white rounded-t-[24px] flex items-center justify-between"
           style="background:linear-gradient(135deg,#7c3aed,#8b5cf6)">
        <div>
          <div class="font-bold">📡 Gán tem RFID</div>
          <div class="text-xs opacity-80">Đặt tem (+món) lên khay → quét mã hàng → Lưu. Gắn liên tiếp không cần mở lại.</div>
        </div>
        <button onclick="rfCloseGan()" class="text-white/80 hover:text-white text-xl leading-none">✕</button>
      </div>
      <div class="p-5 space-y-4">
        <div id="rf-agent-tt" class="text-xs font-semibold"></div>
        <!-- RFID:GAN-TEM — đếm SỐ TEM đang trên khay NGAY LÚC NÀY (05/08/2026, chủ tiệm
             phát hiện màn này KHÔNG có chỗ nào đếm số tem trên khay — chỉ đếm bằng mắt,
             hay lệch). Đếm trực tiếp từ d.epcs (không phải _rfSoDaGan — cái đó chỉ đếm số
             LẦN BẤM LƯU thành công trong phiên, khác hẳn "đang có bao nhiêu tem trên khay"). -->
        <div id="rf-khay-tong" class="text-sm font-bold text-violet-700 bg-violet-50 border border-violet-200 rounded-xl px-3 py-2"></div>
        <div>
          <div class="text-xs font-bold text-slate-500 mb-1">Tem đang trên khay (chưa gán)</div>
          <div id="rf-epc-list" class="space-y-1.5 min-h-[52px]"></div>
        </div>
        <div>
          <div class="text-xs font-bold text-slate-500 mb-1">Mã hàng cần gán (quét mã QR trên tem, quét mã vạch hoặc gõ rồi Enter)</div>
          <!-- RFID:GAN-TEM 1.9.2 — quét mã QR trên tem là tự gán: máy C5 bóp cò (đầu quét 2D), máy khác bấm 📷 camera -->
          <div id="rf-c5-hd" class="hidden text-xs font-semibold text-violet-700 bg-violet-50 border border-violet-200 rounded-xl px-3 py-2 mb-2"></div>
          <div class="flex gap-2">
            <input id="rf-ma-hang" class="input-ios flex-1" style="min-width:0" placeholder="VD: NM260728001"
                   onkeydown="if(event.key==='Enter'){event.preventDefault();rfLuuGan();}">
            <button type="button" class="scan-btn flex-shrink-0" title="Quét mã QR trên tem bằng camera"
                    onclick="openScanner('product', rfNhanMa)">📷 Quét QR</button>
          </div>
          <div id="rf-sp-preview" class="text-xs text-slate-500 mt-1"></div>
        </div>
        <div id="rf-gan-msg" class="text-sm"></div>
        <div class="flex items-center gap-3">
          <button onclick="rfLuuGan()" class="btn-ios btn-ios-gold px-6 py-2.5">💾 Gán tem</button>
          <span id="rf-gan-count" class="text-xs text-emerald-700 font-semibold"></span>
        </div>
      </div>
    </div>
  </div>
  {% endif %}

{% endblock %}

{% block scripts %}
<style>
  /* ═══ DANH SÁCH TỒN KHO — Bảng trên máy tính, THẺ trên điện thoại ═══ */
  #inv-list { --inv-cols: 26px 40px minmax(82px,0.9fr) minmax(100px,1.25fr) 62px 54px 54px 84px 104px 76px 122px; }
  .inv-head, .inv-row {
    display:grid; grid-template-columns:var(--inv-cols); align-items:center;
    column-gap:6px; padding:0 12px;
  }
  /* content-visibility: trình duyệt BỎ QUA việc đo/vẽ các thẻ NGOÀI màn hình
     (29/07/2026 — chủ tiệm: "logo giật thì bấm không ăn"). Không có dòng này,
     mỗi lần chèn thêm thẻ vào danh sách 851 món là trình duyệt đo lại bố cục
     TẤT CẢ thẻ trước đó → luồng chính kẹt hàng giây lúc mới vào trang. Thẻ vẫn
     ĐỦ trong DOM (chọn-hết/in tem/tìm kiếm nguyên vẹn), chỉ hoãn phần đo-vẽ
     tới khi cuộn tới. contain-intrinsic-size = cỡ ước lượng giữ thanh cuộn ổn. */
  .inv-row { content-visibility:auto; contain-intrinsic-size:auto 46px; }
  @media (max-width:820px){ .inv-row { contain-intrinsic-size:auto 132px; } }
  @media (min-width:821px){
    .inv-c-act { flex-wrap:nowrap !important; gap:4px; overflow:visible; }
    .inv-c-act .tkt-act { padding:5px 7px; font-size:12px; line-height:1; }
    .inv-c-ten { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  }
  .inv-head {
    height:40px; font-size:11px; font-weight:700; letter-spacing:.03em; text-transform:uppercase;
    color:#9ca3af; background:#f9fafb; border-bottom:1px solid #f0f0f2; position:sticky; top:0; z-index:5;
  }
  .inv-head .inv-c-klt, .inv-head .inv-c-klv, .inv-head .inv-c-von, .inv-head .inv-c-gia { text-align:right; }
  .inv-head .inv-c-act { text-align:center; }
  .inv-row {
    min-height:60px; padding-top:8px; padding-bottom:8px; border-bottom:1px solid #f2f2f4;
    cursor:pointer; transition:background .12s;
  }
  .inv-row:hover { background:#fffbeb; }
  .inv-c-klt, .inv-c-klv, .inv-c-von, .inv-c-gia { text-align:right; }
  .inv-c-klt, .inv-c-klv { font-size:12.5px; color:#4b5563; font-variant-numeric:tabular-nums; }
  .inv-c-von { font-size:13px; color:#374151; font-variant-numeric:tabular-nums; }
  .inv-c-gia { font-size:14px; font-weight:800; font-variant-numeric:tabular-nums; }
  .inv-c-ma  { font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:12.5px; font-weight:600; color:#1f2937;
               display:flex; align-items:center; gap:4px; flex-wrap:wrap; }
  .inv-ma-code { font-weight:700; }
  .inv-badge-ico { font-size:13px; }
  .inv-expand { color:#d1d5db; font-size:10px; margin-left:auto; }
  .inv-c-ten { font-weight:700; font-size:13.5px; color:#111827; line-height:1.25; }
  .inv-chip-loai { display:inline-block; padding:2px 9px; border-radius:9px; background:#fef3c7; color:#92400e;
                   font-size:11.5px; font-weight:700; white-space:nowrap; }
  .inv-thumb { width:44px; height:44px; border-radius:11px; object-fit:cover; border:1.5px solid #fde68a;
               background:#fffdf5; display:flex; align-items:center; justify-content:center; font-size:20px; }
  .inv-thumb-empty { color:#e0b84a; border-style:dashed; }
  .inv-mid { display:contents; }   /* máy tính: loại/KLT/KLV/vốn/giá là cột grid riêng */
  .inv-c-act { display:flex; gap:6px; justify-content:center; flex-wrap:wrap; }
  .inv-lbl-m { display:none; }   /* nhãn KLT/KLV/Vốn chỉ hiện ở chế độ thẻ (ĐT) */
  .inv-detail { background:#fffdf5; border-bottom:2px solid #fde68a; padding:14px 18px; }

  /* ── THẺ trên điện thoại/tablet nhỏ ── */
  @media (max-width:820px) {
    .inv-head { display:none; }
    #inv-list { padding:0 10px 8px; }
    .inv-row {
      grid-template-columns:26px 46px 1fr auto;
      grid-template-areas:
        "chk photo ma  tt"
        "chk photo ten ten"
        "chk photo mid mid"
        "act act   act act";
      column-gap:11px; row-gap:2px; align-items:start;
      margin:10px 0; padding:12px 13px; border:1px solid #f0e6c8; border-radius:16px;
      background:#fff; box-shadow:0 2px 6px rgba(120,90,10,.06); border-bottom:1px solid #f0e6c8;
    }
    .inv-row:hover { background:#fff; }
    .inv-c-chk  { grid-area:chk; align-self:center; }
    .inv-c-photo{ grid-area:photo; align-self:start; }
    .inv-thumb  { width:46px; height:46px; }
    .inv-c-ma   { grid-area:ma; }
    .inv-c-ten  { grid-area:ten; font-size:15px; margin-top:1px; }
    .inv-expand { display:none; }
    .inv-c-tt   { grid-area:tt; justify-self:end; }
    /* khối giữa: loại vàng + KLT + KLV + vốn (dòng nhỏ), rồi GIÁ BÁN to */
    .inv-mid {
      grid-area:mid; display:flex; flex-wrap:wrap; align-items:baseline;
      column-gap:9px; row-gap:1px; margin-top:4px;
    }
    .inv-c-loai, .inv-c-klt, .inv-c-klv, .inv-c-von {
      text-align:left; font-size:12px; color:#6b7280; font-weight:500;
    }
    .inv-lbl-m { display:inline; font-weight:600; color:#9ca3af; margin-right:2px; }
    .inv-c-klt::after, .inv-c-loai::after { content:"·"; color:#d8d8dc; margin-left:9px; }
    .inv-c-gia { flex-basis:100%; text-align:left; font-size:19px; margin-top:5px; }
    .inv-c-act {
      grid-area:act; justify-content:flex-start; gap:8px;
      margin-top:10px; padding-top:10px; border-top:1px dashed #efe3c2;
    }
    .inv-c-act .tkt-act { flex:1; justify-content:center; }
  }
  @media (min-width:821px){ .inv-act-txt{ display:none; } }   /* máy tính chỉ hiện icon nút cho gọn */

  /* ═══ BỘ LỌC TỒN KHO — mỗi ô 1 nhãn, ô đang chọn nổi bật, hàng chip lọc đang bật ═══ */
  .inv-filter { padding:12px 16px 8px; background:#fffdf7; border-top:1px solid #fde68a; }
  .inv-filter-grid { display:grid; gap:9px 12px; grid-template-columns:repeat(auto-fit, minmax(150px,1fr)); }
  @media (min-width:1000px){ .inv-filter-grid { grid-template-columns:repeat(7, minmax(0,1fr)); gap:9px 10px; } }
  .ff { display:flex; flex-direction:column; gap:3px; min-width:0; }
  .ff-lbl { font-size:10.5px; font-weight:700; color:#a16207; text-transform:uppercase; letter-spacing:.02em; padding-left:2px; }
  .ff-sel { width:100%; background:#fff; border:1.5px solid #fde68a; border-radius:10px;
            padding:8px 10px; font-size:14px; color:#1f2937; cursor:pointer; outline:none;
            transition:border-color .15s, box-shadow .15s, background .15s; }
  .ff-sel:focus { border-color:#f59e0b; box-shadow:0 0 0 3px rgba(245,158,11,.15); }
  .ff-sel.ff-on { background:#fffbeb; border-color:#f59e0b; font-weight:700; color:#92400e; }  /* ô đang lọc */
  /* Trạng thái (Còn hàng/Đã bán…) — ô CUỐI hàng lọc, tô xanh đậm để nhận ra ngay đang xem nhóm nào */
  .ff-lbl-tt { color:#047857; }
  .ff-sel.ff-tt { background:linear-gradient(135deg,#ecfdf5,#d1fae5); border:2px solid #10b981;
                  font-weight:800; color:#065f46; box-shadow:0 0 0 3px rgba(16,185,129,.12); }
  .ff-sel.ff-tt:focus { border-color:#059669; box-shadow:0 0 0 3px rgba(5,150,105,.25); }

  /* Khối Báo cáo tồn kho — to, rõ (chỉ người có quyền Báo cáo thấy) */
  .inv-bao-cao { display:flex; align-items:center; gap:14px; padding:14px 18px; border-radius:18px;
                 background:linear-gradient(135deg,#5b21b6,#7c3aed 55%,#a855f7); color:#fff;
                 box-shadow:0 8px 22px rgba(124,58,237,.28); text-decoration:none;
                 transition:transform .12s, box-shadow .12s; }
  .inv-bao-cao:hover { transform:translateY(-1px); box-shadow:0 12px 28px rgba(124,58,237,.36); }
  .inv-bao-cao:active { transform:scale(.99); }
  .ibc-ico { font-size:30px; line-height:1; flex-shrink:0; }
  .ibc-chu { display:flex; flex-direction:column; gap:2px; min-width:0; flex:1; }
  .ibc-tieu-de { font-size:18px; font-weight:900; letter-spacing:.01em; }
  .ibc-mo-ta { font-size:12.5px; opacity:.88; }
  .ibc-mui-ten { flex-shrink:0; background:#fff; color:#6d28d9; font-weight:800; font-size:13px;
                 padding:8px 14px; border-radius:12px; white-space:nowrap; }
  @media (max-width:640px){
    .inv-bao-cao { flex-wrap:wrap; gap:10px; padding:13px 14px; }
    .ibc-mui-ten { width:100%; text-align:center; }
  }

  .inv-filter-active { display:flex; align-items:center; flex-wrap:wrap; gap:7px;
                       margin-top:10px; padding-top:9px; border-top:1px dashed #fde68a; min-height:34px; }
  .fa-lead { font-size:12px; font-weight:700; color:#6b7280; display:none; }
  .inv-filter-active.has-filter .fa-lead { display:inline; }
  .fa-hint { font-size:12px; color:#b0b0b6; font-style:italic; }
  .inv-filter-active.has-filter .fa-hint { display:none; }
  .f-chip { display:inline-flex; align-items:center; gap:5px; padding:3px 6px 3px 11px;
            background:#fef3c7; color:#92400e; border-radius:999px; font-size:12px; font-weight:600; border:1px solid #fcd34d; }
  .f-chip button { border:none; background:#f59e0b; color:#fff; width:17px; height:17px; border-radius:50%;
                   font-size:11px; line-height:1; cursor:pointer; display:flex; align-items:center; justify-content:center; padding:0; }
  .f-chip button:hover { background:#b45309; }
  .fa-clear { display:none; font-size:12px; font-weight:600; color:#b45309; background:#fff7ed;
              border:1px solid #fed7aa; border-radius:8px; padding:4px 10px; cursor:pointer; }
  .inv-filter-active.has-filter .fa-clear { display:inline-block; }
  .fa-clear:hover { background:#ffedd5; }
  .fa-count { margin-left:auto; font-size:12px; color:#6b7280; font-weight:600; white-space:nowrap; }

  .lbl { display:block; font-size:11px; font-weight:600; color:#8a8a8e; text-transform:uppercase; letter-spacing:.02em; margin-bottom:4px; }
  .inp { width:100%; background:#f2f2f7; border:1.5px solid transparent; border-radius:12px;
         padding:9px 12px; outline:none; font-size:16px; color:#1c1c1e;
         transition: box-shadow .15s ease, border-color .15s ease, background .15s ease; }
  .inp::placeholder { color:#bcbcc2; }
  .inp:focus { background:#fff; border-color: var(--brand); box-shadow: 0 0 0 3px rgba(139,0,0,.08); }

  /* ── Tooltip công thức giá bán ─────────────────── */
  .htip { position:relative; display:inline-block; cursor:pointer; }
  .htip .tip {
    display:none; position:absolute; bottom:calc(100% + 8px); right:0;
    background:#1e293b; color:#f1f5f9; padding:8px 12px; border-radius:10px;
    font-size:11px; line-height:1.8; white-space:nowrap; z-index:60;
    text-align:left; font-weight:400;
    box-shadow:0 8px 24px rgba(0,0,0,.4); min-width:200px; pointer-events:none;
  }
  .htip .tip::after {
    content:''; position:absolute; top:100%; right:14px;
    border:6px solid transparent; border-top-color:#1e293b;
  }
  /* 01/10/2026 chủ tiệm yêu cầu BỎ bảng ghi chú đen khi trỏ/chạm vào giá bán (khó đọc) —
     không hiện ở bất kỳ trường hợp nào nữa. */
  .htip .tip { display:none !important; }
</style>
<script>
const PIN_KEY = 'vang_admin_pin';
const fmt  = n => Number(n||0).toLocaleString('vi-VN');
// Trọng lượng: hiện ĐỦ SỐ đã nhập (tới 4 số lẻ), KHÔNG cắt về 3 số
const fmtW = n => n == null ? '—' : (Number(n).toFixed(4).replace(/\.?0+$/,'') + ' chỉ');
// Giá từ DB lưu theo nghìn đồng → nhân 1000 để hiển thị đồng
const fmtD = n => n != null && n !== '' && Number(n) !== 0
  ? (Number(n) * 1000).toLocaleString('vi-VN') + 'đ'
  : (Number(n) === 0 ? '0đ' : '—');

document.getElementById('pin-input').value = localStorage.getItem(PIN_KEY) || '';
document.getElementById('pin-input').addEventListener('input',
  e => localStorage.setItem(PIN_KEY, e.target.value.trim()));
function getPin() { return document.getElementById('pin-input').value.trim(); }

// ── Datetime helpers (DB: DD/MM/YYYY HH:MM:SS ↔ input: YYYY-MM-DDTHH:MM) ──
function dtToInput(s) {
  if (!s) return '';
  // "DD/MM/YYYY ..." → "YYYY-MM-DD"
  const m = s.match(/^(\d{2})\/(\d{2})\/(\d{4})/);
  return m ? `${m[3]}-${m[2]}-${m[1]}` : '';
}
function dtFromInput(s) {
  if (!s) return null;
  // "YYYY-MM-DD" → "DD/MM/YYYY"
  const m = s.match(/^(\d{4})-(\d{2})-(\d{2})/);
  return m ? `${m[3]}/${m[2]}/${m[1]}` : null;
}
function nowInputDt() {
  const d = new Date();
  const pad = n => String(n).padStart(2,'0');
  return `${d.getFullYear()}-${pad(d.getMonth()+1)}-${pad(d.getDate())}`;
}

// ── Giá vàng hiện tại ──────────────────────────────
let _priceMap = {};   // loai → ban price (k/chỉ)
let _calcPrice = 0;   // giá bán tính được
let _calcPriceEdit = 0;
let _manufacturers = { nsx: [], npp: [] };  // danh sách NSX/NPP

async function fetchPrices() {
  try {
    const r = await fetch('/api/prices');
    const d = await r.json();
    _priceMap = {};
    (d.prices || []).forEach(p => { _priceMap[p.loai] = p.ban; });
    // Điền gợi ý vào datalist
    const dl = document.getElementById('loai-options');
    dl.innerHTML = (d.prices || []).map(p => `<option value="${_e(p.loai)}" label="${_e(p.ten || p.loai)}">`).join('');
    // Cập nhật giá realtime trong bảng nếu đã có dữ liệu — PHẢI qua filterTable()
    // (áp lại đúng tìm kiếm/bộ lọc đang bật), KHÔNG render thẳng _allProds (toàn bộ
    // danh sách chưa lọc). Bug thật 05/08/2026: vòng cập nhật giá này chạy mỗi 60s,
    // trước đây render thẳng _allProds → cứ 60s là ô tìm kiếm bị "nhảy" về hiện hết,
    // bất kể đang gõ/đã gõ xong mã gì trong ô tìm kiếm.
    if (_allProds.length) filterTable();
  } catch(e) {}
}

// ── AN TOÀN HIỂN THỊ (B2, 15/10/2026) ─────────────────────────────────────────
// Mọi dữ liệu sản phẩm / danh mục / thiết bị (tên, mã, loại, NSX, EPC, lỗi nhập Excel...) là KHÔNG ĐÁNG TIN: người có
// quyền Sửa tồn kho nhập được. Quy tắc của trang này:
//   1) Chèn vào HTML (văn bản hoặc thuộc tính CÓ dấu nháy) → luôn qua _e().
//   2) KHÔNG BAO GIỜ đặt dữ liệu vào thuộc tính sự kiện (onclick=...) hay chuỗi JS nội tuyến: trình duyệt GIẢI MÃ
//      &#39; / &quot; trong thuộc tính trước khi chạy JS, nên thoát HTML không bảo vệ được. Chỉ truyền id số rồi tra
//      lại dữ liệu trong _allProds.
function _e(s) {
  return String(s ?? '').replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;')
    .replace(/"/g, '&quot;').replace(/'/g, '&#39;').replace(/`/g, '&#96;');
}

// ── Gợi ý tên sản phẩm (từ hàng đã có, gồm cả đã bán) ──
async function loadNameSuggestions() {
  try {
    const r = await fetch('/api/pos/product-names');
    const d = await r.json();
    const dl = document.getElementById('ten-options');
    if (dl) dl.innerHTML = (d.names || []).map(n =>
      `<option value="${_e(n)}">`).join('');
  } catch(e) {}
}

// ── Nhà sản xuất / phân phối ──────────────────────
async function loadManufacturers() {
  try {
    const r = await fetch('/api/pos/manufacturers');
    const d = await r.json();
    _manufacturers.nsx = (d.manufacturers || []).filter(m => m.loai === 'nsx' || m.loai === 'both');
    _manufacturers.npp = (d.manufacturers || []).filter(m => m.loai === 'npp' || m.loai === 'both');

    // Rebuild từng dropdown: giữ nguyên giá trị đang chọn,
    // sau đó luôn gọi change-handler để địa chỉ / TCCS được đồng bộ với data mới nhất
    [['f-nha-sx','nsx','add'], ['edit-nha-sx','nsx','edit']].forEach(([selId, loai, ctx]) => {
      const sel = document.getElementById(selId);
      if (!sel) return;
      const prev = sel.value;          // lưu lại giá trị đang chọn
      populateMfSelect(selId, loai, prev);
      onNSXChange(ctx);                // luôn refresh dc-nsx + tccs (kể cả khi prev = '')
    });
    [['f-nha-pp','npp','add'], ['edit-nha-pp','npp','edit']].forEach(([selId, loai, ctx]) => {
      const sel = document.getElementById(selId);
      if (!sel) return;
      const prev = sel.value;
      populateMfSelect(selId, loai, prev);
      onNPPChange(ctx);                // luôn refresh dc-npp
    });
  } catch(e) { console.error('loadManufacturers error:', e); }
}

// So khớp tên NSX/NPP "bền": bỏ qua khác biệt hoa/thường, khoảng trắng thừa/đôi,
// và chuẩn hóa Unicode (dấu tổ hợp) — để tên nhập từ Excel lệch tinh vi vẫn chọn đúng.
function _mfNorm(s) {
  return (s || '').normalize('NFC').replace(/\s+/g, ' ').trim().toLowerCase();
}

// Đặt Đơn vị tính vào select: khớp option KHÔNG phân biệt hoa/thường (VD 'Món'
// nhập từ Excel vẫn chọn đúng 'món'); giá trị lạ ngoài danh sách thì thêm option
// để HIỆN + giữ nguyên (không mất dữ liệu, không hiện trống). Trống → để trống.
function _setDonVi(selId, val) {
  const sel = document.getElementById(selId);
  if (!sel) return;
  const v = (val || '').trim();
  if (!v) { sel.value = ''; return; }
  const opt = [...sel.options].find(o => o.value.toLowerCase() === v.toLowerCase());
  if (opt) { sel.value = opt.value; return; }
  const o = document.createElement('option');
  o.value = v; o.textContent = v; o.selected = true;
  sel.appendChild(o);
}

function populateMfSelect(selId, loai, selectedVal) {
  const sel = document.getElementById(selId);
  if (!sel) return;
  const opts = _manufacturers[loai] || [];
  const svNorm = _mfNorm(selectedVal);
  // Tìm mục khớp (ưu tiên khớp tuyệt đối, sau đó khớp chuẩn hóa)
  const matched = svNorm && (opts.find(m => m.ten === selectedVal) || opts.find(m => _mfNorm(m.ten) === svNorm));
  let html = `<option value="">— Chọn ${loai.toUpperCase()} —</option>`
    + opts.map(m =>
        `<option value="${_e(m.ten)}" data-id="${_e(m.id)}" data-dia="${_e(m.dia_chi)}" data-tccs="${_e(m.tccs)}" data-ghi="${_e(m.ghi_chu)}"
          ${matched && m.id === matched.id ? 'selected' : ''}>${_e(m.ten)}</option>`
      ).join('');
  // Giá trị đã lưu (VD nhập từ Excel) KHÔNG khớp mục nào → vẫn thêm 1 option để HIỆN
  // + GIỮ NGUYÊN khi lưu (không mất dữ liệu, không hiện trống).
  const sv = (selectedVal || '').trim();
  if (sv && !matched) {
    html += `<option value="${_e(sv)}" selected>${_e(sv)} — (chưa có trong danh sách, bấm ➕ để thêm)</option>`;
  }
  sel.innerHTML = html;
}

function _toggleEditBtn(btnId, show) {
  const btn = document.getElementById(btnId);
  if (btn) btn.classList.toggle('hidden', !show);
}

function onNSXChange(ctx) {
  const selId  = ctx === 'edit' ? 'edit-nha-sx'  : 'f-nha-sx';
  const dcId   = ctx === 'edit' ? 'edit-dc-nsx'  : 'f-dc-nsx';
  const tccsId = ctx === 'edit' ? 'edit-tccs'    : 'f-tccs';
  const btnId  = ctx === 'edit' ? 'btn-edit-nsx-edit' : 'btn-edit-nsx-add';
  const sel    = document.getElementById(selId);
  const opt    = sel.selectedOptions[0];
  const dcEl   = document.getElementById(dcId);
  const tccsEl = document.getElementById(tccsId);
  if (!opt || !opt.value) {
    if (dcEl)   dcEl.value   = '';
    if (tccsEl) tccsEl.value = '';
    _toggleEditBtn(btnId, false);
    return;
  }
  if (dcEl)   dcEl.value   = opt.dataset.dia  || '';
  if (tccsEl) tccsEl.value = opt.dataset.tccs || '';
  _toggleEditBtn(btnId, true);
}

function onNPPChange(ctx) {
  const selId = ctx === 'edit' ? 'edit-nha-pp' : 'f-nha-pp';
  const dcId  = ctx === 'edit' ? 'edit-dc-npp' : 'f-dc-npp';
  const btnId = ctx === 'edit' ? 'btn-edit-npp-edit' : 'btn-edit-npp-add';
  const sel   = document.getElementById(selId);
  const opt   = sel.selectedOptions[0];
  const dcEl  = document.getElementById(dcId);
  if (!opt || !opt.value) {
    if (dcEl) dcEl.value = '';
    _toggleEditBtn(btnId, false);
    return;
  }
  if (dcEl) dcEl.value = opt.dataset.dia || '';
  _toggleEditBtn(btnId, true);
}

// ── Modal thêm / sửa NSX / NPP ────────────────────
function _mfFill(id, dia, tccs, ghi, isEdit) {
  document.getElementById('mf-id').value      = id || '';
  document.getElementById('mf-dia-chi').value = dia  || '';
  document.getElementById('mf-tccs').value    = tccs || '';
  document.getElementById('mf-ghi-chu').value = ghi  || '';
  document.getElementById('mf-btn-delete').classList.toggle('hidden', !isEdit);
  document.getElementById('mf-msg').textContent = '';
}

// Mở modal để THÊM MỚI
function openMfModal(loai, target) {
  document.getElementById('mf-loai').value   = loai;
  document.getElementById('mf-target').value = target;
  document.getElementById('mf-modal-title').textContent =
    `➕ Thêm ${loai === 'nsx' ? 'Nhà sản xuất' : 'Nhà phân phối'} mới`;
  document.getElementById('mf-ten').value = '';
  _mfFill('', '', '', '', false);
  document.getElementById('mf-modal').classList.remove('hidden');
  setTimeout(() => document.getElementById('mf-ten').focus(), 50);
}

// Mở modal để SỬA — đọc data từ option đang chọn trong dropdown
function openMfEdit(selId, target) {
  const sel = document.getElementById(selId);
  const opt = sel.selectedOptions[0];
  if (!opt || !opt.value) return;
  const loai = selId.includes('nsx') ? 'nsx' : 'npp';
  document.getElementById('mf-loai').value   = loai;
  document.getElementById('mf-target').value = target;
  document.getElementById('mf-modal-title').textContent =
    `✏️ Sửa ${loai === 'nsx' ? 'Nhà sản xuất' : 'Nhà phân phối'}`;
  document.getElementById('mf-ten').value = opt.value;
  _mfFill(opt.dataset.id, opt.dataset.dia, opt.dataset.tccs, opt.dataset.ghi, true);
  document.getElementById('mf-modal').classList.remove('hidden');
  setTimeout(() => document.getElementById('mf-ten').focus(), 50);
}

function closeMfModal() {
  document.getElementById('mf-modal').classList.add('hidden');
}

async function saveMfModal() {
  const mfId   = document.getElementById('mf-id').value.trim();
  const ten    = document.getElementById('mf-ten').value.trim();
  const loai   = document.getElementById('mf-loai').value;
  const target = document.getElementById('mf-target').value;
  const msg    = document.getElementById('mf-msg');
  if (!ten) { msg.textContent = '⚠️ Nhập tên'; return; }

  const body = {
    pin:     getPin(),
    ten,
    dia_chi: document.getElementById('mf-dia-chi').value.trim() || null,
    tccs:    document.getElementById('mf-tccs').value.trim()    || null,
    loai,
    ghi_chu: document.getElementById('mf-ghi-chu').value.trim() || null,
  };

  const isEdit = !!mfId;
  const url    = isEdit ? `/api/pos/manufacturers/${mfId}` : '/api/pos/manufacturers';
  const method = isEdit ? 'PUT' : 'POST';

  const r = await fetch(url, {
    method, headers:{'Content-Type':'application/json'}, body: JSON.stringify(body)
  });
  const d = await r.json();
  if (d.success) {
    // loadManufacturers sẽ: rebuild option (data mới), giữ selection, gọi change-handler
    // → địa chỉ/TCCS tự động cập nhật theo NSX/NPP mới nhất
    await loadManufacturers();

    // Với entry MỚI (chưa được chọn trước khi save): chọn vào dropdown
    const selId = target === 'edit'
      ? (loai === 'nsx' ? 'edit-nha-sx' : 'edit-nha-pp')
      : (loai === 'nsx' ? 'f-nha-sx'    : 'f-nha-pp');
    const sel = document.getElementById(selId);
    if (sel && sel.value !== ten) {
      // Chỉ cần set nếu chưa được chọn (trường hợp thêm mới)
      sel.value = ten;
      if (loai === 'nsx') onNSXChange(target);
      else                onNPPChange(target);
    }
    closeMfModal();
  } else {
    msg.textContent = d.error === 'wrong_pin' ? '❌ Sai PIN' : `❌ ${d.error}`;
  }
}

async function deleteMfModal() {
  const mfId  = document.getElementById('mf-id').value.trim();
  const ten   = document.getElementById('mf-ten').value.trim();
  const loai  = document.getElementById('mf-loai').value;
  const targ  = document.getElementById('mf-target').value;
  if (!mfId) return;
  if (!confirm(`Xóa ${loai === 'nsx' ? 'NSX' : 'NPP'} "${ten}"?\n\nThông tin sản phẩm đang dùng NSX/NPP này sẽ không thay đổi.`)) return;
  const r = await fetch(`/api/pos/manufacturers/${mfId}`, {
    method:'DELETE', headers:{'Content-Type':'application/json'},
    body: JSON.stringify({pin: getPin()})
  });
  const d = await r.json();
  if (d.success) {
    await loadManufacturers();
    // Reset dropdown và ô địa chỉ
    const selId = targ === 'edit'
      ? (loai === 'nsx' ? 'edit-nha-sx' : 'edit-nha-pp')
      : (loai === 'nsx' ? 'f-nha-sx'    : 'f-nha-pp');
    const dcId  = targ === 'edit'
      ? (loai === 'nsx' ? 'edit-dc-nsx' : 'edit-dc-npp')
      : (loai === 'nsx' ? 'f-dc-nsx'    : 'f-dc-npp');
    const sel = document.getElementById(selId);
    const dc  = document.getElementById(dcId);
    if (sel) sel.value = '';
    if (dc)  dc.value  = '';
    if (loai === 'nsx') onNSXChange(targ);
    else                onNPPChange(targ);
    closeMfModal();
  } else {
    document.getElementById('mf-msg').textContent =
      d.error === 'wrong_pin' ? '❌ Sai PIN' : `❌ ${d.error}`;
  }
}

document.getElementById('mf-modal').addEventListener('click',
  function(e){ if(e.target===this) closeMfModal(); });

function findGiaVang(loai) {
  if (!loai) return 0;
  const lo = loai.trim();
  // Tìm khớp chính xác trước
  if (_priceMap[lo]) return _priceMap[lo];
  // Tìm khớp một phần
  for (const [k, v] of Object.entries(_priceMap)) {
    if (lo.includes(k) || k.includes(lo)) return v;
  }
  return 0;
}

// ── KL Vàng tự tính = KL Tổng − KL Đá ─────────────
function calcKLVang() {
  const tl = parseFloat(document.getElementById('f-tl').value) || 0;
  const da = parseFloat(document.getElementById('f-kl-da').value) || 0;
  const vang = klvExact(tl, da);   // KHÔNG làm tròn — giữ đúng số đã nhập
  const el = document.getElementById('f-kl-vang');
  el.value = vang > 0 ? vang : '';
  schedCalc();
}

function calcKLVangEdit() {
  const tl = parseFloat(document.getElementById('edit-tl').value) || 0;
  const da = parseFloat(document.getElementById('edit-kl-da').value) || 0;
  const vang = klvExact(tl, da);   // KHÔNG làm tròn — giữ đúng số đã nhập
  const el = document.getElementById('edit-kl-vang');
  el.value = vang > 0 ? vang : '';
  schedCalcEdit();
}

// ── Máy quét barcode (USB/BT) ───────────────────────
function activateBarcodeMode(inputId) {
  const el = document.getElementById(inputId);
  if (!el) return;
  const origPlaceholder = el.placeholder;
  const origClass = el.className;

  el.value = '';
  el.placeholder = '🔫 Chờ quét...';
  el.classList.add('border-blue-400', 'bg-blue-50');
  el.focus();

  function onKey(e) {
    if (e.key === 'Enter') {
      e.preventDefault();
      finish();
    }
  }
  function onBlur() { finish(false); }
  function finish(success = true) {
    el.removeEventListener('keydown', onKey);
    el.removeEventListener('blur', onBlur);
    el.placeholder = origPlaceholder;
    el.classList.remove('border-blue-400', 'bg-blue-50');
    if (success && el.value.trim()) {
      el.classList.add('border-green-400');
      setTimeout(() => el.classList.remove('border-green-400'), 800);
    }
  }
  el.addEventListener('keydown', onKey);
  el.addEventListener('blur', onBlur);
}

// ── Chế độ Giá bán ─────────────────────────────────
let _priceMode     = 'manual'; // add form
let _priceModeEdit = 'manual'; // edit modal

function setPriceMode(mode) {
  _priceMode = mode;
  const banEl = document.getElementById('f-ban');
  const btnM  = document.getElementById('price-tab-manual');
  const btnF  = document.getElementById('price-tab-formula');
  if (mode === 'formula') {
    banEl.readOnly = true;
    banEl.style.cssText = 'background:#fffbeb;color:#92400e;font-weight:600';
    btnF.classList.replace('text-gray-400','text-white');
    btnF.style.background = '#d97706';
    btnM.classList.replace('text-white','text-gray-400');
    btnM.style.background = '#fff';
    doCalc(); // áp ngay
  } else {
    banEl.readOnly = false;
    banEl.style.cssText = '';
    btnM.classList.replace('text-gray-400','text-white');
    btnM.style.background = '#f59e0b';
    btnF.classList.replace('text-white','text-gray-400');
    btnF.style.background = '#fff';
  }
}

function setPriceModeEdit(mode) {
  _priceModeEdit = mode;
  const banEl = document.getElementById('edit-ban');
  const btnM  = document.getElementById('price-tab-manual-edit');
  const btnF  = document.getElementById('price-tab-formula-edit');
  if (mode === 'formula') {
    banEl.readOnly = true;
    banEl.style.cssText = 'background:#fffbeb;color:#92400e;font-weight:600';
    btnF.classList.replace('text-gray-400','text-white');
    btnF.style.background = '#d97706';
    btnM.classList.replace('text-white','text-gray-400');
    btnM.style.background = '#fff';
    const _cd = document.getElementById('edit-gia-co-dinh');
    if (_cd) _cd.checked = false;    // CT tự động ⇒ KHÔNG phải giá cố định
    doCalcEdit(); // áp ngay
  } else {
    banEl.readOnly = false;
    banEl.style.cssText = '';
    btnM.classList.replace('text-gray-400','text-white');
    btnM.style.background = '#f59e0b';
    btnF.classList.replace('text-white','text-gray-400');
    btnF.style.background = '#fff';
  }
}

// ── Tính giá bán tự động (form thêm mới) ───────────
let _calcTimer = null;
function schedCalc() {
  clearTimeout(_calcTimer);
  _calcTimer = setTimeout(doCalc, 300);
}
function doCalc() {
  const loai = document.getElementById('f-loai').value.trim();
  const klv  = parseFloat(document.getElementById('f-kl-vang').value) || 0;
  // tc, td nhập theo đồng
  const tc   = parseFloat(document.getElementById('f-tien-cong').value) || 0;
  const td   = parseFloat(document.getElementById('f-tien-da').value) || 0;
  const hint = document.getElementById('price-calc-hint');
  const det  = document.getElementById('price-calc-detail');
  const btn  = document.getElementById('btn-apply-price');
  if (!klv && !tc && !td) { hint.classList.add('hidden'); return; }
  const gv = findGiaVang(loai); // k/chỉ từ bảng giá
  // Tính giá bán theo đồng: KLV × (giá/chỉ × 1000đ) + TC(đ) + TĐ(đ)
  _calcPrice = klv * gv * 1000 + tc + td;
  const fmtVND = n => n.toLocaleString('vi-VN') + 'đ';
  if (gv > 0) {
    det.textContent = `${klv}chỉ × ${fmtVND(gv*1000)} + ${fmtVND(tc)} + ${fmtVND(td)} = ${fmtVND(Math.round(_calcPrice))}`;
    btn.classList.remove('hidden');
  } else if (tc || td) {
    det.textContent = `(chưa có giá vàng) TC ${fmtVND(tc)} + TĐ ${fmtVND(td)} = ${fmtVND(tc+td)}`;
    _calcPrice = tc + td;
    btn.classList.remove('hidden');
  } else {
    hint.classList.add('hidden'); return;
  }
  // Chế độ CT tự động → áp ngay, ẩn nút "Áp dụng"
  if (_priceMode === 'formula') {
    document.getElementById('f-ban').value = formatSplitAmt(Math.round(_calcPrice));
    btn.classList.add('hidden');
    hint.classList.add('hidden');
  } else {
    hint.classList.remove('hidden');
  }
}
function applyCalcPrice() {
  document.getElementById('f-ban').value = Math.round(_calcPrice);
}

// ── Tính giá bán tự động (modal sửa) ───────────────
let _calcTimerEdit = null;
function schedCalcEdit() {
  clearTimeout(_calcTimerEdit);
  _calcTimerEdit = setTimeout(doCalcEdit, 300);
}
function doCalcEdit() {
  const loai = document.getElementById('edit-loai').value.trim();
  const klv  = parseFloat(document.getElementById('edit-kl-vang').value) || 0;
  // tc, td đã được × 1000 khi load vào modal → đơn vị đồng
  const tc   = parseFloat(document.getElementById('edit-tien-cong').value) || 0;
  const td   = parseFloat(document.getElementById('edit-tien-da').value) || 0;
  const hint = document.getElementById('edit-calc-hint');
  const det  = document.getElementById('edit-calc-detail');
  if (!klv && !tc && !td) { hint.classList.add('hidden'); return; }
  const gv = findGiaVang(loai); // k/chỉ
  const fmtVND = n => n.toLocaleString('vi-VN') + 'đ';
  _calcPriceEdit = klv * gv * 1000 + tc + td;
  if (gv > 0) {
    det.textContent = `💡 ${klv}chỉ × ${fmtVND(gv*1000)} + ${fmtVND(tc)} + ${fmtVND(td)} = ${fmtVND(Math.round(_calcPriceEdit))}`;
  } else {
    det.textContent = `💡 TC ${fmtVND(tc)} + TĐ ${fmtVND(td)} = ${fmtVND(tc+td)}`;
    _calcPriceEdit = tc + td;
  }
  // Chế độ CT tự động → áp ngay
  if (_priceModeEdit === 'formula') {
    document.getElementById('edit-ban').value = formatSplitAmt(Math.round(_calcPriceEdit));
    hint.classList.add('hidden');
  } else {
    hint.classList.remove('hidden');
  }
}
function applyCalcPriceEdit() {
  document.getElementById('edit-ban').value = Math.round(_calcPriceEdit);
}

// ── Toggle phần mở rộng ─────────────────────────────
// toggleAdvanced không còn dùng (form đã hiển thị tất cả)
function toggleAdvanced() {}

// ── Tóm tắt ────────────────────────────────────────
async function loadSummary() {
  const r = await fetch('/api/pos/summary');
  if (!r.ok) {            // khong co quyen bao cao -> khong hien khoi so tong
    document.getElementById('summary-bar').innerHTML = '';
    return;
  }
  const s = await r.json();
  document.getElementById('summary-bar').innerHTML = `
    <div class="ios-card p-4">
      <div class="text-xs text-gray-400 uppercase font-semibold">📦 Tồn kho</div>
      <div class="text-xl font-black text-gray-800 mt-0.5">${fmt(s.ton_kho_so_luong)} món</div>
      <div class="text-xs text-gray-400">Giá trị vốn: ${fmtD(s.ton_kho_gia_tri)}</div>
    </div>
    <div class="ios-card p-4">
      <div class="text-xs text-gray-400 uppercase font-semibold">💵 Doanh thu hôm nay</div>
      <div class="text-xl font-black text-green-700 mt-0.5">${fmtD(s.doanh_thu_hom_nay)}</div>
      <div class="text-xs text-gray-400">${s.so_giao_dich_hom_nay} giao dịch bán</div>
    </div>
    <div class="ios-card p-4" style="background:linear-gradient(135deg,#fff7ed,#fffbeb)">
      <div class="text-xs text-amber-600/80 uppercase font-semibold">📈 Lãi gộp hôm nay</div>
      <div class="text-xl font-black text-amber-700 mt-0.5">${fmtD(s.lai_gop_hom_nay)}</div>
      <div class="text-xs text-amber-600/70">Tồn quỹ: ${fmtD(s.ton_quy)}</div>
    </div>`;
}

// ── Danh sách sản phẩm ─────────────────────────────
let _allProds = [];

async function loadProducts() {
  const status = document.getElementById('filter-status').value;
  document.getElementById('btn-export-inv').href =
    '/api/pos/products/export' + (status ? `?status=${status}` : '');
  const r = await fetch('/api/pos/products' + (status ? `?status=${status}` : ''));
  const d = await r.json();
  _allProds = d.products;
  _fillFilterOptions();
  filterTable();   // giữ nguyên bộ lọc theo ô tìm kiếm sau khi tải lại (sửa/đóng modal…)
}

// ── BỘ LỌC NHANH ────────────────────────────────────────────────────────────
// Đổ danh sách chọn từ chính dữ liệu đang có (giữ nguyên lựa chọn cũ khi tải lại)
function _fillFilterOptions() {
  const esc = s => String(s).replace(/&/g,'&amp;').replace(/"/g,'&quot;').replace(/</g,'&lt;');
  const uniq = f => [...new Set(_allProds.map(f).filter(x => x && String(x).trim()))]
                      .sort((a, b) => String(a).localeCompare(String(b), 'vi'));
  const mk = (id, vals, label) => {
    const sel = document.getElementById(id); if (!sel) return;
    const cur = sel.value;
    sel.innerHTML = `<option value="">${label}</option>` +
      vals.map(v => `<option value="${esc(v)}">${esc(v)}</option>`).join('');
    sel.value = cur;                       // giữ lựa chọn sau khi loadProducts()
  };
  mk('f-loai-vang', uniq(p => p.loai_vang),     'Tất cả');
  // id RIÊNG f-loc-loai-sp: trước 23/10/2026 ô lọc trùng id "f-loai-sp" với ô Loại SP của form Nhập
  // hàng mới (đứng trước trong trang) → getElementById lấy nhầm ô nhập hàng: ô lọc không bao giờ có
  // lựa chọn, còn ô nhập hàng bị đè thành danh sách lọc.
  mk('f-loc-loai-sp', uniq(p => p.loai_san_pham), 'Tất cả');
  mk('f-nsx',       uniq(p => p.nha_san_xuat),  'Tất cả');
  // Đợt nhập = ngày nhập (dd/mm/yyyy). Xếp MỚI NHẤT lên đầu + kèm số SP để chọn nhanh lô vừa up.
  const dem = {};
  _allProds.forEach(p => { const d = _ngayNhap(p); if (d) dem[d] = (dem[d] || 0) + 1; });
  const ngay = Object.keys(dem).sort((a, b) => _dmyKey(b) - _dmyKey(a));
  const selN = document.getElementById('f-ngay');
  if (selN) {
    const cur = selN.value;
    selN.innerHTML = '<option value="">Tất cả ngày</option>' +
      ngay.map(d => `<option value="${d}">📅 ${d} — ${dem[d]} SP</option>`).join('');
    selN.value = cur;
  }
  // Thiếu thông tin: kèm số SP đang thiếu từng mục (trong danh sách đang tải)
  const selT = document.getElementById('f-thieu');
  if (selT) {
    const cur = selT.value;
    const demT = {}; let demBk = 0;
    _allProds.forEach(p => {
      const t = _thieuCua(p);
      if (t.length) demBk++;
      t.forEach(k => { demT[k] = (demT[k] || 0) + 1; });
    });
    selT.innerHTML = '<option value="">Tất cả</option>'
      + `<option value="bat_ky">⚠️ Thiếu bất kỳ mục nào — ${demBk} SP</option>`
      + _THIEU_TT.map(([k, nhan, roiKho]) =>
          `<option value="${k}">${nhan}${roiKho ? ' (hàng đã rời kho)' : ''} — ${demT[k] || 0} SP</option>`).join('');
    selT.value = cur;
  }
}

// ── THIẾU THÔNG TIN (chủ tiệm 23/10/2026): [trường, nhãn, chỉ xét hàng ĐÃ RỜI KHO] ──
// Ngày xuất / lý do xuất chỉ có nghĩa khi món đã rời kho (đã bán, thất lạc, xuất xưởng…) —
// hàng còn trong kho đương nhiên chưa có, nên không tính là thiếu (tránh 100% hàng tồn bị gắn cờ).
const _THIEU_TT = [
  ['loai_san_pham', 'Chưa phân loại hàng', false],
  ['ki_hieu',       'Chưa có ký hiệu nội bộ', false],
  ['nha_san_xuat',  'Chưa có nhà sản xuất', false],
  ['nha_phan_phoi', 'Chưa có nhà phân phối', false],
  ['ly_do_nhap',    'Chưa có lý do nhập', false],
  ['ngay_nhap',     'Chưa có thời gian nhập', false],
  ['ma_hd_dau_vao', 'Chưa có mã hàng hóa đầu vào', false],
  ['ngay_xuat',     'Chưa có ngày xuất', true],
  ['ly_do_xuat',    'Chưa có lý do xuất', true],
  ['rfid_uid',      'Chưa gắn thẻ RFID', false],
];
function _thieuCua(p) {
  const roiKho = (p.trang_thai || '') !== 'con_hang';
  return _THIEU_TT.filter(([k, , chiRoiKho]) => (!chiRoiKho || roiKho) && !String(p[k] ?? '').trim())
                  .map(([k]) => k);
}
const _ngayNhap = p => String(p.ngay_nhap || '').slice(0, 10);      // 'dd/mm/yyyy'
const _dmyKey = d => { const m = String(d).match(/(\d{2})\/(\d{2})\/(\d{4})/);
                       return m ? +(m[3] + m[2] + m[1]) : 0; };

function _matchFilters(p) {
  const val = id => (document.getElementById(id) || {}).value || '';
  const q = (document.getElementById('search-input').value || '').toLowerCase().trim();
  if (q && !((p.ten||'').toLowerCase().includes(q) ||
             (p.ma_hang||'').toLowerCase().includes(q) ||
             (p.rfid_uid||'').toLowerCase().includes(q) ||
             (p.loai_vang||'').toLowerCase().includes(q) ||
             (p.nha_san_xuat||'').toLowerCase().includes(q))) return false;
  const lv = val('f-loai-vang'); if (lv  && (p.loai_vang||'')     !== lv)  return false;
  const ls = val('f-loc-loai-sp'); if (ls && (p.loai_san_pham||'') !== ls)  return false;
  const ns = val('f-nsx');       if (ns  && (p.nha_san_xuat||'')  !== ns)  return false;
  const nd = val('f-ngay');      if (nd  && _ngayNhap(p)          !== nd)  return false;
  const tem = val('f-tem');
  if (tem === 'chua' && (p.so_lan_in_tem || 0) > 0)   return false;
  if (tem === 'roi'  && (p.so_lan_in_tem || 0) === 0) return false;
  if (tem === 'cu'   && !p.tem_cu) return false;   // tem in xong mới bị sửa dữ liệu → phải in lại
  const th = val('f-thieu');
  if (th) {
    const t = _thieuCua(p);
    if (th === 'bat_ky' ? !t.length : !t.includes(th)) return false;
  }
  return true;
}

// Danh sách chip lọc đang bật (mỗi cái bấm ✕ bỏ riêng). Search cũng thành 1 chip.
function _filterChips() {
  const v = id => (document.getElementById(id) || {}).value || '';
  const temMap = { chua:'🆕 Chưa in tem', roi:'✔️ Đã in tem', cu:'⏰ Tem cũ' };
  const thieuMap = Object.fromEntries(_THIEU_TT.map(([k, nhan]) => [k, '⚠️ ' + nhan]));
  thieuMap.bat_ky = '⚠️ Thiếu thông tin';
  const q = (document.getElementById('search-input') || {}).value || '';
  const out = [];
  if (q.trim())         out.push({ id:'search-input', t:'🔍 "' + q.trim() + '"' });
  if (v('f-loai-vang')) out.push({ id:'f-loai-vang',  t:'💎 ' + v('f-loai-vang') });
  if (v('f-loc-loai-sp')) out.push({ id:'f-loc-loai-sp', t:'📦 ' + v('f-loc-loai-sp') });
  if (v('f-nsx'))       out.push({ id:'f-nsx',        t:'🏭 ' + v('f-nsx') });
  if (v('f-ngay'))      out.push({ id:'f-ngay',       t:'📅 ' + v('f-ngay') });
  if (v('f-tem'))       out.push({ id:'f-tem',        t:temMap[v('f-tem')] || v('f-tem') });
  if (v('f-thieu'))     out.push({ id:'f-thieu',      t:thieuMap[v('f-thieu')] || v('f-thieu') });
  return out;
}
function clearOneFilter(id) {
  const e = document.getElementById(id); if (e) e.value = '';
  filterTable();
}

function filterTable() {
  const list = _allProds.filter(_matchFilters);
  renderTable(list);
  // tô nền vàng cho các ô đang lọc → dễ thấy đang bật cái nào
  ['f-loai-vang','f-loc-loai-sp','f-nsx','f-ngay','f-tem','f-thieu'].forEach(id => {
    const e = document.getElementById(id); if (e) e.classList.toggle('ff-on', !!e.value);
  });
  // hàng chip lọc đang bật
  const esc = s => String(s).replace(/&/g,'&amp;').replace(/</g,'&lt;').replace(/"/g,'&quot;').replace(/'/g,'&#39;');
  const chips = _filterChips();
  const box = document.getElementById('filter-chips');
  if (box) box.innerHTML = chips.map(c =>
      `<span class="f-chip">${esc(c.t)}<button onclick="clearOneFilter('${c.id}')" title="Bỏ lọc này">✕</button></span>`
    ).join('');
  const active = document.getElementById('filter-active');
  if (active) active.classList.toggle('has-filter', chips.length > 0);
  const el = document.getElementById('filter-count');
  if (el) {
    const chuaIn = list.filter(p => !(p.so_lan_in_tem || 0)).length;
    el.textContent = `Hiện ${list.length}/${_allProds.length} SP`
                   + (chuaIn ? ` · ${chuaIn} chưa in tem` : '');
  }
}

function resetFilters() {
  ['search-input','f-loai-vang','f-loc-loai-sp','f-nsx','f-ngay','f-tem','f-thieu']
    .forEach(id => { const e = document.getElementById(id); if (e) e.value = ''; });
  filterTable();
}

// In tem cho HÀNG MỚI UP CHƯA IN LẦN NÀO — theo ĐÚNG THỨ TỰ NHẬP (id tăng dần).
// Trần 200 tem/job của máy in (bartender_client cắt ở 200) → chia mẻ và báo rõ, không cắt âm thầm.
function printNewLabels() {
  // ⛔ BẮT BUỘC chọn "Đợt nhập" trước khi in (chủ tiệm chốt 22/07/2026): quên lọc mà in là
  // dính cả HÀNG CŨ chưa in tem bao giờ (VD 389 SP từ 27/06, 07/07…) → tốn tem + dán nhầm.
  const _ngay = (document.getElementById('f-ngay') || {}).value || '';
  if (!_ngay) {
    const dem = {};
    _allProds.forEach(p => {
      if ((p.trang_thai || '') === 'con_hang' && !(p.so_lan_in_tem || 0)) {
        const d = _ngayNhap(p) || '(không rõ ngày)';
        dem[d] = (dem[d] || 0) + 1;
      }
    });
    const dot = Object.keys(dem).sort((a, b) => _dmyKey(b) - _dmyKey(a));
    if (!dot.length) { alert('Không có sản phẩm nào chưa in tem.'); return; }
    alert('⛔ CHƯA IN GÌ CẢ — chưa chọn "Đợt nhập".\n\n'
        + 'Phải chọn đợt nhập trước, để không in nhầm vào hàng CŨ.\n\n'
        + 'Các đợt đang còn hàng chưa in tem:\n'
        + dot.map((d, i) => `   ${i === 0 ? '👉' : '  '} 📅 ${d}: ${dem[d]} SP`
                          + (i === 0 ? '   ← mới nhất' : '')).join('\n')
        + '\n\n→ Chọn "Đợt nhập" ở thanh 🔎 Lọc rồi bấm lại nút này.');
    return;
  }
  // THEO ĐÚNG BỘ LỌC đang chọn → lọc "Đợt nhập = 22/07" là in ĐÚNG lô vừa up, không dính hàng cũ.
  const lo = _allProds.filter(p => _matchFilters(p)
                && (p.trang_thai || '') === 'con_hang' && !(p.so_lan_in_tem || 0))
    .sort((a, b) => (a.id || 0) - (b.id || 0));     // thứ tự nhập
  if (!lo.length) {
    alert('Không có sản phẩm nào CHƯA IN TEM trong phần đang lọc.\n\n'
        + 'Mẹo: bỏ lọc (↺) để xem toàn bộ, hoặc chọn "Đợt nhập" đúng ngày đã up hàng.');
    return;
  }
  // Gom theo đợt nhập để chủ tiệm thấy RÕ sắp in những lô nào (tránh in nhầm cả hàng cũ)
  const dem = {};
  lo.forEach(p => { const d = _ngayNhap(p) || '(không rõ ngày)'; dem[d] = (dem[d] || 0) + 1; });
  const dot = Object.keys(dem).sort((a, b) => _dmyKey(b) - _dmyKey(a));
  const dau = lo[0].ma_hang || ('#' + lo[0].id);
  const cuoi = lo[lo.length - 1].ma_hang || ('#' + lo[lo.length - 1].id);
  let msg = `In tem cho ${lo.length} sản phẩm CHƯA IN TEM:\n\n`
          + dot.map(d => `   📅 ${d}: ${dem[d]} SP`).join('\n')
          + `\n\nThứ tự in (theo thứ tự nhập): ${dau}  →  ${cuoi}`;
  if (dot.length > 1) {
    msg += `\n\n⚠️ Đang gồm ${dot.length} đợt nhập khác nhau (có cả hàng cũ chưa in tem).`
         + `\nMuốn in ĐÚNG 1 lô: bấm Hủy → chọn "Đợt nhập" ở thanh Lọc rồi bấm lại.`;
  }
  if (!confirm(msg)) return;
  window.open(`/pos/products/print-batch?ids=${lo.map(p => p.id).join(',')}&qty=1`, '_blank');
}

const _ttBadge = tt => {
  if (tt === 'con_hang') return '<span class="bg-green-50 text-green-700 border border-green-200 text-xs px-2 py-0.5 rounded-full font-semibold">Còn hàng</span>';
  if (tt === 'that_lac') return '<span class="bg-orange-50 text-orange-700 border border-orange-200 text-xs px-2 py-0.5 rounded-full font-semibold">Thất lạc</span>';
  if (tt === 'xuat_xuong') return '<span class="bg-amber-50 text-amber-700 border border-amber-200 text-xs px-2 py-0.5 rounded-full font-semibold">🏭 Xuất xưởng</span>';
  return '<span class="bg-gray-100 text-gray-500 border border-gray-200 text-xs px-2 py-0.5 rounded-full font-semibold">Đã bán</span>';
};
const _v = (v, unit='') => (v != null && v !== '') ? (v + (unit ? ' '+unit : '')) : '<span class="text-gray-300">—</span>';
const _vn = (v, unit='') => (v != null && v !== '') ? (fmt(v) + (unit ? unit : '')) : '<span class="text-gray-300">—</span>';

// Thoát HTML MỌI trường chuỗi của sản phẩm trước khi ghép vào innerHTML (15/10/2026): tên/mã/ghi chú do người có
// quyền Sửa tồn kho nhập — trước đây chèn thô → XSS lưu trữ chạy trong phiên Giám đốc mở Tồn kho.
function _escSP(p) {
  const o = {};
  for (const k in p) {
    const v = p[k];
    o[k] = (typeof v === 'string')
      ? v.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;').replace(/'/g, '&#39;')
      : v;
  }
  return o;
}

function renderTable(prods) {
  const tbody = document.getElementById('prod-tbody');
  const empty = document.getElementById('table-empty');
  const count = document.getElementById('table-count');
  if (!prods.length) {
    tbody.innerHTML = '';
    empty.classList.remove('hidden');
    count.textContent = '';
    return;
  }
  empty.classList.add('hidden');
  count.textContent = `Hiển thị ${prods.length} sản phẩm`;

  // Dựng THEO LÔ (đo 29/07/2026: 852 món dựng một mạch làm máy đứng hình 1,7 giây)
  veTheoLo(tbody, prods, _p => {
    const p = _escSP(_p);
    // ── Pre-compute tooltip cho cột Giá bán ────────
    const _gv = findGiaVang(p.loai_vang);
    let _giaBanCell;
    if (p.trang_thai === 'da_ban') {
      // Hàng ĐÃ BÁN → hiện GIÁ THỰC lúc bán (lấy từ hóa đơn), KHÔNG tính realtime.
      // Màu XANH DƯƠNG để phân biệt rõ với giá hàng còn trong kho (nâu/⚡ hoặc đen).
      const _sold = (p.gia_ban_thuc != null) ? p.gia_ban_thuc : p.gia_ban;
      _giaBanCell = `<span style="color:#0284c7;font-weight:700" title="Giá bán THỰC tại thời điểm bán (theo hóa đơn)">${fmtD(_sold)}</span>`
        + `<sup style="opacity:.6;font-size:8px;color:#0284c7" title="Giá lúc bán">🧾</sup>`;
    } else if (p.gia_ban_co_dinh && (p.gia_ban || 0) > 0) {
      // GIÁ CỐ ĐỊNH: bán đúng giá đã khai, KHÔNG chạy theo bảng giá vàng
      _giaBanCell = `<span class="htip"><span style="color:#0369a1;font-weight:700">${fmtD(p.gia_ban)}</span>`
        + `<sup style="opacity:.7;font-size:8px;color:#0284c7" title="Giá cố định">🔒</sup>`
        + `<div class="tip"><strong>🔒 Giá CỐ ĐỊNH</strong><br>Bán đúng ${fmtD(p.gia_ban)}`
        + `<br>KHÔNG đổi theo giá vàng.`
        + (_gv > 0 && p.kl_vang
            ? `<br><span style="color:#94a3b8">Nếu tính tự động: ${fmtD(Math.round(p.kl_vang*_gv+(p.tien_cong||0)+(p.tien_da||0)))}</span>` : '')
        + `</div></span>`;
    } else if (p.kl_vang && _gv > 0) {
      const _fml = Math.round(p.kl_vang * _gv + (p.tien_cong||0) + (p.tien_da||0));
      _giaBanCell = `<span class="htip">`
        + `<span style="color:#92400e;font-weight:700">${fmtD(_fml)}</span>`
        + `<sup style="opacity:.55;font-size:8px;color:#f59e0b" title="Cập nhật theo bảng giá">⚡</sup>`
        + `<div class="tip"><strong>⚡ Giá realtime (công thức)</strong><br>`
        + `KLV: ${p.kl_vang}chỉ × ${fmtD(_gv)} = ${fmtD(Math.round(p.kl_vang*_gv))}`
        + (p.tien_cong ? `<br>+ Công: <strong>${fmtD(p.tien_cong)}</strong>` : '')
        + (p.tien_da   ? `<br>+ Đá: <strong>${fmtD(p.tien_da)}</strong>` : '')
        + `<br><strong style="color:#fde68a">= ${fmtD(_fml)}</strong>`
        + (p.gia_ban && Math.abs(Math.round(p.gia_ban*1000) - _fml*1000) > 5000
           ? `<div style="border-top:1px solid #334155;margin-top:4px;padding-top:4px;color:#fca5a5">Giá lưu: ${fmtD(p.gia_ban)}</div>` : '')
        + `</div></span>`;
    } else {
      _giaBanCell = `${fmtD(p.gia_ban)}`;
    }

    // ── Giá bán hiển thị REALTIME theo bảng giá (nếu có KLV) ────────────
    let _displayPrice;
    if (p.gia_ban_co_dinh && (p.gia_ban || 0) > 0) {
      _displayPrice = p.gia_ban;              // giá cố định → không tính lại theo giá vàng
    } else if (p.kl_vang && _gv > 0) {
      // Tính lại từ giá thị trường hiện tại (k/chỉ) + TC + TĐ (k)
      _displayPrice = Math.round(p.kl_vang * _gv + (p.tien_cong||0) + (p.tien_da||0));
    } else {
      _displayPrice = p.gia_ban;
    }

    // ── Hàng tóm tắt ───────────────────────────────
    const _badges = `${p.rfid_uid ? ' <span title="Có RFID" class="inv-badge-ico" style="color:#3b82f6">📡</span>' : ''}${(p.trang_thai==='con_hang' && !(p.so_lan_in_tem||0)) ? ' <span title="Chưa in tem lần nào" class="inv-badge-ico" style="color:#0284c7">🆕</span>' : ''}${p.tem_cu ? ` <span title="Tem đã in lúc ${p.in_tem_cuoi||''} nhưng dữ liệu bị sửa lúc ${p.updated_at||''} — TEM ĐANG DÁN GHI SỐ CŨ, cần in lại" class="inv-badge-ico" style="color:#dc2626">⏰</span>` : ''}`;
    const _photo = p.anh
      ? `<img src="/static/${p.anh}" class="inv-thumb" loading="lazy" onclick="event.stopPropagation();window.open(this.src,'_blank')" title="Bấm xem ảnh lớn">`
      : `<span class="inv-thumb inv-thumb-empty" title="Chưa có ảnh">💍</span>`;

    const summary = `
    <div class="inv-row" onclick="toggleDetail(${Number(_p.id)})">
      <label class="inv-c-chk" onclick="event.stopPropagation()">
        <input type="checkbox" class="prod-chk rounded accent-amber-500 cursor-pointer" value="${p.id}">
      </label>
      <div class="inv-c-photo">${_photo}</div>
      <div class="inv-c-ma"><span class="inv-ma-code">${p.ma_hang||'—'}</span>${_badges}<span class="inv-expand" id="expand-icon-${p.id}">▶</span></div>
      <div class="inv-c-ten">${p.ten||''}</div>
      <div class="inv-mid">
        <div class="inv-c-loai"><span class="inv-chip-loai" title="Mã khớp hàng: ${p.loai_vang||'—'}">${p.loai_vang_ten||p.loai_vang||'—'}</span></div>
        <div class="inv-c-klt"><span class="inv-lbl-m">KLT</span>${fmtW(p.trong_luong)}</div>
        <div class="inv-c-klv"><span class="inv-lbl-m">KLV</span>${p.kl_vang != null ? fmtW(p.kl_vang) : '—'}</div>
        <div class="inv-c-von"><span class="inv-lbl-m">Vốn</span>${fmtD(p.gia_von)}</div>
        <div class="inv-c-gia" id="price-cell-${p.id}">${_giaBanCell}</div>
      </div>
      <div class="inv-c-tt">${_ttBadge(p.trang_thai)}</div>
      <div class="inv-c-act" onclick="event.stopPropagation()">
        ${_IN_TEM ? `<a href="/pos/products/${p.id}/label" target="_blank" class="tkt-act tkt-amber" title="In tem">🏷️<span class="inv-act-txt"> In</span></a>` : ''}
        ${window._canInventory !== false ? `
        <button onclick="openEdit(${Number(_p.id)})" class="tkt-act tkt-blue" title="Sửa">✏️<span class="inv-act-txt"> Sửa</span></button>
        <button onclick="nhanBanSP(${Number(_p.id)})" class="tkt-act tkt-teal" title="Nhân bản — chép thông tin sang form nhập hàng mới">📄<span class="inv-act-txt"> Nhân bản</span></button>
        ` : ''}
        ${_QUYEN_XOA ? `<button onclick="delProduct(${Number(_p.id)})" class="tkt-act tkt-red" title="Xóa">🗑️<span class="inv-act-txt"> Xóa</span></button>` : ''}
      </div>
    </div>`;

    return summary + `<div id="detail-${p.id}" class="inv-detail hidden"></div>`;
  }, { moiLo: 40, veHet: true });   // veHet: trang nay co "chon het" -> phai dung DU moi dong
}

function _htmlChiTietSP(_p) {
  const p = _escSP(_p);
  const _gv = findGiaVang(p.loai_vang);
  return `
    <div class="grid grid-cols-2 sm:grid-cols-4 gap-x-6 gap-y-2 text-xs">
      ${p.anh ? `
      <div class="col-span-2 sm:col-span-4 flex items-center gap-3 mb-1">
        <img src="/static/${p.anh}"
          class="w-16 h-16 object-cover rounded-xl border-2 border-amber-200 shadow-sm cursor-zoom-in"
          onclick="event.stopPropagation(); window.open(this.src, '_blank')" title="Bấm để xem ảnh lớn">
        <span class="text-[11px] text-gray-400">📷 Ảnh sản phẩm</span>
      </div>` : ''}
      <div class="col-span-2 sm:col-span-4 text-[11px] font-bold text-gray-400 uppercase mb-1">
        Thông số kỹ thuật
      </div>
      <div><span class="text-gray-400">KL Đá:</span> ${_v(p.kl_da ? p.kl_da+' chỉ' : null)}</div>
      <div><span class="text-gray-400">KL Vàng:</span> ${_v(p.kl_vang ? p.kl_vang+' chỉ' : null)}</div>
      <div><span class="text-gray-400">Tiền công:</span> ${_vn(p.tien_cong != null ? p.tien_cong * 1000 : null, 'đ')}</div>
      <div><span class="text-gray-400">Tiền đá:</span> ${_vn(p.tien_da != null ? p.tien_da * 1000 : null, 'đ')}</div>
      <div><span class="text-gray-400">Kí hiệu:</span> ${_v(p.ki_hieu)}</div>
      <div><span class="text-gray-400">TCCS:</span> ${_v(p.tccs)}</div>
      ${(p.kl_vang && _gv > 0) ? `
      <div class="col-span-2 bg-amber-50 rounded-lg px-3 py-1.5 text-amber-800 font-semibold text-[11px]">
        💡 CT: ${p.kl_vang}chỉ × ${fmtD(_gv)} + ${fmtD(p.tien_cong||0)} + ${fmtD(p.tien_da||0)}
        = <span class="text-amber-600">${fmtD(Math.round(p.kl_vang*_gv+(p.tien_cong||0)+(p.tien_da||0)))}</span>
        ${Math.abs(Math.round((p.gia_ban||0)-(p.kl_vang*_gv+(p.tien_cong||0)+(p.tien_da||0)))) > 5
          ? `<span class="ml-2 text-xs font-normal text-gray-500">(nhập: ${fmtD(p.gia_ban)})</span>` : ''}
      </div>` : ''}
      <div class="col-span-2 sm:col-span-4 text-[11px] font-bold text-gray-400 uppercase mt-2 mb-1">
        Nguồn gốc
      </div>
      <div><span class="text-gray-400">NSX:</span> ${_v(p.nha_san_xuat)}</div>
      <div><span class="text-gray-400">ĐC NSX:</span> ${_v(p.dia_chi_nsx)}</div>
      <div><span class="text-gray-400">NPP:</span> ${_v(p.nha_phan_phoi)}</div>
      <div><span class="text-gray-400">ĐC NPP:</span> ${_v(p.dia_chi_npp)}</div>
      <div><span class="text-gray-400">Xuất xứ:</span> ${_v(p.xuat_xu)}</div>
      <div class="col-span-2 sm:col-span-4 text-[11px] font-bold text-gray-400 uppercase mt-2 mb-1">
        Lịch sử nhập / xuất
      </div>
      <div class="col-span-2 sm:col-span-4 bg-green-50 border border-green-100 rounded-xl px-3 py-2 flex flex-wrap gap-x-6 gap-y-1">
        <div class="flex items-center gap-1.5">
          <span class="text-green-600 text-base">📥</span>
          <span class="text-gray-400 text-[11px]">Nhập kho:</span>
          <span class="font-semibold text-green-700">${p.ngay_nhap || '<span class="text-gray-300">—</span>'}</span>
        </div>
        ${p.ly_do_nhap ? `<div class="text-[11px] text-gray-500">Lý do: <span class="font-medium text-gray-700">${p.ly_do_nhap}</span></div>` : ''}
        ${p.ma_hd_dau_vao ? `<div class="text-[11px] text-gray-500">HĐ: <span class="font-mono font-medium text-amber-700">${p.ma_hd_dau_vao}</span></div>` : ''}
        ${p.rfid_uid ? `
        <div class="text-[11px] text-gray-500">
          📡 Tem RFID: <span class="font-mono font-medium text-violet-700">${p.rfid_uid}</span>
          <button onclick="rfTimMon(${Number(p.id)})" class="text-violet-600 hover:underline ml-1 font-semibold">🔍 tìm bằng khay</button>
          <button onclick="rfGoTem(${Number(p.id)})" class="text-red-500 hover:underline ml-1">gỡ tem</button>
        </div>` : ''}
      </div>
      ${p.updated_at ? `
      <div class="col-span-2 sm:col-span-4 bg-blue-50 border border-blue-100 rounded-xl px-3 py-2 flex items-center gap-1.5">
        <span class="text-blue-500 text-base">✏️</span>
        <span class="text-gray-400 text-[11px]">Cập nhật lần cuối:</span>
        <span class="font-semibold text-blue-700">${p.updated_at}</span>
      </div>` : ''}
      ${p.ngay_xuat ? `
      <div class="col-span-2 sm:col-span-4 bg-red-50 border border-red-100 rounded-xl px-3 py-2 flex flex-wrap gap-x-6 gap-y-1">
        <div class="flex items-center gap-1.5">
          <span class="text-red-500 text-base">📤</span>
          <span class="text-gray-400 text-[11px]">Xuất kho:</span>
          <span class="font-semibold text-red-600">${p.ngay_xuat}</span>
        </div>
        ${p.ly_do_xuat ? `<div class="text-[11px] text-gray-500">Lý do: <span class="font-medium text-gray-700">${p.ly_do_xuat}</span></div>` : ''}
      </div>` : `
      <div class="col-span-2 sm:col-span-4 text-[11px] text-gray-400 italic px-1">Chưa xuất kho</div>`}
    </div>`;
}

function toggleDetail(id) {
  const row  = document.getElementById(`detail-${id}`);
  const icon = document.getElementById(`expand-icon-${id}`);
  if (!row) return;
  const hidden = row.classList.toggle('hidden');
  if (!hidden && !row.dataset.loaded) {
    const product = _allProds.find(p => Number(p.id) === Number(id));
    if (product) {
      row.innerHTML = _htmlChiTietSP(product);
      row.dataset.loaded = '1';
    }
  }
  icon.textContent = hidden ? '▶' : '▼';
  icon.classList.toggle('text-amber-500', !hidden);
  icon.classList.toggle('text-gray-300', hidden);
}

// ── Loại sản phẩm ──────────────────────────────────
const LOAI_SP_STORAGE_KEY = 'pos_loai_san_pham';
const LOAI_SP_DEFAULT = [
  'Dây Chuyền','Nhẫn Ép Vỉ','Nhẫn Tròn','Mặt Dây',
  'Nhẫn Nam','Nhẫn Nữ','Nhẫn Đôi','Hoa Tai',
  'Lắc Mềm','Vòng Tay','Kiềng','Quà Tặng',
];

function getLoaiSPList() {
  try {
    const saved = localStorage.getItem(LOAI_SP_STORAGE_KEY);
    return saved ? JSON.parse(saved) : [...LOAI_SP_DEFAULT];
  } catch { return [...LOAI_SP_DEFAULT]; }
}

function saveLoaiSPList(list) {
  localStorage.setItem(LOAI_SP_STORAGE_KEY, JSON.stringify(list));
}

function populateLoaiSP(selectId, currentValue) {
  const el = document.getElementById(selectId);
  if (!el) return;
  const list = getLoaiSPList();
  const allVals = ((currentValue && !list.includes(currentValue)) ? [...list, currentValue] : [...list])
    .sort((a, b) => a.localeCompare(b, 'vi'));
  el.innerHTML = '<option value="">-- Loại sản phẩm --</option>' +
    allVals.map(v => `<option value="${_e(v)}"${v === currentValue ? ' selected' : ''}>${_e(v)}</option>`).join('');
}

function addLoaiSP(selectId) {
  const name = prompt('Nhập tên loại sản phẩm mới:');
  if (!name || !name.trim()) return;
  const trimmed = name.trim();
  const list = getLoaiSPList();
  if (!list.includes(trimmed)) {
    list.push(trimmed);
    saveLoaiSPList(list);
  }
  populateLoaiSP('f-loai-sp');
  populateLoaiSP('edit-loai-sp');
  document.getElementById(selectId).value = trimmed;
}

// Khởi tạo danh sách loại sản phẩm cho cả 2 select
populateLoaiSP('f-loai-sp');
populateLoaiSP('edit-loai-sp');

// ── Ảnh sản phẩm (nén phía client rồi upload sau khi lưu) ──────────────
let _photoBlobAdd = null;          // ảnh chờ upload cho form nhập mới
let _photoBlobEdit = null;         // ảnh mới chọn trong modal sửa
let _editPhotoRemoved = false;     // người dùng bấm xóa ảnh trong modal sửa

function _compressImage(file, cb) {
  const img = new Image();
  img.onload = () => {
    const MAX = 1000;
    let w = img.width, h = img.height;
    if (Math.max(w, h) > MAX) { const k = MAX / Math.max(w, h); w = Math.round(w * k); h = Math.round(h * k); }
    const cv = document.createElement('canvas'); cv.width = w; cv.height = h;
    cv.getContext('2d').drawImage(img, 0, 0, w, h);
    URL.revokeObjectURL(img.src);
    cv.toBlob(b => cb(b), 'image/jpeg', 0.82);
  };
  img.onerror = () => { URL.revokeObjectURL(img.src); alert('Không đọc được file ảnh.'); };
  img.src = URL.createObjectURL(file);
}

function onPhotoPicked(input, mode) {
  const file = input.files && input.files[0];
  input.value = '';
  if (!file) return;
  _compressImage(file, blob => {
    const url = URL.createObjectURL(blob);
    if (mode === 'add') {
      _photoBlobAdd = blob;
      document.getElementById('f-anh-preview').src = url;
      document.getElementById('f-anh-preview-wrap').style.display = 'flex';
    } else {
      _photoBlobEdit = blob; _editPhotoRemoved = false;
      const im = document.getElementById('edit-anh-preview');
      im.src = url; im.classList.remove('hidden');
      document.getElementById('edit-anh-remove').classList.remove('hidden');
    }
  });
}

function clearPhoto(mode) {
  if (mode === 'add') {
    _photoBlobAdd = null;
    document.getElementById('f-anh-preview-wrap').style.display = 'none';
    document.getElementById('f-anh-preview').src = '';
  } else {
    _photoBlobEdit = null; _editPhotoRemoved = true;
    document.getElementById('edit-anh-preview').classList.add('hidden');
    document.getElementById('edit-anh-remove').classList.add('hidden');
  }
}

async function _uploadProductPhoto(pid, blob) {
  const fd = new FormData();
  fd.append('file', blob, 'photo.jpg');
  fd.append('pin', getPin());
  const r = await fetch(`/api/pos/products/${pid}/photo`, { method: 'POST', body: fd });
  return r.json();
}

// ── Thêm sản phẩm ──────────────────────────────────
// ── Cảnh báo TRÙNG MÃ ngay khi rời ô nhập mã hàng (server check mọi trạng thái) ──
// Tự sinh mã hàng NM{YYMMDD}{seq} khi Nhập hàng mới — CHỈ điền khi ô mã đang TRỐNG
// (không đè mã quét mã vạch PNJ / mã người dùng tự gõ). Bấm 📷/⌨️ để quét đè nếu cần.
async function autoFillMaHang() {
  const el = document.getElementById('f-ma');
  if (!el || el.value.trim()) return;   // đã có mã (quét/gõ) → không đè
  try {
    const r = await fetch('/api/pos/gen-ma-hang?prefix=NM');
    const d = await r.json();
    if (d.ma_hang && !el.value.trim()) { el.value = d.ma_hang; _maWarnClear(); }
  } catch (e) {}
}

// ── NHÂN BẢN SẢN PHẨM ───────────────────────────────
// Chép TOÀN BỘ thông tin của 1 sản phẩm sang form "Nhập hàng mới" để làm món giống /
// gần giống. KHÔNG chép: mã hàng (cấp mã NM mới), RFID (mỗi tem là duy nhất), ảnh,
// trạng thái, ngày xuất. Người dùng sửa lại gì tùy ý rồi bấm Lưu.
let _nhanBanCoDinh = 0;      // giữ cờ 🔒 giá cố định của SP gốc để gửi kèm khi lưu

async function nhanBanSP(id) {
  const r = await fetch(`/api/pos/products/${id}`);
  const p = await r.json();
  if (p.error) { alert('Không tìm thấy sản phẩm để nhân bản.'); return; }
  const _toD = v => (v != null && v !== '') ? Math.round(Number(v) * 1000) : '';
  const _set = (elId, val) => { const el = document.getElementById(elId); if (el) el.value = (val ?? ''); };

  _set('f-ma', '');                       // để trống → autoFillMaHang cấp mã NM mới
  _set('f-ten',        p.ten || '');
  _set('f-loai',       p.loai_vang || '');
  _setDonVi('f-don-vi', p.don_vi);
  populateLoaiSP('f-loai-sp', p.loai_san_pham || '');
  _set('f-tl',         p.trong_luong ?? '');
  _set('f-kl-da',      p.kl_da ?? '');
  _set('f-kl-vang',    p.kl_vang ?? '');
  _set('f-tien-cong',  _toD(p.tien_cong));
  _set('f-tien-da',    _toD(p.tien_da));
  _set('f-von',        formatSplitAmt(_toD(p.gia_von)));
  _set('f-ban',        formatSplitAmt(_toD(p.gia_ban)));
  _set('f-ki-hieu',    p.ki_hieu || '');
  _set('f-tccs',       p.tccs || '');
  populateMfSelect('f-nha-sx', 'nsx', p.nha_san_xuat || '');
  _set('f-dc-nsx',     p.dia_chi_nsx || '');
  populateMfSelect('f-nha-pp', 'npp', p.nha_phan_phoi || '');
  _set('f-dc-npp',     p.dia_chi_npp || '');
  _set('f-xuat-xu',    p.xuat_xu || 'Việt Nam');
  _set('f-ly-do-nhap', p.ly_do_nhap || '');
  _set('f-ma-hd',      p.ma_hd_dau_vao || '');
  _set('f-rfid',       '');               // tem RFID là DUY NHẤT — không nhân bản
  fpSet('f-ngay-nhap', nowInputDt());     // món mới nhập hôm nay
  clearPhoto('add');                      // ảnh không chép — chụp lại nếu cần

  // Giá: SP gốc khai giá CỐ ĐỊNH 🔒 → mở ở Thủ công (giữ đúng số); còn lại → CT tự động
  _nhanBanCoDinh = (p.gia_ban_co_dinh && (p.gia_ban || 0) > 0) ? 1 : 0;
  setPriceMode(_nhanBanCoDinh ? 'manual' : 'formula');
  calcKLVang();
  // Gỡ khóa "readonly đến khi chạm" cho các ô vừa điền. Khóa đó (hook harden ở base.html)
  // chỉ để chặn trình duyệt tự điền vào ô TRỐNG — ô đã có sẵn số thì không còn lý do khóa,
  // và người dùng cần sửa được ngay. KHÔNG đụng f-kl-vang (readonly cố ý, tự tính) và
  // f-ngay-nhap (flatpickr buộc chọn lịch).
  ['f-ten','f-loai','f-tl','f-kl-da','f-tien-cong','f-tien-da','f-von','f-ban',
   'f-ki-hieu','f-tccs','f-dc-nsx','f-dc-npp','f-xuat-xu','f-ly-do-nhap','f-ma-hd','f-ma']
    .forEach(id => { const el = document.getElementById(id); if (el) el.removeAttribute('readonly'); });
  _maWarnClear();
  await autoFillMaHang();                 // cấp mã NM mới cho bản sao

  // Băng báo + cuộn lên form
  const bn = document.getElementById('nhan-ban-banner');
  document.getElementById('nhan-ban-nguon').textContent =
    `${p.ma_hang || '(không mã)'} — ${p.ten || ''}`;
  bn.classList.remove('hidden');
  bn.style.display = 'flex';
  document.getElementById('add-msg').textContent = '';
  document.getElementById('add-product-form').scrollIntoView({ behavior: 'smooth', block: 'start' });
  setTimeout(() => document.getElementById('f-ten')?.focus(), 350);
}

function huyNhanBan() {
  const bn = document.getElementById('nhan-ban-banner');
  bn.classList.add('hidden');
  bn.style.display = 'none';
  _nhanBanCoDinh = 0;
  const el = document.getElementById('f-so-ban-sao'); if (el) el.value = '1';
}

let _maTrung = false;
function _maWarnClear() {
  _maTrung = false;
  const w = document.getElementById('f-ma-warn');
  w.classList.add('hidden');
  document.getElementById('f-ma').style.borderColor = '';
}
async function checkMaTrung() {
  const el = document.getElementById('f-ma');
  const ma = el.value.trim();
  if (!ma) { _maWarnClear(); return; }
  try {
    const r = await fetch('/api/pos/products/check-ma?ma=' + encodeURIComponent(ma));
    const d = await r.json();
    const w = document.getElementById('f-ma-warn');
    if (d.exists) {
      _maTrung = true;
      w.textContent = `⚠️ Mã "${ma}" ĐÃ CÓ trong kho: ${d.ten} (${d.trang_thai}) — đổi mã khác hoặc để trống để tự cấp mã.`;
      w.classList.remove('hidden');
      el.style.borderColor = '#dc2626';
    } else {
      _maWarnClear();
    }
  } catch (e) {}
}

// Quy định nghiệp vụ (Thiết lập → Quy định): 'chan' = chặn ngay ở trình duyệt; 'canh_bao' =
// để máy chủ hỏi xác nhận (409). Không tải được cấu hình → coi mọi mã là 'chan' cho an toàn.
window._QD = null;
fetch('/api/quy-dinh', {cache: 'no-store'}).then(r => r.json())
  .then(d => { window._QD = (d && d.success && d.cau_hinh) ? d.cau_hinh : null; })
  .catch(() => { window._QD = null; });
function _qdChan(ma) { return !window._QD || window._QD[ma] !== 'canh_bao'; }

async function addProduct() {
  const msg = document.getElementById('add-msg');
  const ten = document.getElementById('f-ten').value.trim();
  if (!ten) { msg.textContent='⚠️ Vui lòng nhập tên sản phẩm.'; msg.className='text-sm text-amber-600'; return; }
  // Chặn lưu khi mã đang trùng (kiểm tra lại lần cuối cho chắc — server vẫn chặn tầng 2)
  const maNhap = document.getElementById('f-ma').value.trim();
  if (maNhap) {
    await checkMaTrung();
    if (_maTrung) { msg.textContent='❌ Mã hàng đang TRÙNG với sản phẩm trong kho — xem cảnh báo đỏ ở ô mã.'; msg.className='text-sm text-red-600 font-semibold'; return; }
  }
  // Các trường giá nhập theo đồng → chia 1000 để lưu theo k (đơn vị DB)
  const _fD = id => { const v = (document.getElementById(id)?.value || '').replace(/\./g, ''); return v ? parseFloat(v)/1000 : null; };
  // Giá vốn BẮT BUỘC — không cho tạo sản phẩm nếu để trống / = 0
  // Quy định 'sp_thieu_gia_von' ở chế độ CẢNH BÁO → không chặn ở đây, máy chủ hỏi xác nhận (409).
  const _vonNhap = _fD('f-von');
  if ((!_vonNhap || _vonNhap <= 0) && _qdChan('sp_thieu_gia_von')) {
    msg.textContent = '⚠️ Vui lòng nhập Giá vốn (bắt buộc, lớn hơn 0) trước khi thêm sản phẩm.';
    msg.className = 'text-sm text-red-600 font-semibold';
    document.getElementById('f-von')?.focus();
    return;
  }
  const body = {
    pin: getPin(), ten,
    ma_hang:       document.getElementById('f-ma').value.trim() || null,
    loai_vang:     document.getElementById('f-loai').value.trim() || null,
    don_vi:        document.getElementById('f-don-vi').value || 'Chỉ',
    loai_san_pham: document.getElementById('f-loai-sp').value || null,
    so_luong:      1,
    trong_luong:   document.getElementById('f-tl').value || null,
    gia_von:       _fD('f-von'),
    gia_ban:       _fD('f-ban'),
    kl_da:         document.getElementById('f-kl-da').value || null,
    kl_vang:       document.getElementById('f-kl-vang').value || null,
    tien_cong:     _fD('f-tien-cong'),
    tien_da:       _fD('f-tien-da'),
    ki_hieu:       document.getElementById('f-ki-hieu').value.trim() || null,
    tccs:          document.getElementById('f-tccs').value.trim()    || null,
    nha_san_xuat:  document.getElementById('f-nha-sx').value.trim()  || null,
    dia_chi_nsx:   document.getElementById('f-dc-nsx').value.trim()  || null,
    nha_phan_phoi: document.getElementById('f-nha-pp').value.trim()  || null,
    dia_chi_npp:   document.getElementById('f-dc-npp').value.trim()  || null,
    xuat_xu:       document.getElementById('f-xuat-xu').value.trim() || null,
    ly_do_nhap:    document.getElementById('f-ly-do-nhap').value.trim() || null,
    ngay_nhap:     dtFromInput(document.getElementById('f-ngay-nhap').value) || null,
    ma_hd_dau_vao: document.getElementById('f-ma-hd').value.trim() || null,
    rfid_uid:      document.getElementById('f-rfid').value.trim() || null,
    // Cờ 🔒 giá cố định: chỉ giữ khi nhân bản từ SP giá cố định VÀ vẫn đang ở chế độ Thủ công
    gia_ban_co_dinh: (_nhanBanCoDinh && _priceMode === 'manual') ? 1 : 0,
  };
  // Số bản sao — tạo nhiều món GIỐNG NHAU trong 1 lần bấm (mỗi món 1 mã riêng)
  const soBan = Math.max(1, Math.min(50,
    parseInt(document.getElementById('f-so-ban-sao')?.value || '1', 10) || 1));

  const r = await fetch('/api/pos/products', {
    method:'POST', headers:{'Content-Type':'application/json'}, body: JSON.stringify(body)
  });
  const d = await r.json();

  // Bản 1 xong → tạo nốt các bản còn lại. Làm TUẦN TỰ vì mã NM cấp theo số lớn nhất
  // đang có trong kho — chạy song song sẽ ra trùng mã.
  let _daTao = d.success ? 1 : 0;
  const _loiBanSao = [];
  if (d.success && soBan > 1) {
    for (let i = 2; i <= soBan; i++) {
      msg.textContent = `⏳ Đang tạo ${soBan} món giống nhau... (${_daTao}/${soBan})`;
      msg.className = 'text-sm text-gray-500';
      let maMoi = null;
      try {
        const rg = await fetch('/api/pos/gen-ma-hang?prefix=NM');
        maMoi = (await rg.json()).ma_hang || null;
      } catch (e) {}
      try {
        const r2 = await fetch('/api/pos/products', {
          method:'POST', headers:{'Content-Type':'application/json'},
          body: JSON.stringify({ ...body, ma_hang: maMoi })
        });
        const d2 = await r2.json();
        if (d2.success) {
          _daTao++;
          try {
            _allProds.unshift({ id: d2.id, ...body, ma_hang: maMoi, trang_thai: 'con_hang',
              trong_luong: parseFloat(body.trong_luong) || body.trong_luong, so_luong: 1 });
          } catch (e) {}
        } else {
          _loiBanSao.push(`bản ${i}: ${d2.message || d2.error || 'lỗi'}`);
        }
      } catch (e) {
        _loiBanSao.push(`bản ${i}: mất kết nối`);
      }
    }
  }

  if (d.success) {
    msg.textContent = _daTao > 1
      ? `✅ Đã thêm ${_daTao} món giống nhau vào kho.`
        + (_loiBanSao.length ? ` ⚠️ ${_loiBanSao.length} bản KHÔNG tạo được: ${_loiBanSao.join('; ')}` : '')
      : '✅ Đã thêm sản phẩm vào kho.';
    msg.className='text-sm text-green-600 font-semibold';
    // HIỆN NGAY sản phẩm mới lên ĐẦU bảng (không chờ tải lại 500+ SP) — dữ liệu
    // chuẩn sẽ được loadProducts() đồng bộ lại ngay sau ở chế độ nền.
    try {
      _allProds.unshift({ id: d.id, ...body, trang_thai: 'con_hang',
        trong_luong: parseFloat(body.trong_luong) || body.trong_luong,
        so_luong: 1 });
      // Xóa ô tìm kiếm — đang có chữ tìm cũ thì SP mới bị lọc mất, nhìn như "chưa vào kho"
      const si = document.getElementById('search-input');
      if (si && si.value) si.value = '';
      filterTable();
    } catch (e) {}
    // Upload ảnh sản phẩm CHẠY NỀN (không bắt người dùng chờ ảnh xong mới nhập món kế)
    if (_photoBlobAdd && d.id) {
      const blob = _photoBlobAdd;
      clearPhoto('add');
      _uploadProductPhoto(d.id, blob).then(pr => {
        if (!pr.success) { msg.textContent += ' ⚠️ Ảnh chưa lưu được: ' + (pr.error || ''); }
      }).catch(() => { msg.textContent += ' ⚠️ Ảnh chưa lưu được.'; });
    }
    // Nút In tem ngay
    const btnPrint = document.getElementById('btn-print-new');   // null với nhân viên (nút đã ẩn)
    if (d.id && btnPrint) {
      btnPrint.href = `/pos/products/${d.id}/label`;
      btnPrint.classList.remove('hidden');
      setTimeout(() => btnPrint.classList.add('hidden'), 15000);
    }
    ['f-ma','f-ten','f-loai','f-tl','f-von','f-ban',
     'f-kl-da','f-kl-vang','f-tien-cong','f-tien-da','f-ki-hieu','f-tccs',
     'f-dc-nsx','f-dc-npp','f-ly-do-nhap','f-ma-hd','f-rfid','f-so-luong'].forEach(id=>{
       const el=document.getElementById(id); if(el) el.value='';
     });
    fpSet('f-ngay-nhap', nowInputDt());
    _maWarnClear();   // xóa cảnh báo trùng mã của lần nhập trước
    const elDV = document.getElementById('f-don-vi'); if(elDV) elDV.value='Chỉ';   // 'Chỉ' VIẾT HOA (chuẩn 13/07)
    const elLSP = document.getElementById('f-loai-sp'); if(elLSP) elLSP.value='';
    // Ô 'f-so-luong' KHÔNG có trong trang này — gán thẳng sẽ ném TypeError và chặn
    // toàn bộ phần reset phía dưới (mã mới không được cấp, danh sách không tải lại).
    const elSL = document.getElementById('f-so-luong'); if(elSL) elSL.value = '1';
    huyNhanBan();   // tắt băng nhân bản + đưa Số bản về 1 cho món kế tiếp
    // GIỮ NGUYÊN nhà sản xuất / nhà phân phối đã chọn (nhập liên tiếp cùng nhà cung cấp cho
    // NHANH) và ĐỒNG BỘ LẠI Địa chỉ + TCCS theo NSX/NPP đang giữ — vì ở trên vừa xóa trắng
    // f-tccs/f-dc-nsx/f-dc-npp, gọi lại onNSXChange/onNPPChange để điền đúng theo lựa chọn hiện
    // tại. Khi đổi NSX/NPP cho món sau, onchange tự cập nhật Địa chỉ/TCCS theo. (Trước đây select
    // bị xóa trắng sau mỗi lần thêm → phải chọn lại NSX/NPP mới có Địa chỉ/TCCS — yêu cầu sửa 19/07.)
    onNSXChange('add');
    onNPPChange('add');
    document.getElementById('f-xuat-xu').value = 'Việt Nam';
    document.getElementById('price-calc-hint').classList.add('hidden');
    setPriceMode('formula');   // luôn quay về CT tự động cho món kế tiếp
    autoFillMaHang();          // tự sinh mã mới NM{YYMMDD}{seq} cho món kế tiếp
    loadProducts(); loadSummary(); loadNameSuggestions();
  } else {
    msg.textContent = '❌ ' + (d.message || (d.error==='wrong_pin' ? 'Sai mã PIN' : d.error));
    msg.className='text-sm text-red-600 font-semibold';
  }
}

// ── Import Excel ────────────────────────────────────
async function importExcel() {
  const msg  = document.getElementById('import-msg');
  const file = document.getElementById('import-file').files[0];
  if (!file) { msg.textContent='⚠️ Chọn file .xlsx trước'; msg.className='text-sm text-amber-600'; return; }
  const pin = getPin();
  if (!pin) { msg.textContent='⚠️ Nhập mã PIN trước'; msg.className='text-sm text-amber-600'; return; }
  msg.textContent='⏳ Đang import...'; msg.className='text-sm text-gray-400';
  const fd = new FormData();
  fd.append('file', file);
  fd.append('pin', pin);
  try {
    const r = await fetch('/api/pos/products/import', { method:'POST', body: fd });
    const d = await r.json();
    if (d.success) {
      const parts = [];
      if (d.imported) parts.push(`thêm mới ${d.imported}`);
      if (d.updated)  parts.push(`cập nhật đè ${d.updated} (theo mã hàng có sẵn)`);
      let html = `✅ Import xong: ${parts.join(' + ') || '0'} / ${d.total_rows} dòng.`;
      if (d.errors?.length) {
        html += `<div class="mt-1 text-red-600 font-normal">⚠️ ${d.errors.length} dòng lỗi:</div>`
          + `<ul class="mt-0.5 text-xs text-red-500 font-normal list-disc pl-5">`
          + d.errors.slice(0, 8).map(e => `<li>${_e(e)}</li>`).join('')
          + (d.errors.length > 8 ? `<li>... và ${d.errors.length - 8} lỗi nữa (xem console)</li>` : '')
          + `</ul>`;
        console.warn('Import lỗi:', d.errors);
      }
      msg.innerHTML = html;
      msg.className='text-sm text-green-600 font-semibold';
      document.getElementById('import-file').value = '';
      loadProducts(); loadSummary();
    } else {
      msg.textContent = d.error==='wrong_pin' ? '❌ Sai mã PIN' : `❌ ${d.error}`;
      msg.className='text-sm text-red-600 font-semibold';
    }
  } catch(e) {
    msg.textContent='❌ Lỗi kết nối'; msg.className='text-sm text-red-600 font-semibold';
  }
}

// ── Xóa sản phẩm ───────────────────────────────────
async function delProduct(id, force) {
  if (!force && !confirm('Xóa sản phẩm này khỏi kho?')) return;
  const r = await fetch(`/api/pos/products/${id}`, {
    method:'DELETE', headers:{'Content-Type':'application/json'},
    body: JSON.stringify({pin: getPin(), force: !!force})
  });
  const d = await r.json();
  if (d.success) { loadProducts(); loadSummary(); return; }
  // ⚠️ SP đã in tem: tem giấy có thể đang dán trên hàng → hỏi lại lần 2 rồi mới xóa
  if (d.error === 'da_in_tem') {
    if (confirm(d.message + '\n\nĐã bóc tem khỏi món hàng chưa? Bấm OK để XÓA HẲN.')) {
      delProduct(id, true);
    }
    return;
  }
  alert(d.message || (d.error==='wrong_pin' ? 'Sai mã PIN' : 'Lỗi: '+d.error));
}

// ── Modal chỉnh sửa ─────────────────────────────────
async function openEdit(id) {
  const r = await fetch(`/api/pos/products/${id}`);
  const p = await r.json();
  if (p.error) { alert('Không tìm thấy sản phẩm'); return; }
  // Giá trong DB lưu k → hiển thị đồng (×1000)
  const _toD = v => (v != null && v !== '') ? Math.round(Number(v) * 1000) : '';
  document.getElementById('edit-id').value         = p.id;
  document.getElementById('edit-ma').value          = p.ma_hang || '';
  document.getElementById('edit-ten').value         = p.ten || '';
  document.getElementById('edit-loai').value        = p.loai_vang || '';
  _setDonVi('edit-don-vi', p.don_vi);
  populateLoaiSP('edit-loai-sp', p.loai_san_pham || '');
  document.getElementById('edit-so-luong').value    = p.so_luong ?? '';
  document.getElementById('edit-tl').value          = p.trong_luong ?? '';
  document.getElementById('edit-kl-da').value       = p.kl_da ?? '';
  document.getElementById('edit-kl-vang').value     = p.kl_vang ?? '';
  document.getElementById('edit-ki-hieu').value     = p.ki_hieu || '';
  document.getElementById('edit-tccs').value        = p.tccs || '';
  document.getElementById('edit-tien-cong').value   = _toD(p.tien_cong);
  document.getElementById('edit-tien-da').value     = _toD(p.tien_da);
  document.getElementById('edit-von').value         = formatSplitAmt(_toD(p.gia_von));
  document.getElementById('edit-ban').value         = formatSplitAmt(_toD(p.gia_ban));
  document.getElementById('edit-gia-co-dinh').checked = !!p.gia_ban_co_dinh;
  // NSX/NPP: populate chọn và tự điền địa chỉ
  populateMfSelect('edit-nha-sx', 'nsx', p.nha_san_xuat || '');
  document.getElementById('edit-dc-nsx').value      = p.dia_chi_nsx || '';
  populateMfSelect('edit-nha-pp', 'npp', p.nha_phan_phoi || '');
  document.getElementById('edit-dc-npp').value      = p.dia_chi_npp || '';
  document.getElementById('edit-xuat-xu').value     = p.xuat_xu || '';
  document.getElementById('edit-tt').value          = p.trang_thai || 'con_hang';
  document.getElementById('edit-ngay-xuat').value   = p.ngay_xuat || '';
  document.getElementById('edit-ly-do-nhap').value  = p.ly_do_nhap || '';
  fpSet('edit-ngay-nhap', dtToInput(p.ngay_nhap));
  document.getElementById('edit-ly-do-xuat').value  = p.ly_do_xuat || '';
  document.getElementById('edit-ma-hd').value       = p.ma_hd_dau_vao || '';
  document.getElementById('edit-rfid').value        = p.rfid_uid || '';
  document.getElementById('edit-msg').textContent   = '';
  document.getElementById('edit-calc-hint').classList.add('hidden');
  const _epb = document.getElementById('edit-print-btn');       // null với nhân viên
  if (_epb) _epb.href = `/pos/products/${p.id}/label`;
  // Ảnh sản phẩm hiện tại
  _photoBlobEdit = null; _editPhotoRemoved = false;
  const _im = document.getElementById('edit-anh-preview');
  if (p.anh) {
    _im.src = `/static/${p.anh}`; _im.classList.remove('hidden');
    document.getElementById('edit-anh-remove').classList.remove('hidden');
  } else {
    _im.classList.add('hidden'); _im.src = '';
    document.getElementById('edit-anh-remove').classList.add('hidden');
  }
  // Chế độ giá khi mở modal: SP giá CỐ ĐỊNH 🔒 (có khai giá bán riêng) → Thủ công;
  // còn lại (giá bán để trống/0 → bán theo bảng giá vàng) → CT TỰ ĐỘNG.
  setPriceModeEdit((p.gia_ban_co_dinh && (p.gia_ban || 0) > 0) ? 'manual' : 'formula');
  // Tính lại KLV từ tl và kl_da đã load
  calcKLVangEdit();
  document.getElementById('edit-modal').classList.remove('hidden');
}

function closeEdit() {
  document.getElementById('edit-modal').classList.add('hidden');
}

async function saveEdit() { await _doSaveEdit(getPin()); }

async function _doSaveEdit(pin) {
  const msg  = document.getElementById('edit-msg');
  const id   = document.getElementById('edit-id').value;
  // Giá trong modal là đồng → chia 1000 về k để lưu DB
  const _eD = id => { const v = (document.getElementById(id)?.value || '').replace(/\./g, ''); return v ? parseFloat(v)/1000 : null; };
  const body = {
    pin:           pin,
    ma_hang:       document.getElementById('edit-ma').value.trim() || null,
    ten:           document.getElementById('edit-ten').value.trim(),
    loai_vang:     document.getElementById('edit-loai').value.trim() || null,
    don_vi:        document.getElementById('edit-don-vi').value || null,
    loai_san_pham: document.getElementById('edit-loai-sp').value || null,
    so_luong:      document.getElementById('edit-so-luong').value || null,
    trong_luong:   document.getElementById('edit-tl').value || null,
    kl_da:         document.getElementById('edit-kl-da').value || null,
    kl_vang:       document.getElementById('edit-kl-vang').value || null,
    ki_hieu:       document.getElementById('edit-ki-hieu').value.trim() || null,
    tccs:          document.getElementById('edit-tccs').value.trim()    || null,
    tien_cong:     _eD('edit-tien-cong'),
    tien_da:       _eD('edit-tien-da'),
    gia_von:       _eD('edit-von'),
    gia_ban:       _eD('edit-ban'),
    gia_ban_co_dinh: document.getElementById('edit-gia-co-dinh').checked ? 1 : 0,
    nha_san_xuat:  document.getElementById('edit-nha-sx').value.trim()  || null,
    dia_chi_nsx:   document.getElementById('edit-dc-nsx').value.trim()  || null,
    nha_phan_phoi: document.getElementById('edit-nha-pp').value.trim()  || null,
    dia_chi_npp:   document.getElementById('edit-dc-npp').value.trim()  || null,
    xuat_xu:       document.getElementById('edit-xuat-xu').value.trim() || null,
    trang_thai:    document.getElementById('edit-tt').value,
    ngay_xuat:     document.getElementById('edit-ngay-xuat').value || null,
    ly_do_nhap:    document.getElementById('edit-ly-do-nhap').value.trim() || null,
    ngay_nhap:     dtFromInput(document.getElementById('edit-ngay-nhap').value) || null,
    ly_do_xuat:    document.getElementById('edit-ly-do-xuat').value.trim() || null,
    ma_hd_dau_vao: document.getElementById('edit-ma-hd').value.trim() || null,
    rfid_uid:      document.getElementById('edit-rfid').value.trim() || null,
  };
  msg.textContent='⏳ Đang lưu...'; msg.className='text-sm text-gray-400';
  const r = await fetch(`/api/pos/products/${id}`, {
    method:'PUT', headers:{'Content-Type':'application/json'}, body: JSON.stringify(body)
  });
  const d = await r.json();
  if (d.success) {
    // Ảnh: upload ảnh mới hoặc xóa ảnh nếu người dùng bấm xóa
    try {
      if (_photoBlobEdit) {
        await _uploadProductPhoto(id, _photoBlobEdit);
      } else if (_editPhotoRemoved) {
        await fetch(`/api/pos/products/${id}/photo`, {
          method: 'DELETE', headers: {'Content-Type':'application/json'},
          body: JSON.stringify({ pin: pin })
        });
      }
    } catch (e) { /* ảnh lỗi không chặn việc lưu thông tin */ }
    msg.textContent='✅ Đã lưu.'; msg.className='text-sm text-green-600 font-semibold';
    loadProducts(); loadSummary();
    setTimeout(closeEdit, 700);
  } else if (d.error === 'wrong_pin' && !pin) {
    // SP đã rời kho (đã bán / xuất xưởng) → sửa thông tin tem cần PIN Giám đốc.
    // Ô PIN đang trống → nhắc nhập PIN rồi lưu lại (đỡ báo lỗi khó hiểu).
    msg.textContent = '';
    askPin('Sản phẩm đã rời kho — nhập PIN Giám đốc để lưu thông tin tem', (p) => {
      if (!p) return;
      document.getElementById('pin-input').value = p;   // để thao tác ảnh sau đó cũng dùng được
      _doSaveEdit(p);
    });
  } else {
    msg.textContent = '❌ ' + (d.message || (
      d.error === 'wrong_pin' ? 'Sai mã PIN' :
      d.error === 'forbidden_role' ? 'Cần quyền Giám đốc/Phó Giám đốc để sửa sản phẩm đã rời kho' :
      d.error));
    msg.className='text-sm text-red-600 font-semibold';
  }
}

// ── Checkbox và in tem hàng loạt ───────────────────
// ── XÓA NHIỀU SẢN PHẨM (15/10/2026) ─────────────────────────────────────────
// Máy chủ quyết định món nào xóa được (quyền + chi nhánh + trạng thái + chứng từ tham chiếu). Trình duyệt chỉ
// hiển thị kết quả kiểm tra rồi gửi ĐÚNG danh sách đủ điều kiện + số lượng đã xác nhận; máy chủ kiểm lại trong
// cùng giao dịch xóa (lệch là không xóa món nào).
function _hx(s) { return String(s ?? '').replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;').replace(/'/g, '&#39;'); }
function capNhatSoDaChon() {
  const n = document.querySelectorAll('.prod-chk:checked').length;
  const w = document.getElementById('so-da-chon');
  if (!w) return;
  document.getElementById('so-da-chon-n').textContent = n;
  w.classList.toggle('hidden', n === 0);
}
document.addEventListener('change', e => {
  if (e.target && (e.target.classList.contains('prod-chk') || e.target.id === 'chk-all')) capNhatSoDaChon();
});
let _xoaDuDK = [];
function dongXoaModal() { document.getElementById('xoa-modal').classList.add('hidden'); }
async function xoaSanPhamDaChon() {
  const ids = [...document.querySelectorAll('.prod-chk:checked')].map(c => parseInt(c.value));
  if (!ids.length) { alert('⚠️ Chưa chọn sản phẩm nào.\n\nTick vào ô vuông ở các món cần xóa rồi bấm lại.'); return; }
  let d;
  try {
    const r = await fetch('/api/pos/products/xoa-nhieu/kiem-tra', {method: 'POST',
      headers: {'Content-Type': 'application/json'}, body: JSON.stringify({ids})});
    d = await r.json();
  } catch (e) { alert('❌ Không kiểm tra được: ' + e); return; }
  if (!d.success) { alert('❌ ' + (d.message || d.error || 'Không kiểm tra được')); return; }
  _xoaDuDK = d.du_dieu_kien || [];
  const du = (d.ds || []).filter(x => x.ok), khong = d.khong_du || [];
  let h = `<div>Đã chọn <b>${ids.length}</b> sản phẩm — <b class="text-red-700">${du.length}</b> xóa được`
        + (khong.length ? `, <b class="text-amber-700">${khong.length}</b> KHÔNG xóa được (giữ nguyên)` : '') + '.</div>';
  if (du.length) {
    h += '<div class="max-h-40 overflow-y-auto border rounded-lg p-2 bg-red-50 text-xs space-y-0.5">'
       + du.map(x => `<div>🗑️ <b>${_hx(x.ma_hang)}</b> · ${_hx(x.ten)} · ${_hx(x.loai_vang)}${x.trong_luong != null ? ' · ' + _hx(x.trong_luong) : ''}${x.so_tem ? ' · <span class="text-red-700 font-bold">đã in tem ' + _hx(x.so_tem) + ' lần</span>' : ''}${x.co_rfid ? ' · 📡 có RFID' : ''}</div>`).join('')
       + '</div>';
  }
  if (khong.length) {
    h += '<div class="max-h-40 overflow-y-auto border rounded-lg p-2 bg-amber-50 text-xs space-y-0.5">'
       + khong.map(x => `<div>⛔ <b>${_hx(x.ma_hang || ('#' + x.id))}</b>: ${_hx(x.ly_do)}</div>`).join('')
       + '</div>';
  }
  if (du.length) {
    h += '<div class="text-xs text-gray-600"><b>Hậu quả:</b> các món trên biến khỏi Tồn kho, bán hàng và in tem. '
       + 'Hóa đơn, sổ quỹ, phiếu mua, kiểm kho KHÔNG bị đụng (món có chứng từ đã bị loại ở trên). '
       + 'Giám đốc / Phó GĐ khôi phục được cả lô ở trang <b>Khôi phục xóa</b>. Mọi lần xóa đều ghi nhật ký.</div>';
  }
  document.getElementById('xoa-noi-dung').innerHTML = h;
  const temWrap = document.getElementById('xoa-tem-wrap');
  document.getElementById('xoa-tem-ok').checked = false;
  temWrap.classList.toggle('hidden', !d.so_da_in_tem);
  document.getElementById('xoa-tem-txt').textContent = d.so_da_in_tem
    ? `${d.so_da_in_tem} món ĐÃ IN TEM — tôi đã bóc tem khỏi món hàng (không thì kiểm kho sẽ quét ra MÃ LẠ).` : '';
  const btn = document.getElementById('xoa-xac-nhan');
  btn.textContent = du.length ? `Xóa ${du.length} sản phẩm` : 'Không có món nào xóa được';
  btn.disabled = !du.length;
  document.getElementById('xoa-msg').textContent = '';
  document.getElementById('xoa-modal').classList.remove('hidden');
}
async function xacNhanXoa() {
  if (!_xoaDuDK.length) return;
  const tem = !document.getElementById('xoa-tem-wrap').classList.contains('hidden');
  if (tem && !document.getElementById('xoa-tem-ok').checked) {
    document.getElementById('xoa-msg').innerHTML = '<span class="text-red-700 font-bold">Tick xác nhận đã bóc tem trước.</span>';
    return;
  }
  const btn = document.getElementById('xoa-xac-nhan');
  btn.disabled = true;
  let d;
  try {
    const r = await fetch('/api/pos/products/xoa-nhieu', {method: 'POST', headers: {'Content-Type': 'application/json'},
      body: JSON.stringify({ids: _xoaDuDK, so_luong: _xoaDuDK.length, xac_nhan_da_in_tem: tem})});
    d = await r.json();
  } catch (e) { d = {success: false, message: String(e)}; }
  if (!d.success) {
    btn.disabled = false;
    const ct = (d.khong_du || []).map(x => '⛔ ' + (x.ma_hang || ('#' + x.id)) + ': ' + x.ly_do).join('\n');
    alert('❌ ' + (d.message || d.error || 'Không xóa được') + (ct ? '\n\n' + ct : ''));
    return;
  }
  dongXoaModal();
  alert(`✅ Đã xóa ${d.so_luong} sản phẩm (lô ${d.lo}).\nKhôi phục: trang Khôi phục xóa (Giám đốc / Phó GĐ).`);
  document.querySelectorAll('.prod-chk:checked').forEach(c => c.checked = false);
  const ca = document.getElementById('chk-all'); if (ca) ca.checked = false;
  await loadProducts();
  capNhatSoDaChon();
}

function toggleCheckAll(checked) {
  document.querySelectorAll('.prod-chk').forEach(c => c.checked = checked);
}

// Cờ quyền bơm từ máy chủ: true = Giám đốc/Phó GĐ (được in tem, gán RFID, xem báo cáo)
const _XEM_TONG = {{ 'true' if xem_tong else 'false' }};
const _IN_TEM = {{ 'true' if quyen_in_tem == 'in' else 'false' }};
const _QUYEN_XOA = {{ 'true' if quyen_xoa else 'false' }};   // quyền Xóa sản phẩm (B1) — máy chủ vẫn kiểm lại   // quyền In tem (Sửa / In tem)

// ── NHÂN VIÊN: xin duyệt in tem cho các món đang tick chọn ────────────────
// Nhân viên KHÔNG có nút in tem. Tick chọn món rồi bấm nút này → Giám đốc/Phó GĐ
// duyệt ở trang "Duyệt yêu cầu" → in được ĐÚNG lô đó, ĐÚNG 1 LẦN.
const _DUYET_IN_TEM = {{ duyet_in_tem|default([])|tojson }};

// Giám đốc đã duyệt → mở đúng trang in cho lô đó (giấy phép dùng 1 lần).
function inLoDaDuyet() {
  if (!_DUYET_IN_TEM.length) { alert('Chưa có lô nào được duyệt.'); return; }
  window.open('/pos/products/print-batch?ids=' + _DUYET_IN_TEM.join(',') + '&qty=1', '_blank');
}

async function xinDuyetInTem() {
  const ids = [...document.querySelectorAll('.prod-chk:checked')].map(x => parseInt(x.value));
  if (!ids.length) {
    alert('⚠️ Chưa chọn sản phẩm nào.\n\nTick vào ô vuông ở các món cần in tem rồi bấm lại.');
    return;
  }
  const ma = ids.map(id => (_allProds.find(p => p.id === id) || {}).ma_hang).filter(Boolean);
  const ds = ma.slice(0, 8).join(', ') + (ma.length > 8 ? ' … (+' + (ma.length - 8) + ' món)' : '');
  if (!confirm('Xin Giám đốc / Phó Giám đốc duyệt in tem cho ' + ids.length + ' sản phẩm?\n\n'
             + ds + '\n\nDuyệt xong bạn in được ĐÚNG lô này, ĐÚNG 1 LẦN.')) return;
  const r = await fetch('/api/approval/submit', {
    method: 'POST', headers: {'Content-Type': 'application/json'},
    body: JSON.stringify({loai: 'in_tem', phieu_id: 0,
                          mo_ta: 'Xin in tem ' + ids.length + ' sản phẩm: ' + ma.slice(0, 5).join(', '),
                          payload: {ids: ids, qty: 1}})
  });
  const d = await r.json();
  alert(d.success
    ? '📤 Đã gửi yêu cầu. Giám đốc duyệt xong bạn sẽ được báo ngay, lúc đó vào lại đây in tem.'
    : '❌ ' + (d.message || d.error || 'Không gửi được yêu cầu'));
}

function printSelectedLabels() {
  const ids = [...document.querySelectorAll('.prod-chk:checked')].map(c => c.value);
  if (!ids.length) { alert('Chưa chọn sản phẩm nào'); return; }
  // Cảnh báo nếu lựa chọn TRẢI NHIỀU ĐỢT NHẬP hoặc có hàng ĐÃ IN TEM rồi (dễ in nhầm hàng cũ).
  // Đây là đường CHỌN TAY nên chỉ hỏi lại, không chặn cứng như nút "In tem hàng mới".
  {
    const sel = _allProds.filter(p => ids.includes(String(p.id)));
    const dem = {}; sel.forEach(p => { const d = _ngayNhap(p) || '(không rõ)'; dem[d] = (dem[d]||0)+1; });
    const dot = Object.keys(dem).sort((a, b) => _dmyKey(b) - _dmyKey(a));
    const daIn = sel.filter(p => (p.so_lan_in_tem || 0) > 0).length;
    if (dot.length > 1 || daIn) {
      let m = `Sắp in tem cho ${ids.length} sản phẩm đang chọn:\n\n`
            + dot.map(d => `   📅 ${d}: ${dem[d]} SP`).join('\n');
      if (dot.length > 1) m += `\n\n⚠️ Đang trải ${dot.length} ĐỢT NHẬP khác nhau — coi chừng in nhầm hàng cũ.`;
      if (daIn)          m += `\n⚠️ Có ${daIn} SP ĐÃ IN TEM rồi — in nữa là ra tem trùng.`;
      m += '\n\nVẫn in?';
      if (!confirm(m)) return;
    }
  }
  // Số tem/SP chọn ngay trên trang in hàng loạt (có sẵn ô "Số tem/SP") — khỏi hỏi 2 lần.
  window.open(`/pos/products/print-batch?ids=${ids.join(',')}&qty=1`, '_blank');
}

// ── Phân quyền giao diện ──────────────────────────
let _myPerms = { inventory: true, sales: true };   // mặc định tạm thời

async function loadMyPerms() {
  try {
    const r = await fetch('/api/my-perms');
    const d = await r.json();
    _myPerms = d.perms || {};

    const canInventory = !!_myPerms.inventory;
    const canMfrs      = !!_myPerms.manufacturers;

    // Hiển thị badge vai trò ở header
    if (d.logged_in && d.display_name) {
      const badge = document.getElementById('user-role-badge');
      if (badge) {
        badge.textContent = `👤 ${d.display_name} · ${d.role_label}`;
        badge.classList.remove('hidden');
      }
    }

    // Ẩn form nhập hàng mới nếu không có quyền kho
    const addForm = document.getElementById('add-product-form');
    if (addForm && !canInventory) {
      addForm.style.display = 'none';
      // Hiện thông báo
      const notice = document.createElement('div');
      notice.className = 'bg-amber-50 border border-amber-200 rounded-xl px-4 py-3 text-sm text-amber-800 mb-3';
      notice.textContent = '🔒 Tài khoản của bạn không có quyền nhập/chỉnh sửa hàng tồn kho.';
      addForm.parentNode.insertBefore(notice, addForm);
    }

    // Ẩn section Import Excel và nút Xuất Excel nếu không có quyền kho
    const importSection = document.getElementById('import-excel-section');
    const exportBtn     = document.getElementById('btn-export-inv');
    if (!canInventory) {
      if (importSection) importSection.style.display = 'none';
      if (exportBtn)     exportBtn.style.display = 'none';
    }

    // Ẩn nút NSX/NPP edit nếu không có quyền manufacturers
    if (!canMfrs) {
      document.querySelectorAll('[onclick^="openMfModal"], [onclick^="openMfEdit"]')
        .forEach(el => el.style.display = 'none');
    }

    // Lưu để dùng trong renderTable (ẩn nút sửa/xóa)
    window._canInventory = canInventory;
  } catch(e) { console.warn('loadMyPerms error', e); }
}

// ── Khởi động ──────────────────────────────────────
// Tải giá vàng trước để tooltip công thức có đủ dữ liệu
(async () => {
  await loadMyPerms();
  await fetchPrices();
  loadManufacturers();
  loadSummary();
  loadProducts();
  loadNameSuggestions();
  setPriceMode('formula');      // Mặc định: CT tự động
  setPriceModeEdit('formula');
  fpSet('f-ngay-nhap', nowInputDt());
  autoFillMaHang();             // điền sẵn mã NM{YYMMDD}{seq} khi mở trang
})();

// Cập nhật giá realtime mỗi 60 giây
setInterval(fetchPrices, 60000);

// ĐT không có hover: chạm vào giá (.htip) để bật/tắt tooltip công thức; chạm chỗ khác đóng hết
document.addEventListener('click', e => {
  const h = e.target.closest('.htip');
  document.querySelectorAll('.htip.tip-open').forEach(el => { if (el !== h) el.classList.remove('tip-open'); });
  if (h) h.classList.toggle('tip-open');
});

// ═══ RFID:GAN-TEM — gán tem RFID cho sản phẩm (spec 2026-07-28-rfid-design.md) ═══
// Poll khay CHỈ khi modal mở. EPC đã chọn giữ nguyên khi danh sách refresh.
let _rfPoll = null, _rfChon = null, _rfSoDaGan = 0;

function rfOpenGan() {
  document.getElementById('rf-gan-modal').classList.remove('hidden');
  // Máy Chainway C5: hạ công suất khi gán tem (chỉ đọc tem đưa sát máy)
  try { window.VangPOSC5 && window.VangPOSC5.cheDo('gan_tem'); } catch (e) {}
  _rfChon = null; _rfSoDaGan = 0;
  document.getElementById('rf-gan-count').textContent = '';
  document.getElementById('rf-gan-msg').textContent = '';
  document.getElementById('rf-ma-hang').value = '';
  // 1.9.2: máy C5 (app ≥ 1.0.5) bóp cò = đọc chip RFID + quét mã QR trên tem → tự gán
  window.VangPOSC5_nhanMa = rfNhanMa;
  const hd = document.getElementById('rf-c5-hd');
  let c5Quet = false;
  try { c5Quet = !!(window.VangPOSC5 && window.VangPOSC5.quetMa && window.VangPOSC5.quetMa(true)); } catch (e) {}
  if (window.VangPOSC5 && window.VangPOSC5.laC5 && window.VangPOSC5.laC5()) {
    hd.textContent = c5Quet
      ? '🔫 Đưa tem sát đầu máy, BÓP GIỮ CÒ: máy đọc chip RFID + quét mã QR trên tem rồi TỰ GÁN (nghe bíp là xong).'
      : '⬆ App VangPOS C5 trên máy này là bản cũ — cập nhật app (nút "⬆ Bản mới") để bóp cò là tự quét QR và gán.';
    hd.classList.remove('hidden');
  } else hd.classList.add('hidden');
  rfTick();
  // Vòng "chờ sẵn" cho màn Gán tem (xem chú thích ở rfTick)
  let _ganDangDoi = false;
  _rfPoll = setInterval(async () => {
    if (_ganDangDoi) return;
    _ganDangDoi = true;
    try { await rfTick(true); } finally { _ganDangDoi = false; }
  }, 30);
  setTimeout(() => document.getElementById('rf-ma-hang').focus(), 200);
}
function rfCloseGan() {
  document.getElementById('rf-gan-modal').classList.add('hidden');
  try { window.VangPOSC5 && window.VangPOSC5.cheDo(''); } catch (e) {}
  try { window.VangPOSC5 && window.VangPOSC5.quetMa && window.VangPOSC5.quetMa(false); } catch (e) {}
  window.VangPOSC5_nhanMa = null;
  _rfTuGanLuot++;
  if (_rfPoll) { clearInterval(_rfPoll); _rfPoll = null; }
}
// ── 1.9.2: QUÉT MÃ QR TRÊN TEM LÀ TỰ GÁN ─────────────────────────────────────
// Mã QR in trên tem = mã hàng (tem app + tem BarTender). Nhận mã (đầu quét 2D của C5 hoặc camera) →
// điền ô mã hàng → chờ tối đa 3 giây cho đầu đọc thấy ĐÚNG 1 tem chưa gán rồi tự bấm Gán. Không bao giờ
// tự gán khi thấy nhiều tem chưa gán (không đoán tem nào), mã không có trong kho hay món đã có tem
// (rfLuuGan tự báo lỗi đó).
let _rfChuaGanSo = 0, _rfTuGanLuot = 0;
function rfMaTuQr(raw) {
  let s = String(raw == null ? '' : raw).trim();
  if (/^https?:\/\//i.test(s)) {           // phòng tem in mã QR dạng đường dẫn: lấy đoạn cuối
    try { const u = new URL(s); s = u.searchParams.get('ma') || u.pathname.split('/').filter(Boolean).pop() || ''; }
    catch (e) { s = ''; }
  }
  return s.replace(/\s+/g, '').toUpperCase().slice(0, 80);
}
async function rfNhanMa(raw, loi) {
  const msg = document.getElementById('rf-gan-msg');
  if (document.getElementById('rf-gan-modal').classList.contains('hidden')) return;
  if (loi) {
    msg.textContent = loi === 'khong_doc_duoc_ma'
      ? '⚠️ Chưa đọc được mã QR trên tem — đưa mã QR vào giữa đầu quét rồi bóp cò lại.'
      : '⚠️ Đầu quét mã của máy không mở được (' + loi + ') — bấm 📷 Quét QR hoặc gõ mã hàng.';
    msg.className = 'text-sm text-amber-600';
    return;
  }
  const ma = rfMaTuQr(raw);
  if (!ma) return;
  document.getElementById('rf-ma-hang').value = ma;
  const luot = ++_rfTuGanLuot;
  msg.textContent = '🔎 Đã quét mã ' + ma + ' — đang chờ đầu đọc thấy chip của tem…';
  msg.className = 'text-sm text-violet-700';
  for (let i = 0; i < 20; i++) {
    await rfTick();
    if (luot !== _rfTuGanLuot) return;                 // đã có lần quét mới / đã đóng màn
    if (_rfChuaGanSo === 1) { await rfLuuGan(); return; }
    if (_rfChuaGanSo > 1) {
      msg.textContent = '⚠️ Đầu đọc đang thấy ' + _rfChuaGanSo + ' tem chưa gán — để riêng 1 tem sát máy, hoặc chọn đúng tem rồi bấm 💾 Gán tem.';
      msg.className = 'text-sm text-amber-600 font-semibold';
      return;
    }
    await new Promise(r => setTimeout(r, 150));
  }
  msg.textContent = '⚠️ Chưa đọc được chip RFID của tem — để tem sát đầu máy, bóp giữ cò (hoặc đặt tem lên khay) rồi bấm 💾 Gán tem.';
  msg.className = 'text-sm text-amber-600 font-semibold';
}
// "CHỜ SẴN" (long-poll): máy chủ giữ yêu cầu tới khi khay đổi rồi trả ngay →
// đặt tem lên khay là mã hiện gần như tức thì (03/08/2026).
let _rfBan = '';
async function rfTick(cho) {
  let d;
  // loc=ban: gán tem chỉ nhận tem của ĐÚNG máy đọc thuộc trang này (C5 / khay quầy)
  const u = cho ? ('/api/rfid/tray?loc=ban&doi=15&cho=' + encodeURIComponent(_rfBan))
                : '/api/rfid/tray?loc=ban';
  try { d = await (await fetch(u, {cache: 'no-store'})).json(); }
  catch (e) { return; }
  _rfBan = d.ban || '';
  const tt = document.getElementById('rf-agent-tt');
  tt.textContent = d.agent_online ? '🟢 Khay đang kết nối' : '🔴 Mất kết nối khay — kiểm tra agent RFID ở máy quầy';
  tt.className = 'text-xs font-semibold ' + (d.agent_online ? 'text-emerald-600' : 'text-red-600');
  // Chỉ hiện tem CHƯA gán (product=null); tem đã gán hiện mờ để biết
  const box = document.getElementById('rf-epc-list');
  const chuaGan = (d.epcs || []).filter(e => !e.product);
  const daGan   = (d.epcs || []).filter(e => e.product);
  if (_rfChon && !chuaGan.some(e => e.epc === _rfChon)) _rfChon = null;
  if (!_rfChon && chuaGan.length === 1) _rfChon = chuaGan[0].epc;   // 1 tem → tự chọn
  _rfChuaGanSo = chuaGan.length;
  // Tổng số tem NGAY LÚC NÀY trên khay — đếm bằng mắt hay lệch (05/08/2026).
  const tong = document.getElementById('rf-khay-tong');
  const soTong = (d.epcs || []).length;
  tong.textContent = soTong
    ? `📡 Trên khay hiện có ${soTong} tem  ·  🆕 ${chuaGan.length} chưa gán  ·  ✓ ${daGan.length} đã gán`
    : '📡 Trên khay hiện KHÔNG có tem nào';
  box.innerHTML =
    (chuaGan.map(e => `
      <label class="flex items-center gap-2 p-2 rounded-xl border cursor-pointer
                    ${_rfChon === e.epc ? 'border-violet-500 bg-violet-50' : 'border-slate-200'}">
        <input type="radio" name="rf-epc" value="${_e(e.epc)}" ${_rfChon === e.epc ? 'checked' : ''}
               onchange="_rfChon=this.value; rfTick();">
        <span class="font-mono text-sm font-bold">${_e(e.epc)}</span>
        <span class="text-xs text-slate-400 ml-auto">${e.rssi != null ? _e(e.rssi) + ' dBm · đọc ' + _e(e.reads||0) + ' lần' : ''}</span>
      </label>`).join('') || '<div class="text-xs text-slate-400 p-2">— Chưa thấy tem mới trên khay —</div>') +
    daGan.map(e => `<div class="text-xs text-slate-400 px-2">✓ ${_e(e.epc)} đã gán: ${_e(e.product && e.product.ma_hang)}`
      + `<span class="text-slate-300">${e.rssi != null ? ' · ' + _e(e.rssi) + ' dBm · đọc ' + _e(e.reads||0) + ' lần' : ''}</span></div>`).join('');
  // Preview sản phẩm theo mã gõ
  const ma = document.getElementById('rf-ma-hang').value.trim().toUpperCase();
  const pv = document.getElementById('rf-sp-preview');
  if (ma) {
    const p = _allProds.find(x => (x.ma_hang || '').trim().toUpperCase() === ma);
    pv.textContent = p ? `→ ${p.ten}${p.rfid_uid ? ' (⚠️ món này ĐÃ có tem ' + p.rfid_uid + ')' : ''}`
                       : '→ không thấy mã này trong danh sách đang tải';
  } else pv.textContent = '';
}
async function rfLuuGan() {
  const msg = document.getElementById('rf-gan-msg');
  const ma = document.getElementById('rf-ma-hang').value.trim().toUpperCase();
  if (!_rfChon) { msg.textContent = '⚠️ Chưa có/chưa chọn tem trên khay.'; msg.className = 'text-sm text-amber-600'; return; }
  if (!ma)      { msg.textContent = '⚠️ Chưa nhập mã hàng.'; msg.className = 'text-sm text-amber-600'; return; }
  const p = _allProds.find(x => (x.ma_hang || '').trim().toUpperCase() === ma);
  if (!p) { msg.textContent = '⚠️ Không thấy mã "' + ma + '" — tải lại trang nếu vừa nhập hàng mới.'; msg.className = 'text-sm text-amber-600'; return; }
  let r, d;
  try {
    r = await fetch('/api/rfid/gan', {method: 'POST', headers: {'Content-Type': 'application/json'},
        body: JSON.stringify({epc: _rfChon, product_id: p.id, pin: getPin()})});
    d = await r.json();
  } catch (e) { msg.textContent = '❌ Lỗi kết nối'; msg.className = 'text-sm text-red-600'; return; }
  if (!d.success) {
    msg.textContent = d.error === 'wrong_pin' ? '❌ Sai PIN hoặc thiếu quyền kho (nhập PIN ô trên cùng trang).'
      : d.error === 'epc_dang_dung' ? `❌ Tem này đang gán cho ${d.ma_hang} — ${d.ten}. Gỡ tem món đó trước.`
      : d.error === 'san_pham_da_co_tem' ? `❌ Món này đã đeo tem ${d.epc_cu}. Gỡ tem cũ (nút trong chi tiết SP) rồi gán lại.`
      : '❌ ' + (d.error || 'Không gán được');
    msg.className = 'text-sm text-red-600 font-semibold';
    return;
  }
  _rfSoDaGan++;
  if (window.VPChuong) VPChuong.phat('rf_gan_tem', 'bip:cao');
  msg.textContent = `✅ Đã gán ${_rfChon} → ${d.ma_hang} — ${d.ten}`;
  msg.className = 'text-sm text-green-600 font-semibold';
  document.getElementById('rf-gan-count').textContent = 'Phiên này đã gán ' + _rfSoDaGan + ' tem';
  p.rfid_uid = _rfChon;          // cập nhật cache trang, khỏi tải lại
  _rfChon = null;
  document.getElementById('rf-ma-hang').value = '';
  document.getElementById('rf-ma-hang').focus();
  rfTick();
}
// ═══ RFID:TIM-MON — đặt từng khay hàng lên đầu đọc tới khi thấy món cần tìm ═══
let _rfTimPoll = null, _rfTimEpc = null;

function rfTimMon(pid) {
  const p = _allProds.find(x => x.id === pid);
  if (!p || !p.rfid_uid) { alert('Món này chưa gán tem RFID.'); return; }
  _rfTimEpc = (p.rfid_uid || '').trim().toUpperCase();
  document.getElementById('rf-tim-sp').textContent = p.ma_hang + ' — ' + p.ten;
  document.getElementById('rf-tim-modal').classList.remove('hidden');
  // Máy Chainway C5: tìm sản phẩm → công suất cao + tự đọc liên tục
  try { window.VangPOSC5 && window.VangPOSC5.cheDo('tim'); } catch (e) {}
  _rfTimVe(false, null);
  _rfTimTick();
  // Vòng "chờ sẵn": gọi lại ngay sau mỗi lần trả về (bản thân yêu cầu đã treo
  // tới 15s ở máy chủ) → thấy món là kêu tức thì, không phải chờ hết nhịp 1 giây.
  let _timDangDoi = false;
  _rfTimPoll = setInterval(async () => {
    if (_timDangDoi) return;
    _timDangDoi = true;
    try { await _rfTimTick(true); } finally { _timDangDoi = false; }
  }, 30);
}
function rfTimDong() {
  document.getElementById('rf-tim-modal').classList.add('hidden');
  try { window.VangPOSC5 && window.VangPOSC5.cheDo(''); } catch (e) {}
  if (_rfTimPoll) { clearInterval(_rfTimPoll); _rfTimPoll = null; }
}
function _rfTimVe(thay, online) {
  const tt = document.getElementById('rf-tim-tt');
  if (thay) {
    tt.textContent = '✅ CÓ TRONG KHAY NÀY!';
    tt.style.cssText = 'background:#dcfce7;color:#15803d;border:3px solid #22c55e';
  } else if (online === false) {
    tt.textContent = '🔴 Mất kết nối khay';
    tt.style.cssText = 'background:#fef2f2;color:#b91c1c;border:2px solid #fecaca';
  } else {
    tt.textContent = '… Đang dò khay …';
    tt.style.cssText = 'background:#f5f3ff;color:#6d28d9;border:2px dashed #c4b5fd';
  }
}
function _rfTimBeep() {
  // 1.9.0: dùng bộ chọn chuông chung — mặc định "Bíp dài" (y hệt tiếng cũ), đổi được / tắt được
  if (window.VPChuong) VPChuong.phat('rf_tim_mon', 'bip:dong');
}
document.addEventListener('DOMContentLoaded', () => {
  if (window.VPChuong) VPChuong.nutChon('rf-tim-chuong', { khoa: 'rf_tim_mon', macDinh: 'bip:dong', nhan: 'Chuông',
    tieuDe: 'Tiếng khi tìm thấy món', moTa: 'Kêu khi khay RFID đọc được đúng món đang tìm. Lưu theo máy này.' });
});
let _rfTimBan = '';
async function _rfTimTick(cho) {
  let d;
  const u = cho ? ('/api/rfid/tray?doi=15&cho=' + encodeURIComponent(_rfTimBan))
                : '/api/rfid/tray';
  try { d = await (await fetch(u, {cache: 'no-store'})).json(); }
  catch (e) { return; }
  _rfTimBan = d.ban || '';
  if (!d.agent_online) { _rfTimVe(false, false); return; }
  const thay = (d.epcs || []).some(e => e.epc === _rfTimEpc);
  if (thay) { _rfTimVe(true, true); _rfTimBeep(); }
  else _rfTimVe(false, true);
}

async function rfGoTem(pid) {
  // Mã hàng tra lại từ dữ liệu đã tải (không truyền qua onclick — B2).
  const ma = ((_allProds.find(x => x.id === pid) || {}).ma_hang) || ('#' + pid);
  if (!confirm('Gỡ tem RFID khỏi món ' + ma + '?')) return;
  let d;
  try {
    d = await (await fetch('/api/rfid/go', {method: 'POST', headers: {'Content-Type': 'application/json'},
        body: JSON.stringify({product_id: pid, pin: getPin()})})).json();
  } catch (e) { alert('Lỗi kết nối'); return; }
  if (!d.success) {
    alert(d.error === 'wrong_pin' ? 'Sai PIN hoặc thiếu quyền kho (nhập PIN ô trên cùng trang).' : 'Lỗi: ' + d.error);
    return;
  }
  const p = _allProds.find(x => x.id === pid);
  if (p) p.rfid_uid = null;
  loadProducts();
}
</script>
{% endblock %}