@charset "utf-8";

@keyframes modal-delayed-fade-in { 
  0% { opacity: 0; }
  50% { opacity: 0; }
  100% { opacity: 1; }
}

@keyframes rec-modalSlideToLeft { 
  0% { transform: translateX(100%); }
  100% { transform: translateX(0px); }
}

@keyframes rec-modalSlideToRight { 
  0% { transform: translateX(0px); }
  100% { transform: translateX(100%); }
}

@keyframes rec-modalSlideFromLeft { 
  0% { transform: translateX(-100%); }
  100% { transform: translateX(0px); }
}

@keyframes rec-modalSlideFromRight { 
  0% { transform: translateX(0px); }
  100% { transform: translateX(-100%); }
}

@keyframes rec-modalSlideDown { 
  0% { transform: translateY(0px); }
  100% { transform: translateY(100%); }
}

@keyframes rec-modalSlideUp { 
  0% { transform: translateY(100%); }
  100% { transform: translateY(0px); }
}

@keyframes rec-modalEnter { 
  0% { clip-path: inset(50%); }
  100% { clip-path: inset(0%); }
}

@keyframes rec-modalClose { 
  0% { clip-path: inset(0%); }
  100% { clip-path: inset(50%); }
}

@keyframes rec-modalContentEnter { 
  0% { transform: scale(0.8); opacity: 0; transform-origin: center center; }
  100% { transform: scale(1); opacity: 1; transform-origin: center center; }
}

@keyframes rec-modalContentClose { 
  0% { transform: scale(1); opacity: 1; transform-origin: center center; }
  100% { transform: scale(0.8); opacity: 0; transform-origin: center center; }
}

@keyframes rec-modalBackdropEnter { 
  0% { visibility: hidden; }
  1% { visibility: visible; }
}

@keyframes rec-modalBackdropClose { 
  0%, 99% { visibility: visible; }
  100% { visibility: hidden; }
}

.rec-prevent-scroll-y { overflow: hidden; position: fixed; width: 100%; }

.rec-modal-wrapper { position: fixed; inset: 0px; display: flex; justify-content: center; align-items: center; z-index: 400; pointer-events: none; transition: visibility 200ms cubic-bezier(0, 0, 1, 1); color: rgb(var(--colour-text-and-icon-2, 72, 72, 72)); }

.rec-modal-wrapper__backdrop { position: absolute; inset: 0px; opacity: 0; transition: opacity 200ms cubic-bezier(0, 0, 1, 1); pointer-events: none; visibility: hidden; }

.rec-modal-wrapper__backdrop--dark { background: rgba(var(--colour-static-black, 17, 17, 17), 0.4); }

.rec-modal-wrapper--open { pointer-events: all; }

.rec-modal-wrapper--open > .rec-modal-wrapper__backdrop { opacity: 1; animation: 200ms ease 0s 1 normal none running rec-modalBackdropEnter; visibility: visible; pointer-events: all; }

.rec-modal-wrapper--close > .rec-modal-wrapper__backdrop { animation: 200ms ease 0s 1 normal none running rec-modalBackdropClose; }

.rec-modal-wrapper .rec-btn[data-autofocus]: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-footer { padding: 1.5rem; border-top: 1px solid rgb(var(--colour-neutral-3, 223, 223, 223)); flex-grow: 1; flex-shrink: 0; display: flex; }

.rec-modal-footer .rec-btn { flex-grow: 1; width: 100%; flex-basis: auto; }

.rec-modal-footer .rec-btn:not(:last-child) { margin-right: 0px; margin-bottom: 0.75rem; }

.rec-modal-footer--dual-action { flex-direction: column; }

.rec-modal-footer--borderless { border-top: none; }

@media (orientation: landscape), (min-width: 37.5em) {
  .rec-modal-footer .rec-btn:not(:last-child) { margin-bottom: 1rem; }
  .rec-modal-footer--dual-action:not(.rec-modal-footer--stacked) { flex-direction: row; }
  .rec-modal-footer--dual-action:not(.rec-modal-footer--stacked) .rec-btn:not(:last-child) { margin-right: 1rem; margin-bottom: 0px; }
}

.rec-modal-header { box-sizing: border-box; top: 0px; display: flex; justify-content: space-between; flex-direction: row-reverse; padding: 0px 0.5rem; align-items: center; background-color: rgb(var(--colour-elevation-2, 255, 255, 255)); z-index: 100; flex: 0 0 3.5rem; }

