@rikstv/shared-components 0.6.4 → 0.6.9

package/dist/accordion/Accordion.css

@@ -0,0 +1 @@
+.rds-link{font-family:inherit;font-size:inherit;font-weight:inherit;line-height:inherit;color:var(--rds-foreground-primary);transition:75ms ease color}.rds-link:visited{color:var(--rds-foreground-primary)}.rds-link:hover{text-decoration-thickness:2px;color:var(--rds-heading-accent)}.rds-link:active{text-decoration:none;text-shadow:0px 0px 1px var(--rds-foreground-primary)}.rds-link--active,.rds-link[aria-current=page]{text-shadow:0px 0px 1px var(--rds-foreground-primary)}.rds-link:focus::-moz-focus-inner{border-style:none;outline:0}.rds-link:focus button::-moz-focus-inner,.rds-link:focus [type=button]::-moz-focus-inner,.rds-link:focus [type=reset]::-moz-focus-inner,.rds-link:focus [type=submit]::-moz-focus-inner{border-style:none}.rds-link:focus input[type=button]::-moz-focus-inner{outline:0}html:not([data-mousenavigation]):not([data-touchnavigation]) .rds-link:focus{outline-offset:2px;outline:2px solid var(--rds-feedback-info);transition:outline-offset .25s ease}.rds-display-title{font-family:var(--rds-font-family-lg-headlines);font-size:clamp(2.5rem,calc(1.4285714286rem + 2.9761904762vw),5rem);font-weight:normal;line-height:1.2;color:var(--rds-foreground-primary)}.rds-title-1{font-family:var(--rds-font-family-lg-headlines);font-size:clamp(1.875rem,calc(1.1785714286rem + 1.9345238095vw),3.5rem);font-weight:normal;line-height:1.2;color:var(--rds-foreground-primary)}.rds-title-2{font-family:var(--rds-font-family-lg-headlines);font-size:clamp(1.5rem,calc(1.0714285714rem + 1.1904761905vw),2.5rem);font-weight:normal;line-height:1.2;color:var(--rds-foreground-primary)}.rds-title-3{font-family:var(--rds-font-family-m-headlines);font-size:clamp(1.25rem,calc(1.1964285714rem + .1488095238vw),1.375rem);font-weight:normal;line-height:1.2;color:var(--rds-heading-accent)}.rds-title-4{font-family:var(--rds-font-family-m-headlines);font-size:clamp(1rem,calc(.9464285714rem + .1488095238vw),1.125rem);font-weight:normal;line-height:1.2;color:var(--rds-foreground-primary)}.rds-body{font-family:var(--rds-font-family-body);font-size:clamp(1rem,calc(.9464285714rem + .1488095238vw),1.125rem);font-weight:normal;line-height:1.5;color:var(--rds-foreground-primary)}.rds-sub-body{font-family:var(--rds-font-family-body);font-size:clamp(.875rem,calc(.8214285714rem + .1488095238vw),1rem);font-weight:normal;line-height:1.5;color:var(--rds-foreground-primary)}.rds-tag{font-family:var(--rds-font-family-headlines);text-transform:uppercase;font-size:clamp(.75rem,calc(.6964285714rem + .1488095238vw),.875rem);line-height:1.2;font-weight:normal;letter-spacing:.09375rem;color:var(--rds-foreground-primary)}.rds-bold,.rds-accordion-details__summary{font-family:var(--rds-font-family-headlines);font-size:clamp(1.125rem,calc(1.125rem + 0vw),1.125rem);font-weight:normal;line-height:1.5;color:var(--rds-foreground-primary)}.rds-meta{font-family:var(--rds-font-family-body);font-size:clamp(.75rem,calc(.6964285714rem + .1488095238vw),.875rem);font-weight:normal;line-height:1.5;color:var(--rds-foreground-overlay-heavy)}.rds-link--light,.rds-light .rds-link{color:var(--rds-background-primary)}.rds-link--light:hover,.rds-light .rds-link:hover{color:var(--rds-foreground-tertiary)}.rds-link--light:active,.rds-light .rds-link:active{text-shadow:0px 0px 1px var(--rds-background-primary)}.rds-link--light:visited,.rds-light .rds-link:visited{color:var(--rds-background-primary)}.rds-link--light--active,.rds-link--light[aria-current=page],.rds-light [aria-current=page].rds-link{text-shadow:0px 0px 1px var(--rds-background-primary)}.rds-light .rds-display-title{color:var(--rds-foreground-tertiary)}.rds-display-title--light{color:var(--rds-foreground-tertiary)}.rds-light .rds-title-1{color:var(--rds-button-primary-fg)}.rds-title-1--light{color:var(--rds-button-primary-fg)}.rds-light .rds-title-2{color:var(--rds-button-primary-fg)}.rds-title-2--light{color:var(--rds-button-primary-fg)}.rds-light .rds-title-3{color:var(--rds-button-primary-fg)}.rds-title-3--light{color:var(--rds-button-primary-fg)}.rds-light .rds-title-4{color:var(--rds-button-primary-fg)}.rds-title-4--light{color:var(--rds-button-primary-fg)}.rds-light .rds-body{color:var(--rds-background-primary)}.rds-body--light{color:var(--rds-background-primary)}.rds-light .rds-sub-body{color:var(--rds-button-primary-fg)}.rds-sub-body--light{color:var(--rds-button-primary-fg)}.rds-light .rds-tag{color:var(--rds-background-primary)}.rds-tag--light{color:var(--rds-background-primary)}.rds-light .rds-bold,.rds-light .rds-accordion-details__summary{color:var(--rds-background-primary)}.rds-bold--light{color:var(--rds-background-primary)}.rds-light .rds-meta{color:var(--rds-button-primary-fg)}.rds-meta--light{color:var(--rds-button-primary-fg)}@keyframes details-sweep{0%{opacity:0}to{opacity:1}}.rds-accordion-details{border-radius:var(--rds-roundness--default);transition:125ms ease-in-out box-shadow}.rds-accordion-details:hover{box-shadow:0 8px 18px #0000004d}.rds-accordion-details[open]{--chevron-direction: 180deg;background-color:var(--rds-foreground-solid-soft);overflow:hidden}.rds-accordion-details[open] summary~*{animation:details-sweep .5s ease-in-out forwards}.rds-accordion-details[open] summary~*>*{--toggle-sweep-delay: 0;opacity:0;animation:details-sweep .5s ease-in-out forwards;animation-delay:var(--toggle-sweep-delay)}.rds-accordion-details[open]:hover{box-shadow:0 8px 18px #0000004d}.rds-accordion-details:not([open]){--chevron-direction: 0}.rds-accordion-details:not([open]):hover{box-shadow:none}.rds-accordion-details:not([open]):hover .rds-accordion-details__summary{box-shadow:0 8px 18px #0000004d}.rds-accordion-details__summary{transition:125ms ease-in-out box-shadow;border-radius:var(--rds-roundness--default);background-color:var(--rds-foreground-solid-soft);color:var(--rds-foreground-primary)!important;cursor:pointer;list-style:none;user-select:none;height:3rem;display:flex;align-items:center;align-self:center;position:relative;padding:8px 32px 8px 16px}.rds-accordion-details__summary:focus::-moz-focus-inner{border-style:none;outline:0}.rds-accordion-details__summary:focus button::-moz-focus-inner,.rds-accordion-details__summary:focus [type=button]::-moz-focus-inner,.rds-accordion-details__summary:focus [type=reset]::-moz-focus-inner,.rds-accordion-details__summary:focus [type=submit]::-moz-focus-inner{border-style:none}.rds-accordion-details__summary:focus input[type=button]::-moz-focus-inner{outline:0}html:not([data-mousenavigation]):not([data-touchnavigation]) .rds-accordion-details__summary:focus{outline-offset:2px;outline:2px solid var(--rds-feedback-info);transition:outline-offset .25s ease}.rds-accordion-details__summary>svg{height:100%;transform:rotate(var(--chevron-direction));transition:transform 125ms ease-in-out;transform-origin:center;position:absolute;right:18px;top:0}.rds-accordion-details__summary>svg>path{fill:var(--rds-foreground-primary)}.rds-accordion-details__summary__content{box-sizing:border-box;display:flex;align-items:center;height:100%}.rds-accordion-details__summary::marker,.rds-accordion-details__summary::-webkit-details-marker{display:none}.rds-accordion-details__summary~*{padding:0 32px 16px 16px}.rds-accordion-details--left>summary{padding:8px 32px 8px 64px}.rds-accordion-details--left>summary>svg{right:initial;left:18px}.rds-accordion-details--hide-default-text>summary{max-width:100%;height:100%;background-color:transparent;margin-bottom:0}.rds-accordion-details--light[open],.rds-light [open].rds-accordion-details{background-color:var(--rds-surface-foreground)}.rds-accordion-details--light .rds-accordion-details__summary,.rds-light .rds-accordion-details .rds-accordion-details__summary{background-color:var(--rds-surface-foreground)}

package/dist/accordion/Accordion.d.ts

@@ -0,0 +1,10 @@
+import { DetailedHTMLProps, FC, HTMLAttributes, ReactNode } from "react";
+import "./accordion.scss";
+interface Props extends DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement> {
+    heading: ReactNode;
+    initialOpen?: boolean;
+    alignChevronLeft?: boolean;
+    lightBackground?: boolean;
+}
+export declare const Accordion: FC<Props>;
+export {};

package/dist/accordion/Accordion.js

@@ -0,0 +1,73 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+import { useRef, useEffect } from "react";
+import { C as Chevron } from "../icons/Chevron.js";
+import { a as jsxs, j as jsx } from "../core/RiksTV.js";
+var accordion = "";
+const Accordion = (_a) => {
+  var _b = _a, {
+    initialOpen = true,
+    children,
+    heading,
+    className = "",
+    alignChevronLeft = false,
+    lightBackground = false
+  } = _b, rest = __objRest(_b, [
+    "initialOpen",
+    "children",
+    "heading",
+    "className",
+    "alignChevronLeft",
+    "lightBackground"
+  ]);
+  const ref = useRef(null);
+  useEffect(() => {
+    if (ref.current) {
+      ref.current.open = initialOpen;
+    }
+  }, [initialOpen]);
+  return /* @__PURE__ */ jsxs("details", __spreadProps(__spreadValues({
+    ref,
+    "data-testid": "rds-accordion",
+    className: `rds-accordion-details ${lightBackground ? "rds-accordion-details--light" : ""}  ${alignChevronLeft ? "rds-accordion-details--left" : ""} ${className}`
+  }, rest), {
+    children: [/* @__PURE__ */ jsxs("summary", {
+      "data-testid": "rds-accordion-summary",
+      className: "rds-accordion-details__summary",
+      children: [/* @__PURE__ */ jsx(Chevron, {}), /* @__PURE__ */ jsx("div", {
+        className: "rds-accordion-details__summary__content",
+        children: heading
+      })]
+    }), children]
+  }));
+};
+export { Accordion as A };

package/dist/accordion/accordion.scss

@@ -0,0 +1,126 @@
+@use "../typography/typography.scss";
+@use "../core/mixin/focus.scss";
+
+@keyframes details-sweep {
+  0% {
+    opacity: 0;
+  }
+  100% {
+    opacity: 1;
+  }
+}
+
+.rds-accordion-details {
+  border-radius: var(--rds-roundness--default);
+  transition: 125ms ease-in-out box-shadow;
+
+  &:hover {
+    box-shadow: 0px 8px 18px rgba(0, 0, 0, 0.3);
+  }
+
+  &[open] {
+    --chevron-direction: 180deg;
+    background-color: var(--rds-foreground-solid-soft);
+    overflow: hidden;
+
+    & summary ~ * {
+      animation: details-sweep 0.5s ease-in-out forwards;
+      & > * {
+        --toggle-sweep-delay: 0;
+        opacity: 0;
+        animation: details-sweep 0.5s ease-in-out forwards;
+        animation-delay: var(--toggle-sweep-delay);
+      }
+    }
+    &:hover {
+      box-shadow: 0px 8px 18px rgba(0, 0, 0, 0.3);
+    }
+  }
+
+  &:not([open]) {
+    --chevron-direction: 0;
+    &:hover {
+      box-shadow: none;
+      .rds-accordion-details__summary {
+        box-shadow: 0px 8px 18px rgba(0, 0, 0, 0.3);
+      }
+    }
+  }
+
+  &__summary {
+    @include focus.with-keyboard-focus();
+    @extend .rds-bold;
+    transition: 125ms ease-in-out box-shadow;
+    border-radius: var(--rds-roundness--default);
+    background-color: var(--rds-foreground-solid-soft);
+    color: var(--rds-foreground-primary) !important;
+    cursor: pointer;
+    list-style: none;
+    user-select: none;
+    height: 3rem;
+    display: flex;
+    align-items: center;
+    align-self: center;
+    position: relative;
+    padding: 8px 32px 8px 16px;
+
+    & > svg {
+      height: 100%;
+      & > path {
+        fill: var(--rds-foreground-primary);
+      }
+      transform: rotate(var(--chevron-direction));
+      transition: transform 125ms ease-in-out;
+      transform-origin: center;
+      position: absolute;
+      right: 18px;
+      top: 0;
+    }
+    &__content {
+      box-sizing: border-box;
+      display: flex;
+      align-items: center;
+      height: 100%;
+    }
+
+    &::marker,
+    &::-webkit-details-marker {
+      display: none;
+    }
+
+    & ~ * {
+      padding: 0px 32px 16px 16px;
+    }
+  }
+
+  &--left > summary {
+    padding: 8px 32px 8px 64px;
+
+    & > svg {
+      right: initial;
+      left: 18px;
+    }
+  }
+
+  &--hide-default-text > summary {
+    max-width: 100%;
+    height: 100%;
+    background-color: transparent;
+    margin-bottom: 0;
+  }
+}
+
+.rds-accordion-details--light {
+  &[open] {
+    background-color: var(--rds-surface-foreground);
+  }
+  .rds-accordion-details__summary {
+    background-color: var(--rds-surface-foreground);
+  }
+}
+
+.rds-light {
+  .rds-accordion-details {
+    @extend .rds-accordion-details--light;
+  }
+}

package/dist/button/BaseButton.d.ts

@@ -5,6 +5,7 @@ export interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
     icon?: () => JSX.Element;
     className?: string;
     iconClass?: string;
+    lightBackground?: boolean;
 }
 interface BaseButtonProps extends ButtonProps {
     buttonType: "primary" | "secondary" | "tertiary";

package/dist/button/BaseButton.js

@@ -1 +1,80 @@
-var t=Object.defineProperty,e=Object.defineProperties,r=Object.getOwnPropertyDescriptors,a=Object.getOwnPropertySymbols,o=Object.prototype.hasOwnProperty,s=Object.prototype.propertyIsEnumerable,n=(e,r,a)=>r in e?t(e,r,{enumerable:!0,configurable:!0,writable:!0,value:a}):e[r]=a;import{forwardRef as i}from"react";import{a as l,j as c}from"../core/RiksTV.js";const b=i(((t,i)=>{var b,d=t,{children:p,buttonType:u,buttonStyle:f,type:y="button",isLoading:m=!1,postfix:O,icon:_,iconClass:h="",disabled:j,className:v="","aria-busy":g}=d,x=((t,e)=>{var r={};for(var n in t)o.call(t,n)&&e.indexOf(n)<0&&(r[n]=t[n]);if(null!=t&&a)for(var n of a(t))e.indexOf(n)<0&&s.call(t,n)&&(r[n]=t[n]);return r})(d,["children","buttonType","buttonStyle","type","isLoading","postfix","icon","iconClass","disabled","className","aria-busy"]);return l("button",(b=((t,e)=>{for(var r in e||(e={}))o.call(e,r)&&n(t,r,e[r]);if(a)for(var r of a(e))s.call(e,r)&&n(t,r,e[r]);return t})({type:y},x),e(b,r({ref:i,disabled:m||j,"aria-busy":m||g,className:`${f} rds-button__shared rds-button__shared--${u} rds-button--${u} ${m?"rds-button--loading":""} ${v}`,children:[_&&c("span",{"data-testid":"rds-button__icon",className:`rds-button__icon ${h}`,children:c(_,{})}),p,!!O&&"rds-icon-button"!==f&&c("span",{className:"rds-button__postfix",children:O})]}))))}));b.displayName="BaseButton";export{b as B};
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+import { forwardRef } from "react";
+import { a as jsxs, j as jsx } from "../core/RiksTV.js";
+const BaseButton = forwardRef((_a, ref) => {
+  var _b = _a, {
+    children,
+    buttonType,
+    buttonStyle,
+    type = "button",
+    isLoading = false,
+    postfix,
+    icon: Icon,
+    iconClass = "",
+    lightBackground = false,
+    disabled,
+    className = "",
+    "aria-busy": ariaBusy
+  } = _b, rest = __objRest(_b, [
+    "children",
+    "buttonType",
+    "buttonStyle",
+    "type",
+    "isLoading",
+    "postfix",
+    "icon",
+    "iconClass",
+    "lightBackground",
+    "disabled",
+    "className",
+    "aria-busy"
+  ]);
+  return /* @__PURE__ */ jsxs("button", __spreadProps(__spreadValues({
+    type
+  }, rest), {
+    ref,
+    disabled: isLoading || disabled,
+    "aria-busy": isLoading || ariaBusy,
+    className: `${buttonStyle} rds-button__shared rds-button__shared--${buttonType} rds-button--${buttonType} ${isLoading ? "rds-button--loading" : ""} ${lightBackground ? "rds-light" : ""} ${className}`,
+    children: [Icon && /* @__PURE__ */ jsx("span", {
+      "data-testid": "rds-button__icon",
+      className: `rds-button__icon ${iconClass}`,
+      children: /* @__PURE__ */ jsx(Icon, {})
+    }), children, !!postfix && buttonStyle !== "rds-icon-button" && /* @__PURE__ */ jsx("span", {
+      className: "rds-button__postfix",
+      children: postfix
+    })]
+  }));
+});
+BaseButton.displayName = "BaseButton";
+export { BaseButton as B };

package/dist/button/Button.css

@@ -1 +1 @@
-.rds-button{padding:.78125rem var(--rds-spacing--32);border-radius:var(--rds-roundness--button);overflow-y:hidden;cursor:pointer;font-size:1.125rem}.rds-button__icon{display:flex;align-items:center;align-self:center;margin-right:var(--rds-spacing--16);width:1.125rem}.rds-button__icon>svg{width:100%}.rds-button__postfix{position:relative;display:flex;align-items:center;margin-left:var(--rds-spacing--16);padding-left:var(--rds-spacing--16)}.rds-button__postfix:before{content:" ";position:absolute;width:1px;background-color:currentColor;height:200%;left:0}.rds-button--loading:disabled{cursor:wait!important}.rds-button--loading:disabled:hover{box-shadow:none}.rds-button__shared{--common-button--primary-color: var(--rds-button-primary-fg);--common-button--primary-bg: var(--rds-accent-color);--common-button--primary-hover-bg: var(--rds-accent-hover);--common-button--primary-pressed-bg: var(--rds-accent-color);--common-button--secondary-border-color: var(--rds-foreground-primary);--common-button--secondary-color: var(--rds-foreground-primary);--common-button--secondary-bg: var(--rds-background-primary);--common-button--secondary-hover-color: var(--rds-background-primary);--common-button--secondary-hover-bg: var(--rds-foreground-primary);--common-button--secondary-pressed-color: var(--rds-button-secondary-pressed-fg);--common-button--secondary-pressed-bg: var(--rds-button-secondary-pressed-bg);--common-button--tertiary-bg: var(--rds-button-tertirary-bg);--common-button--tertiary-color: var(--rds-foreground-primary);--common-button--tertiary-hover-bg: var(--rds-button-tertiary-hover-bg);--common-button--tertiary-hover-color: var(--rds-foreground-primary);--common-button--tertiary-pressed-bg: var(--rds-background-tertiary);--common-button--tertiary-pressed-color: var(--rds-foreground-primary);--common-button--disabled-bg: var(--rds-foreground-secondary);--common-button--disabled-color: var(--rds-foreground-tertiary);border:none;width:auto;background:transparent;line-height:normal;-webkit-appearance:none;display:flex;transition:125ms ease-in-out;transition-property:color,box-shadow,background-color;font-family:var(--rds-font-family-m-headlines)}.rds-button__shared::-moz-focus-inner{border:0;padding:0}.rds-button__shared--primary{color:var(--common-button--primary-color);background-color:var(--common-button--primary-bg)}.rds-button__shared--primary:hover{background-color:var(--common-button--primary-hover-bg)}.rds-button__shared--primary:active{box-shadow:none;background-color:var(--common-button--primary-pressed-bg)}.rds-button__shared--secondary{background-color:var(--common-button--secondary-bg);border:2px solid var(--common-button--secondary-border-color);color:var(--common-button--secondary-color)}.rds-button__shared--secondary:hover{background-color:var(--common-button--secondary-hover-bg);color:var(--common-button--secondary-hover-color)}.rds-button__shared--secondary:active{background-color:var(--common-button--secondary-pressed-bg);color:var(--common-button--secondary-pressed-color);border-color:var(--common-button--secondary-pressed-bg)}.rds-button__shared--tertiary{background-color:var(--common-button--tertiary-bg);color:var(--common-button--tertiary-color)}.rds-button__shared--tertiary:hover{background-color:var(--common-button--tertiary-hover-bg);color:var(--common-button--tertiary-hover-color)}.rds-button__shared--tertiary:active{background-color:var(--common-button--tertiary-pressed-bg);color:var(--common-button--tertiary-pressed-color)}.rds-button__shared:disabled{background-color:var(--common-button--disabled-bg);color:var(--common-button--disabled-color);box-shadow:none;cursor:not-allowed;border:none}.rds-button__shared:hover{box-shadow:var(--rds-box-shadow--default)}.rds-button__shared:active{box-shadow:none}.rds-button__shared:focus::-moz-focus-inner{border-style:none;outline:0}.rds-button__shared:focus button::-moz-focus-inner,.rds-button__shared:focus [type=button]::-moz-focus-inner,.rds-button__shared:focus [type=reset]::-moz-focus-inner,.rds-button__shared:focus [type=submit]::-moz-focus-inner{border-style:none}.rds-button__shared:focus input[type=button]::-moz-focus-inner{outline:0}html:not([data-mousenavigation]):not([data-touchnavigation]) .rds-button__shared:focus{outline-offset:2px;outline:2px solid var(--rds-feedback-info);transition:outline-offset .25s ease}
+.rds-button{padding:.78125rem var(--rds-spacing--32);border-radius:var(--rds-roundness--button);overflow-y:hidden;cursor:pointer;font-size:1.125rem}.rds-button__icon{display:flex;align-items:center;align-self:center;margin-right:var(--rds-spacing--16);width:1.125rem}.rds-button__icon>svg{width:100%}.rds-button__postfix{position:relative;display:flex;align-items:center;margin-left:var(--rds-spacing--16);padding-left:var(--rds-spacing--16)}.rds-button__postfix:before{content:" ";position:absolute;width:1px;background-color:currentColor;height:200%;left:0}.rds-button--loading:disabled{cursor:wait!important}.rds-button--loading:disabled:hover{box-shadow:none}.rds-button__shared{--common-button--primary-color: var(--rds-button-primary-fg);--common-button--primary-bg: var(--rds-accent-color);--common-button--primary-hover-bg: var(--rds-accent-hover);--common-button--primary-pressed-bg: var(--rds-accent-color);--common-button--secondary-border-color: var(--rds-foreground-primary);--common-button--secondary-color: var(--rds-foreground-primary);--common-button--secondary-bg: var(--rds-background-primary);--common-button--secondary-hover-color: var(--rds-background-primary);--common-button--secondary-hover-bg: var(--rds-foreground-primary);--common-button--secondary-pressed-color: var(--rds-button-secondary-pressed-fg);--common-button--secondary-pressed-bg: var(--rds-button-secondary-pressed-bg);--common-button--tertiary-bg: var(--rds-button-tertirary-bg);--common-button--tertiary-color: var(--rds-foreground-primary);--common-button--tertiary-hover-bg: var(--rds-button-tertiary-hover-bg);--common-button--tertiary-hover-color: var(--rds-foreground-primary);--common-button--tertiary-pressed-bg: var(--rds-background-tertiary);--common-button--tertiary-pressed-color: var(--rds-foreground-primary);--common-button--disabled-bg: var(--rds-foreground-secondary);--common-button--disabled-color: var(--rds-foreground-tertiary);border:none;width:auto;background:transparent;line-height:normal;-webkit-appearance:none;display:flex;transition:125ms ease-in-out;transition-property:color,box-shadow,background-color;font-family:var(--rds-font-family-m-headlines)}.rds-button__shared::-moz-focus-inner{border:0;padding:0}.rds-button__shared--primary{color:var(--common-button--primary-color);background-color:var(--common-button--primary-bg)}.rds-button__shared--primary:hover{background-color:var(--common-button--primary-hover-bg)}.rds-button__shared--primary:active{box-shadow:none;background-color:var(--common-button--primary-pressed-bg)}.rds-button__shared--secondary{background-color:var(--common-button--secondary-bg);border:2px solid var(--common-button--secondary-border-color);color:var(--common-button--secondary-color)}.rds-button__shared--secondary:hover{background-color:var(--common-button--secondary-hover-bg);color:var(--common-button--secondary-hover-color)}.rds-button__shared--secondary:active{background-color:var(--common-button--secondary-pressed-bg);color:var(--common-button--secondary-pressed-color);border-color:var(--common-button--secondary-pressed-bg)}.rds-button__shared--tertiary{background-color:var(--common-button--tertiary-bg);color:var(--common-button--tertiary-color)}.rds-button__shared--tertiary:hover{background-color:var(--common-button--tertiary-hover-bg);color:var(--common-button--tertiary-hover-color)}.rds-button__shared--tertiary:active{background-color:var(--common-button--tertiary-pressed-bg);color:var(--common-button--tertiary-pressed-color)}.rds-button__shared:disabled{background-color:var(--common-button--disabled-bg);color:var(--common-button--disabled-color);box-shadow:none;cursor:not-allowed;border:none}.rds-button__shared:hover{box-shadow:var(--rds-box-shadow--default)}.rds-button__shared:active{box-shadow:none}.rds-button__shared:focus::-moz-focus-inner{border-style:none;outline:0}.rds-button__shared:focus button::-moz-focus-inner,.rds-button__shared:focus [type=button]::-moz-focus-inner,.rds-button__shared:focus [type=reset]::-moz-focus-inner,.rds-button__shared:focus [type=submit]::-moz-focus-inner{border-style:none}.rds-button__shared:focus input[type=button]::-moz-focus-inner{outline:0}html:not([data-mousenavigation]):not([data-touchnavigation]) .rds-button__shared:focus{outline-offset:2px;outline:2px solid var(--rds-feedback-info);transition:outline-offset .25s ease}.rds-light .rds-button__shared--primary,.rds-light.rds-button__shared--primary{--common-button--primary-color: var(--rds-foreground-primary);--common-button--primary-bg: var(--rds-button-primary-fg)}.rds-light .rds-button__shared--primary:hover,.rds-light.rds-button__shared--primary:hover{--common-button--primary-hover-bg: var(--rds-foreground-tertiary)}.rds-light .rds-button__shared--primary:active,.rds-light.rds-button__shared--primary:active{box-shadow:none;--common-button--primary-pressed-bg: var(--rds-background-primary)}.rds-light .rds-button__shared--primary:disabled,.rds-light.rds-button__shared--primary:disabled{--common-button--disabled-color: var(--rds-button-tertiary-hover-bg)}.rds-light .rds-button__shared--secondary,.rds-light.rds-button__shared--secondary{--common-button--secondary-color: var(--rds-button-tertiary-hover-bg);--common-button--secondary-border-color: var(--rds-button-tertiary-hover-bg);--common-button--secondary-bg: var(--surface-background)}.rds-light .rds-button__shared--secondary:hover,.rds-light.rds-button__shared--secondary:hover{--common-button--secondary-hover-bg: var(--rds-button-primary-fg);--common-button--secondary-hover-color: var(--rds-foreground-primary)}.rds-light .rds-button__shared--secondary:active,.rds-light.rds-button__shared--secondary:active{--common-button--secondary-pressed-color: var(--rds-foreground-primary);--common-button--secondary-pressed-bg: var(--rds-button-primary-fg)}.rds-light .rds-button__shared--secondary:disabled,.rds-light.rds-button__shared--secondary:disabled{--common-button--disabled-color: var(--rds-button-primary-fg)}

package/dist/button/Button.js

@@ -1 +1,40 @@
-var t=Object.defineProperty,r=Object.getOwnPropertySymbols,e=Object.prototype.hasOwnProperty,o=Object.prototype.propertyIsEnumerable,a=(r,e,o)=>e in r?t(r,e,{enumerable:!0,configurable:!0,writable:!0,value:o}):r[e]=o,n=(t,n)=>{for(var s in n||(n={}))e.call(n,s)&&a(t,s,n[s]);if(r)for(var s of r(n))o.call(n,s)&&a(t,s,n[s]);return t};import{forwardRef as s}from"react";import{B as y}from"./BaseButton.js";import{j as p}from"../core/RiksTV.js";const b=s(((t,r)=>p(y,n({buttonStyle:"rds-button",buttonType:"primary",ref:r},t))));b.displayName="PrimaryButton";const u=s(((t,r)=>p(y,n({buttonStyle:"rds-button",buttonType:"secondary",ref:r},t))));u.displayName="SecondaryButton";const i=s(((t,r)=>p(y,n({buttonStyle:"rds-button",buttonType:"tertiary",ref:r},t))));i.displayName="TertiaryButton";export{b as P,u as S,i as T};
+var __defProp = Object.defineProperty;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+import { forwardRef } from "react";
+import { B as BaseButton } from "./BaseButton.js";
+import { j as jsx } from "../core/RiksTV.js";
+var button = "";
+var buttonShared = "";
+const PrimaryButton = forwardRef((props, ref) => /* @__PURE__ */ jsx(BaseButton, __spreadValues({
+  buttonStyle: "rds-button",
+  buttonType: "primary",
+  ref
+}, props)));
+PrimaryButton.displayName = "PrimaryButton";
+const SecondaryButton = forwardRef((props, ref) => /* @__PURE__ */ jsx(BaseButton, __spreadValues({
+  buttonStyle: "rds-button",
+  buttonType: "secondary",
+  ref
+}, props)));
+SecondaryButton.displayName = "SecondaryButton";
+const TertiaryButton = forwardRef((props, ref) => /* @__PURE__ */ jsx(BaseButton, __spreadValues({
+  buttonStyle: "rds-button",
+  buttonType: "tertiary",
+  ref
+}, props)));
+TertiaryButton.displayName = "TertiaryButton";
+export { PrimaryButton as P, SecondaryButton as S, TertiaryButton as T };

package/dist/button/IconButton.js

@@ -1 +1,40 @@
-var t=Object.defineProperty,o=Object.getOwnPropertySymbols,r=Object.prototype.hasOwnProperty,e=Object.prototype.propertyIsEnumerable,n=(o,r,e)=>r in o?t(o,r,{enumerable:!0,configurable:!0,writable:!0,value:e}):o[r]=e,a=(t,a)=>{for(var s in a||(a={}))r.call(a,s)&&n(t,s,a[s]);if(o)for(var s of o(a))e.call(a,s)&&n(t,s,a[s]);return t};import{forwardRef as s}from"react";import{B as y}from"./BaseButton.js";import"./Button.js";import{j as i}from"../core/RiksTV.js";const p=s(((t,o)=>i(y,a({buttonStyle:"rds-icon-button",buttonType:"primary",ref:o},t))));p.displayName="PrimaryIconButton";const c=s(((t,o)=>i(y,a({buttonStyle:"rds-icon-button",buttonType:"secondary",ref:o},t))));c.displayName="SecondaryIconButton";const u=s(((t,o)=>i(y,a({buttonStyle:"rds-icon-button",buttonType:"tertiary",ref:o},t))));u.displayName="TertiaryIconButton";export{p as P,c as S,u as T};
+var __defProp = Object.defineProperty;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+import { forwardRef } from "react";
+import { B as BaseButton } from "./BaseButton.js";
+import "./Button.js";
+import { j as jsx } from "../core/RiksTV.js";
+var iconButton = "";
+const PrimaryIconButton = forwardRef((props, ref) => /* @__PURE__ */ jsx(BaseButton, __spreadValues({
+  buttonStyle: "rds-icon-button",
+  buttonType: "primary",
+  ref
+}, props)));
+PrimaryIconButton.displayName = "PrimaryIconButton";
+const SecondaryIconButton = forwardRef((props, ref) => /* @__PURE__ */ jsx(BaseButton, __spreadValues({
+  buttonStyle: "rds-icon-button",
+  buttonType: "secondary",
+  ref
+}, props)));
+SecondaryIconButton.displayName = "SecondaryIconButton";
+const TertiaryIconButton = forwardRef((props, ref) => /* @__PURE__ */ jsx(BaseButton, __spreadValues({
+  buttonStyle: "rds-icon-button",
+  buttonType: "tertiary",
+  ref
+}, props)));
+TertiaryIconButton.displayName = "TertiaryIconButton";
+export { PrimaryIconButton as P, SecondaryIconButton as S, TertiaryIconButton as T };

package/dist/button/button-shared.scss

@@ -110,3 +110,47 @@
 
   @include mix.with-keyboard-focus;
 }
