@charset "utf-8";

.rec-status { line-height: 1.571; }

.rec-status--labelled.rec-status--leading .rec-status__dot, .rec-status--labelled.rec-status--trailing .rec-status__dot { top: 0.82em; transform: translateY(-50%) scale(0.99999); }

.rec-status__label { vertical-align: middle; position: relative; color: rgb(var(--colour-text-and-icon-2, 72, 72, 72)); }

.rec-status__dot-wrapper { white-space: nowrap; }

.rec-status__dot { box-sizing: border-box; width: 0.4em; height: 0.4em; min-width: 0.75rem; min-height: 0.75rem; border-radius: 64px; flex-shrink: 0; position: relative; border-style: solid; border-width: max(2px, 0.066em); transform: scale(0.99999); display: inline-block; vertical-align: middle; border-color: currentcolor; forced-color-adjust: none; }

.rec-status--green .rec-status__dot { background-color: currentcolor; color: rgb(var(--colour-semantic-positive, 10, 138, 0)); }

.rec-status--orange .rec-status__dot { color: rgb(var(--colour-semantic-caution, 242, 106, 47)); }

.rec-status--orange .rec-status__dot::after { position: absolute; inset: 50% -1px -1px; content: ""; display: block; border-radius: 0px 0px 50% 50%; background-color: currentcolor; }

.rec-status--red .rec-status__dot { color: rgb(var(--colour-semantic-negative, 224, 7, 81)); }

.rec-status--grey .rec-status__dot { color: rgb(var(--colour-text-and-icon-4, 146, 146, 146)); }

.rec-status--grey .rec-status__dot::after { position: absolute; content: ""; width: max(2px, 0.066em); height: 130%; inset: 50% 0px 0px 50%; display: block; background-color: currentcolor; transform: translate(-50%, -50%) rotate(-45deg); }

.rec-status--small .rec-status__dot { min-width: 0.5rem; min-height: 0.5rem; width: 0.5rem; height: 0.5rem; transform: none; background-color: currentcolor; }

.rec-status--small .rec-status__dot::after { content: none; }

.rec-status--small .rec-status--trailing .rec-status__dot { margin-left: 0.5rem; order: 2; }

.rec-status--small .rec-status--inline .rec-status__dot { margin-left: 0.5rem; vertical-align: unset; }

.rec-status--small .rec-status--leading .rec-status__dot { margin-right: 0.5rem; }

.rec-status--trailing { display: flex; }

.rec-status--trailing .rec-status__dot { margin-left: max(0.5rem, 0.4em); order: 2; }

.rec-status--leading { display: flex; }

.rec-status--leading .rec-status__dot { margin-right: max(0.5rem, 0.4em); }

.rec-status--leading .rec-status__label { order: 2; }

.rec-status--inline .rec-status__dot { margin-left: max(0.5rem, 0.4em); }

[dir="rtl"] .rec-status--grey .rec-status__dot::after { right: auto; }

.rec-availability-message-sizing { margin-top: 0.5rem; }

.rec-status--small { font-size: 12px; }

button.rec-favorite-btn__container--selected { opacity: 1; }

button.rec-favorite-btn__container svg { fill: rgb(var(--colour-neutral-5, 146, 146, 146)); }

button.rec-favorite-btn__container:hover svg { fill: rgb(var(--colour-text-and-icon-2, 72, 72, 72)); }

div[data-recommendations-type="rec-add-to-cart"] .pip-product-compact, .rec-sheet-modal .pip-product-compact { display: flex; max-width: 100%; flex-flow: wrap; }

div[data-recommendations-type="rec-add-to-cart"] .rec-product-fragment-wrapper, .rec-sheet-modal .rec-product-fragment-wrapper { flex: 2 1 0%; cursor: pointer; padding-left: 1rem; padding-right: 1rem; }

div[data-recommendations-type="rec-add-to-cart"] .pip-product-compact, .rec-sheet-modal .pip-product-compact { margin-bottom: 1rem; }

div[data-recommendations-type="rec-add-to-cart"] .pip-compact-price-package, .rec-sheet-modal .pip-compact-price-package { margin-top: -0.25rem; }

div[data-recommendations-type="rec-add-to-cart"] .pip-price-module, .rec-sheet-modal .pip-price-module { margin-bottom: unset; }

div[data-recommendations-type="rec-add-to-cart"] .pip-compact-price-package:last-child, .rec-sheet-modal .pip-compact-price-package:last-child { margin-bottom: 0px; }

div[data-recommendations-type="rec-add-to-cart"] .pip-compact-price-package__additional-info, .rec-sheet-modal .pip-compact-price-package__additional-info { margin-top: 0px; }

div[data-recommendations-type="rec-add-to-cart"] .pip-product-compact__bottom-wrapper, .rec-sheet-modal .pip-product-compact__bottom-wrapper { display: flex; flex: 1 1 auto; align-items: center; justify-content: space-between; }

div[data-recommendations-type="rec-add-to-cart"] .pip-product-compact__image-link, .rec-sheet-modal .pip-product-compact__image-link { flex: 1 1 0%; place-self: center flex-start; max-width: 20%; }

div[data-recommendations-type="rec-add-to-cart"] .pip-product-compact__image-wrapper, .rec-sheet-modal .pip-product-compact__image-wrapper { width: 100%; }

div[data-recommendations-type="rec-add-to-cart"] .pip-btn.pip-btn--small.pip-btn--icon-emphasised.pip-product-compact__add-to-cart-button, .rec-sheet-modal .pip-btn.pip-btn--small.pip-btn--icon-emphasised.pip-product-compact__add-to-cart-button { height: 100%; align-self: center; }

@media (min-width: 56.25em) {
  div[data-recommendations-type="rec-add-to-cart"] .pip-btn.pip-btn--small.pip-btn--icon-emphasised.pip-product-compact__add-to-cart-button, .rec-sheet-modal .pip-btn.pip-btn--small.pip-btn--icon-emphasised.pip-product-compact__add-to-cart-button { bottom: 0px; }
}

.rec-product-fragment--no-bottom-padding.pip-product-compact { padding-bottom: 0px; }

.rec-product-fragment--no-bottom-padding .pip-compact-price-package:last-child { margin-bottom: 0px; }

.rec-product-fragment--no-bottom-padding .pip-compact-price-package__ratings-wrapper { margin-bottom: 0px; }

.rec-product-fragment--no-bottom-padding .pip-compact-price-package__price-wrapper { margin-bottom: 0px; }

.rec-minimal-compact-fragment .pip-header-section { margin: unset; }

.rec-minimal-compact-fragment .pip-header-section__container { display: unset; }

.rec-minimal-compact-fragment .pip-header-section__container-text { min-height: 4.5rem; }

.rec-minimal-compact-fragment .pip-header-section__description { display: grid !important; }

.rec-minimal-compact-fragment .pip-header-section__description-text, .rec-minimal-compact-fragment .pip-header-section__description-measurement { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.rec-minimal-compact-fragment .pip-compact-price-package__last-chance { min-height: 1.5rem; margin-bottom: unset; }

.rec-minimal-compact-fragment .pip-compact-price-package__product-highlights { min-height: 1.4rem; }

.rec-minimal-compact-fragment .pip-compact-price-package__previous-price-wrapper { min-height: 1rem; }

.rec-minimal-compact-fragment .pip-price--bti-price { margin-bottom: 1.05rem !important; }

.rec-minimal-compact-fragment .pip-price-module__addons { min-height: 1.1rem; margin-bottom: 0.5rem; }

.rec-minimal-compact-fragment .pip-price-module__energy-class { margin-top: -0.2rem; margin-bottom: 0.1rem; }

.rec-minimal-compact-fragment .pip-compact-price-package__ratings-wrapper { margin-top: 0px; }

@media screen and (max-width: 56.25em) {
  .rec-minimal-compact-fragment .pip-price-module__current-price { font-size: 1.45rem; }
  .rec-minimal-compact-fragment .pip-price-module__energy-class { margin-bottom: -0.6rem; }
  .rec-minimal-compact-fragment .pip-energy-symbol__compact { margin-left: 0px; }
  .rec-minimal-compact-fragment .pip-energy-symbol__compact img { height: 85%; }
}

@media screen and (max-width: 37.5em) {
  .rec-minimal-compact-fragment .pip-header-section__container-text { min-height: 5rem; }
}

.rec-bundle-fragment-qty-wrapper { display: flex; justify-content: space-between; margin-top: 0.5rem; }

.rec-bundle-fragment-qty-wrapper .rec-btn.rec-btn--small.rec-btn--icon-emphasised.pip-btn.pip-btn--small.pip-btn--icon-emphasised.pip-product-compact__add-to-cart-button { opacity: 0; transition: opacity 0.2s ease-in-out; }

.rec-bundle-fragment__wrapper:hover .rec-btn.rec-btn--small.rec-btn--icon-emphasised.pip-btn.pip-btn--small.pip-btn--icon-emphasised.pip-product-compact__add-to-cart-button { opacity: 1; }

.rec-product-identifier { display: inline-block; font-size: 0.75rem; }

.rec-product-identifier__label { display: block; margin-bottom: 0.5rem; color: rgb(var(--colour-text-and-icon-2, 72, 72, 72)); line-height: 1.5; }

.rec-product-identifier__value { display: inline-block; background-color: rgb(var(--colour-neutral-7, 17, 17, 17)); padding: calc(-1px + 0.25rem) calc(-1px + 0.75rem); border: 1px solid rgb(var(--colour-neutral-7, 17, 17, 17)); font-weight: 700; color: rgb(var(--colour-text-and-icon-5, 255, 255, 255)); line-height: 1.25; }

.rec-product-identifier--subtle .rec-product-identifier__value { color: rgb(var(--colour-text-and-icon-1, 17, 17, 17)); background-color: rgb(var(--colour-neutral-2, 245, 245, 245)); border-color: rgb(var(--colour-neutral-2, 245, 245, 245)); }

@media print {
  .rec-product-identifier__value { color: rgb(var(--colour-static-black, 17, 17, 17)); background-color: rgba(0, 0, 0, 0); border-color: rgb(var(--colour-static-black, 17, 17, 17)); }
}

.rec-alternative-fragment__container { display: flex; margin-bottom: 2.75rem; text-decoration: none; }

.rec-alternative-fragment__container:hover { text-decoration: none; }

.rec-alternative-fragment__container:hover:hover .rec-alternative-fragment__product-name { text-decoration: underline; }

.rec-alternative-fragment__img { height: 48px; width: 48px; margin-right: 1.2rem; }

.rec-alternative-fragment__product-name { font-weight: bold; }

.rec-alternative-fragment__product-desc { margin-bottom: 0.5rem; }

.rec-alternative-fragment__product-availability { display: flex; flex-direction: column; margin-left: auto; justify-content: center; }

.rec-alternative-fragment__product-availability .rec-price { align-self: flex-end; }

.rec-alternative-fragment__product-availability .rec-price.rec-alt-fragment__secondary-price { line-height: 0.9; font-size: 1rem; margin-top: 0.5rem; }

.rec-alternative-fragment__content { display: flex; flex-direction: column; }

.rec-alternative-fragment__chevron { height: 1.5rem; width: 1.5rem; margin-left: 0.5rem; align-self: center; }

.rec-skeleton { line-height: inherit; cursor: progress; background-color: rgb(var(--colour-neutral-3, 223, 223, 223)); background-image: linear-gradient(90deg, rgba(var(--colour-neutral-1, 255, 255, 255), 0) 40%, rgba(var(--colour-neutral-2, 245, 245, 245), 0.5) 50%, rgba(var(--colour-neutral-1, 255, 255, 255), 0) 60%); background-repeat: no-repeat; background-position: 100% 0px; background-size: 250% 100%; background-origin: border-box; border: 1px solid rgba(0, 0, 0, 0); box-sizing: border-box; animation: 2s ease 0s 20 normal none running rec-shine; display: block; }

.rec-skeleton--inline-block { display: inline-block; }

.rec-skeleton::after { content: "​"; }

[dir="rtl"] .rec-skeleton { animation-direction: reverse; }

@keyframes rec-shine { 
  100% { background-position: 0px 100%; }
}

.rec-compact-fragment-skeleton { max-width: 25rem; position: relative; padding-top: 3rem; }

.rec-compact-fragment-skeleton__image { height: 0px; padding-bottom: 100%; margin-bottom: 2.0625rem; background-color: rgb(var(--colour-neutral-2, 245, 245, 245)); }

.rec-compact-fragment-skeleton__product-info { height: 2.5rem; margin-bottom: 0.5rem; background-color: rgb(var(--colour-neutral-2, 245, 245, 245)); }

.rec-compact-fragment-skeleton__price-info { height: 1.25rem; margin-bottom: 0.5rem; background-color: rgb(var(--colour-neutral-2, 245, 245, 245)); }

.rec-compact-fragment-skeleton__variations-disclaimer { width: 100%; height: 1.25rem; margin-bottom: 1rem; background-color: rgb(var(--colour-neutral-2, 245, 245, 245)); }

@media (min-width: 37.5em) {
  .rec-compact-fragment-skeleton__variations-disclaimer { width: 75%; }
}

.rec-modal-fragment-skeleton { display: flex; position: relative; max-width: 25rem; border-bottom: 1px solid rgb(var(--colour-neutral-3, 223, 223, 223)); padding-top: 1rem; padding-bottom: 1rem; }

.rec-modal-fragment-skeleton__image { background-color: rgb(var(--colour-neutral-2, 245, 245, 245)); }

.rec-modal-fragment-skeleton__info-container { display: flex; flex: 1 1 auto; flex-direction: column; align-items: flex-start; margin-left: 1.25rem; margin-top: 0px; }

.rec-modal-fragment-skeleton__product-info { height: 50%; margin-bottom: 0.5rem; background-color: rgb(var(--colour-neutral-2, 245, 245, 245)); }

.rec-modal-fragment-skeleton__price-info { height: 25%; margin-bottom: 0.5rem; background-color: rgb(var(--colour-neutral-2, 245, 245, 245)); }

.rec-modal-fragment-skeleton__variations-disclaimer { width: 100%; height: 25%; background-color: rgb(var(--colour-neutral-2, 245, 245, 245)); }

@media (min-width: 37.5em) {
  .rec-modal-fragment-skeleton__variations-disclaimer { width: 75%; }
}

html[dir="rtl"] .rec-modal-fragment-skeleton__info-container { margin-left: unset; margin-right: 1.25rem; }

.rec-alternative-fragment-skeleton { display: flex; margin-bottom: 2.75rem; }

.rec-alternative-fragment-skeleton__image-wrapper { margin-right: 1.2rem; }

.rec-alternative-fragment-skeleton__content-wrapper { display: flex; flex-direction: column; }

.rec-alternative-fragment-skeleton__content-wrapper > :not(:last-child) { margin-bottom: 0.5rem; }

.rec-alternative-fragment-skeleton__chevron { height: 1.5rem; width: 1.5rem; margin-left: auto; align-self: center; }

.rec-vertical-bundle-fragment-skeleton { display: flex; min-height: 78px; margin-top: 0px; margin-bottom: 1rem; }

@media (min-width: 56.25em) {
  .rec-vertical-bundle-fragment-skeleton { min-height: 88px; margin-top: 1.25rem; margin-bottom: 1.25rem; }
}

.rec-vertical-bundle-fragment-skeleton__favorite { display: flex; margin: 0.5rem 0px 0.5rem auto; height: 24px; }

.rec-vertical-bundle-fragment-skeleton__image-wrapper { margin-right: 0.25rem; }

@media (min-width: 56.25em) {
  .rec-vertical-bundle-fragment-skeleton__image-wrapper { margin-right: 0.75rem; }
}

.rec-vertical-bundle-fragment-skeleton__content-wrapper { display: flex; flex: 1 1 0%; flex-direction: column; }

.rec-vertical-bundle-fragment-skeleton__content-wrapper > :not(:last-child) { margin-bottom: 0.5rem; }

.rec-vertical-bundle-fragment-skeleton__title { display: flex; justify-content: space-between; }

html[dir="rtl"] .rec-vertical-bundle-fragment-skeleton__favorite { margin: 0.5rem auto 0.5rem 0px; }

html[dir="rtl"] .rec-vertical-bundle-fragment-skeleton__image-wrapper { margin-right: unset; margin-left: 0.25rem; }

@media (min-width: 56.25em) {
  html[dir="rtl"] .rec-vertical-bundle-fragment-skeleton__image-wrapper { margin-left: 0.75rem; }
}

.rec-grid-fragment-skeleton__wrapper { position: relative; }

.rec-grid-fragment-skeleton__wrapper > div { padding: 1.5rem 1.25rem; border-color: rgb(var(--colour-neutral-3, 223, 223, 223)); border-style: solid; border-width: 0px 1px 1px 0px; }

@media (min-width: 37.5em) {
  .rec-grid-fragment-skeleton__wrapper > div { padding: 2rem 0px 3rem; margin: unset; border: unset; }
}

.rec-grid-fragment-skeleton__wrapper::after { position: absolute; right: 0px; bottom: 0px; left: 0px; height: 1px; content: ""; background-color: rgb(var(--colour-neutral-3, 223, 223, 223)); }

@media (min-width: 37.5em) {
  .rec-grid-fragment-skeleton__wrapper { padding-top: 3rem; }
  .rec-grid-fragment-skeleton__wrapper:nth-of-type(3n+2)::after, .rec-grid-fragment-skeleton__wrapper:nth-of-type(3n+3)::after { right: calc(var(--column-gap)*-1); left: calc(var(--column-gap)*-1); }
}

@media (min-width: 56.25em) {
  .rec-grid-fragment-skeleton__wrapper:nth-of-type(3n+2)::after, .rec-grid-fragment-skeleton__wrapper:nth-of-type(3n+3)::after { right: 0px; left: 0px; }
  .rec-grid-fragment-skeleton__wrapper:nth-of-type(4n+2)::after, .rec-grid-fragment-skeleton__wrapper:nth-of-type(4n+3)::after { right: calc(var(--column-gap)*-1); left: calc(var(--column-gap)*-1); }
}

.rec-carousel { position: relative; --focus-margin-start: 0rem; --focus-margin-end: 0rem; }

.rec-carousel:has(.rec-carousel-slide :focus-visible) { --focus-margin-start: .5rem; --focus-margin-end: .5rem; }

.rec-carousel .rec-skip-content__button { position: absolute; height: 1px; width: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); margin: -1px; white-space: nowrap; }

.rec-carousel .rec-skip-content__button:active, .rec-carousel .rec-skip-content__button:focus, .rec-carousel .rec-skip-content__button:focus-visible { width: auto; height: auto; overflow: visible; clip: auto; white-space: normal; z-index: 1; background: rgb(var(--colour-static-light-grey, 245, 245, 245)); color: rgb(var(--colour-static-black, 17, 17, 17)); border-radius: 64px; padding: 1rem 2rem; font-weight: bold; text-decoration: none; }

.rec-carousel .rec-skip-content__button:focus-visible { box-shadow: 0 0 0 4px var(--skapa-focus-ring-internal, rgb(var(--colour-neutral-1, 255, 255, 255))); outline: 2px solid var(--skapa-focus-ring-external, rgb(var(--colour-neutral-7, 17, 17, 17))); outline-offset: 4px; transition: outline 200ms ease-out, box-shadow 200ms ease-out; }

.rec-carousel__wrapper { position: relative; }

.rec-carousel__content { overflow: scroll hidden; position: relative; margin-left: calc(var(--overflow-start, var(--focus-margin-start))*-1); margin-right: calc(var(--overflow-end, var(--focus-margin-end))*-1); padding-left: var(--overflow-start, var(--focus-margin-start)); padding-right: var(--overflow-end, var(--focus-margin-end)); overscroll-behavior-x: contain; --padding-difference: calc(var(--carousel-vertical-padding, 0.5rem) - 0.5rem); --clamped-difference: max(min(0rem, var(--padding-difference)), -0.5rem); --calculated-additional-padding: calc(var(--clamped-difference)*-1); padding-top: calc(var(--carousel-vertical-padding, 0.5rem) + var(--calculated-additional-padding)); padding-bottom: calc(var(--carousel-vertical-padding, 0.5rem) + var(--calculated-additional-padding)); margin-top: var(--clamped-difference); margin-bottom: var(--clamped-difference); display: flex; flex-wrap: nowrap; gap: var(--carousel-item-gap, 1.25rem); }

.rec-carousel__content:focus-visible { box-shadow: 0 0 0 4px var(--skapa-focus-ring-internal, rgb(var(--colour-neutral-1, 255, 255, 255))); outline: 2px solid var(--skapa-focus-ring-external, rgb(var(--colour-neutral-7, 17, 17, 17))); outline-offset: 4px; transition: outline 200ms ease-out, box-shadow 200ms ease-out; }

