{"version":3,"sources":["../src/Button/ButtonBase.module.css","../../postcss-preset-primer/src/mixins/focusOutline.css","../../postcss-preset-primer/src/mixins/focusOutlineOnEmphasis.css"],"names":[],"mappings":"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","file":"ButtonBase-0764b242.css","sourcesContent":["/* Base styles */\n.ButtonBase {\n  display: flex;\n  min-width: max-content;\n  height: var(--control-medium-size);\n  /* stylelint-disable-next-line primer/spacing */\n  padding: 0 var(--control-medium-paddingInline-normal);\n  font-family: inherit;\n  font-size: var(--text-body-size-medium);\n  font-weight: var(--base-text-weight-medium);\n  color: var(--button-default-fgColor-rest);\n  text-align: center;\n  text-decoration: none;\n  cursor: pointer;\n  user-select: none;\n  background-color: transparent;\n  border: var(--borderWidth-thin) solid;\n  border-color: var(--button-default-borderColor-rest);\n  border-radius: var(--borderRadius-medium);\n  transition: 80ms cubic-bezier(0.65, 0, 0.35, 1);\n  transition-property: color, fill, background-color, border-color;\n  appearance: none;\n  align-items: center;\n  justify-content: space-between;\n  gap: var(--base-size-8);\n\n  &:hover {\n    transition-duration: 80ms;\n  }\n\n  &:focus-visible {\n    @mixin focusOutline;\n  }\n\n  &:active {\n    transition: none;\n  }\n\n  &:disabled,\n  &[aria-disabled='true']:not([data-loading='true']) {\n    cursor: not-allowed;\n    box-shadow: none;\n\n    & .Visual,\n    & .CounterLabel {\n      color: inherit;\n    }\n  }\n\n  @media (forced-colors: active) {\n    &:focus {\n      outline: solid 1px transparent;\n    }\n  }\n\n  /* Visuals */\n  & :where(.Visual) {\n    display: flex;\n    color: var(--fgColor-muted);\n    pointer-events: none;\n  }\n\n  /* mostly for CounterLabel */\n  & :where(.VisualWrap) {\n    display: flex;\n    pointer-events: none;\n  }\n\n  /* IconButton */\n\n  &:where(.IconButton) {\n    display: inline-grid;\n    width: var(--control-medium-size);\n    min-width: unset;\n    /* stylelint-disable-next-line primer/spacing */\n    padding: unset;\n    place-content: center;\n    flex-shrink: 0;\n\n    &:where([data-size='small']) {\n      width: var(--control-small-size);\n    }\n\n    &:where([data-size='large']) {\n      width: var(--control-large-size);\n    }\n  }\n\n  /* LinkButton */\n\n  &:where([href]) {\n    display: inline-flex;\n\n    &:hover {\n      text-decoration: none;\n    }\n  }\n\n  /* Button layout */\n\n  & :where(.ButtonContent) {\n    flex: 1 0 auto;\n    display: grid;\n    grid-template-areas: 'leadingVisual text trailingVisual';\n    grid-template-columns: min-content minmax(0, auto) min-content;\n    align-items: center;\n    align-content: center;\n\n    & > :not(:last-child) {\n      margin-right: var(--base-size-8);\n    }\n\n    /* Content alignment */\n\n    &:where([data-align='center']) {\n      justify-content: center;\n    }\n\n    &:where([data-align='start']) {\n      justify-content: flex-start;\n    }\n  }\n\n  & :where([data-component='leadingVisual']) {\n    grid-area: leadingVisual;\n  }\n\n  & :where(.Label) {\n    /* stylelint-disable-next-line primer/typography */\n    line-height: 1.4285714; /* temporary until we use Text component with --text-body-lineHeight-medium */\n    white-space: nowrap;\n    grid-area: text;\n  }\n\n  & :where([data-component='trailingVisual']) {\n    grid-area: trailingVisual;\n  }\n\n  & :where([data-component='trailingAction']) {\n    margin-right: calc(var(--base-size-4) * -1);\n  }\n\n  /* Size */\n\n  &:where([data-size='small']) {\n    height: var(--control-small-size);\n    /* stylelint-disable-next-line primer/spacing */\n    padding: 0 var(--control-small-paddingInline-condensed);\n    gap: var(--control-small-gap);\n    font-size: var(--text-body-size-small);\n\n    & .ButtonContent > :not(:last-child) {\n      /* stylelint-disable-next-line primer/spacing */\n      margin-right: var(--control-small-gap);\n    }\n\n    & .Label {\n      /* stylelint-disable-next-line primer/typography */\n      line-height: 1.6666667; /* temporary until we use Text component with --text-body-lineHeight-small */\n    }\n  }\n\n  &:where([data-size='large']) {\n    height: var(--control-large-size);\n    /* stylelint-disable-next-line primer/spacing */\n    padding: 0 var(--control-large-paddingInline-spacious);\n    gap: var(--control-large-gap);\n\n    & .ButtonContent > :not(:last-child) {\n      /* stylelint-disable-next-line primer/spacing */\n      margin-right: var(--control-large-gap);\n    }\n  }\n\n  /* Full width */\n\n  &:where([data-block='block']) {\n    width: 100%;\n  }\n\n  /* Wrap label text */\n\n  &:where([data-label-wrap='true']) {\n    min-width: fit-content;\n    height: unset;\n    min-height: var(--control-medium-size);\n\n    & .ButtonContent {\n      flex: 1 1 auto;\n      align-self: stretch;\n      /* stylelint-disable-next-line primer/spacing */\n      padding-block: calc(var(--control-medium-paddingBlock) - var(--base-size-2));\n    }\n\n    & .Label {\n      word-break: break-word;\n      white-space: unset;\n    }\n\n    &:where([data-size='small']) {\n      height: unset;\n      min-height: var(--control-small-size);\n\n      & .ButtonContent {\n        /* stylelint-disable-next-line primer/spacing */\n        padding-block: calc(var(--control-small-paddingBlock) - var(--base-size-2));\n      }\n    }\n\n    &:where([data-size='large']) {\n      height: unset;\n      min-height: var(--control-large-size);\n      /* stylelint-disable-next-line primer/spacing */\n      padding-inline: var(--control-large-paddingInline-spacious);\n\n      & .ButtonContent {\n        /* stylelint-disable-next-line primer/spacing */\n        padding-block: calc(var(--control-large-paddingBlock) - var(--base-size-2));\n      }\n    }\n  }\n\n  /* Loading */\n\n  /* only hide label if there's no leading/trailing visuals\n  * move spinner to label spot if not leading/trailing visuals\n  */\n\n  &:where([data-loading='true']) {\n    &\n      .LoadingSpinner:not(\n        [data-component='leadingVisual'],\n        [data-component='trailingVisual'],\n        [data-component='trailingAction']\n      ) {\n      grid-area: text;\n      margin-right: 0 !important;\n      place-self: center;\n\n      & + .Label {\n        visibility: hidden;\n      }\n    }\n  }\n\n  /* Default Variant */\n\n  &:where([data-variant='default']) {\n    color: var(--button-default-fgColor-rest);\n    background-color: var(--button-default-bgColor-rest);\n    box-shadow: var(--button-default-shadow-resting);\n\n    &[aria-expanded='true'] {\n      background-color: var(--button-default-bgColor-active);\n      border-color: var(--button-default-borderColor-active);\n    }\n\n    &:hover {\n      background-color: var(--button-default-bgColor-hover);\n      border-color: var(--button-default-borderColor-hover);\n    }\n\n    &:active {\n      background-color: var(--button-default-bgColor-active);\n      border-color: var(--button-default-borderColor-active);\n    }\n\n    &:disabled,\n    &[aria-disabled='true']:not([data-loading='true']) {\n      color: var(--control-fgColor-disabled);\n      background-color: var(--button-default-bgColor-disabled);\n      border-color: var(--button-default-borderColor-disabled);\n      box-shadow: none;\n    }\n\n    & .CounterLabel {\n      background-color: var(--buttonCounter-default-bgColor-rest) !important; /* temporarily override our own sx prop */\n    }\n\n    &:where(.IconButton) {\n      color: var(--fgColor-muted);\n    }\n  }\n\n  /* Primary variant */\n\n  &:where([data-variant='primary']) {\n    color: var(--button-primary-fgColor-rest);\n    background-color: var(--button-primary-bgColor-rest);\n    border-color: var(--button-primary-borderColor-rest);\n    box-shadow: var(--shadow-resting-small);\n\n    &[aria-expanded='true'] {\n      background-color: var(--button-primary-bgColor-active);\n      box-shadow: var(--button-primary-shadow-selected);\n    }\n\n    &:hover {\n      background-color: var(--button-primary-bgColor-hover);\n      border-color: var(--button-primary-borderColor-hover);\n    }\n\n    &:focus-visible {\n      @mixin focusOutlineOnEmphasis;\n    }\n\n    &:active {\n      background-color: var(--button-primary-bgColor-active);\n      box-shadow: var(--button-primary-shadow-selected);\n    }\n\n    &:disabled,\n    &[aria-disabled='true']:not([data-loading='true']) {\n      color: var(--button-primary-fgColor-disabled);\n      background-color: var(--button-primary-bgColor-disabled);\n      border-color: var(--button-primary-borderColor-disabled);\n      box-shadow: none;\n    }\n\n    & .CounterLabel {\n      color: var(--button-primary-fgColor-rest) !important; /* temporarily override our own sx prop */\n      background-color: var(--buttonCounter-primary-bgColor-rest) !important; /* temporarily override our own sx prop */\n    }\n\n    /* temporarily using the fgColor to match legacy and reduce visual changes- will eventually be iconColor */\n    & .Visual {\n      color: var(--button-primary-fgColor-rest);\n    }\n  }\n\n  /* Danger variant */\n\n  &:where([data-variant='danger']) {\n    color: var(--button-danger-fgColor-rest);\n    background-color: var(--button-danger-bgColor-rest);\n    box-shadow: var(--button-default-shadow-resting);\n\n    &[aria-expanded='true'] {\n      color: var(--button-danger-fgColor-active);\n      background-color: var(--button-danger-bgColor-active);\n      border-color: var(--button-danger-borderColor-active);\n      box-shadow: var(--button-danger-shadow-selected);\n\n      & .Visual {\n        color: var(--button-danger-iconColor-hover);\n      }\n    }\n\n    &:hover {\n      color: var(--button-danger-fgColor-hover);\n      background-color: var(--button-danger-bgColor-hover);\n      border-color: var(--button-danger-borderColor-hover);\n      box-shadow: var(--shadow-resting-small);\n\n      & .CounterLabel {\n        color: var(--buttonCounter-danger-fgColor-hover) !important; /* temporarily override our own sx prop */\n        background-color: var(--buttonCounter-danger-bgColor-hover) !important;\n      }\n\n      & .Visual {\n        color: var(--button-danger-iconColor-hover);\n      }\n    }\n\n    &:active {\n      color: var(--button-danger-fgColor-active);\n      background-color: var(--button-danger-bgColor-active);\n      border-color: var(--button-danger-borderColor-active);\n      box-shadow: var(--button-danger-shadow-selected);\n\n      & .CounterLabel {\n        color: var(--buttonCounter-danger-fgColor-hover) !important; /* temporarily override our own sx prop */\n        background-color: var(--buttonCounter-danger-bgColor-hover) !important;\n      }\n\n      & .Visual {\n        color: var(--button-danger-iconColor-hover);\n      }\n    }\n\n    &:disabled,\n    &[aria-disabled='true']:not([data-loading='true']) {\n      color: var(--button-danger-fgColor-disabled);\n      background-color: var(--button-danger-bgColor-disabled);\n      border-color: var(--button-default-borderColor-disabled);\n      box-shadow: none;\n\n      & .CounterLabel {\n        color: var(--buttonCounter-danger-fgColor-disabled) !important; /* temporarily override our own sx prop */\n        background-color: var(--buttonCounter-danger-bgColor-disabled) !important;\n      }\n    }\n\n    & .CounterLabel {\n      color: var(--buttonCounter-danger-fgColor-rest) !important; /* temporarily override our own sx prop */\n      background-color: var(--buttonCounter-danger-bgColor-rest) !important;\n    }\n\n    & .Visual {\n      color: var(--button-danger-iconColor-rest);\n    }\n  }\n\n  /* Invisible variant */\n\n  &:where([data-variant='invisible']) {\n    color: var(--button-default-fgColor-rest);\n    border-color: transparent;\n    box-shadow: none;\n\n    &[aria-expanded='true'] {\n      background-color: var(--button-invisible-bgColor-active);\n    }\n\n    &:hover {\n      background-color: var(--button-invisible-bgColor-hover);\n\n      & .Visual {\n        color: var(--button-invisible-iconColor-hover);\n      }\n    }\n\n    &:active {\n      background-color: var(--button-invisible-bgColor-active);\n\n      & .Visual {\n        color: var(--button-invisible-iconColor-hover);\n      }\n    }\n\n    &:disabled,\n    &[aria-disabled='true']:not([data-loading='true']) {\n      color: var(--button-invisible-fgColor-disabled);\n      background-color: var(--button-invisible-bgColor-disabled);\n      border-color: var(--button-invisible-borderColor-disabled);\n      box-shadow: none;\n    }\n\n    & .Visual {\n      color: var(--button-invisible-iconColor-rest);\n    }\n\n    & .CounterLabel {\n      background-color: var(--buttonCounter-invisible-bgColor-rest) !important;\n    }\n\n    &:where(.IconButton) {\n      color: var(--button-invisible-iconColor-rest);\n    }\n  }\n\n  /* Link variant */\n\n  &:where([data-variant='link']) {\n    display: inline-flex;\n    min-width: fit-content;\n    height: unset;\n    padding: 0;\n    font-size: inherit;\n    color: var(--fgColor-link);\n    text-align: left;\n    border: unset;\n\n    &:hover:not(:disabled, [data-inactive]) {\n      text-decoration: underline;\n    }\n\n    &:focus-visible,\n    &:focus {\n      outline-offset: 2px;\n    }\n\n    &:disabled,\n    &[aria-disabled='true']:not([data-loading='true']) {\n      color: var(--control-fgColor-disabled);\n      background-color: transparent;\n      border-color: transparent;\n    }\n\n    & .Label {\n      white-space: unset;\n    }\n\n    &:where([data-inactive]) {\n      color: var(--button-inactive-fgColor);\n      background: transparent !important;\n    }\n\n    & .Visual {\n      color: var(--fgColor-link);\n    }\n  }\n\n  /* Inactive */\n\n  &:where([data-inactive]),\n  &:where([data-inactive]):hover {\n    color: var(--button-inactive-fgColor);\n    cursor: auto;\n    background-color: var(--button-inactive-bgColor);\n    /* stylelint-disable-next-line primer/colors */\n    border-color: var(--button-inactive-bgColor);\n\n    & .Visual,\n    & .CounterLabel {\n      color: inherit !important;\n    }\n  }\n\n  /* Icon-only + Counter */\n\n  &:where([data-has-count]):has([data-component='leadingVisual']):not(:has([data-component='text'])) {\n    /* stylelint-disable-next-line primer/spacing */\n    padding-inline: var(--control-medium-paddingInline-condensed);\n\n    &:where([data-size='small']) {\n      /* stylelint-disable-next-line primer/spacing */\n      padding-inline: var(--control-xsmall-paddingInline-condensed);\n    }\n\n    &:where([data-size='large']) {\n      /* stylelint-disable-next-line primer/spacing */\n      padding-inline: var(--control-large-paddingInline-normal);\n    }\n  }\n}\n\n.ConditionalWrapper {\n  display: block;\n}\n","@define-mixin focusOutline $outlineOffset: -2px, $outlineColor: var(--focus-outlineColor) {\n  outline: 2px solid $outlineColor;\n  outline-offset: $outlineOffset;\n  box-shadow: none;\n}\n","/* outline with fg box-shadow for buttons */\n@define-mixin focusOutlineOnEmphasis $outlineOffset: -2px, $outlineColor: var(--focus-outlineColor) {\n  outline: 2px solid $outlineColor;\n  outline-offset: $outlineOffset;\n  /* stylelint-disable-next-line primer/box-shadow */\n  box-shadow: inset 0 0 0 3px var(--fgColor-onEmphasis);\n}\n"]}