.rec-modal-header--floating-header { position: absolute; width: 100%; background-color: rgba(0, 0, 0, 0); }

.rec-modal-header--floating-header .rec-modal-header__close, .rec-modal-header--floating-header .rec-modal-header__back-button { margin: 1rem 0px 0px; }

.rec-modal-header__title-wrapper { width: 100%; text-align: center; margin: 1rem 0.5rem; }

.rec-modal-header__title-wrapper--padded { margin-left: 3rem; }

.rec-modal-header__close, .rec-modal-header__back-button { margin-top: 0.5rem; margin-bottom: 0.5rem; }

[dir="rtl"] .rec-modal-header__close, [dir="rtl"] .rec-modal-header__back-button { transform: scaleX(-1); }

.rec-modal-header__title { font-weight: 700; color: rgb(var(--colour-text-and-icon-1, 17, 17, 17)); }

.rec-modal-header .rec-modal-header__title-wrapper > * { font-size: 1rem; line-height: 1.5; }

.rec-modal-body { padding: var(--skapa-modal-body-padding-block, 1.5rem) var(--skapa-modal-body-padding-inline, 1.5rem); }

.rec-sheets--enter { animation: 200ms cubic-bezier(0, 0, 0.1, 1) 0s 1 normal none running rec-modalSlideUp; }

.rec-sheets--preserve-alignment { animation: 200ms cubic-bezier(0, 0, 0.1, 1) 0s 1 normal none running rec-modalSlideToLeft; }

.rec-sheets--preserve-alignment.rec-sheets--mirrored { animation: 200ms cubic-bezier(0, 0, 0.1, 1) 0s 1 normal none running rec-modalSlideFromLeft; }

.rec-sheets--close { animation: 100ms cubic-bezier(0.9, 0, 1, 1) 0s 1 normal forwards running rec-modalSlideDown; pointer-events: none; transition: visibility 100ms cubic-bezier(0, 0, 1, 1); visibility: hidden; }

.rec-sheets--close.rec-sheets--preserve-alignment { animation: 100ms cubic-bezier(0.9, 0, 1, 1) 0s 1 normal forwards running rec-modalSlideToRight; }

.rec-sheets--close.rec-sheets--preserve-alignment.rec-sheets--mirrored { animation: 100ms cubic-bezier(0.9, 0, 1, 1) 0s 1 normal forwards running rec-modalSlideFromRight; }

[dir="rtl"] .rec-sheets--preserve-alignment { animation: 200ms cubic-bezier(0, 0, 0.1, 1) 0s 1 normal none running rec-modalSlideFromLeft; }

[dir="rtl"] .rec-sheets--preserve-alignment.rec-sheets--mirrored { animation: 200ms cubic-bezier(0, 0, 0.1, 1) 0s 1 normal none running rec-modalSlideToLeft; }

[dir="rtl"] .rec-sheets--close { animation: 100ms cubic-bezier(0.9, 0, 1, 1) 0s 1 normal forwards running rec-modalSlideDown; pointer-events: none; }

[dir="rtl"] .rec-sheets--close.rec-sheets--preserve-alignment { animation: 100ms cubic-bezier(0.9, 0, 1, 1) 0s 1 normal forwards running rec-modalSlideFromRight; }

[dir="rtl"] .rec-sheets--close.rec-sheets--preserve-alignment.rec-sheets--mirrored { animation: 100ms cubic-bezier(0.9, 0, 1, 1) 0s 1 normal forwards running rec-modalSlideToRight; }

.rec-sheets { position: absolute; top: auto; right: var(--modal-keyboard-focus-spacing, 0); bottom: 0px; width: calc(100% - var(--modal-keyboard-focus-width, 0%)); background: rgb(var(--colour-elevation-2, 255, 255, 255)); z-index: 100; overflow: hidden; border-radius: 8px 8px 0px 0px; max-height: calc(100% - 3rem); text-align: initial; display: flex; flex-direction: column; }

.rec-sheets: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; --modal-keyboard-focus-spacing: 0.375rem; --modal-keyboard-focus-width: 0.75rem; }

.rec-sheets__content { height: 100%; }

.rec-sheets__content-wrapper { overflow: auto; height: 100%; position: relative; }

.rec-sheets__content-wrapper:focus-visible { box-shadow: inset 0 0 0 2px rgb(var(--colour-neutral-7, 17, 17, 17)); }

