const n = (t) => {
  const { color: o, get: e } = t;
  return {
    ".footer-background": {
      backgroundColor: o("grey.90")
    },
    ".footer": {
      display: "flex",
      flexDirection: "column",
      alignItems: "flex-start",
      gap: "32px",
      marginLeft: "auto",
      marginRight: "auto",
      maxWidth: "75%",
      paddingTop: "24px",
      paddingBottom: "24px",
      paddingLeft: "24px",
      paddingRight: "24px",
      backgroundColor: o("grey.90")
    },
    ".footer-link": {
      cursor: "pointer",
      textDecoration: "underline"
    },
    ".footer-link-primary": {
      color: o("content.inverse.strong")
    },
    ".footer-link-secondary": {
      color: o("content.inverse.subtle"),
      fontSize: e("fontSize.sm")
    },
    ".footer-section": {
      display: "flex",
      flexDirection: "row",
      gap: "16px"
    },
    ".footnote": {
      display: "flex",
      flexDirection: "column",
      alignItems: "flex-end",
      width: "100%",
      color: o("content.inverse.subtle"),
      fontSize: e("fontSize.sm")
    }
  };
}, r = {
  getComponents: n
};
export {
  r as TailwindFooter
};
