---
// Shared checkout trust band. One source of truth for the security + guarantee
// reassurance shown at the high-friction moments of the order flow (payment
// step, review step, and the order intro). Used across ALL verticals
// (telecom, trucking, healthcare, corporate), so the copy is regulator-agnostic
// except for an optional vertical-specific affiliation disclaimer.
//
// Usage:
//   <CheckoutTrustBand variant="full" vertical="healthcare" />  // Payment step
//   <CheckoutTrustBand variant="compact" vertical="telecom" />  // Review step
//   <CheckoutTrustBand variant="bar" />                         // Order H1 bar
//
// The guarantee is a real money-back-if-we-fail-to-file promise: if we are
// unable to file your filing, you get a full refund. Worded so it never
// overpromises a regulatory outcome (agency approval is not ours to guarantee),
// only our own work.
export interface Props {
  variant?: "full" | "compact" | "bar";
  vertical?: "trucking" | "telecom" | "healthcare" | "corporate";
}
const { variant = "full", vertical } = Astro.props;

// Regulator-agnostic security badges shown on every order.
const BADGES = [
  { icon: "\u{1F512}", label: "256-bit TLS encrypted" },
  { icon: "\u{1F4B3}", label: "Secure payment by Stripe" },
  { icon: "\u{1F6E1}\u{FE0F}", label: "SOC 2 hosting \u00b7 PCI compliant" },
  { icon: "\u{1F4CB}", label: "Fixed price, no billable hours" },
];

const GUARANTEE_TITLE = "Money-back guarantee";
const GUARANTEE_BODY =
  "If we are unable to file your filing, you get a full refund. Fixed price, no billable hours, no surprises.";

// Affiliation disclaimer is vertical-specific (only relevant when the order is
// tied to a particular agency). Omitted when vertical is unknown.
const DISCLAIMERS: Record<NonNullable<Props["vertical"]>, string> = {
  healthcare: "Performance West is an independent compliance firm, not affiliated with CMS or Medicare.",
  telecom:    "Performance West is an independent compliance firm, not affiliated with the FCC or USAC.",
  trucking:   "Performance West is an independent compliance firm, not affiliated with the FMCSA or DOT.",
  corporate:  "Performance West is an independent compliance firm, not a government agency.",
};
const disclaimer = vertical ? DISCLAIMERS[vertical] : "";
---

{variant === "bar" && (
  <div class="pw-trust-bar">
    <span class="pw-tb-item"><span aria-hidden="true">{"\u{1F512}"}</span> Secure checkout</span>
    <span class="pw-tb-sep" aria-hidden="true">&middot;</span>
    <span class="pw-tb-item"><span aria-hidden="true">{"\u{1F4B5}"}</span> Fixed price, no billable hours</span>
    <span class="pw-tb-sep" aria-hidden="true">&middot;</span>
    <span class="pw-tb-item"><span aria-hidden="true">{"\u2713"}</span> Money-back guarantee: we file it or your money back</span>
  </div>
)}

{variant !== "bar" && (
  <div class={`pw-trust ${variant === "compact" ? "is-compact" : ""}`}>
    <div class="pw-trust-guarantee">
      <span class="pw-guarantee-icon" aria-hidden="true">{"\u{2705}"}</span>
      <div>
        <p class="pw-guarantee-title">{GUARANTEE_TITLE}</p>
        <p class="pw-guarantee-body">{GUARANTEE_BODY}</p>
      </div>
    </div>
    {variant === "full" && (
      <ul class="pw-trust-badges" aria-label="Security and trust">
        {BADGES.map((b) => (
          <li><span class="pw-badge-icon" aria-hidden="true">{b.icon}</span>{b.label}</li>
        ))}
      </ul>
    )}
    {disclaimer && <p class="pw-trust-disclaimer">{disclaimer}</p>}
  </div>
)}

<style>
  /* Thin bar (order intro) */
  .pw-trust-bar {
    display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem;
    margin: 0.75rem 0 0; padding: 0.6rem 0.85rem;
    background: #f0fdf4; border: 1px solid #bbf7d0; border-radius: 8px;
    font-size: 0.82rem; color: #166534; line-height: 1.4;
  }
  .pw-tb-item { display: inline-flex; align-items: center; gap: 0.3rem; font-weight: 600; }
  .pw-tb-sep { color: #86efac; }

  /* Card (payment + review) */
  .pw-trust {
    margin: 1.5rem 0 0; padding: 1rem 1.15rem;
    background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 10px;
  }
  .pw-trust.is-compact { margin: 1.25rem 0 0; padding: 0.85rem 1rem; }
  .pw-trust-guarantee {
    display: flex; gap: 0.7rem; align-items: flex-start;
    padding: 0.75rem 0.85rem; background: #ecfdf5;
    border: 1px solid #6ee7b7; border-radius: 8px;
  }
  .pw-guarantee-icon { font-size: 1.25rem; line-height: 1.2; flex: 0 0 auto; }
  .pw-guarantee-title { margin: 0 0 0.15rem; font-size: 0.9rem; font-weight: 800; color: #047857; }
  .pw-guarantee-body  { margin: 0; font-size: 0.82rem; color: #065f46; line-height: 1.5; }
  .pw-trust-badges {
    list-style: none; margin: 0.85rem 0 0; padding: 0;
    display: flex; flex-wrap: wrap; gap: 0.4rem 1rem;
  }
  .pw-trust-badges li {
    display: inline-flex; align-items: center; gap: 0.35rem;
    font-size: 0.78rem; font-weight: 600; color: #0f766e;
  }
  .pw-badge-icon { font-size: 0.9rem; }
  .pw-trust-disclaimer {
    margin: 0.75rem 0 0; font-size: 0.72rem; color: #94a3b8; line-height: 1.4;
  }
  .pw-trust.is-compact .pw-trust-disclaimer { margin-top: 0.6rem; }
</style>