.rec-carousel__content--single-slide { overflow: visible; }

.rec-carousel--has-scrollbar .rec-carousel__content { margin-bottom: 0px; }

.rec-carousel--dragging { cursor: grabbing; }

.rec-carousel .rec-btn.rec-carousel__button { position: absolute; }

.rec-carousel__button { top: 50%; visibility: hidden; opacity: 0; transition: opacity 200ms, visibility 200ms; cursor: pointer; z-index: 1; left: -1rem; transform: translateY(-50%); }

.rec-carousel:hover .rec-carousel__button { opacity: 1; visibility: visible; display: block; transition: opacity 200ms, visibility 200ms; }

.rec-carousel:hover .rec-carousel__button--hidden { display: none; opacity: 0; visibility: hidden; transition: opacity 200ms, visibility 200ms; }

.rec-carousel__button--right { left: auto; right: -1rem; }

.rec-carousel-slide { box-sizing: border-box; max-width: 100%; position: relative; flex-shrink: 0; }

.rec-carousel__scroll-indicator { display: none; }

.rec-carousel__slide-show { --focus-margin-start: 0rem !important; }

.rec-carousel__slide-show .rec-carousel__button { left: 2rem; display: none; }

.rec-carousel__slide-show .rec-carousel__button--right { right: 2rem; left: auto; }

.rec-carousel__slide-show .rec-carousel__content--snap-slide { scroll-snap-type: x mandatory; }

.rec-carousel__slide-show .rec-carousel__content--drag-slide { scroll-snap-type: none; }

.rec-carousel__slide-show .rec-carousel-slide { position: relative; margin-right: 0px; margin-left: 0px; scroll-snap-align: start; scroll-snap-stop: always; width: 100%; display: block; text-align: center; }

.rec-carousel__slide-show .rec-carousel-slide .rec-video-player { display: flex; justify-content: center; }

.rec-carousel__slide-show .rec-carousel-slide > :first-child { max-height: 75vh; max-width: 100%; display: inline-block; }

.rec-carousel__slide-show .rec-carousel-slide > :first-child img, .rec-carousel__slide-show .rec-carousel-slide > :first-child video { max-height: 75vh; max-width: 100%; width: auto; }

.rec-carousel--intersection-observer-disabled:hover .rec-carousel__button { display: none; }

.rec-carousel:not(.rec-carousel--intersection-observer-disabled) .rec-carousel__content { scrollbar-width: none; }

.rec-carousel:not(.rec-carousel--intersection-observer-disabled) .rec-carousel__content::-webkit-scrollbar { display: none; }

@media not all and (min-resolution: 0.001dpcm) {
  .rec-carousel__content { scroll-snap-type: x mandatory; }
}

@media (hover: none) {
  .rec-carousel:hover .rec-carousel__button { opacity: 0; display: none; }
}

.rec-carousel__counter--wrapper { display: flex; align-items: stretch; }

.rec-carousel__counter { display: flex; flex: 0 1 auto; justify-content: center; align-items: center; padding: 0px 0.5rem; font-size: 0.875rem; line-height: 1.571; font-weight: 700; margin-left: 0.5rem; white-space: nowrap; color: rgb(var(--colour-text-and-icon-1, 17, 17, 17)); }

@media (min-width: 37.5em) {
  .rec-carousel__button { left: -1.25rem; right: auto; }
  .rec-carousel__button--right { left: auto; right: -1.25rem; }
  .rec-carousel__counter { display: none; }
}

@media (min-width: 56.25em) {
  .rec-carousel__content { top: 0px; }
  .rec-carousel__wrapper { bottom: auto; width: 100%; }
  .rec-carousel__button, .rec-carousel__scroll-indicator { display: block; }
  .rec-carousel__slide-show .rec-carousel-slide, .rec-carousel__slide-show .rec-scroll-indicator { padding-left: 6.25rem; padding-right: 6.25rem; }
  .rec-carousel__slide-show .rec-carousel__button { display: block; }
}

@media (orientation: landscape) and (max-width: 56.25em) {
  .rec-carousel__slide-show .rec-carousel-slide > :first-child { max-height: 60vh; }
  .rec-carousel__slide-show .rec-carousel-slide > :first-child img, .rec-carousel__slide-show .rec-carousel-slide > :first-child video { max-height: 60vh; width: auto; }
}

[dir="rtl"] .rec-carousel__skip-button:active, [dir="rtl"] .rec-carousel__skip-button:focus-visible { left: auto; right: 1.5rem; }

[dir="rtl"] .rec-carousel__button { left: auto; right: -1.25rem; transform: translateY(-50%) scaleX(-1); }

[dir="rtl"] .rec-carousel__button--right { right: auto; left: -1.25rem; }

[dir="rtl"] .rec-carousel__slide-show .rec-carousel__button { right: 2rem; left: auto; }

[dir="rtl"] .rec-carousel__slide-show .rec-carousel__button--right { left: 2rem; right: auto; }

.rec-scroll-indicator { box-sizing: border-box; height: 1.875rem; position: relative; width: 100%; outline: none; border: 0px; padding: 0px; background: rgba(0, 0, 0, 0); display: flex; align-items: center; cursor: pointer; }

.rec-scroll-indicator--dragging .rec-scroll-indicator__bar-wrapper, .rec-scroll-indicator--dragging .rec-scroll-indicator__bar, .rec-scroll-indicator:hover .rec-scroll-indicator__bar-wrapper, .rec-scroll-indicator:hover .rec-scroll-indicator__bar { height: 0.25rem; }

.rec-scroll-indicator--dragging .rec-scroll-indicator__bar, .rec-scroll-indicator--dragging .rec-scroll-indicator__bar:hover { height: 0.5rem; top: -0.125rem; }

.rec-scroll-indicator__bar-wrapper { width: 100%; background: rgb(var(--colour-neutral-3, 223, 223, 223)); transform: translateX(0px); height: 0.125rem; display: block; border-radius: 4px; scrollbar-width: none; }

.rec-scroll-indicator__bar-wrapper::-webkit-scrollbar { display: none; }

.rec-scroll-indicator__bar { will-change: transform; background: rgb(var(--colour-neutral-7, 17, 17, 17)); position: absolute; top: 0px; bottom: 0px; width: 100%; height: 0.125rem; transform-origin: 0px 0px; display: block; border-radius: 4px; cursor: grab; }

.rec-scroll-indicator__bar::after { content: " "; position: absolute; inset: -0.625rem 0px; display: block; }

.rec-scroll-indicator__bar-dragging { cursor: grabbing; }

.rec-leading-icon .rec-svg-icon { margin-right: 0.5rem; vertical-align: top; }

.rec-leading-icon .rec-svg-icon--100 { margin-right: 0.25rem; }

.rec-trailing-icon .rec-svg-icon { margin-left: 0.5rem; vertical-align: top; }

.rec-trailing-icon .rec-svg-icon--100 { margin-left: 0.25rem; }

.rec-svg-icon { display: inline-block; height: 1.5rem; width: 1.5rem; vertical-align: middle; fill: currentcolor; transition-property: transform, fill; transition-duration: 250ms; transition-timing-function: cubic-bezier(0.4, 0, 0.4, 1); }

@media (prefers-reduced-motion) {
  .rec-svg-icon { transition-property: none; }
}

@keyframes rec-icon-rotate { 
  0% { transform: rotate(0deg); }
  100% { transform: rotate(359deg); }
}

.rec-svg-icon--rotate { animation: 1.5s linear 0s infinite normal none running rec-icon-rotate; }

.rec-svg-icon--rotate-45 { transform: rotate(45deg); }

.rec-svg-icon--rotate-minus-45 { transform: rotate(-45deg); }

.rec-svg-icon--rotate-135 { transform: rotate(135deg); }

.rec-svg-icon--rotate-minus-135 { transform: rotate(-135deg); }

.rec-svg-icon--rotate-180 { transform: rotate(180deg); }

.rec-svg-icon--rotate-minus-180 { transform: rotate(-180deg); }

[class*="rec-btn--icon"] .rec-btn__inner { padding: 0px 1rem; }

[class*="rec-btn--icon"] .rec-btn__inner .rec-btn__label { position: absolute; height: 1px; width: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); margin: -1px; white-space: nowrap; }

[class*="rec-btn--icon"].rec-btn--small .rec-btn__inner { padding: 0px 0.5rem; }

[class*="rec-btn--icon"].rec-btn--xsmall .rec-btn__inner { padding: 0px 0.25rem; min-height: 2rem; }

[class*="rec-btn--icon"].rec-btn--xsmall .rec-btn__inner::after { content: ""; position: absolute; inset: -0.375rem; }

.rec-btn { position: relative; font-size: 0.875rem; background: none; border: 0px; padding: 0px; line-height: 1.42857; font-weight: bold; text-align: center; display: inline-flex; border-radius: 64px; cursor: pointer; outline: 0px; vertical-align: top; --background: tokens.$colour-interactive-primary-bg-default; --background-hover: rgb(var(--colour-interactive-primary-bg-hover, 51, 51, 51)); --background-press: rgb(var(--colour-interactive-primary-bg-pressed, 0, 0, 0)); --foreground: rgb(var(--colour-text-and-icon-5, 255, 255, 255)); --disabled-foreground: rgb(var(--colour-interactive-disabled-2, 146, 146, 146)); --disabled-background: rgb(var(--colour-interactive-disabled-1, 204, 204, 204)); color: var(--foreground); text-decoration: none; }

.rec-btn .rec-btn__inner { box-shadow: var(--box-shadow); background: var(--background); }

.rec-btn:hover .rec-btn__inner { background: var(--background-hover); box-shadow: var(--box-shadow-hover); }

.rec-btn:active .rec-btn__inner { background: var(--background-press); box-shadow: var(--box-shadow-press); }

.rec-btn:hover, .rec-btn:active, .rec-btn:focus { text-decoration: none; color: var(--foreground); }

.rec-btn .rec-svg-icon { flex-shrink: 0; }

.rec-btn:disabled { cursor: default; }

.rec-btn:disabled .rec-btn__inner { background-color: var(--disabled-background); color: var(--disabled-foreground); box-shadow: none; }

.rec-btn__inner { border-radius: 64px; display: inline-flex; justify-content: center; align-items: center; min-height: 3.5rem; padding: 0px 2rem; width: 100%; box-sizing: border-box; transition-property: opacity, transform; transition-duration: 250ms; transition-timing-function: cubic-bezier(0.4, 0, 0.4, 1); }

.rec-btn:active:not(:disabled) .rec-btn__inner { transform: scale(0.97); }

.rec-leading-icon .rec-btn__inner { padding-left: 1.5rem; }

.rec-trailing-icon .rec-btn__inner { flex-direction: row-reverse; padding-right: 1.5rem; }

@media (forced-colors: active) {
  .rec-btn__inner { border: 1px solid rgba(0, 0, 0, 0); }
  .rec-btn:disabled .rec-btn__inner { color: graytext; border-color: graytext; }
}

.rec-btn--icon-primary, .rec-btn--primary { --background: rgb(var(--colour-interactive-primary-bg-default, 17, 17, 17)); --background-hover: rgb(var(--colour-interactive-primary-bg-hover, 51, 51, 51)); --background-press: rgb(var(--colour-interactive-primary-bg-pressed, 0, 0, 0)); }

.rec-btn--icon-emphasised, .rec-btn--emphasised { --background: rgb(var(--colour-interactive-emphasised-bg-default, 0, 88, 163)); --background-hover: rgb(var(--colour-interactive-emphasised-bg-hover, 0, 79, 147)); --background-press: rgb(var(--colour-interactive-emphasised-bg-hover, 0, 79, 147)); }

.rec-btn--icon-secondary, .rec-btn--secondary { --background: none; --background-hover: none; --box-shadow: inset 0 0 0 1px rgb(var(--colour-neutral-7, 17, 17, 17)); --box-shadow-hover: inset 0 0 0 2px rgb(var(--colour-neutral-7, 17, 17, 17)); --box-shadow-press: inset 0 0 0 2px rgb(var(--colour-neutral-7, 17, 17, 17)); --background-press: rgba(var(--colour-interactive-secondary-bg-pressed, 204, 204, 204), 0.5); }

.rec-btn--icon-emphasised-inverse, .rec-btn--emphasised-inverse, .rec-btn--icon-primary-inverse, .rec-btn--primary-inverse { --background: rgb(var(--colour-interactive-subtle-bg-default, 255, 255, 255)); --background-hover: rgb(var(--colour-interactive-subtle-bg-hover, 245, 245, 245)); --background-press: rgb(var(--colour-interactive-subtle-bg-pressed, 223, 223, 223)); }

.rec-btn--icon-secondary-inverse, .rec-btn--secondary-inverse { --background: transparent; --background-hover: transparent; --background-press: rgba(var(--colour-neutral-1, 255, 255, 255), 0.1); --box-shadow: inset 0 0 0 1px rgb(var(--colour-neutral-1, 255, 255, 255)); --box-shadow-hover: inset 0 0 0 2px rgb(var(--colour-neutral-1, 255, 255, 255)); --box-shadow-press: inset 0 0 0 2px rgb(var(--colour-neutral-1, 255, 255, 255)); }

.rec-btn--icon-tertiary-inverse, .rec-btn--tertiary-inverse { --background: transparent; --background-hover: rgba(var(--colour-neutral-1, 255, 255, 255), 0.15); --background-press: rgba(var(--colour-neutral-1, 255, 255, 255), 0.3); --disabled-background: transparent; --disabled-foreground: rgba(var(--colour-interactive-disabled-1, 204, 204, 204), .15); }

.rec-btn--danger { --background: rgb(var(--colour-interactive-destructive-bg-default, 224, 7, 81)); --background-hover: rgb(var(--colour-interactive-destructive-bg-hover, 204, 0, 61)); --background-press: rgb(var(--colour-interactive-destructive-bg-pressed, 184, 0, 41)); }

.rec-btn--icon-tertiary, .rec-btn--tertiary { --background: transparent; --background-hover: rgb(var(--colour-interactive-secondary-bg-hover, 223, 223, 223)); --background-press: rgb(var(--colour-interactive-secondary-bg-pressed, 204, 204, 204)); --disabled-background: transparent; --disabled-foreground: rgb(var(--colour-interactive-disabled-1, 204, 204, 204)); }

.rec-btn--icon-image-overlay, .rec-btn--image-overlay { --background: rgba(var(--colour-static-black, 17, 17, 17), 0.75); --background-hover: rgba(var(--colour-static-black, 17, 17, 17), 0.85); --background-press: rgba(var(--colour-static-black, 17, 17, 17), 0.95); }

.rec-btn.rec-btn--static-colour.rec-btn--primary, .rec-btn.rec-btn--static-colour.rec-btn--icon-primary { --background: rgb(var(--colour-interactive-static-primary-bg-default, 17, 17, 17)); --background-hover: rgb(var(--colour-interactive-static-primary-bg-hover, 51, 51, 51)); --background-press: rgb(var(--colour-interactive-static-primary-bg-pressed, 0, 0, 0)); --foreground: rgb(var(--colour-static-white, 255, 255, 255)); --disabled-foreground: rgba(var(--colour-static-black, 17, 17, 17), .15); --disabled-background: rgba(var(--colour-static-black, 17, 17, 17), .15); }

.rec-btn.rec-btn--static-colour.rec-btn--secondary, .rec-btn.rec-btn--static-colour.rec-btn--icon-secondary { --background: transparent; --background-hover: transparent; --background-press: rgba(var(--colour-interactive-static-secondary-bg-pressed, 204, 204, 204), 0.5); --box-shadow: inset 0 0 0 1px rgb(var(--colour-static-black, 17, 17, 17)); --box-shadow-hover: inset 0 0 0 2px rgb(var(--colour-static-black, 17, 17, 17)); --box-shadow-press: inset 0 0 0 2px rgb(var(--colour-static-black, 17, 17, 17)); --foreground: rgb(var(--colour-static-black, 17, 17, 17)); --disabled-foreground: rgba(var(--colour-static-black, 17, 17, 17), .15); --disabled-background: rgba(var(--colour-static-black, 17, 17, 17), .15); }

.rec-btn.rec-btn--static-colour.rec-btn--tertiary, .rec-btn.rec-btn--static-colour.rec-btn--icon-tertiary { --background: transparent; --background-hover: rgb(var(--colour-interactive-static-secondary-bg-hover, 223, 223, 223)); --background-press: rgb(var(--colour-interactive-static-secondary-bg-pressed, 204, 204, 204)); --foreground: rgb(var(--colour-static-black, 17, 17, 17)); --disabled-foreground: rgba(var(--colour-static-black, 17, 17, 17), .15); --disabled-background: transparent; }

.rec-btn.rec-btn--static-colour.rec-btn--icon-secondary-inverse, .rec-btn.rec-btn--static-colour.rec-btn--secondary-inverse { --background: transparent; --background-hover: transparent; --background-press: rgba(var(--colour-static-white, 255, 255, 255), 0.1); --box-shadow: inset 0 0 0 1px rgb(var(--colour-static-white, 255, 255, 255)); --box-shadow-hover: inset 0 0 0 2px rgb(var(--colour-static-white, 255, 255, 255)); --box-shadow-press: inset 0 0 0 2px rgb(var(--colour-static-white, 255, 255, 255)); --foreground: rgb(var(--colour-static-white, 255, 255, 255)); --disabled-foreground: rgba(var(--colour-static-white, 255, 255, 255), .15); --disabled-background: rgba(var(--colour-static-white, 255, 255, 255), .15); }

.rec-btn.rec-btn--static-colour.rec-btn--icon-emphasised-inverse, .rec-btn.rec-btn--static-colour.rec-btn--icon-primary-inverse, .rec-btn.rec-btn--static-colour.rec-btn--primary-inverse, .rec-btn.rec-btn--static-colour.rec-btn--emphasised-inverse { --background: rgb(var(--colour-static-white, 255, 255, 255)); --background-hover: rgb(var(--colour-static-light-grey, 245, 245, 245)); --background-press: rgb(var(--colour-static-grey, 223, 223, 223)); --foreground: rgb(var(--colour-static-black, 17, 17, 17)); --disabled-foreground: rgba(var(--colour-static-white, 255, 255, 255), .15); --disabled-background: rgba(var(--colour-static-white, 255, 255, 255), .15); }

.rec-btn.rec-btn--static-colour.rec-btn--icon-tertiary-inverse, .rec-btn.rec-btn--static-colour.rec-btn--tertiary-inverse { --background: transparent; --background-hover: rgba(var(--colour-static-white, 255, 255, 255), 0.15); --background-press: rgba(var(--colour-static-white, 255, 255, 255), 0.3); --foreground: rgb(var(--colour-static-white, 255, 255, 255)); --disabled-foreground: rgba(var(--colour-static-white, 255, 255, 255), .15); }

.rec-btn--icon-emphasised-inverse, .rec-btn--emphasised-inverse, .rec-btn--icon-primary-inverse, .rec-btn--primary-inverse, .rec-btn--icon-secondary, .rec-btn--secondary, .rec-btn--icon-tertiary, .rec-btn--tertiary { --foreground: rgb(var(--colour-text-and-icon-1, 17, 17, 17)); }

.rec-btn--icon-secondary-inverse, .rec-btn--secondary-inverse, .rec-btn--icon-tertiary-inverse, .rec-btn--tertiary-inverse, .rec-btn--icon-primary, .rec-btn--primary { --foreground: rgb(var(--colour-text-and-icon-5, 255, 255, 255)); }

.rec-btn--icon-image-overlay, .rec-btn--icon-emphasised, .rec-btn--danger, .rec-btn--emphasised, .rec-btn--image-overlay { --foreground: rgb(var(--colour-static-white, 255, 255, 255)); }

.rec-btn .rec-btn__loader { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -160%); display: inline-block; width: 0px; height: 0px; border: 0.25rem solid; border-radius: 64px; animation: 0.7s ease 0s infinite normal none running rec-btn-loader; opacity: 0; visibility: hidden; text-indent: -9999px; overflow: hidden; transition-property: opacity, transform; transition-duration: 250ms; transition-timing-function: cubic-bezier(0.4, 0, 0.4, 1); }

@keyframes rec-btn-loader { 
  0%, 100% { transform: translate(-50%, -160%); animation-timing-function: cubic-bezier(0.42, 0, 1, 1); }
  40% { transform: translate(-50%, 20%); animation-timing-function: cubic-bezier(0, 0, 0, 1); }
}

.rec-btn--loading { pointer-events: none; }

.rec-btn--loading .rec-btn__loader { opacity: 1; visibility: visible; }

.rec-btn--loading .rec-svg-icon, .rec-btn--loading .rec-btn__label { transform: translateY(50%); opacity: 0; visibility: hidden; }

