@skyscanner/backpack-web 42.21.0 → 42.22.0-dev-v26625998804.1

package/bpk-component-layout/src/tokens.d.ts

@@ -39,6 +39,13 @@ export declare const BpkBreakpointToChakraKey: Record<BpkBreakpointToken, Chakra
  * but NOT px/rem values
  */
 export type BpkSpacingValue = BpkSpacingToken | `${number}%`;
+/**
+ * Margin-only superset of BpkSpacingValue. Adds 'auto' so consumers can
+ * push a flex/block-level margin to consume free space (e.g. bottom-aligning
+ * a flex item with marginTop: auto). Padding/gap intentionally exclude 'auto'
+ * because CSS ignores it there.
+ */
+export type BpkMarginValue = BpkSpacingValue | 'auto';
 export type BpkBreakpointValue = BpkBreakpointToken;
 /**
  * Helper type for size props that can use rem, percentages or semantic values.
@@ -94,6 +101,14 @@ export declare function isPercentage(value: string): boolean;
  * @returns {boolean} True if the value is a valid Backpack spacing token or percentage
  */
 export declare function isValidSpacingValue(value: string): boolean;
+/**
+ * Validates if a margin value is valid (spacing value or 'auto').
+ * Margin-specific because CSS ignores 'auto' on padding/gap.
+ *
+ * @param {string} value - The margin value to validate
+ * @returns {boolean} True if the value is a valid spacing value or 'auto'
+ */
+export declare function isValidMarginValue(value: string): boolean;
 /**
  * Validates if a size value is valid
  *

package/bpk-component-layout/src/tokens.js

@@ -64,6 +64,13 @@ export const BpkBreakpointToChakraKey = {
  * but NOT px/rem values
  */
 
+/**
+ * Margin-only superset of BpkSpacingValue. Adds 'auto' so consumers can
+ * push a flex/block-level margin to consume free space (e.g. bottom-aligning
+ * a flex item with marginTop: auto). Padding/gap intentionally exclude 'auto'
+ * because CSS ignores it there.
+ */
+
 /**
  * Helper type for size props that can use rem, percentages or semantic values.
  * This is intentionally separate from BpkSpacingValue to avoid encouraging
@@ -124,6 +131,17 @@ export function isValidSpacingValue(value) {
   return Object.values(BpkSpacing).includes(value) || isPercentage(value);
 }
 
+/**
+ * Validates if a margin value is valid (spacing value or 'auto').
+ * Margin-specific because CSS ignores 'auto' on padding/gap.
+ *
+ * @param {string} value - The margin value to validate
+ * @returns {boolean} True if the value is a valid spacing value or 'auto'
+ */
+export function isValidMarginValue(value) {
+  return value === 'auto' || isValidSpacingValue(value);
+}
+
 /**
  * Validates if a size value is valid
  *

package/bpk-component-layout/src/types.d.ts

@@ -3,19 +3,6 @@ import type StackOptionKeys from './BpkStack.constant';
 import type { BpkCommonLayoutProps } from './commonProps';
 import type { BpkSpacingValue, BpkResponsiveValue, BpkBasisValue } from './tokens';
 import type { BoxProps, FlexProps, GridProps, GridItemProps, StackProps } from '@chakra-ui/react';
-/**
- * Layout-level event props that should not be exposed on layout components.
- * onClick is handled via BpkCommonLayoutProps; onFocus/onBlur are reintroduced
- * on BpkBoxProps only.
- */
-type LayoutEventProps = 'onMouseEnter' | 'onMouseLeave' | 'onMouseOver' | 'onMouseOut' | 'onMouseDown' | 'onMouseUp' | 'onFocus' | 'onBlur' | 'onKeyDown' | 'onKeyUp' | 'onKeyPress';
-/**
- * Shorthand props from the underlying layout system that we do NOT expose on
- * Backpack layout components. These mostly mirror longer-form spacing,
- * sizing and visual props that we already model explicitly via
- * BpkCommonLayoutProps and BpkFlexGridProps.
- */
-type DisallowedShorthandProps = 'p' | 'pt' | 'pr' | 'pb' | 'pl' | 'px' | 'py' | 'm' | 'mt' | 'mr' | 'mb' | 'ml' | 'mx' | 'my' | 'w' | 'h' | 'minW' | 'maxW' | 'minH' | 'maxH' | 'bg' | 'rounded' | 'shadow';
 /**
  * Flexbox & grid layout props that we explicitly support on Backpack layout
  * components. These are a curated subset of the underlying Box flex/grid API
@@ -79,17 +66,10 @@ type BpkBoxResponsiveLayoutProps = {
 };
 type BpkBoxResponsiveLayoutPropKeys = keyof BpkBoxResponsiveLayoutProps;
 /**
- * Base type that removes common layout props, reserved props (className,
- * children) and all layout-level event props from Chakra UI props.
- *
- * These will be replaced with Backpack-specific types.
- */
-export type RemoveCommonProps<T> = Omit<T, keyof BpkCommonLayoutProps | 'className' | 'children' | LayoutEventProps | FlexGridPropKeys | DisallowedShorthandProps>;
-/**
- * Component-specific props for BpkBox
- * Includes all Box props except those in BpkCommonLayoutProps
+ * Component-specific props for BpkBox.
+ * Explicit allowlist — does NOT inherit from Chakra BoxProps.
  */
