import {
  colors,
  darkGradient,
  themeOr
} from "./chunk-2VBDEO6M.js";
import {
  bp
} from "./chunk-JSGRNWSB.js";

// src/styles/common.tsx
import { css } from "@emotion/react";
import styled from "@emotion/styled";
var rootFontSizePx = 12;
var rootFontSizeRems = rootFontSizePx / 16;
var standardLineHeightEms = 1.21;
var headingContentMarginPx = 30;
function buildStandardContentInset(smPx, minSmMaxLgPx, lgPx) {
  const smCSS = css`
    ${bp.sm(`
      margin-left: auto;
      margin-right: auto;
      width: calc(100% - ${smPx * 2}px);
    `)}
  `;
  const minSmMaxLgCSS = css`
    ${bp.minSmMaxLg(`
      margin-left: auto;
      margin-right: auto;
      width: calc(100% - ${minSmMaxLgPx * 2}px);
    `)}
  `;
  const lgCSS = css`
    ${bp.lg(`
      margin-left: auto;
      margin-right: auto;
      width: calc(100% - ${lgPx * 2}px);
      max-width: 1280px;
    `)}
  `;
  return {
    smPx,
    minSmMaxLgPx,
    lgPx,
    smCSS,
    minSmMaxLgCSS,
    lgCSS,
    css: css`
      ${lgCSS}
      ${smCSS}
      ${minSmMaxLgCSS}
    `
  };
}
var standardContentInset = buildStandardContentInset(16, 24, 32);
var cardBorderRadiusPx = 16;
var standardBorderRadius = (radius) => {
  const borderRadiusPx = Array.isArray(radius) ? radius.map((r) => `${r}px`).join(" ") : `${radius}px`;
  return `
    border-radius: ${borderRadiusPx};
  `;
};
var standardCardShadow = css`
  box-shadow:
    0px 4px 10px 0px rgba(0, 0, 0, 0.08),
    0px 8px 24px 0px rgba(0, 0, 0, 0.04);
`;
var pageBorderRadiusPx = 16;
var pageBorderRadius = `
  border-radius: ${pageBorderRadiusPx}px;
`;
var getFocusOutline = ({
  theme,
  onBgHex
}) => `${onBgHex ? theme.hcNeutralFromBg(onBgHex) : theme.hcNeutral} dashed 1px`;
var outlineOffset = "-2px";
var standardFocusOutline = ({ theme }) => css`
  &,
  & a,
  & button {
    &:focus-visible {
      outline: ${getFocusOutline({ theme })};
      outline-offset: ${outlineOffset};
    }
  }
`;
var delta = ({
  theme,
  delta: delta2 = 0,
  invertSuccessColor = false
}) => css`
  color: ${delta2 >= 0 ? invertSuccessColor ? theme.danger : theme.success : invertSuccessColor ? theme.success : theme.danger};
  border-color: ${delta2 >= 0 ? invertSuccessColor ? theme.danger : theme.success : invertSuccessColor ? theme.success : theme.danger};
`;
var subtext = ({ theme }) => css`
  color: ${theme.c6Neutral};
  font-weight: 600;
`;
var Subtext = styled.div`
  ${subtext}
`;
var darkGradientBg = css`
  background: ${darkGradient};
`;
var overlaySurfaceBorderColor = ({
  theme,
  important = false
}) => css`
  border-color: ${themeOr(theme.c1Neutral, theme.c3Neutral)({ theme })}
    ${important ? "!important" : ""};
`;
var overlaySurface = ({
  theme,
  important = false
}) => css`
  background-color: ${themeOr(colors.white, theme.c1Neutral)({ theme })}
    ${important ? "!important" : ""};
  border: 0.5px solid ${important ? "!important" : ""};
  ${overlaySurfaceBorderColor({ theme, important })};
  ${themeOr(
  `box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.08), 0px 1px 4px rgba(0, 0, 0, 0.1) ${important ? "!important" : ""};`,
  ""
)({ theme })}
`;
var mcBold = (theme) => css`
  font-weight: 600;
  color: ${theme.mcNeutral};
`;
var mcBoldStyled = ({ theme }) => mcBold(theme);

export {
  rootFontSizePx,
  rootFontSizeRems,
  standardLineHeightEms,
  headingContentMarginPx,
  standardContentInset,
  cardBorderRadiusPx,
  standardBorderRadius,
  standardCardShadow,
  pageBorderRadiusPx,
  pageBorderRadius,
  getFocusOutline,
  outlineOffset,
  standardFocusOutline,
  delta,
  subtext,
  Subtext,
  darkGradientBg,
  overlaySurfaceBorderColor,
  overlaySurface,
  mcBold,
  mcBoldStyled
};