.rec-btn--xsmall { font-size: 0.75rem; line-height: 1.33333; }

.rec-btn--xsmall .rec-btn__inner { min-height: 2rem; padding: 0px 1rem; }

.rec-btn--xsmall .rec-btn__inner::after { content: ""; position: absolute; inset: -0.375rem; }

.rec-btn--xsmall.rec-leading-icon .rec-btn__inner { padding-left: 0.75rem; }

.rec-btn--xsmall.rec-trailing-icon .rec-btn__inner { padding-right: 0.75rem; }

.rec-btn--xsmall.rec-leading-icon .rec-svg-icon { margin-right: 0.25rem; }

.rec-btn--xsmall.rec-trailing-icon .rec-svg-icon { margin-left: 0.25rem; }

.rec-btn--small { font-size: 0.75rem; line-height: 1.33333; }

.rec-btn--small .rec-btn__inner { min-height: 2.5rem; padding: 0px 1.5rem; }

.rec-btn--small .rec-btn__inner::after { content: ""; position: absolute; inset: -0.125rem; }

.rec-btn--small.rec-leading-icon .rec-btn__inner { padding-left: 1rem; }

.rec-btn--small.rec-trailing-icon .rec-btn__inner { padding-right: 1rem; }

.rec-btn--expanding.rec-leading-icon .rec-btn__inner, .rec-btn--expanding.rec-trailing-icon .rec-btn__inner, .rec-btn--expanding .rec-btn__inner { transition-property: opacity, transform, padding; padding: 0px 1rem; }

.rec-btn--expanding.rec-btn--small .rec-btn__inner { padding: 0px 0.5rem; }

.rec-btn--expanding.rec-btn--xsmall .rec-btn__icon { margin: 0px; }

.rec-btn--expanding.rec-btn--xsmall .rec-btn__inner { padding: 0px 0.25rem; min-height: 2rem; }

.rec-btn--expanding.rec-btn--xsmall .rec-btn__inner::after { content: ""; position: absolute; inset: -0.375rem; }

.rec-btn--expanding .rec-btn__icon { transition: margin-right 250ms ease-in-out; margin: 0px; }

.rec-btn--expanding .rec-btn__inner .rec-btn__label { max-width: 0px; white-space: nowrap; overflow: hidden; transition: max-width 250ms ease-in-out; transform-origin: left center; position: static; width: auto; height: auto; margin: 0px; clip: initial; }

.rec-btn--expanding:hover .rec-btn__inner .rec-btn__label, .rec-btn--expanding:focus-visible .rec-btn__inner .rec-btn__label { max-width: 12.5rem; }

.rec-btn--expanding:hover.rec-leading-icon .rec-btn__inner, .rec-btn--expanding:focus-visible.rec-leading-icon .rec-btn__inner { padding-right: 2rem; padding-left: 1.5rem; }

.rec-btn--expanding:hover.rec-trailing-icon .rec-btn__inner, .rec-btn--expanding:focus-visible.rec-trailing-icon .rec-btn__inner { flex-direction: row-reverse; padding-right: 1.5rem; padding-left: 2rem; }

.rec-btn--expanding:hover.rec-leading-icon .rec-btn__icon, .rec-btn--expanding:focus-visible.rec-leading-icon .rec-btn__icon { margin-right: 0.5rem; }

.rec-btn--expanding:hover.rec-trailing-icon .rec-btn__icon, .rec-btn--expanding:focus-visible.rec-trailing-icon .rec-btn__icon { margin-left: 0.5rem; }

.rec-btn--expanding:hover.rec-leading-icon.rec-btn--small .rec-btn__inner, .rec-btn--expanding:focus-visible.rec-leading-icon.rec-btn--small .rec-btn__inner { padding-right: 1.5rem; padding-left: 1rem; }

.rec-btn--expanding:hover.rec-trailing-icon.rec-btn--small .rec-btn__inner, .rec-btn--expanding:focus-visible.rec-trailing-icon.rec-btn--small .rec-btn__inner { padding-right: 1rem; padding-left: 1.5rem; }

.rec-btn--expanding:hover.rec-leading-icon.rec-btn--xsmall .rec-btn__inner, .rec-btn--expanding:focus-visible.rec-leading-icon.rec-btn--xsmall .rec-btn__inner { padding-right: 1rem; padding-left: 0.75rem; }

.rec-btn--expanding:hover.rec-trailing-icon.rec-btn--xsmall .rec-btn__inner, .rec-btn--expanding:focus-visible.rec-trailing-icon.rec-btn--xsmall .rec-btn__inner { padding-right: 0.75rem; padding-left: 1rem; }

.rec-btn--expanding:hover.rec-leading-icon.rec-btn--xsmall .rec-btn__icon, .rec-btn--expanding:focus-visible.rec-leading-icon.rec-btn--xsmall .rec-btn__icon { margin-right: 0.25rem; }

.rec-btn--expanding:hover.rec-trailing-icon.rec-btn--xsmall .rec-btn__icon, .rec-btn--expanding:focus-visible.rec-trailing-icon.rec-btn--xsmall .rec-btn__icon { margin-left: 0.25rem; }

@media (hover: none) {
  .rec-btn--expanding.rec-leading-icon:hover .rec-btn__inner, .rec-btn--expanding.rec-trailing-icon:hover .rec-btn__inner { padding: 0px 1rem; }
  .rec-btn--expanding.rec-leading-icon:hover .rec-btn__inner .rec-btn__label, .rec-btn--expanding.rec-trailing-icon:hover .rec-btn__inner .rec-btn__label { max-width: 0px; }
  .rec-btn--expanding.rec-leading-icon:hover .rec-btn__icon, .rec-btn--expanding.rec-trailing-icon:hover .rec-btn__icon { margin: 0px; }
  .rec-btn--expanding.rec-leading-icon.rec-btn--small:hover .rec-btn__inner, .rec-btn--expanding.rec-trailing-icon.rec-btn--small:hover .rec-btn__inner { padding: 0px 0.5rem; }
  .rec-btn--expanding.rec-leading-icon.rec-btn--xsmall:hover .rec-btn__inner, .rec-btn--expanding.rec-trailing-icon.rec-btn--xsmall:hover .rec-btn__inner { padding: 0px 0.25rem; }
  .rec-btn--expanding.rec-leading-icon.rec-btn--xsmall:hover .rec-btn__icon, .rec-btn--expanding.rec-trailing-icon.rec-btn--xsmall:hover .rec-btn__icon { margin: 0px; }
  .rec-btn--expanding.rec-btn--touch-device-expanded:hover:not(:disabled) .rec-btn__inner .rec-btn__label, .rec-btn--expanding.rec-btn--touch-device-expanded .rec-btn__inner .rec-btn__label { max-width: 12.5rem; }
  .rec-btn--expanding.rec-btn--touch-device-expanded:hover:not(:disabled).rec-leading-icon .rec-btn__inner, .rec-btn--expanding.rec-btn--touch-device-expanded.rec-leading-icon .rec-btn__inner { padding-right: 2rem; padding-left: 1.5rem; }
  .rec-btn--expanding.rec-btn--touch-device-expanded:hover:not(:disabled).rec-trailing-icon .rec-btn__inner, .rec-btn--expanding.rec-btn--touch-device-expanded.rec-trailing-icon .rec-btn__inner { flex-direction: row-reverse; padding-right: 1.5rem; padding-left: 2rem; }
  .rec-btn--expanding.rec-btn--touch-device-expanded:hover:not(:disabled).rec-leading-icon .rec-btn__icon, .rec-btn--expanding.rec-btn--touch-device-expanded.rec-leading-icon .rec-btn__icon { margin-right: 0.5rem; }
  .rec-btn--expanding.rec-btn--touch-device-expanded:hover:not(:disabled).rec-trailing-icon .rec-btn__icon, .rec-btn--expanding.rec-btn--touch-device-expanded.rec-trailing-icon .rec-btn__icon { margin-left: 0.5rem; }
  .rec-btn--expanding.rec-btn--touch-device-expanded:hover:not(:disabled).rec-leading-icon.rec-btn--small .rec-btn__inner, .rec-btn--expanding.rec-btn--touch-device-expanded.rec-leading-icon.rec-btn--small .rec-btn__inner { padding-right: 1.5rem; padding-left: 1rem; }
  .rec-btn--expanding.rec-btn--touch-device-expanded:hover:not(:disabled).rec-trailing-icon.rec-btn--small .rec-btn__inner, .rec-btn--expanding.rec-btn--touch-device-expanded.rec-trailing-icon.rec-btn--small .rec-btn__inner { padding-right: 1rem; padding-left: 1.5rem; }
  .rec-btn--expanding.rec-btn--touch-device-expanded:hover:not(:disabled).rec-leading-icon.rec-btn--xsmall .rec-btn__inner, .rec-btn--expanding.rec-btn--touch-device-expanded.rec-leading-icon.rec-btn--xsmall .rec-btn__inner { padding-right: 1rem; padding-left: 0.75rem; }
  .rec-btn--expanding.rec-btn--touch-device-expanded:hover:not(:disabled).rec-trailing-icon.rec-btn--xsmall .rec-btn__inner, .rec-btn--expanding.rec-btn--touch-device-expanded.rec-trailing-icon.rec-btn--xsmall .rec-btn__inner { padding-right: 0.75rem; padding-left: 1rem; }
  .rec-btn--expanding.rec-btn--touch-device-expanded:hover:not(:disabled).rec-leading-icon.rec-btn--xsmall .rec-btn__icon, .rec-btn--expanding.rec-btn--touch-device-expanded.rec-leading-icon.rec-btn--xsmall .rec-btn__icon { margin: 0px; }
  .rec-btn--expanding.rec-btn--touch-device-expanded:hover:not(:disabled).rec-trailing-icon.rec-btn--xsmall .rec-btn__icon, .rec-btn--expanding.rec-btn--touch-device-expanded.rec-trailing-icon.rec-btn--xsmall .rec-btn__icon { margin: 0px; }
}

.rec-btn--expanding:focus-visible.rec-btn--loading.rec-trailing-icon .rec-btn__inner, .rec-btn--expanding:focus-visible.rec-btn--loading.rec-leading-icon .rec-btn__inner, .rec-btn--expanding.rec-btn--loading.rec-trailing-icon .rec-btn__inner, .rec-btn--expanding.rec-btn--loading.rec-leading-icon .rec-btn__inner, .rec-btn--expanding:disabled.rec-trailing-icon .rec-btn__inner, .rec-btn--expanding:disabled.rec-leading-icon .rec-btn__inner { padding: 0px 1rem; }

.rec-btn--expanding:focus-visible.rec-btn--loading.rec-trailing-icon .rec-btn__inner .rec-btn__label, .rec-btn--expanding:focus-visible.rec-btn--loading.rec-leading-icon .rec-btn__inner .rec-btn__label, .rec-btn--expanding.rec-btn--loading.rec-trailing-icon .rec-btn__inner .rec-btn__label, .rec-btn--expanding.rec-btn--loading.rec-leading-icon .rec-btn__inner .rec-btn__label, .rec-btn--expanding:disabled.rec-trailing-icon .rec-btn__inner .rec-btn__label, .rec-btn--expanding:disabled.rec-leading-icon .rec-btn__inner .rec-btn__label { max-width: 0px; }

.rec-btn--expanding:focus-visible.rec-btn--loading.rec-trailing-icon .rec-btn__icon, .rec-btn--expanding:focus-visible.rec-btn--loading.rec-leading-icon .rec-btn__icon, .rec-btn--expanding.rec-btn--loading.rec-trailing-icon .rec-btn__icon, .rec-btn--expanding.rec-btn--loading.rec-leading-icon .rec-btn__icon, .rec-btn--expanding:disabled.rec-trailing-icon .rec-btn__icon, .rec-btn--expanding:disabled.rec-leading-icon .rec-btn__icon { margin: 0px; }

.rec-btn--expanding:focus-visible.rec-btn--loading.rec-trailing-icon.rec-btn--small .rec-btn__inner, .rec-btn--expanding:focus-visible.rec-btn--loading.rec-leading-icon.rec-btn--small .rec-btn__inner, .rec-btn--expanding.rec-btn--loading.rec-trailing-icon.rec-btn--small .rec-btn__inner, .rec-btn--expanding.rec-btn--loading.rec-leading-icon.rec-btn--small .rec-btn__inner, .rec-btn--expanding:disabled.rec-trailing-icon.rec-btn--small .rec-btn__inner, .rec-btn--expanding:disabled.rec-leading-icon.rec-btn--small .rec-btn__inner { padding: 0px 0.5rem; }

.rec-btn--expanding:focus-visible.rec-btn--loading.rec-trailing-icon.rec-btn--xsmall .rec-btn__inner, .rec-btn--expanding:focus-visible.rec-btn--loading.rec-leading-icon.rec-btn--xsmall .rec-btn__inner, .rec-btn--expanding.rec-btn--loading.rec-trailing-icon.rec-btn--xsmall .rec-btn__inner, .rec-btn--expanding.rec-btn--loading.rec-leading-icon.rec-btn--xsmall .rec-btn__inner, .rec-btn--expanding:disabled.rec-trailing-icon.rec-btn--xsmall .rec-btn__inner, .rec-btn--expanding:disabled.rec-leading-icon.rec-btn--xsmall .rec-btn__inner { padding: 0px 0.25rem; }

.rec-btn--expanding:focus-visible.rec-btn--loading.rec-trailing-icon.rec-btn--xsmall .rec-btn__icon, .rec-btn--expanding:focus-visible.rec-btn--loading.rec-leading-icon.rec-btn--xsmall .rec-btn__icon, .rec-btn--expanding.rec-btn--loading.rec-trailing-icon.rec-btn--xsmall .rec-btn__icon, .rec-btn--expanding.rec-btn--loading.rec-leading-icon.rec-btn--xsmall .rec-btn__icon, .rec-btn--expanding:disabled.rec-trailing-icon.rec-btn--xsmall .rec-btn__icon, .rec-btn--expanding:disabled.rec-leading-icon.rec-btn--xsmall .rec-btn__icon { margin: 0px; }

.rec-btn--fluid, .rec-btn--fluid .rec-btn__inner { width: 100%; }

.rec-btn--plain.rec-btn--small .rec-btn__inner::after, .rec-btn--plain .rec-btn__inner::after { content: ""; position: absolute; inset: -0.25rem; }

.rec-btn--plain { --background: transparent; --background-hover: transparent; --background-press: transparent; --foreground: rgb(var(--colour-text-and-icon-1, 17, 17, 17)); }

.rec-btn--plain.rec-btn--small .rec-btn__inner, .rec-btn--plain .rec-btn__inner, .rec-btn--plain.rec-leading-icon .rec-btn__inner, .rec-btn--plain.rec-trailing-icon .rec-btn__inner { padding: 0px; }

.rec-btn .rec-svg-icon, .rec-btn__label { transition-property: opacity, margin-right, margin-left, transform; transition-duration: 200ms; transition-timing-function: cubic-bezier(0.4, 0, 0.4, 1); }

.rec-btn:focus-visible, .rec-tabs__panel:focus-visible { box-shadow: 0 0 0 4px var(--skapa-focus-ring-internal, rgb(var(--colour-neutral-1, 255, 255, 255))); outline: 2px solid var(--skapa-focus-ring-external, rgb(var(--colour-neutral-7, 17, 17, 17))); outline-offset: 4px; transition: outline 200ms ease-out, box-shadow 200ms ease-out; }

.rec-btn[class*="inverse"]:focus-visible { box-shadow: 0 0 0 4px var(--skapa-focus-ring-internal, rgb(var(--colour-static-black, 17, 17, 17))); outline: 2px solid var(--skapa-focus-ring-external, rgb(var(--colour-static-white, 255, 255, 255))); outline-offset: 4px; transition: outline 200ms ease-out, box-shadow 200ms ease-out; }

.rec-btn[class*="image-overlay"]:focus-visible { box-shadow: 0 0 0 4px var(--skapa-focus-ring-internal, rgb(var(--colour-static-white, 255, 255, 255))); outline: 2px solid var(--skapa-focus-ring-external, rgb(var(--colour-static-black, 17, 17, 17))); outline-offset: 4px; transition: outline 200ms ease-out, box-shadow 200ms ease-out; }

.rec-chunky-header { display: flex; background: none; overflow: hidden; border: 0px; cursor: pointer; flex-direction: row; padding: 1.25rem 0px; width: 100%; justify-content: space-between; align-items: center; min-height: 5.625rem; color: rgb(var(--colour-text-and-icon-2, 72, 72, 72)); text-decoration: none; }

.rec-chunky-header:active, .rec-chunky-header:focus-visible, .rec-chunky-header:hover { color: rgb(var(--colour-text-and-icon-1, 17, 17, 17)); }

.rec-chunky-header:active .rec-chunky-header__title, .rec-chunky-header:focus-visible .rec-chunky-header__title, .rec-chunky-header:hover .rec-chunky-header__title { text-decoration: underline; }

.rec-chunky-header__icon { flex-shrink: 0; }

[dir="rtl"] .rec-chunky-header__icon { transform: scaleX(-1); }

.rec-chunky-header--small { padding: 0.25rem 0px; min-height: 3.75rem; }

.rec-chunky-header__title-wrapper { text-align: initial; flex-grow: 1; }

.rec-chunky-header__title-wrapper .rec-chunky-header__title { width: auto; }

.rec-chunky-header__title { color: rgb(var(--colour-text-and-icon-1, 17, 17, 17)); font-size: 0.875rem; line-height: 1.571; font-weight: 700; display: block; }

.rec-chunky-header__subtitle { color: rgb(var(--colour-text-and-icon-2, 72, 72, 72)); font-size: 0.875rem; line-height: 1.571; margin-bottom: 0px; }

.rec-chunky-header:disabled { cursor: default; }

.rec-chunky-header:disabled .rec-chunky-header__title { text-decoration: none; }

.rec-chunky-header:disabled .rec-chunky-header__title, .rec-chunky-header:disabled .rec-chunky-header__subtitle { color: rgb(var(--colour-interactive-disabled-1, 204, 204, 204)); }

.rec-chunky-header:disabled .rec-chunky-header__icon { color: rgb(var(--colour-interactive-disabled-1, 204, 204, 204)); }

.rec-chunky-header:focus-visible { box-shadow: 0 0 0 4px var(--skapa-focus-ring-internal, rgb(var(--colour-neutral-1, 255, 255, 255))); outline: 2px solid var(--skapa-focus-ring-external, rgb(var(--colour-neutral-7, 17, 17, 17))); outline-offset: 4px; transition: outline 200ms ease-out, box-shadow 200ms ease-out; }

.rec-teaser__title { margin-bottom: 0.5rem; color: rgb(var(--colour-text-and-icon-1, 17, 17, 17)); font-size: 1.125rem; line-height: 1.444; font-weight: 700; }

@media (min-width: 37.5em) {
  .rec-teaser__title { font-size: 1.5rem; line-height: 1.45; letter-spacing: -0.0042em; }
}

.rec-teaser .rec-teaser__top-button { display: none; }

.rec-teaser__bottom-button { border-bottom: 1px solid rgb(var(--colour-neutral-3, 223, 223, 223)); margin-top: 0.75rem; }

.rec-teaser__info-container { width: 100%; display: flex; justify-content: space-between; align-items: center; margin-bottom: 2rem; }

.rec-teaser__description { margin: 0px; }

@media (min-width: 56.25em) {
  .rec-teaser__info { margin-right: 1.25rem; flex-basis: 50%; }
  .rec-teaser__top-button { place-self: flex-end end; }
  .rec-teaser--stacked { border-bottom: 1px solid rgb(var(--colour-neutral-3, 223, 223, 223)); }
  .rec-teaser--stacked .rec-teaser__grid { display: grid; column-gap: 1.25rem; grid-template-columns: repeat(12, minmax(0px, 1fr)); }
  .rec-teaser--stacked .rec-teaser__info { margin-right: 0px; }
  .rec-teaser--stacked .rec-teaser__top-button { margin-top: 2rem; }
  .rec-teaser--left .rec-teaser__info-container { display: block; grid-column: 1 / span 4; width: initial; }
  .rec-teaser--left .rec-teaser__content { grid-area: 1 / 7 / auto / span 6; }
  .rec-teaser--right .rec-teaser__info-container { display: block; grid-column: 8 / span 4; width: initial; }
  .rec-teaser--right .rec-teaser__content { grid-area: 1 / 1 / auto / span 6; }
  .rec-teaser__bottom-button { display: none; }
  .rec-teaser .rec-teaser__top-button { display: inline-flex; flex-grow: 0; }
}

@media (min-width: 75em) {
  .rec-teaser__info { flex-basis: 41.6667%; }
}

