/* ★ เตือนสต๊อกใกล้หมด + สร้างบิลเติมสต๊อก 1688 (1 พ.ย. 2569 · mockup _delivery/mockup_stock_alert_20261101) ★
   ไฟล์เดียวใช้สองเว็บ: เว็บใหม่ stock-alert.html · เว็บเก่า /users/stock_alert โหลดจาก ptcargoexpress.com/stk.css (nx_head)
   แยกจาก pt-shop.css เพราะ pt-shop.css ถูก build ทับจาก mockup_shop */
.sp .stk{display:flex;flex-direction:column;gap:12px;padding-bottom:110px}
.sp .stk .sp-stm-bal b.is-neg{color:var(--sp-price)}
.sp .stk .sp-stm-bal b small{font-size:15px;font-weight:600}
.sp .stk-off{color:var(--sp-ink-3,#94a3b8)!important;font-weight:500!important;font-size:13px!important}
.sp .stk-tabs .sp-badge{position:static;margin-left:2px}
.sp .stk-tool{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 4px}
.sp .stk-all{display:flex;align-items:center;gap:8px;font-size:13.5px;font-weight:600}
.sp .stk-all input,.sp .stk-row input{width:20px;height:20px;accent-color:var(--sp-brand);flex:none}
.sp .stk-list{display:flex;flex-direction:column;padding:4px 14px}
.sp .stk-row{display:grid;grid-template-columns:20px 56px minmax(0,1fr) auto;gap:10px;align-items:center;padding:12px 0;border-top:1px solid var(--sp-line);cursor:pointer}
.sp .stk-row:first-child{border-top:0}
.sp .stk-row>img{width:56px;height:56px;border-radius:10px;object-fit:cover;background:var(--sp-bg)}
.sp .stk-row.is-no{cursor:default}
.sp .stk-row.is-no>img{opacity:.6}
.sp .stk-t{display:flex;flex-direction:column;gap:3px;min-width:0}
.sp .stk-t b{font-size:14px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.sp .stk-t code{align-self:flex-start;max-width:100%;overflow:hidden;text-overflow:ellipsis;padding:1px 6px;border-radius:6px;background:#f1f5f9;color:#334155;font-size:11px}
.sp .stk-t small{font-size:12px;color:var(--sp-ink-2)}
.sp .stk-t .stk-why{color:var(--sp-price)}
.sp .stk-pl{display:flex;flex-wrap:wrap;gap:4px}
.sp .stk-pl em{font-style:normal;font-size:11.5px;font-weight:600;padding:1px 7px;border-radius:999px}
.sp .stk-pl em.is-sp{background:#fff1ec;color:#ee4d2d}
.sp .stk-pl em.is-tt{background:#eef2f7;color:#111827}
.sp .stk-v{display:flex;flex-direction:column;align-items:flex-end;gap:4px}
.sp .stk-v b{font-size:22px;font-family:var(--sp-num);color:var(--sp-price);line-height:1}
.sp .stk-row.is-zero .stk-v b{color:#b91c1c}
.sp .stk-note{margin:0 4px}
.sp .stk-sum{align-items:flex-start}
.sp .stk-sum span:first-child{font-size:12.5px;color:var(--sp-ink-2)}
/* กล่องยืนยัน */
.sp .stk-dlg{width:min(560px,calc(100% - 24px))}
.sp .stk-shop{display:flex;align-items:center;gap:6px;margin:4px 0 0;font-size:13px;font-weight:700}
.sp .stk-shop img{width:18px;height:18px}
.sp .stk-shop .sp-mute{font-weight:400}
.sp .stk-q{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:10px;align-items:center}
.sp .stk-q>img{width:44px;height:44px;border-radius:8px;object-fit:cover}
.sp .stk-q>span:nth-child(2){display:flex;flex-direction:column;gap:2px;min-width:0;font-size:13.5px}
.sp .stk-q small{font-size:11.5px;color:var(--sp-ink-2)}
.sp .stk-q small.is-up{color:#b45309}
.sp .stk-q small.is-bad{color:var(--sp-price)}
.sp .stk-stp{display:flex;align-items:center;border:1px solid var(--sp-line);border-radius:10px;overflow:hidden}
.sp .stk-stp button{width:32px;height:34px;border:0;background:var(--sp-bg);font-size:16px;cursor:pointer}
.sp .stk-stp input{width:44px;height:34px;border:0;text-align:center;font:inherit;font-weight:700}
.sp .stk-ck{display:flex;gap:8px;align-items:center;font-size:13.5px}
@media (min-width:1024px){.sp .stk{max-width:1000px}}
.sp .stk-free{margin-left:6px;font-style:normal;vertical-align:middle}
/* โปรโมท PT Fulfillment ในหน้าสต๊อก (1 พ.ย. 2569) · พื้นขาว ไม่มีพื้นสี */
.sp .stk-promo{display:flex;flex-direction:column;gap:10px;border:1px solid var(--sp-line)}
.sp .stk-promo-h{display:flex;gap:10px;align-items:center}
.sp .stk-promo-h img{width:40px;height:40px;flex:none}
.sp .stk-promo-h span{display:flex;flex-direction:column;gap:2px}
.sp .stk-promo-h b{font-size:15px}
.sp .stk-promo-h small{font-size:12.5px;color:var(--sp-ink-2)}
.sp .stk-promo-l{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:4px;font-size:13px}
.sp .stk-promo-l li::before{content:"✓ ";color:var(--sp-ok,#16a34a);font-weight:700}
.sp .stk-promo-f{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;font-size:12.5px}
.sp .stk-ff{align-items:flex-start;padding:10px;border:1px solid var(--sp-line);border-radius:10px}
.sp .stk-ff input{margin-top:2px;width:20px;height:20px;accent-color:var(--sp-brand);flex:none}
.sp .stk-ff span{display:flex;flex-direction:column;gap:2px}
.sp .stk-ff small{font-size:12px;color:var(--sp-ink-2)}
/* ส่วนที่หน้าจริงเพิ่มจาก mockup (สถานะรอเชื่อม · ผูก SKU · ผลสร้างบิล) */
.sp .stk-pl em.is-ff{background:#ecfdf5;color:#047857}
.sp .stk-tabs .stk-soon{margin-left:4px;font-size:11px;font-weight:500;color:var(--sp-ink-3,#94a3b8)}
.sp .stk-pl-why{margin:8px 0 0;font-size:12.5px;line-height:1.6}
.sp .stk-pl-why a,.sp .stk-why a{color:inherit;font-weight:600;text-decoration:none}
.sp .stk-pl-why a{color:var(--sp-brand)}
.sp .stk-sum span.stk-sum-why{font-size:11.5px}
.sp .stk-empty{padding:24px 8px;text-align:center}
.sp .stk-empty .sp-btn{margin-top:10px}
.sp .stk-unbind{color:var(--sp-ink-2);text-decoration:underline}
.sp .stk-th-u{margin:6px 0 10px;text-align:center;font-size:12px}
.sp .stk-soon-pill{margin-left:6px;font-style:normal;background:#f1f5f9;color:#64748b}
.sp .stk-ck input{width:20px;height:20px;accent-color:var(--sp-brand);flex:none}
.sp .stk-ck input:disabled+*,.sp .stk-ck:has(input:disabled){color:var(--sp-ink-2)}
.sp .stk-bind-k{margin:0;font-size:13px;font-weight:600;word-break:break-all}
.sp .stk-bind-q{box-sizing:border-box;width:100%;height:40px;padding:0 12px;border:1px solid var(--sp-line);border-radius:10px;font:inherit;background:var(--sp-card,#fff);color:inherit}
.sp .stk-bind-l{display:flex;flex-direction:column;gap:6px;max-height:48vh;overflow:auto}
.sp .stk-bind-i{box-sizing:border-box;width:100%;padding:8px;border:1px solid var(--sp-line);border-radius:10px;background:var(--sp-card,#fff);color:inherit;font:inherit;text-align:left;cursor:pointer}
.sp .stk-bind-i:disabled{opacity:.6;cursor:wait}
.sp .stk-go-why{margin:0 0 6px;text-align:center;font-size:12px}
.sp .stk-done{padding:18px 6px;text-align:center}
.sp .stk-done-f{display:flex;gap:8px}
.sp .stk-done-f .sp-btn{flex:1;justify-content:center}
.sp .stk-loading{padding:28px 8px;text-align:center}
/* เว็บเก่า (nx_page) จอคอม: แถบล่างเริ่มหลังเมนูซ้าย (กว้าง 250 · ย่อ 70) ไม่ทับเมนู · #wrapper overflow hidden จึงใช้ sticky ไม่ได้ */
@media (min-width:769px){.nx-body .sp-bar.stk-bar{left:250px;transition:left .2s}.nx-body.mini-navbar .sp-bar.stk-bar{left:70px}}
@media (max-width:480px){.sp .stk-tabs .stk-soon{display:none}}
/* Coming Soon (2 พ.ย. 2569 · สวิตช์ stock_alert_on ปิด) · การ์ดขาวขอบเส้น ไม่มีพื้นสี · ตัวอย่างหน้าจอจาง กดไม่ได้ */
.sp .stk-cs{display:flex;flex-direction:column;gap:16px;padding:20px 16px;border:1px solid var(--sp-line);border-radius:16px;background:var(--sp-card,#fff)}
.sp .stk-cs-h{display:flex;gap:12px;align-items:flex-start}
.sp .stk-cs-h>img{width:48px;height:48px;flex:none}
.sp .stk-cs-h span{display:flex;flex-direction:column;align-items:flex-start;gap:4px;min-width:0}
.sp .stk-cs-h b{font-size:18px;line-height:1.4}
.sp .stk-cs-h small{font-size:13.5px;color:var(--sp-ink-2)}
.sp .stk-cs-pill{font-style:normal;font-size:11.5px;font-weight:700;letter-spacing:.04em;padding:2px 10px;border:1px solid var(--sp-brand);border-radius:999px;color:var(--sp-brand)}
.sp .stk-cs-l{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:minmax(0,1fr);gap:12px}
.sp .stk-cs-l li{display:flex;gap:10px;align-items:flex-start}
.sp .stk-cs-l li>img{width:28px;height:28px;flex:none}
.sp .stk-cs-l li span{display:flex;flex-direction:column;gap:2px;min-width:0}
.sp .stk-cs-l b{font-size:14.5px}
.sp .stk-cs-l small{font-size:12.5px;color:var(--sp-ink-2);line-height:1.5}
.sp .stk-cs-demo{margin:0;display:flex;flex-direction:column;gap:6px}
.sp .stk-cs-demo figcaption{font-size:12px;color:var(--sp-ink-2)}
.sp .stk-cs-demo-l{border:1px dashed var(--sp-line);opacity:.55;pointer-events:none;user-select:none}
.sp .stk-cs-demo-l .stk-row{cursor:default}
.sp .stk-cs-f{display:flex;flex-direction:column;align-items:stretch;gap:8px}
.sp .stk-cs-btn{justify-content:center}
.sp .stk-cs-btn:disabled{opacity:.6;cursor:not-allowed}
.sp .stk-cs-why{margin:0;text-align:center;font-size:12.5px;color:var(--sp-ink-2);line-height:1.5}
.sp .stk-cs-beta{align-self:center}
.sp .stk-cs-mode{margin:0 4px;font-size:12.5px;color:var(--sp-ink-2)}
@media (min-width:768px){.sp .stk-cs{padding:28px}.sp .stk-cs-l{grid-template-columns:repeat(2,minmax(0,1fr))}.sp .stk-cs-f{align-items:center}.sp .stk-cs-btn{min-width:320px}}
/* สั่งครั้งแรก + ให้ระบบหาให้ (2 พ.ย. 2569) · แถวที่ยังติ๊กไม่ได้มีปุ่ม/การ์ดผลค้นใต้ชื่อ เต็มความกว้างตั้งแต่รูป */
.sp .stk-t .stk-fo{display:flex;flex-wrap:wrap;align-items:center;gap:4px 6px}
.sp .stk-fo-pill{font-style:normal;font-size:11px;font-weight:700;white-space:normal;border-radius:8px;line-height:1.35}
.sp .stk-row>.stk-act{grid-column:2/-1;display:flex;flex-direction:column;gap:6px;min-width:0}
.sp .stk-act-b{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px}
.sp .stk-act-l{font-size:12.5px;font-weight:600;color:var(--sp-brand);text-decoration:none}
.sp .stk-act-why{margin:0;font-size:12px;line-height:1.5}
.sp .stk-fd-h{margin:0;font-size:12.5px;font-weight:600}
.sp .stk-fd{display:flex;flex-direction:column;gap:6px}
.sp .stk-fd-i{display:grid;grid-template-columns:44px minmax(0,1fr);gap:4px 10px;align-items:center;padding:8px;border:1px solid var(--sp-line);border-radius:10px;background:var(--sp-card,#fff)}
.sp .stk-fd-i>img{width:44px;height:44px;border-radius:8px;object-fit:cover;background:var(--sp-bg)}
.sp .stk-fd-i>span:nth-child(2){display:flex;flex-direction:column;gap:2px;min-width:0}
.sp .stk-fd-i b{font-size:13px;line-height:1.4;font-weight:600;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.sp .stk-fd-i small{font-size:11.5px;color:var(--sp-ink-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sp .stk-fd-a{grid-column:1/-1;display:flex;gap:6px;justify-content:flex-end}
.sp .stk-fd-a .sp-btn{min-width:84px;justify-content:center}
.sp .stk-q.is-fo small,.sp .stk-q small.is-fo{color:#047857}
.sp .stk-bind-u{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center}
.sp .stk-bind-or{margin:4px 0 0;font-size:12px}
.sp .stk-opt-h{display:grid;grid-template-columns:56px minmax(0,1fr);gap:10px;align-items:center;padding-bottom:8px;border-bottom:1px solid var(--sp-line)}
.sp .stk-opt-h>img{width:56px;height:56px;border-radius:10px;object-fit:cover}
.sp .stk-opt-h span{display:flex;flex-direction:column;gap:2px;min-width:0}
.sp .stk-opt-h b{font-size:13.5px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.sp .stk-opt-h small{font-size:12px;color:var(--sp-ink-2)}
.sp .stk-opt-t{margin:6px 0 0;font-size:12px}
.sp .stk-bind-i:disabled .stk-opt-why{color:var(--sp-price)}
.sp .stk-bind-i:disabled{cursor:not-allowed}
@media (min-width:768px){.sp .stk-fd-i{grid-template-columns:44px minmax(0,1fr) auto}.sp .stk-fd-a{grid-column:auto}}