const shadows = {
    sm: "0px 2px 7px rgba(150, 177, 205, 0.3)",
    smHover: "0px 2px 14px rgba(150, 177, 205, 0.3)",
    md: "0px 2px 9px rgba(150, 177, 205, 0.35)",
    mdHover: "0px 2px 13px rgba(150, 177, 205, 0.39)",
    lg: "0px 4px 14px rgba(150, 177, 205, 0.33)",
};
const colors = {
    primary980: "#3897F9",
    primary960: "#3376DB",
    primary950: "#0078E2",
    primary900: "#1792FF",
    primary700: "#B7DDFF",
    primary400: "#ECF6FF",
    primary300: "#CCDAE9",
    primary250: "#CCDAE9",
    primary210: "#CCDAE9",
    primary200: "#E7EEF6",
    primary150: "#E7EEF6",
    primary100: "#F9FCFF",
    black900: "#002445",
    black600: "#4C667D",
    black200: "#919CA7",
    black100: "#B3BDC7",
    white900: "#FFFFFF",
    red950: "#F93737",
    red900: "#FD6A6A",
    red800: "#FE6666",
    red700: "#E6007A",
    red200: "#FCE6F2",
    green905: "#55AE58",
    green900: "#57AF5A",
    pale100: "#E3EEF9",
    pale200: "#FAF8F2",
    pale300: "#F1F5F9",
    pale500: "#d9dde0",
};
const palette = {
    accent: {
        dark: "#1F74D1",
        normal: "#3897F9",
        light: "#61ADFF",
    },
    link: {
        normal: "#3897F9",
        hover: "#1F74D1",
    },
    text: {
        primary: "#233445",
        secondary: "#4E5B69",
        tertiary: "#566573",
        quaternary: "#697885",
        disabled: "#8092A2",
        button: "#fff",
    },
    bg: {
        ultradark: "#F1F3F6",
        dark: "#F3F6F8",
        normal: "#F7F8FA",
        light: "#FAFAFC",
        menu: "#F1F3F6",
    },
    plate: {
        normal: "#CFD9E8",
    },
    line: {
        dark: "#E4E8ED",
        normal: "#EBEEF2",
        light: "#F3F6F8",
    },
    icon: {
        disabled: "#697885",
        normal: "#0B294A",
        accent: "#3897F9",
    },
    add: {
        violet: {
            dark: "#560A91",
            normal: "#9333DF",
            light: "#F8F1FE",
        },
        pink: {
            dark: "#940752",
            normal: "#E6007A",
            light: "#FFF4FA",
        },
    },
    error: {
        dark: "#E04848",
        normal: "#FE6666",
        light: "#FEF1F1",
    },
    success: {
        dark: "#0C8210",
        normal: "#55AE58",
        light: "#E8FAE9",
    },
    gradient: {
        violet: "linear-gradient(98.43deg, #535CD9 25.76%, #477FD0 102.28%)",
    },
};
const typography = {
    baseColor: colors.black900,
    lightColor: colors.black200,
    warningColor: colors.red800,
    fontFamily: "Geometria, Verdana, sans-serif",
    bold: "700",
    h1: {
        fontSize: "28px",
        fontWeight: "900",
        lineHeight: "34px",
        mobileFontSize: "18px",
        mobileFontWeight: "900",
        mobileLineHeigth: "20px",
    },
    h2: {
        fontSize: "24px",
        fontWeight: "900",
        lineHeight: "30px",
        mobileFontSize: "16px",
        mobileFontWeight: "900",
        mobileLineHeigth: "18px",
    },
    h3: {
        fontSize: "20px",
        fontWeight: "900",
        lineHeight: "26px",
        mobileFontSize: "14px",
        mobileFontWeight: "900",
        mobileLineHeigth: "16px",
    },
    h4: {
        fontSize: "16px",
        fontWeight: "900",
        lineHeight: "22px",
        mobileFontSize: "13px",
        mobileFontWeight: "900",
        mobileLineHeigth: "14px",
    },
    "p-xxl": {
        fontWeight: "400",
        fontSize: "20px",
        lineHeight: "28px",
        mobileFontSize: "18px",
        mobileFontWeight: "400",
        mobileLineHeigth: "21px",
    },
    "p-xl": {
        fontWeight: "400",
        fontSize: "18px",
        lineHeight: "24px",
        mobileFontSize: "16px",
        mobileFontWeight: "400",
        mobileLineHeigth: "19px",
    },
    "p-lg": {
        fontWeight: "400",
        fontSize: "16px",
        lineHeight: "22px",
        mobileFontSize: "13px",
        mobileFontWeight: "400",
        mobileLineHeigth: "16px",
    },
    "p-md": {
        fontWeight: "400",
        fontSize: "14px",
        lineHeight: "20px",
        mobileFontSize: "12px",
        mobileFontWeight: "400",
        mobileLineHeigth: "15px",
    },
    "p-sm": {
        fontWeight: "400",
        fontSize: "12px",
        lineHeight: "18px",
        mobileFontSize: "10px",
        mobileFontWeight: "400",
        mobileLineHeigth: "13px",
    },
    "p-xs": {
        fontWeight: "400",
        fontSize: "10px",
        lineHeight: "18px",
        mobileFontSize: "8px",
        mobileFontWeight: "400",
        mobileLineHeigth: "11px",
    },
    "button-lg": {
        fontWeight: "700",
        fontSize: "18px",
        lineHeight: "22px",
    },
    "button-md": {
        fontWeight: "700",
        fontSize: "16px",
        lineHeight: "22px",
    },
    "button-sm": {
        fontWeight: "700",
        fontSize: "14px",
        lineHeight: "22px",
    },
    "link-lg": {
        fontWeight: "700",
        fontSize: "18px",
        lineHeight: "24px",
        textDecorationLine: "underline",
    },
    "link-md": {
        fontWeight: "700",
        fontSize: "16px",
        lineHeight: "22px",
        textDecorationLine: "underline",
    },
    "link-sm": {
        fontWeight: "700",
        fontSize: "14px",
        lineHeight: "20px",
        textDecorationLine: "underline",
    },
};
const breakpoints = {
    sm: "500px",
    md: "700px",
    lg: "1200px",
};
breakpoints.down = (b) => {
    return `@media (max-width: ${breakpoints[b]})`;
};
breakpoints.up = (b) => {
    return `@media (min-width: ${breakpoints[b]})`;
};
const button = {
    fontFamily: typography.fontFamily,
    xs: {
        width: "116px",
        height: "32px",
        borderRadius: "10px",
        iconSize: "18px",
        iconMargin: "0 4px 0 0",
        labelTypography: typography["button-sm"],
    },
    sm: {
        width: "116px",
        height: "40px",
        borderRadius: "10px",
        iconSize: "18px",
        iconMargin: "0 12px 0 0",
        labelTypography: typography["button-sm"],
    },
    md: {
        width: "184px",
        height: "48px",
        borderRadius: "10px",
        iconSize: "30px",
        iconMargin: "0 12px 0 0",
        labelTypography: typography["button-md"],
    },
    lg: {
        width: "220px",
        height: "64px",
        borderRadius: "10px",
        iconSize: "30px",
        iconMargin: "0 12px 0 0",
        labelTypography: typography["button-lg"],
    },
    action: {
        active: {
            color: colors.white900,
            border: "unset",
            background: colors.primary900,
        },
        hover: {
            color: colors.white900,
            border: "unset",
            background: colors.primary950,
        },
        disabled: {
            color: colors.white900,
            border: "unset",
            background: colors.black100,
        },
    },
    secondary: {
        active: {
            color: colors.primary900,
            border: `1px solid ${colors.primary900}`,
            background: colors.white900,
        },
        hover: {
            color: colors.white900,
            border: `1px solid ${colors.primary950}`,
            background: colors.white900,
        },
        disabled: {
            color: colors.primary300,
            border: `1px solid ${colors.primary300}`,
            background: colors.white900,
        },
    },
    text: {
        active: {
            color: colors.primary900,
            border: `unset`,
            background: "transparent",
        },
        hover: {
            color: colors.primary900,
            border: `unset`,
            background: "transparent",
        },
        disabled: {
            color: colors.primary300,
            border: `unset`,
            background: "transparent",
        },
    },
};
const tabs = {
    width: "100%",
    height: "64px",
    heightSmall: "44px",
    borderBottom: `1px solid ${colors.primary200}`,
    color: colors.black100,
    colorActive: colors.primary900,
    background: colors.white900,
    backgroundActive: colors.white900,
    backgroundStroke: colors.white900,
    backgroundStrokeActive: colors.primary100,
    itemBorder: `none`,
    itemBorderActive: `none`,
    itemBorderBottomActive: `2px solid ${colors.primary900}`,
    itemBorderStroke: `1px solid ${colors.primary300}`,
    itemBorderStrokeActive: `1px solid ${colors.primary900}`,
    badgeColor: colors.white900,
    badgeBackground: colors.primary900,
};
const tabsSwitch = {
    width: "100%",
    height: "48px",
    color: colors.black100,
    colorActive: colors.black900,
    backgroundActive: colors.white900,
    padding: "4px",
    itemBackground: "transparent",
    itemBorderRadius: "2px",
    boxShadow: "inset 1px 1px 2px rgba(203, 221, 240, 0.14)",
    boxShadowActive: "0px 2px 2px rgba(150, 177, 205, 0.3)",
    background: colors.primary100,
};
const card = {
    filled: {
        background: "#F3F6F8",
        border: `unset`,
        boxShadow: "unset",
        borderRadius: "16px",
        padding: "24px",
    },
    outlined: {
        background: colors.white900,
        border: `1px solid ${"#BCC6D2"}`,
        boxShadow: "unset",
        borderRadius: "16px",
        padding: "24px",
    },
};
const subCard = {
    background: colors.primary100,
    border: `1px solid ${colors.white900}`,
    boxShadow: "0px 4px 22px rgba(150, 177, 205, 0.3)",
    borderRadius: "4px",
    padding: "32px 24px 24px 24px",
};
const input = {
    height: "48px",
    padding: "12px 20px 12px 16px",
    fontFamily: "Medium",
    fontSize: "20px",
    lineHeight: "24px",
    background: colors.white900,
    border: `1px solid ${colors.primary200}`,
    borderError: `1px solid ${colors.red800}`,
    borderRadius: "10px",
    helperColor: colors.black200,
    helperFontSize: "10px",
    helperLineHeight: "16px",
};
const inputNew = {
    width: "386px",
    height: "88px",
    padding: "40px 40px 12px 24px",
    fontFamily: typography.fontFamily,
    color: palette.text.primary,
    typography: { ...typography["p-xxl"], fontWeight: "700" },
    borderBottom: `1px solid ${palette.line.normal}`,
    borderRadius: "0px",
    background: "transparent",
    disabledColor: palette.text.disabled,
    readonlyBackground: palette.bg.normal,
    hoverBackground: palette.bg.light,
    placeholderColor: palette.text.quaternary,
    titleMargin: "16px 24px 0",
    labelColor: palette.text.secondary,
    labelTypography: typography["p-md"],
    labelErrorColor: palette.error.normal,
    linkColor: palette.accent.normal,
    linkTypography: { ...typography["p-sm"], fontWeight: "700" },
    leadingIconWidth: "36px",
    leadingIconHeight: "36px",
    leadingIconMargin: "40px 10px 10px 24px",
    trailingIconWidth: "36px",
    trailingIconHeight: "36px",
    trailingIconMargin: "40px 10px 10px 24px",
};
const dropdown = {
    color: colors.black900,
};
const dropdownIcon = {
    color: colors.primary900,
    colorOpened: colors.primary300,
};
const navigation = {
    containerBackground: colors.white900,
    containerBoxShadow: "unset",
    containerBorderRadius: "4px",
    containerBorder: "unset",
};
const burger = {
    contentBackground: colors.primary100,
    overlayBackground: `${colors.black900}66`,
    borderTop: `2px solid ${colors.primary900}`,
};
const link = {
    fontFamily: "Bold, Verdana, sans-serif",
    fontWeight: "700",
    fontSize: "14px",
    lineHeight: "18px",
    activeColor: colors.primary900,
    activeUnderlineColor: colors.primary900,
};
const langs = {
    itemBackground: colors.white900,
    activeItemBackground: colors.primary150,
    activeColor: colors.primary900,
    shadow: shadows.mdHover,
};
const radioButton = {
    border: `1px solid ${colors.primary210}`,
    colorChecked: colors.primary900,
};
const checkbox = {
    activeColor: colors.primary900,
    defaultColor: "#CCDAE9",
    borderRadius: "4px",
    borderWidth: "1px",
    icon: {
        activeColor: "#fff",
        disabledColor: "#fff",
    },
};
const table = {
    headersPadding: "0 24px 4px 24px",
    headersMargin: "0",
    headersBackground: "transparent",
    headersBorderBottom: `1px solid ${colors.primary300}`,
    rowPadding: "0 24px 4px 24px",
    rowBorderBottom: `1px solid ${colors.primary300}`,
    rowBackground: "transparent",
    rowBackgroundHover: colors.primary400,
};
const footer = {
    background: colors.primary400,
    padding: "62px 32px 72px",
    paddingMobile: "0",
    subscriberWidthMobile: "100%",
    subscriberWidth: "388px",
    subscriberWidthLarge: "420px",
    subscriberPadding: "62px 50px 40px",
    subscriberPaddingMobile: "40px 16px",
    subscriberBackground: colors.pale100,
    innerWidth: "100%",
    innerMaxWidth: "1224px",
    innerPadding: "0",
    innerPaddingMobile: "8px 16px 20px",
};
const textLoader = {
    width: "100%",
    widthMobile: "100%",
    height: "32px",
    heightMobile: "28px",
    background: colors.primary300,
    borderRadius: "2px",
    margin: "0px",
};
const contentWidth = {
    lg: "1200px",
    md: "700px",
    sm: "400px",
};
const grid = {
    columns: 12,
    columnWidth: 54,
    gapWidth: 24,
    contentMaxWidth: 12 * 54 + 11 * 24,
};
const equilibriumTheme = {
    new: {
        shadows,
        colors,
        typography,
        button,
        tabs,
        tabsSwitch,
        card,
        subCard,
        input,
        inputNew,
        dropdown,
        navigation,
        burger,
        link,
        langs,
        dropdownIcon,
        radioButton,
        checkbox,
        table,
        footer,
        textLoader,
        breakpoints,
        contentWidth,
        grid,
        palette,
    },
};
export default equilibriumTheme;
//# sourceMappingURL=equilibrium.theme.js.map