/* BrowserMock.jsx — small faux product screenshot (Mews/Pleo style) */
function BrowserMock({ product = 'mews' }) {
  return (
    <div className="browser">
      <div className="bar">
        <i></i><i></i><i></i>
        <div className="bar-title">app.{product}.com — Group reservations</div>
      </div>
      <div className="toolbar">
        <div className="product">
          {product === 'mews' ? 'Mews' : 'Pleo'}{' · '}
          <span style={{ color: '#979797', fontWeight: 400 }}>UATest01 + 02 2024</span>
        </div>
        <div className="actions">
          <span className="pill"></span>
          <span className="pill"></span>
          <span className="pill"></span>
        </div>
      </div>
      <div className="summary">
        <div className="col">
          <label>Block</label>
          <div className="val">220 · 1432 · 252</div>
        </div>
        <div className="col">
          <label>Value</label>
          <div className="val">
            <span className="accent">115 343</span> · 2 138 030 €
          </div>
        </div>
      </div>
      <table>
        <thead>
          <tr>
            <th>Room type</th><th className="num">Pickup</th><th className="num">Tu</th><th className="num">We</th><th className="num">Th</th><th className="num">Fr</th><th className="num">Sa</th>
          </tr>
        </thead>
        <tbody>
          <tr><td>Superior</td><td className="num">12.4</td><td className="num">1240</td><td className="num">844</td><td className="num">811</td><td className="num">811</td><td className="num">811</td></tr>
          <tr><td>Deluxe</td><td className="num">7.2</td><td className="num">1432</td><td className="num">812</td><td className="num">811</td><td className="num">812</td><td className="num">812</td></tr>
          <tr><td>Suite</td><td className="num">2.1</td><td className="num">622</td><td className="num">812</td><td className="num">811</td><td className="num">812</td><td className="num">812</td></tr>
          <tr><td>Penthouse</td><td className="num">0.8</td><td className="num">844</td><td className="num">813</td><td className="num">811</td><td className="num">812</td><td className="num">812</td></tr>
        </tbody>
      </table>
    </div>
  );
}
window.BrowserMock = BrowserMock;