.rec-carousel-slide { --item-count: 2.3; flex-basis: calc((100% - (var(--item-count) - 1)*1.25rem)/var(--item-count)); flex-shrink: 0; }

@media (min-width: 37.5em) {
  .rec-carousel-slide { --item-count: 3.4; flex-basis: calc((100% - (var(--item-count) - 1)*1.25rem)/var(--item-count)); flex-shrink: 0; }
}

@media (min-width: 56.25em) {
  .rec-carousel-slide { --item-count: 4.5; flex-basis: calc((100% - (var(--item-count) - 1)*1.25rem)/var(--item-count)); flex-shrink: 0; }
}

.rec-narrow-space-carousel .rec-carousel-slide { --item-count: 2.3; flex-basis: calc((100% - (var(--item-count) - 1)*1.25rem)/var(--item-count)); flex-shrink: 0; }

@media (min-width: 37.5em) {
  .rec-narrow-space-carousel .rec-carousel-slide { --item-count: 3.3; flex-basis: calc((100% - (var(--item-count) - 1)*1.25rem)/var(--item-count)); flex-shrink: 0; }
}

@media (min-width: 75em) {
  .rec-narrow-space-carousel .rec-carousel-slide { --item-count: 3.4; flex-basis: calc((100% - (var(--item-count) - 1)*1.25rem)/var(--item-count)); flex-shrink: 0; }
}

.rec-carousel__button { visibility: visible; opacity: unset; }

.rec-carousel__button--hidden { visibility: hidden; opacity: 0; }

.rec-carousel__title, .rec-teaser__title { margin: 0px; }

.rec-teaser__info { margin-right: 1.25rem; flex-basis: auto; }

[class*="rec-btn--icon"] .rec-btn__inner { padding: 0px 1rem; }

[class*="rec-btn--icon"] .rec-btn__inner .rec-btn__label { position: absolute; height: 1px; width: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); margin: -1px; white-space: nowrap; }

[class*="rec-btn--icon"].rec-btn--small .rec-btn__inner { padding: 0px 0.5rem; }

[class*="rec-btn--icon"].rec-btn--xsmall .rec-btn__inner { padding: 0px 0.25rem; min-height: 2rem; }

[class*="rec-btn--icon"].rec-btn--xsmall .rec-btn__inner::after { content: ""; position: absolute; inset: -0.375rem; }

.rec-btn { position: relative; font-size: 0.875rem; background: none; border: 0px; padding: 0px; line-height: 1.42857; font-weight: bold; text-align: center; display: inline-flex; border-radius: 64px; cursor: pointer; outline: 0px; vertical-align: top; --background: tokens.$colour-interactive-primary-bg-default; --background-hover: rgb(var(--colour-interactive-primary-bg-hover, 51, 51, 51)); --background-press: rgb(var(--colour-interactive-primary-bg-pressed, 0, 0, 0)); --foreground: rgb(var(--colour-text-and-icon-5, 255, 255, 255)); --disabled-foreground: rgb(var(--colour-interactive-disabled-2, 146, 146, 146)); --disabled-background: rgb(var(--colour-interactive-disabled-1, 204, 204, 204)); color: var(--foreground); text-decoration: none; }

.rec-btn .rec-btn__inner { box-shadow: var(--box-shadow); background: var(--background); }

.rec-btn:hover .rec-btn__inner { background: var(--background-hover); box-shadow: var(--box-shadow-hover); }

.rec-btn:active .rec-btn__inner { background: var(--background-press); box-shadow: var(--box-shadow-press); }

.rec-btn:hover, .rec-btn:active, .rec-btn:focus { text-decoration: none; color: var(--foreground); }

.rec-btn .rec-svg-icon { flex-shrink: 0; }

.rec-btn:disabled { cursor: default; }

.rec-btn:disabled .rec-btn__inner { background-color: var(--disabled-background); color: var(--disabled-foreground); box-shadow: none; }

.rec-btn__inner { border-radius: 64px; display: inline-flex; justify-content: center; align-items: center; min-height: 3.5rem; padding: 0px 2rem; width: 100%; box-sizing: border-box; transition-property: opacity, transform; transition-duration: 250ms; transition-timing-function: cubic-bezier(0.4, 0, 0.4, 1); }

.rec-btn:active:not(:disabled) .rec-btn__inner { transform: scale(0.97); }

.rec-leading-icon .rec-btn__inner { padding-left: 1.5rem; }

.rec-trailing-icon .rec-btn__inner { flex-direction: row-reverse; padding-right: 1.5rem; }

@media (forced-colors: active) {
  .rec-btn__inner { border: 1px solid rgba(0, 0, 0, 0); }
  .rec-btn:disabled .rec-btn__inner { color: graytext; border-color: graytext; }
}

.rec-btn--icon-primary, .rec-btn--primary { --background: rgb(var(--colour-interactive-primary-bg-default, 17, 17, 17)); --background-hover: rgb(var(--colour-interactive-primary-bg-hover, 51, 51, 51)); --background-press: rgb(var(--colour-interactive-primary-bg-pressed, 0, 0, 0)); }

.rec-btn--icon-emphasised, .rec-btn--emphasised { --background: rgb(var(--colour-interactive-emphasised-bg-default, 0, 88, 163)); --background-hover: rgb(var(--colour-interactive-emphasised-bg-hover, 0, 79, 147)); --background-press: rgb(var(--colour-interactive-emphasised-bg-hover, 0, 79, 147)); }

.rec-btn--icon-secondary, .rec-btn--secondary { --background: none; --background-hover: none; --box-shadow: inset 0 0 0 1px rgb(var(--colour-neutral-7, 17, 17, 17)); --box-shadow-hover: inset 0 0 0 2px rgb(var(--colour-neutral-7, 17, 17, 17)); --box-shadow-press: inset 0 0 0 2px rgb(var(--colour-neutral-7, 17, 17, 17)); --background-press: rgba(var(--colour-interactive-secondary-bg-pressed, 204, 204, 204), 0.5); }

.rec-btn--icon-emphasised-inverse, .rec-btn--emphasised-inverse, .rec-btn--icon-primary-inverse, .rec-btn--primary-inverse { --background: rgb(var(--colour-interactive-subtle-bg-default, 255, 255, 255)); --background-hover: rgb(var(--colour-interactive-subtle-bg-hover, 245, 245, 245)); --background-press: rgb(var(--colour-interactive-subtle-bg-pressed, 223, 223, 223)); }

.rec-btn--icon-secondary-inverse, .rec-btn--secondary-inverse { --background: transparent; --background-hover: transparent; --background-press: rgba(var(--colour-neutral-1, 255, 255, 255), 0.1); --box-shadow: inset 0 0 0 1px rgb(var(--colour-neutral-1, 255, 255, 255)); --box-shadow-hover: inset 0 0 0 2px rgb(var(--colour-neutral-1, 255, 255, 255)); --box-shadow-press: inset 0 0 0 2px rgb(var(--colour-neutral-1, 255, 255, 255)); }

.rec-btn--icon-tertiary-inverse, .rec-btn--tertiary-inverse { --background: transparent; --background-hover: rgba(var(--colour-neutral-1, 255, 255, 255), 0.15); --background-press: rgba(var(--colour-neutral-1, 255, 255, 255), 0.3); --disabled-background: transparent; --disabled-foreground: rgba(var(--colour-interactive-disabled-1, 204, 204, 204), .15); }

.rec-btn--danger { --background: rgb(var(--colour-interactive-destructive-bg-default, 224, 7, 81)); --background-hover: rgb(var(--colour-interactive-destructive-bg-hover, 204, 0, 61)); --background-press: rgb(var(--colour-interactive-destructive-bg-pressed, 184, 0, 41)); }

.rec-btn--icon-tertiary, .rec-btn--tertiary { --background: transparent; --background-hover: rgb(var(--colour-interactive-secondary-bg-hover, 223, 223, 223)); --background-press: rgb(var(--colour-interactive-secondary-bg-pressed, 204, 204, 204)); --disabled-background: transparent; --disabled-foreground: rgb(var(--colour-interactive-disabled-1, 204, 204, 204)); }

.rec-btn--icon-image-overlay, .rec-btn--image-overlay { --background: rgba(var(--colour-static-black, 17, 17, 17), 0.75); --background-hover: rgba(var(--colour-static-black, 17, 17, 17), 0.85); --background-press: rgba(var(--colour-static-black, 17, 17, 17), 0.95); }

.rec-btn.rec-btn--static-colour.rec-btn--primary, .rec-btn.rec-btn--static-colour.rec-btn--icon-primary { --background: rgb(var(--colour-interactive-static-primary-bg-default, 17, 17, 17)); --background-hover: rgb(var(--colour-interactive-static-primary-bg-hover, 51, 51, 51)); --background-press: rgb(var(--colour-interactive-static-primary-bg-pressed, 0, 0, 0)); --foreground: rgb(var(--colour-static-white, 255, 255, 255)); --disabled-foreground: rgba(var(--colour-static-black, 17, 17, 17), .15); --disabled-background: rgba(var(--colour-static-black, 17, 17, 17), .15); }

.rec-btn.rec-btn--static-colour.rec-btn--secondary, .rec-btn.rec-btn--static-colour.rec-btn--icon-secondary { --background: transparent; --background-hover: transparent; --background-press: rgba(var(--colour-interactive-static-secondary-bg-pressed, 204, 204, 204), 0.5); --box-shadow: inset 0 0 0 1px rgb(var(--colour-static-black, 17, 17, 17)); --box-shadow-hover: inset 0 0 0 2px rgb(var(--colour-static-black, 17, 17, 17)); --box-shadow-press: inset 0 0 0 2px rgb(var(--colour-static-black, 17, 17, 17)); --foreground: rgb(var(--colour-static-black, 17, 17, 17)); --disabled-foreground: rgba(var(--colour-static-black, 17, 17, 17), .15); --disabled-background: rgba(var(--colour-static-black, 17, 17, 17), .15); }

.rec-btn.rec-btn--static-colour.rec-btn--tertiary, .rec-btn.rec-btn--static-colour.rec-btn--icon-tertiary { --background: transparent; --background-hover: rgb(var(--colour-interactive-static-secondary-bg-hover, 223, 223, 223)); --background-press: rgb(var(--colour-interactive-static-secondary-bg-pressed, 204, 204, 204)); --foreground: rgb(var(--colour-static-black, 17, 17, 17)); --disabled-foreground: rgba(var(--colour-static-black, 17, 17, 17), .15); --disabled-background: transparent; }

.rec-btn.rec-btn--static-colour.rec-btn--icon-secondary-inverse, .rec-btn.rec-btn--static-colour.rec-btn--secondary-inverse { --background: transparent; --background-hover: transparent; --background-press: rgba(var(--colour-static-white, 255, 255, 255), 0.1); --box-shadow: inset 0 0 0 1px rgb(var(--colour-static-white, 255, 255, 255)); --box-shadow-hover: inset 0 0 0 2px rgb(var(--colour-static-white, 255, 255, 255)); --box-shadow-press: inset 0 0 0 2px rgb(var(--colour-static-white, 255, 255, 255)); --foreground: rgb(var(--colour-static-white, 255, 255, 255)); --disabled-foreground: rgba(var(--colour-static-white, 255, 255, 255), .15); --disabled-background: rgba(var(--colour-static-white, 255, 255, 255), .15); }

.rec-btn.rec-btn--static-colour.rec-btn--icon-emphasised-inverse, .rec-btn.rec-btn--static-colour.rec-btn--icon-primary-inverse, .rec-btn.rec-btn--static-colour.rec-btn--primary-inverse, .rec-btn.rec-btn--static-colour.rec-btn--emphasised-inverse { --background: rgb(var(--colour-static-white, 255, 255, 255)); --background-hover: rgb(var(--colour-static-light-grey, 245, 245, 245)); --background-press: rgb(var(--colour-static-grey, 223, 223, 223)); --foreground: rgb(var(--colour-static-black, 17, 17, 17)); --disabled-foreground: rgba(var(--colour-static-white, 255, 255, 255), .15); --disabled-background: rgba(var(--colour-static-white, 255, 255, 255), .15); }

.rec-btn.rec-btn--static-colour.rec-btn--icon-tertiary-inverse, .rec-btn.rec-btn--static-colour.rec-btn--tertiary-inverse { --background: transparent; --background-hover: rgba(var(--colour-static-white, 255, 255, 255), 0.15); --background-press: rgba(var(--colour-static-white, 255, 255, 255), 0.3); --foreground: rgb(var(--colour-static-white, 255, 255, 255)); --disabled-foreground: rgba(var(--colour-static-white, 255, 255, 255), .15); }

.rec-btn--icon-emphasised-inverse, .rec-btn--emphasised-inverse, .rec-btn--icon-primary-inverse, .rec-btn--primary-inverse, .rec-btn--icon-secondary, .rec-btn--secondary, .rec-btn--icon-tertiary, .rec-btn--tertiary { --foreground: rgb(var(--colour-text-and-icon-1, 17, 17, 17)); }

.rec-btn--icon-secondary-inverse, .rec-btn--secondary-inverse, .rec-btn--icon-tertiary-inverse, .rec-btn--tertiary-inverse, .rec-btn--icon-primary, .rec-btn--primary { --foreground: rgb(var(--colour-text-and-icon-5, 255, 255, 255)); }

.rec-btn--icon-image-overlay, .rec-btn--icon-emphasised, .rec-btn--danger, .rec-btn--emphasised, .rec-btn--image-overlay { --foreground: rgb(var(--colour-static-white, 255, 255, 255)); }

.rec-btn .rec-btn__loader { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -160%); display: inline-block; width: 0px; height: 0px; border: 0.25rem solid; border-radius: 64px; animation: 0.7s ease 0s infinite normal none running rec-btn-loader; opacity: 0; visibility: hidden; text-indent: -9999px; overflow: hidden; transition-property: opacity, transform; transition-duration: 250ms; transition-timing-function: cubic-bezier(0.4, 0, 0.4, 1); }

@keyframes rec-btn-loader { 
  0%, 100% { transform: translate(-50%, -160%); animation-timing-function: cubic-bezier(0.42, 0, 1, 1); }
  40% { transform: translate(-50%, 20%); animation-timing-function: cubic-bezier(0, 0, 0, 1); }
}

.rec-btn--loading { pointer-events: none; }

.rec-btn--loading .rec-btn__loader { opacity: 1; visibility: visible; }

.rec-btn--loading .rec-svg-icon, .rec-btn--loading .rec-btn__label { transform: translateY(50%); opacity: 0; visibility: hidden; }

.rec-btn--xsmall { font-size: 0.75rem; line-height: 1.33333; }

.rec-btn--xsmall .rec-btn__inner { min-height: 2rem; padding: 0px 1rem; }

.rec-btn--xsmall .rec-btn__inner::after { content: ""; position: absolute; inset: -0.375rem; }

.rec-btn--xsmall.rec-leading-icon .rec-btn__inner { padding-left: 0.75rem; }

.rec-btn--xsmall.rec-trailing-icon .rec-btn__inner { padding-right: 0.75rem; }

.rec-btn--xsmall.rec-leading-icon .rec-svg-icon { margin-right: 0.25rem; }

.rec-btn--xsmall.rec-trailing-icon .rec-svg-icon { margin-left: 0.25rem; }

.rec-btn--small { font-size: 0.75rem; line-height: 1.33333; }

.rec-btn--small .rec-btn__inner { min-height: 2.5rem; padding: 0px 1.5rem; }

.rec-btn--small .rec-btn__inner::after { content: ""; position: absolute; inset: -0.125rem; }

.rec-btn--small.rec-leading-icon .rec-btn__inner { padding-left: 1rem; }

.rec-btn--small.rec-trailing-icon .rec-btn__inner { padding-right: 1rem; }

.rec-btn--expanding.rec-leading-icon .rec-btn__inner, .rec-btn--expanding.rec-trailing-icon .rec-btn__inner, .rec-btn--expanding .rec-btn__inner { transition-property: opacity, transform, padding; padding: 0px 1rem; }

.rec-btn--expanding.rec-btn--small .rec-btn__inner { padding: 0px 0.5rem; }

.rec-btn--expanding.rec-btn--xsmall .rec-btn__icon { margin: 0px; }

.rec-btn--expanding.rec-btn--xsmall .rec-btn__inner { padding: 0px 0.25rem; min-height: 2rem; }

.rec-btn--expanding.rec-btn--xsmall .rec-btn__inner::after { content: ""; position: absolute; inset: -0.375rem; }

.rec-btn--expanding .rec-btn__icon { transition: margin-right 250ms ease-in-out; margin: 0px; }

.rec-btn--expanding .rec-btn__inner .rec-btn__label { max-width: 0px; white-space: nowrap; overflow: hidden; transition: max-width 250ms ease-in-out; transform-origin: left center; position: static; width: auto; height: auto; margin: 0px; clip: initial; }

.rec-btn--expanding:hover .rec-btn__inner .rec-btn__label, .rec-btn--expanding:focus-visible .rec-btn__inner .rec-btn__label { max-width: 12.5rem; }

.rec-btn--expanding:hover.rec-leading-icon .rec-btn__inner, .rec-btn--expanding:focus-visible.rec-leading-icon .rec-btn__inner { padding-right: 2rem; padding-left: 1.5rem; }

.rec-btn--expanding:hover.rec-trailing-icon .rec-btn__inner, .rec-btn--expanding:focus-visible.rec-trailing-icon .rec-btn__inner { flex-direction: row-reverse; padding-right: 1.5rem; padding-left: 2rem; }

.rec-btn--expanding:hover.rec-leading-icon .rec-btn__icon, .rec-btn--expanding:focus-visible.rec-leading-icon .rec-btn__icon { margin-right: 0.5rem; }

.rec-btn--expanding:hover.rec-trailing-icon .rec-btn__icon, .rec-btn--expanding:focus-visible.rec-trailing-icon .rec-btn__icon { margin-left: 0.5rem; }

.rec-btn--expanding:hover.rec-leading-icon.rec-btn--small .rec-btn__inner, .rec-btn--expanding:focus-visible.rec-leading-icon.rec-btn--small .rec-btn__inner { padding-right: 1.5rem; padding-left: 1rem; }

.rec-btn--expanding:hover.rec-trailing-icon.rec-btn--small .rec-btn__inner, .rec-btn--expanding:focus-visible.rec-trailing-icon.rec-btn--small .rec-btn__inner { padding-right: 1rem; padding-left: 1.5rem; }

.rec-btn--expanding:hover.rec-leading-icon.rec-btn--xsmall .rec-btn__inner, .rec-btn--expanding:focus-visible.rec-leading-icon.rec-btn--xsmall .rec-btn__inner { padding-right: 1rem; padding-left: 0.75rem; }

.rec-btn--expanding:hover.rec-trailing-icon.rec-btn--xsmall .rec-btn__inner, .rec-btn--expanding:focus-visible.rec-trailing-icon.rec-btn--xsmall .rec-btn__inner { padding-right: 0.75rem; padding-left: 1rem; }

.rec-btn--expanding:hover.rec-leading-icon.rec-btn--xsmall .rec-btn__icon, .rec-btn--expanding:focus-visible.rec-leading-icon.rec-btn--xsmall .rec-btn__icon { margin-right: 0.25rem; }

.rec-btn--expanding:hover.rec-trailing-icon.rec-btn--xsmall .rec-btn__icon, .rec-btn--expanding:focus-visible.rec-trailing-icon.rec-btn--xsmall .rec-btn__icon { margin-left: 0.25rem; }