+
+.rds-light {
+  .rds-button__shared--primary,
+  &.rds-button__shared--primary {
+    --common-button--primary-color: var(--rds-foreground-primary);
+    --common-button--primary-bg: var(--rds-button-primary-fg);
+
+    &:hover {
+      --common-button--primary-hover-bg: var(--rds-foreground-tertiary);
+    }
+
+    &:active {
+      box-shadow: none;
+      --common-button--primary-pressed-bg: var(--rds-background-primary);
+    }
+
+    &:disabled {
+      --common-button--disabled-color: var(--rds-button-tertiary-hover-bg);
+    }
+  }
+}
+
+.rds-light {
+  .rds-button__shared--secondary,
+  &.rds-button__shared--secondary {
+    --common-button--secondary-color: var(--rds-button-tertiary-hover-bg);
+    --common-button--secondary-border-color: var(--rds-button-tertiary-hover-bg);
+    --common-button--secondary-bg: var(--surface-background);
+
+    &:hover {
+      --common-button--secondary-hover-bg: var(--rds-button-primary-fg);
+      --common-button--secondary-hover-color: var(--rds-foreground-primary);
+    }
+
+    &:active {
+      --common-button--secondary-pressed-color: var(--rds-foreground-primary);
+      --common-button--secondary-pressed-bg: var(--rds-button-primary-fg);
+    }
+
+    &:disabled {
+      --common-button--disabled-color: var(--rds-button-primary-fg);
+    }
+  }
+}