.rec-sheets__video { z-index: 100; background: rgba(var(--colour-static-black, 17, 17, 17), 0.8); }

.rec-sheets__video iframe { max-width: 100%; }

.rec-sheets--preserve-alignment { width: 85%; top: var(--modal-keyboard-focus-spacing, 0); border-radius: 8px 0px 0px 8px; max-height: calc(100% - var(--modal-keyboard-focus-width, 0%)); }

.rec-sheets--preserve-alignment.rec-sheets--mirrored { right: auto; left: var(--modal-keyboard-focus-spacing, 0); border-radius: 0px 8px 8px 0px; }

.rec-sheets--mobile-full-size { top: 3rem; }

.rec-sheets .rec-modal-footer { padding: 1.5rem 1rem; }

[dir="rtl"] .rec-sheets--preserve-alignment { left: var(--modal-keyboard-focus-spacing, 0); right: auto; border-radius: 0px 8px 8px 0px; }

[dir="rtl"] .rec-sheets--preserve-alignment.rec-sheets--mirrored { right: var(--modal-keyboard-focus-spacing, 0); left: auto; border-radius: 8px 0px 0px 8px; }

@media (prefers-contrast: more) {
  .rec-sheets { border-top-color: ; border-top-style: ; border-top-width: ; border-right-color: ; border-right-style: ; border-right-width: ; border-bottom-color: ; border-bottom-style: ; border-left-color: ; border-left-style: ; border-left-width: ; border-image-source: ; border-image-slice: ; border-image-width: ; border-image-outset: ; border-image-repeat: ; border-bottom-width: 0px; }
}

.rec-theatre--enter { animation: 200ms cubic-bezier(0, 0, 0.1, 1) 0s 1 normal none running rec-modalEnter; }

.rec-theatre--enter .rec-theatre__animation-group { animation: 200ms cubic-bezier(0, 0, 0.1, 1) 0s 1 normal none running rec-modalContentEnter; }

.rec-theatre--close { animation: 200ms cubic-bezier(0.9, 0, 1, 1) 0s 1 normal forwards running rec-modalClose; pointer-events: none; transition: visibility 100ms cubic-bezier(0, 0, 1, 1); visibility: hidden; }

.rec-theatre--close .rec-theatre__animation-group { animation: 200ms cubic-bezier(0.9, 0, 1, 1) 0s 1 normal forwards running rec-modalContentClose; }

.rec-theatre { position: absolute; left: var(--modal-keyboard-focus-spacing, 0); width: calc(100% - var(--modal-keyboard-focus-width, 0%)); top: 3rem; height: calc(100% - 3rem); border-radius: 8px 8px 0px 0px; background: rgb(var(--colour-elevation-2, 255, 255, 255)); z-index: 100; overflow: hidden; display: flex; flex-shrink: 0; flex-direction: column; text-align: initial; }

.rec-theatre: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; --modal-keyboard-focus-spacing: 0.375rem; --modal-keyboard-focus-width: 0.75rem; }

.rec-theatre__animation-group { display: flex; flex-direction: column; height: 100%; }

.rec-theatre__content-wrapper { overflow: auto; }

.rec-theatre__video { z-index: 100; background: rgba(var(--colour-static-black, 17, 17, 17), 0.8); }

.rec-theatre__video iframe { max-width: 100%; }

@media (prefers-contrast: more) {
  .rec-theatre { border-top-color: ; border-top-style: ; border-top-width: ; border-right-color: ; border-right-style: ; border-right-width: ; border-bottom-color: ; border-bottom-style: ; border-left-color: ; border-left-style: ; border-left-width: ; border-image-source: ; border-image-slice: ; border-image-width: ; border-image-outset: ; border-image-repeat: ; border-bottom-width: 0px; }
}

.rec-prompt--enter { animation: 200ms cubic-bezier(0.8, 0, 0, 1) 0s 1 normal none running rec-modalContentEnter; }

.rec-prompt--close { animation: 100ms cubic-bezier(0.9, 0, 1, 1) 0s 1 normal forwards running rec-modalContentClose; pointer-events: none; transition: visibility 100ms cubic-bezier(0, 0, 1, 1); visibility: hidden; }

.rec-prompt { position: relative; left: auto; right: auto; display: flex; margin: 1.5rem; z-index: 100; overflow: hidden; flex-direction: column; justify-content: center; border-radius: 8px; text-align: initial; }