@media (hover: none) {
  .rec-btn--expanding.rec-leading-icon:hover .rec-btn__inner, .rec-btn--expanding.rec-trailing-icon:hover .rec-btn__inner { padding: 0px 1rem; }
  .rec-btn--expanding.rec-leading-icon:hover .rec-btn__inner .rec-btn__label, .rec-btn--expanding.rec-trailing-icon:hover .rec-btn__inner .rec-btn__label { max-width: 0px; }
  .rec-btn--expanding.rec-leading-icon:hover .rec-btn__icon, .rec-btn--expanding.rec-trailing-icon:hover .rec-btn__icon { margin: 0px; }
  .rec-btn--expanding.rec-leading-icon.rec-btn--small:hover .rec-btn__inner, .rec-btn--expanding.rec-trailing-icon.rec-btn--small:hover .rec-btn__inner { padding: 0px 0.5rem; }
  .rec-btn--expanding.rec-leading-icon.rec-btn--xsmall:hover .rec-btn__inner, .rec-btn--expanding.rec-trailing-icon.rec-btn--xsmall:hover .rec-btn__inner { padding: 0px 0.25rem; }
  .rec-btn--expanding.rec-leading-icon.rec-btn--xsmall:hover .rec-btn__icon, .rec-btn--expanding.rec-trailing-icon.rec-btn--xsmall:hover .rec-btn__icon { margin: 0px; }
  .rec-btn--expanding.rec-btn--touch-device-expanded:hover:not(:disabled) .rec-btn__inner .rec-btn__label, .rec-btn--expanding.rec-btn--touch-device-expanded .rec-btn__inner .rec-btn__label { max-width: 12.5rem; }
  .rec-btn--expanding.rec-btn--touch-device-expanded:hover:not(:disabled).rec-leading-icon .rec-btn__inner, .rec-btn--expanding.rec-btn--touch-device-expanded.rec-leading-icon .rec-btn__inner { padding-right: 2rem; padding-left: 1.5rem; }
  .rec-btn--expanding.rec-btn--touch-device-expanded:hover:not(:disabled).rec-trailing-icon .rec-btn__inner, .rec-btn--expanding.rec-btn--touch-device-expanded.rec-trailing-icon .rec-btn__inner { flex-direction: row-reverse; padding-right: 1.5rem; padding-left: 2rem; }
  .rec-btn--expanding.rec-btn--touch-device-expanded:hover:not(:disabled).rec-leading-icon .rec-btn__icon, .rec-btn--expanding.rec-btn--touch-device-expanded.rec-leading-icon .rec-btn__icon { margin-right: 0.5rem; }
  .rec-btn--expanding.rec-btn--touch-device-expanded:hover:not(:disabled).rec-trailing-icon .rec-btn__icon, .rec-btn--expanding.rec-btn--touch-device-expanded.rec-trailing-icon .rec-btn__icon { margin-left: 0.5rem; }
  .rec-btn--expanding.rec-btn--touch-device-expanded:hover:not(:disabled).rec-leading-icon.rec-btn--small .rec-btn__inner, .rec-btn--expanding.rec-btn--touch-device-expanded.rec-leading-icon.rec-btn--small .rec-btn__inner { padding-right: 1.5rem; padding-left: 1rem; }
  .rec-btn--expanding.rec-btn--touch-device-expanded:hover:not(:disabled).rec-trailing-icon.rec-btn--small .rec-btn__inner, .rec-btn--expanding.rec-btn--touch-device-expanded.rec-trailing-icon.rec-btn--small .rec-btn__inner { padding-right: 1rem; padding-left: 1.5rem; }
  .rec-btn--expanding.rec-btn--touch-device-expanded:hover:not(:disabled).rec-leading-icon.rec-btn--xsmall .rec-btn__inner, .rec-btn--expanding.rec-btn--touch-device-expanded.rec-leading-icon.rec-btn--xsmall .rec-btn__inner { padding-right: 1rem; padding-left: 0.75rem; }
  .rec-btn--expanding.rec-btn--touch-device-expanded:hover:not(:disabled).rec-trailing-icon.rec-btn--xsmall .rec-btn__inner, .rec-btn--expanding.rec-btn--touch-device-expanded.rec-trailing-icon.rec-btn--xsmall .rec-btn__inner { padding-right: 0.75rem; padding-left: 1rem; }
  .rec-btn--expanding.rec-btn--touch-device-expanded:hover:not(:disabled).rec-leading-icon.rec-btn--xsmall .rec-btn__icon, .rec-btn--expanding.rec-btn--touch-device-expanded.rec-leading-icon.rec-btn--xsmall .rec-btn__icon { margin: 0px; }
  .rec-btn--expanding.rec-btn--touch-device-expanded:hover:not(:disabled).rec-trailing-icon.rec-btn--xsmall .rec-btn__icon, .rec-btn--expanding.rec-btn--touch-device-expanded.rec-trailing-icon.rec-btn--xsmall .rec-btn__icon { margin: 0px; }
}

.rec-btn--expanding:focus-visible.rec-btn--loading.rec-trailing-icon .rec-btn__inner, .rec-btn--expanding:focus-visible.rec-btn--loading.rec-leading-icon .rec-btn__inner, .rec-btn--expanding.rec-btn--loading.rec-trailing-icon .rec-btn__inner, .rec-btn--expanding.rec-btn--loading.rec-leading-icon .rec-btn__inner, .rec-btn--expanding:disabled.rec-trailing-icon .rec-btn__inner, .rec-btn--expanding:disabled.rec-leading-icon .rec-btn__inner { padding: 0px 1rem; }

.rec-btn--expanding:focus-visible.rec-btn--loading.rec-trailing-icon .rec-btn__inner .rec-btn__label, .rec-btn--expanding:focus-visible.rec-btn--loading.rec-leading-icon .rec-btn__inner .rec-btn__label, .rec-btn--expanding.rec-btn--loading.rec-trailing-icon .rec-btn__inner .rec-btn__label, .rec-btn--expanding.rec-btn--loading.rec-leading-icon .rec-btn__inner .rec-btn__label, .rec-btn--expanding:disabled.rec-trailing-icon .rec-btn__inner .rec-btn__label, .rec-btn--expanding:disabled.rec-leading-icon .rec-btn__inner .rec-btn__label { max-width: 0px; }

.rec-btn--expanding:focus-visible.rec-btn--loading.rec-trailing-icon .rec-btn__icon, .rec-btn--expanding:focus-visible.rec-btn--loading.rec-leading-icon .rec-btn__icon, .rec-btn--expanding.rec-btn--loading.rec-trailing-icon .rec-btn__icon, .rec-btn--expanding.rec-btn--loading.rec-leading-icon .rec-btn__icon, .rec-btn--expanding:disabled.rec-trailing-icon .rec-btn__icon, .rec-btn--expanding:disabled.rec-leading-icon .rec-btn__icon { margin: 0px; }

.rec-btn--expanding:focus-visible.rec-btn--loading.rec-trailing-icon.rec-btn--small .rec-btn__inner, .rec-btn--expanding:focus-visible.rec-btn--loading.rec-leading-icon.rec-btn--small .rec-btn__inner, .rec-btn--expanding.rec-btn--loading.rec-trailing-icon.rec-btn--small .rec-btn__inner, .rec-btn--expanding.rec-btn--loading.rec-leading-icon.rec-btn--small .rec-btn__inner, .rec-btn--expanding:disabled.rec-trailing-icon.rec-btn--small .rec-btn__inner, .rec-btn--expanding:disabled.rec-leading-icon.rec-btn--small .rec-btn__inner { padding: 0px 0.5rem; }

.rec-btn--expanding:focus-visible.rec-btn--loading.rec-trailing-icon.rec-btn--xsmall .rec-btn__inner, .rec-btn--expanding:focus-visible.rec-btn--loading.rec-leading-icon.rec-btn--xsmall .rec-btn__inner, .rec-btn--expanding.rec-btn--loading.rec-trailing-icon.rec-btn--xsmall .rec-btn__inner, .rec-btn--expanding.rec-btn--loading.rec-leading-icon.rec-btn--xsmall .rec-btn__inner, .rec-btn--expanding:disabled.rec-trailing-icon.rec-btn--xsmall .rec-btn__inner, .rec-btn--expanding:disabled.rec-leading-icon.rec-btn--xsmall .rec-btn__inner { padding: 0px 0.25rem; }

.rec-btn--expanding:focus-visible.rec-btn--loading.rec-trailing-icon.rec-btn--xsmall .rec-btn__icon, .rec-btn--expanding:focus-visible.rec-btn--loading.rec-leading-icon.rec-btn--xsmall .rec-btn__icon, .rec-btn--expanding.rec-btn--loading.rec-trailing-icon.rec-btn--xsmall .rec-btn__icon, .rec-btn--expanding.rec-btn--loading.rec-leading-icon.rec-btn--xsmall .rec-btn__icon, .rec-btn--expanding:disabled.rec-trailing-icon.rec-btn--xsmall .rec-btn__icon, .rec-btn--expanding:disabled.rec-leading-icon.rec-btn--xsmall .rec-btn__icon { margin: 0px; }

.rec-btn--fluid, .rec-btn--fluid .rec-btn__inner { width: 100%; }

.rec-btn--plain.rec-btn--small .rec-btn__inner::after, .rec-btn--plain .rec-btn__inner::after { content: ""; position: absolute; inset: -0.25rem; }

.rec-btn--plain { --background: transparent; --background-hover: transparent; --background-press: transparent; --foreground: rgb(var(--colour-text-and-icon-1, 17, 17, 17)); }

.rec-btn--plain.rec-btn--small .rec-btn__inner, .rec-btn--plain .rec-btn__inner, .rec-btn--plain.rec-leading-icon .rec-btn__inner, .rec-btn--plain.rec-trailing-icon .rec-btn__inner { padding: 0px; }

.rec-btn .rec-svg-icon, .rec-btn__label { transition-property: opacity, margin-right, margin-left, transform; transition-duration: 200ms; transition-timing-function: cubic-bezier(0.4, 0, 0.4, 1); }

.rec-validation-border { --skapa-validation-border-colour: rgb(var(--colour-interactive-subtle-border-default, 146, 146, 146)); --skapa-validation-border: 1px solid var(--skapa-validation-border-colour); --skapa-validation-border-default: var(--skapa-validation-border); --skapa-validation-border-focus-border: 2px solid rgb(var(--colour-interactive-emphasised-border-selected, 0, 88, 163)); position: absolute; inset: 0px; display: block; width: 100%; border: var(--skapa-validation-border-default, var(--skapa-validation-border-focus-border)); pointer-events: none; transition: box-shadow 100ms cubic-bezier(0.4, 0, 0.4, 1), border 100ms cubic-bezier(0.4, 0, 0.4, 1); border-radius: 4px; box-sizing: border-box; }

.rec-validation-border--warning { border-color: rgb(var(--colour-semantic-caution, 242, 106, 47)); }

.rec-validation-border--error { border-color: rgb(var(--colour-semantic-negative, 224, 7, 81)); }

.rec-validation-border--success { border-color: rgb(var(--colour-semantic-positive, 10, 138, 0)); }

.rec-validation-border--disabled { border-color: rgb(var(--colour-interactive-disabled-1, 204, 204, 204)); box-shadow: none; }

.rec-validation-border--read-only { --skapa-validation-border-default: transparent; border: var(--skapa-validation-border-default, var(--skapa-validation-border-focus-border)); }

@media (forced-colors: active) {
  .rec-validation-border { border-color: graytext; }
}

.rec-input-field__wrapper { box-sizing: border-box; position: relative; display: flex; width: 100%; align-items: center; background: rgb(var(--colour-neutral-1, 255, 255, 255)); border-radius: 4px; padding-right: 0.375rem; padding-left: 0.375rem; }

.rec-input-field__wrapper > * { padding-left: 0.125rem; padding-right: 0.125rem; }

.rec-input-field__prefix-label, .rec-input-field__suffix-label { z-index: 100; text-overflow: ellipsis; color: rgb(var(--colour-text-and-icon-3, 118, 118, 118)); opacity: 0; visibility: hidden; flex-shrink: 0; transition: opacity 100ms cubic-bezier(0.4, 0, 0.4, 1), visibility 100ms cubic-bezier(0.4, 0, 0.4, 1); position: absolute; height: 1px; width: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); margin: -1px; white-space: nowrap; font-size: 1rem; line-height: 1.5; }

.rec-input-field__prefix-label { order: 2; }

.rec-input-field__suffix-label { text-align: right; order: 4; }

.rec-input-field__payment-logo { order: 5; margin-right: 0.3125rem; margin-left: 0.3125rem; flex-shrink: 0; }

.rec-input-field input { flex-grow: 1; border: 0px; background: none; padding-top: 0px; padding-bottom: 0px; font-size: 1rem; line-height: 1.5; height: 3rem; overflow: hidden; order: 3; outline: none; border-radius: 4px; color: rgb(var(--colour-text-and-icon-1, 17, 17, 17)); min-width: 1ch; }

.rec-input-field input:-webkit-autofill { font-size: 1rem; line-height: 1.5; font-family: inherit; -webkit-text-fill-color: rgb(var(--colour-text-and-icon-1, 17, 17, 17)); box-shadow: 0 0 0 3rem rgb(var(--colour-neutral-1, 255, 255, 255)) inset; }

.rec-input-field input:focus ~ .rec-validation-border { --skapa-validation-border-default: initial; }

.rec-input-field input[type="hidden"] ~ .rec-validation-border, .rec-input-field input[type="hidden"] ~ .rec-input-field__leading-icon, .rec-input-field input[type="hidden"] ~ .rec-input-field__trailing-icon { display: none; }

.rec-input-field input[type="date"] { color: rgba(0, 0, 0, 0); }

.rec-input-field input[type="date"]:focus { color: rgb(var(--colour-text-and-icon-1, 17, 17, 17)); }

.rec-input-field input[type="date"]:disabled { color: rgb(var(--colour-interactive-disabled-1, 204, 204, 204)); }

.rec-input-field input[type="date"]::-webkit-inner-spin-button, .rec-input-field input[type="date"]::-webkit-calendar-picker-indicator, .rec-input-field input[type="date"]::-webkit-clear-button { display: none; appearance: none; }

.rec-input-field--labelled input[type="date"] { color: rgb(var(--colour-text-and-icon-1, 17, 17, 17)); }

.rec-input-field input:focus ~ .rec-input-field__prefix-label, .rec-input-field input:focus ~ .rec-input-field__suffix-label, .rec-input-field--labelled .rec-input-field__prefix-label, .rec-input-field--labelled .rec-input-field__suffix-label { opacity: 1; transition-delay: 33ms; visibility: visible; position: static; width: auto; height: auto; }

.rec-input-field .rec-btn { color: rgb(var(--colour-text-and-icon-1, 17, 17, 17)); }

.rec-input-field .rec-btn:disabled { pointer-events: none; color: rgb(var(--colour-interactive-disabled-1, 204, 204, 204)); }

.rec-input-field .rec-btn:disabled .rec-btn__inner { border: 0px; background: none; }

.rec-input-field__leading-icon { flex-shrink: 0; order: 1; }

.rec-input-field__trailing-icon { flex-shrink: 0; order: 5; }

.rec-input-field label { color: rgb(var(--colour-text-and-icon-2, 72, 72, 72)); }

.rec-input-field--disabled label, .rec-input-field--disabled input, .rec-input-field--disabled .rec-svg-icon, .rec-input-field--disabled .rec-input-field__suffix-label, .rec-input-field--disabled .rec-input-field__prefix-label { color: rgb(var(--colour-interactive-disabled-1, 204, 204, 204)); }

.rec-input-field--disabled .rec-input-field__payment-logo { opacity: 0.2; }

.rec-input-field--disabled input:-webkit-autofill { -webkit-text-fill-color: rgb(var(--colour-interactive-disabled-1, 204, 204, 204)); }

.rec-input-field--read-only .rec-input-field__wrapper { background-color: rgb(var(--colour-neutral-2, 245, 245, 245)); }

[dir="rtl"] .rec-input-field input[type="tel"] { direction: ltr; text-align: right; }

@media (forced-colors: active) {
  .rec-input-field--disabled label, .rec-input-field--disabled input, .rec-input-field--disabled .rec-svg-icon, .rec-input-field--disabled .rec-input-field__suffix-label, .rec-input-field--disabled .rec-input-field__prefix-label, .rec-input-field--read-only label, .rec-input-field--read-only input, .rec-input-field--read-only .rec-svg-icon, .rec-input-field--read-only .rec-input-field__suffix-label, .rec-input-field--read-only .rec-input-field__prefix-label { color: graytext; }
}

.rec-form-field { display: block; margin-bottom: 1.25rem; }

.rec-form-field__content { margin-top: 0.25rem; display: flex; flex-wrap: nowrap; justify-content: space-between; }

.rec-form-field--with-character-limit .rec-form-field__content > :not(:first-child) { padding-left: 0.5rem; }

.rec-form-field > .rec-checkbox, .rec-form-field > .rec-radiobutton, .rec-form-field fieldset { margin-bottom: 0.5rem; }

.rec-form-field legend { color: rgb(var(--colour-text-and-icon-1, 17, 17, 17)); }

.rec-helper-text { display: inline-flex; font-size: 0.75rem; line-height: 1.5; color: rgb(var(--colour-text-and-icon-3, 118, 118, 118)); }

.rec-helper-text__icon { height: 1.125rem; width: 1.125rem; margin-right: 0.25rem; vertical-align: bottom; flex: 0 0 auto; }

.rec-helper-text--character-count { font-feature-settings: "tnum"; font-variant-numeric: tabular-nums; }

.rec-helper-text--error { color: rgb(var(--colour-semantic-negative, 224, 7, 81)); }

.rec-helper-text--success { color: rgb(var(--colour-semantic-positive, 10, 138, 0)); }

.rec-helper-text--warning { color: rgb(var(--colour-semantic-caution-text, 202, 80, 8)); }

.rec-helper-text--text-only { margin-left: 0px; }

.rec-helper-text--text-only .rec-helper-text__icon { display: none; }

.rec-leading-icon .rec-svg-icon { margin-right: 0.5rem; vertical-align: top; }

.rec-leading-icon .rec-svg-icon--100 { margin-right: 0.25rem; }

.rec-trailing-icon .rec-svg-icon { margin-left: 0.5rem; vertical-align: top; }

.rec-trailing-icon .rec-svg-icon--100 { margin-left: 0.25rem; }

.rec-svg-icon { display: inline-block; height: 1.5rem; width: 1.5rem; vertical-align: middle; fill: currentcolor; transition-property: transform, fill; transition-duration: 250ms; transition-timing-function: cubic-bezier(0.4, 0, 0.4, 1); }

@media (prefers-reduced-motion) {
  .rec-svg-icon { transition-property: none; }
}

@keyframes rec-icon-rotate { 
  0% { transform: rotate(0deg); }
  100% { transform: rotate(359deg); }
}

.rec-svg-icon--rotate { animation: 1.5s linear 0s infinite normal none running rec-icon-rotate; }

.rec-svg-icon--rotate-45 { transform: rotate(45deg); }

.rec-svg-icon--rotate-minus-45 { transform: rotate(-45deg); }

.rec-svg-icon--rotate-135 { transform: rotate(135deg); }

.rec-svg-icon--rotate-minus-135 { transform: rotate(-135deg); }

.rec-svg-icon--rotate-180 { transform: rotate(180deg); }

.rec-svg-icon--rotate-minus-180 { transform: rotate(-180deg); }

.rec-label-wrapper > label { font-size: 0.875rem; line-height: 1.571; }

.rec-label-wrapper--text-input > label { display: block; margin: 0px 0px 0.125rem; }

.rec-label-wrapper .rec-required { color: rgb(var(--colour-semantic-negative, 224, 7, 81)); }

.rec-label-wrapper > label em { margin: 0px; color: rgb(var(--colour-text-and-icon-4, 146, 146, 146)); font-weight: 400; font-style: normal; }

.rec-validation-border { --skapa-validation-border-colour: rgb(var(--colour-interactive-subtle-border-default, 146, 146, 146)); --skapa-validation-border: 1px solid var(--skapa-validation-border-colour); --skapa-validation-border-default: var(--skapa-validation-border); --skapa-validation-border-focus-border: 2px solid rgb(var(--colour-interactive-emphasised-border-selected, 0, 88, 163)); position: absolute; inset: 0px; display: block; width: 100%; border: var(--skapa-validation-border-default, var(--skapa-validation-border-focus-border)); pointer-events: none; transition: box-shadow 100ms cubic-bezier(0.4, 0, 0.4, 1), border 100ms cubic-bezier(0.4, 0, 0.4, 1); border-radius: 4px; box-sizing: border-box; }

.rec-validation-border--warning { border-color: rgb(var(--colour-semantic-caution, 242, 106, 47)); }

.rec-validation-border--error { border-color: rgb(var(--colour-semantic-negative, 224, 7, 81)); }

.rec-validation-border--success { border-color: rgb(var(--colour-semantic-positive, 10, 138, 0)); }

.rec-validation-border--disabled { border-color: rgb(var(--colour-interactive-disabled-1, 204, 204, 204)); box-shadow: none; }

.rec-validation-border--read-only { --skapa-validation-border-default: transparent; border: var(--skapa-validation-border-default, var(--skapa-validation-border-focus-border)); }

@media (forced-colors: active) {
  .rec-validation-border { border-color: graytext; }
}

.rec-select { font-size: 1rem; line-height: 1.625; }

.rec-select__wrapper { position: relative; display: flex; width: 100%; align-items: center; }

.rec-select select { width: 100%; min-height: 3rem; border: 0px; padding: 0.75rem 3rem 0.75rem 0.5rem; font-size: 1rem; line-height: 1.5; overflow: hidden; background: rgb(var(--colour-neutral-1, 255, 255, 255)); outline: none; appearance: none; order: 2; color: rgb(var(--colour-text-and-icon-1, 17, 17, 17)); border-radius: 4px; white-space: normal; }

