// Side-by-side price comparison: traditional study office vs Daoob AI agent
// Reads s.daoob (the AI agent price) and s.price (the market price string).

const PriceCompare = ({ s, t, compact = false }) => {
  const c = t.services.compare;

  // Parse market office price (e.g. "12,500 SAR") and the AI price from the data.
  const officeN = parseInt((s.price.match(/[\d,]+/) || ["0"])[0].replace(/,/g, ""), 10);
  const aiN = s.daoob || 500;
  const savingsPct = officeN > 0 ? Math.round(((officeN - aiN) / officeN) * 100) : 0;
  const lang = (t.locale === "ar") ? "ar" : "en";
  const curr = lang === "ar" ? "ر.س" : "SAR";
  const aiPriceLabel = `${aiN.toLocaleString()} ${curr}`;

  return (
    <div className={"price-compare" + (compact ? " price-compare-compact" : "")}>
      <div className="pc-row pc-office">
        <div className="pc-info">
          <span className="pc-label">{c.office_t}</span>
          <span className="pc-lead">{s.lead}</span>
        </div>
        <span className="pc-price">{s.price}</span>
      </div>
      <div className="pc-row pc-ai">
        <div className="pc-info">
          <span className="pc-label">{c.ai_t}</span>
          <span className="pc-lead">{c.ai_lead}</span>
        </div>
        <span className="pc-price">{aiPriceLabel}</span>
      </div>
      {savingsPct >= 40 && !compact && (
        <div className="pc-savings">{c.savings_label} {savingsPct}%</div>
      )}
    </div>
  );
};

Object.assign(window, { PriceCompare });