.rec-prompt: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-prompt__content-wrapper { background: rgb(var(--colour-elevation-2, 255, 255, 255)); max-height: 75vh; max-width: 31.5rem; height: auto; overflow: hidden; display: flex; flex-direction: column; }

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

.rec-prompt__content { color: rgb(var(--colour-text-and-icon-2, 72, 72, 72)); font-size: 0.875rem; line-height: 1.571; padding: 0px 2rem; overflow: auto; height: 100%; }

.rec-prompt__content:focus-visible { box-shadow: inset 0 0 0 2px rgb(var(--colour-neutral-7, 17, 17, 17)); }

.rec-prompt .rec-modal-header { padding: 0.5rem 0.5rem 0px; }

.rec-prompt .rec-modal-header__close { margin: 0px; }

.rec-prompt .rec-prompt__content { padding-bottom: 0px; }

@media (prefers-contrast: more) {
  .rec-prompt { border: 1px solid rgb(var(--colour-elevation-1-border, 223, 223, 223)); }
}

@media (min-width: 37.5em) {
  .rec-sheets { top: var(--modal-keyboard-focus-spacing, 0); border-radius: 8px 0px 0px 8px; width: calc(100% - 3rem); max-height: calc(100% - var(--modal-keyboard-focus-width, 0%)); }
  .rec-sheets--mirrored { right: auto; left: var(--modal-keyboard-focus-spacing, 0); border-radius: 0px 8px 8px 0px; }
  .rec-sheets--mirrored .rec-modal-footer:not(.rec-modal-footer--stacked) { flex-direction: row-reverse; }
  .rec-sheets--mirrored .rec-modal-footer:not(.rec-modal-footer--stacked) .rec-btn:not(:last-child) { margin: 0px 0px 0px 1rem; }
  .rec-sheets--small { max-width: 30rem; }
  .rec-sheets--small .rec-modal-body { --skapa-modal-body-padding-inline: 1.5rem; }
  .rec-sheets--medium { max-width: 45rem; }
  .rec-sheets--medium .rec-modal-footer:not(.rec-modal-footer--dual-action) .rec-btn { width: auto; flex: initial; }
  .rec-sheets--large { max-width: 67.5rem; }
  .rec-sheets--medium .rec-modal-footer--dual-action .rec-btn:not(:last-child), .rec-sheets--large .rec-modal-footer--dual-action .rec-btn:not(:last-child) { margin-right: 1rem; }
  .rec-sheets--large .rec-modal-footer .rec-btn { width: auto; flex: initial; }
  .rec-sheets .rec-modal-footer { padding: 1.5rem; }
  [dir="rtl"] .rec-sheets { right: auto; left: var(--modal-keyboard-focus-spacing, 0); border-radius: 0px 8px 8px 0px; }
  [dir="rtl"] .rec-sheets--mirrored { right: var(--modal-keyboard-focus-spacing, 0); left: auto; border-radius: 8px 0px 0px 8px; }
}

@media (min-width: 37.5em) and (prefers-contrast: more) {
  .rec-sheets { border-bottom-width: 1px; border-right-width: 0px; }
}

