import { resetComponent as o } from "../../style/index.mjs";
import { genComponentStyleHook as n } from "../../utils/cssinjs/index.mjs";
const s = (i) => {
  const {
    componentCls: e,
    checkCardDisabledOutlineColor: l,
    checkCardIndicatorSize: a,
    checkCardOutlineWidth: r,
    checkCardIndicatorOffset: d
  } = i, c = i.calc(a).mul(2).equal();
  return {
    [`${e}`]: {
      ...o(i),
      borderRadius: i.borderRadius,
      position: "relative",
      "&--disabled": {
        backgroundColor: i.checkCardDisabledBg,
        cursor: "not-allowed !important"
      },
      "&--bordered": {
        outline: `${i.lineWidth} ${i.lineType} ${i.borderColorBase}`
      },
      [`&:hover:not(${e}--disabled)`]: {
        cursor: "pointer",
        outline: `${i.lineWidth} ${i.lineType} ${i.colorPrimary}`
      },
      "&::after": {
        content: '""',
        position: "absolute",
        width: 0,
        height: 0,
        insetBlockStart: 0,
        insetInlineEnd: 0,
        clipPath: "polygon(100% 0, 100% 100%, 0 0)",
        background: i.colorPrimary,
        borderTopRightRadius: i.calc(i.borderRadius).add("2px").equal()
      },
      "&--checked": {
        outline: `${r} ${i.lineType} ${i.colorPrimary}`,
        [`&:hover:not(${e}--disabled)`]: {
          outline: `${r} ${i.lineType} ${i.colorPrimary}`
        },
        "&::after": {
          width: c,
          height: c,
          insetBlockStart: d,
          insetInlineEnd: d,
          transition: ["width", "height", "inset"].map(
            (t) => `${t} ${i.motionDurationSlow} cubic-bezier(0.645, 0.045, 0.355, 1)`
          ).join(", ")
        },
        [`&${e}--disabled`]: {
          outlineColor: l,
          "&::after": {
            backgroundColor: l
          }
        }
      },
      "&--middle": {
        padding: i.spaceLG
      },
      "&--small": {
        padding: `${i.spaceSM} ${i.spaceLG}`
      },
      [`${e}__title`]: {
        ...o(i),
        marginBottom: i.spaceXS,
        color: i.textColor1,
        fontWeight: "bold",
        "&--disabled": {
          color: i.textColor4
        }
      },
      [`${e}__content`]: {
        ...o(i),
        color: i.textColor1,
        "&--disabled": {
          color: i.textColor4
        }
      },
      [`${e}__checked-icon`]: {
        position: "absolute",
        top: 0,
        right: 0,
        zIndex: 1,
        lineHeight: 1,
        userSelect: "none",
        "& > img": {
          width: i.calc(a).sub(r).equal(),
          verticalAlign: "top"
        }
      }
    }
  };
}, p = n(
  "CheckCard",
  (i) => [s(i)],
  {
    checkCardDisabledBg: "#F9F9FA",
    checkCardDisabledOutlineColor: "#E9EDF3",
    checkCardIndicatorSize: 14,
    checkCardOutlineWidth: 2,
    checkCardIndicatorOffset: -2
  }
);
export {
  p as default
};