.rec-select select:disabled, .rec-select select:disabled ~ label, .rec-select select:disabled ~ .rec-svg-icon { color: rgb(var(--colour-interactive-disabled-1, 204, 204, 204)); }

.rec-select select:focus ~ .rec-validation-border { --skapa-validation-border-default: initial; }

.rec-select label, .rec-select optgroup { color: rgb(var(--colour-text-and-icon-2, 72, 72, 72)); }

.rec-select__chevron-down { right: 0.5rem; top: 50%; transform: translateY(-50%); }

[dir="rtl"] .rec-select__chevron-down { left: 0.5rem; right: auto; }

.rec-select__chevron-down { position: absolute; bottom: 0.25rem; }

.rec-select label, .rec-select .rec-svg-icon { pointer-events: none; }

.rec-select__icon { flex-shrink: 0; order: 1; }

.rec-select--hint select { color: rgb(var(--colour-text-and-icon-3, 118, 118, 118)); }

.rec-select--leading-icon select { padding-left: 2.25rem; }

.rec-select--leading-icon .rec-select__icon { margin-left: 0.5rem; position: absolute; }

.rec-select--disabled label { color: rgb(var(--colour-interactive-disabled-1, 204, 204, 204)); }

@media (forced-colors: active) {
  .rec-select--disabled label { color: graytext; }
}

.rec-developer-panel__container { position: fixed; top: 0px; left: 0px; right: 0px; display: flex; justify-content: space-between; padding: 0.5rem 0.5rem 1rem; border-bottom: 1px solid rgb(var(--colour-neutral-3, 223, 223, 223)); background-color: rgb(var(--colour-static-white, 255, 255, 255)); z-index: 99; }

.rec-developer-panel__input { display: inline-block; }

@media (min-width: 37.5em) {
  .rec-developer-panel__input { padding: 1rem; }
}

.rec-developer-panel__input .rec-select__wrapper > select { border: 1px solid rgb(var(--colour-neutral-5, 146, 146, 146)); }

.rec-developer-panel__btn { padding: 0.2rem; }

@media (min-width: 37.5em) {
  .rec-developer-panel__btn { padding: 0.5rem; }
}

.rec-developer-panel__product-thumbnail { display: inline-flex; align-items: center; border: 1px solid rgb(var(--colour-neutral-4, 204, 204, 204)); border-radius: 4px; padding: 10px 15px; }

.rec-developer-panel__product-thumbnail:hover { border-color: rgb(var(--colour-neutral-7, 17, 17, 17)); }

.rec-developer-panel__product-thumbnail > img { margin-right: 10px; height: 30px; }

[class*="rec-btn--icon"] .rec-btn__inner { padding: 0px 1rem; }

[class*="rec-btn--icon"] .rec-btn__inner .rec-btn__label { position: absolute; height: 1px; width: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); margin: -1px; white-space: nowrap; }

[class*="rec-btn--icon"].rec-btn--small .rec-btn__inner { padding: 0px 0.5rem; }

[class*="rec-btn--icon"].rec-btn--xsmall .rec-btn__inner { padding: 0px 0.25rem; min-height: 2rem; }

[class*="rec-btn--icon"].rec-btn--xsmall .rec-btn__inner::after { content: ""; position: absolute; inset: -0.375rem; }

.rec-btn { position: relative; font-size: 0.875rem; background: none; border: 0px; padding: 0px; line-height: 1.42857; font-weight: bold; text-align: center; display: inline-flex; border-radius: 64px; cursor: pointer; outline: 0px; vertical-align: top; --background: tokens.$colour-interactive-primary-bg-default; --background-hover: rgb(var(--colour-interactive-primary-bg-hover, 51, 51, 51)); --background-press: rgb(var(--colour-interactive-primary-bg-pressed, 0, 0, 0)); --foreground: rgb(var(--colour-text-and-icon-5, 255, 255, 255)); --disabled-foreground: rgb(var(--colour-interactive-disabled-2, 146, 146, 146)); --disabled-background: rgb(var(--colour-interactive-disabled-1, 204, 204, 204)); color: var(--foreground); text-decoration: none; }

.rec-btn .rec-btn__inner { box-shadow: var(--box-shadow); background: var(--background); }

.rec-btn:hover .rec-btn__inner { background: var(--background-hover); box-shadow: var(--box-shadow-hover); }

.rec-btn:active .rec-btn__inner { background: var(--background-press); box-shadow: var(--box-shadow-press); }

.rec-btn:hover, .rec-btn:active, .rec-btn:focus { text-decoration: none; color: var(--foreground); }

.rec-btn .rec-svg-icon { flex-shrink: 0; }

.rec-btn:disabled { cursor: default; }

.rec-btn:disabled .rec-btn__inner { background-color: var(--disabled-background); color: var(--disabled-foreground); box-shadow: none; }

.rec-btn__inner { border-radius: 64px; display: inline-flex; justify-content: center; align-items: center; min-height: 3.5rem; padding: 0px 2rem; width: 100%; box-sizing: border-box; transition-property: opacity, transform; transition-duration: 250ms; transition-timing-function: cubic-bezier(0.4, 0, 0.4, 1); }

.rec-btn:active:not(:disabled) .rec-btn__inner { transform: scale(0.97); }

.rec-leading-icon .rec-btn__inner { padding-left: 1.5rem; }

.rec-trailing-icon .rec-btn__inner { flex-direction: row-reverse; padding-right: 1.5rem; }

@media (forced-colors: active) {
  .rec-btn__inner { border: 1px solid rgba(0, 0, 0, 0); }
  .rec-btn:disabled .rec-btn__inner { color: graytext; border-color: graytext; }
}

.rec-btn--icon-primary, .rec-btn--primary { --background: rgb(var(--colour-interactive-primary-bg-default, 17, 17, 17)); --background-hover: rgb(var(--colour-interactive-primary-bg-hover, 51, 51, 51)); --background-press: rgb(var(--colour-interactive-primary-bg-pressed, 0, 0, 0)); }

.rec-btn--icon-emphasised, .rec-btn--emphasised { --background: rgb(var(--colour-interactive-emphasised-bg-default, 0, 88, 163)); --background-hover: rgb(var(--colour-interactive-emphasised-bg-hover, 0, 79, 147)); --background-press: rgb(var(--colour-interactive-emphasised-bg-hover, 0, 79, 147)); }

.rec-btn--icon-secondary, .rec-btn--secondary { --background: none; --background-hover: none; --box-shadow: inset 0 0 0 1px rgb(var(--colour-neutral-7, 17, 17, 17)); --box-shadow-hover: inset 0 0 0 2px rgb(var(--colour-neutral-7, 17, 17, 17)); --box-shadow-press: inset 0 0 0 2px rgb(var(--colour-neutral-7, 17, 17, 17)); --background-press: rgba(var(--colour-interactive-secondary-bg-pressed, 204, 204, 204), 0.5); }

.rec-btn--icon-emphasised-inverse, .rec-btn--emphasised-inverse, .rec-btn--icon-primary-inverse, .rec-btn--primary-inverse { --background: rgb(var(--colour-interactive-subtle-bg-default, 255, 255, 255)); --background-hover: rgb(var(--colour-interactive-subtle-bg-hover, 245, 245, 245)); --background-press: rgb(var(--colour-interactive-subtle-bg-pressed, 223, 223, 223)); }

.rec-btn--icon-secondary-inverse, .rec-btn--secondary-inverse { --background: transparent; --background-hover: transparent; --background-press: rgba(var(--colour-neutral-1, 255, 255, 255), 0.1); --box-shadow: inset 0 0 0 1px rgb(var(--colour-neutral-1, 255, 255, 255)); --box-shadow-hover: inset 0 0 0 2px rgb(var(--colour-neutral-1, 255, 255, 255)); --box-shadow-press: inset 0 0 0 2px rgb(var(--colour-neutral-1, 255, 255, 255)); }

.rec-btn--icon-tertiary-inverse, .rec-btn--tertiary-inverse { --background: transparent; --background-hover: rgba(var(--colour-neutral-1, 255, 255, 255), 0.15); --background-press: rgba(var(--colour-neutral-1, 255, 255, 255), 0.3); --disabled-background: transparent; --disabled-foreground: rgba(var(--colour-interactive-disabled-1, 204, 204, 204), .15); }

.rec-btn--danger { --background: rgb(var(--colour-interactive-destructive-bg-default, 224, 7, 81)); --background-hover: rgb(var(--colour-interactive-destructive-bg-hover, 204, 0, 61)); --background-press: rgb(var(--colour-interactive-destructive-bg-pressed, 184, 0, 41)); }

.rec-btn--icon-tertiary, .rec-btn--tertiary { --background: transparent; --background-hover: rgb(var(--colour-interactive-secondary-bg-hover, 223, 223, 223)); --background-press: rgb(var(--colour-interactive-secondary-bg-pressed, 204, 204, 204)); --disabled-background: transparent; --disabled-foreground: rgb(var(--colour-interactive-disabled-1, 204, 204, 204)); }

.rec-btn--icon-image-overlay, .rec-btn--image-overlay { --background: rgba(var(--colour-static-black, 17, 17, 17), 0.75); --background-hover: rgba(var(--colour-static-black, 17, 17, 17), 0.85); --background-press: rgba(var(--colour-static-black, 17, 17, 17), 0.95); }

.rec-btn.rec-btn--static-colour.rec-btn--primary, .rec-btn.rec-btn--static-colour.rec-btn--icon-primary { --background: rgb(var(--colour-interactive-static-primary-bg-default, 17, 17, 17)); --background-hover: rgb(var(--colour-interactive-static-primary-bg-hover, 51, 51, 51)); --background-press: rgb(var(--colour-interactive-static-primary-bg-pressed, 0, 0, 0)); --foreground: rgb(var(--colour-static-white, 255, 255, 255)); --disabled-foreground: rgba(var(--colour-static-black, 17, 17, 17), .15); --disabled-background: rgba(var(--colour-static-black, 17, 17, 17), .15); }

.rec-btn.rec-btn--static-colour.rec-btn--secondary, .rec-btn.rec-btn--static-colour.rec-btn--icon-secondary { --background: transparent; --background-hover: transparent; --background-press: rgba(var(--colour-interactive-static-secondary-bg-pressed, 204, 204, 204), 0.5); --box-shadow: inset 0 0 0 1px rgb(var(--colour-static-black, 17, 17, 17)); --box-shadow-hover: inset 0 0 0 2px rgb(var(--colour-static-black, 17, 17, 17)); --box-shadow-press: inset 0 0 0 2px rgb(var(--colour-static-black, 17, 17, 17)); --foreground: rgb(var(--colour-static-black, 17, 17, 17)); --disabled-foreground: rgba(var(--colour-static-black, 17, 17, 17), .15); --disabled-background: rgba(var(--colour-static-black, 17, 17, 17), .15); }

.rec-btn.rec-btn--static-colour.rec-btn--tertiary, .rec-btn.rec-btn--static-colour.rec-btn--icon-tertiary { --background: transparent; --background-hover: rgb(var(--colour-interactive-static-secondary-bg-hover, 223, 223, 223)); --background-press: rgb(var(--colour-interactive-static-secondary-bg-pressed, 204, 204, 204)); --foreground: rgb(var(--colour-static-black, 17, 17, 17)); --disabled-foreground: rgba(var(--colour-static-black, 17, 17, 17), .15); --disabled-background: transparent; }

.rec-btn.rec-btn--static-colour.rec-btn--icon-secondary-inverse, .rec-btn.rec-btn--static-colour.rec-btn--secondary-inverse { --background: transparent; --background-hover: transparent; --background-press: rgba(var(--colour-static-white, 255, 255, 255), 0.1); --box-shadow: inset 0 0 0 1px rgb(var(--colour-static-white, 255, 255, 255)); --box-shadow-hover: inset 0 0 0 2px rgb(var(--colour-static-white, 255, 255, 255)); --box-shadow-press: inset 0 0 0 2px rgb(var(--colour-static-white, 255, 255, 255)); --foreground: rgb(var(--colour-static-white, 255, 255, 255)); --disabled-foreground: rgba(var(--colour-static-white, 255, 255, 255), .15); --disabled-background: rgba(var(--colour-static-white, 255, 255, 255), .15); }

.rec-btn.rec-btn--static-colour.rec-btn--icon-emphasised-inverse, .rec-btn.rec-btn--static-colour.rec-btn--icon-primary-inverse, .rec-btn.rec-btn--static-colour.rec-btn--primary-inverse, .rec-btn.rec-btn--static-colour.rec-btn--emphasised-inverse { --background: rgb(var(--colour-static-white, 255, 255, 255)); --background-hover: rgb(var(--colour-static-light-grey, 245, 245, 245)); --background-press: rgb(var(--colour-static-grey, 223, 223, 223)); --foreground: rgb(var(--colour-static-black, 17, 17, 17)); --disabled-foreground: rgba(var(--colour-static-white, 255, 255, 255), .15); --disabled-background: rgba(var(--colour-static-white, 255, 255, 255), .15); }

.rec-btn.rec-btn--static-colour.rec-btn--icon-tertiary-inverse, .rec-btn.rec-btn--static-colour.rec-btn--tertiary-inverse { --background: transparent; --background-hover: rgba(var(--colour-static-white, 255, 255, 255), 0.15); --background-press: rgba(var(--colour-static-white, 255, 255, 255), 0.3); --foreground: rgb(var(--colour-static-white, 255, 255, 255)); --disabled-foreground: rgba(var(--colour-static-white, 255, 255, 255), .15); }

.rec-btn--icon-emphasised-inverse, .rec-btn--emphasised-inverse, .rec-btn--icon-primary-inverse, .rec-btn--primary-inverse, .rec-btn--icon-secondary, .rec-btn--secondary, .rec-btn--icon-tertiary, .rec-btn--tertiary { --foreground: rgb(var(--colour-text-and-icon-1, 17, 17, 17)); }

.rec-btn--icon-secondary-inverse, .rec-btn--secondary-inverse, .rec-btn--icon-tertiary-inverse, .rec-btn--tertiary-inverse, .rec-btn--icon-primary, .rec-btn--primary { --foreground: rgb(var(--colour-text-and-icon-5, 255, 255, 255)); }

.rec-btn--icon-image-overlay, .rec-btn--icon-emphasised, .rec-btn--danger, .rec-btn--emphasised, .rec-btn--image-overlay { --foreground: rgb(var(--colour-static-white, 255, 255, 255)); }

.rec-btn .rec-btn__loader { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -160%); display: inline-block; width: 0px; height: 0px; border: 0.25rem solid; border-radius: 64px; animation: 0.7s ease 0s infinite normal none running rec-btn-loader; opacity: 0; visibility: hidden; text-indent: -9999px; overflow: hidden; transition-property: opacity, transform; transition-duration: 250ms; transition-timing-function: cubic-bezier(0.4, 0, 0.4, 1); }

@keyframes rec-btn-loader { 
  0%, 100% { transform: translate(-50%, -160%); animation-timing-function: cubic-bezier(0.42, 0, 1, 1); }
  40% { transform: translate(-50%, 20%); animation-timing-function: cubic-bezier(0, 0, 0, 1); }
}

.rec-btn--loading { pointer-events: none; }

.rec-btn--loading .rec-btn__loader { opacity: 1; visibility: visible; }

.rec-btn--loading .rec-svg-icon, .rec-btn--loading .rec-btn__label { transform: translateY(50%); opacity: 0; visibility: hidden; }

.rec-btn--xsmall { font-size: 0.75rem; line-height: 1.33333; }

.rec-btn--xsmall .rec-btn__inner { min-height: 2rem; padding: 0px 1rem; }

.rec-btn--xsmall .rec-btn__inner::after { content: ""; position: absolute; inset: -0.375rem; }

.rec-btn--xsmall.rec-leading-icon .rec-btn__inner { padding-left: 0.75rem; }

.rec-btn--xsmall.rec-trailing-icon .rec-btn__inner { padding-right: 0.75rem; }

.rec-btn--xsmall.rec-leading-icon .rec-svg-icon { margin-right: 0.25rem; }

.rec-btn--xsmall.rec-trailing-icon .rec-svg-icon { margin-left: 0.25rem; }

.rec-btn--small { font-size: 0.75rem; line-height: 1.33333; }

.rec-btn--small .rec-btn__inner { min-height: 2.5rem; padding: 0px 1.5rem; }

.rec-btn--small .rec-btn__inner::after { content: ""; position: absolute; inset: -0.125rem; }

.rec-btn--small.rec-leading-icon .rec-btn__inner { padding-left: 1rem; }

.rec-btn--small.rec-trailing-icon .rec-btn__inner { padding-right: 1rem; }

.rec-btn--expanding.rec-leading-icon .rec-btn__inner, .rec-btn--expanding.rec-trailing-icon .rec-btn__inner, .rec-btn--expanding .rec-btn__inner { transition-property: opacity, transform, padding; padding: 0px 1rem; }

.rec-btn--expanding.rec-btn--small .rec-btn__inner { padding: 0px 0.5rem; }

.rec-btn--expanding.rec-btn--xsmall .rec-btn__icon { margin: 0px; }

.rec-btn--expanding.rec-btn--xsmall .rec-btn__inner { padding: 0px 0.25rem; min-height: 2rem; }

.rec-btn--expanding.rec-btn--xsmall .rec-btn__inner::after { content: ""; position: absolute; inset: -0.375rem; }

.rec-btn--expanding .rec-btn__icon { transition: margin-right 250ms ease-in-out; margin: 0px; }

.rec-btn--expanding .rec-btn__inner .rec-btn__label { max-width: 0px; white-space: nowrap; overflow: hidden; transition: max-width 250ms ease-in-out; transform-origin: left center; position: static; width: auto; height: auto; margin: 0px; clip: initial; }

.rec-btn--expanding:hover .rec-btn__inner .rec-btn__label, .rec-btn--expanding:focus-visible .rec-btn__inner .rec-btn__label { max-width: 12.5rem; }

.rec-btn--expanding:hover.rec-leading-icon .rec-btn__inner, .rec-btn--expanding:focus-visible.rec-leading-icon .rec-btn__inner { padding-right: 2rem; padding-left: 1.5rem; }

.rec-btn--expanding:hover.rec-trailing-icon .rec-btn__inner, .rec-btn--expanding:focus-visible.rec-trailing-icon .rec-btn__inner { flex-direction: row-reverse; padding-right: 1.5rem; padding-left: 2rem; }

.rec-btn--expanding:hover.rec-leading-icon .rec-btn__icon, .rec-btn--expanding:focus-visible.rec-leading-icon .rec-btn__icon { margin-right: 0.5rem; }

.rec-btn--expanding:hover.rec-trailing-icon .rec-btn__icon, .rec-btn--expanding:focus-visible.rec-trailing-icon .rec-btn__icon { margin-left: 0.5rem; }

.rec-btn--expanding:hover.rec-leading-icon.rec-btn--small .rec-btn__inner, .rec-btn--expanding:focus-visible.rec-leading-icon.rec-btn--small .rec-btn__inner { padding-right: 1.5rem; padding-left: 1rem; }

.rec-btn--expanding:hover.rec-trailing-icon.rec-btn--small .rec-btn__inner, .rec-btn--expanding:focus-visible.rec-trailing-icon.rec-btn--small .rec-btn__inner { padding-right: 1rem; padding-left: 1.5rem; }

.rec-btn--expanding:hover.rec-leading-icon.rec-btn--xsmall .rec-btn__inner, .rec-btn--expanding:focus-visible.rec-leading-icon.rec-btn--xsmall .rec-btn__inner { padding-right: 1rem; padding-left: 0.75rem; }

.rec-btn--expanding:hover.rec-trailing-icon.rec-btn--xsmall .rec-btn__inner, .rec-btn--expanding:focus-visible.rec-trailing-icon.rec-btn--xsmall .rec-btn__inner { padding-right: 0.75rem; padding-left: 1rem; }

.rec-btn--expanding:hover.rec-leading-icon.rec-btn--xsmall .rec-btn__icon, .rec-btn--expanding:focus-visible.rec-leading-icon.rec-btn--xsmall .rec-btn__icon { margin-right: 0.25rem; }

.rec-btn--expanding:hover.rec-trailing-icon.rec-btn--xsmall .rec-btn__icon, .rec-btn--expanding:focus-visible.rec-trailing-icon.rec-btn--xsmall .rec-btn__icon { margin-left: 0.25rem; }