@media (min-width: 37.5em) {
  .rec-sheets.rec-sheets--enter { animation: 200ms cubic-bezier(0, 0, 0.1, 1) 0s 1 normal none running rec-modalSlideToLeft; }
  .rec-sheets.rec-sheets--close { animation: 100ms cubic-bezier(0.9, 0, 1, 1) 0s 1 normal forwards running rec-modalSlideToRight; }
  .rec-sheets--mirrored.rec-sheets--enter { animation: 200ms cubic-bezier(0, 0, 0.1, 1) 0s 1 normal none running rec-modalSlideFromLeft; }
  .rec-sheets--mirrored.rec-sheets--close { animation: 100ms cubic-bezier(0.9, 0, 1, 1) 0s 1 normal forwards running rec-modalSlideFromRight; }
  [dir="rtl"] .rec-sheets.rec-sheets--enter { animation: 200ms cubic-bezier(0, 0, 0.1, 1) 0s 1 normal none running rec-modalSlideFromLeft; }
  [dir="rtl"] .rec-sheets.rec-sheets--close { animation: 100ms cubic-bezier(0.9, 0, 1, 1) 0s 1 normal forwards running rec-modalSlideFromRight; }
  [dir="rtl"] .rec-sheets--mirrored.rec-sheets--enter { animation: 200ms cubic-bezier(0, 0, 0.1, 1) 0s 1 normal none running rec-modalSlideToLeft; }
  [dir="rtl"] .rec-sheets--mirrored.rec-sheets--close { animation: 100ms cubic-bezier(0.9, 0, 1, 1) 0s 1 normal forwards running rec-modalSlideToRight; }
  .rec-modal-body { --skapa-modal-body-padding-block: 2rem; --skapa-modal-body-padding-inline: 2rem; }
  .rec-modal-header { padding: 0px 1rem; flex: 0 0 4.5rem; }
  .rec-modal-header__close, .rec-modal-header__back-button { margin-top: 1rem; margin-bottom: 1rem; }
  .rec-modal-header--floating-header .rec-modal-header__close, .rec-modal-header--floating-header .rec-modal-header__back-button { margin: 1.5rem 0px 0.5rem; }
  .rec-prompt__heading { font-size: 1.5rem; line-height: 1.45; letter-spacing: -0.0042em; }
  .rec-prompt__content { color: rgb(var(--colour-text-and-icon-2, 72, 72, 72)); font-size: 1rem; line-height: 1.625; padding-bottom: 1rem; }
}

@media (min-width: 56.25em) {
  .rec-sheets--small .rec-modal-body { --skapa-modal-body-padding-inline: 2rem; }
  .rec-theatre { border-radius: 8px; left: 3rem; width: calc(100% - 6rem); height: calc(100% - 6rem); }
}

@media (min-width: 56.25em) and (prefers-contrast: more) {
  .rec-theatre { border-bottom-width: 1px; }
}

@media (min-width: 75em) {
  .rec-sheets .rec-modal-body { --skapa-modal-body-padding-inline: 2.5rem; }
}

@media (prefers-reduced-motion) {
  .rec-modal-wrapper { transition: none; }
  .rec-modal-wrapper__backdrop { animation-duration: 0s; transition: none; }
  .rec-modal-wrapper .rec-sheets.rec-sheets--enter, .rec-modal-wrapper .rec-sheets.rec-sheets--close, .rec-modal-wrapper .rec-sheets.rec-sheets--preserve-alignment, .rec-modal-wrapper .rec-sheets.rec-sheets--mirrored { animation-duration: 0s; transition-duration: 0s; }
  .rec-modal-wrapper .rec-theatre.rec-theatre--enter, .rec-modal-wrapper .rec-theatre.rec-theatre--close { animation-duration: 0s; transition-duration: 0s; }
  .rec-modal-wrapper .rec-theatre.rec-theatre--enter .rec-theatre__animation-group, .rec-modal-wrapper .rec-theatre.rec-theatre--close .rec-theatre__animation-group { animation-duration: 0s; transition-duration: 0s; }
  .rec-modal-wrapper .rec-prompt--close { transition: none; }
  .rec-modal-wrapper .rec-prompt, .rec-modal-wrapper .rec-prompt--enter, .rec-modal-wrapper .rec-prompt--close { animation-duration: 0s; transition-duration: 0s; }
  .rec-modal-wrapper .rec-prompt .rec-prompt__content-wrapper, .rec-modal-wrapper .rec-prompt--enter .rec-prompt__content-wrapper, .rec-modal-wrapper .rec-prompt--close .rec-prompt__content-wrapper { animation-duration: 0s; transition-duration: 0s; }
}

.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-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-link--white { color: rgb(var(--colour-static-white, 255, 255, 255)); }

.rec-link--white:hover, .rec-link--white:focus, .rec-link--white:active { color: rgb(var(--colour-static-light-grey, 245, 245, 245)); }

.rec-link--white.rec-link--disabled { cursor: default; pointer-events: none; opacity: 0.4; color: rgb(var(--colour-static-white, 255, 255, 255)); }

.rec-link--white.rec-link--disabled:hover { color: rgb(var(--colour-static-white, 255, 255, 255)); }

.rec-link--white.rec-link--disabled:focus, .rec-link--white.rec-link--disabled:active { color: rgb(var(--colour-static-white, 255, 255, 255)); }

.rec-link--white.rec-link--disabled:focus::before { border: 0px; }

.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-link { text-decoration: underline; font-weight: 400; color: rgb(var(--colour-text-and-icon-2, 72, 72, 72)); }

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

