@shopify/polaris/build/esm/styles.css

Shopify’s admin product component library

@charset "UTF-8";
:root { --polaris-version-number: '8.2.1'; --polaris-animation-skeleton-shimmer: polaris-SkeletonShimmerAnimation; }

html, body { font-size: 0.9375rem; font-weight: 400; line-height: 1.25rem; text-transform: initial; letter-spacing: initial; font-weight: 400; color: var(--p-text); }

@media (min-width: 40em) { html, body { font-size: 0.875rem; } }

html, body, button { font-family: -apple-system, BlinkMacSystemFont, San Francisco, Segoe UI, Roboto, Helvetica Neue, sans-serif; }

html { position: relative; font-size: 100%; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -webkit-text-size-adjust: 100%; -moz-text-size-adjust: 100%; text-size-adjust: 100%; text-rendering: optimizeLegibility; }

body { min-height: 100%; margin: 0; padding: 0; background-color: #f6f6f7; }

@media print { body { background-color: transparent !important; } }

*, *::before, *::after { box-sizing: border-box; }

h1, h2, h3, h4, h5, h6, p { margin: 0; font-size: 1em; font-weight: 400; }

button::-moz-focus-inner, [type='button']::-moz-focus-inner, [type='reset']::-moz-focus-inner, [type='submit']::-moz-focus-inner { border-style: none; }

@keyframes polaris-SkeletonShimmerAnimation { 0% { opacity: 0.45; }
  100% { opacity: 0.9; } }


.Polaris-Avatar { position: relative; display: block; overflow: hidden; min-width: 1.5rem; max-width: 100%; background: var(--p-surface-neutral); color: var(--p-icon-subdued); border-radius: 1.875rem; -webkit-user-select: none; user-select: none; }

@media (forced-colors: active) { .Polaris-Avatar { border: 0.0625rem solid transparent; } }

.Polaris-Avatar::after { content: ''; display: block; padding-bottom: 100%; }

.Polaris-Avatar--hidden { visibility: hidden; }

.Polaris-Avatar--sizeExtraSmall { width: 1.5rem; }

.Polaris-Avatar--sizeSmall { width: 2rem; }

.Polaris-Avatar--sizeMedium { width: 2.5rem; }

.Polaris-Avatar--sizeLarge { width: 3.75rem; }

.Polaris-Avatar--styleOne { color: var(--p-decorative-one-text); background: var(--p-decorative-one-surface); }

.Polaris-Avatar--styleTwo { color: var(--p-decorative-two-text); background: var(--p-decorative-two-surface); }

.Polaris-Avatar--styleThree { color: var(--p-decorative-three-text); background: var(--p-decorative-three-surface); }

.Polaris-Avatar--styleFour { color: var(--p-decorative-four-text); background: var(--p-decorative-four-surface); }

.Polaris-Avatar--styleFive { color: var(--p-decorative-five-text); background: var(--p-decorative-five-surface); }

.Polaris-Avatar--hasImage { background: transparent; }

.Polaris-Avatar__Image { position: absolute; top: 50%; left: 50%; width: 100%; height: 100%; background-color: var(--p-background); border-radius: 1.875rem; transform: translate(-50%, -50%); object-fit: cover; }

.Polaris-Avatar__Initials { position: absolute; top: 0; right: 0; display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; }

.Polaris-Avatar__Svg { width: 100%; height: 100%; }


.Polaris-VisuallyHidden { position: absolute !important; width: 0.0625rem !important; height: 0.0625rem !important; margin: 0 !important; padding: 0 !important; overflow: hidden !important; -webkit-clip-path: inset(50%) !important; clip-path: inset(50%) !important; border: 0 !important; white-space: nowrap !important; }


.Polaris-Icon { display: block; height: 1.25rem; width: 1.25rem; max-height: 100%; max-width: 100%; margin: auto; }

.Polaris-Icon--applyColor { color: var(--p-surface); }

.Polaris-Icon--hasBackdrop { position: relative; display: flex; align-items: center; margin: 0.25rem; }

.Polaris-Icon--hasBackdrop::before { content: ''; position: absolute; top: -0.25rem; bottom: -0.25rem; left: -0.25rem; right: -0.25rem; border-radius: 50%; }

.Polaris-Icon--colorBase svg { fill: var(--p-icon); }

.Polaris-Icon--colorBase::before { background-color: var(--p-surface-neutral); }

.Polaris-Icon--colorSubdued svg { fill: var(--p-icon-subdued); }

.Polaris-Icon--colorCritical svg { fill: var(--p-icon-critical); }

.Polaris-Icon--colorCritical::before { background-color: var(--p-surface-critical); }

.Polaris-Icon--colorInteractive svg { fill: var(--p-interactive); }

.Polaris-Icon--colorWarning svg { fill: var(--p-icon-warning); }

.Polaris-Icon--colorWarning::before { background-color: var(--p-surface-warning); }

.Polaris-Icon--colorHighlight svg { fill: var(--p-icon-highlight); }

.Polaris-Icon--colorHighlight::before { background-color: var(--p-surface-highlight); }

.Polaris-Icon--colorSuccess svg { fill: var(--p-icon-success); }

.Polaris-Icon--colorSuccess::before { background-color: var(--p-surface-success); }

.Polaris-Icon--colorPrimary svg { fill: var(--p-action-primary); }

.Polaris-Icon__Svg, .Polaris-Icon__Img { position: relative; display: block; width: 100%; max-width: 100%; max-height: 100%; }

.Polaris-Icon__Placeholder { padding-bottom: 100%; background: currentColor; }


@keyframes Polaris-Spinner--loading { to { transform: rotate(360deg); } }

.Polaris-Spinner svg { animation: Polaris-Spinner--loading 500ms linear infinite; fill: var(--p-border-highlight); }

.Polaris-Spinner--sizeSmall svg { height: 1.25rem; width: 1.25rem; }

.Polaris-Spinner--sizeLarge svg { height: 2.75rem; width: 2.75rem; }


.Polaris-Scrollable { -webkit-overflow-scrolling: touch; position: relative; }

.Polaris-Scrollable:focus { outline: 0.125rem solid var(--p-focused); outline-offset: 0.125rem; }

.Polaris-Scrollable--horizontal { overflow-x: auto; }

.Polaris-Scrollable--vertical { overflow-y: auto; }

.Polaris-Scrollable--verticalHasScrolling { overflow-y: scroll; }

.Polaris-Scrollable--hasTopShadow { box-shadow: inset 0 1.25rem 1.25rem -1.25rem var(--p-hint-from-direct-light); }

.Polaris-Scrollable--hasBottomShadow { box-shadow: inset 0 -1.25rem 1.25rem -1.25rem var(--p-hint-from-direct-light); }

.Polaris-Scrollable--hasTopShadow.Polaris-Scrollable--hasBottomShadow { box-shadow: inset 0 1.25rem 1.25rem -1.25rem var(--p-hint-from-direct-light), inset 0 -1.25rem 1.25rem -1.25rem var(--p-hint-from-direct-light); }


.Polaris-Popover { max-width: calc(100vw - 2rem); margin: 0.3125rem 0.5rem 1rem; box-shadow: var(--p-popover-shadow); border-radius: var(--p-border-radius-wide); -webkit-backface-visibility: hidden; backface-visibility: hidden; will-change: left, top; }

.Polaris-Popover__PopoverOverlay { opacity: 0; transition: opacity 100ms cubic-bezier(0.25, 0.1, 0.25, 1), transform 100ms cubic-bezier(0.25, 0.1, 0.25, 1); transform: translateY(-0.3125rem); }

.Polaris-Popover__PopoverOverlay--entering { opacity: 1; transform: translateY(0); }

.Polaris-Popover__PopoverOverlay--open { opacity: 1; transform: none; }

.Polaris-Popover__PopoverOverlay--exiting { opacity: 1; transform: translateY(0); transition-duration: 0ms; }

.Polaris-Popover--measuring:not(.Polaris-Popover__PopoverOverlay--exiting) { opacity: 0; transform: translateY(-0.3125rem); }

.Polaris-Popover--fullWidth { margin: 0.3125rem auto 0 auto; }

.Polaris-Popover--fullWidth .Polaris-Popover__Content { max-width: none; }

.Polaris-Popover--positionedAbove { margin: 1rem 0.5rem 0.3125rem; }

.Polaris-Popover--positionedAbove.Polaris-Popover--fullWidth { margin: 0 auto 0.3125rem auto; }

.Polaris-Popover__Wrapper { position: relative; overflow: hidden; background-color: var(--p-surface); border-radius: var(--p-border-radius-wide); outline: 0.0625rem solid transparent; }

.Polaris-Popover__Content { position: relative; display: flex; flex-direction: column; border-radius: var(--p-border-radius-base); max-width: 25rem; max-height: 31.25rem; }

.Polaris-Popover__Content:focus { outline: none; }

.Polaris-Popover__Content--fullHeight { max-height: none; }

.Polaris-Popover__Content--fluidContent { max-height: none; max-width: none; }

.Polaris-Popover__Pane { flex: 1 1; max-width: 100%; }

.Polaris-Popover__Pane + .Polaris-Popover__Pane { border-top: 0.0625rem solid var(--p-divider); }

.Polaris-Popover__Pane:focus { outline: none; }

.Polaris-Popover__Pane--fixed { overflow: visible; flex: 0 0 auto; }

.Polaris-Popover__Section { padding: 1rem; }

.Polaris-Popover__Section + .Polaris-Popover__Section { border-top: 0.0625rem solid var(--p-divider); }

.Polaris-Popover__FocusTracker { position: absolute !important; width: 0.0625rem !important; height: 0.0625rem !important; margin: 0 !important; padding: 0 !important; overflow: hidden !important; -webkit-clip-path: inset(50%) !important; clip-path: inset(50%) !important; border: 0 !important; white-space: nowrap !important; }

@media print { .Polaris-Popover__PopoverOverlay--hideOnPrint { display: none !important; } }


.Polaris-PositionedOverlay { position: absolute; z-index: 400; }

.Polaris-PositionedOverlay--fixed { position: fixed; }

.Polaris-PositionedOverlay--calculating { visibility: hidden; }

.Polaris-PositionedOverlay--preventInteraction { pointer-events: none; }


.Polaris-Badge { --p-component-badge-pip-color: var(--p-icon); display: inline-flex; align-items: center; padding: 0.125rem 0.5rem; background-color: var(--p-surface-neutral); border-radius: 1.25rem; font-size: 0.8125rem; line-height: 1rem; color: var(--p-text); font-weight: var(--p-badge-font-weight); }

@media print { .Polaris-Badge { border: solid 0.00625rem var(--p-border); } }

.Polaris-Badge--sizeSmall { font-size: 0.75rem; }

.Polaris-Badge--statusSuccess { --p-component-badge-pip-color: var(--p-icon-success); background-color: var(--p-surface-success); color: var(--p-text); }

.Polaris-Badge--statusInfo { --p-component-badge-pip-color: var(--p-icon-highlight); background-color: var(--p-surface-highlight); color: var(--p-text); }

.Polaris-Badge--statusAttention { --p-component-badge-pip-color: rgb(138, 97, 22); background-color: #ffea8a; color: var(--p-text); }

.Polaris-Badge--statusWarning { --p-component-badge-pip-color: var(--p-icon-warning); background-color: var(--p-surface-warning); color: var(--p-text); }

.Polaris-Badge--statusCritical { --p-component-badge-pip-color: var(--p-icon-critical); background-color: var(--p-surface-critical); color: var(--p-text); }

.Polaris-Badge--statusNew { background-color: var(--p-surface-neutral); color: var(--p-text); font-weight: 500; border: none; }

.Polaris-Badge__Pip { color: var(--p-component-badge-pip-color); height: 0.5rem; width: 0.5rem; margin-right: 0.25rem; margin-left: -0.125rem; border: 0.125rem solid currentColor; border-radius: 50%; flex-shrink: 0; }

.Polaris-Badge--progressIncomplete .Polaris-Badge__Pip { background: transparent; }

.Polaris-Badge--progressPartiallyComplete .Polaris-Badge__Pip { background: linear-gradient(to top, currentColor, currentColor 50%, transparent 50%, transparent); }

@media print { .Polaris-Badge--progressPartiallyComplete .Polaris-Badge__Pip { background: none; box-shadow: 0 -6.375rem 0 -6.25rem currentColor inset; } }

.Polaris-Badge--progressComplete .Polaris-Badge__Pip { background: currentColor; }

@media print { .Polaris-Badge--progressComplete .Polaris-Badge__Pip { background: none; box-shadow: 0 0 0 6.25rem currentColor inset; } }

.Polaris-Badge--withinFilter { border-radius: var(--p-border-radius-base); }


.Polaris-TextStyle--variationPositive { color: var(--p-text-success); }

.Polaris-TextStyle--variationNegative { color: var(--p-text-critical); }

.Polaris-TextStyle--variationWarning { color: var(--p-text-warning); }

.Polaris-TextStyle--variationCode { position: relative; padding: 0 0.25rem; border-radius: 0.1875rem; background-color: var(--p-surface-subdued); display: inline-block; font-size: 1.15em; box-shadow: inset 0 0 0 0.0625rem var(--p-border-subdued); }

.Polaris-TextStyle--variationCode::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0.0625rem solid transparent; pointer-events: none; }

.Polaris-TextStyle--variationStrong { font-weight: 600; }

.Polaris-TextStyle--variationSubdued { color: var(--p-text-subdued); }

@media print { .Polaris-TextStyle--variationSubdued { color: var(--p-text-subdued); } }


.Polaris-ActionList { outline: none; list-style: none; margin: 0; padding: 0; }

.Polaris-ActionList__Section--withoutTitle:not(:first-child) { border-top: 0.0625rem solid var(--p-divider); }

.Polaris-ActionList__Actions { outline: none; list-style: none; margin: 0; border-top: 0.0625rem solid var(--p-divider); padding: 0.5rem; }

.Polaris-ActionList > .Polaris-ActionList__Section--withoutTitle .Polaris-ActionList__Actions, .Polaris-ActionList__Section:first-child > .Polaris-ActionList__Section--withoutTitle .Polaris-ActionList__Actions { border-top: none; }

.Polaris-ActionList__Title { font-size: 0.8125rem; font-weight: 600; line-height: 1rem; text-transform: uppercase; padding: 0.25rem 1rem 0.75rem 1rem; }

@media (min-width: 40em) { .Polaris-ActionList__Title { font-size: 0.75rem; } }

.Polaris-ActionList__Title.Polaris-ActionList--firstSectionWithTitle { padding-top: 0.75rem; }

.Polaris-ActionList__Item { -webkit-appearance: none; appearance: none; margin: 0; padding: 0; background: none; border: none; font-size: inherit; line-height: inherit; color: inherit; cursor: pointer; color: inherit; text-decoration: none; position: relative; display: block; width: 100%; min-height: 2.5rem; text-align: left; cursor: pointer; padding: 0.625rem 0.5rem; border-radius: var(--p-border-radius-base); border-top: 0.0625rem solid transparent; }

.Polaris-ActionList__Item:focus { outline: none; }

.Polaris-ActionList__Item:visited { color: inherit; }

.Polaris-ActionList__Item::after { content: ''; position: absolute; z-index: 1; top: -0.0625rem; right: -0.0625rem; bottom: -0.0625rem; left: -0.0625rem; display: block; pointer-events: none; box-shadow: 0 0 0 -0.0625rem var(--p-focused); transition: box-shadow 100ms var(--p-ease); border-radius: calc(var(--p-border-radius-base) + 0.0625rem); }

@media (forced-colors: active) { .Polaris-ActionList__Item { border: 0.0625rem solid transparent; } }

.Polaris-ActionList__Item:hover { background-color: var(--p-surface-hovered); text-decoration: none; outline: 0.1875rem solid transparent; }

.Polaris-ActionList__Item.Polaris-ActionList--active { background-color: var(--p-surface-selected); }

.Polaris-ActionList__Item.Polaris-ActionList--active svg { fill: var(--p-interactive); }

.Polaris-ActionList__Item.Polaris-ActionList--active::before { content: ''; background-color: var(--p-interactive); position: absolute; top: 0; left: -0.5rem; height: 100%; display: block; width: 0.1875rem; border-top-right-radius: var(--p-border-radius-base); border-bottom-right-radius: var(--p-border-radius-base); }

.Polaris-ActionList__Item:active { background-color: var(--p-surface-pressed); }

.Polaris-ActionList__Item:active svg { fill: var(--p-interactive); }

.Polaris-ActionList__Item:focus:not(:active) { outline: 0.1875rem solid transparent; }

.Polaris-ActionList__Item:focus:not(:active)::after { box-shadow: 0 0 0 0.125rem var(--p-focused); outline: 0.0625rem solid transparent; }

.Polaris-ActionList__Item.Polaris-ActionList--destructive { color: var(--p-interactive-critical); }

.Polaris-ActionList__Item.Polaris-ActionList--destructive svg { fill: var(--p-icon-critical); }

.Polaris-ActionList__Item.Polaris-ActionList--destructive:hover { background-color: var(--p-surface-critical-subdued-hovered); }

.Polaris-ActionList__Item.Polaris-ActionList--destructive:active, .Polaris-ActionList__Item.Polaris-ActionList--destructive.Polaris-ActionList--active { background-color: var(--p-surface-critical-subdued-pressed); }

.Polaris-ActionList__Item.Polaris-ActionList--disabled { background-image: none; color: var(--p-text-disabled); }

.Polaris-ActionList__Item.Polaris-ActionList--disabled .Polaris-ActionList__Prefix svg, .Polaris-ActionList__Item.Polaris-ActionList--disabled .Polaris-ActionList__Suffix svg { fill: var(--p-icon-disabled); }

.Polaris-ActionList__Content { display: flex; align-items: center; }

.Polaris-ActionList__Prefix { display: flex; flex: 0 0 auto; justify-content: center; align-items: center; height: 1.25rem; width: 1.25rem; border-radius: 0.1875rem; margin: -0.625rem 1rem -0.625rem 0; background-size: cover; background-position: center center; }

.Polaris-ActionList__Prefix svg { fill: var(--p-icon); }

.Polaris-ActionList__Suffix { margin-left: 1rem; }

.Polaris-ActionList__Suffix svg { fill: var(--p-icon); }

.Polaris-ActionList__ContentBlock, .Polaris-ActionList__ContentBlockInner { display: block; }

.Polaris-ActionList__Text { min-width: 0; max-width: 100%; flex: 1 1 auto; }


.Polaris-Button { position: relative; position: relative; display: inline-flex; align-items: center; justify-content: center; min-height: 2.25rem; min-width: 2.25rem; margin: 0; padding: 0.4375rem 1rem; background: var(--p-surface); box-shadow: var(--p-button-drop-shadow); border-radius: var(--p-border-radius-base); color: var(--p-text); border: 0.0625rem solid var(--p-border-neutral-subdued); border-top-color: var(--p-border-subdued); border-bottom-color: var(--p-border-shadow-subdued); line-height: 1; text-align: center; cursor: pointer; -webkit-user-select: none; user-select: none; text-decoration: none; -webkit-tap-highlight-color: transparent; }

.Polaris-Button svg { fill: var(--p-icon); }

.Polaris-Button::after { content: ''; position: absolute; z-index: 1; top: -0.125rem; right: -0.125rem; bottom: -0.125rem; left: -0.125rem; display: block; pointer-events: none; box-shadow: 0 0 0 -0.125rem var(--p-focused); transition: box-shadow 100ms var(--p-ease); border-radius: calc(var(--p-border-radius-base) + 0.0625rem); }

.Polaris-Button:hover { background: var(--p-action-secondary-hovered); outline: 0.0625rem solid transparent; }

.Polaris-Button:focus { box-shadow: var(--p-button-drop-shadow); outline: 0; }

.Polaris-Button:focus::after { box-shadow: 0 0 0 0.125rem var(--p-focused); outline: 0.0625rem solid transparent; }

.Polaris-Button:active { background: var(--p-action-secondary-pressed); box-shadow: var(--p-button-drop-shadow); }

.Polaris-Button:active::after { border: none; box-shadow: none; }

.Polaris-Button.Polaris-Button--pressed { background: var(--p-action-secondary-depressed); box-shadow: var(--p-button-pressed-inner-shadow); color: var(--p-text-on-primary); border-color: var(--p-border-depressed); }

.Polaris-Button.Polaris-Button--pressed svg { fill: currentColor; }

@media (-ms-high-contrast: active) { .Polaris-Button { border: 0.0625rem solid windowText; } }

.Polaris-Button.Polaris-Button--disabled { transition: none; box-shadow: none; border-color: var(--p-border-disabled); background: var(--p-surface-disabled); color: var(--p-text-disabled); }

.Polaris-Button.Polaris-Button--disabled svg { fill: var(--p-icon-disabled); }

.Polaris-Button.Polaris-Button--connectedDisclosure { z-index: 10; border-top-right-radius: 0; border-bottom-right-radius: 0; }

.Polaris-Button.Polaris-Button--connectedDisclosure::after { border-top-right-radius: 0; border-bottom-right-radius: 0; }

.Polaris-Button.Polaris-Button--connectedDisclosure:focus { z-index: 20; }

.Polaris-Button__Content { font-size: 0.9375rem; font-weight: var(--p-button-font-weight); line-height: 1rem; text-transform: initial; letter-spacing: initial; position: relative; display: flex; justify-content: center; align-items: center; min-width: 0.0625rem; min-height: 0.0625rem; }

@media (min-width: 40em) { .Polaris-Button__Content { font-size: 0.875rem; } }

.Polaris-Button:not(.Polaris-Button--plain) .Polaris-Button__Content { width: 100%; }

.Polaris-Button--textAlignLeft { justify-content: flex-start; text-align: left; }

.Polaris-Button--textAlignLeft .Polaris-Button__Content { justify-content: flex-start; }

.Polaris-Button--textAlignCenter { justify-content: center; text-align: center; }

.Polaris-Button--textAlignRight { justify-content: flex-end; text-align: right; }

.Polaris-Button--textAlignRight .Polaris-Button__Content { justify-content: flex-end; }

.Polaris-Button__Icon { margin-left: -0.25rem; }

.Polaris-Button__Icon:last-child { margin-right: -0.5rem; margin-left: 0.25rem; }

.Polaris-Button--fullWidth.Polaris-Button--textAlignLeft .Polaris-Button__Icon:last-child:not(:only-child) { margin-left: auto; }

.Polaris-Button__Icon + *:not(.Polaris-Button__Icon) { margin-left: 0.25rem; }

.Polaris-Button--hidden { visibility: hidden; }

.Polaris-Button__Spinner { position: absolute; top: 50%; left: 50%; margin-top: -0.625rem; margin-left: -0.625rem; }

.Polaris-Button--primary, .Polaris-Button--destructive { position: relative; background: var(--p-button-color); border-width: 0; border-color: transparent; box-shadow: var(--p-button-drop-shadow), var(--p-button-inner-shadow); color: var(--p-button-text); }

.Polaris-Button--primary::after, .Polaris-Button--destructive::after { content: ''; position: absolute; z-index: 1; top: -0.0625rem; right: -0.0625rem; bottom: -0.0625rem; left: -0.0625rem; display: block; pointer-events: none; box-shadow: 0 0 0 -0.0625rem var(--p-focused); transition: box-shadow 100ms var(--p-ease); border-radius: calc(var(--p-border-radius-base) + 0.0625rem); }

.Polaris-Button--primary:hover, .Polaris-Button--destructive:hover { background: var(--p-button-color-hover); border-color: transparent; color: var(--p-button-text); }

.Polaris-Button--primary:focus, .Polaris-Button--destructive:focus { border-color: transparent; box-shadow: var(--p-button-drop-shadow), var(--p-button-inner-shadow); }

.Polaris-Button--primary:active, .Polaris-Button--destructive:active { background: var(--p-button-color-active); border-color: transparent; box-shadow: var(--p-button-drop-shadow), var(--p-button-inner-shadow); }

.Polaris-Button--primary.Polaris-Button--pressed, .Polaris-Button--destructive.Polaris-Button--pressed { color: var(--p-button-text); background: var(--p-button-color-depressed); border-color: transparent; box-shadow: var(--p-button-drop-shadow), var(--p-button-inner-shadow); }

.Polaris-Button--primary.Polaris-Button--pressed:hover, .Polaris-Button--primary.Polaris-Button--pressed:focus, .Polaris-Button--destructive.Polaris-Button--pressed:hover, .Polaris-Button--destructive.Polaris-Button--pressed:focus { background: var(--p-button-color-depressed); box-shadow: var(--p-button-drop-shadow), var(--p-button-inner-shadow); }

.Polaris-Button--primary.Polaris-Button--disabled, .Polaris-Button--destructive.Polaris-Button--disabled { color: var(--p-text-disabled); box-shadow: none; border-color: transparent; }

.Polaris-Button--primary.Polaris-Button--disabled svg, .Polaris-Button--destructive.Polaris-Button--disabled svg { fill: var(--p-icon-disabled); }

.Polaris-Button--primary { --p-button-color: var(--p-action-primary); --p-button-text: var(--p-text-on-primary); --p-button-color-hover: var(--p-action-primary-hovered); --p-button-color-active: var(--p-action-primary-pressed); --p-button-color-depressed: var(--p-action-primary-depressed); }

.Polaris-Button--primary svg { fill: var(--p-icon-on-primary); }

.Polaris-Button--primary.Polaris-Button--disabled { background: var(--p-action-primary-disabled); }

.Polaris-Button--destructive { --p-button-color: var(--p-action-critical); --p-button-text: var(--p-text-on-critical); --p-button-color-hover: var(--p-action-critical-hovered); --p-button-color-active: var(--p-action-critical-pressed); --p-button-color-depressed: var(--p-action-critical-depressed); }

.Polaris-Button--destructive svg { fill: var(--p-icon-on-critical); }

.Polaris-Button--destructive.Polaris-Button--disabled { background: var(--p-action-critical-disabled); }

.Polaris-Button--outline { background: transparent; border: 0.0625rem solid var(--p-border); box-shadow: none; color: var(--p-text); position: relative; }

.Polaris-Button--outline::after { content: ''; position: absolute; z-index: 1; top: -0.125rem; right: -0.125rem; bottom: -0.125rem; left: -0.125rem; display: block; pointer-events: none; box-shadow: 0 0 0 -0.125rem var(--p-focused); transition: box-shadow 100ms var(--p-ease); border-radius: calc(var(--p-border-radius-base) + 0.0625rem); }

.Polaris-Button--outline:hover { border: 0.0625rem solid var(--p-border); box-shadow: none; background: var(--p-surface-hovered); }

.Polaris-Button--outline:focus { border: 0.0625rem solid var(--p-border); box-shadow: none; }

.Polaris-Button--outline:focus::after { box-shadow: 0 0 0 0.125rem var(--p-focused); outline: 0.0625rem solid transparent; }

.Polaris-Button--outline:active { border: 0.0625rem solid var(--p-border); box-shadow: none; background: var(--p-surface-pressed); }

.Polaris-Button--outline:active::after { box-shadow: none; }

.Polaris-Button--outline.Polaris-Button--pressed { background: var(--p-action-secondary-pressed); border: 0.0625rem solid var(--p-border); box-shadow: none; color: var(--p-button-text); }

.Polaris-Button--outline.Polaris-Button--disabled { border: 0.0625rem solid var(--p-border-disabled); box-shadow: none; background: transparent; color: var(--p-text-disabled); }

.Polaris-Button--outline.Polaris-Button--destructive { background: transparent; border: 0.0625rem solid var(--p-border-critical); box-shadow: none; color: var(--p-interactive-critical); }

.Polaris-Button--outline.Polaris-Button--destructive svg { fill: var(--p-icon-critical); }

.Polaris-Button--outline.Polaris-Button--destructive:hover { border: 0.0625rem solid var(--p-border-critical); background: var(--p-surface-critical-subdued); }

.Polaris-Button--outline.Polaris-Button--destructive:focus { border: 0.0625rem solid var(--p-border-critical); }

.Polaris-Button--outline.Polaris-Button--destructive:focus::after { box-shadow: 0 0 0 0.125rem var(--p-focused); outline: 0.0625rem solid transparent; }

.Polaris-Button--outline.Polaris-Button--destructive:active { border: 0.0625rem solid var(--p-border-critical); background: var(--p-surface-critical-subdued); }

.Polaris-Button--outline.Polaris-Button--destructive.Polaris-Button--disabled { border: 0.0625rem solid var(--p-border-critical-disabled); background: transparent; color: var(--p-interactive-critical-disabled); }

.Polaris-Button--outline.Polaris-Button--destructive.Polaris-Button--pressed { background: var(--p-surface-critical-subdued); box-shadow: 0.0625rem solid var(--p-border-critical); color: var(--p-interactive-critical); }

.Polaris-Button--outline.Polaris-Button--disabled { background: transparent; box-shadow: none; }

.Polaris-Button--destructive.Polaris-Button--outline { background: transparent; border: 0.0625rem solid var(--p-border); box-shadow: none; color: var(--p-text); position: relative; }

.Polaris-Button--destructive.Polaris-Button--outline::after { content: ''; position: absolute; z-index: 1; top: -0.125rem; right: -0.125rem; bottom: -0.125rem; left: -0.125rem; display: block; pointer-events: none; box-shadow: 0 0 0 -0.125rem var(--p-focused); transition: box-shadow 100ms var(--p-ease); border-radius: calc(var(--p-border-radius-base) + 0.0625rem); }

.Polaris-Button--destructive.Polaris-Button--outline:hover { border: 0.0625rem solid var(--p-border); box-shadow: none; background: var(--p-surface-hovered); }

.Polaris-Button--destructive.Polaris-Button--outline:focus { border: 0.0625rem solid var(--p-border); box-shadow: none; }

.Polaris-Button--destructive.Polaris-Button--outline:focus::after { box-shadow: 0 0 0 0.125rem var(--p-focused); outline: 0.0625rem solid transparent; }

.Polaris-Button--destructive.Polaris-Button--outline:active { border: 0.0625rem solid var(--p-border); box-shadow: none; background: var(--p-surface-pressed); }

.Polaris-Button--destructive.Polaris-Button--outline:active::after { box-shadow: none; }

.Polaris-Button--destructive.Polaris-Button--outline.Polaris-Button--pressed { background: var(--p-action-secondary-pressed); border: 0.0625rem solid var(--p-border); box-shadow: none; color: var(--p-button-text); }

.Polaris-Button--destructive.Polaris-Button--outline.Polaris-Button--disabled { border: 0.0625rem solid var(--p-border-disabled); box-shadow: none; background: transparent; color: var(--p-text-disabled); }

.Polaris-Button--destructive.Polaris-Button--outline.Polaris-Button--destructive { background: transparent; border: 0.0625rem solid var(--p-border-critical); box-shadow: none; color: var(--p-interactive-critical); }

.Polaris-Button--destructive.Polaris-Button--outline.Polaris-Button--destructive svg { fill: var(--p-icon-critical); }

.Polaris-Button--destructive.Polaris-Button--outline.Polaris-Button--destructive:hover { border: 0.0625rem solid var(--p-border-critical); background: var(--p-surface-critical-subdued); }

.Polaris-Button--destructive.Polaris-Button--outline.Polaris-Button--destructive:focus { border: 0.0625rem solid var(--p-border-critical); }

.Polaris-Button--destructive.Polaris-Button--outline.Polaris-Button--destructive:focus::after { box-shadow: 0 0 0 0.125rem var(--p-focused); outline: 0.0625rem solid transparent; }

.Polaris-Button--destructive.Polaris-Button--outline.Polaris-Button--destructive:active { border: 0.0625rem solid var(--p-border-critical); background: var(--p-surface-critical-subdued); }

.Polaris-Button--destructive.Polaris-Button--outline.Polaris-Button--destructive.Polaris-Button--disabled { border: 0.0625rem solid var(--p-border-critical-disabled); background: transparent; color: var(--p-interactive-critical-disabled); }

.Polaris-Button--destructive.Polaris-Button--outline.Polaris-Button--destructive.Polaris-Button--pressed { background: var(--p-surface-critical-subdued); box-shadow: 0.0625rem solid var(--p-border-critical); color: var(--p-interactive-critical); }

.Polaris-Button--disabled { cursor: default; pointer-events: none; }

@keyframes Polaris-Button--loading { to { transform: rotate(360deg); } }

.Polaris-Button--loading { position: relative; }

.Polaris-Button--loading, .Polaris-Button--loading:hover, .Polaris-Button--loading.Polaris-Button--disabled { color: transparent; }

.Polaris-Button--loading.Polaris-Button--disabled svg { fill: var(--p-icon-subdued); }

.Polaris-Button--plain { margin: -0.4375rem -0.5rem; padding-left: 0.5rem; padding-right: 0.5rem; background: transparent; border: 0; box-shadow: none; color: var(--p-interactive); }

.Polaris-Button--plain svg { fill: var(--p-interactive); }

.Polaris-Button--plain > .Polaris-Button__Content { font-weight: 400; position: relative; }

.Polaris-Button--plain > .Polaris-Button__Content::after { content: ''; position: absolute; z-index: 1; top: -0.0625rem; right: -0.0625rem; bottom: -0.0625rem; left: -0.0625rem; display: block; pointer-events: none; box-shadow: 0 0 0 -0.0625rem var(--p-focused); transition: box-shadow 100ms var(--p-ease); border-radius: calc(var(--p-border-radius-base) + 0.0625rem); }

.Polaris-Button--plain:hover, .Polaris-Button--plain:focus { color: var(--p-interactive-hovered); background: transparent; box-shadow: none; }

.Polaris-Button--plain:hover svg, .Polaris-Button--plain:focus svg { fill: var(--p-interactive-hovered); }

.Polaris-Button--plain:hover:not(.Polaris-Button--removeUnderline), .Polaris-Button--plain:focus:not(.Polaris-Button--removeUnderline) { text-decoration: underline; }

.Polaris-Button--plain.Polaris-Button--pressed, .Polaris-Button--plain:active { color: var(--p-interactive-pressed); background: transparent; box-shadow: none; }

.Polaris-Button--plain.Polaris-Button--pressed svg, .Polaris-Button--plain:active svg { fill: var(--p-interactive-pressed); }

@media (-ms-high-contrast: active) { .Polaris-Button--plain.Polaris-Button--pressed, .Polaris-Button--plain:active { outline: none; } }

.Polaris-Button--plain:focus::after { content: none; }

@media (-ms-high-contrast: active) { .Polaris-Button--plain:focus { outline: none; } }

@media (-ms-high-contrast: active) { .Polaris-Button--plain:focus > .Polaris-Button__Content { outline: 0.125rem dotted; } }

.Polaris-Button--plain:focus:not(:active) > .Polaris-Button__Content::after { box-shadow: 0 0 0 0.125rem var(--p-focused); outline: 0.0625rem solid transparent; }

.Polaris-Button--plain:active:not(.Polaris-Button--iconOnly) > .Polaris-Button__Content, .Polaris-Button--plain.Polaris-Button--pressed:not(.Polaris-Button--iconOnly) > .Polaris-Button__Content { padding: 0.125rem 0.3125rem; margin: -0.125rem -0.3125rem; background: var(--p-action-secondary-hovered); border-radius: 0.1875rem; }

.Polaris-Button--plain.Polaris-Button--fullWidth { margin-left: 0; margin-right: 0; }

.Polaris-Button--plain.Polaris-Button--disabled { color: var(--p-text-disabled); background: none; }

.Polaris-Button--plain.Polaris-Button--disabled.Polaris-Button--loading { color: transparent; }

.Polaris-Button--plain.Polaris-Button--destructive { color: var(--p-interactive-critical); }

.Polaris-Button--plain.Polaris-Button--destructive svg { fill: var(--p-interactive-critical); }

.Polaris-Button--plain.Polaris-Button--destructive:hover { color: var(--p-interactive-critical-hovered); }

.Polaris-Button--plain.Polaris-Button--destructive:active, .Polaris-Button--plain.Polaris-Button--destructive.Polaris-Button--pressed { color: var(--p-interactive-critical-pressed); }

.Polaris-Button--plain.Polaris-Button--destructive.Polaris-Button--disabled { color: var(--p-interactive-critical-disabled); }

.Polaris-Button--plain.Polaris-Button--sizeSlim { margin-top: -0.1875rem; margin-bottom: -0.1875rem; }

.Polaris-Button--plain.Polaris-Button--sizeLarge { margin: -0.6875rem -1.25rem; }

.Polaris-Button--plain.Polaris-Button--iconOnly { margin: -0.5rem; }

.Polaris-Button--plain.Polaris-Button--iconOnly svg { fill: var(--p-icon); }

.Polaris-Button--plain.Polaris-Button--iconOnly:hover svg { fill: var(--p-icon-hovered); }

.Polaris-Button--plain.Polaris-Button--iconOnly:active svg, .Polaris-Button--plain.Polaris-Button--iconOnly.Polaris-Button--pressed svg { fill: var(--p-icon-pressed); }

.Polaris-Button--plain.Polaris-Button--iconOnly.Polaris-Button--disabled svg { fill: var(--p-icon-disabled); }

.Polaris-Button--plain.Polaris-Button--destructive.Polaris-Button--iconOnly svg { fill: var(--p-action-critical); }

.Polaris-Button--plain.Polaris-Button--destructive.Polaris-Button--iconOnly:hover svg { fill: var(--p-action-critical-hovered); }

.Polaris-Button--plain.Polaris-Button--destructive.Polaris-Button--iconOnly:active svg, .Polaris-Button--plain.Polaris-Button--destructive.Polaris-Button--iconOnly.Polaris-Button--pressed svg { fill: var(--p-action-critical-pressed); }

.Polaris-Button--plain.Polaris-Button--destructive.Polaris-Button--iconOnly.Polaris-Button--disabled svg { fill: var(--p-action-critical-disabled); }

.Polaris-Button--plain .Polaris-Button__Icon { margin-left: 0; margin-right: 0; }

.Polaris-Button--fullWidth { display: flex; width: 100%; }

.Polaris-Button--iconOnly { padding-left: 0.5rem; padding-right: 0.5rem; }

.Polaris-Button--iconOnly.Polaris-Button--sizeLarge { padding-left: 0.75rem; padding-right: 0.75rem; }

.Polaris-Button--iconOnly .Polaris-Button__Icon:first-child { margin-left: 0; }

.Polaris-Button--iconOnly .Polaris-Button__Icon:last-child { margin-right: -0.25rem; }

.Polaris-Button--iconOnly .Polaris-Button__Icon:only-child { margin-right: 0; }

.Polaris-Button--sizeSlim { min-height: 1.75rem; padding: 0.1875rem 0.75rem; }

.Polaris-Button--sizeLarge { min-height: 2.75rem; min-width: 2.75rem; padding: 0.6875rem 1.5rem; }

.Polaris-Button--sizeLarge .Polaris-Button__Content { font-size: 1.0625rem; font-weight: var(--p-button-font-weight); line-height: 1.25rem; text-transform: initial; letter-spacing: initial; }

@media (min-width: 40em) { .Polaris-Button--sizeLarge .Polaris-Button__Content { font-size: 1rem; } }

.Polaris-Button--monochrome.Polaris-Button--outline, .Polaris-Button--monochrome.Polaris-Button--plain { color: currentColor; }

.Polaris-Button--monochrome.Polaris-Button--outline svg, .Polaris-Button--monochrome.Polaris-Button--plain svg { fill: currentColor; }

.Polaris-Button--monochrome.Polaris-Button--outline:hover, .Polaris-Button--monochrome.Polaris-Button--outline:focus, .Polaris-Button--monochrome.Polaris-Button--outline:active, .Polaris-Button--monochrome.Polaris-Button--plain:hover, .Polaris-Button--monochrome.Polaris-Button--plain:focus, .Polaris-Button--monochrome.Polaris-Button--plain:active { color: currentColor; }

.Polaris-Button--monochrome.Polaris-Button--outline:hover svg, .Polaris-Button--monochrome.Polaris-Button--outline:focus svg, .Polaris-Button--monochrome.Polaris-Button--outline:active svg, .Polaris-Button--monochrome.Polaris-Button--plain:hover svg, .Polaris-Button--monochrome.Polaris-Button--plain:focus svg, .Polaris-Button--monochrome.Polaris-Button--plain:active svg { fill: currentColor; }

.Polaris-Button--monochrome.Polaris-Button--outline.Polaris-Button--disabled, .Polaris-Button--monochrome.Polaris-Button--plain.Polaris-Button--disabled { color: currentColor; opacity: 0.4; }

.Polaris-Button--monochrome.Polaris-Button--outline.Polaris-Button--disabled svg, .Polaris-Button--monochrome.Polaris-Button--plain.Polaris-Button--disabled svg { fill: currentColor; }

.Polaris-Button--monochrome.Polaris-Button--outline.Polaris-Button--iconOnly svg, .Polaris-Button--monochrome.Polaris-Button--plain.Polaris-Button--iconOnly svg { fill: currentColor; }

.Polaris-Button--monochrome.Polaris-Button--outline.Polaris-Button--iconOnly:focus svg, .Polaris-Button--monochrome.Polaris-Button--outline.Polaris-Button--iconOnly:active svg, .Polaris-Button--monochrome.Polaris-Button--plain.Polaris-Button--iconOnly:focus svg, .Polaris-Button--monochrome.Polaris-Button--plain.Polaris-Button--iconOnly:active svg { fill: currentColor; }

.Polaris-Button--monochrome.Polaris-Button--outline.Polaris-Button--iconOnly.Polaris-Button--disabled svg, .Polaris-Button--monochrome.Polaris-Button--plain.Polaris-Button--iconOnly.Polaris-Button--disabled svg { fill: currentColor; }

.Polaris-Button--monochrome.Polaris-Button--plain .Polaris-Button__Text:not(.Polaris-Button--removeUnderline) { text-decoration: underline; }

.Polaris-Button--monochrome.Polaris-Button--outline { position: relative; border-color: currentColor; box-shadow: 0 0 0 0.0625rem currentColor; position: relative; }

.Polaris-Button--monochrome.Polaris-Button--outline::after { content: ''; position: absolute; z-index: 1; top: -0.1875rem; right: -0.1875rem; bottom: -0.1875rem; left: -0.1875rem; display: block; pointer-events: none; box-shadow: 0 0 0 -0.1875rem var(--p-focused); transition: box-shadow 100ms var(--p-ease); border-radius: calc(var(--p-border-radius-base) + 0.0625rem); }

.Polaris-Button--monochrome.Polaris-Button--outline::before { content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-color: currentColor; opacity: 0; z-index: 0; }

.Polaris-Button--monochrome.Polaris-Button--outline.Polaris-Button--pressed { background: transparent; box-shadow: none; color: currentColor; }

.Polaris-Button--monochrome.Polaris-Button--outline.Polaris-Button--pressed::before { opacity: 0.2; }

.Polaris-Button--monochrome.Polaris-Button--outline:hover, .Polaris-Button--monochrome.Polaris-Button--outline:focus, .Polaris-Button--monochrome.Polaris-Button--outline:active { background-color: transparent; border-color: currentColor; }

.Polaris-Button--monochrome.Polaris-Button--outline:hover::before, .Polaris-Button--monochrome.Polaris-Button--outline:focus::before, .Polaris-Button--monochrome.Polaris-Button--outline:active::before { opacity: 0.07; }

.Polaris-Button--monochrome.Polaris-Button--outline:focus { box-shadow: 0 0 0 0.0625rem currentColor; }

.Polaris-Button--monochrome.Polaris-Button--outline:focus::after { box-shadow: 0 0 0 0.125rem var(--p-focused); outline: 0.0625rem solid transparent; }

.Polaris-Button--monochrome.Polaris-Button--outline:active::after { box-shadow: none; }

.Polaris-Button--monochrome.Polaris-Button--outline:hover::before, .Polaris-Button--monochrome.Polaris-Button--outline:active::before { opacity: 0.05; }

.Polaris-Button__ConnectedDisclosureWrapper { display: flex; }

.Polaris-Button__ConnectedDisclosure { z-index: 10; margin-left: -0.0625rem; border-top-left-radius: 0; border-bottom-left-radius: 0; height: 100%; }

.Polaris-Button__ConnectedDisclosure.Polaris-Button--outline:not(:focus) { /* stylelint-disable color-no-hex */ border-left-color: rgba(210, 213, 216, 0); }

.Polaris-Button__ConnectedDisclosure:focus, .Polaris-Button__ConnectedDisclosure:active { z-index: 20; }

.Polaris-Button__ConnectedDisclosure.Polaris-Button--primary, .Polaris-Button__ConnectedDisclosure.Polaris-Button--destructive { margin-left: 0.0625rem; }

.Polaris-Button__ConnectedDisclosure.Polaris-Button--primary.Polaris-Button--outline, .Polaris-Button__ConnectedDisclosure.Polaris-Button--destructive.Polaris-Button--outline { margin-left: 0; border-left: 0; }

.Polaris-Button__ConnectedDisclosure::after { border-top-left-radius: 0; border-bottom-left-radius: 0; }

[data-buttongroup-segmented='true'] .Polaris-Button, [data-buttongroup-segmented='true'] .Polaris-Button::after { border-radius: 0; }

[data-buttongroup-segmented='true'] > :first-child .Polaris-Button, [data-buttongroup-segmented='true'] > :first-child .Polaris-Button::after { border-radius: 0; border-top-left-radius: var(--p-border-radius-base); border-bottom-left-radius: var(--p-border-radius-base); }

[data-buttongroup-segmented='true'] > :last-child .Polaris-Button, [data-buttongroup-segmented='true'] > :last-child .Polaris-Button::after { border-radius: 0; border-top-right-radius: var(--p-border-radius-base); border-bottom-right-radius: var(--p-border-radius-base); }

[data-buttongroup-segmented='true'] > :last-child:first-child .Polaris-Button, [data-buttongroup-segmented='true'] > :last-child:first-child .Polaris-Button::after { border-radius: var(--p-border-radius-base); }

[data-buttongroup-connected-top='true'] > :first-child .Polaris-Button, [data-buttongroup-connected-top='true'] > :first-child .Polaris-Button::after { border-top-left-radius: 0; }

[data-buttongroup-connected-top='true'] > :last-child .Polaris-Button, [data-buttongroup-connected-top='true'] > :last-child .Polaris-Button::after { border-top-right-radius: 0; }

[data-buttongroup-full-width='true'] .Polaris-Button { display: flex; width: 100%; }


.Polaris-ButtonGroup { display: flex; flex-wrap: wrap; align-items: center; margin-top: -0.5rem; margin-left: -0.5rem; }

.Polaris-ButtonGroup__Item { margin-top: 0.5rem; margin-left: 0.5rem; }

.Polaris-ButtonGroup__Item--plain:not(:first-child) { margin-left: 1rem; }

.Polaris-ButtonGroup__Item--plain:not(:last-child) { margin-right: 0.5rem; }

.Polaris-ButtonGroup--segmented { display: flex; flex-wrap: nowrap; margin-top: 0; margin-left: 0; }

.Polaris-ButtonGroup--segmented .Polaris-ButtonGroup__Item { position: relative; z-index: 10; margin-top: 0; margin-left: 0; line-height: normal; }

.Polaris-ButtonGroup--segmented .Polaris-ButtonGroup__Item:not(:first-child) { margin-left: -0.0625rem; }

.Polaris-ButtonGroup--segmented .Polaris-ButtonGroup__Item--focused { z-index: 20; }

.Polaris-ButtonGroup--fullWidth .Polaris-ButtonGroup__Item { flex: 1 1 auto; }

.Polaris-ButtonGroup--extraTight { margin-top: -0.25rem; margin-left: -0.25rem; }

.Polaris-ButtonGroup--extraTight .Polaris-ButtonGroup__Item { margin-top: 0.25rem; margin-left: 0.25rem; }

.Polaris-ButtonGroup--tight { margin-top: -0.5rem; margin-left: -0.5rem; }

.Polaris-ButtonGroup--tight .Polaris-ButtonGroup__Item { margin-top: 0.5rem; margin-left: 0.5rem; }

.Polaris-ButtonGroup--loose { margin-top: -1.25rem; margin-left: -1.25rem; }

.Polaris-ButtonGroup--loose .Polaris-ButtonGroup__Item { margin-top: 1.25rem; margin-left: 1.25rem; }


.Polaris-Stack { margin-top: -1rem; margin-left: -1rem; display: flex; flex-wrap: wrap; align-items: stretch; }

.Polaris-Stack > .Polaris-Stack__Item { margin-top: 1rem; margin-left: 1rem; max-width: 100%; }

.Polaris-Stack--noWrap { flex-wrap: nowrap; }

.Polaris-Stack--spacingNone { margin-top: 0; margin-left: 0; }

.Polaris-Stack--spacingNone > .Polaris-Stack__Item { margin-top: 0; margin-left: 0; max-width: 100%; }

.Polaris-Stack--spacingExtraTight { margin-top: -0.25rem; margin-left: -0.25rem; }

.Polaris-Stack--spacingExtraTight > .Polaris-Stack__Item { margin-top: 0.25rem; margin-left: 0.25rem; max-width: 100%; }

.Polaris-Stack--spacingTight { margin-top: -0.5rem; margin-left: -0.5rem; }

.Polaris-Stack--spacingTight > .Polaris-Stack__Item { margin-top: 0.5rem; margin-left: 0.5rem; max-width: 100%; }

.Polaris-Stack--spacingBaseTight { margin-top: -0.75rem; margin-left: -0.75rem; }

.Polaris-Stack--spacingBaseTight > .Polaris-Stack__Item { margin-top: 0.75rem; margin-left: 0.75rem; max-width: 100%; }

.Polaris-Stack--spacingLoose { margin-top: -1.25rem; margin-left: -1.25rem; }

.Polaris-Stack--spacingLoose > .Polaris-Stack__Item { margin-top: 1.25rem; margin-left: 1.25rem; max-width: 100%; }

.Polaris-Stack--spacingExtraLoose { margin-top: -2rem; margin-left: -2rem; }

.Polaris-Stack--spacingExtraLoose > .Polaris-Stack__Item { margin-top: 2rem; margin-left: 2rem; max-width: 100%; }

.Polaris-Stack--distributionLeading { justify-content: flex-start; }

.Polaris-Stack--distributionTrailing { justify-content: flex-end; }

.Polaris-Stack--distributionCenter { justify-content: center; }

.Polaris-Stack--distributionEqualSpacing { justify-content: space-between; }

.Polaris-Stack--distributionFill > .Polaris-Stack__Item { flex: 1 1 auto; }

.Polaris-Stack--distributionFillEvenly > .Polaris-Stack__Item { flex: 1 1 auto; }

@supports ((min-width: -webkit-fit-content) or (min-width: -moz-fit-content) or (min-width: fit-content)) { .Polaris-Stack--distributionFillEvenly > .Polaris-Stack__Item { flex: 1 0; min-width: -webkit-fit-content; min-width: -moz-fit-content; min-width: fit-content; } }

.Polaris-Stack--alignmentLeading { align-items: flex-start; }

.Polaris-Stack--alignmentTrailing { align-items: flex-end; }

.Polaris-Stack--alignmentCenter { align-items: center; }

.Polaris-Stack--alignmentFill { align-items: stretch; }

.Polaris-Stack--alignmentBaseline { align-items: baseline; }

.Polaris-Stack--vertical { flex-direction: column; margin-left: 0; }

.Polaris-Stack--vertical > .Polaris-Stack__Item { margin-left: 0; }

.Polaris-Stack__Item { flex: 0 0 auto; min-width: 0; }

.Polaris-Stack__Item--fill { flex: 1 1 auto; }


.Polaris-Heading { font-size: 1.0625rem; font-weight: 600; line-height: 1.5rem; margin: 0; }

@media (min-width: 40em) { .Polaris-Heading { font-size: 1rem; } }

@media print { .Polaris-Heading { font-size: 0.875rem; line-height: 1.125rem; } }


.Polaris-Card { background-color: var(--p-surface); box-shadow: var(--p-card-shadow); outline: 0.0625rem solid transparent; }

.Polaris-Card + .Polaris-Card { margin-top: 1rem; }

@media print { .Polaris-Card + .Polaris-Card { margin-top: -0.5rem; } }

@media (max-width: 48.0625em) and (min-width: 30.625em), (min-width: 45.625em) { [data-has-navigation] .Polaris-Card { border-radius: var(--p-border-radius-wide); } }

@media (min-width: 30.625em) { .Polaris-Card { border-radius: var(--p-border-radius-wide); } }

@media print { .Polaris-Card { box-shadow: none; } }

.Polaris-Card--subdued { background-color: var(--p-surface-subdued); }

@media print { .Polaris-Card__Section--hideOnPrint, .Polaris-Card--hideOnPrint { display: none !important; } }

.Polaris-Card__Header { padding: 1rem 1rem 0; }

@media (max-width: 48.0625em) and (min-width: 30.625em), (min-width: 45.625em) { [data-has-navigation] .Polaris-Card__Header { padding: 1.25rem 1.25rem 0; } }

@media (min-width: 30.625em) { .Polaris-Card__Header { padding: 1.25rem 1.25rem 0; } }

@media print and (max-width: 48.0625em) and (min-width: 30.625em), print and (min-width: 45.625em) { [data-has-navigation] .Polaris-Card__Header { padding: 0.5rem 1rem 0; } }

@media print and (min-width: 30.625em) { .Polaris-Card__Header { padding: 0.5rem 1rem 0; } }

.Polaris-Card__Section { padding: 1rem; }

@media (max-width: 48.0625em) and (min-width: 30.625em), (min-width: 45.625em) { [data-has-navigation] .Polaris-Card__Section { padding: 1.25rem; } }

@media (min-width: 30.625em) { .Polaris-Card__Section { padding: 1.25rem; } }

.Polaris-Card__Section + .Polaris-Card__Section { border-top: 0.0625rem solid var(--p-divider); }

@media print { .Polaris-Card__Section + .Polaris-Card__Section { border-top: 0; } }

@media print { .Polaris-Card__Section { padding-top: 0.25rem; padding-bottom: 0.25rem; } }

.Polaris-Card__Section:first-child { border-top-left-radius: var(--p-border-radius-wide); border-top-right-radius: var(--p-border-radius-wide); }

.Polaris-Card__Section:last-child { border-bottom-left-radius: var(--p-border-radius-wide); border-bottom-right-radius: var(--p-border-radius-wide); }

.Polaris-Card__Section--fullWidth { padding: 1rem 0; }

@media (max-width: 48.0625em) and (min-width: 30.625em), (min-width: 45.625em) { [data-has-navigation] .Polaris-Card__Section--fullWidth { padding: 1.25rem 0; } }

@media (min-width: 30.625em) { .Polaris-Card__Section--fullWidth { padding: 1.25rem 0; } }

.Polaris-Card__Section--flush { padding: 0; }

@media (max-width: 48.0625em) and (min-width: 30.625em), (min-width: 45.625em) { [data-has-navigation] .Polaris-Card__Section--flush { padding: 0; } }

@media (min-width: 30.625em) { .Polaris-Card__Section--flush { padding: 0; } }

.Polaris-Card__Section--subdued { background-color: var(--p-surface-subdued); }

@media (-ms-high-contrast: active) { .Polaris-Card__Section--subdued { background-color: transparent; } }

.Polaris-Card__Header + .Polaris-Card__Section--subdued { border-top: 0.0625rem solid var(--p-divider); margin-top: 1.25rem; }

.Polaris-Card__SectionHeader { padding-bottom: 0.5rem; }

.Polaris-Card__Section--fullWidth .Polaris-Card__SectionHeader { padding-left: 1rem; padding-right: 1rem; }

@media (max-width: 48.0625em) and (min-width: 30.625em), (min-width: 45.625em) { [data-has-navigation] .Polaris-Card__Section--fullWidth .Polaris-Card__SectionHeader { padding-left: 1.25rem; padding-right: 1.25rem; } }

@media (min-width: 30.