import "../../../../@ant-design/cssinjs/es/extractStyle.mjs";
import "../../../../@ant-design/cssinjs/es/hooks/useCacheToken.mjs";
import "react";
import "../../../../@ant-design/cssinjs/es/StyleContext.mjs";
import { unit as m } from "../../../../@ant-design/cssinjs/es/util/index.mjs";
import "../../../../@ant-design/cssinjs/es/hooks/useCompatibleInsertionEffect.mjs";
import "../../../../@ant-design/cssinjs/es/hooks/useEffectCleanupRegister.mjs";
import "../../../../@ant-design/cssinjs/es/hooks/useHMR.mjs";
import "../../../../rc-util/es/warning.mjs";
import "../../../../@ant-design/cssinjs/es/theme/createTheme.mjs";
import "../../../../@ant-design/cssinjs/es/theme/ThemeCache.mjs";
import "../../../../@ant-design/cssinjs/es/transformers/legacyLogicalProperties.mjs";
import { clearFix as g, textEllipsis as $ } from "../../style/index.mjs";
const h = (i) => {
  const {
    componentCls: t,
    antCls: s,
    iconCls: l,
    fontSize: n,
    lineHeight: c,
    calc: a
  } = i, o = `${t}-list-item`, e = `${o}-actions`, r = `${o}-action`, p = i.fontHeightSM;
  return {
    [`${t}-wrapper`]: {
      [`${t}-list`]: Object.assign(Object.assign({}, g()), {
        lineHeight: i.lineHeight,
        [o]: {
          position: "relative",
          height: a(i.lineHeight).mul(n).equal(),
          marginTop: i.marginXS,
          fontSize: n,
          display: "flex",
          alignItems: "center",
          transition: `background-color ${i.motionDurationSlow}`,
          "&:hover": {
            backgroundColor: i.controlItemBgHover
          },
          [`${o}-name`]: Object.assign(Object.assign({}, $), {
            padding: `0 ${m(i.paddingXS)}`,
            lineHeight: c,
            flex: "auto",
            transition: `all ${i.motionDurationSlow}`
          }),
          [e]: {
            [r]: {
              opacity: 0
            },
            [l]: {
              color: i.actionsColor,
              transition: `all ${i.motionDurationSlow}`
            },
            [`
              ${r}:focus-visible,
              &.picture ${r}
            `]: {
              opacity: 1
            },
            [`${r}${s}-btn`]: {
              height: p,
              border: 0,
              lineHeight: 1
            }
          },
          [`${t}-icon ${l}`]: {
            color: i.colorTextDescription,
            fontSize: n
          },
          [`${o}-progress`]: {
            position: "absolute",
            bottom: i.calc(i.uploadProgressOffset).mul(-1).equal(),
            width: "100%",
            paddingInlineStart: a(n).add(i.paddingXS).equal(),
            fontSize: n,
            lineHeight: 0,
            pointerEvents: "none",
            "> div": {
              margin: 0
            }
          }
        },
        [`${o}:hover ${r}`]: {
          opacity: 1
        },
        [`${o}-error`]: {
          color: i.colorError,
          [`${o}-name, ${t}-icon ${l}`]: {
            color: i.colorError
          },
          [e]: {
            [`${l}, ${l}:hover`]: {
              color: i.colorError
            },
            [r]: {
              opacity: 1
            }
          }
        },
        [`${t}-list-item-container`]: {
          transition: `opacity ${i.motionDurationSlow}, height ${i.motionDurationSlow}`,
          // For smooth removing animation
          "&::before": {
            display: "table",
            width: 0,
            height: 0,
            content: '""'
          }
        }
      })
    }
  };
}, O = h;
export {
  O as default
};