.rec-link--disabled { cursor: default; pointer-events: none; opacity: 0.4; }

.rec-link--disabled:focus::before { border: 0px; }

.rec-link--black { color: rgb(var(--colour-text-and-icon-1, 17, 17, 17)); }

.rec-link--black:hover, .rec-link--black:focus, .rec-link--black:active { color: rgb(var(--colour-text-and-icon-2, 72, 72, 72)); }

.rec-link--black.rec-link--disabled { cursor: default; pointer-events: none; opacity: 0.4; color: rgb(var(--colour-text-and-icon-1, 17, 17, 17)); }

.rec-link--black.rec-link--disabled:hover { color: rgb(var(--colour-text-and-icon-1, 17, 17, 17)); }

.rec-link--black.rec-link--disabled:focus, .rec-link--black.rec-link--disabled:active { color: rgb(var(--colour-text-and-icon-1, 17, 17, 17)); }

.rec-link--black.rec-link--disabled:focus::before { border: 0px; }

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

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

.rec-link--grey.rec-link--disabled { cursor: default; pointer-events: none; opacity: 0.4; color: rgb(var(--colour-text-and-icon-2, 72, 72, 72)); }

.rec-link--grey.rec-link--disabled:hover { color: rgb(var(--colour-text-and-icon-2, 72, 72, 72)); }

.rec-link--grey.rec-link--disabled:focus, .rec-link--grey.rec-link--disabled:active { color: rgb(var(--colour-text-and-icon-2, 72, 72, 72)); }

.rec-link--grey.rec-link--disabled:focus::before { border: 0px; }

.rec-link--white { color: rgb(var(--colour-static-white, 255, 255, 255)); }

.rec-link--white:hover, .rec-link--white:focus, .rec-link--white:active { color: rgb(var(--colour-static-light-grey, 245, 245, 245)); }

.rec-link--white.rec-link--disabled { cursor: default; pointer-events: none; opacity: 0.4; color: rgb(var(--colour-static-white, 255, 255, 255)); }

.rec-link--white.rec-link--disabled:hover { color: rgb(var(--colour-static-white, 255, 255, 255)); }

.rec-link--white.rec-link--disabled:focus, .rec-link--white.rec-link--disabled:active { color: rgb(var(--colour-static-white, 255, 255, 255)); }

.rec-link--white.rec-link--disabled:focus::before { border: 0px; }

.rec-link--subtle { text-decoration: none; }

.rec-link--subtle:focus, .rec-link--subtle:hover, .rec-link--subtle:active { text-decoration: underline; }

.rec-inline-message { position: relative; display: flex; align-items: flex-start; height: auto; background-color: rgb(var(--colour-elevation-1, 255, 255, 255)); box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 16px; border-radius: 4px; border-top-color: ; border-top-style: ; border-top-width: ; border-right-color: ; border-right-style: ; border-right-width: ; border-bottom-color: ; border-bottom-style: ; border-bottom-width: ; border-left-color: ; border-left-style: ; border-image-source: ; border-image-slice: ; border-image-width: ; border-image-outset: ; border-image-repeat: ; border-left-width: 0.25rem; padding: 1rem 0.5rem 1rem 0px; min-height: 1.5rem; text-align: left; font-size: 0.875rem; box-sizing: border-box; }

.rec-inline-message a { text-decoration: underline; }

.rec-inline-message__content { width: 100%; padding-right: 1.5rem; }

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

.rec-inline-message__actions { display: flex; justify-content: flex-end; margin-top: 0.5rem; }

.rec-inline-message__actions .rec-btn:last-child { margin-left: 0.25rem; }

.rec-inline-message__close-button { margin-top: -0.5rem; }

.rec-inline-message__title { line-height: 1.571; font-size: 0.875rem; font-weight: 700; padding-bottom: 0.25rem; color: rgb(var(--colour-text-and-icon-1, 17, 17, 17)); margin: 0px; }

.rec-inline-message__icon { flex-shrink: 0; margin-left: 0.75rem; margin-right: 0.75rem; }

.rec-inline-message--dismissable .rec-inline-message__content { padding-right: 0.5rem; }

.rec-inline-message--icon-hidden { padding-left: 0.75rem; }

.rec-inline-message--subtle { border: 0px; box-shadow: none; padding: 0px; overflow: visible; background: none; }

.rec-inline-message--subtle .rec-inline-message__close-button { margin-top: -0.25rem; }

