﻿// Product detail page - buyer browse + seller manage
const { useState, useEffect } = React;

// Error boundary to prevent white screen
class DetailErrorBoundary extends React.Component {
  constructor(props) { super(props); this.state = { hasError: false, error: null }; }
  static getDerivedStateFromError(error) { return { hasError: true, error: error }; }
  componentDidCatch(error, info) {
    console.error("[DetailPage] React render error caught:", error.message || error);
    console.error("[DetailPage] Component stack:", info && info.componentStack);
  }
  render() {
    if (this.state.hasError) {
      return React.createElement("div",{className:"detail-page"},
        React.createElement("div",{className:"back-header"},
          React.createElement("div",{className:"bbtn",onClick:function(){NK.Store.back("home");}}, NK.BackIcon ? NK.BackIcon({size:22,color:"#334155"}) : "\u2190"),
          React.createElement("div",{className:"btitle"},"\u9875\u9762\u52A0\u8F7D\u5931\u8D25")
        ),
        React.createElement("div",{style:{padding:40,textAlign:"center",color:"#ff4d4f"}},
          React.createElement("div",{style:{fontSize:48}},"\u26A0\uFE0F"),
          React.createElement("div",{style:{fontSize:16,fontWeight:700,marginTop:12}},"\u9875\u9762\u52A0\u8F7D\u5931\u8D25"),
          React.createElement("div",{style:{fontSize:14,color:"#999",marginTop:8}},(this.state.error&&this.state.error.message)||"\u672A\u77E5\u9519\u8BEF"),
          React.createElement("button",{onClick:function(){NK.Store.back("home");},style:{marginTop:20,padding:"8px 24px",borderRadius:20,border:"1px solid #1677ff",background:"#fff",color:"#1677ff",fontSize:14,cursor:"pointer"}},"\u8FD4\u56DE\u9996\u9875")
        )
      );
    }
    return this.props.children;
  }
}

