/* ============================================================
   AGENZIA PRINCIPE 2 — Dettaglio servizio (template)
   ============================================================ */
(function (w) {
  const Icon = w.Icon;
  const { Btn, ServiceCard, Accordion, CTABand } = w.UI;
  const { SERVICES, CATEGORIES, INSURANCE_PARTNERS, CONTACT: C } = w.AP2;

  function catLabel(id) { const c = CATEGORIES.find((x) => x.id === id); return c ? c.label : ""; }

  function Servizio({ param }) {
    const svc = SERVICES.find((s) => s.slug === param) || SERVICES[0];
    const related = SERVICES.filter((s) => s.cat === svc.cat && s.slug !== svc.slug).slice(0, 3);
    const faqs = svc.partners ? [
      { q: "Quanto costa la polizza RC?", a: "Il premio dipende dal veicolo, dal profilo del conducente e dalla classe di merito. Confrontiamo gratuitamente le compagnie partner e ti proponiamo il preventivo più conveniente, senza impegno." },
      { q: "Posso mantenere la mia classe di merito?", a: "Sì. Con l’attestato di rischio recuperiamo la tua classe di merito e, dove applicabile, sfruttiamo la legge Bersani per ottenere condizioni migliori, anche su un secondo veicolo in famiglia." },
      { q: "Fate da agenzia o da intermediari?", a: "Siamo intermediari: non vendiamo un solo marchio, ma confrontiamo le proposte di più compagnie partner per trovare la polizza più adatta a te. Un unico interlocutore, qui in sede." },
      { q: "Coprite anche le moto?", a: "Certo: troviamo la RC più conveniente sia per auto sia per moto tra le nostre compagnie partner." },
    ] : [
      { q: "Quanto costa la pratica?", a: "Il costo dipende dal tipo di veicolo e dalla pratica specifica. Ti forniamo un preventivo chiaro e dettagliato in giornata: chiamaci o scrivici per conoscere tempi e importi." },
      { q: "Posso delegarvi l’intera procedura?", a: "Sì. Con una semplice delega ci occupiamo di tutto l’iter presso gli enti competenti. Tu porti i documenti, al resto pensiamo noi." },
      { q: "Serve appuntamento?", a: "Per molte pratiche puoi passare direttamente in agenzia in Via Beaulard 35. Per alcuni servizi, come il rinnovo patente con medico in sede, è meglio prenotare." },
    ];

    return React.createElement(React.Fragment, null,
      // hero
      React.createElement("section", { className: "page-hero" },
        React.createElement("div", { className: "container" },
          React.createElement("div", { className: "breadcrumb reveal" },
            React.createElement("a", { href: "/", onClick: w.UI.navClick("home") }, "Home"),
            React.createElement("span", { className: "sep" }, "/"),
            React.createElement("a", { href: "/servizi", onClick: w.UI.navClick("servizi") }, "Servizi"),
            React.createElement("span", { className: "sep" }, "/"),
            React.createElement("span", null, svc.title)),
          React.createElement("div", { className: "svc-hero-head", style: { display: "flex", gap: 20, alignItems: "flex-start", marginTop: 14 } },
            React.createElement("div", { className: "reveal reveal-d1", style: { width: 64, height: 64, borderRadius: 18, background: "var(--red-600)", color: "#fff", display: "flex", alignItems: "center", justifyContent: "center", flex: "none", boxShadow: "var(--sh-red)" } },
              React.createElement(Icon, { name: svc.icon, size: 32 })),
            React.createElement("div", null,
              React.createElement("span", { className: "tag tag--red reveal", style: { marginBottom: 12 } }, catLabel(svc.cat)),
              React.createElement("h1", { className: "reveal reveal-d1", style: { marginTop: 12 } }, svc.title, " a Torino"))),
          React.createElement("p", { className: "reveal reveal-d2" }, svc.intro),
          React.createElement("div", { className: "reveal reveal-d3", style: { marginTop: 26, display: "flex", gap: 13, flexWrap: "wrap" } },
            React.createElement(Btn, { to: "contatti", variant: "primary", arrow: true }, "Richiedi questa pratica"),
            React.createElement(Btn, { href: "https://wa.me/" + C.mobileHref.replace("+", ""), variant: "ghost", icon: "whatsapp" }, "Scrivici su WhatsApp"))
        )
      ),
      // body
      React.createElement("section", { className: "section" },
        React.createElement("div", { className: "container" },
          React.createElement("div", { className: "detail-grid" },
            // main
            React.createElement("div", { className: "detail-main reveal" },
              React.createElement("h2", null, "A chi è rivolto"),
              React.createElement("p", null, svc.aChi),

              React.createElement("h2", null, "Documenti necessari"),
              React.createElement("div", { className: "doc-list" },
                svc.documenti.map((d, i) =>
                  React.createElement("div", { className: "doc-item", key: i },
                    React.createElement("span", { className: "dci" }, React.createElement(Icon, { name: "check", size: 15 })),
                    React.createElement("span", null, d)))),
              React.createElement("p", { className: "caption", style: { marginTop: 12 } }, "L’elenco può variare in base al caso specifico: in fase di verifica ti diciamo subito se serve altro."),

              React.createElement("h2", null, "Come funziona"),
              React.createElement("div", { className: "detail-steps" },
                svc.steps.map((s, i) =>
                  React.createElement("div", { className: "ds", key: i },
                    React.createElement("div", { className: "dn" }, i + 1),
                    React.createElement("div", { className: "dt" }, s)))),

              React.createElement("h2", null, "Domande frequenti"),
              React.createElement(Accordion, { items: faqs })
            ),
            // aside
            React.createElement("aside", { className: "detail-aside reveal reveal-d1" },
              React.createElement("div", { className: "aside-card" },
                React.createElement("h3", { className: "h4", style: { marginBottom: 6 } }, "In sintesi"),
                React.createElement("div", { className: "info-row" },
                  React.createElement("span", { className: "iri" }, React.createElement(Icon, { name: "clock", size: 19 })),
                  React.createElement("div", null, React.createElement("div", { className: "irl" }, "Tempi indicativi"), React.createElement("div", { className: "irv" }, svc.tempi))),
                React.createElement("div", { className: "info-row" },
                  React.createElement("span", { className: "iri" }, React.createElement(Icon, { name: "pin", size: 19 })),
                  React.createElement("div", null, React.createElement("div", { className: "irl" }, "Dove" ), React.createElement("div", { className: "irv" }, "Via Beaulard 35, Torino"))),
                React.createElement("div", { className: "info-row" },
                  React.createElement("span", { className: "iri" }, React.createElement(Icon, { name: "headset", size: 19 })),
                  React.createElement("div", null, React.createElement("div", { className: "irl" }, "Assistenza"), React.createElement("div", { className: "irv" }, "Referente dedicato")))
              ),
              React.createElement("div", { className: "aside-card" },
                React.createElement("h3", { className: "h4", style: { marginBottom: 16 } }, "Perché affidarti a noi"),
                React.createElement("ul", { className: "vantaggi-list" },
                  svc.vantaggi.map((v, i) =>
                    React.createElement("li", { key: i },
                      React.createElement("span", { className: "vci" }, React.createElement(Icon, { name: "check", size: 13 })),
                      React.createElement("span", null, v))))
              ),
              React.createElement("div", { className: "aside-card dark" },
                React.createElement("h3", { className: "h4", style: { marginBottom: 8 } }, "Iniziamo la tua pratica"),
                React.createElement("p", { style: { fontSize: ".96rem", marginBottom: 18, color: "#A7B0BC" } }, "Preventivo chiaro su tempi e costi, in giornata."),
                React.createElement(Btn, { to: "contatti", variant: "primary", block: true, arrow: true }, "Richiedi informazioni"),
                React.createElement("a", { href: "tel:" + C.phoneHref, className: "btn btn--ghost-ondark btn--block", style: { marginTop: 10 } },
                  React.createElement(Icon, { name: "phone", size: 17 }), React.createElement("span", null, C.phone)))
            )
          )
        )
      ),
      // compagnie partner (solo assicurazioni)
      svc.partners && React.createElement("section", { className: "section section--alt" },
        React.createElement("div", { className: "container" },
          React.createElement("div", { className: "section-head text-center reveal", style: { marginInline: "auto", marginBottom: 38 } },
            React.createElement("span", { className: "eyebrow" }, "Intermediazione assicurativa"),
            React.createElement("h2", { className: "h2", style: { marginTop: 16 } }, "Le nostre compagnie partner"),
            React.createElement("p", null, "Confrontiamo le proposte di compagnie assicurative selezionate per offrirti la polizza RC più conveniente, con un unico interlocutore in sede.")),
          React.createElement("div", { className: "partner-grid reveal reveal-d1" },
            INSURANCE_PARTNERS.map((p, i) =>
              React.createElement("div", { className: "partner-chip", key: i },
                React.createElement("span", { className: "pw" }, p.name),
                p.sub && React.createElement("span", { className: "pw-sub" }, p.sub)))),
          React.createElement("p", { className: "caption text-center reveal", style: { marginTop: 22 } }, "Marchi dei rispettivi titolari, a scopo illustrativo."))
      ),
      // related
      related.length > 0 && React.createElement("section", { className: "section section--alt" },
        React.createElement("div", { className: "container" },
          React.createElement("div", { className: "section-head reveal", style: { marginBottom: 32 } },
            React.createElement("span", { className: "eyebrow" }, "Servizi correlati"),
            React.createElement("h2", { className: "h2", style: { marginTop: 16 } }, "Potrebbe interessarti anche")),
          React.createElement("div", { className: "related-grid" },
            related.map((s, i) => React.createElement(ServiceCard, { key: s.slug, svc: s, delay: (i % 3) + 1 })))
        )
      ),
      React.createElement(CTABand, {
        title: (svc.partners ? "Vuoi un preventivo per la tua assicurazione?" : "Vuoi procedere con " + svc.title.toLowerCase() + "?"),
        text: svc.partners
          ? "Contatta Agenzia Principe 2 a Torino: confrontiamo le compagnie partner e troviamo la polizza RC più conveniente per te."
          : "Contatta Agenzia Principe 2 a Torino: verifichiamo i documenti e gestiamo la pratica per te, con tempi chiari.",
        secondaryLabel: "Tutti i servizi", secondaryTo: "servizi",
      })
    );
  }

  w.Pages = w.Pages || {};
  w.Pages.Servizio = Servizio;
})(window);