@primer/react-brand 0.80.0 → 0.80.1-rc.bcf1e5f2

package/esm/PricingOptions/PricingOptions.module.js.map

@@ -1 +1 @@
-{"version":3,"file":"PricingOptions.module.js","names":[],"sources":["../../src/PricingOptions/PricingOptions.module.css"],"sourcesContent":["/* ---------------------------------------------------------- */\n/* Container                                               */\n/* ---------------------------------------------------------- */\n\n.PricingOptions {\n  --brand-pricing-options-item-gap: var(--brand-PricingOptions-items-gap);\n  --brand-pricing-options-container-padding-inline: 0;\n  --brand-pricing-options-column-count: 1;\n\n  /* prettier-ignore */\n  --brand-pricing-options-template-areas: \n    'labels'\n    'leadingComponent'\n    'header'\n    'description'\n    'price'\n    'actions'\n    'feature-list'\n    'footnote'\n    ;\n\n  display: grid;\n  row-gap: var(--brand-pricing-options-item-gap, 0);\n  padding-inline: var(--brand-pricing-options-container-padding-inline);\n}\n\n@media screen and (max-width: 63.24rem) {\n  .PricingOptions {\n    margin-inline: auto;\n    max-width: 488px;\n  }\n}\n\n@media (min-width: 63.25rem) {\n  .PricingOptions {\n    grid-template-areas: var(--brand-pricing-options-template-areas);\n    grid-template-columns: repeat(var(--brand-pricing-options-column-count), minmax(0, 1fr));\n    column-gap: var(--brand-pricing-options-item-gap, 0);\n    row-gap: 0;\n  }\n\n  .PricingOptions--items1 {\n    --brand-pricing-options-column-count: 1;\n  }\n\n  .PricingOptions--items2 {\n    --brand-pricing-options-column-count: 2;\n  }\n\n  .PricingOptions--items3 {\n    --brand-pricing-options-column-count: 3;\n  }\n\n  .PricingOptions--items4 {\n    --brand-pricing-options-column-count: 4;\n  }\n}\n\n.PricingOptions__labels {\n  display: none;\n}\n\n@media (min-width: 63.25rem) {\n  .PricingOptions__labels {\n    --brand-pricing-options-column-count: 1;\n\n    display: grid;\n    grid-column: 1 / -1;\n    grid-row: labels;\n    grid-template-columns: repeat(var(--brand-pricing-options-column-count), minmax(0, 1fr));\n    column-gap: var(--brand-pricing-options-item-gap, 0);\n  }\n\n  .PricingOptions__label-cell {\n    position: relative;\n    display: flex;\n    align-items: center;\n    min-height: var(--base-size-54);\n    padding-block: var(--base-size-16);\n    background-color: var(--brand-PricingOptions-item-bgColor-solid);\n  }\n\n  /* Accent top border — uses ::after so it can overflow into the column gap */\n  .PricingOptions__label-cell--has-label::after {\n    content: '';\n    position: absolute;\n    inset-block-start: 0;\n    inset-inline-start: calc(var(--brand-pricing-options-item-gap, 0px) / 2 * -1);\n    inset-inline-end: calc(var(--brand-pricing-options-item-gap, 0px) / 2 * -1);\n    height: var(--brand-borderWidth-thin);\n    background-color: var(--brand-color-text-emphasized);\n    z-index: 1;\n  }\n\n  /* First cell: don't overflow past container start (cards override below) */\n  .PricingOptions__label-cell--has-label:first-child::after {\n    inset-inline-start: 0;\n  }\n\n  /* Last cell: don't overflow past container end (cards override below) */\n  .PricingOptions__label-cell--has-label:last-child::after {\n    inset-inline-end: 0;\n  }\n\n  .PricingOptions--layout-default .PricingOptions__label-cell--has-label::after {\n    inset-inline-start: 0;\n    inset-inline-end: 0;\n  }\n\n  /* ---- Default layout labels ---- */\n\n  /* Continuous bottom border across entire labels row — uses ::after to extend into container padding */\n  .PricingOptions--layout-default .PricingOptions__labels {\n    position: relative;\n  }\n\n  .PricingOptions--layout-default .PricingOptions__labels::after {\n    content: '';\n    position: absolute;\n    inset-block-end: 0;\n    inset-inline-start: calc(var(--brand-pricing-options-container-padding-inline, 0px) * -1);\n    inset-inline-end: calc(var(--brand-pricing-options-container-padding-inline, 0px) * -1);\n    height: var(--brand-borderWidth-thin);\n    background-color: var(--brand-color-border-subtle);\n  }\n\n  .PricingOptions--layout-default .PricingOptions__label-cell {\n    margin-inline: calc(var(--brand-pricing-options-item-gap) / 2 * -1);\n    padding-inline: calc(var(--brand-pricing-options-item-gap) / 2);\n  }\n\n  .PricingOptions--layout-default .PricingOptions__label-cell:first-child {\n    margin-inline-start: calc(var(--brand-pricing-options-container-padding-inline) * -1);\n    padding-inline-start: var(--brand-pricing-options-container-padding-inline);\n  }\n\n  .PricingOptions--layout-default .PricingOptions__label-cell:last-child {\n    margin-inline-end: calc(var(--brand-pricing-options-container-padding-inline) * -1);\n    padding-inline-end: var(--brand-pricing-options-container-padding-inline);\n  }\n\n  /* Empty cells: transparent bg/borders but structurally visible so dividers show */\n  .PricingOptions--layout-default .PricingOptions__label-cell--empty {\n    background-color: transparent;\n    border-block-start-color: transparent;\n  }\n\n  /* Vertical dividers between label cells, centered in the gap */\n  .PricingOptions--layout-default .PricingOptions__label-cell + .PricingOptions__label-cell::before {\n    content: '';\n    position: absolute;\n    inset-block: 0;\n    width: var(--brand-borderWidth-thin);\n    inset-inline-start: 0;\n    background-color: var(--brand-color-border-subtle);\n  }\n\n  .PricingOptions--layout-default.PricingOptions--appearance-gradient\n    .PricingOptions__label-cell\n    + .PricingOptions__label-cell::before {\n    mask-image: var(--brand-PricingOptions-borderMask);\n  }\n\n  /* ---- Cards layout labels ---- */\n\n  .PricingOptions--layout-cards .PricingOptions__label-cell {\n    padding-inline: var(--base-size-28);\n    border-inline: var(--brand-borderWidth-thin) solid var(--brand-color-border-subtle);\n    /* border-block-end: var(--brand-borderWidth-thin) solid var(--brand-color-border-muted); */\n  }\n\n  .PricingOptions--layout-cards .PricingOptions__label-cell--empty {\n    opacity: 0;\n    pointer-events: none;\n  }\n\n  /* Cards: keep accent border inside the card boundary */\n  .PricingOptions--layout-cards .PricingOptions__label-cell--has-label::after {\n    inset-inline-start: 0;\n    inset-inline-end: 0;\n  }\n}\n\n/* ---------------------------------------------------------- */\n/* Layout: default                                         */\n/* ---------------------------------------------------------- */\n\n.PricingOptions--layout-default {\n  position: relative;\n}\n\n.PricingOptions--layout-default.PricingOptions--appearance-solid {\n  border: solid 1px var(--brand-color-border-subtle);\n  background-color: var(--brand-PricingOptions-item-bgColor-solid);\n}\n\n.PricingOptions--layout-default.PricingOptions--appearance-gradient,\n.PricingOptions--layout-cards.PricingOptions--appearance-gradient .PricingOptions__item {\n  background: linear-gradient(\n    180deg,\n    var(--brand-PricingOptions-item-bgColor-gradient-start) 0%,\n    var(--brand-PricingOptions-item-bgColor-gradient-end) 100%\n  );\n}\n\n.PricingOptions--layout-default.PricingOptions--appearance-gradient::before,\n.PricingOptions--layout-cards.PricingOptions--appearance-gradient .PricingOptions__item::before {\n  position: absolute;\n  content: '';\n  inset: 0;\n  pointer-events: none;\n  border-radius: inherit;\n  mask-image: var(--brand-PricingOptions-borderMask);\n  border: var(--brand-borderWidth-thin) solid var(--brand-color-border-subtle);\n}\n\n@media (min-width: 63.25rem) {\n  .PricingOptions--layout-default {\n    padding-inline: var(--brand-pricing-options-container-padding-inline);\n  }\n}\n\n.PricingOptions--layout-default .PricingOptions__item {\n  --brand-pricing-options-item-padding-inline: var(--base-size-24);\n\n  position: relative; /* Used for positioning the divider between items */\n  padding-inline: var(--base-size-24);\n  padding-block: var(--base-size-20);\n}\n\n@media (min-width: 63.25rem) {\n  .PricingOptions--layout-default .PricingOptions__item {\n    --brand-pricing-options-item-padding-inline: 0;\n\n    padding-inline: 0;\n    padding-block: var(--base-size-40);\n  }\n}\n\n/* Horizontal divider between items on small viewports */\n.PricingOptions--layout-default .PricingOptions__item + .PricingOptions__item::before {\n  content: '';\n  position: absolute;\n  inset-inline: 0;\n  height: 1px;\n  background-color: var(--brand-color-border-subtle);\n}\n\n/* Vertical divider between items on larger viewports */\n@media (min-width: 63.25rem) {\n  .PricingOptions--layout-default .PricingOptions__item + .PricingOptions__item::before {\n    inset-inline: 0;\n    inset-block: 0;\n    width: 1px;\n    height: auto;\n    margin-block-start: 0;\n    margin-inline-start: calc(var(--brand-pricing-options-item-gap) / 2 * -1);\n  }\n\n  .PricingOptions--layout-default.PricingOptions--appearance-gradient\n    .PricingOptions__item\n    + .PricingOptions__item::before {\n    mask-image: var(--brand-PricingOptions-borderMask);\n  }\n}\n\n/* ---------------------------------------------------------- */\n/* Layout: cards                                           */\n/* ---------------------------------------------------------- */\n\n.PricingOptions--layout-cards .PricingOptions__item {\n  --brand-pricing-options-item-padding-inline: var(--base-size-32);\n\n  position: relative;\n  padding-inline: var(--base-size-32);\n  padding-block: var(--base-size-32);\n}\n\n.PricingOptions--layout-cards.PricingOptions--appearance-solid .PricingOptions__item {\n  background-color: var(--brand-PricingOptions-item-bgColor-solid);\n  border: solid var(--brand-borderWidth-thin) var(--brand-color-border-subtle);\n}\n\n/* ---------------------------------------------------------- */\n/* Items                                                      */\n/* ---------------------------------------------------------- */\n\n@media (min-width: 48rem) {\n  :where(.PricingOptions--layout-cards.PricingOptions--items4) {\n    row-gap: var(--brand-pricing-options-item-gap);\n  }\n}\n\n@media (min-width: 63.25rem) {\n  .PricingOptions--items1 {\n    width: 50%;\n    margin-inline: auto;\n  }\n\n  .PricingOptions--layout-default.PricingOptions--items1 {\n    --brand-pricing-options-container-padding-inline: var(--brand-PricingOptions-items1-container-paddingInline);\n  }\n\n  .PricingOptions--layout-default.PricingOptions--items2 {\n    --brand-pricing-options-item-gap: var(--brand-PricingOptions-items2-gap);\n    --brand-pricing-options-container-padding-inline: var(--brand-PricingOptions-items2-container-padding-inline);\n  }\n\n  .PricingOptions--layout-default.PricingOptions--items3 {\n    --brand-pricing-options-item-gap: var(--brand-PricingOptions-items3-gap);\n    --brand-pricing-options-container-padding-inline: var(--brand-PricingOptions-items3-container-padding-inline);\n  }\n  .PricingOptions--layout-default.PricingOptions--items4 {\n    --brand-pricing-options-item-gap: var(--brand-PricingOptions-items4-gap);\n    --brand-pricing-options-container-padding-inline: var(--brand-PricingOptions-items4-container-padding-inline);\n  }\n}\n\n/* ---------------------------------------------------------- */\n/* Item inner layout                                       */\n/* ---------------------------------------------------------- */\n\n.PricingOptions__item {\n  display: grid;\n  grid-template-areas: var(--brand-pricing-options-template-areas);\n}\n\n@media (min-width: 63.25rem) {\n  .PricingOptions__item {\n    grid-row: header / footnote;\n    grid-template-rows: subgrid;\n  }\n\n  .PricingOptions__item--has-leading-component {\n    grid-row: leadingComponent / footnote;\n  }\n}\n\n.PricingOptions__item--align-center {\n  justify-items: center;\n}\n\n.PricingOptions__item--align-center .PricingOptions__price,\n.PricingOptions__item--align-center .PricingOptions__description {\n  text-align: center;\n  justify-content: center;\n}\n\n/*\n * Backwards compatibility for browsers that don't support subgrid.\n * Once subgrid is supported in the last 3 major versions of Safari (i.e., when Safari 18 is released), it can be fully removed.\n * https://caniuse.com/css-subgrid\n */\n@supports not (grid-template-rows: subgrid) {\n  @media (min-width: 63.28rem) {\n    .PricingOptions__item {\n      grid-template-areas: var(--brand-pricing-options-template-areas);\n      grid-template-columns: 1fr;\n      grid-template-rows: auto;\n    }\n  }\n}\n\n/* ---------------------------------------------------------- */\n/* Content                                                 */\n/* ---------------------------------------------------------- */\n\n.PricingOptions__header {\n  display: flex;\n  grid-area: header;\n  row-gap: var(--base-size-16);\n}\n\n/* When item is left-aligned, keep the heading at the start of the card */\n.PricingOptions__item:not(.PricingOptions__item--align-center) .PricingOptions__header {\n  align-items: center;\n  margin-block-end: var(--base-size-16);\n}\n\n.PricingOptions__item:not(.PricingOptions__item--align-center) .PricingOptions__heading {\n  margin-block: var(--base-size-16);\n  flex: 0 1 auto;\n  order: 1;\n  align-self: flex-start;\n}\n\n@media (min-width: 63.24rem) {\n  .PricingOptions__item:not(.PricingOptions__item--align-center) .PricingOptions__heading {\n    margin-block: 0;\n  }\n}\n\n/* When item is centered, center the heading */\n.PricingOptions__item--align-center .PricingOptions__header {\n  justify-content: center;\n}\n\n.PricingOptions__item--align-center .PricingOptions__heading {\n  margin-block-start: 0;\n  margin-block-end: var(--base-size-16);\n  text-align: center;\n}\n\n.PricingOptions__leading-component {\n  grid-row: leadingComponent;\n}\n\n.PricingOptions__leading-component :is(img, picture) {\n  display: block;\n}\n\n.PricingOptions__label {\n  color: var(--brand-color-text-default);\n  font-family: var(--brand-fontStack-monospace);\n  font-size: var(--brand-text-size-100);\n  font-weight: var(--brand-text-weight-500);\n  letter-spacing: var(--brand-text-letterSpacing-100);\n  line-height: var(--brand-text-lineHeight-200);\n  text-transform: uppercase;\n}\n\n.PricingOptions__heading {\n  margin-block: var(--base-size-16);\n  flex: 0 1 auto; /* Minimum width before wrapping */\n  order: 1;\n  align-self: flex-start;\n}\n\n.PricingOptions__description {\n  grid-row: description;\n}\n\n.PricingOptions__price {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: flex-start;\n  grid-row: price;\n  padding-block-start: var(--base-size-20);\n  padding-block-end: var(--base-size-8);\n}\n\n@media (max-width: 63.25rem) {\n  .PricingOptions__price-value,\n  .PricingOptions__price-currency-symbol {\n    font-size: var(--brand-text-size-900);\n  }\n}\n\n.PricingOptions__price-amount {\n  display: flex;\n  align-items: flex-end;\n}\n\n.PricingOptions__price-currency-code {\n  margin-inline-start: var(--base-size-4);\n  margin-block-end: var(--base-size-4);\n  color: var(--brand-color-text-muted);\n}\n\n.PricingOptions__price-original-price {\n  display: inline-flex;\n  align-self: center;\n  text-decoration: none;\n  margin-inline-start: var(--base-size-8);\n}\n\n.PricingOptions__price-original-price-value {\n  text-decoration: line-through;\n}\n\n.PricingOptions__price-trailing-text {\n  flex: 1 0 100%;\n  display: block;\n}\n\n.PricingOptions__actions {\n  grid-row: actions;\n  display: flex;\n  flex-direction: column;\n  gap: var(--base-size-8);\n  align-items: flex-end;\n  padding-block-start: var(--base-size-20);\n}\n\n.PricingOptions__actions-message {\n  display: flex;\n  gap: var(--base-size-12);\n  align-items: flex-start;\n  inline-size: 100%;\n  max-inline-size: 100%;\n  padding: var(--base-size-12);\n  border-block: var(--brand-borderWidth-thin) solid var(--brand-PricingOptions-actionsMessage-borderColor);\n  border-inline: 0;\n  border-radius: 0;\n  background-color: var(--brand-PricingOptions-actionsMessage-bgColor);\n}\n\n.PricingOptions__actions-message-leading-component {\n  flex: 0 0 auto;\n  display: flex;\n  margin-block-start: var(--base-size-4);\n  color: var(--brand-PricingOptions-actionsMessage-accentColor);\n}\n\n.PricingOptions__actions-message-leading-component :where(svg) {\n  display: block;\n  inline-size: var(--base-size-16);\n  block-size: var(--base-size-16);\n}\n\n.PricingOptions__actions-message-content {\n  flex: 1 1 auto;\n  min-inline-size: 0;\n}\n\n.PricingOptions__actions-message-content :where(p) {\n  margin: 0;\n}\n\n/* MenuAction: full-width ActionMenu wrapper */\n.PricingOptions__menu-action {\n  width: 100%;\n}\n\n.PricingOptions__menu-action > * {\n  width: 100%;\n}\n\n/* Force ActionMenu button container to stretch full width */\n.PricingOptions__menu-action > * > * {\n  display: flex;\n  width: 100%;\n}\n\n/* Make the primary button fill remaining space next to the chevron */\n.PricingOptions__menu-action > * > * > :first-child {\n  flex: 1;\n}\n\n.PricingOptions__footnote {\n  grid-row: footnote;\n  display: block;\n  margin-block-start: var(--base-size-8);\n}\n\n/* ---------------------------------------------------------- */\n/* Feature list                                            */\n/* ---------------------------------------------------------- */\n\n.PricingOptions__feature-list {\n  --feature-list-font-size: var(--brand-text-size-200);\n  --feature-list-line-height: var(--brand-text-lineHeight-200);\n\n  display: flex;\n  flex-direction: column;\n  gap: var(--base-size-8);\n  grid-row: feature-list;\n  margin-block-start: var(--base-size-20);\n  padding-block-start: var(--base-size-20);\n  width: 100%;\n}\n\n.PricingOptions__feature-list--has-divider {\n  position: relative;\n  margin: 0;\n  margin-block-start: var(--base-size-20);\n  padding-block-start: var(--base-size-40);\n  padding-inline: 0;\n}\n\n/* Edge-to-edge divider above feature list */\n.PricingOptions__feature-list--has-divider::before {\n  content: '';\n  position: absolute;\n  inset-block-start: 0;\n  inset-inline-start: calc(var(--brand-pricing-options-item-padding-inline, 0px) * -1);\n  inset-inline-end: calc(var(--brand-pricing-options-item-padding-inline, 0px) * -1);\n  height: var(--brand-borderWidth-thin);\n  background-color: var(--brand-color-border-subtle);\n}\n\n/* Default layout: extend feature list divider into column gap */\n@media (min-width: 63.25rem) {\n  .PricingOptions--layout-default .PricingOptions__feature-list--has-divider::before {\n    inset-inline-start: calc(var(--brand-pricing-options-item-gap, 0px) / 2 * -1);\n    inset-inline-end: calc(var(--brand-pricing-options-item-gap, 0px) / 2 * -1);\n  }\n\n  /* First item: don't overflow past container start */\n  .PricingOptions--layout-default .PricingOptions__item:first-child .PricingOptions__feature-list--has-divider::before,\n  .PricingOptions--layout-default\n    .PricingOptions__labels\n    + .PricingOptions__item\n    .PricingOptions__feature-list--has-divider::before {\n    inset-inline-start: calc(var(--brand-pricing-options-container-padding-inline, 0px) * -1);\n  }\n\n  /* Last item: don't overflow past container end */\n  .PricingOptions--layout-default\n    .PricingOptions__item:not(:has(~ .PricingOptions__item))\n    .PricingOptions__feature-list--has-divider::before {\n    inset-inline-end: calc(var(--brand-pricing-options-container-padding-inline, 0px) * -1);\n  }\n\n  .PricingOptions--layout-default.PricingOptions--appearance-gradient\n    .PricingOptions__feature-list--has-divider::before {\n    mask-image: var(--brand-PricingOptions-borderMask);\n  }\n}\n\n.PricingOptions__feature-list-set:nth-child(n + 2) {\n  margin-block-start: var(--base-size-20);\n}\n\n.PricingOptions__feature-list-group-heading {\n  color: var(--brand-PricingOptions-featureList-group-heading-color);\n  margin-block-start: var(--base-size-12);\n  margin-block-end: var(--base-size-8);\n}\n\n.PricingOptions__feature-list-item--excluded span {\n  color: var(--brand-color-text-muted);\n}\n\n/* Info tooltip button */\n.PricingOptions__feature-list-item--has-info {\n  flex-wrap: nowrap;\n}\n\n.PricingOptions__feature-list-item--has-info > span {\n  flex: 1;\n  display: inline-flex;\n  align-items: baseline;\n  justify-content: space-between;\n}\n\n.PricingOptions__feature-list-item-info {\n  all: unset;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  cursor: pointer;\n  color: var(--brand-color-text-muted);\n  background-color: color-mix(in srgb, var(--brand-color-canvas-invert) 12%, transparent);\n  border: var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);\n  border-radius: 50%;\n  margin-inline-start: var(--base-size-8);\n  vertical-align: middle;\n  padding: var(--base-size-4);\n}\n\n.PricingOptions__feature-list-item-info svg {\n  width: var(--base-size-12);\n  height: var(--base-size-12);\n}\n\n.PricingOptions__feature-list-item-info:focus-visible {\n  outline: var(--brand-borderWidth-thick) solid var(--brand-color-focus);\n  outline-offset: 2px;\n}\n\n.PricingOptions__feature-list + .PricingOptions__feature-list-group-heading {\n  margin-block-start: var(--base-size-20);\n}\n\n.PricingOptions__feature-list-item,\n.PricingOptions__feature-list-item span {\n  font-size: var(--feature-list-font-size) !important;\n  line-height: var(--feature-list-line-height) !important;\n}\n\n.PricingOptions__feature-list-group-heading {\n  font-size: var(--feature-list-font-size) !important;\n}\n\n.PricingOptions--items4 .PricingOptions__feature-list {\n  --feature-list-font-size: var(--brand-text-size-100);\n  --feature-list-line-height: var(--brand-text-lineHeight-100);\n}\n\n/*\n * Accordion component overrides\n */\n\n/*  paddings and borders */\n.PricingOptions__feature-list-accordion {\n  border: 0;\n  padding: 0;\n}\n\n/* Remove hover effect */\n.PricingOptions__feature-list-accordion::after {\n  content: none !important;\n}\n\n/* Adjust heading spacing */\n.PricingOptions__feature-list-accordion-heading {\n  padding: var(--base-size-8) 0;\n  padding-inline-start: 0 !important; /* Fixes dotcom specificity issue */\n  padding-inline-end: 0 !important;\n  margin-block-start: calc(var(--base-size-16) * -1);\n  margin-block-end: var(--base-size-8);\n}\n\n/* Accordion heading styling */\n.PricingOptions__feature-list-accordion .PricingOptions__feature-list-accordion-heading :is(h1, h2, h3, h4, h5, h6) {\n  font-size: var(--feature-list-font-size);\n  line-height: var(--feature-list-line-height);\n  font-weight: var(--brand-text-subhead-weight-large);\n  gap: var(--base-size-8);\n  align-items: center;\n  justify-content: space-between;\n  display: flex;\n  width: 100%;\n}\n\n/* Hide default icon */\n.PricingOptions__feature-list-accordion .PricingOptions__feature-list-accordion-heading span {\n  display: none;\n}\n\n/* Adjust content paddings */\n.PricingOptions__feature-list-accordion .PricingOptions__feature-list-accordion-content {\n  padding: 0;\n  padding-block-start: var(--base-size-8);\n  padding-inline-start: 0 !important;\n}\n\n.PricingOptions__feature-list-accordion-chevron {\n  margin-inline-end: var(--base-size-4);\n}\n\n/* Chevron up icon */\n.PricingOptions__feature-list-accordion[open] .PricingOptions__feature-list-accordion-chevron {\n  transform: rotate(180deg);\n}\n\n.PricingOptions__feature-list-accordion-content {\n  animation: none !important;\n}\n"],"mappings":""}
+{"version":3,"file":"PricingOptions.module.js","names":[],"sources":["../../src/PricingOptions/PricingOptions.module.css"],"sourcesContent":["/* ---------------------------------------------------------- */\n/* Container                                               */\n/* ---------------------------------------------------------- */\n\n.PricingOptions {\n  --brand-pricing-options-item-gap: var(--brand-PricingOptions-items-gap);\n  --brand-pricing-options-container-padding-inline: 0;\n  --brand-pricing-options-column-count: 1;\n\n  /* prettier-ignore */\n  --brand-pricing-options-template-areas: \n    'labels'\n    'leadingComponent'\n    'header'\n    'description'\n    'price'\n    'actions'\n    'feature-list'\n    'footnote'\n    ;\n\n  display: grid;\n  row-gap: var(--brand-pricing-options-item-gap, 0);\n  padding-inline: var(--brand-pricing-options-container-padding-inline);\n}\n\n@media screen and (max-width: 63.24rem) {\n  .PricingOptions {\n    margin-inline: auto;\n    max-width: 488px;\n  }\n}\n\n@media (min-width: 63.25rem) {\n  .PricingOptions {\n    grid-template-areas: var(--brand-pricing-options-template-areas);\n    grid-template-columns: repeat(var(--brand-pricing-options-column-count), minmax(0, 1fr));\n    column-gap: var(--brand-pricing-options-item-gap, 0);\n    row-gap: 0;\n  }\n\n  .PricingOptions--items1 {\n    --brand-pricing-options-column-count: 1;\n  }\n\n  .PricingOptions--items2 {\n    --brand-pricing-options-column-count: 2;\n  }\n\n  .PricingOptions--items3 {\n    --brand-pricing-options-column-count: 3;\n  }\n\n  .PricingOptions--items4 {\n    --brand-pricing-options-column-count: 4;\n  }\n}\n\n.PricingOptions__labels {\n  display: none;\n}\n\n@media (min-width: 63.25rem) {\n  .PricingOptions__labels {\n    --brand-pricing-options-column-count: 1;\n\n    display: grid;\n    grid-column: 1 / -1;\n    grid-row: labels;\n    grid-template-columns: repeat(var(--brand-pricing-options-column-count), minmax(0, 1fr));\n    column-gap: var(--brand-pricing-options-item-gap, 0);\n  }\n\n  .PricingOptions__label-cell {\n    position: relative;\n    display: flex;\n    align-items: center;\n    min-height: var(--base-size-54);\n    padding-block: var(--base-size-16);\n    background-color: var(--brand-PricingOptions-item-bgColor-solid);\n  }\n\n  /* Accent top border — uses ::after so it can overflow into the column gap */\n  .PricingOptions__label-cell--has-label::after {\n    content: '';\n    position: absolute;\n    inset-block-start: 0;\n    inset-inline-start: calc(var(--brand-pricing-options-item-gap, 0px) / 2 * -1);\n    inset-inline-end: calc(var(--brand-pricing-options-item-gap, 0px) / 2 * -1);\n    height: var(--brand-borderWidth-thin);\n    background-color: var(--brand-color-text-emphasized);\n    z-index: 1;\n  }\n\n  /* First cell: don't overflow past container start (cards override below) */\n  .PricingOptions__label-cell--has-label:first-child::after {\n    inset-inline-start: 0;\n  }\n\n  /* Last cell: don't overflow past container end (cards override below) */\n  .PricingOptions__label-cell--has-label:last-child::after {\n    inset-inline-end: 0;\n  }\n\n  .PricingOptions--layout-default .PricingOptions__label-cell--has-label::after {\n    inset-inline-start: 0;\n    inset-inline-end: 0;\n  }\n\n  /* ---- Default layout labels ---- */\n\n  /* Continuous bottom border across entire labels row — uses ::after to extend into container padding */\n  .PricingOptions--layout-default .PricingOptions__labels {\n    position: relative;\n  }\n\n  .PricingOptions--layout-default .PricingOptions__labels::after {\n    content: '';\n    position: absolute;\n    inset-block-end: 0;\n    inset-inline-start: calc(var(--brand-pricing-options-container-padding-inline, 0px) * -1);\n    inset-inline-end: calc(var(--brand-pricing-options-container-padding-inline, 0px) * -1);\n    height: var(--brand-borderWidth-thin);\n    background-color: var(--brand-color-border-subtle);\n  }\n\n  .PricingOptions--layout-default .PricingOptions__label-cell {\n    margin-inline: calc(var(--brand-pricing-options-item-gap) / 2 * -1);\n    padding-inline: calc(var(--brand-pricing-options-item-gap) / 2);\n  }\n\n  .PricingOptions--layout-default .PricingOptions__label-cell:first-child {\n    margin-inline-start: calc(var(--brand-pricing-options-container-padding-inline) * -1);\n    padding-inline-start: var(--brand-pricing-options-container-padding-inline);\n  }\n\n  .PricingOptions--layout-default .PricingOptions__label-cell:last-child {\n    margin-inline-end: calc(var(--brand-pricing-options-container-padding-inline) * -1);\n    padding-inline-end: var(--brand-pricing-options-container-padding-inline);\n  }\n\n  /* Empty cells: transparent bg/borders but structurally visible so dividers show */\n  .PricingOptions--layout-default .PricingOptions__label-cell--empty {\n    background-color: transparent;\n    border-block-start-color: transparent;\n  }\n\n  /* Vertical dividers between label cells, centered in the gap */\n  .PricingOptions--layout-default .PricingOptions__label-cell + .PricingOptions__label-cell::before {\n    content: '';\n    position: absolute;\n    inset-block: 0;\n    width: var(--brand-borderWidth-thin);\n    inset-inline-start: 0;\n    background-color: var(--brand-color-border-subtle);\n  }\n\n  .PricingOptions--layout-default.PricingOptions--appearance-gradient\n    .PricingOptions__label-cell\n    + .PricingOptions__label-cell::before {\n    mask-image: var(--brand-PricingOptions-borderMask);\n  }\n\n  /* ---- Cards layout labels ---- */\n\n  .PricingOptions--layout-cards .PricingOptions__label-cell {\n    padding-inline: var(--base-size-28);\n    border-inline: var(--brand-borderWidth-thin) solid var(--brand-color-border-subtle);\n    /* border-block-end: var(--brand-borderWidth-thin) solid var(--brand-color-border-muted); */\n  }\n\n  .PricingOptions--layout-cards .PricingOptions__label-cell--empty {\n    opacity: 0;\n    pointer-events: none;\n  }\n\n  /* Cards: keep accent border inside the card boundary */\n  .PricingOptions--layout-cards .PricingOptions__label-cell--has-label::after {\n    inset-inline-start: 0;\n    inset-inline-end: 0;\n  }\n}\n\n/* ---------------------------------------------------------- */\n/* Layout: default                                         */\n/* ---------------------------------------------------------- */\n\n.PricingOptions--layout-default {\n  position: relative;\n}\n\n.PricingOptions--layout-default.PricingOptions--appearance-solid {\n  border: solid 1px var(--brand-color-border-subtle);\n  background-color: var(--brand-PricingOptions-item-bgColor-solid);\n}\n\n.PricingOptions--layout-default.PricingOptions--appearance-gradient,\n.PricingOptions--layout-cards.PricingOptions--appearance-gradient .PricingOptions__item {\n  background: linear-gradient(\n    180deg,\n    var(--brand-PricingOptions-item-bgColor-gradient-start) 0%,\n    var(--brand-PricingOptions-item-bgColor-gradient-end) 100%\n  );\n}\n\n.PricingOptions--layout-default.PricingOptions--appearance-gradient::before,\n.PricingOptions--layout-cards.PricingOptions--appearance-gradient .PricingOptions__item::before {\n  position: absolute;\n  content: '';\n  inset: 0;\n  pointer-events: none;\n  border-radius: inherit;\n  mask-image: var(--brand-PricingOptions-borderMask);\n  border: var(--brand-borderWidth-thin) solid var(--brand-color-border-subtle);\n}\n\n@media (min-width: 63.25rem) {\n  .PricingOptions--layout-default {\n    padding-inline: var(--brand-pricing-options-container-padding-inline);\n  }\n}\n\n.PricingOptions--layout-default .PricingOptions__item {\n  --brand-pricing-options-item-padding-inline: var(--base-size-24);\n\n  position: relative; /* Used for positioning the divider between items */\n  padding-inline: var(--base-size-24);\n  padding-block: var(--base-size-20);\n}\n\n@media (min-width: 63.25rem) {\n  .PricingOptions--layout-default .PricingOptions__item {\n    --brand-pricing-options-item-padding-inline: 0;\n\n    padding-inline: 0;\n    padding-block: var(--base-size-40);\n  }\n}\n\n/* Horizontal divider between items on small viewports */\n.PricingOptions--layout-default .PricingOptions__item + .PricingOptions__item::before {\n  content: '';\n  position: absolute;\n  inset-inline: 0;\n  height: 1px;\n  background-color: var(--brand-color-border-subtle);\n}\n\n/* Vertical divider between items on larger viewports */\n@media (min-width: 63.25rem) {\n  .PricingOptions--layout-default .PricingOptions__item + .PricingOptions__item::before {\n    inset-inline: 0;\n    inset-block: 0;\n    width: 1px;\n    height: auto;\n    margin-block-start: 0;\n    margin-inline-start: calc(var(--brand-pricing-options-item-gap) / 2 * -1);\n  }\n\n  .PricingOptions--layout-default.PricingOptions--appearance-gradient\n    .PricingOptions__item\n    + .PricingOptions__item::before {\n    mask-image: var(--brand-PricingOptions-borderMask);\n  }\n}\n\n/* ---------------------------------------------------------- */\n/* Layout: cards                                           */\n/* ---------------------------------------------------------- */\n\n.PricingOptions--layout-cards .PricingOptions__item {\n  --brand-pricing-options-item-padding-inline: var(--base-size-32);\n\n  position: relative;\n  padding-inline: var(--base-size-32);\n  padding-block: var(--base-size-32);\n}\n\n.PricingOptions--layout-cards.PricingOptions--appearance-solid .PricingOptions__item {\n  background-color: var(--brand-PricingOptions-item-bgColor-solid);\n  border: solid var(--brand-borderWidth-thin) var(--brand-color-border-subtle);\n}\n\n/* ---------------------------------------------------------- */\n/* Items                                                      */\n/* ---------------------------------------------------------- */\n\n@media (min-width: 48rem) {\n  :where(.PricingOptions--layout-cards.PricingOptions--items4) {\n    row-gap: var(--brand-pricing-options-item-gap);\n  }\n}\n\n@media (min-width: 63.25rem) {\n  .PricingOptions--items1 {\n    width: 50%;\n    margin-inline: auto;\n  }\n\n  .PricingOptions--layout-default.PricingOptions--items1 {\n    --brand-pricing-options-container-padding-inline: var(--brand-PricingOptions-items1-container-paddingInline);\n  }\n\n  .PricingOptions--layout-default.PricingOptions--items2 {\n    --brand-pricing-options-item-gap: var(--brand-PricingOptions-items2-gap);\n    --brand-pricing-options-container-padding-inline: var(--brand-PricingOptions-items2-container-padding-inline);\n  }\n\n  .PricingOptions--layout-default.PricingOptions--items3 {\n    --brand-pricing-options-item-gap: var(--brand-PricingOptions-items3-gap);\n    --brand-pricing-options-container-padding-inline: var(--brand-PricingOptions-items3-container-padding-inline);\n  }\n  .PricingOptions--layout-default.PricingOptions--items4 {\n    --brand-pricing-options-item-gap: var(--brand-PricingOptions-items4-gap);\n    --brand-pricing-options-container-padding-inline: var(--brand-PricingOptions-items4-container-padding-inline);\n  }\n}\n\n/* ---------------------------------------------------------- */\n/* Item inner layout                                       */\n/* ---------------------------------------------------------- */\n\n.PricingOptions__item {\n  display: grid;\n  grid-template-areas: var(--brand-pricing-options-template-areas);\n}\n\n@media (min-width: 63.25rem) {\n  .PricingOptions__item {\n    grid-row: header / footnote;\n    grid-template-rows: subgrid;\n  }\n\n  .PricingOptions__item--has-leading-component {\n    grid-row: leadingComponent / footnote;\n  }\n}\n\n.PricingOptions__item--align-center {\n  justify-items: center;\n}\n\n.PricingOptions__item--align-center .PricingOptions__price,\n.PricingOptions__item--align-center .PricingOptions__description {\n  text-align: center;\n  justify-content: center;\n}\n\n/*\n * Backwards compatibility for browsers that don't support subgrid.\n * Once subgrid is supported in the last 3 major versions of Safari (i.e., when Safari 18 is released), it can be fully removed.\n * https://caniuse.com/css-subgrid\n */\n@supports not (grid-template-rows: subgrid) {\n  @media (min-width: 63.28rem) {\n    .PricingOptions__item {\n      grid-template-areas: var(--brand-pricing-options-template-areas);\n      grid-template-columns: 1fr;\n      grid-template-rows: auto;\n    }\n  }\n}\n\n/* ---------------------------------------------------------- */\n/* Content                                                 */\n/* ---------------------------------------------------------- */\n\n.PricingOptions__header {\n  display: flex;\n  grid-area: header;\n  row-gap: var(--base-size-16);\n}\n\n/* When item is left-aligned, keep the heading at the start of the card */\n.PricingOptions__item:not(.PricingOptions__item--align-center) .PricingOptions__header {\n  align-items: center;\n  margin-block-end: var(--base-size-16);\n}\n\n.PricingOptions__item:not(.PricingOptions__item--align-center) .PricingOptions__heading {\n  margin-block: var(--base-size-16);\n  flex: 0 1 auto;\n  order: 1;\n  align-self: flex-start;\n}\n\n@media (min-width: 63.24rem) {\n  .PricingOptions__item:not(.PricingOptions__item--align-center) .PricingOptions__heading {\n    margin-block: 0;\n  }\n}\n\n/* When item is centered, center the heading */\n.PricingOptions__item--align-center .PricingOptions__header {\n  justify-content: center;\n}\n\n.PricingOptions__item--align-center .PricingOptions__heading {\n  margin-block-start: 0;\n  margin-block-end: var(--base-size-16);\n  text-align: center;\n}\n\n.PricingOptions__leading-component {\n  grid-row: leadingComponent;\n}\n\n.PricingOptions__leading-component :is(img, picture) {\n  display: block;\n}\n\n.PricingOptions__label {\n  color: var(--brand-color-text-default);\n  font-family: var(--brand-fontStack-monospace);\n  font-size: var(--brand-text-size-100);\n  font-weight: var(--brand-text-weight-500);\n  letter-spacing: var(--brand-text-letterSpacing-100);\n  line-height: var(--brand-text-lineHeight-200);\n  text-transform: uppercase;\n}\n\n.PricingOptions__heading {\n  margin-block: var(--base-size-16);\n  flex: 0 1 auto; /* Minimum width before wrapping */\n  order: 1;\n  align-self: flex-start;\n}\n\n.PricingOptions__description {\n  grid-row: description;\n}\n\n.PricingOptions__price {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: flex-start;\n  grid-row: price;\n  padding-block-start: var(--base-size-20);\n  padding-block-end: var(--base-size-8);\n}\n\n@media (max-width: 63.25rem) {\n  .PricingOptions__price-value,\n  .PricingOptions__price-currency-symbol {\n    font-size: var(--brand-text-size-900);\n  }\n}\n\n.PricingOptions__price-amount {\n  display: flex;\n  align-items: flex-end;\n}\n\n.PricingOptions__price-currency-code {\n  margin-inline-start: var(--base-size-4);\n  margin-block-end: var(--base-size-4);\n  color: var(--brand-color-text-muted);\n}\n\n.PricingOptions__price-original-price {\n  display: inline-flex;\n  align-self: center;\n  text-decoration: none;\n  margin-inline-start: var(--base-size-8);\n}\n\n.PricingOptions__price-original-price-value {\n  text-decoration: line-through;\n}\n\n.PricingOptions__price-trailing-text {\n  flex: 1 0 100%;\n  display: block;\n}\n\n.PricingOptions__actions {\n  grid-row: actions;\n  display: flex;\n  flex-direction: column;\n  gap: var(--base-size-8);\n  align-items: flex-end;\n  padding-block-start: var(--base-size-20);\n}\n\n.PricingOptions__actions-message {\n  display: flex;\n  gap: var(--base-size-12);\n  align-items: flex-start;\n  inline-size: 100%;\n  max-inline-size: 100%;\n  padding: var(--base-size-12);\n  border-block: var(--brand-borderWidth-thin) solid var(--brand-PricingOptions-actionsMessage-borderColor);\n  border-inline: 0;\n  border-radius: 0;\n  background-color: var(--brand-PricingOptions-actionsMessage-bgColor);\n}\n\n.PricingOptions__actions-message-leading-component {\n  flex: 0 0 auto;\n  display: flex;\n  margin-block-start: var(--base-size-4);\n  color: var(--brand-PricingOptions-actionsMessage-accentColor);\n}\n\n.PricingOptions__actions-message-leading-component :where(svg) {\n  display: block;\n  inline-size: var(--base-size-16);\n  block-size: var(--base-size-16);\n}\n\n.PricingOptions__actions-message-content {\n  flex: 1 1 auto;\n  min-inline-size: 0;\n}\n\n.PricingOptions__actions-message-content :where(p) {\n  margin: 0;\n}\n\n/* MenuAction: full-width ActionMenu wrapper */\n.PricingOptions__menu-action {\n  width: 100%;\n}\n\n.PricingOptions__menu-action > * {\n  width: 100%;\n}\n\n/* Force ActionMenu button container to stretch full width */\n.PricingOptions__menu-action > * > * {\n  display: flex;\n  width: 100%;\n}\n\n/* Make the primary button fill remaining space next to the chevron */\n.PricingOptions__menu-action > * > * > :first-child {\n  flex: 1;\n}\n\n.PricingOptions__footnote {\n  grid-row: footnote;\n  display: block;\n  margin-block-start: var(--base-size-8);\n}\n\n/* ---------------------------------------------------------- */\n/* Feature list                                            */\n/* ---------------------------------------------------------- */\n\n.PricingOptions__feature-list {\n  --feature-list-font-size: var(--brand-text-size-200);\n  --feature-list-line-height: var(--brand-text-lineHeight-200);\n\n  display: flex;\n  flex-direction: column;\n  gap: var(--base-size-8);\n  grid-row: feature-list;\n  margin-block-start: var(--base-size-20);\n  padding-block-start: var(--base-size-20);\n  width: 100%;\n}\n\n.PricingOptions__feature-list--has-divider {\n  position: relative;\n  margin: 0;\n  margin-block-start: var(--base-size-20);\n  padding-block-start: var(--base-size-40);\n  padding-inline: 0;\n}\n\n/* Edge-to-edge divider above feature list */\n.PricingOptions__feature-list--has-divider::before {\n  content: '';\n  position: absolute;\n  inset-block-start: 0;\n  inset-inline-start: calc(var(--brand-pricing-options-item-padding-inline, 0px) * -1);\n  inset-inline-end: calc(var(--brand-pricing-options-item-padding-inline, 0px) * -1);\n  height: var(--brand-borderWidth-thin);\n  background-color: var(--brand-color-border-subtle);\n}\n\n/* Default layout: extend feature list divider into column gap */\n@media (min-width: 63.25rem) {\n  .PricingOptions--layout-default .PricingOptions__feature-list--has-divider::before {\n    inset-inline-start: calc(var(--brand-pricing-options-item-gap, 0px) / 2 * -1);\n    inset-inline-end: calc(var(--brand-pricing-options-item-gap, 0px) / 2 * -1);\n  }\n\n  /* First item: don't overflow past container start */\n  .PricingOptions--layout-default .PricingOptions__item:first-child .PricingOptions__feature-list--has-divider::before,\n  .PricingOptions--layout-default\n    .PricingOptions__labels\n    + .PricingOptions__item\n    .PricingOptions__feature-list--has-divider::before {\n    inset-inline-start: calc(var(--brand-pricing-options-container-padding-inline, 0px) * -1);\n  }\n\n  /* Last item: don't overflow past container end */\n  .PricingOptions--layout-default\n    .PricingOptions__item:not(:has(~ .PricingOptions__item))\n    .PricingOptions__feature-list--has-divider::before {\n    inset-inline-end: calc(var(--brand-pricing-options-container-padding-inline, 0px) * -1);\n  }\n\n  .PricingOptions--layout-default.PricingOptions--appearance-gradient\n    .PricingOptions__feature-list--has-divider::before {\n    mask-image: var(--brand-PricingOptions-borderMask);\n  }\n}\n\n.PricingOptions__feature-list-set:nth-child(n + 2) {\n  margin-block-start: var(--base-size-20);\n}\n\n.PricingOptions__feature-list-group-heading {\n  color: var(--brand-PricingOptions-featureList-group-heading-color);\n  margin-block-start: var(--base-size-12);\n  margin-block-end: var(--base-size-8);\n}\n\n.PricingOptions__feature-list-item--excluded span {\n  color: var(--brand-color-text-muted);\n}\n\n/* Info tooltip button */\n.PricingOptions__feature-list-item--has-info {\n  flex-wrap: nowrap;\n}\n\n.PricingOptions__feature-list-item--has-info > span {\n  flex: 1;\n  display: inline-flex;\n  align-items: baseline;\n  justify-content: space-between;\n}\n\n.PricingOptions__feature-list-item-info {\n  all: unset;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  cursor: pointer;\n  color: var(--brand-color-text-muted);\n  background-color: color-mix(in srgb, var(--brand-color-canvas-invert) 12%, transparent);\n  border: var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);\n  border-radius: 50%;\n  margin-inline-start: var(--base-size-8);\n  vertical-align: middle;\n  padding: var(--base-size-4);\n}\n\n.PricingOptions__feature-list-item-info svg {\n  width: var(--base-size-12);\n  height: var(--base-size-12);\n}\n\n.PricingOptions__feature-list-item-info:focus-visible {\n  outline: var(--brand-borderWidth-thick) solid var(--brand-color-focus);\n  outline-offset: 2px;\n}\n\n.PricingOptions__feature-list + .PricingOptions__feature-list-group-heading {\n  margin-block-start: var(--base-size-20);\n}\n\n.PricingOptions__feature-list-item,\n.PricingOptions__feature-list-item span {\n  font-size: var(--feature-list-font-size) !important;\n  line-height: var(--feature-list-line-height) !important;\n}\n\n.PricingOptions__feature-list-group-heading {\n  font-size: var(--feature-list-font-size) !important;\n}\n\n.PricingOptions--items4 .PricingOptions__feature-list {\n  --feature-list-font-size: var(--brand-text-size-100);\n  --feature-list-line-height: var(--brand-text-lineHeight-100);\n}\n\n/*\n * Accordion component overrides\n */\n\n/*  paddings and borders */\n.PricingOptions__feature-list-accordion {\n  border: 0;\n  padding: 0;\n}\n\n/* Remove hover effect */\n.PricingOptions__feature-list-accordion::after {\n  content: none !important;\n}\n\n/* Adjust heading spacing */\n.PricingOptions__feature-list-accordion-heading {\n  padding: var(--base-size-8) 0;\n  padding-inline-start: 0 !important; /* Fixes dotcom specificity issue */\n  padding-inline-end: 0 !important;\n  margin-block-start: calc(var(--base-size-16) * -1);\n  margin-block-end: var(--base-size-8);\n}\n\n/* Accordion heading styling */\n.PricingOptions__feature-list-accordion .PricingOptions__feature-list-accordion-heading :is(h1, h2, h3, h4, h5, h6) {\n  font-size: var(--feature-list-font-size);\n  line-height: var(--feature-list-line-height);\n  font-weight: var(--brand-text-subhead-weight-large);\n  gap: var(--base-size-8);\n  align-items: center;\n  justify-content: space-between;\n  display: flex;\n  width: 100%;\n}\n\n/* Hide default icon */\n.PricingOptions__feature-list-accordion .PricingOptions__feature-list-accordion-heading span {\n  display: none;\n}\n\n/* Adjust content paddings */\n.PricingOptions__feature-list-accordion .PricingOptions__feature-list-accordion-content {\n  padding-block-start: var(--base-size-8);\n  padding-inline: 0;\n  padding-inline-start: 0 !important;\n}\n\n.PricingOptions__feature-list-accordion-chevron {\n  margin-inline-end: var(--base-size-4);\n}\n\n/* Chevron up icon */\n.PricingOptions__feature-list-accordion[open] .PricingOptions__feature-list-accordion-chevron {\n  transform: rotate(180deg);\n}\n\n.PricingOptions__feature-list-accordion-content {\n  animation: none !important;\n}\n"],"mappings":""}

