// Full pricing recap table — excursions + vehicles + concierge
window.PricingTable=function PricingTable({lang,excursions,vehicles}){
  const t=useT(lang);
  const fr=lang==="fr";
  const rows=[
    {h:fr?"Excursions":"Excursions",items:excursions.map(e=>({
      n:fr?e.titleFR:e.titleEN,d:e.duration,p:fmtMUR(e.price,lang)+t.per_pax}))},
    {h:fr?"Location véhicules":"Vehicle rental",items:vehicles.map(v=>({
      n:fr?v.titleFR:v.titleEN,d:v.type,p:fmtMUR(v.price,lang)+t.per_day}))},
    {h:fr?"Conciergerie":"Concierge",items:PRICING_PLANS.map(p=>({
      n:fr?p.nameFR:p.nameEN,
      d:fr?"Résident / Locataire":"Resident / Tenant",
      p:p.resident+" / "+p.tenant+" MUR · "+(fr?"jour":"day")}))}
  ];
  return (
    <table className="price-table">
      <thead>
        <tr>
          <th>{fr?"Prestation":"Service"}</th>
          <th>{fr?"Détails":"Details"}</th>
          <th style={{textAlign:"right"}}>{fr?"Tarif":"Rate"}</th>
        </tr>
      </thead>
      <tbody>
        {rows.map((g,gi)=>(
          <React.Fragment key={gi}>
            <tr><td colSpan={3} style={{background:"var(--lagoon-3)",fontWeight:600,color:"var(--lagoon-2)",fontSize:12,letterSpacing:".18em",textTransform:"uppercase"}}>{g.h}</td></tr>
            {g.items.map((r,i)=>(
              <tr key={i}>
                <td><b style={{fontFamily:"var(--sans)",fontSize:15,color:"var(--ink)"}}>{r.n}</b></td>
                <td style={{color:"var(--muted)"}}>{r.d}</td>
                <td style={{textAlign:"right"}}><b>{r.p}</b></td>
              </tr>
            ))}
          </React.Fragment>
        ))}
      </tbody>
    </table>
  );
};