.rec-inline-message--subtle .rec-inline-message__icon { margin-left: 0px; }

.rec-inline-message--closed { transition: 200ms cubic-bezier(0.4, 0, 0.4, 1); padding-top: 0px; padding-bottom: 0px; visibility: hidden; opacity: 0; overflow: hidden; min-height: 0px; }

.rec-inline-message--collapsed { display: none; }

.rec-inline-message--informative { border-left-color: rgb(var(--colour-semantic-informative, 0, 88, 163)); }

.rec-inline-message--informative .rec-inline-message__icon { color: rgb(var(--colour-semantic-informative, 0, 88, 163)); }

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

.rec-inline-message--positive .rec-inline-message__icon { color: rgb(var(--colour-semantic-positive, 10, 138, 0)); }

.rec-inline-message--cautionary { border-left-color: rgb(var(--colour-semantic-caution, 242, 106, 47)); }

.rec-inline-message--cautionary .rec-inline-message__icon { color: rgb(var(--colour-semantic-caution, 242, 106, 47)); }

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

.rec-inline-message--negative .rec-inline-message__icon { color: rgb(var(--colour-semantic-negative, 224, 7, 81)); }

@media (prefers-contrast: more) {
  .rec-inline-message { border-top-width: 1px; border-bottom-width: 1px; border-right-width: 1px; }
}

.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-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-image { position: relative; display: block; max-width: 100%; height: auto; }

.rec-image__icon { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); color: rgb(var(--colour-text-and-icon-4, 146, 146, 146)); }

.rec-image--fallback { padding-bottom: 100%; background: rgb(var(--colour-neutral-2, 245, 245, 245)); }

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

.rec-modal-wrapper .rec-sheets__content-wrapper { overflow-x: hidden !important; }

.rec-modal-wrapper img { border-radius: 0.4rem; }

.rec-modal-wrapper .rec-modal__divider { border-top: none; border-right: none; border-left: none; border-image: initial; background-color: rgba(0, 0, 0, 0); margin: 1.5rem -3rem 0.5rem; border-bottom: 1px solid rgb(var(--colour-neutral-3, 223, 223, 223)); }

.rec-modal-wrapper .rec-modal__divider-footer { border-top: none; border-right: none; border-left: none; border-image: initial; background-color: rgba(0, 0, 0, 0); margin: 0.3rem -2rem; border-bottom: 1px solid rgb(var(--colour-neutral-3, 223, 223, 223)); }

.rec-modal-wrapper .rec-sheet-modal .rec-modal-header__title-wrapper { margin-left: 1.5rem; }

.rec-modal-wrapper .rec-sheet-modal .rec-modal-body { padding: 0px 2rem; }

.rec-modal-wrapper .rec-added-product-wrapper { display: grid; grid-template-columns: 0.5fr 1fr; gap: 1rem 0.5rem; }

.rec-modal-wrapper .rec-added-product-wrapper .rec-inline-message { margin: 0.75rem 0px 1.5rem; }

.rec-modal-wrapper .rec-added-product-wrapper .rec-product__information { align-self: center; margin: 0px 0.75rem; max-width: 16rem; }

.rec-modal-wrapper .rec-added-product-wrapper .rec-product__name { font-weight: bold; }

.rec-modal-wrapper .rec-added-product-wrapper .rec-product__description { font-size: 0.875rem; margin-bottom: 0.5rem; }

.rec-modal-wrapper .rec-added-product-wrapper .rec-extra-text { grid-column: 1 / -1; font-size: 0.675rem; }

.rec-modal-wrapper .rec-sheet-modal .rec-modal__sticky-header { position: sticky; top: 0px; background: rgb(var(--colour-elevation-2, 255, 255, 255)); z-index: 403; }

.rec-modal-wrapper .rec-sheet-modal .rec-product__image { max-height: 8rem; width: 100px; margin-right: 1rem; }

.rec-modal-wrapper .rec-sheet-modal .rec-modal__buttons { margin-top: 1rem; }

.rec-modal-wrapper .rec-sheet-modal .rec-modal__buttons .rec-btn { padding-bottom: 0.5rem; }

.rec-modal-wrapper .rec-sheet-modal .rec-teaser__info-container { margin-bottom: unset; }

.rec-modal-wrapper .rec-sheet-modal .pip-commercial-message { margin-top: 2rem; }