/* ===== ไอคอนเส้นแทนอิโมจิ (ม็อกอัพ iconmock · แบบ Mega Menu) =====
   ใช้สีตามธีมคนดู (--vp/--vtint/--vbd) ไม่ใช้ --pri (สีธีมร้าน) · ชมพู/ฟ้าเปลี่ยนตาม data-theme อัตโนมัติ */

/* เส้นบางลงเล็กน้อยเฉพาะไอคอนชุดใหม่ (ของเดิมเส้น 2 ไม่แตะ) */
svg.i.lu{stroke-width:1.75}

/* ---------- เมนู ☰ / dropdown ผู้ใช้ ---------- */
.mn-list{padding:6px 10px 8px}
.mn-cap{font:600 11px/1 Prompt,sans-serif;letter-spacing:.04em;color:var(--vtx3);padding:12px 12px 6px}
.mn-i{gap:12px;padding:8px 10px;border-radius:14px;font-size:14px;color:var(--vink);transition:background .15s}
.mn-tile{width:36px;height:36px;flex:none;display:grid;place-items:center;border-radius:11px;
  background:#fff;color:var(--vp);box-shadow:inset 0 0 0 1px var(--vbd)}
.mn-tile svg.i{width:19px;height:19px}
.mn-tx{display:flex;flex-direction:column;min-width:0;line-height:1.25}
.mn-tx b{font:600 14px Prompt,sans-serif;color:var(--vink)}
.mn-tx small{font-size:11.5px;color:var(--vtx2);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mn-ar{margin-left:auto;color:var(--vtx3);display:flex}
.mn-ar svg.i{width:16px;height:16px}
.mn-i:hover,.mn-i:focus-visible{background:var(--vtint)}
.mn-i:hover .mn-tile{background:var(--vtint2);box-shadow:none}
/* หน้าที่อยู่ = พิลจางสีธีม + ไอคอนทึบ */
.mn-i.on{background:var(--vtint)}
.mn-i.on .mn-tile{background:var(--vbtn);color:#fff;box-shadow:0 4px 10px rgba(var(--vrgb),.28)}
.mn-i.on .mn-tx b{color:var(--vdeep)}
.mn-adm .mn-tile{color:#2457b8}
.mn-out .mn-tile{color:#d8485a;box-shadow:inset 0 0 0 1px #f3c9cf}
.mn-out .mn-tx b{color:#d8485a}
.mn-out:hover{background:#fdeef0}
.mn-x{font-size:0}
.mn-x svg.i{width:20px;height:20px}
.mn-view svg.i{width:15px;height:15px}
.mn-theme{gap:12px;padding:8px 10px}
.mn-theme .mn-tile{width:36px;height:36px}
.mn-theme .mn-tl{font:600 14px Prompt,sans-serif}

/* ---------- หัวเว็บ: กระดิ่ง · ปุ่มผู้ใช้ ▾ · ลิงก์ VIP / เขียนรีวิว ---------- */
.ib.bell svg.i{width:20px;height:20px;color:var(--vttl)}
.dnav a svg.i,.dnav .dn-cta svg.i{width:17px;height:17px;vertical-align:-3px;margin-right:4px}
.dnav-me i svg.i{width:18px;height:18px;color:#fff}
.dnav-me small{display:flex}
.dnav-me small svg.i{width:15px;height:15px}
.ptl svg.i{width:17px;height:17px;vertical-align:-3px;color:var(--vp)}

/* ---------- ปุ่มบนหน้าร้าน ---------- */
.acts3 .btn svg.i{width:18px;height:18px}
.act-chat svg.i{width:20px;height:20px}

/* ---------- แท็บร้านตกแต่ง ---------- */
.dk-tab{display:flex;align-items:center;justify-content:center;gap:6px}
.dk-tab svg.i{width:17px;height:17px}
.dk-tab.dk-on{color:var(--vp)}
.dk-admin svg.i{width:16px;height:16px;vertical-align:-3px;color:var(--vp)}

/* ---------- ปุ่มหลังบ้าน (dashboard) = ไอคอนในช่องมน ---------- */
.decorlinks .btn{gap:10px;justify-content:flex-start}
.decorlinks .btn svg.i{width:30px;height:30px;padding:6px;border-radius:10px;background:var(--vtint);color:var(--vp)}

/* ---------- ป้าย VIP (ทอง) ---------- */
.vip-badge svg.i{width:13px;height:13px;vertical-align:-2px;stroke-width:2;color:#c98a00}

/* ---------- คอม ≥1024: dropdown ผู้ใช้ ▾ = เมกะเมนู 2 คอลัมน์ (แบบรูปอ้างอิง) ---------- */
@media (min-width:1024px){
  .mn-draw{width:600px}
  .mn-list{display:grid;grid-template-columns:1fr 1fr;column-gap:6px;row-gap:2px}
  .mn-cap,.mn-sep{grid-column:1/-1}
  .mn-i .mn-ar{display:none}
}
.decorlinks .btn{text-align:left}

/* ---------- ไอคอนในช่องมน แทนอิโมจิทั้งเว็บ (macro tile ใน _ui.html · หน้าตาเดียวกับ .mn-tile) ---------- */
span.ict{display:inline-grid;padding:0;border:0;opacity:1;text-align:center;text-indent:0;place-items:center;flex:none;width:1.6em;height:1.6em;border-radius:.48em;vertical-align:middle;
  margin:-.2em .35em -.15em 0;background:#fff;color:var(--vp);box-shadow:inset 0 0 0 1px var(--vbd);line-height:1;font-style:normal}
.ict svg.i{width:62%;height:62%;stroke-width:2}
.ict svg.i.lu{stroke-width:2}
span.ict.ict-c{color:inherit;background:color-mix(in srgb,currentColor 9%,#fff);box-shadow:inset 0 0 0 1px color-mix(in srgb,currentColor 26%,transparent)}
span.ict.ict-w{color:inherit;background:rgba(255,255,255,.22);box-shadow:inset 0 0 0 1px rgba(255,255,255,.38)}
span.ict.ict-lg{width:44px;height:44px;border-radius:14px;margin:0}
.ict-lg svg.i{width:22px;height:22px}
span.ict.ict-only{margin-right:0}
/* หน้าร้าน: ขนาดช่องไอคอนตามจุด (คงความสูงป้าย/แถวเดิม) */
.blbar .ic .ict{width:34px;height:34px;border-radius:11px}
.blbar .ic .ict svg.i{width:19px;height:19px}
.st b .ict{width:1.3em;height:1.3em;border-radius:.4em;margin:-.15em .25em 0 0}
.pintag .ict,.sc-pill .ict,.tagred .ict,.svtag .ict{width:1.55em;height:1.55em;margin:-.25em .3em -.2em -.35em}
.svtag{align-items:center}
.pinbtn .ict{margin:-.2em .1em -.2em -.3em}
.pinbtn.on .ict{background:rgba(255,255,255,.22);box-shadow:inset 0 0 0 1px rgba(255,255,255,.4)}
.cbg-adj .ict{margin-left:-.35em}
.warnline .ict{margin:-2px 0;width:22px;height:22px;border-radius:7px}
.warnline .ict svg.i{width:13px;height:13px}
.modal-card .m-ic svg.i{width:27px;height:27px;color:var(--vp)}
/* ปุ่ม (flex + gap) = ไม่ต้องเว้นขวาซ้ำ */
.btn>.ict,.promo-go>.ict,.vip-go>.ict{margin:-.2em 0}
.promo-go>.ict,.vip-go>.ict{margin-right:.4em}

/* ทั้งเว็บ: ช่องไอคอนเดิมที่เคยใส่อิโมจิ */
.res .hd .ic svg.i{width:21px;height:21px}
.res.rs-ok .ic{color:#1f9d61}.res.rs-warn .ic{color:#b45309}.res.rs-flag .ic{color:#c2410c}
.caution .c-ic svg.i{width:20px;height:20px;color:#b45309}
.qc>.ict{width:24px;height:24px;border-radius:7px;margin:0}
.qc>.ict svg.i{width:15px;height:15px}
.promo-badge .promo-e .ict{width:40px;height:40px;border-radius:13px}
.promo-badge .promo-e .ict svg.i{width:21px;height:21px}
.promo-bar .promo-e .ict{width:32px;height:32px;border-radius:10px}
.promo-bar .promo-e .ict svg.i{width:18px;height:18px}
.vip-hero .vip-crown svg.i{width:46px;height:46px;stroke-width:1.6;color:#b07a10}
.vip-state .vip-ic .ict{width:34px;height:34px;border-radius:11px;color:#b07a10;background:#fffaf0;box-shadow:inset 0 0 0 1px #f3dca0}
.vip-feat .vip-f .vip-ic{width:auto}
.vip-feat .vip-f .vip-ic .ict{width:30px;height:30px;border-radius:10px;color:#b07a10;background:#fffaf0;box-shadow:inset 0 0 0 1px #f3dca0}
.vip-feat .vip-f .vip-ic .ict svg.i,.vip-state .vip-ic .ict svg.i{width:17px;height:17px}
.ivt-th>svg.i{width:26px;height:26px;color:#7c3aed}
.pe-t svg.i{width:14px;height:14px}
.vip-lk svg.i{width:9px;height:9px;vertical-align:-1px;stroke-width:2.4}
.pe-cap svg.i{width:11px;height:11px;vertical-align:-1px;color:#d4a017}
.ntpanel .ni{width:auto}
.ntpanel .ni .ict{width:30px;height:30px;border-radius:10px}
.ntpanel .ni .ict svg.i{width:17px;height:17px}
.hprog .dots i svg.i{width:11px;height:11px;stroke-width:2.2}
.dpr .ict,.dk-tag .ict,.fpk-tag .ict,.promo-tag .ict,.ivt-st .ict,.vip-lock .ict,.srvb-adm .ict{width:1.5em;height:1.5em;margin:-.25em .25em -.2em -.3em}
.ac-sg .ict{margin:-.2em .3em -.15em 0}