-export interface BpkBoxSpecificProps extends Omit<RemoveCommonProps<BoxProps>, BpkBoxResponsiveLayoutPropKeys>, BpkBoxResponsiveLayoutProps, Omit<BpkFlexGridProps, BpkBoxResponsiveLayoutPropKeys> {
+export interface BpkBoxSpecificProps extends BpkBoxResponsiveLayoutProps, Omit<BpkFlexGridProps, BpkBoxResponsiveLayoutPropKeys> {
 }
 /**
  * Props for BpkBox component
@@ -147,10 +127,10 @@ export type BpkVesselProps = {
     as?: VesselElement;
 } & HTMLAttributes<HTMLElement>;
 /**
- * Component-specific props for BpkFlex
- * Includes all Flex props except those in BpkCommonLayoutProps
+ * Component-specific props for BpkFlex.
+ * Explicit allowlist — does NOT inherit from Chakra FlexProps.
  */
-export interface BpkFlexSpecificProps extends RemoveCommonProps<FlexProps> {
+export interface BpkFlexSpecificProps {
     direction?: BpkResponsiveValue<FlexProps['flexDirection']>;
     justify?: BpkResponsiveValue<FlexProps['justifyContent']>;
     align?: BpkResponsiveValue<FlexProps['alignItems']>;
@@ -168,10 +148,10 @@ export interface BpkFlexProps extends BpkCommonLayoutProps, BpkFlexSpecificProps
     children?: ReactNode;
 }
 /**
- * Component-specific props for BpkGrid
- * Includes all Grid props except those in BpkCommonLayoutProps
+ * Component-specific props for BpkGrid.
+ * Explicit allowlist — does NOT inherit from Chakra GridProps.
  */
-export interface BpkGridSpecificProps extends RemoveCommonProps<GridProps> {
+export interface BpkGridSpecificProps {
     justify?: BpkResponsiveValue<GridProps['justifyContent']>;
     align?: BpkResponsiveValue<GridProps['alignItems']>;
     templateColumns?: BpkResponsiveValue<GridProps['gridTemplateColumns']>;
@@ -194,10 +174,10 @@ export interface BpkGridProps extends BpkCommonLayoutProps, BpkGridSpecificProps
     children?: ReactNode;
 }
 /**
- * Component-specific props for BpkGridItem
- * Includes all GridItem props except those in BpkCommonLayoutProps
+ * Component-specific props for BpkGridItem.
+ * Explicit allowlist — does NOT inherit from Chakra GridItemProps.
  */
-export interface BpkGridItemSpecificProps extends RemoveCommonProps<GridItemProps> {
+export interface BpkGridItemSpecificProps {
     area?: GridItemProps['area'];
     colEnd?: GridItemProps['colEnd'];
     colStart?: GridItemProps['colStart'];
@@ -221,11 +201,21 @@ type BpkStackOptions = {
     [K in StackOptionKeysType]?: K extends keyof StackProps ? BpkResponsiveValue<StackProps[K]> | StackProps[K] : never;
 };
 /**
- * Component-specific props for BpkStack
- * Includes all Stack props except those in BpkCommonLayoutProps
- * Overrides StackOptions to support BpkResponsiveValue
- */
-export interface BpkStackSpecificProps extends Omit<RemoveCommonProps<StackProps>, StackOptionKeysType>, BpkStackOptions, BpkFlexGridProps {
+ * Component-specific props for BpkStack.
+ * Explicit allowlist — does NOT inherit from Chakra StackProps.
+ * Overrides StackOptions to support BpkResponsiveValue.
+ * `alignItems` and `justifyContent` are accepted as semantic aliases for `align` and `justify`.
+ * If both are provided, `align`/`justify` take precedence.
+ *
+ * `alignItems` and `justifyContent` are explicitly omitted from `BpkFlexGridProps` here so
+ * that the responsive alias declarations below (which match BpkStackOptions) unambiguously
+ * replace the non-responsive `BoxProps` variants from `BpkFlexGridProps`.
+ */
+export interface BpkStackSpecificProps extends BpkStackOptions, Omit<BpkFlexGridProps, 'alignItems' | 'justifyContent'> {
+    /** Alias for `align`. Maps to CSS `align-items`. Responsive — replaces the non-responsive BpkFlexGridProps.alignItems. */
+    alignItems?: BpkStackOptions['align'];
+    /** Alias for `justify`. Maps to CSS `justify-content`. Responsive — replaces the non-responsive BpkFlexGridProps.justifyContent. */
+    justifyContent?: BpkStackOptions['justify'];
 }
 /**
  * Props for BpkStack component

package/bpk-component-link/src/BpkLink.module.css

@@ -15,4 +15,4 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-.bpk-link{position:relative;display:inline;padding:0;border:0;background-color:rgba(0,0,0,0);text-decoration:none;cursor:pointer;appearance:none;color:#161616;color:var(--bpk-link-color, rgb(22, 22, 22))}.bpk-no-touch-support .bpk-link:hover:not(:active):not(:disabled){text-decoration:none;color:#161616;color:var(--bpk-link-hover-color, rgb(22, 22, 22))}:global(.bpk-no-touch-support) .bpk-link:hover:not(:active):not(:disabled){text-decoration:none;color:#161616;color:var(--bpk-link-hover-color, rgb(22, 22, 22))}.bpk-link:visited{color:#161616;color:var(--bpk-link-visited-color, rgb(22, 22, 22))}.bpk-link:active{color:#161616;color:var(--bpk-link-active-color, rgb(22, 22, 22))}.bpk-link--active{color:#161616}.bpk-link--active:visited{color:#161616}.bpk-link--active:active{color:#161616}.bpk-link--implicit{color:#161616;color:var(--bpk-link-color, rgb(22, 22, 22))}.bpk-no-touch-support .bpk-link--implicit:hover:not(:active):not(:disabled){color:#161616;color:var(--bpk-link-hover-color, rgb(22, 22, 22))}:global(.bpk-no-touch-support) .bpk-link--implicit:hover:not(:active):not(:disabled){color:#161616;color:var(--bpk-link-hover-color, rgb(22, 22, 22))}.bpk-link--implicit:active{text-decoration:none;color:#161616;color:var(--bpk-link-active-color, rgb(22, 22, 22))}.bpk-link--alternate{color:#fff;color:var(--bpk-link-alternate-color, rgb(255, 255, 255))}.bpk-no-touch-support .bpk-link--alternate:hover:not(:active):not(:disabled){color:#fff;color:var(--bpk-link-alternate-hover-color, rgb(255, 255, 255))}:global(.bpk-no-touch-support) .bpk-link--alternate:hover:not(:active):not(:disabled){color:#fff;color:var(--bpk-link-alternate-hover-color, rgb(255, 255, 255))}.bpk-link--alternate:visited{color:#fff;color:var(--bpk-link-alternate-visited-color, rgb(255, 255, 255))}.bpk-link--alternate:active{color:#fff;color:var(--bpk-link-alternate-active-color, rgb(255, 255, 255))}.bpk-link-underlined{padding-bottom:.0625rem;transition:background-size 200ms ease;background:linear-gradient(rgb(22, 22, 22), rgb(22, 22, 22));background-repeat:no-repeat;background-position:0 100%;background-size:100% 1px}.bpk-no-touch-support .bpk-link-underlined:hover:not(:active):not(:disabled){background-size:0 1px}:global(.bpk-no-touch-support) .bpk-link-underlined:hover:not(:active):not(:disabled){background-size:0 1px}.bpk-link-underlined--implicit{background-size:0 1px}.bpk-no-touch-support .bpk-link-underlined--implicit:hover:not(:active):not(:disabled){background-size:100% 1px}:global(.bpk-no-touch-support) .bpk-link-underlined--implicit:hover:not(:active):not(:disabled){background-size:100% 1px}.bpk-link-underlined--alternate{background:linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255));background-repeat:no-repeat;background-position:0 100%;background-size:100% 1px}.bpk-no-touch-support .bpk-link-underlined--alternate:hover:not(:active):not(:disabled){background-size:0 1px}:global(.bpk-no-touch-support) .bpk-link-underlined--alternate:hover:not(:active):not(:disabled){background-size:0 1px}.bpk-link-underlined-implicit--alternate{background:linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255));background-repeat:no-repeat;background-position:0 100%;background-size:0 1px}.bpk-no-touch-support .bpk-link-underlined-implicit--alternate:hover:not(:active):not(:disabled){background-size:100% 1px}:global(.bpk-no-touch-support) .bpk-link-underlined-implicit--alternate:hover:not(:active):not(:disabled){background-size:100% 1px}
+.bpk-link{position:relative;display:inline;padding:0;border:0;background-color:rgba(0,0,0,0);text-decoration:none;cursor:pointer;appearance:none;color:var(--bpk-link-color, rgb(22, 22, 22))}.bpk-no-touch-support .bpk-link:hover:not(:active):not(:disabled){text-decoration:none;color:var(--bpk-link-hover-color, rgb(22, 22, 22))}:global(.bpk-no-touch-support) .bpk-link:hover:not(:active):not(:disabled){text-decoration:none;color:var(--bpk-link-hover-color, rgb(22, 22, 22))}.bpk-link:visited{color:var(--bpk-link-visited-color, rgb(22, 22, 22))}.bpk-link:active{color:var(--bpk-link-active-color, rgb(22, 22, 22))}.bpk-link--active{color:#161616}.bpk-link--active:visited{color:#161616}.bpk-link--active:active{color:#161616}.bpk-link--implicit{color:var(--bpk-link-color, rgb(22, 22, 22))}.bpk-no-touch-support .bpk-link--implicit:hover:not(:active):not(:disabled){color:var(--bpk-link-hover-color, rgb(22, 22, 22))}:global(.bpk-no-touch-support) .bpk-link--implicit:hover:not(:active):not(:disabled){color:var(--bpk-link-hover-color, rgb(22, 22, 22))}.bpk-link--implicit:active{text-decoration:none;color:var(--bpk-link-active-color, rgb(22, 22, 22))}.bpk-link--alternate{color:var(--bpk-link-alternate-color, rgb(255, 255, 255))}.bpk-no-touch-support .bpk-link--alternate:hover:not(:active):not(:disabled){color:var(--bpk-link-alternate-hover-color, rgb(255, 255, 255))}:global(.bpk-no-touch-support) .bpk-link--alternate:hover:not(:active):not(:disabled){color:var(--bpk-link-alternate-hover-color, rgb(255, 255, 255))}.bpk-link--alternate:visited{color:var(--bpk-link-alternate-visited-color, rgb(255, 255, 255))}.bpk-link--alternate:active{color:var(--bpk-link-alternate-active-color, rgb(255, 255, 255))}.bpk-link-underlined{padding-bottom:.0625rem;transition:background-size 200ms ease;background:linear-gradient(rgb(22, 22, 22), rgb(22, 22, 22));background-repeat:no-repeat;background-position:0 100%;background-size:100% 1px}.bpk-no-touch-support .bpk-link-underlined:hover:not(:active):not(:disabled){background-size:0 1px}:global(.bpk-no-touch-support) .bpk-link-underlined:hover:not(:active):not(:disabled){background-size:0 1px}.bpk-link-underlined--implicit{background-size:0 1px}.bpk-no-touch-support .bpk-link-underlined--implicit:hover:not(:active):not(:disabled){background-size:100% 1px}:global(.bpk-no-touch-support) .bpk-link-underlined--implicit:hover:not(:active):not(:disabled){background-size:100% 1px}.bpk-link-underlined--alternate{background:linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255));background-repeat:no-repeat;background-position:0 100%;background-size:100% 1px}.bpk-no-touch-support .bpk-link-underlined--alternate:hover:not(:active):not(:disabled){background-size:0 1px}:global(.bpk-no-touch-support) .bpk-link-underlined--alternate:hover:not(:active):not(:disabled){background-size:0 1px}.bpk-link-underlined-implicit--alternate{background:linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255));background-repeat:no-repeat;background-position:0 100%;background-size:0 1px}.bpk-no-touch-support .bpk-link-underlined-implicit--alternate:hover:not(:active):not(:disabled){background-size:100% 1px}:global(.bpk-no-touch-support) .bpk-link-underlined-implicit--alternate:hover:not(:active):not(:disabled){background-size:100% 1px}

package/bpk-component-map/src/BpkIconMarker.module.css

@@ -15,4 +15,4 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-.bpk-icon-marker__wrapper{position:absolute;top:-32px;left:-13px;z-index:1;padding:16px 13px;border:none;background:none}.bpk-icon-marker__wrapper--selected{top:-40px;left:-16px;z-index:2;padding:20px 16px}.bpk-icon-marker__icon{position:absolute;top:4.8px;left:5px;color:#fff}html[dir=rtl] .bpk-icon-marker__icon{transform:scaleX(-1)}.bpk-icon-marker__icon>svg{position:absolute;width:16px !important;height:16px !important;fill:currentcolor}.bpk-icon-marker__icon--interactive{cursor:pointer}.bpk-icon-marker__icon--selected{top:8px;left:8px;color:#fff;color:var(--bpk-icon-marker-default-selected-color, rgb(255, 255, 255))}html[dir=rtl] .bpk-icon-marker__icon--selected{transform:scaleX(-1)}
+.bpk-icon-marker__wrapper{position:absolute;top:-32px;left:-13px;z-index:1;padding:16px 13px;border:none;background:none}.bpk-icon-marker__wrapper--selected{top:-40px;left:-16px;z-index:2;padding:20px 16px}.bpk-icon-marker__icon{position:absolute;top:4.8px;left:5px;color:#fff}html[dir=rtl] .bpk-icon-marker__icon{transform:scaleX(-1)}.bpk-icon-marker__icon>svg{position:absolute;width:16px !important;height:16px !important;fill:currentcolor}.bpk-icon-marker__icon--interactive{cursor:pointer}.bpk-icon-marker__icon--selected{top:8px;left:8px;color:var(--bpk-icon-marker-default-selected-color, rgb(255, 255, 255))}html[dir=rtl] .bpk-icon-marker__icon--selected{transform:scaleX(-1)}

package/bpk-component-map/src/BpkIconMarkerBackground.module.css

@@ -15,4 +15,4 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-.bpk-icon-marker-background{position:absolute;top:0;left:0;fill:#8e47ba;fill:var(--bpk-icon-marker-default-background-color, rgb(142, 71, 186))}.bpk-icon-marker-background--interactive{cursor:pointer}.bpk-icon-marker-background--disabled{fill:#d4fff2;fill:var(--bpk-icon-marker-default-disabled-background-color, rgb(212, 255, 242))}.bpk-icon-marker-background--selected{fill:#05203c;stroke:#05203c;stroke:var(--bpk-icon-marker-default-selected-color, rgb(5, 32, 60))}
+.bpk-icon-marker-background{position:absolute;top:0;left:0;fill:var(--bpk-icon-marker-default-background-color, rgb(142, 71, 186))}.bpk-icon-marker-background--interactive{cursor:pointer}.bpk-icon-marker-background--disabled{fill:var(--bpk-icon-marker-default-disabled-background-color, rgb(212, 255, 242))}.bpk-icon-marker-background--selected{fill:#05203c;stroke:var(--bpk-icon-marker-default-selected-color, rgb(5, 32, 60))}

package/bpk-component-navigation-bar/src/BpkNavigationBar.module.css

@@ -15,4 +15,4 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-.bpk-navigation-bar{position:relative;display:grid;min-height:3.5rem;padding:1rem;grid-template-rows:auto;grid-template-columns:minmax(1.5rem, auto) minmax(1rem, 1fr) minmax(1.5rem, auto);justify-content:space-between;align-items:center;gap:1rem;background-color:#fff;background-color:var(--bpk-navigation-bar-background-color, rgb(255, 255, 255))}.bpk-navigation-bar--on-dark{background-color:#05203c}.bpk-navigation-bar__title{grid-column:2;text-align:center;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;color:#161616;color:var(--bpk-navigation-bar-title-color, rgb(22, 22, 22))}.bpk-navigation-bar__title :first-child{display:inline}.bpk-navigation-bar__title--on-dark{color:#fff}.bpk-navigation-bar__title--wrap{text-overflow:unset;white-space:normal;overflow:visible}.bpk-navigation-bar__title-container{justify-self:center}.bpk-navigation-bar__leading-item,.bpk-navigation-bar__trailing-item{font-size:.875rem;line-height:1.25rem;font-weight:700}.bpk-navigation-bar__leading-item{grid-column:1;justify-self:start}.bpk-navigation-bar__trailing-item{grid-column:3;justify-self:end}.bpk-navigation-bar__sticky{position:sticky;top:0;z-index:899;box-shadow:0px 1px 3px 0px rgba(37,32,31,.3)}
+.bpk-navigation-bar{position:relative;display:grid;min-height:3.5rem;padding:1rem;grid-template-rows:auto;grid-template-columns:minmax(1.5rem, auto) minmax(1rem, 1fr) minmax(1.5rem, auto);justify-content:space-between;align-items:center;gap:1rem;background-color:var(--bpk-navigation-bar-background-color, rgb(255, 255, 255))}.bpk-navigation-bar--on-dark{background-color:#05203c}.bpk-navigation-bar__title{grid-column:2;text-align:center;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;color:var(--bpk-navigation-bar-title-color, rgb(22, 22, 22))}.bpk-navigation-bar__title :first-child{display:inline}.bpk-navigation-bar__title--on-dark{color:#fff}.bpk-navigation-bar__title--wrap{text-overflow:unset;white-space:normal;overflow:visible}.bpk-navigation-bar__title-container{justify-self:center}.bpk-navigation-bar__leading-item,.bpk-navigation-bar__trailing-item{font-size:.875rem;line-height:1.25rem;font-weight:700}.bpk-navigation-bar__leading-item{grid-column:1;justify-self:start}.bpk-navigation-bar__trailing-item{grid-column:3;justify-self:end}.bpk-navigation-bar__sticky{position:sticky;top:0;z-index:899;box-shadow:0px 1px 3px 0px rgba(37,32,31,.3)}

package/bpk-component-navigation-bar/src/BpkNavigationBarIconButton.module.css

@@ -15,4 +15,4 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-.bpk-navigation-bar-icon-button{color:#161616;color:var(--bpk-navigation-bar-icon-button-color, rgb(22, 22, 22))}.bpk-no-touch-support .bpk-navigation-bar-icon-button:hover:not(:active):not(:disabled){color:#161616;color:var(--bpk-navigation-bar-icon-button-hover-color, rgb(22, 22, 22))}:global(.bpk-no-touch-support) .bpk-navigation-bar-icon-button:hover:not(:active):not(:disabled){color:#161616;color:var(--bpk-navigation-bar-icon-button-hover-color, rgb(22, 22, 22))}.bpk-navigation-bar-icon-button:active{color:#161616;color:var(--bpk-navigation-bar-icon-button-active-color, rgb(22, 22, 22))}.bpk-navigation-bar-icon-button--on-dark{color:#fff}.bpk-no-touch-support .bpk-navigation-bar-icon-button--on-dark:hover:not(:active):not(:disabled){color:#fff}:global(.bpk-no-touch-support) .bpk-navigation-bar-icon-button--on-dark:hover:not(:active):not(:disabled){color:#fff}.bpk-navigation-bar-icon-button--on-dark:active{color:#fff}
+.bpk-navigation-bar-icon-button{color:var(--bpk-navigation-bar-icon-button-color, rgb(22, 22, 22))}.bpk-no-touch-support .bpk-navigation-bar-icon-button:hover:not(:active):not(:disabled){color:var(--bpk-navigation-bar-icon-button-hover-color, rgb(22, 22, 22))}:global(.bpk-no-touch-support) .bpk-navigation-bar-icon-button:hover:not(:active):not(:disabled){color:var(--bpk-navigation-bar-icon-button-hover-color, rgb(22, 22, 22))}.bpk-navigation-bar-icon-button:active{color:var(--bpk-navigation-bar-icon-button-active-color, rgb(22, 22, 22))}.bpk-navigation-bar-icon-button--on-dark{color:#fff}.bpk-no-touch-support .bpk-navigation-bar-icon-button--on-dark:hover:not(:active):not(:disabled){color:#fff}:global(.bpk-no-touch-support) .bpk-navigation-bar-icon-button--on-dark:hover:not(:active):not(:disabled){color:#fff}.bpk-navigation-bar-icon-button--on-dark:active{color:#fff}

package/bpk-component-pagination/src/BpkPaginationPage.module.css

@@ -15,4 +15,4 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-.bpk-pagination-page{display:inline-block;min-height:2.25rem;margin:0;padding:.375rem 1rem;border:0;text-align:center;text-decoration:none;cursor:pointer;vertical-align:middle;user-select:none;border-radius:.5rem;border-radius:var(--bpk-button-border-radius, 0.5rem);font-size:1rem;line-height:1.5rem;font-weight:700;color:#fff;color:var(--bpk-button-primary-text-color, rgb(255, 255, 255));background-color:#05203c;background-color:var(--bpk-button-primary-background-color, rgb(5, 32, 60))}.bpk-no-touch-support .bpk-pagination-page:hover:not(:active):not(:disabled){background-color:#154679;background-color:var(--bpk-button-primary-hover-background-color, rgb(21, 70, 121));color:#fff;color:var(--bpk-button-primary-hover-text-color, rgb(255, 255, 255))}:global(.bpk-no-touch-support) .bpk-pagination-page:hover:not(:active):not(:disabled){background-color:#154679;background-color:var(--bpk-button-primary-hover-background-color, rgb(21, 70, 121));color:#fff;color:var(--bpk-button-primary-hover-text-color, rgb(255, 255, 255))}.bpk-pagination-page:active{color:#fff;color:var(--bpk-button-primary-active-text-color, rgb(255, 255, 255));background-color:#154679;background-color:var(--bpk-button-primary-active-background-color, rgb(21, 70, 121))}.bpk-pagination-page:disabled{background-color:#e0e4e9;color:rgba(0,0,0,.2);cursor:not-allowed}.bpk-pagination-page.bpk-button--loading:disabled{background-color:#154679;background-color:var(--bpk-button-primary-hover-background-color, rgb(21, 70, 121));color:#fff;color:var(--bpk-button-primary-hover-text-color, rgb(255, 255, 255))}.bpk-no-touch-support .bpk-pagination-page:hover:not(:active):not(:disabled){background-color:rgba(0,0,0,0);color:#161616;box-shadow:0 0 0 1px #05203c inset}:global(.bpk-no-touch-support) .bpk-pagination-page:hover:not(:active):not(:disabled){background-color:rgba(0,0,0,0);color:#161616;box-shadow:0 0 0 1px #05203c inset}.bpk-pagination-page--not-selected{color:#161616;color:var(--bpk-button-primary-on-dark-text-color, rgb(22, 22, 22));background-color:#fff;background-color:var(--bpk-button-primary-on-dark-background-color, rgb(255, 255, 255));box-shadow:0 0 0 1px var(--bpk-pagination-selected-background-color, rgb(193, 199, 207)) inset}.bpk-no-touch-support .bpk-pagination-page--not-selected:hover:not(:active):not(:disabled){background-color:#c1c7cf;background-color:var(--bpk-button-primary-on-dark-hover-background-color, rgb(193, 199, 207));color:#161616;color:var(--bpk-button-primary-on-dark-hover-text-color, rgb(22, 22, 22))}:global(.bpk-no-touch-support) .bpk-pagination-page--not-selected:hover:not(:active):not(:disabled){background-color:#c1c7cf;background-color:var(--bpk-button-primary-on-dark-hover-background-color, rgb(193, 199, 207));color:#161616;color:var(--bpk-button-primary-on-dark-hover-text-color, rgb(22, 22, 22))}.bpk-pagination-page--not-selected:active{color:#161616;color:var(--bpk-button-primary-on-dark-active-text-color, rgb(22, 22, 22));background-color:#c1c7cf;background-color:var(--bpk-button-primary-on-dark-active-background-color, rgb(193, 199, 207))}.bpk-pagination-page--not-selected:disabled{background-color:#e0e4e9;color:rgba(0,0,0,.2)}.bpk-pagination-page--not-selected.bpk-button--loading:disabled{background-color:#c1c7cf;background-color:var(--bpk-button-primary-on-dark-hover-background-color, rgb(193, 199, 207));color:#161616;color:var(--bpk-button-primary-on-dark-hover-text-color, rgb(22, 22, 22))}.bpk-no-touch-support .bpk-pagination-page--not-selected:hover:not(:active):not(:disabled){background-color:rgba(0,0,0,0);color:#161616}:global(.bpk-no-touch-support) .bpk-pagination-page--not-selected:hover:not(:active):not(:disabled){background-color:rgba(0,0,0,0);color:#161616}
+.bpk-pagination-page{display:inline-block;min-height:2.25rem;margin:0;padding:.375rem 1rem;border:0;text-align:center;text-decoration:none;cursor:pointer;vertical-align:middle;user-select:none;border-radius:var(--bpk-button-border-radius, 0.5rem);font-size:1rem;line-height:1.5rem;font-weight:700;color:var(--bpk-button-primary-text-color, rgb(255, 255, 255));background-color:var(--bpk-button-primary-background-color, rgb(5, 32, 60))}.bpk-no-touch-support .bpk-pagination-page:hover:not(:active):not(:disabled){background-color:var(--bpk-button-primary-hover-background-color, rgb(21, 70, 121));color:var(--bpk-button-primary-hover-text-color, rgb(255, 255, 255))}:global(.bpk-no-touch-support) .bpk-pagination-page:hover:not(:active):not(:disabled){background-color:var(--bpk-button-primary-hover-background-color, rgb(21, 70, 121));color:var(--bpk-button-primary-hover-text-color, rgb(255, 255, 255))}.bpk-pagination-page:active{color:var(--bpk-button-primary-active-text-color, rgb(255, 255, 255));background-color:var(--bpk-button-primary-active-background-color, rgb(21, 70, 121))}.bpk-pagination-page:disabled{background-color:#e0e4e9;color:rgba(0,0,0,.2);cursor:not-allowed}.bpk-pagination-page.bpk-button--loading:disabled{background-color:var(--bpk-button-primary-hover-background-color, rgb(21, 70, 121));color:var(--bpk-button-primary-hover-text-color, rgb(255, 255, 255))}.bpk-no-touch-support .bpk-pagination-page:hover:not(:active):not(:disabled){background-color:rgba(0,0,0,0);color:#161616;box-shadow:0 0 0 1px #05203c inset}:global(.bpk-no-touch-support) .bpk-pagination-page:hover:not(:active):not(:disabled){background-color:rgba(0,0,0,0);color:#161616;box-shadow:0 0 0 1px #05203c inset}.bpk-pagination-page--not-selected{color:var(--bpk-button-primary-on-dark-text-color, rgb(22, 22, 22));background-color:var(--bpk-button-primary-on-dark-background-color, rgb(255, 255, 255));box-shadow:0 0 0 1px var(--bpk-pagination-selected-background-color, rgb(193, 199, 207)) inset}.bpk-no-touch-support .bpk-pagination-page--not-selected:hover:not(:active):not(:disabled){background-color:var(--bpk-button-primary-on-dark-hover-background-color, rgb(193, 199, 207));color:var(--bpk-button-primary-on-dark-hover-text-color, rgb(22, 22, 22))}:global(.bpk-no-touch-support) .bpk-pagination-page--not-selected:hover:not(:active):not(:disabled){background-color:var(--bpk-button-primary-on-dark-hover-background-color, rgb(193, 199, 207));color:var(--bpk-button-primary-on-dark-hover-text-color, rgb(22, 22, 22))}.bpk-pagination-page--not-selected:active{color:var(--bpk-button-primary-on-dark-active-text-color, rgb(22, 22, 22));background-color:var(--bpk-button-primary-on-dark-active-background-color, rgb(193, 199, 207))}.bpk-pagination-page--not-selected:disabled{background-color:#e0e4e9;color:rgba(0,0,0,.2)}.bpk-pagination-page--not-selected.bpk-button--loading:disabled{background-color:var(--bpk-button-primary-on-dark-hover-background-color, rgb(193, 199, 207));color:var(--bpk-button-primary-on-dark-hover-text-color, rgb(22, 22, 22))}.bpk-no-touch-support .bpk-pagination-page--not-selected:hover:not(:active):not(:disabled){background-color:rgba(0,0,0,0);color:#161616}:global(.bpk-no-touch-support) .bpk-pagination-page--not-selected:hover:not(:active):not(:disabled){background-color:rgba(0,0,0,0);color:#161616}

package/bpk-component-progress/src/BpkProgress.module.css

@@ -15,4 +15,4 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-.bpk-progress{position:relative;height:1rem;border-radius:.75rem;background-color:#e0e4e9;overflow:hidden}.bpk-progress--small{height:.5rem;border-radius:.25rem}.bpk-progress__value{position:absolute;top:0;right:0;bottom:0;left:0;content:" ";width:0;transition:width 400ms ease-in-out;border-radius:.5rem;background-color:#0062e3;background-color:var(--bpk-progress-bar-fill-color, rgb(0, 98, 227))}.bpk-progress__value--stepped{border-radius:0}.bpk-progress__step{position:absolute;top:0;bottom:0;width:.125rem;background:#fff}
+.bpk-progress{position:relative;height:1rem;border-radius:.75rem;background-color:#e0e4e9;overflow:hidden}.bpk-progress--small{height:.5rem;border-radius:.25rem}.bpk-progress__value{position:absolute;top:0;right:0;bottom:0;left:0;content:" ";width:0;transition:width 400ms ease-in-out;border-radius:.5rem;background-color:var(--bpk-progress-bar-fill-color, rgb(0, 98, 227))}.bpk-progress__value--stepped{border-radius:0}.bpk-progress__step{position:absolute;top:0;bottom:0;width:.125rem;background:#fff}

package/bpk-component-radio/src/BpkRadio.module.css

@@ -15,4 +15,4 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-.bpk-radio{position:relative;display:inline-block;padding-left:1.75rem}html[dir=rtl] .bpk-radio{padding-right:1.75rem;padding-left:0}.bpk-radio--white{color:#fff}.bpk-radio--white input[type=radio]{background:#fff}.bpk-radio--disabled{color:rgba(0,0,0,.2);cursor:not-allowed}.bpk-radio--disabled--white{color:hsla(0,0%,100%,.5)}.bpk-radio--invalid input[type=radio]{border:3px solid #e70866;border-radius:1.5rem}.bpk-radio__input{position:absolute;top:0;left:0;width:1.25rem;height:1.25rem;margin:0;padding:0;cursor:pointer;vertical-align:text-bottom;appearance:none;border:3px solid #626971;border-radius:1.5rem}html[dir=rtl] .bpk-radio__input{right:0;left:auto}@media screen\0 {.bpk-radio__input{background:none !important}}.bpk-radio__input:checked{border-color:#0062e3;border-color:var(--bpk-radio-checked-color, rgb(0, 98, 227))}.bpk-radio__input:checked:disabled{border-color:rgba(0,0,0,.2)}.bpk-radio__input:disabled{border-color:rgba(0,0,0,.2)}.bpk-radio__input:disabled{cursor:inherit}.bpk-radio__input:checked+.bpk-radio__circle{display:block}.bpk-radio__input:checked:disabled+.bpk-radio__circle{display:block;background:rgba(0,0,0,.2)}.bpk-radio__circle{position:absolute;top:.375rem;left:.375rem;display:none;width:.5rem;height:.5rem;border-radius:50%;background:#0062e3;background:var(--bpk-radio-checked-color, rgb(0, 98, 227))}html[dir=rtl] .bpk-radio__circle{right:.375rem;left:auto}
+.bpk-radio{position:relative;display:inline-block;padding-left:1.75rem}html[dir=rtl] .bpk-radio{padding-right:1.75rem;padding-left:0}.bpk-radio--white{color:#fff}.bpk-radio--white input[type=radio]{background:#fff}.bpk-radio--disabled{color:rgba(0,0,0,.2);cursor:not-allowed}.bpk-radio--disabled--white{color:hsla(0,0%,100%,.5)}.bpk-radio--invalid input[type=radio]{border:3px solid #e70866;border-radius:1.5rem}.bpk-radio__input{position:absolute;top:0;left:0;width:1.25rem;height:1.25rem;margin:0;padding:0;cursor:pointer;vertical-align:text-bottom;appearance:none;border:3px solid #626971;border-radius:1.5rem}html[dir=rtl] .bpk-radio__input{right:0;left:auto}@media screen\0 {.bpk-radio__input{background:none !important}}.bpk-radio__input:checked{border-color:var(--bpk-radio-checked-color, rgb(0, 98, 227))}.bpk-radio__input:checked:disabled{border-color:rgba(0,0,0,.2)}.bpk-radio__input:disabled{border-color:rgba(0,0,0,.2)}.bpk-radio__input:disabled{cursor:inherit}.bpk-radio__input:checked+.bpk-radio__circle{display:block}.bpk-radio__input:checked:disabled+.bpk-radio__circle{display:block;background:rgba(0,0,0,.2)}.bpk-radio__circle{position:absolute;top:.375rem;left:.375rem;display:none;width:.5rem;height:.5rem;border-radius:50%;background:var(--bpk-radio-checked-color, rgb(0, 98, 227))}html[dir=rtl] .bpk-radio__circle{right:.375rem;left:auto}

package/bpk-component-select/src/BpkSelect.module.css

@@ -15,4 +15,4 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-.bpk-select{display:inline-block;width:100%;height:2.25rem;padding:.375rem .5rem;padding-right:2rem;border:solid .0625rem #c1c7cf;border-radius:.5rem;background:#fff url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2Ij48c3R5bGUgdHlwZT0idGV4dC9jc3MiPmNpcmNsZSwgZWxsaXBzZSwgbGluZSwgcGF0aCwgcG9seWdvbiwgcG9seWxpbmUsIHJlY3QsIHRleHQgeyBmaWxsOiAjMTYxNjE2ICFpbXBvcnRhbnQgfTwvc3R5bGU+PHBhdGggZD0iTTE2LjUzNyA4LjI1SDcuNDYzYTEuMzU4IDEuMzU4IDAgMCAwLTEuMTEgMi4yNTFsNC4zNTQgNC43N2ExLjUzIDEuNTMgMCAwIDAgMi4xODQuMDRsNC43MTgtNC43N2ExLjM1NyAxLjM1NyAwIDAgMC0xLjA3Mi0yLjI5MXoiLz48L3N2Zz4=") no-repeat right .5rem center;background-size:1.125rem;color:#161616;line-height:1.375rem;appearance:none}html[dir=rtl] .bpk-select{padding-right:.5rem;padding-left:2rem;background-position:left .5rem center}@media screen\0 {.bpk-select{padding:.5rem !important;background-image:none !important}}.bpk-select:disabled{border-color:#e0e4e9;background:#fff url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2Ij48c3R5bGUgdHlwZT0idGV4dC9jc3MiPmNpcmNsZSwgZWxsaXBzZSwgbGluZSwgcGF0aCwgcG9seWdvbiwgcG9seWxpbmUsIHJlY3QsIHRleHQgeyBmaWxsOiAjMDAwMDAwICFpbXBvcnRhbnQgfTwvc3R5bGU+PHBhdGggZD0iTTE2LjUzNyA4LjI1SDcuNDYzYTEuMzU4IDEuMzU4IDAgMCAwLTEuMTEgMi4yNTFsNC4zNTQgNC43N2ExLjUzIDEuNTMgMCAwIDAgMi4xODQuMDRsNC43MTgtNC43N2ExLjM1NyAxLjM1NyAwIDAgMC0xLjA3Mi0yLjI5MXoiLz48L3N2Zz4=") no-repeat right .5rem center;background-size:1.125rem;color:rgba(0,0,0,.2);cursor:not-allowed}.bpk-select--large{height:3rem;padding:.5rem 1rem;padding-right:2.5rem;border-radius:.75rem;background:#fff url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2Ij48c3R5bGUgdHlwZT0idGV4dC9jc3MiPmNpcmNsZSwgZWxsaXBzZSwgbGluZSwgcGF0aCwgcG9seWdvbiwgcG9seWxpbmUsIHJlY3QsIHRleHQgeyBmaWxsOiAjMTYxNjE2ICFpbXBvcnRhbnQgfTwvc3R5bGU+PHBhdGggZD0iTTE2LjUzNyA4LjI1SDcuNDYzYTEuMzU4IDEuMzU4IDAgMCAwLTEuMTEgMi4yNTFsNC4zNTQgNC43N2ExLjUzIDEuNTMgMCAwIDAgMi4xODQuMDRsNC43MTgtNC43N2ExLjM1NyAxLjM1NyAwIDAgMC0xLjA3Mi0yLjI5MXoiLz48L3N2Zz4=") no-repeat right 1rem center}html[dir=rtl] .bpk-select--large{padding-right:1rem;padding-left:2.5rem;background-position:left 1rem center}.bpk-select--docked:first-child{border-right-width:0;border-radius:.5rem 0 0 .5rem}html[dir=rtl] .bpk-select--docked:first-child{border-right-width:.0625rem;border-left-width:0;border-radius:0 .5rem .5rem 0}.bpk-select--docked:last-child{border-radius:0 .5rem .5rem 0}html[dir=rtl] .bpk-select--docked:last-child{border-radius:.5rem 0 0 .5rem}.bpk-select--docked:not(:first-child):not(:last-child){border-right-width:0;border-radius:0}html[dir=rtl] .bpk-select--docked:not(:first-child):not(:last-child){border-right-width:.0625rem;border-left-width:0}.bpk-select--docked-first{border-right-width:0;border-radius:.5rem 0 0 .5rem}html[dir=rtl] .bpk-select--docked-first{border-right-width:.0625rem;border-left-width:0;border-radius:0 .5rem .5rem 0}.bpk-select--docked-middle{border-right-width:0;border-radius:0}html[dir=rtl] .bpk-select--docked-middle{border-right-width:.0625rem;border-left-width:0}.bpk-select--docked-last{border-radius:0 .5rem .5rem 0}html[dir=rtl] .bpk-select--docked-last{border-radius:.5rem 0 0 .5rem}.bpk-select--invalid{padding-right:2rem;background:#fff url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2Ij48c3R5bGUgdHlwZT0idGV4dC9jc3MiPmNpcmNsZSwgZWxsaXBzZSwgbGluZSwgcGF0aCwgcG9seWdvbiwgcG9seWxpbmUsIHJlY3QsIHRleHQgeyBmaWxsOiAjMTYxNjE2ICFpbXBvcnRhbnQgfTwvc3R5bGU+PHBhdGggZD0iTTE2LjUzNyA4LjI1SDcuNDYzYTEuMzU4IDEuMzU4IDAgMCAwLTEuMTEgMi4yNTFsNC4zNTQgNC43N2ExLjUzIDEuNTMgMCAwIDAgMi4xODQuMDRsNC43MTgtNC43N2ExLjM1NyAxLjM1NyAwIDAgMC0xLjA3Mi0yLjI5MXoiLz48L3N2Zz4=") no-repeat right .5rem center;background-size:1.125rem;border-color:#e70866;border-color:var(--bpk-select-invalid-border-color, rgb(231, 8, 102))}html[dir=rtl] .bpk-select--invalid{padding-right:.5rem;padding-left:2rem;background-position:left .5rem center}.bpk-select--with-image{padding-left:2.5rem}html[dir=rtl] .bpk-select--with-image{padding-right:2.5rem;padding-left:2.5rem}@media screen\0 {html[dir=rtl] .bpk-select--with-image{padding-right:2.5rem !important;padding-left:1rem !important}}@media screen\0 {.bpk-select--with-image{padding-left:2.5rem !important}}.bpk-select--with-image-large{padding-left:3.5rem}html[dir=rtl] .bpk-select--with-image-large{padding-right:3.5rem;padding-left:2.5rem}@media screen\0 {html[dir=rtl] .bpk-select--with-image-large{padding-right:2.75rem !important;padding-left:1rem !important}}@media screen\0 {.bpk-select--with-image-large{padding-left:2.75rem !important}}.bpk-select-wrapper{position:relative}.bpk-select-wrapper__image{position:absolute;top:.625rem;left:.5rem;width:1.5rem;height:1rem;pointer-events:none}html[dir=rtl] .bpk-select-wrapper__image{right:.5rem;left:auto}.bpk-select-wrapper__image--large{top:.75rem;left:1rem;width:2rem;height:1.5rem}html[dir=rtl] .bpk-select-wrapper__image--large{right:1rem;left:auto}.bpk-select-wrapper__image--disabled{opacity:.5}
+.bpk-select{display:inline-block;width:100%;height:2.25rem;padding:.375rem .5rem;padding-right:2rem;border:solid .0625rem #c1c7cf;border-radius:.5rem;background:#fff url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2Ij48c3R5bGUgdHlwZT0idGV4dC9jc3MiPmNpcmNsZSwgZWxsaXBzZSwgbGluZSwgcGF0aCwgcG9seWdvbiwgcG9seWxpbmUsIHJlY3QsIHRleHQgeyBmaWxsOiAjMTYxNjE2ICFpbXBvcnRhbnQgfTwvc3R5bGU+PHBhdGggZD0iTTE2LjUzNyA4LjI1SDcuNDYzYTEuMzU4IDEuMzU4IDAgMCAwLTEuMTEgMi4yNTFsNC4zNTQgNC43N2ExLjUzIDEuNTMgMCAwIDAgMi4xODQuMDRsNC43MTgtNC43N2ExLjM1NyAxLjM1NyAwIDAgMC0xLjA3Mi0yLjI5MXoiLz48L3N2Zz4=") no-repeat right .5rem center;background-size:1.125rem;color:#161616;line-height:1.375rem;appearance:none}html[dir=rtl] .bpk-select{padding-right:.5rem;padding-left:2rem;background-position:left .5rem center}@media screen\0 {.bpk-select{padding:.5rem !important;background-image:none !important}}.bpk-select:disabled{border-color:#e0e4e9;background:#fff url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2Ij48c3R5bGUgdHlwZT0idGV4dC9jc3MiPmNpcmNsZSwgZWxsaXBzZSwgbGluZSwgcGF0aCwgcG9seWdvbiwgcG9seWxpbmUsIHJlY3QsIHRleHQgeyBmaWxsOiAjMDAwMDAwICFpbXBvcnRhbnQgfTwvc3R5bGU+PHBhdGggZD0iTTE2LjUzNyA4LjI1SDcuNDYzYTEuMzU4IDEuMzU4IDAgMCAwLTEuMTEgMi4yNTFsNC4zNTQgNC43N2ExLjUzIDEuNTMgMCAwIDAgMi4xODQuMDRsNC43MTgtNC43N2ExLjM1NyAxLjM1NyAwIDAgMC0xLjA3Mi0yLjI5MXoiLz48L3N2Zz4=") no-repeat right .5rem center;background-size:1.125rem;color:rgba(0,0,0,.2);cursor:not-allowed}.bpk-select--large{height:3rem;padding:.5rem 1rem;padding-right:2.5rem;border-radius:.75rem;background:#fff url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2Ij48c3R5bGUgdHlwZT0idGV4dC9jc3MiPmNpcmNsZSwgZWxsaXBzZSwgbGluZSwgcGF0aCwgcG9seWdvbiwgcG9seWxpbmUsIHJlY3QsIHRleHQgeyBmaWxsOiAjMTYxNjE2ICFpbXBvcnRhbnQgfTwvc3R5bGU+PHBhdGggZD0iTTE2LjUzNyA4LjI1SDcuNDYzYTEuMzU4IDEuMzU4IDAgMCAwLTEuMTEgMi4yNTFsNC4zNTQgNC43N2ExLjUzIDEuNTMgMCAwIDAgMi4xODQuMDRsNC43MTgtNC43N2ExLjM1NyAxLjM1NyAwIDAgMC0xLjA3Mi0yLjI5MXoiLz48L3N2Zz4=") no-repeat right 1rem center}html[dir=rtl] .bpk-select--large{padding-right:1rem;padding-left:2.5rem;background-position:left 1rem center}.bpk-select--docked:first-child{border-right-width:0;border-radius:.5rem 0 0 .5rem}html[dir=rtl] .bpk-select--docked:first-child{border-right-width:.0625rem;border-left-width:0;border-radius:0 .5rem .5rem 0}.bpk-select--docked:last-child{border-radius:0 .5rem .5rem 0}html[dir=rtl] .bpk-select--docked:last-child{border-radius:.5rem 0 0 .5rem}.bpk-select--docked:not(:first-child):not(:last-child){border-right-width:0;border-radius:0}html[dir=rtl] .bpk-select--docked:not(:first-child):not(:last-child){border-right-width:.0625rem;border-left-width:0}.bpk-select--docked-first{border-right-width:0;border-radius:.5rem 0 0 .5rem}html[dir=rtl] .bpk-select--docked-first{border-right-width:.0625rem;border-left-width:0;border-radius:0 .5rem .5rem 0}.bpk-select--docked-middle{border-right-width:0;border-radius:0}html[dir=rtl] .bpk-select--docked-middle{border-right-width:.0625rem;border-left-width:0}.bpk-select--docked-last{border-radius:0 .5rem .5rem 0}html[dir=rtl] .bpk-select--docked-last{border-radius:.5rem 0 0 .5rem}.bpk-select--invalid{padding-right:2rem;background:#fff url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2Ij48c3R5bGUgdHlwZT0idGV4dC9jc3MiPmNpcmNsZSwgZWxsaXBzZSwgbGluZSwgcGF0aCwgcG9seWdvbiwgcG9seWxpbmUsIHJlY3QsIHRleHQgeyBmaWxsOiAjMTYxNjE2ICFpbXBvcnRhbnQgfTwvc3R5bGU+PHBhdGggZD0iTTE2LjUzNyA4LjI1SDcuNDYzYTEuMzU4IDEuMzU4IDAgMCAwLTEuMTEgMi4yNTFsNC4zNTQgNC43N2ExLjUzIDEuNTMgMCAwIDAgMi4xODQuMDRsNC43MTgtNC43N2ExLjM1NyAxLjM1NyAwIDAgMC0xLjA3Mi0yLjI5MXoiLz48L3N2Zz4=") no-repeat right .5rem center;background-size:1.125rem;border-color:var(--bpk-select-invalid-border-color, rgb(231, 8, 102))}html[dir=rtl] .bpk-select--invalid{padding-right:.5rem;padding-left:2rem;background-position:left .5rem center}.bpk-select--with-image{padding-left:2.5rem}html[dir=rtl] .bpk-select--with-image{padding-right:2.5rem;padding-left:2.5rem}@media screen\0 {html[dir=rtl] .bpk-select--with-image{padding-right:2.5rem !important;padding-left:1rem !important}}@media screen\0 {.bpk-select--with-image{padding-left:2.5rem !important}}.bpk-select--with-image-large{padding-left:3.5rem}html[dir=rtl] .bpk-select--with-image-large{padding-right:3.5rem;padding-left:2.5rem}@media screen\0 {html[dir=rtl] .bpk-select--with-image-large{padding-right:2.75rem !important;padding-left:1rem !important}}@media screen\0 {.bpk-select--with-image-large{padding-left:2.75rem !important}}.bpk-select-wrapper{position:relative}.bpk-select-wrapper__image{position:absolute;top:.625rem;left:.5rem;width:1.5rem;height:1rem;pointer-events:none}html[dir=rtl] .bpk-select-wrapper__image{right:.5rem;left:auto}.bpk-select-wrapper__image--large{top:.75rem;left:1rem;width:2rem;height:1.5rem}html[dir=rtl] .bpk-select-wrapper__image--large{right:1rem;left:auto}.bpk-select-wrapper__image--disabled{opacity:.5}

package/bpk-component-skip-link/src/BpkSkipLink.module.css

@@ -15,4 +15,4 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-.bpk-skip-link{padding:.75rem 1rem;transition:opacity 200ms ease-in-out;border-radius:.5rem;color:#fff;text-decoration:none;opacity:0;overflow:hidden;pointer-events:none;transition-delay:200ms;font-size:1rem;line-height:1.25rem;font-weight:700;background-color:#e70866;background-color:var(--bpk-skip-link-background-color, rgb(231, 8, 102))}.bpk-skip-link:focus-within,.bpk-skip-link:focus{transition:none;opacity:1;transition-delay:0s}
+.bpk-skip-link{padding:.75rem 1rem;transition:opacity 200ms ease-in-out;border-radius:.5rem;color:#fff;text-decoration:none;opacity:0;overflow:hidden;pointer-events:none;transition-delay:200ms;font-size:1rem;line-height:1.25rem;font-weight:700;background-color:var(--bpk-skip-link-background-color, rgb(231, 8, 102))}.bpk-skip-link:focus-within,.bpk-skip-link:focus{transition:none;opacity:1;transition-delay:0s}

package/bpk-component-spinner/src/BpkSpinner.module.css

@@ -15,4 +15,4 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-@keyframes bpk-keyframe-spin{100%{transform:rotate(1turn)}}.bpk-spinner{display:block;width:1rem;height:1rem;animation:bpk-keyframe-spin 600ms linear infinite}.bpk-spinner--primary{fill:#0062e3;fill:var(--bpk-spinner-primary-color, rgb(0, 98, 227))}.bpk-spinner--light{fill:#fff}.bpk-spinner--dark{fill:#161616}.bpk-spinner--large{width:1.5rem;height:1.5rem}.bpk-spinner--extra-large{width:2rem;height:2rem}.bpk-spinner--align-to-button{vertical-align:baseline}.bpk-spinner--align-to-large-button{margin-top:0rem;vertical-align:top}
+@keyframes bpk-keyframe-spin{100%{transform:rotate(1turn)}}.bpk-spinner{display:block;width:1rem;height:1rem;animation:bpk-keyframe-spin 600ms linear infinite}.bpk-spinner--primary{fill:var(--bpk-spinner-primary-color, rgb(0, 98, 227))}.bpk-spinner--light{fill:#fff}.bpk-spinner--dark{fill:#161616}.bpk-spinner--large{width:1.5rem;height:1.5rem}.bpk-spinner--extra-large{width:2rem;height:2rem}.bpk-spinner--align-to-button{vertical-align:baseline}.bpk-spinner--align-to-large-button{margin-top:0rem;vertical-align:top}

package/bpk-component-star-rating/src/BpkStar.module.css

@@ -15,4 +15,4 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-.bpk-star{display:inline-flex;width:1rem;height:1rem;vertical-align:text-bottom;fill:rgba(0,0,0,.2)}.bpk-star--large{width:1.5rem;height:1.5rem;vertical-align:bottom}.bpk-star--extra-large{width:3rem;height:3rem;vertical-align:bottom}.bpk-star--half{position:absolute;left:0}.bpk-star--filled{fill:#f55d42;fill:var(--bpk-star-rating-filled-color, rgb(245, 93, 66))}.bpk-star__container{display:inline-flex;width:1rem;height:1rem}.bpk-star__container--half-star{position:relative;vertical-align:text-bottom}.bpk-star__container--large{width:1.5rem;height:1.5rem;vertical-align:bottom}.bpk-star__container--extra-large{width:3rem;height:3rem;vertical-align:bottom}
+.bpk-star{display:inline-flex;width:1rem;height:1rem;vertical-align:text-bottom;fill:rgba(0,0,0,.2)}.bpk-star--large{width:1.5rem;height:1.5rem;vertical-align:bottom}.bpk-star--extra-large{width:3rem;height:3rem;vertical-align:bottom}.bpk-star--half{position:absolute;left:0}.bpk-star--filled{fill:var(--bpk-star-rating-filled-color, rgb(245, 93, 66))}.bpk-star__container{display:inline-flex;width:1rem;height:1rem}.bpk-star__container--half-star{position:relative;vertical-align:text-bottom}.bpk-star__container--large{width:1.5rem;height:1.5rem;vertical-align:bottom}.bpk-star__container--extra-large{width:3rem;height:3rem;vertical-align:bottom}

package/bpk-component-switch/src/BpkSwitch.module.css

@@ -15,4 +15,4 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-.bpk-switch{position:relative;display:flex;width:fit-content;align-items:center;border-radius:1rem}.bpk-switch__checkbox{position:absolute;opacity:0}.bpk-switch__checkbox:checked~.bpk-switch__switch{background:#0062e3;background:var(--bpk-switch-checked-color, rgb(0, 98, 227))}.bpk-switch__checkbox:checked~.bpk-switch__switch::before{left:1.375rem}.bpk-switch__checkbox:focus-visible~.bpk-switch__switch{outline:.125rem solid #0062e3;outline-offset:.125rem}.bpk-switch__switch{position:relative;float:right;display:block;min-width:3.25rem;height:2rem;transition:background 200ms linear;border-radius:1rem;background:rgba(0,0,0,.2);cursor:pointer}.bpk-switch__switch::before{position:absolute;top:.125rem;left:.125rem;content:"";display:block;width:1.75rem;height:1.75rem;transition:left 200ms ease-out;border-radius:50%;background:#fff;box-shadow:0px 1px 3px 0px rgba(37,32,31,.3)}.bpk-switch__switch--small{min-width:2.5rem;height:1.25rem}.bpk-switch__switch--small::before{width:1rem;height:1rem}.bpk-switch__switch--on-contrast{background:hsla(0,0%,100%,.2)}
+.bpk-switch{position:relative;display:flex;width:fit-content;align-items:center;border-radius:1rem}.bpk-switch__checkbox{position:absolute;opacity:0}.bpk-switch__checkbox:checked~.bpk-switch__switch{background:var(--bpk-switch-checked-color, rgb(0, 98, 227))}.bpk-switch__checkbox:checked~.bpk-switch__switch::before{left:1.375rem}.bpk-switch__checkbox:focus-visible~.bpk-switch__switch{outline:.125rem solid #0062e3;outline-offset:.125rem}.bpk-switch__switch{position:relative;float:right;display:block;min-width:3.25rem;height:2rem;transition:background 200ms linear;border-radius:1rem;background:rgba(0,0,0,.2);cursor:pointer}.bpk-switch__switch::before{position:absolute;top:.125rem;left:.125rem;content:"";display:block;width:1.75rem;height:1.75rem;transition:left 200ms ease-out;border-radius:50%;background:#fff;box-shadow:0px 1px 3px 0px rgba(37,32,31,.3)}.bpk-switch__switch--small{min-width:2.5rem;height:1.25rem}.bpk-switch__switch--small::before{width:1rem;height:1rem}.bpk-switch__switch--on-contrast{background:hsla(0,0%,100%,.2)}

package/bpk-component-textarea/src/BpkTextarea.module.css

@@ -15,4 +15,4 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-.bpk-textarea{display:inline-block;width:100%;max-width:100%;min-height:5.5rem;padding:.5rem .5rem;border:solid .0625rem #c1c7cf;border-radius:.5rem;background:#fff;color:#161616;appearance:none}.bpk-textarea::placeholder{color:#626971}.bpk-textarea:disabled{border-color:#eff3f8;background:#fff;color:rgba(0,0,0,.2);cursor:not-allowed}.bpk-textarea::-ms-clear{display:none}.bpk-textarea--invalid{padding-right:2rem;background:#fff url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2Ij48c3R5bGUgdHlwZT0idGV4dC9jc3MiPmNpcmNsZSwgZWxsaXBzZSwgbGluZSwgcGF0aCwgcG9seWdvbiwgcG9seWxpbmUsIHJlY3QsIHRleHQgeyBmaWxsOiAjZTcwODY2ICFpbXBvcnRhbnQgfTwvc3R5bGU+PHBhdGggZD0iTTEyIDEuNUExMC41IDEwLjUgMCAxIDAgMjIuNSAxMiAxMC41IDEwLjUgMCAwIDAgMTIgMS41ek0xMiAxOGExLjUgMS41IDAgMSAxIDEuNS0xLjVBMS41IDEuNSAwIDAgMSAxMiAxOHptMS41LTZhMS41IDEuNSAwIDAgMS0zIDBWNy41YTEuNSAxLjUgMCAwIDEgMyAweiIvPjwvc3ZnPg==") no-repeat right .5rem center;border-color:#e70866;border-color:var(--bpk-textarea-invalid-border-color, rgb(231, 8, 102))}html[dir=rtl] .bpk-textarea--invalid{padding-right:.5rem;padding-left:2rem;background-position:left .5rem center}html[dir=rtl] .bpk-textarea--invalid.bpk-textarea--large{padding-right:1rem;padding-left:2.5rem;background-position:right 1rem center}.bpk-textarea--large{min-height:6rem;padding-right:1rem;padding-left:1rem;border-radius:.75rem}.bpk-textarea--large.bpk-textarea--invalid{padding-right:2.5rem;background-position:right 1rem center}html[dir=rtl] .bpk-textarea--large.bpk-textarea--invalid{padding-right:1rem;padding-left:2.5rem;background-position:left 1rem center}
+.bpk-textarea{display:inline-block;width:100%;max-width:100%;min-height:5.5rem;padding:.5rem .5rem;border:solid .0625rem #c1c7cf;border-radius:.5rem;background:#fff;color:#161616;appearance:none}.bpk-textarea::placeholder{color:#626971}.bpk-textarea:disabled{border-color:#eff3f8;background:#fff;color:rgba(0,0,0,.2);cursor:not-allowed}.bpk-textarea::-ms-clear{display:none}.bpk-textarea--invalid{padding-right:2rem;background:#fff url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2Ij48c3R5bGUgdHlwZT0idGV4dC9jc3MiPmNpcmNsZSwgZWxsaXBzZSwgbGluZSwgcGF0aCwgcG9seWdvbiwgcG9seWxpbmUsIHJlY3QsIHRleHQgeyBmaWxsOiAjZTcwODY2ICFpbXBvcnRhbnQgfTwvc3R5bGU+PHBhdGggZD0iTTEyIDEuNUExMC41IDEwLjUgMCAxIDAgMjIuNSAxMiAxMC41IDEwLjUgMCAwIDAgMTIgMS41ek0xMiAxOGExLjUgMS41IDAgMSAxIDEuNS0xLjVBMS41IDEuNSAwIDAgMSAxMiAxOHptMS41LTZhMS41IDEuNSAwIDAgMS0zIDBWNy41YTEuNSAxLjUgMCAwIDEgMyAweiIvPjwvc3ZnPg==") no-repeat right .5rem center;border-color:var(--bpk-textarea-invalid-border-color, rgb(231, 8, 102))}html[dir=rtl] .bpk-textarea--invalid{padding-right:.5rem;padding-left:2rem;background-position:left .5rem center}html[dir=rtl] .bpk-textarea--invalid.bpk-textarea--large{padding-right:1rem;padding-left:2.5rem;background-position:right 1rem center}.bpk-textarea--large{min-height:6rem;padding-right:1rem;padding-left:1rem;border-radius:.75rem}.bpk-textarea--large.bpk-textarea--invalid{padding-right:2.5rem;background-position:right 1rem center}html[dir=rtl] .bpk-textarea--large.bpk-textarea--invalid{padding-right:1rem;padding-left:2.5rem;background-position:left 1rem center}

package/bpk-mixins/_utils.scss

@@ -198,7 +198,6 @@
 ///   }
 
 @mixin bpk-themeable-property($property, $variableName, $fallback) {
-  #{$property}: $fallback;
   #{$property}: var($variableName, $fallback);
 }
 

package/bpk-stylesheets/base.css

@@ -1,4 +1,4 @@
-/*
+/*!
  * 
  * Backpack - Skyscanner's Design System
  * 
@@ -16,4 +16,4 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  * 
- *//*! normalize.css v4.1.1 | MIT License | github.com/necolas/normalize.css */html{font-family:sans-serif;line-height:1.15;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block}audio:not([controls]){display:none;height:0}progress{vertical-align:baseline}template,[hidden]{display:none}a{background-color:rgba(0,0,0,0);-webkit-text-decoration-skip:objects}a:active,a:hover{outline-width:0}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:inherit}b,strong{font-weight:bolder}dfn{font-style:italic}h1{font-size:2em;margin:.67em 0}mark{background-color:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}svg:not(:root){overflow:hidden}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}figure{margin:1em 40px}hr{box-sizing:content-box;height:0;overflow:visible}button,input,optgroup,select,textarea{font:inherit;margin:0}optgroup{font-weight:bold}button,input{overflow:visible}button,select{text-transform:none}button,html [type=button],[type=reset],[type=submit]{-webkit-appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-input-placeholder{color:inherit;opacity:.54}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}html{font-size:100%;box-sizing:border-box}*{box-sizing:inherit}*::before,*::after{box-sizing:inherit}body{color:#161616;font-family:var(--bpk-base-font-stack, "Skyscanner Relative", -apple-system, BlinkMacSystemFont, "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif);font-size:1rem;line-height:1.3rem}body.scaffold-font-size{font-size:13px}body.enable-font-smoothing{-webkit-font-smoothing:antialiased}:focus-visible,button:focus-visible,[type=button]:focus-visible,[type=reset]:focus-visible,[type=submit]:focus-visible{outline:.125rem solid #0062e3;outline-offset:.125rem}.hidden,.hide{display:none !important}.visuallyhidden,.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;white-space:nowrap;overflow:hidden;clip:rect(0 0 0 0)}.visuallyhidden.focusable:active,.visuallyhidden.focusable:focus,.visually-hidden.focusable:active,.visually-hidden.focusable:focus{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto}.invisible{visibility:hidden}.clearfix::before,.clearfix::after{content:"";display:table}.clearfix::after{clear:both}
+ *//*! normalize.css v4.1.1 | MIT License | github.com/necolas/normalize.css */html{font-family:sans-serif;line-height:1.15;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block}audio:not([controls]){display:none;height:0}progress{vertical-align:initial}[hidden],template{display:none}a{background-color:#0000;-webkit-text-decoration-skip:objects}a:active,a:hover{outline-width:0}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:inherit;font-weight:bolder}dfn{font-style:italic}h1{font-size:2em;margin:.67em 0}mark{background-color:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:initial}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}svg:not(:root){overflow:hidden}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}figure{margin:1em 40px}hr{box-sizing:initial;height:0;overflow:visible}button,input,optgroup,select,textarea{font:inherit;margin:0}optgroup{font-weight:700}button,input{overflow:visible}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-input-placeholder{color:inherit;opacity:.54}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}html{box-sizing:border-box;font-size:100%}*,:after,:before{box-sizing:inherit}body{color:#161616;font-family:var(--bpk-base-font-stack,"Skyscanner Relative",-apple-system,BlinkMacSystemFont,"Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-serif);font-size:1rem;line-height:1.3rem}body.scaffold-font-size{font-size:13px}body.enable-font-smoothing{-webkit-font-smoothing:antialiased}:focus-visible,[type=button]:focus-visible,[type=reset]:focus-visible,[type=submit]:focus-visible,button:focus-visible{outline:.125rem solid #0062e3;outline-offset:.125rem}.hidden,.hide{display:none!important}.visually-hidden,.visuallyhidden{border:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px;clip:rect(0 0 0 0)}.visually-hidden.focusable:active,.visually-hidden.focusable:focus,.visuallyhidden.focusable:active,.visuallyhidden.focusable:focus{height:auto;margin:0;overflow:visible;position:static;width:auto;clip:auto}.invisible{visibility:hidden}.clearfix:after,.clearfix:before{content:"";display:table}.clearfix:after{clear:both}:root{--bpk-radius-none:0;--bpk-radius-full:6.25rem;--bpk-radius-lg:1.5rem;--bpk-radius-md:0.75rem;--bpk-radius-nav-tabs:1.125rem;--bpk-radius-sm:0.5rem;--bpk-radius-xs:0.25rem;--bpk-spacing-base:1rem;--bpk-spacing-lg:1.5rem;--bpk-spacing-md:0.5rem;--bpk-spacing-none:0;--bpk-spacing-sm:0.25rem;--bpk-spacing-xl:2rem;--bpk-spacing-xs:0.125rem;--bpk-spacing-xxl:2.5rem;--bpk-spacing-xxs:0.0625rem;--bpk-spacing-xxxl:4rem;--bpk-spacing-xxxxl:6rem;--bpk-canvas-contrast:#eff3f8;--bpk-canvas-default:#fff;--bpk-private-badge-colour-bg-default:#eff3f8;--bpk-private-badge-colour-bg-inverse:#fff;--bpk-private-badge-colour-bg-outline:#fff0;--bpk-private-badge-colour-bg-subtle:#eff3f8;--bpk-private-badge-colour-stroke-outline:#fff;--bpk-private-badge-dimension-padding-horizontal-default:0.5rem;--bpk-private-badge-dimension-padding-horizontal-subtle:0.5rem;--bpk-private-badge-typography-tmp-badge-label:0.875rem;--bpk-private-badge-typography-tmp-badge-line-height:0;--bpk-private-button-colour-bg-destructive:#e0e4e9;--bpk-private-button-colour-bg-destructive-pressed:#e70866;--bpk-private-button-colour-bg-disabled:#e0e4e9;--bpk-private-button-colour-bg-feature-pressed:#024daf;--bpk-private-button-colour-bg-featured:#0062e3;--bpk-private-button-colour-bg-footer:#fff0;--bpk-private-button-colour-bg-footer-pressed:#fff0;--bpk-private-button-colour-bg-primary:#05203c;--bpk-private-button-colour-bg-primary-on-dark:#fff;--bpk-private-button-colour-bg-primary-on-dark-pressed:#c1c7cf;--bpk-private-button-colour-bg-primary-on-light:#fff;--bpk-private-button-colour-bg-primary-on-light-pressed:#154679;--bpk-private-button-colour-bg-secondary:#e0e4e9;--bpk-private-button-colour-bg-secondary-pressed:#c1c7cf;--bpk-private-button-colour-bg-secondary-on-contrast:#e0e4e9;--bpk-private-button-colour-bg-secondary-on-contrast-pressed:#c1c7cf;--bpk-private-button-colour-bg-secondary-on-dark:#ffffff1a;--bpk-private-button-colour-bg-secondary-on-dark-disabled:#0b121d;--bpk-private-button-colour-bg-secondary-on-dark-pressed:#04182d;--bpk-private-button-colour-text-disruptive:#e70866;--bpk-private-button-colour-text-feature:#fff;--bpk-private-button-colour-text-footer:#fff0;--bpk-private-button-colour-text-link-on-dark:#fff;--bpk-private-button-colour-text-secondary:#161616;--bpk-private-button-dimension-radius:0.5rem;--bpk-private-button-dimension-min-height-default:2.25rem;--bpk-private-button-dimension-min-height-large:3rem;--bpk-private-button-dimension-min-weight-large:3rem;--bpk-private-button-dimension-padding-horizontal-default:1rem;--bpk-private-button-dimension-padding-horizontal-large:1rem;--bpk-private-button-typography-tmp-default-label:1rem;--bpk-private-card-button-contained-fill:#fffc;--bpk-private-carousel-trigger-bg-default:#ffffff80;--bpk-private-carousel-trigger-bg-default-hover:#fffc;--bpk-private-chip-group-filter-colour-bg-icon-hover-on-image:#eff3f8;--bpk-private-chip-group-filter-colour-bg-icon-off-on-image:#fff;--bpk-private-chip-group-filter-colour-bg-icon-on-default:#05203c;--bpk-private-chip-group-filter-colour-bg-icon-on-on-dark:#fff;--bpk-private-chip-group-filter-colour-bg-icon-on-on-image:#05203c;--bpk-private-chip-group-filter-colour-stroke-icon-hover-default:#05203c;--bpk-private-chip-group-filter-colour-stroke-icon-hover-on-dark:#fff;--bpk-private-chip-group-filter-colour-stroke-icon-off-default:#c1c7cf;--bpk-private-chip-group-filter-colour-stroke-icon-off-on-dark:#ffffff80;--bpk-private-chip-group-filter-dimensions-min-height:2.25rem;--bpk-private-chip-colour-bg-default-dismissible-hover:#05203c;--bpk-private-chip-colour-bg-default-on:#05203c;--bpk-private-chip-colour-bg-disabled:#e0e4e9;--bpk-private-chip-colour-bg-on-contrast-hover:#fff;--bpk-private-chip-colour-bg-on-contrast-on:#05203c;--bpk-private-chip-colour-bg-on-dark-dismissible-hover:#fff;--bpk-private-chip-colour-bg-on-dark-hover:#fff;--bpk-private-chip-colour-bg-on-dark-off:#fff0;--bpk-private-chip-colour-bg-on-dark-on:#fff;--bpk-private-chip-colour-bg-on-image-dismissible-hover:#05203c;--bpk-private-chip-colour-bg-on-image-on:#eff3f8;--bpk-private-chip-colour-border-default-dismissible-hover:#fff0;--bpk-private-chip-colour-border-default-hover:#05203c;--bpk-private-chip-colour-border-default-off:#c1c7cf;--bpk-private-chip-colour-border-on-contrast-off:#fff;--bpk-private-chip-colour-border-on-contrast-on:#05203c;--bpk-private-chip-colour-border-on-dark-disimissible-hover:#fff;--bpk-private-chip-colour-border-on-dark-hover:#fff;--bpk-private-chip-colour-border-on-dark-off:#ffffff80;--bpk-private-chip-colour-stroke-off-on-canvas-contrast-new:#fff0;--bpk-private-chip-colour-text-default-dismissible-hover:#fff;--bpk-private-chip-colour-text-dismissible-on-icon:#ffffff80;--bpk-private-chip-colour-text-on:#fff;--bpk-private-chip-colour-text-on-image:#fff;--bpk-private-chip-colour-text-on-image-dismissible-icon:#626971;--bpk-private-chip-colour-text-on-dark:#161616;--bpk-private-chip-colour-text-on-dark-dismisisble-hover:#161616;--bpk-private-chip-colour-text-on-dark-dismisisble-icon:#626971;--bpk-private-chip-dimension-min-height-width:2rem;--bpk-private-chip-dimension-radius:0.5rem;--bpk-private-date-selector-cheapest-month-highlight:#154679;--bpk-private-date-selector-flexible-date-card:#eff3f8;--bpk-private-dimension-padding-veritcal:0;--bpk-private-info-banner-default:#eff3f8;--bpk-private-info-banner-on-contrast:#fff;--bpk-private-map-cluster-pin:#05203c;--bpk-private-map-cluster-pin-previous-selection:#94c3ff;--bpk-private-map-marker-viewed:#fffc;--bpk-private-map-poi-pin:#8e47ba;--bpk-private-map-previous-selection:#cfe4ff;--bpk-private-navigation-tabs-hover:#154679;--bpk-private-navigation-tabs-outline:#fff3;--bpk-private-navigation-tabs-selected:#024daf;--bpk-private-rating-bar-default:#e0e4e9;--bpk-private-rating-bar-on-contrast:#fff;--bpk-private-segmented-control-canvas-default:#eff3f8;--bpk-private-segmented-control-surface-contrast:#ffffff1a;--bpk-private-segmented-control-surface-contrast-on:#024daf;--bpk-private-shadow-large-blur:0.875rem;--bpk-private-shadow-large-color:#16161640;--bpk-private-shadow-large-position-x:0;--bpk-private-shadow-large-position-y:0.25rem;--bpk-private-shadow-large-spread:0;--bpk-private-shadow-small-blur:0.1875rem;--bpk-private-shadow-small-color:#16161640;--bpk-private-shadow-small-position-x:0;--bpk-private-shadow-small-position-y:0.0625rem;--bpk-private-shadow-small-spread:0;--bpk-private-shadow-xl-blur:3.125rem;--bpk-private-shadow-xl-color:#16161640;--bpk-private-shadow-xl-position-x:0;--bpk-private-shadow-xl-position-y:0.75rem;--bpk-private-shadow-xl-spread:0;--bpk-private-skeleton-on-dark:#ffffff1a;--bpk-private-speech-bubble-colour-bg-contrast:#eff3f8;--bpk-private-speech-bubble-colour-bg-default:#fff;--bpk-private-trip-advisor:#00aa6c;--bpk-core-accent:#0062e3;--bpk-core-eco:#0fa1a9;--bpk-core-primary:#05203c;--bpk-other-line:#c1c7cf;--bpk-other-line-on-dark:#ffffff80;--bpk-other-overlay:#0003;--bpk-other-scrim:#000000b3;--bpk-other-shadow:#16161640;--bpk-status-danger-fill:#ffe9f9;--bpk-status-danger-spot:#e70866;--bpk-status-success-fill:#d4fff2;--bpk-status-success-spot:#0c838a;--bpk-status-warning-fill:#fff7cf;--bpk-status-warning-spot:#f55d42;--bpk-surface-contrast:#05203c;--bpk-surface-default:#fff;--bpk-surface-elevated:#fff;--bpk-surface-hero:#0062e3;--bpk-surface-highlight:#e0e4e9;--bpk-surface-low-contrast:#f7f9fb;--bpk-surface-subtle:#e3f0ff;--bpk-surface-tint:#ffffff1a;--bpk-surface-promo:#0062e3;--bpk-text-disabled:#0003;--bpk-text-disabled-on-dark:#ffffff80;--bpk-text-error:#e70866;--bpk-text-inverse:#fff;--bpk-text-on-dark:#fff;--bpk-text-on-light:#161616;--bpk-text-primary:#161616;--bpk-text-secondary:#626971;--bpk-text-success:#0c838a;--bpk-text-deprecated-link:#0062e3;--bpk-text-hero:#0062e3;--bpk-title:true;--bpk-typography-family-sans-serif:"Skyscanner Relative";--bpk-typography-family-serif:Larken;--bpk-typography-kerning-default:0;--bpk-typography-kerning-loose:0;--bpk-typography-kerning-tight:0;--bpk-typography-style-body:400;--bpk-typography-style-headline:700;--bpk-typography-style-hero:900;--bpk-typography-style-label:700;--bpk-typography-style-subhead:300}:root[data-theme=dark]{--bpk-canvas-contrast:#010913;--bpk-canvas-default:#010913;--bpk-private-badge-colour-bg-default:#243346;--bpk-private-badge-colour-bg-inverse:#243346;--bpk-private-badge-colour-bg-outline:#fff0;--bpk-private-badge-colour-bg-subtle:#243346;--bpk-private-badge-colour-stroke-outline:#fff;--bpk-private-badge-dimension-padding-horizontal-default:0.5rem;--bpk-private-badge-dimension-padding-horizontal-subtle:0.5rem;--bpk-private-badge-typography-tmp-badge-label:0.875rem;--bpk-private-badge-typography-tmp-badge-line-height:0;--bpk-private-button-colour-bg-destructive:#e0e4e9;--bpk-private-button-colour-bg-destructive-pressed:#ff649c;--bpk-private-button-colour-bg-disabled:#0b121d;--bpk-private-button-colour-bg-feature-pressed:#d1f7ff;--bpk-private-button-colour-bg-featured:#d1f7ff;--bpk-private-button-colour-bg-footer:#fff0;--bpk-private-button-colour-bg-footer-pressed:#fff0;--bpk-private-button-colour-bg-primary:#024daf;--bpk-private-button-colour-bg-primary-on-dark:#fff;--bpk-private-button-colour-bg-primary-on-dark-pressed:#c1c7cf;--bpk-private-button-colour-bg-primary-on-light:#fff;--bpk-private-button-colour-bg-primary-on-light-pressed:#002b4b;--bpk-private-button-colour-bg-secondary:#243346;--bpk-private-button-colour-bg-secondary-pressed:#010913;--bpk-private-button-colour-bg-secondary-on-contrast:#243346;--bpk-private-button-colour-bg-secondary-on-contrast-pressed:#010913;--bpk-private-button-colour-bg-secondary-on-dark:#ffffff1a;--bpk-private-button-colour-bg-secondary-on-dark-disabled:#0b121d;--bpk-private-button-colour-bg-secondary-on-dark-pressed:#fff3;--bpk-private-button-colour-text-disruptive:#ff649c;--bpk-private-button-colour-text-feature:#010913;--bpk-private-button-colour-text-footer:#fff0;--bpk-private-button-colour-text-link-on-dark:#fff;--bpk-private-button-colour-text-secondary:#fff;--bpk-private-button-dimension-radius:0.5rem;--bpk-private-button-dimension-min-height-default:2.25rem;--bpk-private-button-dimension-min-height-large:3rem;--bpk-private-button-dimension-min-weight-large:3rem;--bpk-private-button-dimension-padding-horizontal-default:1rem;--bpk-private-button-dimension-padding-horizontal-large:1rem;--bpk-private-button-typography-tmp-default-label:1rem;--bpk-private-card-button-contained-fill:#ffffff1a;--bpk-private-carousel-trigger-bg-default:#ffffff80;--bpk-private-carousel-trigger-bg-default-hover:#fffc;--bpk-private-chip-group-filter-colour-bg-icon-hover-on-image:#010913;--bpk-private-chip-group-filter-colour-bg-icon-off-on-image:#131d2b;--bpk-private-chip-group-filter-colour-bg-icon-on-default:#054184;--bpk-private-chip-group-filter-colour-bg-icon-on-on-dark:#131d2b;--bpk-private-chip-group-filter-colour-bg-icon-on-on-image:#054184;--bpk-private-chip-group-filter-colour-stroke-icon-hover-default:#054184;--bpk-private-chip-group-filter-colour-stroke-icon-hover-on-dark:#131d2b;--bpk-private-chip-group-filter-colour-stroke-icon-off-default:#fff3;--bpk-private-chip-group-filter-colour-stroke-icon-off-on-dark:#fff3;--bpk-private-chip-group-filter-dimensions-min-height:2.25rem;--bpk-private-chip-colour-bg-default-dismissible-hover:#054184;--bpk-private-chip-colour-bg-default-on:#054184;--bpk-private-chip-colour-bg-disabled:#0b121d;--bpk-private-chip-colour-bg-on-contrast-hover:#131d2b;--bpk-private-chip-colour-bg-on-contrast-on:#054184;--bpk-private-chip-colour-bg-on-dark-dismissible-hover:#131d2b;--bpk-private-chip-colour-bg-on-dark-hover:#fff0;--bpk-private-chip-colour-bg-on-dark-off:#fff0;--bpk-private-chip-colour-bg-on-dark-on:#131d2b;--bpk-private-chip-colour-bg-on-image-dismissible-hover:#054184;--bpk-private-chip-colour-bg-on-image-on:#010913;--bpk-private-chip-colour-border-default-dismissible-hover:#fff0;--bpk-private-chip-colour-border-default-hover:#054184;--bpk-private-chip-colour-border-default-off:#fff3;--bpk-private-chip-colour-border-on-contrast-off:#131d2b;--bpk-private-chip-colour-border-on-contrast-on:#131d2b;--bpk-private-chip-colour-border-on-dark-disimissible-hover:#131d2b;--bpk-private-chip-colour-border-on-dark-hover:#fff;--bpk-private-chip-colour-border-on-dark-off:#fff3;--bpk-private-chip-colour-stroke-off-on-canvas-contrast-new:#fff0;--bpk-private-chip-colour-text-default-dismissible-hover:#fff;--bpk-private-chip-colour-text-dismissible-on-icon:#ffffff80;--bpk-private-chip-colour-text-on:#fff;--bpk-private-chip-colour-text-on-image:#fff;--bpk-private-chip-colour-text-on-image-dismissible-icon:#bdc4cb;--bpk-private-chip-colour-text-on-dark:#fff;--bpk-private-chip-colour-text-on-dark-dismisisble-hover:#fff;--bpk-private-chip-colour-text-on-dark-dismisisble-icon:#bdc4cb;--bpk-private-chip-dimension-min-height-width:2rem;--bpk-private-chip-dimension-radius:0.5rem;--bpk-private-date-selector-cheapest-month-highlight:#fff;--bpk-private-date-selector-flexible-date-card:#243346;--bpk-private-dimension-padding-veritcal:0;--bpk-private-info-banner-default:#131d2b;--bpk-private-info-banner-on-contrast:#131d2b;--bpk-private-map-cluster-pin:#fff;--bpk-private-map-cluster-pin-previous-selection:#94c3ff;--bpk-private-map-marker-viewed:#000c;--bpk-private-map-poi-pin:#8e47ba;--bpk-private-map-previous-selection:#cfe4ff;--bpk-private-navigation-tabs-hover:#002b4b;--bpk-private-navigation-tabs-outline:#fff3;--bpk-private-navigation-tabs-selected:#054184;--bpk-private-rating-bar-default:#243346;--bpk-private-rating-bar-on-contrast:#243346;--bpk-private-segmented-control-canvas-default:#131d2b;--bpk-private-segmented-control-surface-contrast:#131d2b;--bpk-private-segmented-control-surface-contrast-on:#054184;--bpk-private-shadow-large-blur:0.875rem;--bpk-private-shadow-large-color:#16161640;--bpk-private-shadow-large-position-x:0;--bpk-private-shadow-large-position-y:0.25rem;--bpk-private-shadow-large-spread:0;--bpk-private-shadow-small-blur:0.1875rem;--bpk-private-shadow-small-color:#16161640;--bpk-private-shadow-small-position-x:0;--bpk-private-shadow-small-position-y:0.0625rem;--bpk-private-shadow-small-spread:0;--bpk-private-shadow-xl-blur:3.125rem;--bpk-private-shadow-xl-color:#16161640;--bpk-private-shadow-xl-position-x:0;--bpk-private-shadow-xl-position-y:0.75rem;--bpk-private-shadow-xl-spread:0;--bpk-private-skeleton-on-dark:#243346;--bpk-private-speech-bubble-colour-bg-contrast:#131d2b;--bpk-private-speech-bubble-colour-bg-default:#131d2b;--bpk-private-trip-advisor:#9ce6c0;--bpk-core-accent:#84e9ff;--bpk-core-eco:#0fa1a9;--bpk-core-primary:#054184;--bpk-other-line:#fff3;--bpk-other-line-on-dark:#fff3;--bpk-other-overlay:#fffc;--bpk-other-scrim:#000000b3;--bpk-other-shadow:#16161640;--bpk-status-danger-fill:#ffcadd;--bpk-status-danger-spot:#ff649c;--bpk-status-success-fill:#b1ffe7;--bpk-status-success-spot:#62f1c6;--bpk-status-warning-fill:#fbf1bb;--bpk-status-warning-spot:#feeb87;--bpk-surface-contrast:#010913;--bpk-surface-default:#131d2b;--bpk-surface-elevated:#243346;--bpk-surface-hero:#010913;--bpk-surface-highlight:#243346;--bpk-surface-low-contrast:#243346;--bpk-surface-subtle:#243346;--bpk-surface-tint:#ffffff1a;--bpk-surface-promo:#243346;--bpk-text-disabled:#fff3;--bpk-text-disabled-on-dark:#ffffff80;--bpk-text-error:#ff649c;--bpk-text-inverse:#010913;--bpk-text-on-dark:#fff;--bpk-text-on-light:#010913;--bpk-text-primary:#fff;--bpk-text-secondary:#bdc4cb;--bpk-text-success:#62f1c6;--bpk-text-deprecated-link:#84e9ff;--bpk-text-hero:#010913;--bpk-title:true;--bpk-typography-family-sans-serif:"Skyscanner Relative";--bpk-typography-family-serif:Larken;--bpk-typography-kerning-default:0;--bpk-typography-kerning-loose:0;--bpk-typography-kerning-tight:0;--bpk-typography-style-body:400;--bpk-typography-style-headline:700;--bpk-typography-style-hero:900;--bpk-typography-style-label:700;--bpk-typography-style-subhead:300}

package/bpk-stylesheets/index.js

@@ -17,6 +17,9 @@
  */
 
 import './index.scss';
+import './primitives.css';
+import './theme-backpack-light.css';
+import './theme-backpack-dark.css';
 
 (() => {
   if (typeof document === 'undefined') {

package/bpk-stylesheets/primitives.css

@@ -0,0 +1,40 @@
+/**
+ * Backpack - Skyscanner's Design System
+ * 
+ * Copyright 2016 Skyscanner Ltd
+ * 
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ * 
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ * 
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ * 
+ * Do not edit directly, this file was auto-generated.
+ */
+
+:root {
+  --bpk-radius-none: 0;
+  --bpk-radius-full: 6.25rem;
+  --bpk-radius-lg: 1.5rem;
+  --bpk-radius-md: 0.75rem;
+  --bpk-radius-nav-tabs: 1.125rem;
+  --bpk-radius-sm: 0.5rem;
+  --bpk-radius-xs: 0.25rem;
+  --bpk-spacing-base: 1rem;
+  --bpk-spacing-lg: 1.5rem;
+  --bpk-spacing-md: 0.5rem;
+  --bpk-spacing-none: 0;
+  --bpk-spacing-sm: 0.25rem;
+  --bpk-spacing-xl: 2rem;
+  --bpk-spacing-xs: 0.125rem;
+  --bpk-spacing-xxl: 2.5rem;
+  --bpk-spacing-xxs: 0.0625rem;
+  --bpk-spacing-xxxl: 4rem;
+  --bpk-spacing-xxxxl: 6rem;
+}