package/dist/core/Core.js

@@ -1 +1,76 @@
-import{j as t}from"./RiksTV.js";let e=!1,o=!1,n=!1;const u={mousedown:function(){if(!e&&!n){e=!0,o=!1;const t=document.querySelector("html");null==t||t.setAttribute("data-mousenavigation","true"),null==t||t.removeAttribute("data-touchnavigation"),a(),i("touchstart"),i("keydown")}},keydown:function(t){if("Tab"===t.key){const t=document.querySelector("html");a(),null==t||t.removeAttribute("data-mousenavigation"),null==t||t.removeAttribute("data-touchnavigation"),e=!1,o=!1,i("touchstart"),i("mousedown")}},touchstart:function(){if(!o){e=!1,o=!0;const t=document.querySelector("html");null==t||t.setAttribute("data-touchnavigation","true"),null==t||t.removeAttribute("data-mousenavigation"),a(),i("touchstart"),i("keydown"),i("mousedown")}n=!0,setTimeout((()=>{n=!1}),150)}};function a(){Object.keys(u).forEach((t=>{document.removeEventListener(t,u[t])}))}function i(t){document.addEventListener(t,u[t])}"undefined"!=typeof document&&(i("touchstart"),i("mousedown"));const r=({brand:e,children:o})=>t("div",{"data-testid":"core-entry",className:e,children:o});export{r as C};
+import { j as jsx } from "./RiksTV.js";
+let mousenavigation = false;
+let touchnavigation = false;
+let touchEventFired = false;
+const listeners = {
+  mousedown: handleMouseDown,
+  keydown: handleKeydown,
+  touchstart: handleTouchStart
+};
+function removeAllListeners() {
+  Object.keys(listeners).forEach((listenerType) => {
+    document.removeEventListener(listenerType, listeners[listenerType]);
+  });
+}
+function addListener(listenerType) {
+  document.addEventListener(listenerType, listeners[listenerType]);
+}
+function handleMouseDown() {
+  if (!mousenavigation && !touchEventFired) {
+    mousenavigation = true;
+    touchnavigation = false;
+    const htmlElement = document.querySelector("html");
+    htmlElement == null ? void 0 : htmlElement.setAttribute("data-mousenavigation", "true");
+    htmlElement == null ? void 0 : htmlElement.removeAttribute("data-touchnavigation");
+    removeAllListeners();
+    addListener("touchstart");
+    addListener("keydown");
+  }
+}
+function handleKeydown(event) {
+  if (event.key === "Tab") {
+    const htmlElement = document.querySelector("html");
+    removeAllListeners();
+    htmlElement == null ? void 0 : htmlElement.removeAttribute("data-mousenavigation");
+    htmlElement == null ? void 0 : htmlElement.removeAttribute("data-touchnavigation");
+    mousenavigation = false;
+    touchnavigation = false;
+    addListener("touchstart");
+    addListener("mousedown");
+  }
+}
+function handleTouchStart() {
+  if (!touchnavigation) {
+    mousenavigation = false;
+    touchnavigation = true;
+    const htmlElement = document.querySelector("html");
+    htmlElement == null ? void 0 : htmlElement.setAttribute("data-touchnavigation", "true");
+    htmlElement == null ? void 0 : htmlElement.removeAttribute("data-mousenavigation");
+    removeAllListeners();
+    addListener("touchstart");
+    addListener("keydown");
+    addListener("mousedown");
+  }
+  touchEventFired = true;
+  setTimeout(() => {
+    touchEventFired = false;
+  }, 150);
+}
+function detectUserInputMethod() {
+  if (typeof document !== "undefined") {
+    addListener("touchstart");
+    addListener("mousedown");
+  }
+}
+detectUserInputMethod();
+const Core = ({
+  brand,
+  children
+}) => {
+  return /* @__PURE__ */ jsx("div", {
+    "data-testid": "core-entry",
+    className: brand,
+    children
+  });
+};
+export { Core as C };