package/esm/TestimonialGroup/TestimonialGroup.module-BDQZa1f9.css

@@ -0,0 +1 @@
+.Primer_Brand__TestimonialGroup-module__TestimonialGroup___WSHAX{width:100%;min-width:0}.Primer_Brand__TestimonialGroup-module__TestimonialGroup__content____OwRq{flex-direction:column;width:100%;display:flex}.Primer_Brand__TestimonialGroup-module__TestimonialGroup__slides___bujxD{flex-direction:column;justify-content:center;width:100%;display:flex;position:relative}.Primer_Brand__TestimonialGroup-module__TestimonialGroup__slide___BQN5P{visibility:hidden;pointer-events:none;width:100%;position:absolute}.Primer_Brand__TestimonialGroup-module__TestimonialGroup__slide--active___Po_Ui{visibility:visible;pointer-events:auto;position:relative}.Primer_Brand__TestimonialGroup-module__TestimonialGroup__avatar___g6C4c{border:var(--base-size-2) solid var(--brand-Testimonial-quoteMarkColor-green);border-radius:50%;flex:none}.Primer_Brand__TestimonialGroup-module__TestimonialGroup__avatar___g6C4c.Primer_Brand__TestimonialGroup-module__TestimonialGroup__avatar--size-large___RDqmT{width:var(--base-size-48);height:var(--base-size-48)}.Primer_Brand__TestimonialGroup-module__TestimonialGroup__quoteMark___kFAR6,.Primer_Brand__TestimonialGroup-module__TestimonialGroup__quote___EojHF,.Primer_Brand__TestimonialGroup-module__TestimonialGroup__media____4w1m{transition:opacity var(--brand-TestimonialGroup-fadeInDuration) ease-in-out}.Primer_Brand__TestimonialGroup-module__TestimonialGroup__testimonial--out___3J8b7 .Primer_Brand__TestimonialGroup-module__TestimonialGroup__quoteMark___kFAR6{opacity:0;transition:opacity var(--brand-TestimonialGroup-fadeOutDuration) ease-in-out .12s}.Primer_Brand__TestimonialGroup-module__TestimonialGroup__testimonial--out___3J8b7 .Primer_Brand__TestimonialGroup-module__TestimonialGroup__quote___EojHF{opacity:0;transition:opacity var(--brand-TestimonialGroup-fadeOutDuration) ease-in-out 80ms}.Primer_Brand__TestimonialGroup-module__TestimonialGroup__testimonial--out___3J8b7 .Primer_Brand__TestimonialGroup-module__TestimonialGroup__media____4w1m{opacity:0;transition:opacity var(--brand-TestimonialGroup-fadeOutDuration) ease-in-out 40ms}.Primer_Brand__TestimonialGroup-module__TestimonialGroup__testimonial--in___oPvYa .Primer_Brand__TestimonialGroup-module__TestimonialGroup__quote___EojHF{transition-delay:.1s}.Primer_Brand__TestimonialGroup-module__TestimonialGroup__testimonial--in___oPvYa .Primer_Brand__TestimonialGroup-module__TestimonialGroup__media____4w1m{transition-delay:var(--brand-animation-duration-faster)}.Primer_Brand__TestimonialGroup-module__TestimonialGroup__controls___S4ca5{flex:none;order:1;align-items:center;margin-block-start:var(--base-size-32);padding-block-start:var(--base-size-16);display:flex}.Primer_Brand__TestimonialGroup-module__TestimonialGroup__content--expressive___Ff_H7 .Primer_Brand__TestimonialGroup-module__TestimonialGroup__controls___S4ca5{margin-block-start:0}.Primer_Brand__TestimonialGroup-module__TestimonialGroup__announcement___mOAht{width:var(--brand-borderWidth-thin);height:var(--brand-borderWidth-thin);clip-path:inset(50%);white-space:nowrap;padding:0;position:absolute;overflow:hidden}@media (prefers-reduced-motion:reduce){.Primer_Brand__TestimonialGroup-module__TestimonialGroup__quoteMark___kFAR6,.Primer_Brand__TestimonialGroup-module__TestimonialGroup__quote___EojHF,.Primer_Brand__TestimonialGroup-module__TestimonialGroup__media____4w1m{transition:none}}