@media (hover: none) {
  .rec-btn--expanding.rec-leading-icon:hover .rec-btn__inner, .rec-btn--expanding.rec-trailing-icon:hover .rec-btn__inner { padding: 0px 1rem; }
  .rec-btn--expanding.rec-leading-icon:hover .rec-btn__inner .rec-btn__label, .rec-btn--expanding.rec-trailing-icon:hover .rec-btn__inner .rec-btn__label { max-width: 0px; }
  .rec-btn--expanding.rec-leading-icon:hover .rec-btn__icon, .rec-btn--expanding.rec-trailing-icon:hover .rec-btn__icon { margin: 0px; }
  .rec-btn--expanding.rec-leading-icon.rec-btn--small:hover .rec-btn__inner, .rec-btn--expanding.rec-trailing-icon.rec-btn--small:hover .rec-btn__inner { padding: 0px 0.5rem; }
  .rec-btn--expanding.rec-leading-icon.rec-btn--xsmall:hover .rec-btn__inner, .rec-btn--expanding.rec-trailing-icon.rec-btn--xsmall:hover .rec-btn__inner { padding: 0px 0.25rem; }
  .rec-btn--expanding.rec-leading-icon.rec-btn--xsmall:hover .rec-btn__icon, .rec-btn--expanding.rec-trailing-icon.rec-btn--xsmall:hover .rec-btn__icon { margin: 0px; }
  .rec-btn--expanding.rec-btn--touch-device-expanded:hover:not(:disabled) .rec-btn__inner .rec-btn__label, .rec-btn--expanding.rec-btn--touch-device-expanded .rec-btn__inner .rec-btn__label { max-width: 12.5rem; }
  .rec-btn--expanding.rec-btn--touch-device-expanded:hover:not(:disabled).rec-leading-icon .rec-btn__inner, .rec-btn--expanding.rec-btn--touch-device-expanded.rec-leading-icon .rec-btn__inner { padding-right: 2rem; padding-left: 1.5rem; }
  .rec-btn--expanding.rec-btn--touch-device-expanded:hover:not(:disabled).rec-trailing-icon .rec-btn__inner, .rec-btn--expanding.rec-btn--touch-device-expanded.rec-trailing-icon .rec-btn__inner { flex-direction: row-reverse; padding-right: 1.5rem; padding-left: 2rem; }
  .rec-btn--expanding.rec-btn--touch-device-expanded:hover:not(:disabled).rec-leading-icon .rec-btn__icon, .rec-btn--expanding.rec-btn--touch-device-expanded.rec-leading-icon .rec-btn__icon { margin-right: 0.5rem; }
  .rec-btn--expanding.rec-btn--touch-device-expanded:hover:not(:disabled).rec-trailing-icon .rec-btn__icon, .rec-btn--expanding.rec-btn--touch-device-expanded.rec-trailing-icon .rec-btn__icon { margin-left: 0.5rem; }
  .rec-btn--expanding.rec-btn--touch-device-expanded:hover:not(:disabled).rec-leading-icon.rec-btn--small .rec-btn__inner, .rec-btn--expanding.rec-btn--touch-device-expanded.rec-leading-icon.rec-btn--small .rec-btn__inner { padding-right: 1.5rem; padding-left: 1rem; }
  .rec-btn--expanding.rec-btn--touch-device-expanded:hover:not(:disabled).rec-trailing-icon.rec-btn--small .rec-btn__inner, .rec-btn--expanding.rec-btn--touch-device-expanded.rec-trailing-icon.rec-btn--small .rec-btn__inner { padding-right: 1rem; padding-left: 1.5rem; }
  .rec-btn--expanding.rec-btn--touch-device-expanded:hover:not(:disabled).rec-leading-icon.rec-btn--xsmall .rec-btn__inner, .rec-btn--expanding.rec-btn--touch-device-expanded.rec-leading-icon.rec-btn--xsmall .rec-btn__inner { padding-right: 1rem; padding-left: 0.75rem; }
  .rec-btn--expanding.rec-btn--touch-device-expanded:hover:not(:disabled).rec-trailing-icon.rec-btn--xsmall .rec-btn__inner, .rec-btn--expanding.rec-btn--touch-device-expanded.rec-trailing-icon.rec-btn--xsmall .rec-btn__inner { padding-right: 0.75rem; padding-left: 1rem; }
  .rec-btn--expanding.rec-btn--touch-device-expanded:hover:not(:disabled).rec-leading-icon.rec-btn--xsmall .rec-btn__icon, .rec-btn--expanding.rec-btn--touch-device-expanded.rec-leading-icon.rec-btn--xsmall .rec-btn__icon { margin: 0px; }
  .rec-btn--expanding.rec-btn--touch-device-expanded:hover:not(:disabled).rec-trailing-icon.rec-btn--xsmall .rec-btn__icon, .rec-btn--expanding.rec-btn--touch-device-expanded.rec-trailing-icon.rec-btn--xsmall .rec-btn__icon { margin: 0px; }
}

.rec-btn--expanding:focus-visible.rec-btn--loading.rec-trailing-icon .rec-btn__inner, .rec-btn--expanding:focus-visible.rec-btn--loading.rec-leading-icon .rec-btn__inner, .rec-btn--expanding.rec-btn--loading.rec-trailing-icon .rec-btn__inner, .rec-btn--expanding.rec-btn--loading.rec-leading-icon .rec-btn__inner, .rec-btn--expanding:disabled.rec-trailing-icon .rec-btn__inner, .rec-btn--expanding:disabled.rec-leading-icon .rec-btn__inner { padding: 0px 1rem; }

.rec-btn--expanding:focus-visible.rec-btn--loading.rec-trailing-icon .rec-btn__inner .rec-btn__label, .rec-btn--expanding:focus-visible.rec-btn--loading.rec-leading-icon .rec-btn__inner .rec-btn__label, .rec-btn--expanding.rec-btn--loading.rec-trailing-icon .rec-btn__inner .rec-btn__label, .rec-btn--expanding.rec-btn--loading.rec-leading-icon .rec-btn__inner .rec-btn__label, .rec-btn--expanding:disabled.rec-trailing-icon .rec-btn__inner .rec-btn__label, .rec-btn--expanding:disabled.rec-leading-icon .rec-btn__inner .rec-btn__label { max-width: 0px; }

.rec-btn--expanding:focus-visible.rec-btn--loading.rec-trailing-icon .rec-btn__icon, .rec-btn--expanding:focus-visible.rec-btn--loading.rec-leading-icon .rec-btn__icon, .rec-btn--expanding.rec-btn--loading.rec-trailing-icon .rec-btn__icon, .rec-btn--expanding.rec-btn--loading.rec-leading-icon .rec-btn__icon, .rec-btn--expanding:disabled.rec-trailing-icon .rec-btn__icon, .rec-btn--expanding:disabled.rec-leading-icon .rec-btn__icon { margin: 0px; }

.rec-btn--expanding:focus-visible.rec-btn--loading.rec-trailing-icon.rec-btn--small .rec-btn__inner, .rec-btn--expanding:focus-visible.rec-btn--loading.rec-leading-icon.rec-btn--small .rec-btn__inner, .rec-btn--expanding.rec-btn--loading.rec-trailing-icon.rec-btn--small .rec-btn__inner, .rec-btn--expanding.rec-btn--loading.rec-leading-icon.rec-btn--small .rec-btn__inner, .rec-btn--expanding:disabled.rec-trailing-icon.rec-btn--small .rec-btn__inner, .rec-btn--expanding:disabled.rec-leading-icon.rec-btn--small .rec-btn__inner { padding: 0px 0.5rem; }

.rec-btn--expanding:focus-visible.rec-btn--loading.rec-trailing-icon.rec-btn--xsmall .rec-btn__inner, .rec-btn--expanding:focus-visible.rec-btn--loading.rec-leading-icon.rec-btn--xsmall .rec-btn__inner, .rec-btn--expanding.rec-btn--loading.rec-trailing-icon.rec-btn--xsmall .rec-btn__inner, .rec-btn--expanding.rec-btn--loading.rec-leading-icon.rec-btn--xsmall .rec-btn__inner, .rec-btn--expanding:disabled.rec-trailing-icon.rec-btn--xsmall .rec-btn__inner, .rec-btn--expanding:disabled.rec-leading-icon.rec-btn--xsmall .rec-btn__inner { padding: 0px 0.25rem; }

.rec-btn--expanding:focus-visible.rec-btn--loading.rec-trailing-icon.rec-btn--xsmall .rec-btn__icon, .rec-btn--expanding:focus-visible.rec-btn--loading.rec-leading-icon.rec-btn--xsmall .rec-btn__icon, .rec-btn--expanding.rec-btn--loading.rec-trailing-icon.rec-btn--xsmall .rec-btn__icon, .rec-btn--expanding.rec-btn--loading.rec-leading-icon.rec-btn--xsmall .rec-btn__icon, .rec-btn--expanding:disabled.rec-trailing-icon.rec-btn--xsmall .rec-btn__icon, .rec-btn--expanding:disabled.rec-leading-icon.rec-btn--xsmall .rec-btn__icon { margin: 0px; }

.rec-btn--fluid, .rec-btn--fluid .rec-btn__inner { width: 100%; }

.rec-btn--plain.rec-btn--small .rec-btn__inner::after, .rec-btn--plain .rec-btn__inner::after { content: ""; position: absolute; inset: -0.25rem; }

.rec-btn--plain { --background: transparent; --background-hover: transparent; --background-press: transparent; --foreground: rgb(var(--colour-text-and-icon-1, 17, 17, 17)); }

.rec-btn--plain.rec-btn--small .rec-btn__inner, .rec-btn--plain .rec-btn__inner, .rec-btn--plain.rec-leading-icon .rec-btn__inner, .rec-btn--plain.rec-trailing-icon .rec-btn__inner { padding: 0px; }

.rec-btn .rec-svg-icon, .rec-btn__label { transition-property: opacity, margin-right, margin-left, transform; transition-duration: 200ms; transition-timing-function: cubic-bezier(0.4, 0, 0.4, 1); }

.rec-btn:focus-visible, .rec-tabs__panel:focus-visible { box-shadow: 0 0 0 4px var(--skapa-focus-ring-internal, rgb(var(--colour-neutral-1, 255, 255, 255))); outline: 2px solid var(--skapa-focus-ring-external, rgb(var(--colour-neutral-7, 17, 17, 17))); outline-offset: 4px; transition: outline 200ms ease-out, box-shadow 200ms ease-out; }

.rec-btn[class*="inverse"]:focus-visible { box-shadow: 0 0 0 4px var(--skapa-focus-ring-internal, rgb(var(--colour-static-black, 17, 17, 17))); outline: 2px solid var(--skapa-focus-ring-external, rgb(var(--colour-static-white, 255, 255, 255))); outline-offset: 4px; transition: outline 200ms ease-out, box-shadow 200ms ease-out; }

.rec-btn[class*="image-overlay"]:focus-visible { box-shadow: 0 0 0 4px var(--skapa-focus-ring-internal, rgb(var(--colour-static-white, 255, 255, 255))); outline: 2px solid var(--skapa-focus-ring-external, rgb(var(--colour-static-black, 17, 17, 17))); outline-offset: 4px; transition: outline 200ms ease-out, box-shadow 200ms ease-out; }

.rec-grid__wrapper { --columns: 2; --column-gap: 0; --row-gap: 0; --main-gutter: 1.25rem; display: grid; grid-template-columns: repeat(var(--columns), minmax(0, 1fr)); row-gap: var(--row-gap); column-gap: var(--column-gap); margin-right: -1.25rem; margin-left: -1.25rem; border-top: 1px solid rgb(var(--colour-neutral-3, 223, 223, 223)); }

@media (min-width: 37.5em) {
  .rec-grid__wrapper { --columns: 3; --column-gap: 1.75rem; margin-right: unset; margin-left: unset; border-top: unset; }
}

@media (min-width: 56.25em) {
  .rec-grid__wrapper { --columns: 4; --column-gap: 2.5rem; }
}

@media (min-width: 75em) {
  .rec-grid__wrapper { --column-gap: 3.5rem; }
}

.rec-grid__item { position: relative; padding: 1.5rem 1.25rem; border-color: rgb(var(--colour-neutral-3, 223, 223, 223)); border-style: solid; border-width: 0px 1px 1px 0px; }

@media (min-width: 37.5em) {
  .rec-grid__item { padding: unset; margin-top: 1rem; border: unset; }
}

.rec-grid__item::after { position: absolute; right: 0px; bottom: 0px; left: 0px; height: 1px; content: ""; background-color: rgb(var(--colour-neutral-3, 223, 223, 223)); }

@media (min-width: 37.5em) {
  .rec-grid__item:nth-of-type(3n+2)::after { right: calc(var(--column-gap)*-1); left: calc(var(--column-gap)*-1); }
}

@media (min-width: 56.25em) {
  .rec-grid__item:nth-of-type(3n+2)::after { right: 0px; left: 0px; }
  .rec-grid__item:nth-of-type(4n+2)::after, .rec-grid__item:nth-of-type(4n+3)::after { right: calc(var(--column-gap)*-1); left: calc(var(--column-gap)*-1); }
}

.rec-grid__see-more { display: flex; flex-direction: column; margin-top: 2.5rem; align-items: center; }

.rec-grid__see-more__button { margin-bottom: 1.5rem; }

.rec-teaser__wrapper { margin-top: 2.5rem; }

.rec-quantity-stepper { position: relative; display: inline-flex; align-items: center; justify-content: space-between; padding: 0px 0.5rem; background-color: rgb(var(--colour-interactive-subtle-bg-default, 255, 255, 255)); border: 0px; border-radius: 64px; }

.rec-quantity-stepper--fluid { min-width: 100%; }

.rec-quantity-stepper--small { padding: 0px 0.25rem; }

.rec-quantity-stepper .rec-btn:focus-visible { z-index: 200; }

.rec-quantity-stepper__input { text-align: center; font-weight: 700; font-size: 1rem; line-height: 1.5; font-family: inherit; border: none; box-sizing: content-box; background-color: rgb(var(--colour-interactive-subtle-bg-default, 255, 255, 255)); color: rgb(var(--colour-text-and-icon-1, 17, 17, 17)); padding: 1rem 0.25rem; min-width: 2.5rem; max-width: 5ch; order: 2; }

.rec-quantity-stepper__input:focus-visible ~ .rec-quantity-stepper__border { border: 2px solid rgb(var(--colour-interactive-emphasised-border-selected, 0, 88, 163)); }

.rec-quantity-stepper__input:disabled ~ .rec-quantity-stepper__border { border: 1px solid rgb(var(--colour-interactive-disabled-1, 204, 204, 204)); }

.rec-quantity-stepper__input:disabled { color: rgb(var(--colour-interactive-disabled-1, 204, 204, 204)); }

.rec-quantity-stepper--fluid .rec-quantity-stepper__input { flex-grow: 1; width: 100%; max-width: 100%; }

.rec-quantity-stepper--small .rec-quantity-stepper__input { padding: 0.5rem 0.25rem; }

.rec-quantity-stepper__border { position: absolute; border: 1px solid rgb(var(--colour-neutral-5, 146, 146, 146)); border-radius: 64px; inset: 0px; pointer-events: none; }

.rec-quantity-stepper__decrease { order: 1; }

.rec-quantity-stepper__decrease:disabled { background: rgba(0, 0, 0, 0); }

.rec-quantity-stepper__decrease--active { background-color: rgb(var(--colour-interactive-subtle-bg-pressed, 223, 223, 223)); }

.rec-quantity-stepper__increase { order: 3; }

.rec-quantity-stepper__increase:disabled { background: rgba(0, 0, 0, 0); }

.rec-quantity-stepper__increase--active { background-color: rgb(var(--colour-interactive-subtle-bg-pressed, 223, 223, 223)); }

.rec-quantity-stepper__sr-label { position: absolute; height: 1px; width: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); margin: -1px; white-space: nowrap; }

.rec-bundle__container { display: inline-flex; flex-direction: column; max-width: 100%; margin-bottom: 0px; }

.rec-bundle__container .rec-teaser__info { white-space: nowrap; }

.rec-bundle__container .rec-teaser__title { font-size: 1.125rem; }

@media (min-width: 37.5em) {
  .rec-bundle__container .rec-teaser__title { font-size: 1.5rem; }
}

.rec-bundle__heading { margin-bottom: 1.6rem; }

.rec-bundle__products-wrapper { display: inline-flex; flex-direction: row; max-width: 100%; }

.rec-bundle__products-wrapper > div { margin-bottom: 2.5rem; width: 13.25rem; }

.rec-bundle__plus-symbol { margin-left: 2rem; margin-right: 2rem; margin-top: 8rem; font-size: 1.625rem; }

.rec-bundle__total { border-top: 2px solid rgb(var(--colour-neutral-7, 17, 17, 17)); padding-top: 1rem; padding-bottom: 1.5rem; display: flex; flex-wrap: wrap; justify-content: space-between; }

.rec-bundle__total-label { color: rgb(var(--colour-neutral-7, 17, 17, 17)); font-weight: 700; }

.rec-bundle__btn-wrapper { display: flex; justify-content: flex-end; }

.rec-vertical-bundle__fallback-img { position: absolute; max-width: 600px; object-fit: cover; inset: 0px; width: 100%; height: 100%; }

.rec-vertical-bundle__container { display: inline-flex; flex-direction: column; width: 100%; margin-bottom: 0px; }

.rec-vertical-bundle__container .rec-teaser__title { margin-top: 1rem; font-size: 0.875rem; }

[data-mount-recommendations="search-bundle"] .rec-vertical-bundle__container .rec-teaser__title { margin-top: 0px; }

.rec-vertical-bundle__products-wrapper { display: flex; flex-direction: column; margin-top: 0rem; }

.rec-vertical-bundle__products-wrapper > div:not(:last-child) { border-bottom: 1px solid rgb(var(--colour-neutral-3, 223, 223, 223)); }

.rec-vertical-bundle__container--large .rec-teaser__title { font-size: 1.125rem; }

@media (min-width: 56.25em) {
  .rec-vertical-bundle__container--large .rec-vertical-bundle__products-wrapper { margin-top: -1.25rem; }
}

.rec-price { font-weight: 700; line-height: 1; font-size: 1.5rem; position: relative; color: rgb(var(--colour-text-and-icon-1, 17, 17, 17)); }

.rec-price--subtle { color: rgb(var(--colour-text-and-icon-2, 72, 72, 72)); }

.rec-price__nowrap { white-space: nowrap; }

.rec-price__currency, .rec-price__decimal, .rec-price__subscript { font-size: 0.5em; line-height: 1.3; }

.rec-price__subscript, .rec-price__currency, .rec-price__decimal { position: relative; }

.rec-price__currency { unicode-bidi: bidi-override; }

.rec-price__subscript { display: inline-block; unicode-bidi: isolate; }

.rec-price--currency-super-aligned .rec-price__currency { top: -0.727em; }

.rec-price--currency-fill-aligned .rec-price__currency { font-size: inherit; line-height: inherit; }

.rec-price--decimal-super-aligned .rec-price__decimal { top: -0.727em; }

.rec-price--large { font-size: 2.25rem; }

.rec-price--bti-price { display: inline-block; color: rgb(var(--colour-static-black, 17, 17, 17)); padding: 0.2em 0.3em; background: rgb(var(--colour-commercial-message-bti-yellow, 255, 219, 0)); box-shadow: .08em .08em 0 rgb(var(--colour-commercial-message-bti-red, 204, 0, 8)); font-style: normal; }

.rec-price--regular-font-weight { font-weight: 400; }

.rec-price--strikeout .rec-price__currency, .rec-price--strikeout .rec-price__decimal, .rec-price--strikeout .rec-price__integer { text-decoration: line-through; }

.rec-price--fixed-size .rec-price__subscript, .rec-price--fixed-size .rec-price__currency, .rec-price--fixed-size .rec-price__decimal, .rec-price--strikeout .rec-price__subscript, .rec-price--strikeout .rec-price__currency, .rec-price--strikeout .rec-price__decimal, .rec-price--regular-font-weight .rec-price__subscript, .rec-price--regular-font-weight .rec-price__currency, .rec-price--regular-font-weight .rec-price__decimal, .rec-price--large.rec-price--strikeout .rec-price__subscript, .rec-price--large.rec-price--strikeout .rec-price__currency, .rec-price--large.rec-price--strikeout .rec-price__decimal { font-size: 1em; line-height: 1; top: auto; }

.rec-price--small { font-size: 1rem; }

.rec-price--small .rec-price__subscript, .rec-price--small .rec-price__currency, .rec-price--small .rec-price__decimal { font-size: 1em; line-height: 1; top: auto; }

.rec-price__sr-text { position: absolute; height: 1px; width: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); margin: -1px; white-space: nowrap; left: 0px; }

.rec-price--leading.rec-price--currency-thin .rec-price__currency::after { content: " "; }

.rec-price--trailing.rec-price--currency-thin .rec-price__currency::before { content: " "; }