package/dist/core/LightMode.js

@@ -1 +1,50 @@
-var r=Object.defineProperty,e=Object.defineProperties,t=Object.getOwnPropertyDescriptors,a=Object.getOwnPropertySymbols,o=Object.prototype.hasOwnProperty,l=Object.prototype.propertyIsEnumerable,i=(e,t,a)=>t in e?r(e,t,{enumerable:!0,configurable:!0,writable:!0,value:a}):e[t]=a;import{forwardRef as n}from"react";import{j as c}from"./RiksTV.js";const s=n(((r,n)=>{var s,f=r,{children:p,className:b=""}=f,d=((r,e)=>{var t={};for(var i in r)o.call(r,i)&&e.indexOf(i)<0&&(t[i]=r[i]);if(null!=r&&a)for(var i of a(r))e.indexOf(i)<0&&l.call(r,i)&&(t[i]=r[i]);return t})(f,["children","className"]);return c("div",(s=((r,e)=>{for(var t in e||(e={}))o.call(e,t)&&i(r,t,e[t]);if(a)for(var t of a(e))l.call(e,t)&&i(r,t,e[t]);return r})({ref:n,className:`rds-light ${b}`},d),e(s,t({children:p}))))}));s.displayName="LightMode";export{s as L};
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+import { forwardRef } from "react";
+import { j as jsx } from "./RiksTV.js";
+const LightMode = forwardRef((_a, ref) => {
+  var _b = _a, {
+    children,
+    className = ""
+  } = _b, props = __objRest(_b, [
+    "children",
+    "className"
+  ]);
+  return /* @__PURE__ */ jsx("div", __spreadProps(__spreadValues({
+    ref,
+    className: `rds-light ${className}`
+  }, props), {
+    children
+  }));
+});
+LightMode.displayName = "LightMode";
+export { LightMode as L };

