// Shared services catalog + purchased-services persistence
// localStorage keys: rl-services (owned ids), rl-user (name), rl-records (per-service saved items)

const RL_SERVICES = [
  { id: "receptionist", name: "AI Receptionist", price: "$99/mo",
    tag: "Never miss a call",
    desc: "Answers your phone 24/7 and books jobs while you're on the roof.",
    icon: "M22 16.9v3a2 2 0 0 1-2.2 2 19.8 19.8 0 0 1-8.6-3.1 19.5 19.5 0 0 1-6-6A19.8 19.8 0 0 1 2.1 4.2 2 2 0 0 1 4.1 2h3a2 2 0 0 1 2 1.7c.1 1 .4 2 .7 2.9a2 2 0 0 1-.5 2.1L8 10a16 16 0 0 0 6 6l1.3-1.3a2 2 0 0 1 2.1-.5c.9.3 1.9.6 2.9.7a2 2 0 0 1 1.7 2z" },
  { id: "proposals", name: "AI Proposals", price: "$20 each",
    tag: "Win more jobs",
    desc: "Tell it the job, get a professional proposal in 2 minutes. We save every one for you.",
    icon: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8zM14 2v6h6M16 13H8M16 17H8M10 9H8" },
  { id: "contracts", name: "AI Contracts", price: "$15 each",
    tag: "Sign faster",
    desc: "Ready-to-sign contracts written for roofing jobs in your state.",
    icon: "M20 6L9 17l-5-5" },
  { id: "growth", name: "Website + Leads", price: "$500/mo",
    tag: "Get more jobs",
    desc: "A professional website built for you, plus quality leads every week.",
    icon: "M3 12l9-8 9 8M5 10v10h14V10" },
];

function rlLoadServices() {
  try { return JSON.parse(localStorage.getItem("rl-services") || "[]"); } catch { return []; }
}
function rlSaveServices(ids) {
  try { localStorage.setItem("rl-services", JSON.stringify(ids)); } catch {}
}
function rlLoadUser() {
  try { return localStorage.getItem("rl-user") || ""; } catch { return ""; }
}
function rlSaveUser(name) {
  try { localStorage.setItem("rl-user", name); } catch {}
}
function rlLoadRecords() {
  try { return JSON.parse(localStorage.getItem("rl-records") || "{}"); } catch { return {}; }
}
function rlAddRecord(serviceId, rec) {
  const all = rlLoadRecords();
  all[serviceId] = [rec, ...(all[serviceId] || [])];
  try { localStorage.setItem("rl-records", JSON.stringify(all)); } catch {}
  return all;
}

const GoogleG = ({ size = 18 }) => (
  <svg width={size} height={size} viewBox="0 0 48 48" aria-hidden="true">
    <path fill="#EA4335" d="M24 9.5c3.5 0 6.6 1.2 9.1 3.6l6.8-6.8C35.7 2.4 30.2 0 24 0 14.6 0 6.5 5.4 2.6 13.2l7.9 6.2C12.4 13.6 17.7 9.5 24 9.5z"/>
    <path fill="#4285F4" d="M46.5 24.5c0-1.6-.1-3.1-.4-4.5H24v9h12.7c-.6 3-2.3 5.5-4.8 7.2l7.7 6c4.5-4.2 6.9-10.3 6.9-17.7z"/>
    <path fill="#FBBC05" d="M10.5 28.6c-.5-1.5-.8-3-.8-4.6s.3-3.1.8-4.6l-7.9-6.2C.9 16.5 0 20.1 0 24s.9 7.5 2.6 10.8l7.9-6.2z"/>
    <path fill="#34A853" d="M24 48c6.2 0 11.4-2 15.2-5.6l-7.7-6c-2.1 1.4-4.8 2.3-7.5 2.3-6.3 0-11.6-4.1-13.5-9.9l-7.9 6.2C6.5 42.6 14.6 48 24 48z"/>
  </svg>
);

Object.assign(window, {
  RL_SERVICES, GoogleG,
  rlLoadServices, rlSaveServices, rlLoadUser, rlSaveUser, rlLoadRecords, rlAddRecord,
});