function ProductDetailPage() {
  console.log("[DetailPage] mounted");
  var _p = useState(null); var p = _p[0], sp = _p[1];
  var _ld = useState(true); var ld = _ld[0], sld = _ld[1];
  var _ci = useState(0); var ci = _ci[0], sci = _ci[1];
  var _sc = useState(false); var sc = _sc[0], ssc = _sc[1];
  var _sp2 = useState(false); var sp2 = _sp2[0], ssp2 = _sp2[1];
  var _oi = useState(null); var oi = _oi[0], soi = _oi[1];
  var _bl = useState(false); var bl = _bl[0], sbl = _bl[1];
  var _pl = useState(false); var pl = _pl[0], spl = _pl[1];
  var _em = useState(""); var em = _em[0], sem = _em[1];
  var _fv = useState(false); var fv = _fv[0], sfv = _fv[1];
  var _favModalConfig = useState(null); var favModalConfig = _favModalConfig[0], setFavModalConfig = _favModalConfig[1];

  // Bargain sheet state
  var _showBargainSheet = useState(false); var showBargainSheet = _showBargainSheet[0], setShowBargainSheet = _showBargainSheet[1];
  var _bargainOffer = useState(''); var bargainOffer = _bargainOffer[0], setBargainOffer = _bargainOffer[1];
  var _bargainMsg = useState('很喜欢这个号，您看这个价格方便出吗？'); var bargainMsg = _bargainMsg[0], setBargainMsg = _bargainMsg[1];
  var _bargainSubmitting = useState(false); var bargainSubmitting = _bargainSubmitting[0], setBargainSubmitting = _bargainSubmitting[1];
  var _bargainError = useState(''); var bargainError = _bargainError[0], setBargainError = _bargainError[1];
  var _quickIdx = useState(0); var quickIdx = _quickIdx[0], setQuickIdx = _quickIdx[1];
  var quickMessages = [
    '很喜欢这个号，您看这个价格方便出吗？',
    '朋友，价格跟预期有差距，能砍点价不？',
    '诚心想买，如果这个价格可以我就直接拍下。',
    '预算有限，您看还能再优惠一点吗？'
  ];

  var pp = NK.Store.get("pageParams") || {};
  var pid = pp.id;
  var isManage = pp.mode === "manage";
  var orderCtx = NK.Store.get("orderDetailContext") || null;

  console.log("[DetailPage] pageParams:", JSON.stringify(pp), "pid:", pid, "isManage:", isManage);

  useEffect(function(){
    if (!pid) { console.log("[DetailPage] no pid, skip load"); sld(false); return; }
    console.log("[DetailPage] loading product, pid:", pid, "isManage:", isManage);
    sld(true);
    var api = isManage ? NK.Api.Accounts.myDetail(pid) : NK.Api.Accounts.detail(pid);
    api.then(function(r){
      console.log("[DetailPage] API response code:", r&&r.code, "has data:", !!(r&&r.data));
      if (r && r.code===0) { sp(r.data); } else if (orderCtx) { console.log("[DetailPage] API failed, using orderContext fallback"); sp({id:pid, title:orderCtx.title||"", server:orderCtx.server||"", price:orderCtx.price||0, _fromOrder:true, _orderStatus:orderCtx.status, coverImages:orderCtx.cover?[{image_url:orderCtx.cover,is_cover:1,sort_order:0}]:[], detailImages:[], images:orderCtx.cover?[{image_url:orderCtx.cover,is_cover:1,sort_order:0}]:[], description:orderCtx.description||"", accountType:orderCtx.accountType||"", status:orderCtx.status||2}) }
      else { console.log("[DetailPage] API error:", r&&r.message); sp(null); }
    }).catch(function(e){
      console.error("[DetailPage] API exception:", e);
      if (orderCtx) { console.log("[DetailPage] API catch, using orderContext fallback"); sp({id:pid, title:orderCtx.title||"", server:orderCtx.server||"", price:orderCtx.price||0, _fromOrder:true, _orderStatus:orderCtx.status, coverImages:orderCtx.cover?[{image_url:orderCtx.cover,is_cover:1,sort_order:0}]:[], detailImages:[], images:orderCtx.cover?[{image_url:orderCtx.cover,is_cover:1,sort_order:0}]:[], description:orderCtx.description||"", accountType:orderCtx.accountType||"", status:orderCtx.status||2}) }
      else { sp(null); }
    }).finally(function(){ sld(false); });
  }, [pid, isManage]);

  function fp(v){ return "\u00A5" + Number(v||0).toFixed(2); }

  function buy(){
    if (!NK.Store.isLoggedIn()) { alert("\u8BF7\u5148\u767B\u5F55"); NK.Store.navigate("login"); return; }
    sem(""); ssc(true);
  }

  async function confirmOrder(){
    sbl(true); sem("");
    try {
      var r = await NK.Api.Orders.create({ accountId: pid });
      if (r.code===0) { console.log("[pay-debug] create order result:", JSON.stringify(r.data)); ssc(false); NK.Store.navigate("payment", { orderId: r.data.id }); }
      else sem(r.message || "\u4E0B\u5355\u5931\u8D25");
    } catch(e) { sem("\u7F51\u7EDC\u9519\u8BEF"); }
    finally { sbl(false); }
  }

  async function pay(){
    if (!oi) return;
    spl(true); sem("");
    try {
      var r = await NK.Api.Orders.mockPay(oi.id, { payMethod: "mock" });
      if (r.code===0) {
        ssp2(false);
        alert("\u652F\u4ED8\u6210\u529F");
        NK.Store.navigate("tradeRoom", { orderId: oi.id, source: "detail_buy" });
      } else sem(r.message || "\u652F\u4ED8\u5931\u8D25");
    } catch(e) { sem("\u7F51\u7EDC\u9519\u8BEF"); }
    finally { spl(false); }
  }

  function cls(){ ssc(false); ssp2(false); sem(""); }
  // Bargain sheet helpers
  function getBargainHint(offerVal, origPrice){
    if (!offerVal || isNaN(parseFloat(offerVal)) || parseFloat(offerVal) <= 0) return {text:'',color:''};
    var pct = parseFloat(offerVal) / parseFloat(origPrice) * 100;
    if (pct >= 90) return {text:'当前出价较合理哦～',color:'#52c41a'};
    if (pct >= 80) return {text:'这个价格卖家可能会考虑',color:'#fa8c16'};
    return {text:'当前出价偏低，建议适当提高',color:'#ff7875'};
  }
  function submitBargain(){
    setBargainError('');
    var price = parseFloat(bargainOffer);
    if (isNaN(price) || price <= 0 || price >= parseFloat(p.price)) {
      setBargainError('请输入低于原价的有效砍价金额'); return;
    }
    setBargainSubmitting(true);
    NK.Api.Bargains.create({ accountId: p.id, offerPrice: price, message: bargainMsg }).then(function(r){
      if (r && r.code === 0) {
        setShowBargainSheet(false);
        NK.Store.navigate("bargainSession", { id: r.data.id }, { replace: true });
      } else {
        setBargainError((r && r.message) || '发起失败');
      }
    }).catch(function(){ setBargainError('网络错误'); }).finally(function(){ setBargainSubmitting(false); });
  }
  function closeBargainSheet(){
    setShowBargainSheet(false);
    setBargainError('');
  }
  function cycleQuickText(){
    var next = (quickIdx + 1) % quickMessages.length;
    setQuickIdx(next);
    setBargainMsg(quickMessages[next]);
  }

  // Check favorite status on mount
  useEffect(function(){
    if (NK.Store.isLoggedIn() && pid) {
      console.log("[fav-debug] checking status for pid:", pid);
      NK.Api.Favorites.status(pid).then(function(r){
        console.log("[fav-debug] status response:", r);
        if (r && r.code===0) sfv(!!r.data.favorited);
      }).catch(function(e){ console.error("[fav-debug] status check failed:", e); });
    }
  }, [pid]);

  var toggleFav = function(){
    console.log("[fav-debug] favorite button clicked", { productId: pid, favorited: fv, api: !!(NK.Api && NK.Api.Favorites) });
    if (!NK.Store.isLoggedIn()) { alert("\u8BF7\u5148\u767B\u5F55"); return; }
    if (!pid) { alert("\u5546\u54C1\u4FE1\u606F\u5F02\u5E38"); return; }
    if (fv) {
      NK.Api.Favorites.remove(pid).then(function(r){
        if (r && r.code===0) { sfv(false); }
        else alert((r&&r.message)||"\u64CD\u4F5C\u5931\u8D25\uFF0C\u8BF7\u7A0D\u540E\u91CD\u8BD5");
      }).catch(function(){ alert("\u64CD\u4F5C\u5931\u8D25\uFF0C\u8BF7\u7A0D\u540E\u91CD\u8BD5"); });
    } else {
      NK.Api.Favorites.add(pid).then(function(r){
        if (r && r.code===0) { sfv(true); }
        else alert((r&&r.message)||"\u64CD\u4F5C\u5931\u8D25\uFF0C\u8BF7\u7A0D\u540E\u91CD\u8BD5");
      }).catch(function(){ alert("\u64CD\u4F5C\u5931\u8D25\uFF0C\u8BF7\u7A0D\u540E\u91CD\u8BD5"); });
    }
  };

  if (ld) {
    return React.createElement(DetailErrorBoundary, null,
      React.createElement("div",{className:"detail-page"},
        React.createElement("div",{className:"back-header"},
          React.createElement("div",{className:"bbtn",onClick:function(){NK.Store.back(isManage?"myProducts":"home");}},"\u2190"),
          React.createElement("div",{className:"btitle"},isManage?"\u7BA1\u7406\u5546\u54C1":"\u5546\u54C1\u8BE6\u60C5")
        ),
        React.createElement("div",{className:"page-loading"},
          React.createElement("div",{className:"spinner"}),
          React.createElement("div",{style:{color:"#999",fontSize:14}},"\u52A0\u8F7D\u4E2D...")
        )
      )
    );
  }

  if (!p) {
    return React.createElement("div",{className:"detail-page"},
      React.createElement("div",{className:"back-header"},
        React.createElement("div",{className:"bbtn",onClick:function(){NK.Store.back(isManage?"myProducts":"home");}},"\u2190"),
        React.createElement("div",{className:"btitle"},isManage?"\u7BA1\u7406\u5546\u54C1":"\u5546\u54C1\u8BE6\u60C5")
      ),
      React.createElement("div",{className:"empty-state"},
        React.createElement("div",{className:"eicon"},"\uD83D\uDE1E"),
        React.createElement("div",null,"\u5546\u54C1\u4E0D\u5B58\u5728\u6216\u5DF2\u4E0B\u67B6"),
        React.createElement("div",{style:{color:"#1677ff",marginTop:12,cursor:"pointer",fontSize:14},onClick:function(){NK.Store.back("home");}},"\u8FD4\u56DE\u9996\u9875")
      )
    );
  }

  return React.createElement(DetailErrorBoundary, null,
    React.createElement("div",{className:"detail-page"},
      React.createElement("div",{className:"back-header"},
        React.createElement("div",{className:"bbtn",onClick:function(){NK.Store.back(isManage?"myProducts":"home");}},"\u2190"),
        React.createElement("div",{className:"btitle"},isManage?"\u7BA1\u7406\u5546\u54C1":"\u5546\u54C1\u8BE6\u60C5")
      ),
      React.createElement(NK.ProductDetailView,{product:p,curImg:ci,setCurImg:sci}),
      React.createElement("div",{style:{height:80}}),
      // Bottom bar
      React.createElement("div",{className:"detail-bottom-bar"},
        isManage
          ? [
              React.createElement("button",{key:"edit",className:"buy-btn",style:{background:"linear-gradient(135deg,#1677ff,#4096ff)",flex:1},onClick:function(){
                NK.Store.navigate("publish",{editMode:true,productId:p.id});
              }},"\u7F16\u8F91\u5546\u54C1"),
              p.status===1 && React.createElement("button",{key:"off",className:"buy-btn",style:{background:"#f0f0f0",color:"#666",flex:1},onClick:function(){
                if(!confirm("\u786E\u8BA4\u4E0B\u67B6?"))return;
                NK.Api.Accounts.offShelf(p.id).then(function(r){
                  if(r&&r.code===0){alert("\u5DF2\u4E0B\u67B6");NK.Api.Accounts.myDetail(p.id).then(function(r2){if(r2&&r2.code===0)sp(r2.data);});}
                  else alert((r&&r.message)||"\u64CD\u4F5C\u5931\u8D25");
                }).catch(function(){alert("\u7F51\u7EDC\u9519\u8BEF");});
              }},"\u4E0B\u67B6\u5546\u54C1"),
              p.status===2 && React.createElement("button",{key:"repub",className:"buy-btn",style:{background:"linear-gradient(135deg,#1677ff,#4096ff)",flex:1},onClick:function(){
                NK.Store.navigate("publish",{editMode:true,productId:p.id});
              }},"\u91CD\u65B0\u53D1\u5E03")
            ]
          : [
              React.createElement("button",{
                key:"fav",
                type:"button",
                className:"buy-btn",
                style:{flex:"0 0 100px",background:"#fff",color:fv?"#ffb800":"#666",border:"1.5px solid "+(fv?"#ffb800":"#e0e0e0"),fontSize:14,fontWeight:600,display:"flex",alignItems:"center",justifyContent:"center",gap:4,cursor:"pointer",pointerEvents:"auto",position:"relative",zIndex:1},
                onClick:toggleFav
              },
                React.createElement("span",null,fv?"\u2665":"\u2661"),
                React.createElement("span",null,fv?"\u5DF2\u6536\u85CF":"\u6536\u85CF")
              ),
              React.createElement("button",{
                key:"bargain",
                type:"button",
                className:"buy-btn",
                style:{flex:"0 0 80px",background:"#fff",color:"#1677ff",border:"1.5px solid #1677ff",fontSize:14,fontWeight:600,display:"flex",alignItems:"center",justifyContent:"center",cursor:"pointer",pointerEvents:"auto",position:"relative",zIndex:1},
                onClick:function(){
                  if (!NK.Store.isLoggedIn()) { alert("\u8BF7\u5148\u767B\u5F55"); NK.Store.navigate("login"); return; }
                  if (p && p.seller_id === NK.Store.get("user").id) { alert("\u4E0D\u80FD\u5411\u81EA\u5DF1\u53D1\u5E03\u7684\u5546\u54C1\u53D1\u8D77\u780D\u4EF7"); return; }
                  setShowBargainSheet(true);
                }
              },"\u780D\u4EF7"),
              React.createElement("button",{key:"buy",className:"buy-btn",onClick:buy},"\u7ACB\u5373\u8D2D\u4E70")
            ]
      ),
            // Confirm order modal
      sc && React.createElement("div",{className:"dt-overlay",onClick:cls},
        React.createElement("div",{className:"dt-modal",onClick:function(e){e.stopPropagation();}},
          React.createElement("div",{className:"dt-modal-title"},"确认下单"),
          React.createElement("div",{className:"dt-modal-price"},fp(p.price)),
          React.createElement("div",{className:"dt-modal-hint"},"确认后将创建订单，请按交易流程完成付款。"),
          em && React.createElement("div",{style:{color:"#ff4d4f",fontSize:13,textAlign:"center",padding:"6px 0"}},em),
          React.createElement("div",{className:"dt-modal-actions"},
            React.createElement("button",{className:"dt-btn-cancel",onClick:cls},"取消"),
            React.createElement("button",{className:"dt-btn-confirm",onClick:confirmOrder,disabled:bl},bl?"下单中...":"确认下单")
          )
        )
      ),

      // Bargain bottom sheet
      showBargainSheet && p && React.createElement("div",{
        style:{position:"fixed",top:0,left:"50%",transform:"translateX(-50%)",width:"100%",maxWidth:"430px",height:"100%",zIndex:9999,display:"flex",flexDirection:"column",justifyContent:"flex-end"}
      },
        React.createElement("div",{onClick:closeBargainSheet,style:{position:"absolute",top:0,left:0,right:0,bottom:0,background:"rgba(15,23,42,0.4)",backdropFilter:"blur(4px)",WebkitBackdropFilter:"blur(4px)"}}),
        React.createElement("div",{style:{position:"relative",background:"#fff",borderRadius:"24px 24px 0 0",maxHeight:"76vh",overflowY:"auto",padding:"0 0 16px",boxShadow:"0 -8px 30px rgba(0,0,0,0.15)",animation:"dt-scale-in 180ms ease-out"}},
          // Title bar
          React.createElement("div",{style:{padding:"18px 20px 6px",display:"flex",alignItems:"flex-start",justifyContent:"space-between"}},
            React.createElement("div",null,
              React.createElement("div",{style:{fontSize:22,fontWeight:700,color:"#5c3d2e"}},"发起砍价"),
              React.createElement("div",{style:{fontSize:11,color:"#b8956a",marginTop:2}},"砍价成功后，买卖双方可继续协商")
            ),
            React.createElement("div",{onClick:closeBargainSheet,style:{width:30,height:30,borderRadius:"50%",background:"#f0f0f0",display:"flex",alignItems:"center",justifyContent:"center",fontSize:16,color:"#999",cursor:"pointer",flexShrink:0}},"×")
          ),
          // Product card
          React.createElement("div",{style:{margin:"6px 20px",padding:"10px 12px",background:"#fafaf5",borderRadius:12,display:"flex",gap:10,alignItems:"center"}},
            (p.coverImages&&p.coverImages[0]&&p.coverImages[0].image_url)
              ? React.createElement("img",{src:p.coverImages[0].image_url,style:{width:44,height:44,borderRadius:10,objectFit:"cover",flexShrink:0},onError:function(e){e.target.style.display="none"}})
              : React.createElement("div",{style:{width:44,height:44,borderRadius:10,background:"#f0f0f0",display:"flex",alignItems:"center",justifyContent:"center",color:"#bbb",fontSize:18,flexShrink:0}},"☆"),
            React.createElement("div",{style:{flex:1,minWidth:0}},
              React.createElement("div",{style:{fontSize:13,fontWeight:600,color:"#333",overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"}},p.title),
              React.createElement("div",{style:{fontSize:11,color:"#999",marginTop:2}},p.server || ''),
              React.createElement("div",{style:{fontSize:14,fontWeight:700,color:"#ff4d4f",marginTop:2}},"原价 ¥" + Number(p.price).toFixed(2))
            )
          ),
          // Rules tip
          React.createElement("div",{style:{margin:"0 20px 6px",padding:"8px 10px",background:"#fffbe6",borderRadius:10,fontSize:11,color:"#8c6d00",lineHeight:1.5}},
            "砍价应由买卖双方合理议价、友好协商。达成后请在规定时间内完成支付，超时将失效。"
          ),
          // Price area
          (function(){
            var origPrice = Number(p.price);
            var minPrice = Math.floor(origPrice * 0.7);
            var maxPrice = Math.floor(origPrice) - 1;
            if (maxPrice <= minPrice) { minPrice = Math.max(1, maxPrice - 10); }
            var rangeTotal = maxPrice - minPrice || 1;
            var snapThreshold = Math.max(1, Math.floor(origPrice * 0.005));
            var snapPoints = [
              {v:Math.floor(origPrice*0.75),l:"7.5折",c:"#ff4d4f"},
              {v:Math.floor(origPrice*0.8) ,l:"8折",c:"#fa8c16"},
              {v:Math.floor(origPrice*0.85),l:"8.5折",c:"#fadb14"},
              {v:Math.floor(origPrice*0.9) ,l:"9折",c:"#73d13d"},
              {v:Math.floor(origPrice*0.95),l:"9.5折",c:"#52c41a"}
            ];
            function dotPos(val){ return Math.max(0, Math.min(100, ((val - minPrice) / rangeTotal) * 100)); }
            function dotEl(val,label,color){
              var pos = dotPos(val);
              return React.createElement("div",{style:{position:"absolute",left:pos+"%",top:"50%",transform:"translate(-50%,-50%)",fontSize:10,color:color,fontWeight:600,whiteSpace:"nowrap"}},label);
            }
            function snapPrice(val){
              for (var i = 0; i < snapPoints.length; i++) {
                if (Math.abs(val - snapPoints[i].v) <= snapThreshold) return snapPoints[i].v;
              }
              return val;
            }
            function handleSliderChange(val){
              var snapped = snapPrice(val);
              setBargainOffer(String(snapped));
            }
            function handleTextChange(raw){
              if (raw === '') { setBargainOffer(''); return; }
              var clean = raw.replace(/\D/g, '');
              if (clean === '') return;
              var n = parseInt(clean);
              if (!isNaN(n)) setBargainOffer(String(n));
            }
            return React.createElement("div",{style:{margin:"6px 20px",padding:"14px",background:"#fff",borderRadius:14,border:"1px solid #f0e8d8"}},
              React.createElement("div",{style:{fontSize:11,color:"#999",marginBottom:4}},"原价 ¥" + origPrice.toFixed(2)),
              React.createElement("div",{style:{display:"flex",alignItems:"baseline",justifyContent:"center",padding:"8px 0"}},
                React.createElement("span",{style:{fontSize:26,fontWeight:700,color:bargainOffer?"#333":"#ccc",marginRight:4}},"¥"),
                React.createElement("input",{type:"text",inputMode:"numeric",pattern:"[0-9]*",placeholder:"请输入砍价金额",value:bargainOffer,
                  onChange:function(e){handleTextChange(e.target.value);},
                  style:{width:bargainOffer?String(bargainOffer.length*26+16)+"px":"160px",minWidth:"130px",border:"none",outline:"none",fontSize:bargainOffer?42:18,fontWeight:700,color:bargainOffer?"#333":"#ccc",textAlign:"center",background:"transparent",padding:0}
                })
              ),
              (function(){var ht=getBargainHint(bargainOffer,origPrice);return ht.text?React.createElement("div",{style:{textAlign:"center",fontSize:11,color:ht.color,marginBottom:6}},ht.text):null;})(),
              React.createElement("div",{style:{padding:"0 2px",position:"relative"}},
                React.createElement("input",{type:"range",min:minPrice,max:maxPrice,step:1,value:parseInt(bargainOffer)||minPrice,
                  onChange:function(e){handleSliderChange(parseInt(e.target.value));},
                  style:{width:"100%",height:5,WebkitAppearance:"none",appearance:"none",background:"linear-gradient(90deg, #ff4d4f 0%, #fadb14 50%, #52c41a 100%)",borderRadius:3,outline:"none",cursor:"pointer"}
                }),
                React.createElement("div",{style:{position:"relative",height:14,margin:"2px 0 2px"}},
                  snapPoints.map(function(sp){
                    if (sp.v < minPrice || sp.v > maxPrice) return null;
                    return dotEl(sp.v, sp.l, sp.c);
                  })
                ),
                React.createElement("div",{style:{display:"flex",justifyContent:"space-between",fontSize:10,color:"#bbb",marginTop:2}},
                  React.createElement("span",null,"¥" + minPrice),
                  React.createElement("span",null,"¥" + maxPrice)
                )
              )
            );
          })(),
          // Message area (read-only, preset only)
          React.createElement("div",{style:{margin:"6px 20px",padding:"12px",background:"#fff",borderRadius:12,border:"1px solid #f0e8d8"}},
            React.createElement("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between",marginBottom:6}},
              React.createElement("div",{style:{fontSize:12,fontWeight:600,color:"#5c3d2e"}},"💬 给卖家留言"),
              React.createElement("div",{onClick:cycleQuickText,style:{fontSize:11,color:"#1677ff",cursor:"pointer",userSelect:"none"}},"换一个")
            ),
            React.createElement("div",{style:{width:"100%",borderRadius:8,background:"#f8f6f0",padding:10,fontSize:13,color:"#333",minHeight:44,lineHeight:1.5,boxSizing:"border-box",wordBreak:"break-word"}},bargainMsg || "点击“换一个”选择留言"),
            
          ),
          // Error
          bargainError && React.createElement("div",{style:{color:"#ff4d4f",fontSize:12,textAlign:"center",margin:"4px 20px"}},bargainError),
          // Submit button
          React.createElement("div",{style:{padding:"10px 20px 0"}},
            React.createElement("button",{onClick:submitBargain,disabled:bargainSubmitting,
              style:{width:"100%",padding:"14px",borderRadius:14,border:"none",background:bargainSubmitting?"#f5c89a":"linear-gradient(135deg, #ff8c42, #f7a94e)",color:"#fff",fontSize:16,fontWeight:700,cursor:bargainSubmitting?"not-allowed":"pointer",letterSpacing:1}
            }, bargainSubmitting ? "发起中..." : "立即发起")
          )
        )
      ),
    )
  );
}

window.NK = window.NK || {};
NK.ProductDetailPage = ProductDetailPage;
