const SystemNotice = () => (
  <div
    style={{
      padding: "1rem",
      border: "1px solid #ddd",
      borderRadius: "8px",
      margin: "1rem",
      backgroundColor: "#f9f9f9",
      fontSize: "14px",
      textAlign: "center",
    }}
  >
    <div
      style={{
        fontSize: "32px", // 🔥 control icon size here
        lineHeight: 1,
        marginBottom: "0.25rem",
      }}
    >
      🛡
    </div>

    <strong
      style={{
        display: "block",
        marginBottom: "0.5rem",
        fontSize: "12px",
        letterSpacing: "0.5px",
      }}
    >
      WE HAVE YOUR BACK
    </strong>

    <p style={{ fontSize: "11px", margin: 0 }}>
      For added safety and your protection, keep payments and communications
      within Hirepanther.
    </p>
  </div>
);
export default SystemNotice;