/* =============================================================
   KASDAP ONE — CHECKOUT  (B2B trade RFQ)
============================================================= */
const { useState: useStateCO } = React;

function CheckoutScreen() {
  const { cartDetail, user, placeOrder, clearCart, go, toast, pricing } = useStore();
  const { b2b, b2bSub, subtotal, gst, total, count } = cartDetail;
  const [addr, setAddr] = useStateCO({
    name:  user ? (user.org  || user.name  || '') : '',
    email: user ? (user.email || '') : '',
    phone: user ? (user.phone || '') : '',
    line:  '',
    city:  user ? (user.city || '') : '',
    pin:   '',
    gst:   user ? (user.gst  || '') : '',
    po:    '',
  });
  const [placed, setPlaced] = useStateCO(null);
  const set = (k, v) => setAddr(a => ({ ...a, [k]: v }));

  if (count === 0 && !placed) return React.createElement('div', { className: 'page-wrap' },
    React.createElement('div', { style: { textAlign: 'center', padding: '70px 20px', color: 'var(--text-3)' } },
      React.createElement('div', { className: 'be-ic', style: { width: 64, height: 64, margin: '0 auto 18px' } }, React.createElement(Icon, { name: 'cart', size: 28 })),
      React.createElement('h2', { style: { fontSize: '1.4rem', color: 'var(--text-2)' } }, 'Your basket is empty'),
      React.createElement('p', { style: { margin: '8px 0 22px' } }, 'Add products to your B2B order and request a quote.'),
      React.createElement('button', { className: 'btn btn-accent btn-lg', onClick: () => go('catalog') }, React.createElement(Icon, { name: 'pill', size: 16 }), 'Browse catalogue'))
  );

  if (placed) return React.createElement('div', { className: 'page-wrap' },
    React.createElement('div', { className: 'card card-pad', style: { maxWidth: 560, margin: '20px auto' } },
      React.createElement('div', { className: 'ok-card' },
        React.createElement('div', { className: 'ok-ring' }, React.createElement(Icon, { name: 'check', size: 36 })),
        React.createElement('h2', { style: { fontSize: '1.5rem' } }, 'Quote requested!'),
        React.createElement('p', { className: 'muted', style: { marginTop: 8 } }, 'Our trade desk will share final pricing within 4 working hours.'),
        React.createElement('div', { style: { margin: '20px 0', padding: 16, borderRadius: 12, background: 'var(--surface-2)', border: '1px solid var(--line)' } },
          React.createElement('div', { className: 'eyebrow' }, 'Reference'),
          React.createElement('div', { className: 'mono', style: { fontSize: '1.3rem', fontWeight: 700, marginTop: 4 } }, placed.id),
          React.createElement('div', { className: 'muted', style: { fontSize: '.84rem', marginTop: 6 } }, fmt(placed.total) + ' · ' + placed.lines.length + ' line items')),
        React.createElement('div', { style: { display: 'flex', gap: 10, justifyContent: 'center' } },
          React.createElement('button', { className: 'btn btn-ghost', onClick: () => go('catalog') }, 'Continue shopping'),
          React.createElement('button', { className: 'btn btn-accent', onClick: () => go('order', { id: placed.id }) }, React.createElement(Icon, { name: 'truck', size: 16 }), 'Track order')))
    )
  );

  const doPlace = () => {
    if (!b2b.length) return;
    const order = placeOrder('rfq', { mode: 'b2b', lines: b2b, total: Math.round((b2bSub * (1 + pricing.gst)) * 100) / 100, address: addr });
    clearCart();
    setPlaced(order);
    toast('Quote request submitted', 'ok');
  };

  const LineList = (lines) => React.createElement('div', { className: 'co-section' },
    React.createElement('div', { className: 'csh' },
      React.createElement('span', { className: 'csn', style: { background: 'var(--indigo-soft)', color: 'var(--indigo)' } }, React.createElement(Icon, { name: 'building', size: 14 })),
      React.createElement('h3', null, 'Trade items (B2B)'),
      React.createElement('span', { className: 'tag' }, lines.length + ' lines · request quote')),
    React.createElement('div', { className: 'co-lines' },
      lines.map(l => React.createElement('div', { className: 'co-line', key: l.handle + l.mode },
        React.createElement(ProductImage, { p: l.p, className: 'pimg' }),
        React.createElement('div', { className: 'cl-mid' },
          React.createElement('div', { className: 'cl-name' }, l.p.name),
          React.createElement('div', { className: 'cl-meta' }, l.qty + ' × ' + fmt(l.pr.packPrice) + ' / pack · ' + l.p.packing)),
        React.createElement('div', { className: 'cl-amt' }, fmt(l.lineTotal))))
    )
  );

  return React.createElement('div', { className: 'page-wrap' },
    React.createElement('div', { className: 'crumb' },
      React.createElement('button', { onClick: () => go('catalog') }, React.createElement(Icon, { name: 'back', size: 14 }), 'Catalogue'),
      React.createElement(Icon, { name: 'chevron', size: 13 }), React.createElement('span', { style: { color: 'var(--text-2)' } }, 'Request Quote')),
    React.createElement('h1', { style: { fontSize: '1.8rem', marginBottom: 4 } }, 'Request a quote'),
    React.createElement('p', { className: 'muted', style: { marginBottom: 22, fontSize: '.9rem' } }, 'Submit your bulk requirement and our trade desk will confirm final pricing within 4 working hours.'),
    React.createElement('div', { className: 'co' },
      React.createElement('div', null,
        b2b.length > 0 && LineList(b2b),
        /* business details */
        React.createElement('div', { className: 'co-section' },
          React.createElement('div', { className: 'csh' },
            React.createElement('span', { className: 'csn' }, React.createElement(Icon, { name: 'map', size: 14 })),
            React.createElement('h3', null, 'Business & delivery details')),
          React.createElement('div', { className: 'form-grid' },
            React.createElement('div', { className: 'field' },
              React.createElement('label', null, 'Business name'),
              React.createElement('input', { className: 'input', value: addr.name, onChange: e => set('name', e.target.value), placeholder: 'Organisation / firm name' })),
            React.createElement('div', { className: 'field' },
              React.createElement('label', null, 'Email'),
              React.createElement('input', { className: 'input', type: 'email', value: addr.email, onChange: e => set('email', e.target.value), placeholder: 'you@example.com' })),
            React.createElement('div', { className: 'field' },
              React.createElement('label', null, 'Phone'),
              React.createElement('input', { className: 'input', value: addr.phone, onChange: e => set('phone', e.target.value), placeholder: '+91 98765 43210' })),
            React.createElement('div', { className: 'field' },
              React.createElement('label', null, 'City'),
              React.createElement('input', { className: 'input', value: addr.city, onChange: e => set('city', e.target.value), placeholder: 'e.g. Mumbai' })),
            React.createElement('div', { className: 'field full' },
              React.createElement('label', null, 'Delivery address'),
              React.createElement('input', { className: 'input', value: addr.line, onChange: e => set('line', e.target.value), placeholder: 'Street, area, landmark' })),
            React.createElement('div', { className: 'field' },
              React.createElement('label', null, 'PIN code'),
              React.createElement('input', { className: 'input', value: addr.pin, onChange: e => set('pin', e.target.value), placeholder: '400001' })),
            React.createElement('div', { className: 'field' },
              React.createElement('label', null, 'GSTIN'),
              React.createElement('input', { className: 'input mono', value: addr.gst, onChange: e => set('gst', e.target.value.toUpperCase()), placeholder: '27ABCDE1234F1Z5', maxLength: 15 })),
            React.createElement('div', { className: 'field full' },
              React.createElement('label', null, 'PO number ', React.createElement('span', { className: 'opt-tag' }, 'optional')),
              React.createElement('input', { className: 'input', value: addr.po, onChange: e => set('po', e.target.value), placeholder: 'Internal purchase order reference' }))
          )
        )
      ),
      /* summary aside */
      React.createElement('div', { className: 'co-aside' },
        React.createElement('div', { className: 'card card-pad' },
          React.createElement('div', { className: 'card-title', style: { marginBottom: 16 } }, 'Order summary'),
          React.createElement('div', { className: 'sumrow' }, React.createElement('span', null, React.createElement(Icon, { name: 'building', size: 13, style: { color: 'var(--indigo)', verticalAlign: -2, marginRight: 5 } }), 'B2B subtotal'), React.createElement('span', { className: 'v' }, fmt(b2bSub))),
          React.createElement('div', { className: 'sumrow' }, React.createElement('span', null, 'GST (' + Math.round(pricing.gst * 100) + '%)'), React.createElement('span', { className: 'v' }, fmt(gst))),
          React.createElement('div', { className: 'sumrow' }, React.createElement('span', null, 'Shipping'), React.createElement('span', { className: 'v', style: { color: 'var(--emerald)' } }, 'FREE')),
          React.createElement('div', { className: 'sumrow tot' }, React.createElement('span', null, 'Indicative total'), React.createElement('span', { className: 'v' }, fmt(total))),
          React.createElement('button', { className: 'btn btn-accent btn-block btn-lg', style: { marginTop: 16 }, onClick: doPlace },
            React.createElement(Icon, { name: 'receipt', size: 16 }), 'Submit quote request'),
          React.createElement('div', { className: 'secure' }, React.createElement(Icon, { name: 'shieldCheck', size: 13 }), '256-bit SSL · GST invoice included'),
          React.createElement('div', { style: { marginTop: 14, paddingTop: 14, borderTop: '1px solid var(--line)', fontSize: '.72rem', color: 'var(--text-3)', display: 'flex', gap: 8 } },
            React.createElement(Icon, { name: 'shield', size: 15, style: { flexShrink: 0 } }),
            'Prescription medicines are dispensed by a licensed pharmacy partner against a valid Rx.')
        )
      )
    )
  );
}
Object.assign(window, { CheckoutScreen });