[dir="rtl"] .rec-price--leading.rec-price--currency-thin .rec-price__currency::before { content: " "; }

[dir="rtl"] .rec-price--leading.rec-price--currency-thin .rec-price__currency::after { content: ""; }

[dir="rtl"] .rec-price--trailing.rec-price--currency-thin .rec-price__currency::before { content: ""; }

[dir="rtl"] .rec-price--trailing.rec-price--currency-thin .rec-price__currency::after { content: " "; }

.rec-price__bundle-total { white-space: nowrap; display: inline-block; font-weight: bold; }

.rec-bundle__price-wrapper { display: flex; flex-direction: column; text-align: right; }

.rec-secondary-currency-price { line-height: 0.9; font-size: 1rem; margin-top: 0.5rem; }

.rec-price__currency { unicode-bidi: bidi-override; }

:focus:not(:focus-visible) { outline: none; }

a[class*="rec-"]:focus-visible, button[class*="rec-"]:focus-visible, [role="button"][class*="rec-"]:focus-visible { box-shadow: 0 0 0 4px var(--skapa-focus-ring-internal, rgb(var(--colour-neutral-1, 255, 255, 255))); outline: 2px solid var(--skapa-focus-ring-external, rgb(var(--colour-neutral-7, 17, 17, 17))); outline-offset: 4px; transition: outline 200ms ease-out, box-shadow 200ms ease-out; }

a[class*="rec-"]:focus-visible p { box-shadow: 0 0 0 4px var(--skapa-focus-ring-internal, rgb(var(--colour-neutral-1, 255, 255, 255))); outline: 2px solid var(--skapa-focus-ring-external, rgb(var(--colour-neutral-7, 17, 17, 17))); outline-offset: 4px; transition: outline 200ms ease-out, box-shadow 200ms ease-out; }

.rec-link:focus-visible { box-shadow: 0 0 0 4px var(--skapa-focus-ring-internal, rgb(var(--colour-neutral-1, 255, 255, 255))); outline: 2px solid var(--skapa-focus-ring-external, rgb(var(--colour-neutral-7, 17, 17, 17))); outline-offset: 4px; transition: outline 200ms ease-out, box-shadow 200ms ease-out; }

.rec-collapsible:focus-visible { box-shadow: 0 0 0 4px var(--skapa-focus-ring-internal, rgb(var(--colour-neutral-1, 255, 255, 255))); outline: 2px solid var(--skapa-focus-ring-external, rgb(var(--colour-neutral-7, 17, 17, 17))); outline-offset: 4px; transition: outline 200ms ease-out, box-shadow 200ms ease-out; }

.rec-expander__btn:focus-visible { box-shadow: 0 0 0 4px var(--skapa-focus-ring-internal, rgb(var(--colour-neutral-1, 255, 255, 255))); outline: 2px solid var(--skapa-focus-ring-external, rgb(var(--colour-neutral-7, 17, 17, 17))); outline-offset: 4px; transition: outline 200ms ease-out, box-shadow 200ms ease-out; }

.rec-expander__content:focus-visible { box-shadow: 0 0 0 4px var(--skapa-focus-ring-internal, rgb(var(--colour-neutral-1, 255, 255, 255))); outline: 2px solid var(--skapa-focus-ring-external, rgb(var(--colour-neutral-7, 17, 17, 17))); outline-offset: 4px; transition: outline 200ms ease-out, box-shadow 200ms ease-out; }

.rec-chunky-header:focus-visible { box-shadow: 0 0 0 4px var(--skapa-focus-ring-internal, rgb(var(--colour-neutral-1, 255, 255, 255))); outline: 2px solid var(--skapa-focus-ring-external, rgb(var(--colour-neutral-7, 17, 17, 17))); outline-offset: 4px; transition: outline 200ms ease-out, box-shadow 200ms ease-out; }

.rec-checkbox input[type="checkbox"]:focus-visible ~ .rec-checkbox__symbol { box-shadow: 0 0 0 4px var(--skapa-focus-ring-internal, rgb(var(--colour-neutral-1, 255, 255, 255))); outline: 2px solid var(--skapa-focus-ring-external, rgb(var(--colour-neutral-7, 17, 17, 17))); outline-offset: 4px; transition: outline 200ms ease-out, box-shadow 200ms ease-out; }

.rec-checkbox input[type="checkbox"]:focus-visible:hover ~ .rec-checkbox__symbol { box-shadow: 0 0 0 4px var(--skapa-focus-ring-internal, rgb(var(--colour-neutral-1, 255, 255, 255))); outline: 2px solid var(--skapa-focus-ring-external, rgb(var(--colour-neutral-7, 17, 17, 17))); outline-offset: 4px; transition: outline 200ms ease-out, box-shadow 200ms ease-out; }

.rec-radio input[type="radio"]:focus-visible ~ .rec-radio__symbol { box-shadow: 0 0 0 4px var(--skapa-focus-ring-internal, rgb(var(--colour-neutral-1, 255, 255, 255))); outline: 2px solid var(--skapa-focus-ring-external, rgb(var(--colour-neutral-7, 17, 17, 17))); outline-offset: 4px; transition: outline 200ms ease-out, box-shadow 200ms ease-out; }

.rec-radio input[type="radio"]:focus-visible:hover ~ .rec-radio__symbol { box-shadow: 0 0 0 4px var(--skapa-focus-ring-internal, rgb(var(--colour-neutral-1, 255, 255, 255))); outline: 2px solid var(--skapa-focus-ring-external, rgb(var(--colour-neutral-7, 17, 17, 17))); outline-offset: 4px; transition: outline 200ms ease-out, box-shadow 200ms ease-out; }

.rec-btn:focus-visible, .rec-tabs__panel:focus-visible { box-shadow: 0 0 0 4px var(--skapa-focus-ring-internal, rgb(var(--colour-neutral-1, 255, 255, 255))); outline: 2px solid var(--skapa-focus-ring-external, rgb(var(--colour-neutral-7, 17, 17, 17))); outline-offset: 4px; transition: outline 200ms ease-out, box-shadow 200ms ease-out; }

.rec-btn[class*="inverse"]:focus-visible { box-shadow: 0 0 0 4px var(--skapa-focus-ring-internal, rgb(var(--colour-static-black, 17, 17, 17))); outline: 2px solid var(--skapa-focus-ring-external, rgb(var(--colour-static-white, 255, 255, 255))); outline-offset: 4px; transition: outline 200ms ease-out, box-shadow 200ms ease-out; }

.rec-btn[class*="image-overlay"]:focus-visible { box-shadow: 0 0 0 4px var(--skapa-focus-ring-internal, rgb(var(--colour-static-white, 255, 255, 255))); outline: 2px solid var(--skapa-focus-ring-external, rgb(var(--colour-static-black, 17, 17, 17))); outline-offset: 4px; transition: outline 200ms ease-out, box-shadow 200ms ease-out; }

.rec-pill:focus-visible { box-shadow: 0 0 0 4px var(--skapa-focus-ring-internal, rgb(var(--colour-neutral-1, 255, 255, 255))); outline: 2px solid var(--skapa-focus-ring-external, rgb(var(--colour-neutral-7, 17, 17, 17))); outline-offset: 4px; transition: outline 200ms ease-out, box-shadow 200ms ease-out; }

.rec-icon-pill:focus-visible { box-shadow: 0 0 0 4px var(--skapa-focus-ring-internal, rgb(var(--colour-neutral-1, 255, 255, 255))); outline: 2px solid var(--skapa-focus-ring-external, rgb(var(--colour-neutral-7, 17, 17, 17))); outline-offset: 4px; transition: outline 200ms ease-out, box-shadow 200ms ease-out; }

.rec-slider-handle:focus-visible { box-shadow: 0 0 0 4px var(--skapa-focus-ring-internal, rgb(var(--colour-neutral-1, 255, 255, 255))); outline: 2px solid var(--skapa-focus-ring-external, rgb(var(--colour-neutral-7, 17, 17, 17))); outline-offset: 4px; transition: outline 200ms ease-out, box-shadow 200ms ease-out; }

.rec-shoppable-image__category-link:focus-visible, .rec-shoppable-image__dot:focus-visible { box-shadow: 0 0 0 4px var(--skapa-focus-ring-internal, rgb(var(--colour-neutral-1, 255, 255, 255))); outline: 2px solid var(--skapa-focus-ring-external, rgb(var(--colour-neutral-7, 17, 17, 17))); outline-offset: 4px; transition: outline 200ms ease-out, box-shadow 200ms ease-out; }

.rec-tabs__tab:focus-visible { box-shadow: none; outline: none; }

.rec-tabs__tab:focus-visible::before { bottom: 2px; z-index: unset; }

.rec-tabs__tab:focus-visible::after { content: ""; position: absolute; inset: 0px; display: block; box-shadow: inset 0 0 0 2px rgb(var(--colour-interactive-subtle-border-selected, 17, 17, 17)); border-radius: 4px; }

.rec-dual-btn--secondary .rec-dual-btn__first:focus-visible, .rec-dual-btn--secondary .rec-dual-btn__second:focus-visible { box-shadow: 0 0 0 4px rgb(var(--colour-neutral-1, 255, 255, 255)),0 0 0 6px rgb(var(--colour-neutral-7, 17, 17, 17)); outline: none; transition-property: box-shadow; transition-duration: 200ms; transition-timing-function: ease-out; }

.rec-dual-btn__first:focus-visible:hover, .rec-dual-btn__second:focus-visible:hover { outline: none; box-shadow: inset 0 0 0 1px rgb(var(--colour-neutral-7, 17, 17, 17)),0 0 0 4px rgb(var(--colour-neutral-1, 255, 255, 255)),0 0 0 6px rgb(var(--colour-neutral-7, 17, 17, 17)); }

.rec-dual-btn--primary .rec-dual-btn__first:focus-visible, .rec-dual-btn--primary .rec-dual-btn__second:focus-visible { box-shadow: 0 0 0 4px rgb(var(--colour-static-black, 17, 17, 17)),0 0 0 6px rgb(var(--colour-static-white, 255, 255, 255)); outline: none; transition-property: box-shadow; transition-duration: 200ms; transition-timing-function: ease-out; }

.rec-card:focus-visible { box-shadow: 0 0 0 4px var(--skapa-focus-ring-internal, rgb(var(--colour-neutral-1, 255, 255, 255))); outline: 2px solid var(--skapa-focus-ring-external, rgb(var(--colour-neutral-7, 17, 17, 17))); outline-offset: 4px; transition: outline 200ms ease-out, box-shadow 200ms ease-out; }

.rec-card:focus-visible .rec-card__title { text-decoration: none; }

.rec-card:focus-visible p { box-shadow: none; outline: none; }

.rec-content-card .rec-content-card__headers:focus-visible { box-shadow: none; outline: none; }

.rec-content-card .rec-content-card__headers:focus-visible::before { box-shadow: 0 0 0 4px var(--skapa-focus-ring-internal, rgb(var(--colour-neutral-1, 255, 255, 255))); outline: 2px solid var(--skapa-focus-ring-external, rgb(var(--colour-neutral-7, 17, 17, 17))); outline-offset: 4px; transition: outline 200ms ease-out, box-shadow 200ms ease-out; }

.rec-choice-item__radio:focus-visible, .rec-choice-item__action:focus-visible { box-shadow: none; outline: none; }

.rec-choice-item__radio:focus-visible ~ .rec-choice-item__border::before, .rec-choice-item__action:focus-visible ~ .rec-choice-item__border::before { content: ""; position: absolute; inset: -0.125rem; box-shadow: 0 0 0 4px var(--skapa-focus-ring-internal, rgb(var(--colour-neutral-1, 255, 255, 255))); outline: 2px solid var(--skapa-focus-ring-external, rgb(var(--colour-neutral-7, 17, 17, 17))); outline-offset: 4px; transition: outline 200ms ease-out, box-shadow 200ms ease-out; border-radius: 4px; }

.rec-simple-video__button:focus-visible { box-shadow: 0 0 0 4px var(--skapa-focus-ring-internal, rgb(var(--colour-neutral-1, 255, 255, 255))); outline: 2px solid var(--skapa-focus-ring-external, rgb(var(--colour-neutral-7, 17, 17, 17))); outline-offset: 4px; transition: outline 200ms ease-out, box-shadow 200ms ease-out; }

.rec-jumbo-btn:focus-visible { box-shadow: 0 0 0 4px var(--skapa-focus-ring-internal, rgb(var(--colour-neutral-1, 255, 255, 255))); outline: 2px solid var(--skapa-focus-ring-external, rgb(var(--colour-neutral-7, 17, 17, 17))); outline-offset: 4px; transition: outline 200ms ease-out, box-shadow 200ms ease-out; }

.rec-jumbo-btn.rec-jumbo-btn--inverse:focus-visible { box-shadow: 0 0 0 4px var(--skapa-focus-ring-internal, rgb(var(--colour-static-black, 17, 17, 17))); outline: 2px solid var(--skapa-focus-ring-external, rgb(var(--colour-static-white, 255, 255, 255))); outline-offset: 4px; transition: outline 200ms ease-out, box-shadow 200ms ease-out; }

.rec-accordion-item-header:focus-visible { box-shadow: 0 0 0 4px var(--skapa-focus-ring-internal, rgb(var(--colour-neutral-1, 255, 255, 255))); outline: 2px solid var(--skapa-focus-ring-external, rgb(var(--colour-neutral-7, 17, 17, 17))); outline-offset: 4px; transition: outline 200ms ease-out, box-shadow 200ms ease-out; }

.rec-link-list__item:focus-visible { box-shadow: 0 0 0 4px var(--skapa-focus-ring-internal, rgb(var(--colour-neutral-1, 255, 255, 255))); outline: 2px solid var(--skapa-focus-ring-external, rgb(var(--colour-neutral-7, 17, 17, 17))); outline-offset: 4px; transition: outline 200ms ease-out, box-shadow 200ms ease-out; }

.rec-switch input[type="checkbox"]:focus-visible + .rec-switch__toggle::before { box-shadow: 0 0 0 4px var(--skapa-focus-ring-internal, rgb(var(--colour-neutral-1, 255, 255, 255))); outline: 2px solid var(--skapa-focus-ring-external, rgb(var(--colour-neutral-7, 17, 17, 17))); outline-offset: 4px; transition: outline 200ms ease-out, box-shadow 200ms ease-out; }

.rec-switch input[type="checkbox"]:focus-visible:hover + .rec-switch__toggle::before { box-shadow: 0 0 0 4px var(--skapa-focus-ring-internal, rgb(var(--colour-neutral-1, 255, 255, 255))); outline: 2px solid var(--skapa-focus-ring-external, rgb(var(--colour-neutral-7, 17, 17, 17))); outline-offset: 4px; transition: outline 200ms ease-out, box-shadow 200ms ease-out; }

.rec-tooltip__trigger-button:focus-visible, .rec-tooltip__custom-trigger-wrapper:focus-visible { box-shadow: 0 0 0 4px var(--skapa-focus-ring-internal, rgb(var(--colour-neutral-1, 255, 255, 255))); outline: 2px solid var(--skapa-focus-ring-external, rgb(var(--colour-neutral-7, 17, 17, 17))); outline-offset: 4px; transition: outline 200ms ease-out, box-shadow 200ms ease-out; }

.rec-search .rec-search__scope:focus-visible { box-shadow: 0 0 0 4px var(--skapa-focus-ring-internal, rgb(var(--colour-neutral-1, 255, 255, 255))); outline: 2px solid var(--skapa-focus-ring-external, rgb(var(--colour-neutral-7, 17, 17, 17))); outline-offset: 4px; transition: outline 200ms ease-out, box-shadow 200ms ease-out; border-radius: 4px; }

.rec-search .rec-search__scope:focus-visible, .rec-search .rec-btn:focus-visible { box-shadow: 0 0 0 1px rgb(var(--colour-neutral-1, 255, 255, 255)); outline: 2px solid rgb(var(--colour-neutral-7, 17, 17, 17)); outline-offset: 1px; }

.rec-search .rec-search__input:focus-visible { outline: 0px; }

.rec-search .rec-search__input:-webkit-autofill:focus-visible { box-shadow: 0 0 0 3rem rgb(var(--colour-neutral-1, 255, 255, 255)) inset; transition: box-shadow cubic-bezier(0.4, 0, 0.4, 1); caret-color: rgb(var(--colour-text-and-icon-1, 17, 17, 17)); }

.rec-toast .rec-btn:focus-visible { box-shadow: 0 0 0 4px var(--skapa-focus-ring-internal, rgb(var(--colour-neutral-7, 17, 17, 17))); outline: 2px solid var(--skapa-focus-ring-external, rgb(var(--colour-neutral-1, 255, 255, 255))); outline-offset: 4px; transition: outline 200ms ease-out, box-shadow 200ms ease-out; }

.rec-action-list-item__action:focus-visible { outline-offset: 4px; transition: outline 200ms ease-out, box-shadow 200ms ease-out; outline: none; box-shadow: inset 0 0 0 2px rgb(var(--colour-interactive-subtle-border-selected, 17, 17, 17)); }

.rec-overflow-carousel .rec-btn[class*="inverse"]:focus-visible { box-shadow: 0 0 0 4px var(--skapa-focus-ring-internal, rgb(var(--colour-neutral-1, 255, 255, 255))); outline: 2px solid var(--skapa-focus-ring-external, rgb(var(--colour-neutral-7, 17, 17, 17))); outline-offset: 4px; transition: outline 200ms ease-out, box-shadow 200ms ease-out; }

.rec-modal-header .rec-btn:focus-visible { box-shadow: 0 0 0 4px var(--skapa-focus-ring-internal, rgb(var(--colour-neutral-1, 255, 255, 255))); outline: 2px solid var(--skapa-focus-ring-external, rgb(var(--colour-neutral-7, 17, 17, 17))); outline-offset: 4px; transition: outline 200ms ease-out, box-shadow 200ms ease-out; }

.rec-list-view-item__action:focus-visible { outline: none; box-shadow: inset 0 0 0 2px rgb(var(--colour-interactive-subtle-border-selected, 17, 17, 17)); }

.rec-quantity-stepper__input:focus-visible { outline: none; }

button.rec-avatar:focus-visible { box-shadow: 0 0 0 4px var(--skapa-focus-ring-internal, rgb(var(--colour-neutral-1, 255, 255, 255))); outline: 2px solid var(--skapa-focus-ring-external, rgb(var(--colour-neutral-7, 17, 17, 17))); outline-offset: 4px; transition: outline 200ms ease-out, box-shadow 200ms ease-out; }

#rec-carousel__recently-viewed { display: flex; }

#rec-carousel__recently-viewed .rec-carousel-slide { flex: 0 0 calc(25% - 1.25rem); margin-left: 0.625rem; margin-right: 0.625rem; max-width: calc(25% - 1.25rem); }

@media (min-width: 37.5em) {
  #rec-carousel__recently-viewed .rec-carousel-slide { flex-basis: calc(14.2857% - 1.25rem); max-width: calc(14.2857% - 1.25rem); }
}

@media (min-width: 56.25em) {
  #rec-carousel__recently-viewed .rec-carousel-slide { flex-basis: calc(10% - 1.25rem); max-width: calc(10% - 1.25rem); }
}

#rec-carousel__recently-viewed .rec-carousel-slide .rec-recently-viewed-fragment-wrapper > a { display: block; margin-top: 0.125rem; }

#rec-carousel__recently-viewed .rec-carousel-slide .rec-recently-viewed-fragment-wrapper > a:focus-visible { box-shadow: 0 0 0 4px var(--skapa-focus-ring-internal, rgb(var(--colour-neutral-1, 255, 255, 255))); outline: 2px solid var(--skapa-focus-ring-external, rgb(var(--colour-neutral-7, 17, 17, 17))); outline-offset: 4px; transition: outline 200ms ease-out, box-shadow 200ms ease-out; }

#rec-carousel__recently-viewed .rec-carousel-slide .rec-recently-viewed-skeleton { height: 0px; padding-bottom: 100%; }

#rec-carousel__recently-viewed .rec-carousel-slide .product-image { border-radius: 0.4rem; display: block; margin: auto; max-width: 100%; height: auto; width: auto; }

#rec-carousel__recently-viewed .rec-carousel-slide:first-child { margin-left: 1rem; }

#rec-carousel__recently-viewed .rec-carousel-slide:last-child { margin-right: 0px; }

.rec-recently-viewed-page-container { max-width: 112rem; margin: 0px auto; padding: 0px 1.25rem; box-sizing: border-box; }

@media (min-width: 37.5em) {
  .rec-recently-viewed-page-container { padding: 0px 2rem; }
}

@media (min-width: 56.25em) {
  .rec-recently-viewed-page-container { padding: 0px 3rem; }
}