package/dist/core/RiksTV.css

@@ -1 +1 @@
-:root{--rds-spacing--2: .125rem;--rds-spacing--4: .25rem;--rds-spacing--8: .5rem;--rds-spacing--16: 1rem;--rds-spacing--24: 1.5rem;--rds-spacing--32: 2rem;--rds-spacing--48: 3rem;--rds-spacing--64: 4rem;--rds-spacing--80: 5rem;--rds-spacing--96: 6rem;--rds-box-shadow--default: 0px 8px 16px rgba(0, 0, 0, .5)}.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);border:0}.rtv{--rds-button-primary-fg: #fff;--rds-button-secondary-pressed-fg: #666666;--rds-button-secondary-pressed-bg: #fff;--rds-button-tertirary-bg: #3b3b3b;--rds-button-tertiary-hover-bg: #434343;--rds-accent-color: #ee4642;--rds-accent-color-mid: #ed302b;--rds-accent-color-dark: #d41612;--rds-accent-hover: #d41612;--rds-foreground-primary: #fff;--rds-foreground-secondary: #a8a8a8;--rds-foreground-tertiary: #666;--rds-heading-accent: var(--rds-foreground-primary);--rds-background-primary-rgb: 37, 37, 37;--rds-background-primary: rgb(var(--rds-background-primary-rgb));--rds-background-secondary: #434343;--rds-background-tertiary: #0b0b0b;--rds-foreground-overlay-soft: rgba(255, 255, 255, .1);--rds-foreground-overlay-medium: rgba(255, 255, 255, .3);--rds-foreground-overlay-heavy: rgba(255, 255, 255, .7);--rds-background-overlay-soft: rgba(0, 0, 0, .1);--rds-background-overlay-medium: rgba(0, 0, 0, .5);--rds-background-overlay-heavy: rgba(0, 0, 0, .85);--rds-feedback-info: #00aec7;--rds-feedback-warning: #f2a900;--rds-feedback-confirm: #4cbb81;--rds-feedback-error: #e01c17;--rds-roundness--default: 4px;--rds-roundness--button: 34px;--rds-roundness--round: 50%;--rds-font-family-lg-headlines: "AvertaBold", Arial, Helvetica, "system-ui", sans-serif;--rds-font-family-headlines: "AvertaBold", Arial, Helvetica, "system-ui", sans-serif;--rds-font-family-m-headlines: "AvertaSemibold", Arial, Helvetica, "system-ui", sans-serif;--rds-font-family-body: "AvertaRegular", Arial, Helvetica, "system-ui", sans-serif;--rds-font-size--default: 1.125rem;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
+:root{--rds-spacing--2: .125rem;--rds-spacing--4: .25rem;--rds-spacing--8: .5rem;--rds-spacing--16: 1rem;--rds-spacing--24: 1.5rem;--rds-spacing--32: 2rem;--rds-spacing--48: 3rem;--rds-spacing--64: 4rem;--rds-spacing--80: 5rem;--rds-spacing--96: 6rem;--rds-box-shadow--default: 0px 8px 16px rgba(0, 0, 0, .5)}.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);border:0}.rtv{--rds-button-primary-fg: #fff;--rds-button-secondary-pressed-fg: #666666;--rds-button-secondary-pressed-bg: #fff;--rds-button-tertirary-bg: #3b3b3b;--rds-button-tertiary-hover-bg: #434343;--rds-accent-color: #ee4642;--rds-accent-color-mid: #ed302b;--rds-accent-color-dark: #d41612;--rds-accent-hover: #d41612;--rds-foreground-primary: #fff;--rds-foreground-secondary: #a8a8a8;--rds-foreground-tertiary: #666;--rds-heading-accent: var(--rds-foreground-primary);--rds-background-primary-rgb: 37, 37, 37;--rds-background-primary: rgb(var(--rds-background-primary-rgb));--rds-background-secondary: #434343;--rds-background-tertiary: #0b0b0b;--rds-foreground-overlay-soft: rgba(255, 255, 255, .1);--rds-foreground-overlay-medium: rgba(255, 255, 255, .3);--rds-foreground-overlay-heavy: rgba(255, 255, 255, .7);--rds-foreground-solid-soft: #3c3c3c;--rds-surface-foreground: #434343;--rds-background-overlay-soft: rgba(0, 0, 0, .1);--rds-background-overlay-medium: rgba(0, 0, 0, .5);--rds-background-overlay-heavy: rgba(0, 0, 0, .85);--rds-feedback-info: #00aec7;--rds-feedback-warning: #f2a900;--rds-feedback-confirm: #4cbb81;--rds-feedback-error: #e01c17;--rds-roundness--default: 4px;--rds-roundness--button: 34px;--rds-roundness--round: 50%;--rds-font-family-lg-headlines: "AvertaBold", Arial, Helvetica, "system-ui", sans-serif;--rds-font-family-headlines: "AvertaBold", Arial, Helvetica, "system-ui", sans-serif;--rds-font-family-m-headlines: "AvertaSemibold", Arial, Helvetica, "system-ui", sans-serif;--rds-font-family-body: "AvertaRegular", Arial, Helvetica, "system-ui", sans-serif;--rds-font-size--default: 1.125rem;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}