import equilibriumThemeV2 from "../components/new/theme/equilibrium-v2.theme";
export const MEDIA_MOBILE = "max-width: 767px";
export const MEDIA_TABLET = "max-width: 1023px";
export const MEDIA_LARGE_SCREEN = "min-width: 1280px";
export const MEDIA_LAPTOP = "max-width: 1279px";
export const input = {
    mediaTablet: MEDIA_TABLET,
    wrapperPadding: "0 0 14px 0",
    wrapperWidth: "210px",
    wrapperWidthMobile: "100%",
    titleFontFamily: "Medium",
    titleFontFamilyMobile: "Medium",
    titleFontSize: "12px",
    titleFontSizeMobile: "12px",
    titleLineHeight: "20px",
    titleColor: "#002445",
    titleColorMobile: "#002445",
    titleMarginMobile: "0 0 5px 0",
    innerTitleColor: "#1792FF",
    innerTitleLeft: "18px",
    innerTitleTop: "10px",
    inputBorder: "1px solid #CCDAE9",
    inputBorderError: "1px solid #FF7979",
    inputBorderRadius: "4px",
    inputHeight: "64px",
    inputWidth: "100%",
    inputHeightMobile: "48px",
    inputFontFamily: "Medium",
    inputFontSize: "16px",
    inputFontSizeMobile: "16px",
    inputLineHeight: "20px",
    inputPadding: "0 0 0 15px",
    inputPaddingMobile: "0 0 0 8px",
    inputMargin: "8px 0px 8px 0px",
    inputMarginMobile: "0",
    inputColor: "#002445",
    inputDisabledColor: "#B3BDC7",
    inputPlaceholderColor: "#B3BDC7",
    subscriptColor: "#002445",
    subscriptColorStrong: "#1792FF",
    subscriptFontSize: "12px",
    subscriptLineHeight: "18px",
    subscriptFontFamily: "Medium",
    warningColor: "#FF7979",
    warningFontSize: "12px",
    warningLineHeight: "18px",
    warningFontFamily: "Medium",
};
export const loader = {
    width: "65px",
    height: "10px",
    background: "#ECF6FF",
    borderRadius: "4px",
    margin: "6px 0 0 0",
};
export const loaderTitle = { ...loader, height: "17px", margin: "0" };
export const loaderWide = { ...loader, width: "127px" };
// @deprecated
export const navigation__deprecated = {
    mediaMobile: MEDIA_MOBILE,
    mediaTablet: MEDIA_TABLET,
    mediaSmallScreen: MEDIA_LAPTOP,
    containerPosition: "fixed",
    containerTop: "0px",
    containerBottom: "unset",
    containerRight: "92px",
    containerLeft: "20px",
    containerRightMobile: "0",
    containerLeftMobile: "0",
    containerBackground: "#FFFFFF",
    wrapperBackground: "#FFFFFF",
    wrapperBackgroundMobile: "#FFFFFF",
    wrapperBorderBottomMobile: "1px solid #CCDAE9",
    wrapperWidth: "100%",
    wrapperMaxWidth: "1096px",
    wrapperMaxWidthMobile: "425px",
    wrapperMargin: "0 auto",
    wrapperHeight: "52px",
    wrapperHeightMobile: "47px",
    wrapperHeightTablet: "47px",
    wrapperPadding: "8px 0px 8px 0px",
    wrapperPaddingMobile: "0 20px",
    wrapperAlignItems: "center",
    wrapperJustifyContent: "left",
    wrapperJustifyContentMobile: "space-between",
    wrapperJustifyContenTablet: "space-between",
    wrapperBorderBottom: "none",
    iconHeight: "36px",
    iconWidth: "30.6px",
    iconHeightMobile: "32px",
    iconWidthMobile: "27.28px",
    iconMargin: "0 60px 0 0",
    iconMarginMobile: "0",
    linkFontFamily: "Bold, Verdana",
    linkFontSize: "14px",
    linkFontSizeTablet: "14px",
    linkFontSizeMobile: "14px",
    linkColor: "#002445",
    linkTextAlign: "left",
    linkMargin: "0 25px 0 0",
    linkSecondaryColor: "#B3BDC7",
    linkSecondaryFontSize: "12px",
    linkSecondaryHeight: "24px",
    dropdownItemPadding: "0 0 0 16px",
    burgerColor: "#002445",
    linkActiveColor: "#1792FF",
};
export const locale = {
    mediaMobile: MEDIA_MOBILE,
    mediaTablet: MEDIA_TABLET,
    mediaLaptop: MEDIA_LAPTOP,
    wrapperMargin: "0 10px 0 auto",
    wrapperMarginMobile: "0",
    linkFontFamily: "Bold, Verdana",
    linkFontSize: "16px",
    linkColor: "#1792FF",
    linkPadding: "7px 5px 5px 5px",
    linkMargin: "0 8px 0 0",
    linkMarginMobile: "0 0 15px 0",
    linkActiveBorder: "1px solid #1792FF",
    modalPadding: "0 30px 0 0",
    modalWidth: "205px",
    laptopModalWidth: "175px",
    linkInvertedColor: "#1792FF",
};
export const dropdown = {
    mediaTablet: MEDIA_TABLET,
    wrapperWidth: "140px",
    wrapperWidthMobile: "110px",
    wrapperHeight: "64px",
    wrapperHeightMobile: "40px",
    wrapperBorderMobile: "unset",
    wrapperPadding: "16px 10px",
    wrapperPaddingMobile: "10px",
    wrapperBorderRadius: "4px",
    modalWidth: "calc(100% + 2px)",
    modalPadding: "16px 10px",
    modalBorder: "1.5px solid #CCDAE9",
    modalBorderRadius: "4px",
    modalTopMobile: "50px",
    titleFontFamily: "Bold, Verdana",
    titleFontFamilyMobile: "Regular, Verdana",
    titleFontWeight: "500",
    titleFontSize: "16px",
    titleFontSizeMobile: "12px",
    titleLineHeight: "20px",
    titleColor: "#002445",
    titleColorMobile: "#B3BDC7",
    titleMarginMobile: "0 0 5px 0",
};
export const notification = {
    mediaMobile: MEDIA_MOBILE,
    color: "#F9FCFF",
    colorError: "#FFFFFF",
    colorLink: "#F9FCFF",
    textFontFamily: "Regular",
    textFontSize: "12px",
    textLineHeight: "18px",
    textMaxWidthMobile: "unset",
    titleFontFamily: "Regular",
    titleFontSize: "12px",
    titleLineHeight: "18px",
    titleMarginBottom: "4px",
    linkTextFontFamily: "Regular",
    linkTextFontSize: "8px",
    wrapperTop: "56px",
    wrapperBottom: "unset",
    wrapperLeft: "unset",
    wrapperRight: "calc((100vw - 276px)/2 - 382px)",
    wrapperTopMobile: "47px",
    wrapperBottomMobile: "unset",
    wrapperLeftMobile: "0px",
    wrapperRightMobile: "0px",
    itemPosition: "relative",
    itemBackground: "#1792FF",
    itemBackgroundError: "#FE6666",
    itemBackgroundSucces: "#1792FF",
    itemPadding: "8px 35px 8px 12px",
    itemMinHeight: "68px",
    itemMinHeightMobile: "34px",
    itemMaxWidth: "264px",
    itemWidth: "264px",
    itemTop: "unset",
    itemBottom: "unset",
    itemLeft: "unset",
    itemRight: "unset",
    itemMarginBottom: "6px",
    itemBorder: "unset",
};
export const table = {
    mediaMobile: MEDIA_TABLET,
    wrapperWidth: "100%",
    wrapperHeight: "100%",
    wrapperPaddingMobile: "0px 20px 0 20px",
    headerFontFamily: "Medium",
    headerFontFamilyHover: "Heavy",
    headerFontSize: "14px",
    headerFontSizeMobile: "12px",
    headerBackground: "transparent",
    headerColor: "#00000080",
    headerColorMobile: "#00000080",
    headerWidthMobile: "fit-content",
    headerJustifyContent: "flex-end",
    headerLineHeight: "20px",
    headersAlignItems: "center",
    headersJustifyContentMobile: "space-between",
    headersHeight: "unset",
    headersHeightMobile: "40px",
    headersTopMobile: "100px",
    headersBorderBot: "1px solid #CCDAE9",
    headersPadding: "0 0 4px 0",
    rowHeight: "48px",
    rowHeightMobile: "50px",
    rowFontFamily: "Bold, Verdana",
    rowFontSize: "16px",
    rowFontSizeMobile: "14px",
    rowAlignItems: "center",
    rowBorderBot: "1px solid #CCDAE9",
    rowHoverBorderBot: "2px solid #1792FF",
    rowHoverTextColor: "#1792FF",
    rowPaddingMobile: "0",
    rowJustifyContentMobile: "space-between",
    rowFontFamilyBold: "Heavy",
    rowBackgroundMobileOpened: "#F9FCFF",
    rowCursor: "pointer",
    progressRowColor: "#ECF6FF",
    itemColor: "#333333",
    itemJustifyContent: "flex-end",
};
export const popup = {
    mediaTablet: MEDIA_TABLET,
    background: "#00244533",
    contentBackground: "#ffffff",
    contentBoxShadow: "4px 4px 14px rgba(179, 189, 199, 0.15)",
};
export const tooltip = {
    mediaTablet: MEDIA_TABLET,
    wrapperMargin: "0 0 0 4px",
    contentWidth: "260px",
    contentPadding: "12px 16px",
    contentBackground: "#FFFFFF",
    contentBoxShadow: "4px 4px 14px rgba(179, 189, 199, 0.15)",
    contentBorderRadius: "4px",
    contentBottom: "26px",
    contentLeft: "16px",
    iconWidth: "16px",
    iconHeight: "16px",
    iconBorder: "1.5px solid #B3BDC7",
    iconBorderWarning: "1.5px solid #F7931A",
    iconBackground: "#FFFFFF",
};
const card = {
    background: "#FFFFFF",
    border: "1px solid #FFFFFF",
    boxShadow: "rgb(150 177 205 / 30%) 0px 4px 22px",
    borderRadius: "4px",
};
const button = {
    width: "170px",
    height: "64px",
    mdHeight: "56px",
    smHeight: "48px",
    xsHeight: "40px",
    background: "#1792FF",
    borderRadius: "4px",
    border: "2px solid",
    thinOutlinedBorder: "1px solid",
    alterBorder: "1px solid",
    fontSize: "16px",
    xsFontSize: "14px",
    fontFamily: "Bold, Verdana",
    xsFontFamily: "Medium, Verdana",
    outlinedBackground: "#FFFFFF",
    alterBackground: "#ECF6FF",
    darkBackground: "#002445",
    disabledBackground: "#CCDAE9",
    disabledColor: "#ECF6FF",
    disabledOutlinedBackground: "#FFFFFF",
    disabledOutlinedColor: "#B3BDC7",
    activeBackground: "#ECF6FF",
    activeColor: "#1792FF",
    hoverBackground: "#0078E2",
    hoverColor: "#FFFFFF",
};
const tabs = {
    controlTheme: {
        activeTabBackground: "#ECF6FF",
        activeTabBorder: "1px solid #1792FF",
        activeTabTextColor: "#1792FF",
        disabledTabTextColor: "#B3BDC7",
        defaultTabBackground: "#FFFFFF",
        defaultTabBorder: "1px solid transparent",
        defaultTabTextColor: "#002445",
        defaultTabBoxShadow: "0px 4px 22px rgba(150, 177, 205, 0.3)",
    },
    controlFlatTheme: {
        activeTabBorder: "2px solid #1792FF",
        activeTabTextColor: "#1792FF",
        defaultTabBorder: "2px solid #CCDAE9",
        defaultTabTextColor: "#CCDAE9",
    },
};
const gatewayPortfolio = {
    cardTitleFontSize: 16,
    cardTitleLineHeight: 20,
    cardTitleFontFamily: "Medium",
    cardTitleColor: "#002445",
    labelsTopSpace: 28,
    labelsBoxShadow: "unset",
    labelsCardBoxShadow: "0px 4px 22px rgba(150, 177, 205, 0.3)",
    labelsCardBackground: "#FFFFFF",
    labelsLtvMinHeight: "122px",
    labelsLtvTop: "-4px",
};
const assetTable = {
    headingColor: "#00000080",
    rowSubColor: "#999999",
};
const navigation = {
    backgroundColor: "#FFFFFF",
    appBackgroundColor: "#FFFFFF",
    borderColor: "transparent",
    borderRadius: "4px",
    actionsMinWidth: "155px",
    boxShadow: "0px 4px 22px rgba(150, 177, 205, 0.3)",
    maxWidth: "1224px",
    dropDownBackgroundColor: "#ecf6ff",
    marginBottom: "0",
};
const submenu = {
    borderColor: "transparent",
    borderRadius: "4px",
    boxShadow: "rgb(150 177 205 / 30%) 0px 4px 22px",
    maxWidth: "912px",
    maxWidthFull: "1224px",
};
const sidebar = {
    maxHeight: "calc(100vh - 8px)",
    margin: "24px 0px 0px",
    top: "0px",
    hoverBoxShadow: "rgb(150 177 205 / 25%) 0px -4px 4px inset",
};
const select = {
    mediaTablet: MEDIA_TABLET,
    wrapperPadding: "0 0 16px 0",
    contentWidth: "210px",
    contentWidthMobile: "110px",
    contentHeight: "64px",
    contentHeightMobile: "40px",
    contentBorder: "1px solid #CCDAE9",
    contentBorderError: "1px solid #FF7979",
    contentBorderMobile: "unset",
    contentPadding: "0px 20px",
    contentPaddingMobile: "10px",
    contentBorderRadius: "4px",
    modalWidth: "100%",
    modalPadding: "20px 48px 20px 20px",
    modalBorder: "1.5px solid #CCDAE9",
    modalBorderRadius: "4px",
    modalTopMobile: "50px",
    titleFontFamily: "Medium",
    titleFontFamilyMobile: "Medium",
    titleFontWeight: "500",
    titleFontSize: "12px",
    titleFontSizeMobile: "12px",
    titleLineHeight: "18px",
    titleColor: "#002445",
    titleColorMobile: "#B3BDC7",
    titleMargin: "0 0 8px 0",
    titleMarginMobile: "0 0 5px 0",
    innerTitleColor: "#1792FF",
    innerTitleLeft: "20px",
    innerTitleTop: "10px",
    subscriptColor: "#B3BDC7",
    subscriptColorStrong: "#1792FF",
    subscriptFontSize: "12px",
    subscriptLineHeight: "18px",
    subscriptFontFamily: "Medium",
    warningColor: "#FF7979",
    warningFontSize: "12px",
    warningLineHeight: "18px",
    warningFontFamily: "Medium",
};
const grid = {
    mainMinHeight: "auto",
};
const dex = {
    navBalance: {
        tabLabelLineHeight: 12,
        tabTextLineHeight: 20,
    },
    tabs: {
        rowBoxShadow: "inset 2px 2px 4px rgba(203, 221, 240, 0.51)",
        rowBackground: "#ECF6FF",
        rowBorderRadius: "4px",
        rowPadding: "4px",
        idleBackground: "#FFFFFF",
        activeBackground: "#1792FF",
        boxShadow: "0px 2px 2px rgba(150, 177, 205, 0.3)",
        borderRadius: "2px",
        padding: "5px 0 0 8px",
        rowHeight: "52px",
    },
    navConnect: {
        fontFamily: "Bold, Verdana",
        fontSize: "14px",
        lineHeight: "20px",
    },
};
const statusTag = {
    backgroundOpacity: 0.2,
    borderRadius: "3.1px",
    padding: "2.72px 3.1px 0 3.87px",
    textFontSize: "10.85px",
    textLineHeight: "15.5px",
    textFontFamily: "Bold, Verdana",
};
const slider = {
    barBackground: "linear-gradient(270deg, #55AE58 0%, #CCDAE9 48.44%, #FE6666 100%)",
    barBorderRadius: "3px",
    barHeight: "6px",
    subFontFamily: "Bold, Verdana",
    subFontSize: "10px",
    subLineHeight: "13px",
    subColors: ["#FD6A6A", "#57AF5A"],
};
const sliderThumb = {
    width: 44,
    height: 28,
    fontFamily: "Bold, Verdana",
    fontSize: "12px",
    lineHeight: "20px",
    textColor: "#FFFFFF",
};
const theme = {
    colors: {
        primary: "#1792ff",
        secondary: "#B3BDC7",
        border: "#ccdae9",
        background: "#ffffff",
        pageBackground: "#f9fcff",
        tokenBackground: "#ccdae9",
        menuBackground: "#f1f3f6",
        pale: "#ECF6FF",
        disabled: "#d3e9fe",
        faded: "#9f9da8",
        error: "#ff7979",
        success: "#26990f",
        text: "#002445",
        textSecondary: "#535e69",
        dark: "#002445",
        lightDark: "#0e66b5",
        light: "#d6eaff",
        gray: "#B3BDC7",
        gray2: "#919CA7",
    },
    fonts: {
        title: "Heavy",
        subtitle: "Bold, Verdana",
        text: "Medium",
    },
    card,
    button,
    locale,
    loader,
    loaderTitle,
    loaderWide,
    navigation,
    input,
    dropdown,
    notification,
    table,
    popup,
    tooltip,
    tabs,
    gatewayPortfolio,
    assetTable,
    select,
    submenu,
    sidebar,
    grid,
    dex,
    statusTag,
    slider,
    sliderThumb,
    new: equilibriumThemeV2.new,
};
export default theme;
//# sourceMappingURL=equilibrium-v2.theme.js.map