package/esm/TestimonialGroup/TestimonialGroup.module.js

@@ -1,4 +1,4 @@
-import './TestimonialGroup.module-kFxPa1k1.css';//#region src/TestimonialGroup/TestimonialGroup.module.css
+import './TestimonialGroup.module-BDQZa1f9.css';//#region src/TestimonialGroup/TestimonialGroup.module.css
 var e = "Primer_Brand__TestimonialGroup-module__TestimonialGroup___WSHAX", t = "Primer_Brand__TestimonialGroup-module__TestimonialGroup__content____OwRq", n = "Primer_Brand__TestimonialGroup-module__TestimonialGroup__slides___bujxD", r = "Primer_Brand__TestimonialGroup-module__TestimonialGroup__slide___BQN5P", i = "Primer_Brand__TestimonialGroup-module__TestimonialGroup__avatar___g6C4c", a = "Primer_Brand__TestimonialGroup-module__TestimonialGroup__quoteMark___kFAR6", o = "Primer_Brand__TestimonialGroup-module__TestimonialGroup__quote___EojHF", s = "Primer_Brand__TestimonialGroup-module__TestimonialGroup__media____4w1m", c = "Primer_Brand__TestimonialGroup-module__TestimonialGroup__controls___S4ca5", l = "Primer_Brand__TestimonialGroup-module__TestimonialGroup__announcement___mOAht", u = {
 	TestimonialGroup: e,
 	TestimonialGroup__content: t,

package/esm/TestimonialGroup/TestimonialGroup.module.js.map

@@ -1 +1 @@
-{"version":3,"file":"TestimonialGroup.module.js","names":[],"sources":["../../src/TestimonialGroup/TestimonialGroup.module.css"],"sourcesContent":[".TestimonialGroup {\n  width: 100%;\n  min-width: 0;\n  padding-block: calc(var(--base-size-48) + var(--base-size-8));\n  padding-inline: var(--base-size-32);\n}\n\n.TestimonialGroup__content {\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n}\n\n.TestimonialGroup__slides {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  width: 100%;\n}\n\n.TestimonialGroup__slide {\n  position: absolute;\n  width: 100%;\n  visibility: hidden;\n  pointer-events: none;\n}\n\n.TestimonialGroup__slide--active {\n  position: relative;\n  visibility: visible;\n  pointer-events: auto;\n}\n\n.TestimonialGroup__avatar {\n  flex: none;\n  border: var(--base-size-2) solid var(--brand-Testimonial-quoteMarkColor-green);\n  border-radius: 50%;\n}\n\n.TestimonialGroup__avatar.TestimonialGroup__avatar--size-large {\n  width: var(--base-size-48);\n  height: var(--base-size-48);\n}\n\n.TestimonialGroup__quoteMark,\n.TestimonialGroup__quote,\n.TestimonialGroup__media {\n  transition: opacity var(--brand-TestimonialGroup-fadeInDuration) ease-in-out;\n}\n\n.TestimonialGroup__testimonial--out .TestimonialGroup__quoteMark {\n  opacity: 0;\n  transition: opacity var(--brand-TestimonialGroup-fadeOutDuration) ease-in-out 120ms;\n}\n\n.TestimonialGroup__testimonial--out .TestimonialGroup__quote {\n  opacity: 0;\n  transition: opacity var(--brand-TestimonialGroup-fadeOutDuration) ease-in-out 80ms;\n}\n\n.TestimonialGroup__testimonial--out .TestimonialGroup__media {\n  opacity: 0;\n  transition: opacity var(--brand-TestimonialGroup-fadeOutDuration) ease-in-out 40ms;\n}\n\n.TestimonialGroup__testimonial--in .TestimonialGroup__quote {\n  transition-delay: 100ms;\n}\n\n.TestimonialGroup__testimonial--in .TestimonialGroup__media {\n  transition-delay: var(--brand-animation-duration-faster);\n}\n\n.TestimonialGroup__controls {\n  display: flex;\n  flex: none;\n  order: 1;\n  align-items: center;\n  margin-block-start: var(--base-size-32);\n  padding-block-start: var(--base-size-16);\n}\n\n.TestimonialGroup__content--expressive .TestimonialGroup__controls {\n  margin-block-start: 0;\n}\n\n.TestimonialGroup__announcement {\n  position: absolute;\n  width: var(--brand-borderWidth-thin);\n  height: var(--brand-borderWidth-thin);\n  padding: 0;\n  overflow: hidden;\n  clip-path: inset(50%);\n  white-space: nowrap;\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .TestimonialGroup__quoteMark,\n  .TestimonialGroup__quote,\n  .TestimonialGroup__media {\n    transition: none;\n  }\n}\n\n@media screen and (min-width: 63.25rem) {\n  .TestimonialGroup {\n    padding-block: var(--base-size-60);\n    padding-inline: var(--base-size-60);\n  }\n}\n"],"mappings":""}
+{"version":3,"file":"TestimonialGroup.module.js","names":[],"sources":["../../src/TestimonialGroup/TestimonialGroup.module.css"],"sourcesContent":[".TestimonialGroup {\n  width: 100%;\n  min-width: 0;\n}\n\n.TestimonialGroup__content {\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n}\n\n.TestimonialGroup__slides {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  width: 100%;\n}\n\n.TestimonialGroup__slide {\n  position: absolute;\n  width: 100%;\n  visibility: hidden;\n  pointer-events: none;\n}\n\n.TestimonialGroup__slide--active {\n  position: relative;\n  visibility: visible;\n  pointer-events: auto;\n}\n\n.TestimonialGroup__avatar {\n  flex: none;\n  border: var(--base-size-2) solid var(--brand-Testimonial-quoteMarkColor-green);\n  border-radius: 50%;\n}\n\n.TestimonialGroup__avatar.TestimonialGroup__avatar--size-large {\n  width: var(--base-size-48);\n  height: var(--base-size-48);\n}\n\n.TestimonialGroup__quoteMark,\n.TestimonialGroup__quote,\n.TestimonialGroup__media {\n  transition: opacity var(--brand-TestimonialGroup-fadeInDuration) ease-in-out;\n}\n\n.TestimonialGroup__testimonial--out .TestimonialGroup__quoteMark {\n  opacity: 0;\n  transition: opacity var(--brand-TestimonialGroup-fadeOutDuration) ease-in-out 120ms;\n}\n\n.TestimonialGroup__testimonial--out .TestimonialGroup__quote {\n  opacity: 0;\n  transition: opacity var(--brand-TestimonialGroup-fadeOutDuration) ease-in-out 80ms;\n}\n\n.TestimonialGroup__testimonial--out .TestimonialGroup__media {\n  opacity: 0;\n  transition: opacity var(--brand-TestimonialGroup-fadeOutDuration) ease-in-out 40ms;\n}\n\n.TestimonialGroup__testimonial--in .TestimonialGroup__quote {\n  transition-delay: 100ms;\n}\n\n.TestimonialGroup__testimonial--in .TestimonialGroup__media {\n  transition-delay: var(--brand-animation-duration-faster);\n}\n\n.TestimonialGroup__controls {\n  display: flex;\n  flex: none;\n  order: 1;\n  align-items: center;\n  margin-block-start: var(--base-size-32);\n  padding-block-start: var(--base-size-16);\n}\n\n.TestimonialGroup__content--expressive .TestimonialGroup__controls {\n  margin-block-start: 0;\n}\n\n.TestimonialGroup__announcement {\n  position: absolute;\n  width: var(--brand-borderWidth-thin);\n  height: var(--brand-borderWidth-thin);\n  padding: 0;\n  overflow: hidden;\n  clip-path: inset(50%);\n  white-space: nowrap;\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .TestimonialGroup__quoteMark,\n  .TestimonialGroup__quote,\n  .TestimonialGroup__media {\n    transition: none;\n  }\n}\n"],"mappings":""}

package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/icon-button/base-C6FA-p8L.css

@@ -0,0 +1 @@
+:root{--brand-IconButton-spinner-animationDuration-reducedMotion:1.6s;--brand-IconButton-spinner-animationDuration-default:.8s;--brand-IconButton-icon-size-large:var(--brand-Button-icon-size-large);--brand-IconButton-icon-size-medium:var(--brand-Button-icon-size-large);--brand-IconButton-icon-size-small:var(--brand-Button-icon-size-small);--brand-IconButton-icon-size:var(--brand-Button-icon-size-large);--brand-IconButton-control-size-large:var(--brand-Button-control-size-large);--brand-IconButton-control-size-medium:var(--brand-Button-control-size-medium);--brand-IconButton-control-size-small:var(--brand-Button-control-size-small);--brand-IconButton-control-size:var(--brand-Button-control-size-medium)}

package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/icon-button/colors-with-modes-krqIK_mv.css

@@ -0,0 +1 @@
+:root,[data-color-mode=light],[data-color-mode=auto],[data-color-mode=dark]{--brand-IconButton-secondary-fgColor:var(--brand-color-text-muted);--brand-IconButton-subtle-fgColor:var(--brand-color-text-muted);--brand-IconButton-danger-fgColor-rest:var(--brand-color-danger-fg);--brand-IconButton-danger-fgColor-hover:var(--base-color-scale-white-0);--brand-IconButton-danger-fgColor-active:var(--base-color-scale-white-0);--brand-IconButton-danger-bgColor-rest:var(--brand-button-secondary-bgColor-rest);--brand-IconButton-danger-bgColor-hover:var(--brand-color-danger-emphasis);--brand-IconButton-danger-bgColor-active:var(--brand-color-danger-emphasis);--brand-IconButton-danger-borderColor-rest:var(--brand-button-secondary-borderColor-rest);--brand-IconButton-danger-borderColor-hover:var(--brand-color-danger-emphasis);--brand-IconButton-danger-borderColor-active:var(--brand-color-danger-emphasis);--brand-IconButton-inactive-fgColor:var(--brand-color-text-muted);--brand-IconButton-inactive-bgColor:var(--brand-color-canvas-subtle);--brand-IconButton-inactive-borderColor:var(--brand-color-canvas-subtle);--brand-IconButton-invisible-fgColor:var(--brand-color-text-muted);--brand-IconButton-invisible-bgColor-rest:transparent;--brand-IconButton-invisible-borderColor-rest:transparent}@media (prefers-color-scheme:dark){[data-color-mode=auto]{--brand-IconButton-secondary-fgColor:var(--brand-color-text-muted);--brand-IconButton-subtle-fgColor:var(--brand-color-text-muted);--brand-IconButton-danger-fgColor-rest:var(--brand-color-danger-fg);--brand-IconButton-danger-fgColor-hover:var(--base-color-scale-white-0);--brand-IconButton-danger-fgColor-active:var(--base-color-scale-white-0);--brand-IconButton-danger-bgColor-rest:var(--brand-button-secondary-bgColor-rest);--brand-IconButton-danger-bgColor-hover:var(--brand-color-danger-emphasis);--brand-IconButton-danger-bgColor-active:var(--brand-color-danger-emphasis);--brand-IconButton-danger-borderColor-rest:var(--brand-button-secondary-borderColor-rest);--brand-IconButton-danger-borderColor-hover:var(--brand-color-danger-emphasis);--brand-IconButton-danger-borderColor-active:var(--brand-color-danger-emphasis);--brand-IconButton-inactive-fgColor:var(--brand-color-text-muted);--brand-IconButton-inactive-bgColor:var(--brand-color-canvas-subtle);--brand-IconButton-inactive-borderColor:var(--brand-color-canvas-subtle);--brand-IconButton-invisible-fgColor:var(--brand-color-text-muted);--brand-IconButton-invisible-bgColor-rest:transparent;--brand-IconButton-invisible-borderColor-rest:transparent}}

package/lib/IconButton/IconButton.d.ts

@@ -9,7 +9,7 @@ export declare const IconButtonSizes: readonly ["small", "medium", "large"];
 export declare const defaultIconButtonVariant: "secondary";
 export declare const defaultIconButtonSize: "medium";
 export type IconButtonVariant = (typeof IconButtonVariants)[number];
-export type IconButtonSize = (typeof IconButtonSizes)[number];
+export type IconButtonSize = (typeof IconButtonSizes)[number] | number;
 type IconButtonBaseProps<C extends React.ElementType> = Omit<BaseProps<C>, 'ref'> & {
     as?: C;
     variant?: IconButtonVariant;