/* สติ๊กเกอร์ Shopee + Lazada ในห้อง Duoke (chat-ext-sticker.js · Temp/dk_sticker_spec.md ข้อ 4-5)
   แผงใช้หน้าตาเดียวกับแผงสติกเกอร์ LINE (.cpop.stk / .stk-tabs / .stk-grid ใน chat.css) — ไฟล์นี้แค่ปรับให้พอดีคอลัมน์แชท + แถวใช้ล่าสุด + ฟองสติ๊กเกอร์ */

/* ปุ่ม 🐻 ซ่อนในห้องที่ไม่ใช่ Shopee/Lazada (.cx-tb ตั้ง display:grid ทับ [hidden] ของเบราว์เซอร์) */
.cx-tools .cx-tb[hidden] { display: none; }

/* แผง: ยึดซ้าย-ขวาของกล่องตอบ = ไม่ล้นคอลัมน์แชทไม่ว่าจอกว้างแค่ไหน */
.cx-comp .cpop.cx-stk { left: 8px; right: 8px; width: auto; max-width: 560px; max-height: min(400px, 55vh); }
.cx-comp .cpop.cx-stk[hidden] { display: none; }
.cx-stk .stk-tab img { width: 30px; height: 30px; }
.cx-stk .stk-title .muted { color: var(--text-3); }
.cx-stk-rec { display: flex; align-items: center; gap: 6px; flex: none; padding-bottom: 4px; border-bottom: 1px solid var(--border); min-width: 0; }
.cx-stk-lbl { flex: none; font-size: var(--fs-xs); color: var(--text-2); }
.cx-stk-recl { display: flex; gap: 2px; overflow-x: auto; min-width: 0; scrollbar-width: thin; }
.cx-stk-recl button { flex: none; width: 44px; height: 44px; border-radius: 8px; padding: 2px; display: grid; place-items: center; }
.cx-stk-recl button:hover { background: var(--surface-2); }
.cx-stk-recl img { width: 40px; height: 40px; object-fit: contain; }
.cx-stk-grid.busy, .cx-stk button:disabled { opacity: .45; cursor: wait; }
.cx-stk-busy { color: var(--text-2); }
/* Lazada: รูปเล็ก (small) ส่วนใหญ่เป็นหน้ายิ้มขนาดอีโมจิ → ช่องแคบกว่า Shopee ได้แถวละหลายตัว */
.cx-stk-grid.cx-stk-lazada { grid-template-columns: repeat(auto-fill, minmax(52px, 1fr)); }
.cx-stk-grid.cx-stk-lazada img { max-width: 46px; max-height: 46px; }

/* ฟองสติ๊กเกอร์: รูป ~120px ไม่มีกรอบฟอง (ทั้งขาเข้า/ขาออก/ส่งไม่ผ่าน) */
.cx-row .cx-b.stk, .cx-row.cx-them .cx-b.stk, .cx-row.cx-us .cx-b.stk, .cx-row.cx-us.cx-fail .cx-b.stk { background: none; border: 0; box-shadow: none; padding: 0; }
.cx-b.stk .cx-stk-img { display: block; width: 120px; height: 120px; object-fit: contain; }