@amsterdam/design-system-react 0.1.4 → 0.1.5

package/dist/index.cjs.js

@@ -9,9 +9,410 @@ var designSystemReactIcons = require('@amsterdam/design-system-react-icons');
 var componentLibraryReact = require('@utrecht/component-library-react');
 var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
 
-var _excluded$8 = ["children", "className", "level", "size"];
+function styleInject(css, ref) {
+  if ( ref === void 0 ) ref = {};
+  var insertAt = ref.insertAt;
+
+  if (!css || typeof document === 'undefined') { return; }
+
+  var head = document.head || document.getElementsByTagName('head')[0];
+  var style = document.createElement('style');
+  style.type = 'text/css';
+
+  if (insertAt === 'top') {
+    if (head.firstChild) {
+      head.insertBefore(style, head.firstChild);
+    } else {
+      head.appendChild(style);
+    }
+  } else {
+    head.appendChild(style);
+  }
+
+  if (style.styleSheet) {
+    style.styleSheet.cssText = css;
+  } else {
+    style.appendChild(document.createTextNode(css));
+  }
+}
+
+var css_248z$i = ".amsterdam-visually-hidden{clip:rect(1px,1px,1px,1px);clip-path:inset(50%);height:1px;margin-block:-1px;margin-inline:-1px;overflow:hidden;padding-block:0;padding-inline:0;position:absolute;width:1px}";
+styleInject(css_248z$i);
+
+var css_248z$h = ".amsterdam-footer__top{background-color:var(--amsterdam-footer-top-background-color);padding-block:2.5rem;padding-inline:2rem}@media screen and (width > 53.375rem){.amsterdam-footer__top{grid-template-columns:repeat(var(--amsterdam-page-grid-column-count-wide),1fr)}}.amsterdam-footer__column{display:flex;flex-direction:column;gap:2.5rem}.amsterdam-footer__bottom{padding-block:.5rem;padding-inline:2rem}";
+styleInject(css_248z$h);
+
+var css_248z$g = ".amsterdam-page-menu{align-items:center;box-sizing:border-box;column-gap:var(--amsterdam-page-menu-column-gap);display:flex;flex-direction:row;flex-wrap:wrap;list-style:none;margin-block:0;padding-inline:0;row-gap:var(--amsterdam-page-menu-row-gap)}.amsterdam-page-menu__link{-webkit-text-size-adjust:100%;box-sizing:border-box;color:var(--amsterdam-page-menu-item-color);display:inline-flex;flex-direction:row;font-family:var(--amsterdam-page-menu-item-font-family);font-size:var(--amsterdam-page-menu-item-narrow-font-size);font-weight:var(--amsterdam-page-menu-item-narrow-font-weight);gap:var(--amsterdam-page-menu-item-gap);line-height:var(--amsterdam-page-menu-item-line-height);text-align:center;text-decoration:var(--amsterdam-page-menu-item-text-decoration);touch-action:manipulation}@media screen and (width > 53.375rem){.amsterdam-page-menu__link{font-size:var(--amsterdam-page-menu-item-wide-font-size)}}.amsterdam-page-menu__button{-webkit-text-size-adjust:100%;background-color:transparent;border:0;box-sizing:border-box;color:var(--amsterdam-page-menu-item-color);cursor:pointer;display:inline-flex;flex-direction:row;font-family:var(--amsterdam-page-menu-item-font-family);font-size:var(--amsterdam-page-menu-item-narrow-font-size);font-weight:var(--amsterdam-page-menu-item-narrow-font-weight);gap:var(--amsterdam-page-menu-item-gap);line-height:var(--amsterdam-page-menu-item-line-height);margin-block:0;padding-inline:0;text-align:center;text-decoration:var(--amsterdam-page-menu-item-text-decoration);touch-action:manipulation}@media screen and (width > 53.375rem){.amsterdam-page-menu__button{font-size:var(--amsterdam-page-menu-item-wide-font-size)}}.amsterdam-page-menu__button:hover,.amsterdam-page-menu__link:hover{color:var(--amsterdam-page-menu-item-hover-color)}.amsterdam-page-menu__button svg,.amsterdam-page-menu__link svg{color:currentColor}";
+styleInject(css_248z$g);
+
+var css_248z$f = ".amsterdam-top-task-link{break-inside:avoid;display:flex;flex-direction:column;gap:.5rem;outline-offset:var(--amsterdam-top-task-link-outline-offset);text-decoration:none}.amsterdam-top-task-link__label{-webkit-text-size-adjust:100%;box-sizing:border-box;color:var(--amsterdam-top-task-link-label-color);font-family:var(--amsterdam-top-task-link-label-font-family);font-size:var(--amsterdam-top-task-link-label-narrow-font-size);font-weight:var(--amsterdam-top-task-link-label-font-weight);line-height:var(--amsterdam-top-task-link-label-line-height)}@media screen and (width > 53.375rem){.amsterdam-top-task-link__label{font-size:var(--amsterdam-top-task-link-label-wide-font-size)}}.amsterdam-top-task-link:hover .amsterdam-top-task-link__label{color:var(--amsterdam-top-task-link-label-hover-color);text-decoration:underline;text-decoration-thickness:3px;text-underline-offset:.5rem}.amsterdam-top-task-link__description{-webkit-text-size-adjust:100%;box-sizing:border-box;color:var(--amsterdam-top-task-link-description-color);font-family:var(--amsterdam-top-task-link-description-font-family);font-size:var(--amsterdam-top-task-link-description-narrow-font-size);font-weight:var(--amsterdam-top-task-link-description-font-weight);line-height:var(--amsterdam-top-task-link-description-line-height)}@media screen and (width > 53.375rem){.amsterdam-top-task-link__description{font-size:var(--amsterdam-top-task-link-description-wide-font-size)}}";
+styleInject(css_248z$f);
+
+var css_248z$e = "@charset \"UTF-8\";.amsterdam-blockquote{box-sizing:border-box;break-after:avoid;break-inside:avoid;color:var(--amsterdam-blockquote-color);font-family:var(--amsterdam-blockquote-font-family);font-size:var(--amsterdam-blockquote-narrow-font-size);font-weight:var(--amsterdam-blockquote-font-weight);line-height:var(--amsterdam-blockquote-line-height);margin-block:0;margin-inline:0;quotes:\"“\" \"”\"}.amsterdam-blockquote:before{content:open-quote}.amsterdam-blockquote:after{content:close-quote}@media screen and (width > 53.375rem){.amsterdam-blockquote{font-size:var(--amsterdam-blockquote-wide-font-size)}}.amsterdam-blockquote--inverse-color{color:var(--amsterdam-blockquote-inverse-color)}";
+styleInject(css_248z$e);
+
+var css_248z$d = ".amsterdam-checkbox__input{appearance:none;margin-block:0;margin-inline:0;opacity:0}.amsterdam-checkbox__input:focus-visible+label{outline:auto;outline-offset:var(--amsterdam-checkbox-outline-offset)}.amsterdam-checkbox__checkmark{align-items:center;display:flex;flex-shrink:0;height:calc(var(--amsterdam-checkbox-checkmark-narrow-size)*var(--amsterdam-checkbox-checkmark-multiplier));width:1.5rem}.amsterdam-checkbox__checkmark:after{border-color:var(--amsterdam-checkbox-checkmark-border-color);border-style:solid;border-width:2px;box-sizing:border-box;content:\"\";height:1.5rem;width:100%}@media screen and (width > 53.375rem){.amsterdam-checkbox__checkmark{height:calc(var(--amsterdam-checkbox-checkmark-wide-size)*var(--amsterdam-checkbox-checkmark-multiplier))}}.amsterdam-checkbox__label{color:var(--amsterdam-checkbox-color);cursor:pointer;display:inline-flex;font-family:var(--amsterdam-checkbox-font-family);font-size:var(--amsterdam-checkbox-narrow-font-size);font-weight:400;gap:.5rem;line-height:var(--amsterdam-checkbox-line-height)}.amsterdam-checkbox__label:hover{color:var(--amsterdam-checkbox-hover-color);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px}.amsterdam-checkbox__label:hover .amsterdam-checkbox__checkmark:after{border-color:var(--amsterdam-checkbox-checkmark-hover-border-color);border-width:3px}@media screen and (width > 53.375rem){.amsterdam-checkbox__label{font-size:var(--amsterdam-checkbox-wide-font-size)}}.amsterdam-checkbox__input:checked+.amsterdam-checkbox__label .amsterdam-checkbox__checkmark:after{background-color:var(--amsterdam-checkbox-checkmark-checked-background-color);background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='%23fff'%3E%3Cpath fill-rule='evenodd' d='M12.216 27.016 0 14.168l2.91-2.77 9.346 9.837L29.129 4 32 6.8z'/%3E%3C/svg%3E\");background-position:50%;background-repeat:no-repeat;background-size:1rem;border:none}.amsterdam-checkbox__input:indeterminate+.amsterdam-checkbox__label .amsterdam-checkbox__checkmark:after{background-color:var(--amsterdam-checkbox-checkmark-indeterminate-background-color);background-image:url(\"data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzMiAzMiIgZmlsbD0iI2ZmZiI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNMCAxMy43MTRoMzJ2NEgweiIvPjwvc3ZnPg==\");background-position:50%;background-repeat:no-repeat;background-size:1rem;border:none}.amsterdam-checkbox__input:invalid+.amsterdam-checkbox__label .amsterdam-checkbox__checkmark:after,.amsterdam-checkbox__input[aria-invalid=true]+.amsterdam-checkbox__label .amsterdam-checkbox__checkmark:after{border-color:var(--amsterdam-checkbox-checkmark-invalid-border-color)}.amsterdam-checkbox__input:disabled+.amsterdam-checkbox__label{color:var(--amsterdam-checkbox-disabled-color);cursor:not-allowed}.amsterdam-checkbox__input:disabled+.amsterdam-checkbox__label .amsterdam-checkbox__checkmark:after{border-color:var(--amsterdam-checkbox-checkmark-disabled-border-color);border-width:2px}.amsterdam-checkbox__input:invalid:checked+.amsterdam-checkbox__label .amsterdam-checkbox__checkmark:after,.amsterdam-checkbox__input[aria-invalid=true]:checked+.amsterdam-checkbox__label .amsterdam-checkbox__checkmark:after{background-color:var(--amsterdam-checkbox-checkmark-invalid-checked-background-color)}.amsterdam-checkbox__input:invalid:indeterminate+.amsterdam-checkbox__label .amsterdam-checkbox__checkmark:after,.amsterdam-checkbox__input[aria-invalid=true]:indeterminate+.amsterdam-checkbox__label .amsterdam-checkbox__checkmark:after{background-color:var(--amsterdam-checkbox-checkmark-invalid-indeterminate-background-color)}.amsterdam-checkbox__input:disabled+.amsterdam-checkbox__label:hover{text-decoration:none}.amsterdam-checkbox__input:disabled:checked+.amsterdam-checkbox__label .amsterdam-checkbox__checkmark:after{background-color:var(--amsterdam-checkbox-checkmark-disabled-checked-background-color)}.amsterdam-checkbox__input:disabled:indeterminate+.amsterdam-checkbox__label .amsterdam-checkbox__checkmark:after{background-color:var(--amsterdam-checkbox-checkmark-disabled-indeterminate-background-color)}.amsterdam-checkbox__input:invalid:disabled+.amsterdam-checkbox__label .amsterdam-checkbox__checkmark:after,.amsterdam-checkbox__input[aria-invalid=true]:disabled+.amsterdam-checkbox__label .amsterdam-checkbox__checkmark:after{border-color:var(--amsterdam-checkbox-checkmark-disabled-border-color)}:is(.amsterdam-checkbox__input:invalid,.amsterdam-checkbox__input[aria-invalid=true])+.amsterdam-checkbox__label:hover .amsterdam-checkbox__checkmark:after{border-color:var(--amsterdam-checkbox-checkmark-invalid-hover-border-color)}.amsterdam-checkbox__input:checked+.amsterdam-checkbox__label:hover .amsterdam-checkbox__checkmark:after{background-color:var(--amsterdam-checkbox-checkmark-checked-hover-background-color)}.amsterdam-checkbox__input:indeterminate+.amsterdam-checkbox__label:hover .amsterdam-checkbox__checkmark:after{background-color:var(--amsterdam-checkbox-checkmark-indeterminate-hover-background-color)}:is(.amsterdam-checkbox__input:invalid:checked,.amsterdam-checkbox__input[aria-invalid=true]:checked)+.amsterdam-checkbox__label:hover .amsterdam-checkbox__checkmark:after{background-color:var(--amsterdam-checkbox-checkmark-invalid-checked-hover-background-color)}:is(.amsterdam-checkbox__input:invalid:indeterminate,.amsterdam-checkbox__input[aria-invalid=true]:indeterminate)+.amsterdam-checkbox__label:hover .amsterdam-checkbox__checkmark:after{background-color:var(--amsterdam-checkbox-checkmark-invalid-indeterminate-hover-background-color)}.amsterdam-checkbox__input:disabled:checked+.amsterdam-checkbox__label:hover .amsterdam-checkbox__checkmark:after{background-color:var(--amsterdam-checkbox-checkmark-disabled-checked-hover-background-color)}.amsterdam-checkbox__input:disabled:indeterminate+.amsterdam-checkbox__label:hover .amsterdam-checkbox__checkmark:after{background-color:var(--amsterdam-checkbox-checkmark-disabled-indeterminate-hover-background-color)}:is(.amsterdam-checkbox__input:invalid:disabled,.amsterdam-checkbox__input[aria-invalid=true]:disabled)+.amsterdam-checkbox__label:hover .amsterdam-checkbox__checkmark:after{border-color:var(--amsterdam-checkbox-checkmark-disabled-border-color)}.amsterdam-checkbox__input:invalid:disabled:checked+.amsterdam-checkbox__label .amsterdam-checkbox__checkmark:after,.amsterdam-checkbox__input:invalid:disabled:indeterminate+.amsterdam-checkbox__label .amsterdam-checkbox__checkmark:after,.amsterdam-checkbox__input[aria-invalid=true]:disabled:checked+.amsterdam-checkbox__label .amsterdam-checkbox__checkmark:after,.amsterdam-checkbox__input[aria-invalid=true]:disabled:indeterminate+.amsterdam-checkbox__label .amsterdam-checkbox__checkmark:after{background-color:var(--amsterdam-checkbox-checkmark-disabled-checked-background-color)}";
+styleInject(css_248z$d);
+
+var css_248z$c = ".amsterdam-page-heading{box-sizing:border-box;break-after:avoid;break-inside:avoid;color:var(--amsterdam-page-heading-color);font-family:var(--amsterdam-page-heading-font-family);font-size:var(--amsterdam-page-heading-narrow-font-size);font-weight:var(--amsterdam-page-heading-font-weight);line-height:var(--amsterdam-page-heading-line-height);margin-block:0}@media screen and (width > 53.375rem){.amsterdam-page-heading{font-size:var(--amsterdam-page-heading-wide-font-size)}}.amsterdam-page-heading--inverse-color{color:var(--amsterdam-page-heading-inverse-color)}";
+styleInject(css_248z$c);
+
+var css_248z$b = ".amsterdam-ordered-list{-webkit-text-size-adjust:100%;box-sizing:border-box;display:grid;gap:var(--amsterdam-ordered-list-gap);list-style-type:none;margin-block:0;padding-inline-start:0}.amsterdam-ordered-list:not(.amsterdam-ordered-list--no-markers){color:var(--amsterdam-ordered-list-color);font-family:var(--amsterdam-ordered-list-font-family);font-size:var(--amsterdam-ordered-list-narrow-font-size);font-weight:var(--amsterdam-ordered-list-font-weight);line-height:var(--amsterdam-ordered-list-line-height);list-style-type:var(--amsterdam-ordered-list-list-style-type)}@media screen and (width > 53.375rem){.amsterdam-ordered-list:not(.amsterdam-ordered-list--no-markers){font-size:var(--amsterdam-ordered-list-wide-font-size)}}.amsterdam-ordered-list:not(.amsterdam-ordered-list--no-markers) .amsterdam-ordered-list__item{margin-inline-start:var(--amsterdam-ordered-list-item-margin-inline-start);padding-inline-start:var(--amsterdam-ordered-list-item-padding-inline-start)}:is(.amsterdam-ordered-list,.amsterdam-unordered-list) .amsterdam-ordered-list{list-style-type:var(--amsterdam-ordered-list-ordered-list-list-style-type)}:is(.amsterdam-ordered-list,.amsterdam-unordered-list) .amsterdam-ordered-list .amsterdam-ordered-list__item{margin-inline-start:var(--amsterdam-ordered-list-ordered-list-item-margin-inline-start);padding-inline-start:var(--amsterdam-ordered-list-ordered-list-item-padding-inline-start)}";
+styleInject(css_248z$b);
+
+var css_248z$a = ".amsterdam-accordion__header{display:flex;margin-block:0;margin-inline:0}.amsterdam-accordion__button{background-color:transparent;border:0;color:var(--amsterdam-accordion-button-color);cursor:pointer;display:flex;font-family:var(--amsterdam-accordion-button-font-family);font-size:var(--amsterdam-accordion-button-narrow-font-size);font-weight:var(--amsterdam-accordion-button-font-weight);justify-content:space-between;line-height:var(--amsterdam-accordion-button-line-height);padding-block:.75rem;padding-inline:1rem;width:100%}@media screen and (width > 53.375rem){.amsterdam-accordion__button{font-size:var(--amsterdam-accordion-button-wide-font-size)}}.amsterdam-accordion__button:focus{outline-offset:var(--amsterdam-accordion-button-focus-outline-offset)}.amsterdam-accordion__button:hover{box-shadow:var(--amsterdam-accordion-button-hover-box-shadow)}.amsterdam-accordion__button svg{transform:rotate(0deg);transition:transform .3s ease}@media (prefers-reduced-motion){.amsterdam-accordion__button svg{transition:none}}.amsterdam-accordion__button[aria-expanded=true] svg{transform:rotate(180deg)}.amsterdam-accordion__panel{display:none;padding-block:1rem;padding-inline:1rem}.amsterdam-accordion__panel--expanded{display:block}";
+styleInject(css_248z$a);
+
+var css_248z$9 = ".amsterdam-breadcrumb{font-family:var(--amsterdam-breadcrumb-font-family,inherit);font-size:var(--amsterdam-breadcrumb-narrow-font-size);line-height:var(--amsterdam-breadcrumb-line-height)}@media screen and (width > 53.375rem){.amsterdam-breadcrumb{font-size:var(--amsterdam-breadcrumb-wide-font-size)}}.amsterdam-breadcrumb__list{box-sizing:border-box;break-after:avoid;break-inside:avoid;display:flex;flex-wrap:wrap;gap:.5rem;list-style:none;margin-block:0;padding-inline:0}.amsterdam-breadcrumb-item{align-items:center;display:flex}.amsterdam-breadcrumb-item:not(:last-child):after{background-color:var(--amsterdam-breadcrumb-color);clip-path:path(\"M 4.725,16 3.275,14.545 9.815,8 3.275,1.455 4.725,0 l 8,8 z\");content:\"\";display:inline-block;height:16px;margin-inline-start:1rem;width:16px}.amsterdam-breadcrumb-item__link{color:var(--amsterdam-breadcrumb-color);cursor:pointer;outline-offset:var(--amsterdam-breadcrumb-item-link-outline-offset);text-decoration:none}.amsterdam-breadcrumb-item__link:first-letter{text-transform:capitalize}.amsterdam-breadcrumb-item__link:active,.amsterdam-breadcrumb-item__link:focus,.amsterdam-breadcrumb-item__link:hover{color:var(--amsterdam-breadcrumb-item-link-hover-color);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px}";
+styleInject(css_248z$9);
+
+var css_248z$8 = ".utrecht-button{--_utrecht-button-background-color:var(\n    --_utrecht-button-hint-background-color,var(--_utrecht-button-appearance-background-color,var(--utrecht-button-background-color))\n  );--_utrecht-button-color:var(\n    --_utrecht-button-hint-color,var(--_utrecht-button-appearance-color,var(--utrecht-button-color))\n  );--_utrecht-button-border-color:var(\n    --_utrecht-button-hint-border-color,var(--_utrecht-button-appearance-border-color,var(--utrecht-button-border-color,transparent))\n  );--_utrecht-button-border-bottom-color:var(\n    --_utrecht-button-hint-border-bottom-color,var(\n      --_utrecht-button-hint-border-color,var(\n        --_utrecht-button-appearance-border-bottom-color,var(\n          --_utrecht-button-appearance-border-color,var(--utrecht-button-border-bottom-color,var(--utrecht-button-border-color,transparent))\n        )\n      )\n    )\n  );--_utrecht-button-disabled-background-color:var(\n    --_utrecht-button-hint-disabled-background-color,var(\n      --_utrecht-button-appearance-disabled-background-color,var(--utrecht-button-disabled-background-color,var(--utrecht-button-background-color))\n    )\n  );--_utrecht-button-disabled-border-color:var(\n    --_utrecht-button-hint-disabled-border-color,var(\n      --_utrecht-button-appearance-disabled-border-color,var(--utrecht-button-disabled-border-color,var(--utrecht-button-border-color))\n    )\n  );--_utrecht-button-disabled-color:var(\n    --_utrecht-button-hint-disabled-color,var(--_utrecht-button-appearance-disabled-color,var(--utrecht-button-disabled-color,var(--utrecht-button-color)))\n  );--_utrecht-button-pressed-background-color:var(\n    --_utrecht-button-hint-pressed-background-color,var(\n      --_utrecht-button-hint-background-color,var(\n        --_utrecht-button-appearance-pressed-background-color,var(\n          --_utrecht-button-appearance-background-color,var(--utrecht-button-pressed-background-color,var(--utrecht-button-background-color))\n        )\n      )\n    )\n  );--_utrecht-button-pressed-border-color:var(\n    --_utrecht-button-hint-pressed-border-color,var(\n      --_utrecht-button-hint-border-color,var(\n        --_utrecht-button-appearance-pressed-border-color,var(\n          --_utrecht-button-appearance-border-color,var(--utrecht-button-pressed-border-color,var(--utrecht-button-border-color))\n        )\n      )\n    )\n  );--_utrecht-button-pressed-color:var(\n    --_utrecht-button-hint-pressed-color,var(\n      --_utrecht-button-hint-color,var(\n        --_utrecht-button-appearance-pressed-color,var(--_utrecht-button-appearance-color,var(--utrecht-button-pressed-color,var(--utrecht-button-color)))\n      )\n    )\n  );--_utrecht-button-focus-background-color:var(\n    --_utrecht-button-hint-focus-background-color,var(\n      --_utrecht-button-hint-background-color,var(\n        --_utrecht-button-appearance-focus-background-color,var(\n          --_utrecht-button-appearance-background-color,var(--utrecht-button-focus-background-color,var(--utrecht-button-background-color))\n        )\n      )\n    )\n  );--_utrecht-button-focus-border-color:var(\n    --_utrecht-button-hint-focus-border-color,var(\n      --_utrecht-button-hint-border-color,var(\n        --_utrecht-button-appearance-focus-border-color,var(\n          --_utrecht-button-appearance-border-color,var(--utrecht-button-focus-border-color,var(--utrecht-button-border-color))\n        )\n      )\n    )\n  );--_utrecht-button-focus-color:var(\n    --_utrecht-button-hint-focus-color,var(\n      --_utrecht-button-hint-color,var(\n        --_utrecht-button-appearance-focus-color,var(--_utrecht-button-appearance-color,var(--utrecht-button-focus-color,var(--utrecht-button-color)))\n      )\n    )\n  );--_utrecht-button-hover-background-color:var(\n    --_utrecht-button-hint-hover-background-color,var(\n      --_utrecht-button-hint-background-color,var(\n        --_utrecht-button-appearance-hover-background-color,var(\n          --_utrecht-button-appearance-background-color,var(--utrecht-button-hover-background-color,var(--utrecht-button-background-color))\n        )\n      )\n    )\n  );--_utrecht-button-hover-border-color:var(\n    --_utrecht-button-hint-hover-border-color,var(\n      --_utrecht-button-hint-border-color,var(\n        --_utrecht-button-appearance-hover-border-color,var(\n          --_utrecht-button-appearance-border-color,var(--utrecht-button-hover-border-color,var(--utrecht-button-border-color))\n        )\n      )\n    )\n  );--_utrecht-button-hover-color:var(\n    --_utrecht-button-hint-hover-color,var(\n      --_utrecht-button-hint-color,var(\n        --_utrecht-button-appearance-hover-color,var(--_utrecht-button-appearance-color,var(--utrecht-button-hover-color,var(--utrecht-button-color)))\n      )\n    )\n  );--_utrecht-button-active-background-color:var(\n    --_utrecht-button-hint-active-background-color,var(\n      --_utrecht-button-hint-background-color,var(\n        --_utrecht-button-appearance-active-background-color,var(\n          --_utrecht-button-appearance-background-color,var(--utrecht-button-active-background-color,var(--utrecht-button-background-color))\n        )\n      )\n    )\n  );--_utrecht-button-active-border-color:var(\n    --_utrecht-button-hint-active-border-color,var(\n      --_utrecht-button-hint-border-color,var(\n        --_utrecht-button-appearance-active-border-color,var(\n          --_utrecht-button-appearance-border-color,var(--utrecht-button-active-border-color,var(--utrecht-button-border-color))\n        )\n      )\n    )\n  );--_utrecht-button-active-color:var(\n    --_utrecht-button-hint-active-color,var(\n      --_utrecht-button-hint-color,var(\n        --_utrecht-button-appearance-active-color,var(--_utrecht-button-appearance-color,var(--utrecht-button-active-color,var(--utrecht-button-color)))\n      )\n    )\n  );--_utrecht-button-border-width:var(--_utrecht-button-appearance-border-width,var(--utrecht-button-border-width,0));--_utrecht-button-border-block-end-width:var(\n    --utrecht-button-border-bottom-width,var(--_utrecht-button-border-width,0)\n  );--utrecht-icon-size:var(--utrecht-button-icon-size,1em);align-items:center;background-color:var(--_utrecht-button-background-color);border-block-end-color:var(--_utrecht-button-border-bottom-color);border-block-end-width:var(--_utrecht-button-border-block-end-width);border-color:var(--_utrecht-button-border-color);border-radius:var(--utrecht-button-border-radius);border-style:solid;border-width:var(--_utrecht-button-border-width);box-sizing:border-box;color:var(--_utrecht-button-color);cursor:var(--utrecht-action-activate-cursor);display:inline-flex;font-family:var(--utrecht-button-font-family,var(--utrecht-document-font-family));font-size:var(--utrecht-button-font-size,var(--utrecht-document-font-family,inherit));font-weight:var(--_utrecht-button-appearance-font-weight,var(--utrecht-button-font-weight));gap:var(--utrecht-button-icon-gap);inline-size:var(--utrecht-button-inline-size,auto);justify-content:center;letter-spacing:var(--utrecht-button-letter-spacing);line-height:var(--utrecht-button-line-height);min-block-size:var(--utrecht-button-min-block-size,44px);min-inline-size:var(--utrecht-button-min-inline-size,44px);padding-block-end:var(--utrecht-button-padding-block-end);padding-block-start:var(--utrecht-button-padding-block-start);padding-inline-end:var(--utrecht-button-padding-inline-end);padding-inline-start:var(--utrecht-button-padding-inline-start);text-transform:var(--utrecht-button-text-transform);-webkit-user-select:none;user-select:none}@media screen and (-ms-high-contrast:active),screen and (forced-colors:active){.utrecht-button{--_utrecht-button-disabled-border-color:GrayText;--_utrecht-button-disabled-color:GrayText;background-color:ButtonFace;border-color:buttonborder;color:ButtonText}}.utrecht-button--distanced{margin-block-end:var(--utrecht-button-margin-block-end);margin-block-start:var(--utrecht-button-margin-block-start);margin-inline-end:var(--utrecht-button-margin-inline-end);margin-inline-start:var(--utrecht-button-margin-inline-start)}.utrecht-button--submit{cursor:var(--utrecht-action-submit-cursor)}.utrecht-button--busy{cursor:var(--utrecht-action-busy-cursor)}.utrecht-button--pressed{background-color:var(--_utrecht-button-pressed-background-color);border-color:var(--_utrecht-button-pressed-border-color);color:var(--_utrecht-button-pressed-color)}.utrecht-button--disabled,.utrecht-button:disabled{background-color:var(--_utrecht-button-disabled-background-color);border-color:var(--_utrecht-button-disabled-border-color);color:var(--_utrecht-button-disabled-color);cursor:var(--utrecht-action-disabled-cursor)}.utrecht-button--focus-visible{--_utrecht-focus-ring-box-shadow:0 0 0 var(--utrecht-focus-outline-width,0) var(--utrecht-focus-inverse-outline-color,transparent);box-shadow:var(--_utrecht-focus-ring-box-shadow);outline-color:var(--utrecht-focus-outline-color,revert);outline-offset:var(--utrecht-focus-outline-offset,revert);outline-style:var(--utrecht-focus-outline-style,revert);outline-width:var(--utrecht-focus-outline-width,revert)}.utrecht-button--focus:not(.utrecht-button--disabled){background-color:var(--_utrecht-button-focus-background-color);border-color:var(--_utrecht-button-focus-border-color);color:var(--_utrecht-button-focus-color);scale:var(--utrecht-button-focus-scale,1)}.utrecht-button:focus,.utrecht-button:focus:not(:disabled,[aria-disabled=true],.utrecht-button--disabled){--_utrecht-focus-ring-box-shadow:0 0 0 var(--utrecht-focus-outline-width,0) var(--utrecht-focus-inverse-outline-color,transparent);box-shadow:var(--_utrecht-focus-ring-box-shadow);outline-color:var(--utrecht-focus-outline-color,revert);outline-offset:var(--utrecht-focus-outline-offset,revert);outline-style:var(--utrecht-focus-outline-style,revert);outline-width:var(--utrecht-focus-outline-width,revert)}.utrecht-button:focus:not(:disabled,[aria-disabled=true],.utrecht-button--disabled){background-color:var(--_utrecht-button-focus-background-color);border-color:var(--_utrecht-button-focus-border-color);color:var(--_utrecht-button-focus-color);scale:var(--utrecht-button-focus-scale,1)}.utrecht-button:focus:not(:focus-visible){box-shadow:none;outline-style:revert}.utrecht-button--hover:not(:disabled,.utrecht-button--disabled),.utrecht-button:hover:not(:disabled,[aria-disabled=true],.utrecht-button--disabled){background-color:var(--_utrecht-button-hover-background-color);border-color:var(--_utrecht-button-hover-border-color);color:var(--_utrecht-button-hover-color);scale:var(--utrecht-button-hover-scale,1)}.utrecht-button--active,.utrecht-button:active:not(:disabled,[aria-disabled=true],.utrecht-button--disabled){background-color:var(--_utrecht-button-active-background-color);border-color:var(--_utrecht-button-active-border-color);color:var(--_utrecht-button-active-color)}.utrecht-button--primary-action{--_utrecht-button-appearance-active-background-color:var(--utrecht-button-primary-action-active-background-color);--_utrecht-button-appearance-active-border-color:var(--utrecht-button-primary-action-active-border-color);--_utrecht-button-appearance-active-color:var(--utrecht-button-primary-action-active-color);--_utrecht-button-appearance-background-color:var(--utrecht-button-primary-action-background-color);--_utrecht-button-appearance-border-color:var(--utrecht-button-primary-action-border-color);--_utrecht-button-appearance-border-width:var(--utrecht-button-primary-action-border-width);--_utrecht-button-appearance-color:var(--utrecht-button-primary-action-color);--_utrecht-button-appearance-font-weight:var(--utrecht-button-primary-action-font-weight);--_utrecht-button-appearance-disabled-background-color:var(\n    --utrecht-button-primary-action-disabled-background-color\n  );--_utrecht-button-appearance-disabled-border-color:var(--utrecht-button-primary-action-disabled-border-color);--_utrecht-button-appearance-disabled-color:var(--utrecht-button-primary-action-disabled-color);--_utrecht-button-appearance-focus-background-color:var(--utrecht-button-primary-action-focus-background-color);--_utrecht-button-appearance-focus-border-color:var(--utrecht-button-primary-action-focus-border-color);--_utrecht-button-appearance-focus-color:var(--utrecht-button-primary-action-focus-color);--_utrecht-button-appearance-hover-background-color:var(--utrecht-button-primary-action-hover-background-color);--_utrecht-button-appearance-hover-border-color:var(--utrecht-button-primary-action-hover-border-color);--_utrecht-button-appearance-hover-color:var(--utrecht-button-primary-action-hover-color);--_utrecht-button-appearance-pressed-background-color:var(--utrecht-button-primary-action-pressed-background-color);--_utrecht-button-appearance-pressed-border-color:var(--utrecht-button-primary-action-pressed-border-color);--_utrecht-button-appearance-pressed-color:var(--utrecht-button-primary-action-pressed-color)}.utrecht-button--secondary-action{--_utrecht-button-appearance-active-background-color:var(--utrecht-button-secondary-action-active-background-color);--_utrecht-button-appearance-active-border-color:var(--utrecht-button-secondary-action-active-border-color);--_utrecht-button-appearance-active-color:var(--utrecht-button-secondary-action-active-color);--_utrecht-button-appearance-background-color:var(--utrecht-button-secondary-action-background-color);--_utrecht-button-appearance-border-color:var(--utrecht-button-secondary-action-border-color);--_utrecht-button-appearance-border-width:var(--utrecht-button-secondary-action-border-width);--_utrecht-button-appearance-color:var(--utrecht-button-secondary-action-color);--_utrecht-button-appearance-font-weight:var(--utrecht-button-secondary-action-font-weight);--_utrecht-button-appearance-disabled-background-color:var(\n    --utrecht-button-secondary-action-disabled-background-color\n  );--_utrecht-button-appearance-disabled-border-color:var(--utrecht-button-secondary-action-disabled-border-color);--_utrecht-button-appearance-disabled-color:var(--utrecht-button-secondary-action-disabled-color);--_utrecht-button-appearance-focus-background-color:var(--utrecht-button-secondary-action-focus-background-color);--_utrecht-button-appearance-focus-border-color:var(--utrecht-button-secondary-action-focus-border-color);--_utrecht-button-appearance-focus-color:var(--utrecht-button-secondary-action-focus-color);--_utrecht-button-appearance-hover-background-color:var(--utrecht-button-secondary-action-hover-background-color);--_utrecht-button-appearance-hover-border-color:var(--utrecht-button-secondary-action-hover-border-color);--_utrecht-button-appearance-hover-color:var(--utrecht-button-secondary-action-hover-color);--_utrecht-button-appearance-pressed-background-color:var(--utrecht-button-secondary-action-pressed-background-color);--_utrecht-button-appearance-pressed-border-color:var(--utrecht-button-secondary-action-pressed-border-color);--_utrecht-button-appearance-pressed-color:var(--utrecht-button-secondary-action-pressed-color)}.utrecht-button--subtle{--_utrecht-button-appearance-active-background-color:var(--utrecht-button-subtle-active-background-color);--_utrecht-button-appearance-active-border-color:var(--utrecht-button-subtle-active-border-color);--_utrecht-button-appearance-active-color:var(--utrecht-button-subtle-active-color);--_utrecht-button-appearance-background-color:var(--utrecht-button-subtle-background-color);--_utrecht-button-appearance-border-color:var(--utrecht-button-subtle-border-color);--_utrecht-button-appearance-border-width:var(--utrecht-button-subtle-border-width);--_utrecht-button-appearance-color:var(--utrecht-button-subtle-color);--_utrecht-button-appearance-font-weight:var(--utrecht-button-subtle-font-weight);--_utrecht-button-appearance-disabled-background-color:var(\n    --utrecht-button-subtle-disabled-background-color\n  );--_utrecht-button-appearance-disabled-border-color:var(--utrecht-button-subtle-disabled-border-color);--_utrecht-button-appearance-disabled-color:var(--utrecht-button-subtle-disabled-color);--_utrecht-button-appearance-focus-background-color:var(--utrecht-button-subtle-focus-background-color);--_utrecht-button-appearance-focus-border-color:var(--utrecht-button-subtle-focus-border-color);--_utrecht-button-appearance-focus-color:var(--utrecht-button-subtle-focus-color);--_utrecht-button-appearance-hover-background-color:var(--utrecht-button-subtle-hover-background-color);--_utrecht-button-appearance-hover-border-color:var(--utrecht-button-subtle-hover-border-color);--_utrecht-button-appearance-hover-color:var(--utrecht-button-subtle-hover-color);--_utrecht-button-appearance-pressed-background-color:var(--utrecht-button-subtle-pressed-background-color);--_utrecht-button-appearance-pressed-border-color:var(--utrecht-button-subtle-pressed-border-color);--_utrecht-button-appearance-pressed-color:var(--utrecht-button-subtle-pressed-color)}.utrecht-button--primary-action.utrecht-button--danger{--_utrecht-button-hint-active-background-color:var(--utrecht-button-primary-action-danger-active-background-color);--_utrecht-button-hint-active-border-color:var(--utrecht-button-primary-action-danger-active-border-color);--_utrecht-button-hint-active-color:var(--utrecht-button-primary-action-danger-active-color);--_utrecht-button-hint-background-color:var(--utrecht-button-primary-action-danger-background-color);--_utrecht-button-hint-border-color:var(--utrecht-button-primary-action-danger-border-color);--_utrecht-button-hint-color:var(--utrecht-button-primary-action-danger-color);--_utrecht-button-hint-disabled-background-color:var(\n    --utrecht-button-primary-action-danger-disabled-background-color\n  );--_utrecht-button-hint-disabled-border-color:var(--utrecht-button-primary-action-danger-disabled-border-color);--_utrecht-button-hint-disabled-color:var(--utrecht-button-primary-action-danger-disabled-color);--_utrecht-button-hint-focus-background-color:var(--utrecht-button-primary-action-danger-focus-background-color);--_utrecht-button-hint-focus-border-color:var(--utrecht-button-primary-action-danger-focus-border-color);--_utrecht-button-hint-focus-color:var(--utrecht-button-primary-action-danger-focus-color);--_utrecht-button-hint-hover-background-color:var(--utrecht-button-primary-action-danger-hover-background-color);--_utrecht-button-hint-hover-border-color:var(--utrecht-button-primary-action-danger-hover-border-color);--_utrecht-button-hint-hover-color:var(--utrecht-button-primary-action-danger-hover-color);--_utrecht-button-hint-pressed-background-color:var(\n    --utrecht-button-primary-action-danger-pressed-background-color\n  );--_utrecht-button-hint-pressed-border-color:var(--utrecht-button-primary-action-danger-pressed-border-color);--_utrecht-button-hint-pressed-color:var(--utrecht-button-primary-action-danger-pressed-color)}.utrecht-button--primary-action.utrecht-button--ready{--_utrecht-button-hint-active-background-color:var(--utrecht-button-primary-action-ready-active-background-color);--_utrecht-button-hint-active-border-color:var(--utrecht-button-primary-action-ready-active-border-color);--_utrecht-button-hint-active-color:var(--utrecht-button-primary-action-ready-active-color);--_utrecht-button-hint-background-color:var(--utrecht-button-primary-action-ready-background-color);--_utrecht-button-hint-border-color:var(--utrecht-button-primary-action-ready-border-color);--_utrecht-button-hint-color:var(--utrecht-button-primary-action-ready-color);--_utrecht-button-hint-disabled-background-color:var(\n    --utrecht-button-primary-action-ready-disabled-background-color\n  );--_utrecht-button-hint-disabled-border-color:var(--utrecht-button-primary-action-ready-disabled-border-color);--_utrecht-button-hint-disabled-color:var(--utrecht-button-primary-action-ready-disabled-color);--_utrecht-button-hint-focus-background-color:var(--utrecht-button-primary-action-ready-focus-background-color);--_utrecht-button-hint-focus-border-color:var(--utrecht-button-primary-action-ready-focus-border-color);--_utrecht-button-hint-focus-color:var(--utrecht-button-primary-action-ready-focus-color);--_utrecht-button-hint-hover-background-color:var(--utrecht-button-primary-action-ready-hover-background-color);--_utrecht-button-hint-hover-border-color:var(--utrecht-button-primary-action-ready-hover-border-color);--_utrecht-button-hint-hover-color:var(--utrecht-button-primary-action-ready-hover-color);--_utrecht-button-hint-pressed-background-color:var(\n    --utrecht-button-primary-action-ready-pressed-background-color\n  );--_utrecht-button-hint-pressed-border-color:var(--utrecht-button-primary-action-ready-pressed-border-color);--_utrecht-button-hint-pressed-color:var(--utrecht-button-primary-action-ready-pressed-color)}.utrecht-button--primary-action.utrecht-button--warning{--_utrecht-button-hint-active-background-color:var(--utrecht-button-primary-action-warning-active-background-color);--_utrecht-button-hint-active-border-color:var(--utrecht-button-primary-action-warning-active-border-color);--_utrecht-button-hint-active-color:var(--utrecht-button-primary-action-warning-active-color);--_utrecht-button-hint-background-color:var(--utrecht-button-primary-action-warning-background-color);--_utrecht-button-hint-border-color:var(--utrecht-button-primary-action-warning-border-color);--_utrecht-button-hint-color:var(--utrecht-button-primary-action-warning-color);--_utrecht-button-hint-disabled-background-color:var(\n    --utrecht-button-primary-action-warning-disabled-background-color\n  );--_utrecht-button-hint-disabled-border-color:var(--utrecht-button-primary-action-warning-disabled-border-color);--_utrecht-button-hint-disabled-color:var(--utrecht-button-primary-action-warning-disabled-color);--_utrecht-button-hint-focus-background-color:var(--utrecht-button-primary-action-warning-focus-background-color);--_utrecht-button-hint-focus-border-color:var(--utrecht-button-primary-action-warning-focus-border-color);--_utrecht-button-hint-focus-color:var(--utrecht-button-primary-action-warning-focus-color);--_utrecht-button-hint-hover-background-color:var(--utrecht-button-primary-action-warning-hover-background-color);--_utrecht-button-hint-hover-border-color:var(--utrecht-button-primary-action-warning-hover-border-color);--_utrecht-button-hint-hover-color:var(--utrecht-button-primary-action-warning-hover-color);--_utrecht-button-hint-pressed-background-color:var(\n    --utrecht-button-primary-action-warning-pressed-background-color\n  );--_utrecht-button-hint-pressed-border-color:var(--utrecht-button-primary-action-warning-pressed-border-color);--_utrecht-button-hint-pressed-color:var(--utrecht-button-primary-action-warning-pressed-color)}.utrecht-button--secondary-action.utrecht-button--danger{--_utrecht-button-hint-active-background-color:var(--utrecht-button-secondary-action-danger-active-background-color);--_utrecht-button-hint-active-border-color:var(--utrecht-button-secondary-action-danger-active-border-color);--_utrecht-button-hint-active-color:var(--utrecht-button-secondary-action-danger-active-color);--_utrecht-button-hint-background-color:var(--utrecht-button-secondary-action-danger-background-color);--_utrecht-button-hint-border-color:var(--utrecht-button-secondary-action-danger-border-color);--_utrecht-button-hint-color:var(--utrecht-button-secondary-action-danger-color);--_utrecht-button-hint-disabled-background-color:var(\n    --utrecht-button-secondary-action-danger-disabled-background-color\n  );--_utrecht-button-hint-disabled-border-color:var(--utrecht-button-secondary-action-danger-disabled-border-color);--_utrecht-button-hint-disabled-color:var(--utrecht-button-secondary-action-danger-disabled-color);--_utrecht-button-hint-focus-background-color:var(--utrecht-button-secondary-action-danger-focus-background-color);--_utrecht-button-hint-focus-border-color:var(--utrecht-button-secondary-action-danger-focus-border-color);--_utrecht-button-hint-focus-color:var(--utrecht-button-secondary-action-danger-focus-color);--_utrecht-button-hint-hover-background-color:var(--utrecht-button-secondary-action-danger-hover-background-color);--_utrecht-button-hint-hover-border-color:var(--utrecht-button-secondary-action-danger-hover-border-color);--_utrecht-button-hint-hover-color:var(--utrecht-button-secondary-action-danger-hover-color);--_utrecht-button-hint-pressed-background-color:var(\n    --utrecht-button-secondary-action-danger-pressed-background-color\n  );--_utrecht-button-hint-pressed-border-color:var(--utrecht-button-secondary-action-danger-pressed-border-color);--_utrecht-button-hint-pressed-color:var(--utrecht-button-secondary-action-danger-pressed-color)}.utrecht-button--secondary-action.utrecht-button--ready{--_utrecht-button-hint-active-background-color:var(--utrecht-button-secondary-action-ready-active-background-color);--_utrecht-button-hint-active-border-color:var(--utrecht-button-secondary-action-ready-active-border-color);--_utrecht-button-hint-active-color:var(--utrecht-button-secondary-action-ready-active-color);--_utrecht-button-hint-background-color:var(--utrecht-button-secondary-action-ready-background-color);--_utrecht-button-hint-border-color:var(--utrecht-button-secondary-action-ready-border-color);--_utrecht-button-hint-color:var(--utrecht-button-secondary-action-ready-color);--_utrecht-button-hint-disabled-background-color:var(\n    --utrecht-button-secondary-action-ready-disabled-background-color\n  );--_utrecht-button-hint-disabled-border-color:var(--utrecht-button-secondary-action-ready-disabled-border-color);--_utrecht-button-hint-disabled-color:var(--utrecht-button-secondary-action-ready-disabled-color);--_utrecht-button-hint-focus-background-color:var(--utrecht-button-secondary-action-ready-focus-background-color);--_utrecht-button-hint-focus-border-color:var(--utrecht-button-secondary-action-ready-focus-border-color);--_utrecht-button-hint-focus-color:var(--utrecht-button-secondary-action-ready-focus-color);--_utrecht-button-hint-hover-background-color:var(--utrecht-button-secondary-action-ready-hover-background-color);--_utrecht-button-hint-hover-border-color:var(--utrecht-button-secondary-action-ready-hover-border-color);--_utrecht-button-hint-hover-color:var(--utrecht-button-secondary-action-ready-hover-color);--_utrecht-button-hint-pressed-background-color:var(\n    --utrecht-button-secondary-action-ready-pressed-background-color\n  );--_utrecht-button-hint-pressed-border-color:var(--utrecht-button-secondary-action-ready-pressed-border-color);--_utrecht-button-hint-pressed-color:var(--utrecht-button-secondary-action-ready-pressed-color)}.utrecht-button--secondary-action.utrecht-button--warning{--_utrecht-button-hint-active-background-color:var(--utrecht-button-secondary-action-warning-active-background-color);--_utrecht-button-hint-active-border-color:var(--utrecht-button-secondary-action-warning-active-border-color);--_utrecht-button-hint-active-color:var(--utrecht-button-secondary-action-warning-active-color);--_utrecht-button-hint-background-color:var(--utrecht-button-secondary-action-warning-background-color);--_utrecht-button-hint-border-color:var(--utrecht-button-secondary-action-warning-border-color);--_utrecht-button-hint-color:var(--utrecht-button-secondary-action-warning-color);--_utrecht-button-hint-disabled-background-color:var(\n    --utrecht-button-secondary-action-warning-disabled-background-color\n  );--_utrecht-button-hint-disabled-border-color:var(--utrecht-button-secondary-action-warning-disabled-border-color);--_utrecht-button-hint-disabled-color:var(--utrecht-button-secondary-action-warning-disabled-color);--_utrecht-button-hint-focus-background-color:var(--utrecht-button-secondary-action-warning-focus-background-color);--_utrecht-button-hint-focus-border-color:var(--utrecht-button-secondary-action-warning-focus-border-color);--_utrecht-button-hint-focus-color:var(--utrecht-button-secondary-action-warning-focus-color);--_utrecht-button-hint-hover-background-color:var(--utrecht-button-secondary-action-warning-hover-background-color);--_utrecht-button-hint-hover-border-color:var(--utrecht-button-secondary-action-warning-hover-border-color);--_utrecht-button-hint-hover-color:var(--utrecht-button-secondary-action-warning-hover-color);--_utrecht-button-hint-pressed-background-color:var(\n    --utrecht-button-secondary-action-warning-pressed-background-color\n  );--_utrecht-button-hint-pressed-border-color:var(--utrecht-button-secondary-action-warning-pressed-border-color);--_utrecht-button-hint-pressed-color:var(--utrecht-button-secondary-action-warning-pressed-color)}.utrecht-button--subtle.utrecht-button--danger{--_utrecht-button-hint-active-background-color:var(--utrecht-button-subtle-danger-active-background-color);--_utrecht-button-hint-active-border-color:var(--utrecht-button-subtle-danger-active-border-color);--_utrecht-button-hint-active-color:var(--utrecht-button-subtle-danger-active-color);--_utrecht-button-hint-background-color:var(--utrecht-button-subtle-danger-background-color);--_utrecht-button-hint-border-color:var(--utrecht-button-subtle-danger-border-color);--_utrecht-button-hint-color:var(--utrecht-button-subtle-danger-color);--_utrecht-button-hint-disabled-background-color:var(\n    --utrecht-button-subtle-danger-disabled-background-color\n  );--_utrecht-button-hint-disabled-border-color:var(--utrecht-button-subtle-danger-disabled-border-color);--_utrecht-button-hint-disabled-color:var(--utrecht-button-subtle-danger-disabled-color);--_utrecht-button-hint-focus-background-color:var(--utrecht-button-subtle-danger-focus-background-color);--_utrecht-button-hint-focus-border-color:var(--utrecht-button-subtle-danger-focus-border-color);--_utrecht-button-hint-focus-color:var(--utrecht-button-subtle-danger-focus-color);--_utrecht-button-hint-hover-background-color:var(--utrecht-button-subtle-danger-hover-background-color);--_utrecht-button-hint-hover-border-color:var(--utrecht-button-subtle-danger-hover-border-color);--_utrecht-button-hint-hover-color:var(--utrecht-button-subtle-danger-hover-color);--_utrecht-button-hint-pressed-background-color:var(\n    --utrecht-button-subtle-danger-pressed-background-color\n  );--_utrecht-button-hint-pressed-border-color:var(--utrecht-button-subtle-danger-pressed-border-color);--_utrecht-button-hint-pressed-color:var(--utrecht-button-subtle-danger-pressed-color)}.utrecht-button--subtle.utrecht-button--ready{--_utrecht-button-hint-active-background-color:var(--utrecht-button-subtle-ready-active-background-color);--_utrecht-button-hint-active-border-color:var(--utrecht-button-subtle-ready-active-border-color);--_utrecht-button-hint-active-color:var(--utrecht-button-subtle-ready-active-color);--_utrecht-button-hint-background-color:var(--utrecht-button-subtle-ready-background-color);--_utrecht-button-hint-border-color:var(--utrecht-button-subtle-ready-border-color);--_utrecht-button-hint-color:var(--utrecht-button-subtle-ready-color);--_utrecht-button-hint-disabled-background-color:var(\n    --utrecht-button-subtle-ready-disabled-background-color\n  );--_utrecht-button-hint-disabled-border-color:var(--utrecht-button-subtle-ready-disabled-border-color);--_utrecht-button-hint-disabled-color:var(--utrecht-button-subtle-ready-disabled-color);--_utrecht-button-hint-focus-background-color:var(--utrecht-button-subtle-ready-focus-background-color);--_utrecht-button-hint-focus-border-color:var(--utrecht-button-subtle-ready-focus-border-color);--_utrecht-button-hint-focus-color:var(--utrecht-button-subtle-ready-focus-color);--_utrecht-button-hint-hover-background-color:var(--utrecht-button-subtle-ready-hover-background-color);--_utrecht-button-hint-hover-border-color:var(--utrecht-button-subtle-ready-hover-border-color);--_utrecht-button-hint-hover-color:var(--utrecht-button-subtle-ready-hover-color);--_utrecht-button-hint-pressed-background-color:var(\n    --utrecht-button-subtle-ready-pressed-background-color\n  );--_utrecht-button-hint-pressed-border-color:var(--utrecht-button-subtle-ready-pressed-border-color);--_utrecht-button-hint-pressed-color:var(--utrecht-button-subtle-ready-pressed-color)}.utrecht-button--subtle.utrecht-button--warning{--_utrecht-button-hint-active-background-color:var(--utrecht-button-subtle-warning-active-background-color);--_utrecht-button-hint-active-border-color:var(--utrecht-button-subtle-warning-active-border-color);--_utrecht-button-hint-active-color:var(--utrecht-button-subtle-warning-active-color);--_utrecht-button-hint-background-color:var(--utrecht-button-subtle-warning-background-color);--_utrecht-button-hint-border-color:var(--utrecht-button-subtle-warning-border-color);--_utrecht-button-hint-color:var(--utrecht-button-subtle-warning-color);--_utrecht-button-hint-disabled-background-color:var(\n    --utrecht-button-subtle-warning-disabled-background-color\n  );--_utrecht-button-hint-disabled-border-color:var(--utrecht-button-subtle-warning-disabled-border-color);--_utrecht-button-hint-disabled-color:var(--utrecht-button-subtle-warning-disabled-color);--_utrecht-button-hint-focus-background-color:var(--utrecht-button-subtle-warning-focus-background-color);--_utrecht-button-hint-focus-border-color:var(--utrecht-button-subtle-warning-focus-border-color);--_utrecht-button-hint-focus-color:var(--utrecht-button-subtle-warning-focus-color);--_utrecht-button-hint-hover-background-color:var(--utrecht-button-subtle-warning-hover-background-color);--_utrecht-button-hint-hover-border-color:var(--utrecht-button-subtle-warning-hover-border-color);--_utrecht-button-hint-hover-color:var(--utrecht-button-subtle-warning-hover-color);--_utrecht-button-hint-pressed-background-color:var(\n    --utrecht-button-subtle-warning-pressed-background-color\n  );--_utrecht-button-hint-pressed-border-color:var(--utrecht-button-subtle-warning-pressed-border-color);--_utrecht-button-hint-pressed-color:var(--utrecht-button-subtle-warning-pressed-color)}.amsterdam-button{font-size:var(--amsterdam-button-narrow-font-size)}@media screen and (width > 53.375rem){.amsterdam-button{font-size:var(--amsterdam-button-wide-font-size)}}.amsterdam-button--secondary{box-shadow:var(--amsterdam-button-secondary-box-shadow)}.amsterdam-button--secondary [aria-disabled=true],.amsterdam-button--secondary:disabled{box-shadow:var(--amsterdam-button-secondary-disabled-box-shadow)}.amsterdam-button--secondary:hover:not(:disabled,[aria-disabled=true]){box-shadow:var(--amsterdam-button-secondary-hover-box-shadow)}.amsterdam-button--secondary.amsterdam-button--secondary:focus{color:var(--amsterdam-button-secondary-focus-color)}.amsterdam-button--secondary:focus:not(:disabled,[aria-disabled=true]){box-shadow:var(--amsterdam-button-secondary-focus-box-shadow)}.amsterdam-button--tertiary:hover:not(:disabled,[aria-disabled=true]){box-shadow:var(--amsterdam-button-tertiary-hover-box-shadow)}.amsterdam-button--tertiary:focus:not(:disabled,[aria-disabled=true]){box-shadow:var(--amsterdam-button-tertiary-focus-box-shadow)}";
+styleInject(css_248z$8);
+
+var css_248z$7 = ".amsterdam-form-label{color:var(--amsterdam-form-label-color);font-family:var(--amsterdam-form-label-font-family);font-size:var(--amsterdam-form-label-narrow-font-size);font-weight:var(--amsterdam-form-label-font-weight);line-height:var(--amsterdam-form-label-line-height)}@media screen and (width > 53.375rem){.amsterdam-form-label{font-size:var(--amsterdam-form-label-wide-font-size)}}";
+styleInject(css_248z$7);
+
+var css_248z$6 = ".amsterdam-heading{box-sizing:border-box;break-after:avoid;break-inside:avoid;color:var(--amsterdam-heading-color);font-family:var(--amsterdam-heading-font-family);font-weight:var(--amsterdam-heading-font-weight);margin-block:0}.amsterdam-heading--1{font-size:var(--amsterdam-heading-1-narrow-font-size);line-height:var(--amsterdam-heading-1-line-height)}@media screen and (width > 53.375rem){.amsterdam-heading--1{font-size:var(--amsterdam-heading-1-wide-font-size)}}.amsterdam-heading--2{font-size:var(--amsterdam-heading-2-narrow-font-size);line-height:var(--amsterdam-heading-2-line-height)}@media screen and (width > 53.375rem){.amsterdam-heading--2{font-size:var(--amsterdam-heading-2-wide-font-size)}}.amsterdam-heading--3{font-size:var(--amsterdam-heading-3-narrow-font-size);line-height:var(--amsterdam-heading-3-line-height)}@media screen and (width > 53.375rem){.amsterdam-heading--3{font-size:var(--amsterdam-heading-3-wide-font-size)}}.amsterdam-heading--4{font-size:var(--amsterdam-heading-4-narrow-font-size);line-height:var(--amsterdam-heading-4-line-height)}@media screen and (width > 53.375rem){.amsterdam-heading--4{font-size:var(--amsterdam-heading-4-wide-font-size)}}.amsterdam-heading--inverse-color{color:var(--amsterdam-heading-inverse-color)}";
+styleInject(css_248z$6);
+
+var css_248z$5 = ".amsterdam-icon{align-items:center;display:inline-flex}.amsterdam-icon svg{fill:currentColor}.amsterdam-icon--size-3{height:calc(var(--amsterdam-icon-size-3-icon-size-narrow)*var(--amsterdam-icon-size-3-container-multiplier))}@media screen and (width > 53.375rem){.amsterdam-icon--size-3{height:calc(var(--amsterdam-icon-size-3-icon-size-wide)*var(--amsterdam-icon-size-3-container-multiplier))}}.amsterdam-icon--size-3 svg{height:var(--amsterdam-icon-size-3-icon-size-narrow);width:var(--amsterdam-icon-size-3-icon-size-narrow)}@media screen and (width > 53.375rem){.amsterdam-icon--size-3 svg{height:var(--amsterdam-icon-size-3-icon-size-wide);width:var(--amsterdam-icon-size-3-icon-size-wide)}}.amsterdam-icon--size-4{height:calc(var(--amsterdam-icon-size-4-icon-size-narrow)*var(--amsterdam-icon-size-4-container-multiplier))}@media screen and (width > 53.375rem){.amsterdam-icon--size-4{height:calc(var(--amsterdam-icon-size-4-icon-size-wide)*var(--amsterdam-icon-size-4-container-multiplier))}}.amsterdam-icon--size-4 svg{height:var(--amsterdam-icon-size-4-icon-size-narrow);width:var(--amsterdam-icon-size-4-icon-size-narrow)}@media screen and (width > 53.375rem){.amsterdam-icon--size-4 svg{height:var(--amsterdam-icon-size-4-icon-size-wide);width:var(--amsterdam-icon-size-4-icon-size-wide)}}.amsterdam-icon--size-5{height:calc(var(--amsterdam-icon-size-5-icon-size-narrow)*var(--amsterdam-icon-size-5-container-multiplier))}@media screen and (width > 53.375rem){.amsterdam-icon--size-5{height:calc(var(--amsterdam-icon-size-5-icon-size-wide)*var(--amsterdam-icon-size-5-container-multiplier))}}.amsterdam-icon--size-5 svg{height:var(--amsterdam-icon-size-5-icon-size-narrow);width:var(--amsterdam-icon-size-5-icon-size-narrow)}@media screen and (width > 53.375rem){.amsterdam-icon--size-5 svg{height:var(--amsterdam-icon-size-5-icon-size-wide);width:var(--amsterdam-icon-size-5-icon-size-wide)}}.amsterdam-icon--size-6{height:calc(var(--amsterdam-icon-size-6-icon-size-narrow)*var(--amsterdam-icon-size-6-container-multiplier))}@media screen and (width > 53.375rem){.amsterdam-icon--size-6{height:calc(var(--amsterdam-icon-size-6-icon-size-wide)*var(--amsterdam-icon-size-6-container-multiplier))}}.amsterdam-icon--size-6 svg{height:var(--amsterdam-icon-size-6-icon-size-narrow);width:var(--amsterdam-icon-size-6-icon-size-narrow)}@media screen and (width > 53.375rem){.amsterdam-icon--size-6 svg{height:var(--amsterdam-icon-size-6-icon-size-wide);width:var(--amsterdam-icon-size-6-icon-size-wide)}}.amsterdam-icon--size-7{height:calc(var(--amsterdam-icon-size-7-icon-size-narrow)*var(--amsterdam-icon-size-7-container-multiplier))}@media screen and (width > 53.375rem){.amsterdam-icon--size-7{height:calc(var(--amsterdam-icon-size-7-icon-size-wide)*var(--amsterdam-icon-size-7-container-multiplier))}}.amsterdam-icon--size-7 svg{height:var(--amsterdam-icon-size-7-icon-size-narrow);width:var(--amsterdam-icon-size-7-icon-size-narrow)}@media screen and (width > 53.375rem){.amsterdam-icon--size-7 svg{height:var(--amsterdam-icon-size-7-icon-size-wide);width:var(--amsterdam-icon-size-7-icon-size-wide)}}";
+styleInject(css_248z$5);
+
+var css_248z$4 = ".amsterdam-link{color:var(--amsterdam-link-color);font-family:var(--amsterdam-link-font-family);font-weight:var(--amsterdam-link-font-weight);outline-offset:var(--amsterdam-link-outline-offset)}.amsterdam-link:active,.amsterdam-link:focus,.amsterdam-link:hover{color:var(--amsterdam-link-focus-color)}.amsterdam-link--standalone{display:inline-block;font-size:var(--amsterdam-link-standalone-narrow-font-size);line-height:var(--amsterdam-link-standalone-line-height);text-decoration-thickness:var(--amsterdam-link-standalone-text-decoration-thickness);text-underline-offset:var(--amsterdam-link-standalone-text-underline-offset)}.amsterdam-link--standalone:active,.amsterdam-link--standalone:focus,.amsterdam-link--standalone:hover{text-decoration-thickness:var(--amsterdam-link-standalone-focus-text-decoration-thickness);text-underline-offset:var(--amsterdam-link-standalone-focus-text-underline-offset)}@media screen and (width > 53.375rem){.amsterdam-link--standalone{font-size:var(--amsterdam-link-standalone-wide-font-size)}}.amsterdam-link--inline{font-family:var(--amsterdam-link-inline-font-family);font-size:var(--amsterdam-link-inline-font-size);line-height:var(--amsterdam-link-inline-line-height);text-decoration:var(--amsterdam-link-inline-text-decoration);text-decoration-thickness:var(--amsterdam-link-text-decoration-thickness)}.amsterdam-link--inline:active,.amsterdam-link--inline:focus,.amsterdam-link--inline:hover{text-decoration:var(--amsterdam-link-inline-focus-text-decoration);text-underline-offset:var(--amsterdam-link-inline-focus-text-underline-offset)}.amsterdam-link--inline:visited{color:var(--amsterdam-link-inline-visited-color)}.amsterdam-link--in-list{align-items:flex-start;display:inline-flex;font-size:var(--amsterdam-link-in-list-narrow-font-size);gap:var(--amsterdam-link-in-list-gap);line-height:var(--amsterdam-link-in-list-line-height);text-decoration:var(--amsterdam-link-in-list-text-decoration)}.amsterdam-link--in-list:active,.amsterdam-link--in-list:focus,.amsterdam-link--in-list:hover{text-decoration:var(--amsterdam-link-in-list-focus-text-decoration);text-decoration-thickness:var(--amsterdam-link-in-list-focus-text-decoration-thickness);text-underline-offset:var(--amsterdam-link-in-list-focus-text-underline-offset)}@media screen and (width > 53.375rem){.amsterdam-link--in-list{font-size:var(--amsterdam-link-in-list-wide-font-size)}}.amsterdam-link--in-list__chevron span.amsterdam-icon svg{height:16px;width:16px}.amsterdam-link--on-background-dark{color:var(--amsterdam-link-on-background-dark-color)}.amsterdam-link--on-background-dark:active,.amsterdam-link--on-background-dark:focus,.amsterdam-link--on-background-dark:hover{color:var(--amsterdam-link-on-background-dark-hover-color)}.amsterdam-link--on-background-dark:visited{color:var(--amsterdam-link-on-background-dark-visited-color)}.amsterdam-link--on-background-light{color:var(--amsterdam-link-on-background-light-color)}.amsterdam-link--on-background-light:active,.amsterdam-link--on-background-light:focus,.amsterdam-link--on-background-light:hover{color:var(--amsterdam-link-on-background-light-hover-color)}.amsterdam-link--on-background-light:visited{color:var(--amsterdam-link-on-background-light-visited-color)}.amsterdam-link--inline.amsterdam-link--on-background-dark,.amsterdam-link--inline.amsterdam-link--on-background-light{text-decoration:var(--amsterdam-link-inline-focus-text-decoration);text-underline-offset:var(--amsterdam-link-inline-focus-text-underline-offset)}.amsterdam-link--inline.amsterdam-link--on-background-dark:active,.amsterdam-link--inline.amsterdam-link--on-background-dark:focus,.amsterdam-link--inline.amsterdam-link--on-background-dark:hover,.amsterdam-link--inline.amsterdam-link--on-background-light:active,.amsterdam-link--inline.amsterdam-link--on-background-light:focus,.amsterdam-link--inline.amsterdam-link--on-background-light:hover{text-decoration:var(--amsterdam-link-inline-text-decoration)}";
+styleInject(css_248z$4);
+
+var css_248z$3 = ".amsterdam-paragraph{-webkit-text-size-adjust:100%;box-sizing:border-box;color:var(--amsterdam-paragraph-color);font-family:var(--amsterdam-paragraph-font-family);font-size:var(--amsterdam-paragraph-narrow-font-size);font-weight:var(--amsterdam-paragraph-font-weight);line-height:var(--amsterdam-paragraph-line-height);margin-block:0}@media screen and (width > 53.375rem){.amsterdam-paragraph{font-size:var(--amsterdam-paragraph-wide-font-size)}}.amsterdam-paragraph--small{font-size:var(--amsterdam-paragraph-small-narrow-font-size);line-height:var(--amsterdam-paragraph-small-line-height)}@media screen and (width > 53.375rem){.amsterdam-paragraph--small{font-size:var(--amsterdam-paragraph-small-wide-font-size)}}.amsterdam-paragraph--large{font-size:var(--amsterdam-paragraph-large-narrow-font-size);line-height:var(--amsterdam-paragraph-large-line-height)}@media screen and (width > 53.375rem){.amsterdam-paragraph--large{font-size:var(--amsterdam-paragraph-large-wide-font-size)}}.amsterdam-paragraph--inverse-color{color:var(--amsterdam-paragraph-inverse-color)}";
+styleInject(css_248z$3);
+
+var css_248z$2 = ".amsterdam-unordered-list{-webkit-text-size-adjust:100%;box-sizing:border-box;display:grid;gap:var(--amsterdam-unordered-list-gap);list-style:none;margin-block:0;padding-inline-start:0}.amsterdam-unordered-list:not(.amsterdam-unordered-list--no-markers){color:var(--amsterdam-unordered-list-color);font-family:var(--amsterdam-unordered-list-font-family);font-size:var(--amsterdam-unordered-list-narrow-font-size);font-weight:var(--amsterdam-unordered-list-font-weight);line-height:var(--amsterdam-unordered-list-line-height);list-style-type:var(--amsterdam-unordered-list-list-style-type)}@media screen and (width > 53.375rem){.amsterdam-unordered-list:not(.amsterdam-unordered-list--no-markers){font-size:var(--amsterdam-unordered-list-wide-font-size)}}.amsterdam-unordered-list:not(.amsterdam-unordered-list--no-markers) .amsterdam-unordered-list__item{margin-inline-start:var(--amsterdam-unordered-list-item-margin-inline-start);padding-inline-start:var(--amsterdam-unordered-list-item-padding-inline-start)}:is(.amsterdam-ordered-list,.amsterdam-unordered-list) .amsterdam-unordered-list{list-style-type:var(--amsterdam-unordered-list-unordered-list-list-style-type)}:is(.amsterdam-ordered-list,.amsterdam-unordered-list) .amsterdam-unordered-list .amsterdam-unordered-list__item{margin-inline-start:var(--amsterdam-unordered-list-unordered-list-item-margin-inline-start);padding-inline-start:var(--amsterdam-unordered-list-unordered-list-item-padding-inline-start)}";
+styleInject(css_248z$2);
+
+var css_248z$1 = "@media screen and (width > 53.375rem){.amsterdam-grid-column-start-1{grid-column-start:1}.amsterdam-grid-column-span-1{grid-column-end:span 1}.amsterdam-grid-column-start-2{grid-column-start:2}.amsterdam-grid-column-span-2{grid-column-end:span 2}.amsterdam-grid-column-start-3{grid-column-start:3}.amsterdam-grid-column-span-3{grid-column-end:span 3}.amsterdam-grid-column-start-4{grid-column-start:4}.amsterdam-grid-column-span-4{grid-column-end:span 4}.amsterdam-grid-column-start-5{grid-column-start:5}.amsterdam-grid-column-span-5{grid-column-end:span 5}.amsterdam-grid-column-start-6{grid-column-start:6}.amsterdam-grid-column-span-6{grid-column-end:span 6}.amsterdam-grid-column-start-7{grid-column-start:7}.amsterdam-grid-column-span-7{grid-column-end:span 7}.amsterdam-grid-column-start-8{grid-column-start:8}.amsterdam-grid-column-span-8{grid-column-end:span 8}.amsterdam-grid-column-start-9{grid-column-start:9}.amsterdam-grid-column-span-9{grid-column-end:span 9}.amsterdam-grid-column-start-10{grid-column-start:10}.amsterdam-grid-column-span-10{grid-column-end:span 10}.amsterdam-grid-column-start-11{grid-column-start:11}.amsterdam-grid-column-span-11{grid-column-end:span 11}.amsterdam-grid-column-start-12{grid-column-start:12}.amsterdam-grid-column-span-12{grid-column-end:span 12}}";
+styleInject(css_248z$1);
+
+var css_248z = ".amsterdam-page-grid{column-gap:var(--amsterdam-page-grid-column-gap);display:grid;grid-template-columns:repeat(var(--amsterdam-page-grid-column-count-narrow),1fr);max-width:var(--amsterdam-page-grid-max-width)}@media screen and (width > 53.375rem){.amsterdam-page-grid{grid-template-columns:repeat(var(--amsterdam-page-grid-column-count-wide),1fr)}}";
+styleInject(css_248z);
+
+var _excluded$i = ["children", "className"];
+function ownKeys$i(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread$i(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$i(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$i(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+var VisuallyHidden = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
+  var children = _ref.children,
+    className = _ref.className,
+    restProps = _objectWithoutProperties(_ref, _excluded$i);
+  return jsxRuntime.jsx("div", _objectSpread$i(_objectSpread$i({}, restProps), {}, {
+    ref: ref,
+    className: clsx('amsterdam-visually-hidden', className),
+    children: children
+  }));
+});
+VisuallyHidden.displayName = 'VisuallyHidden';
+
+var _excluded$h = ["children", "gridColumns", "className"];
+function ownKeys$h(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread$h(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$h(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$h(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+var gridColumnClassNames = function gridColumnClassNames(gridColumns) {
+  if (!gridColumns) {
+    return '';
+  }
+  if (typeof gridColumns === 'number') {
+    return "amsterdam-grid-column-span-".concat(gridColumns);
+  }
+  var start = gridColumns.start,
+    span = gridColumns.span;
+  return clsx(start && "amsterdam-grid-column-start-".concat(start), span && "amsterdam-grid-column-span-".concat(span));
+};
+var GridCell = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
+  var children = _ref.children,
+    gridColumns = _ref.gridColumns,
+    className = _ref.className,
+    restProps = _objectWithoutProperties(_ref, _excluded$h);
+  return jsxRuntime.jsx("div", _objectSpread$h(_objectSpread$h({}, restProps), {}, {
+    ref: ref,
+    className: clsx('amsterdam-grid-cell', gridColumnClassNames(gridColumns), className),
+    children: children
+  }));
+});
+GridCell.displayName = 'GridCell';
+
+var _excluded$g = ["children", "className"];
+function ownKeys$g(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread$g(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$g(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$g(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+var PageGrid = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
+  var children = _ref.children,
+    className = _ref.className,
+    restProps = _objectWithoutProperties(_ref, _excluded$g);
+  return jsxRuntime.jsx("div", _objectSpread$g(_objectSpread$g({}, restProps), {}, {
+    ref: ref,
+    className: clsx('amsterdam-page-grid', className),
+    children: children
+  }));
+});
+PageGrid.displayName = 'PageGrid';
+
+var _excluded$f = ["children", "className"],
+  _excluded2$4 = ["children", "className"],
+  _excluded3$1 = ["children", "className"],
+  _excluded4 = ["children", "className"];
+function ownKeys$f(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread$f(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$f(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$f(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+var FooterTop = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
+  var children = _ref.children,
+    className = _ref.className,
+    restProps = _objectWithoutProperties(_ref, _excluded$f);
+  return jsxRuntime.jsx(PageGrid, _objectSpread$f(_objectSpread$f({}, restProps), {}, {
+    ref: ref,
+    className: clsx('amsterdam-footer__top', className),
+    children: children
+  }));
+});
+FooterTop.displayName = 'FooterTop';
+var FooterColumn = /*#__PURE__*/react.forwardRef(function (_ref2, ref) {
+  var children = _ref2.children,
+    className = _ref2.className,
+    restProps = _objectWithoutProperties(_ref2, _excluded2$4);
+  return jsxRuntime.jsx(GridCell, _objectSpread$f(_objectSpread$f({}, restProps), {}, {
+    ref: ref,
+    className: clsx('amsterdam-footer__column', className),
+    children: children
+  }));
+});
+FooterColumn.displayName = 'FooterColumn';
+var FooterBottom = /*#__PURE__*/react.forwardRef(function (_ref3, ref) {
+  var children = _ref3.children,
+    className = _ref3.className,
+    restProps = _objectWithoutProperties(_ref3, _excluded3$1);
+  return jsxRuntime.jsx("div", _objectSpread$f(_objectSpread$f({}, restProps), {}, {
+    ref: ref,
+    className: clsx('amsterdam-footer__bottom', className),
+    children: children
+  }));
+});
+FooterBottom.displayName = 'FooterBottom';
+var Footer = /*#__PURE__*/react.forwardRef(function (_ref4, ref) {
+  var children = _ref4.children,
+    className = _ref4.className,
+    restProps = _objectWithoutProperties(_ref4, _excluded4);
+  return jsxRuntime.jsx("footer", _objectSpread$f(_objectSpread$f({}, restProps), {}, {
+    ref: ref,
+    className: clsx('amsterdam-footer', className),
+    children: children
+  }));
+});
+Footer.Top = FooterTop;
+Footer.Bottom = FooterBottom;
+Footer.Column = FooterColumn;
+Footer.displayName = 'Footer';
+Footer.Top.displayName = 'Footer.Top';
+Footer.Bottom.displayName = 'Footer.Bottom';
+Footer.Column.displayName = 'Footer.Column';
+
+var _excluded$e = ["className", "size", "svg"];
+function ownKeys$e(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread$e(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$e(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$e(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+var Icon = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
+  var className = _ref.className,
+    _ref$size = _ref.size,
+    size = _ref$size === void 0 ? 'level-3' : _ref$size,
+    svg = _ref.svg,
+    otherProps = _objectWithoutProperties(_ref, _excluded$e);
+  return jsxRuntime.jsx("span", _objectSpread$e(_objectSpread$e({
+    ref: ref,
+    className: clsx('amsterdam-icon', size === 'level-3' && 'amsterdam-icon--size-3', size === 'level-4' && 'amsterdam-icon--size-4', size === 'level-5' && 'amsterdam-icon--size-5', size === 'level-6' && 'amsterdam-icon--size-6', size === 'level-7' && 'amsterdam-icon--size-7', className)
+  }, otherProps), {}, {
+    children: svg()
+  }));
+});
+Icon.displayName = 'Icon';
+
+var _excluded$d = ["children", "className"],
+  _excluded2$3 = ["children", "icon"],
+  _excluded3 = ["children", "icon"];
+function ownKeys$d(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread$d(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$d(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$d(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+var PageMenu = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
+  var children = _ref.children,
+    className = _ref.className,
+    restProps = _objectWithoutProperties(_ref, _excluded$d);
+  return jsxRuntime.jsx("ul", _objectSpread$d(_objectSpread$d({}, restProps), {}, {
+    className: clsx('amsterdam-page-menu', className),
+    ref: ref,
+    children: children
+  }));
+});
+var PageMenuLink = /*#__PURE__*/react.forwardRef(function (_ref2, ref) {
+  var children = _ref2.children,
+    icon = _ref2.icon,
+    restProps = _objectWithoutProperties(_ref2, _excluded2$3);
+  return jsxRuntime.jsx("li", {
+    className: "amsterdam-page-menu__item",
+    children: jsxRuntime.jsxs("a", _objectSpread$d(_objectSpread$d({}, restProps), {}, {
+      ref: ref,
+      className: "amsterdam-page-menu__link",
+      children: [children, icon && jsxRuntime.jsx(Icon, {
+        svg: icon,
+        size: "level-7"
+      })]
+    }))
+  });
+});
+var PageMenuButton = /*#__PURE__*/react.forwardRef(function (_ref3, ref) {
+  var children = _ref3.children,
+    icon = _ref3.icon,
+    restProps = _objectWithoutProperties(_ref3, _excluded3);
+  return jsxRuntime.jsx("li", {
+    className: "amsterdam-page-menu__item",
+    children: jsxRuntime.jsxs("button", _objectSpread$d(_objectSpread$d({}, restProps), {}, {
+      type: "button",
+      ref: ref,
+      className: "amsterdam-page-menu__button",
+      children: [children, icon && jsxRuntime.jsx(Icon, {
+        svg: icon,
+        size: "level-7"
+      })]
+    }))
+  });
+});
+PageMenu.displayName = 'PageMenu';
+PageMenuLink.displayName = 'PageMenu.Link';
+PageMenuButton.displayName = 'PageMenu.Button';
+PageMenu.Link = PageMenuLink;
+PageMenu.Button = PageMenuButton;
+
+var _excluded$c = ["className", "label", "description"];
+function ownKeys$c(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread$c(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$c(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$c(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+var TopTaskLink = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
+  var className = _ref.className,
+    label = _ref.label,
+    description = _ref.description,
+    restProps = _objectWithoutProperties(_ref, _excluded$c);
+  return jsxRuntime.jsxs("a", _objectSpread$c(_objectSpread$c({}, restProps), {}, {
+    ref: ref,
+    className: clsx('amsterdam-top-task-link', className),
+    "aria-label": "".concat(label).concat(description ? ", ".concat(description) : ''),
+    children: [jsxRuntime.jsx("span", {
+      className: "amsterdam-top-task-link__label",
+      children: label
+    }), description && jsxRuntime.jsx("span", {
+      className: "amsterdam-top-task-link__description",
+      children: description
+    })]
+  }));
+});
+TopTaskLink.displayName = 'TopTaskLink';
+
+var _excluded$b = ["children", "className", "inverseColor"];
+function ownKeys$b(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread$b(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$b(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$b(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+var Blockquote = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
+  var children = _ref.children,
+    className = _ref.className,
+    inverseColor = _ref.inverseColor,
+    restProps = _objectWithoutProperties(_ref, _excluded$b);
+  return jsxRuntime.jsx("blockquote", _objectSpread$b(_objectSpread$b({}, restProps), {}, {
+    ref: ref,
+    className: clsx('amsterdam-blockquote', inverseColor && 'amsterdam-blockquote--inverse-color', className),
+    children: children
+  }));
+});
+Blockquote.displayName = 'Blockquote';
+
+var _excluded$a = ["children", "className", "invalid", "indeterminate"];
+function ownKeys$a(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread$a(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$a(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$a(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+var Checkbox = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
+  var children = _ref.children,
+    className = _ref.className,
+    invalid = _ref.invalid,
+    indeterminate = _ref.indeterminate,
+    restProps = _objectWithoutProperties(_ref, _excluded$a);
+  var id = react.useId();
+  var innerRef = react.useRef(null);
+  // use a passed ref if it's there, otherwise use innerRef
+  react.useImperativeHandle(ref, function () {
+    return innerRef.current;
+  });
+  // set input to indeterminate
+  react.useEffect(function () {
+    if (innerRef.current) {
+      innerRef.current.indeterminate = Boolean(indeterminate);
+    }
+  }, [innerRef, indeterminate]);
+  return (
+    // This div is here because NVDA doesn't match the input to the label
+    // without a containing element
+    jsxRuntime.jsxs("div", {
+      className: clsx('amsterdam-checkbox', className),
+      children: [jsxRuntime.jsx("input", _objectSpread$a(_objectSpread$a({}, restProps), {}, {
+        type: "checkbox",
+        className: "amsterdam-checkbox__input",
+        ref: innerRef,
+        id: id,
+        "aria-invalid": invalid || undefined
+      })), jsxRuntime.jsxs("label", {
+        className: "amsterdam-checkbox__label",
+        htmlFor: id,
+        children: [jsxRuntime.jsx("span", {
+          className: "amsterdam-checkbox__checkmark"
+        }), children]
+      })]
+    })
+  );
+});
+Checkbox.displayName = 'Checkbox';
+
+var _excluded$9 = ["children", "className", "inverseColor"];
+function ownKeys$9(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread$9(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$9(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$9(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+var PageHeading = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
+  var children = _ref.children,
+    className = _ref.className,
+    inverseColor = _ref.inverseColor,
+    restProps = _objectWithoutProperties(_ref, _excluded$9);
+  return jsxRuntime.jsx("h1", _objectSpread$9(_objectSpread$9({}, restProps), {}, {
+    ref: ref,
+    className: clsx('amsterdam-page-heading', inverseColor && 'amsterdam-page-heading--inverse-color', className),
+    children: children
+  }));
+});
+PageHeading.displayName = 'PageHeading';
+
+var _excluded$8 = ["children", "markers", "className"],
+  _excluded2$2 = ["children", "className"];
 function ownKeys$8(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread$8(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$8(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$8(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+var OrderedList = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
+  var children = _ref.children,
+    _ref$markers = _ref.markers,
+    markers = _ref$markers === void 0 ? true : _ref$markers,
+    className = _ref.className,
+    restProps = _objectWithoutProperties(_ref, _excluded$8);
+  return jsxRuntime.jsx("ol", _objectSpread$8(_objectSpread$8({
+    ref: ref,
+    className: clsx('amsterdam-ordered-list', !markers && 'amsterdam-ordered-list--no-markers', className)
+  }, restProps), {}, {
+    children: children
+  }));
+});
+OrderedList.displayName = 'OrderedList';
+var OrderedListItem = /*#__PURE__*/react.forwardRef(function (_ref2, ref) {
+  var children = _ref2.children,
+    className = _ref2.className,
+    restProps = _objectWithoutProperties(_ref2, _excluded2$2);
+  return jsxRuntime.jsx("li", _objectSpread$8(_objectSpread$8({
+    ref: ref,
+    className: clsx('amsterdam-ordered-list__item', className)
+  }, restProps), {}, {
+    children: children
+  }));
+});
+OrderedListItem.displayName = 'OrderedListItem';
+OrderedList.Item = OrderedListItem;
+
+var _excluded$7 = ["children", "className", "inverseColor", "level", "size"];
+function ownKeys$7(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread$7(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$7(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$7(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 function getHeadingElement(level) {
   switch (level) {
     case 2:
@@ -27,68 +428,88 @@ function getHeadingElement(level) {
 var Heading = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
   var children = _ref.children,
     className = _ref.className,
+    inverseColor = _ref.inverseColor,
     _ref$level = _ref.level,
     level = _ref$level === void 0 ? 1 : _ref$level,
     size = _ref.size,
-    restProps = _objectWithoutProperties(_ref, _excluded$8);
+    restProps = _objectWithoutProperties(_ref, _excluded$7);
   var HeadingX = getHeadingElement(level);
   var sizeOrLevel = size ? size.split('-')[1] : level;
-  return jsxRuntime.jsx(HeadingX, _objectSpread$8(_objectSpread$8({
+  return jsxRuntime.jsx(HeadingX, _objectSpread$7(_objectSpread$7({
     ref: ref,
-    className: clsx('amsterdam-heading', "amsterdam-heading-".concat(sizeOrLevel), className)
+    className: clsx('amsterdam-heading', "amsterdam-heading--".concat(sizeOrLevel), inverseColor && 'amsterdam-heading--inverse-color', className)
   }, restProps), {}, {
     children: children
   }));
 });
 Heading.displayName = 'Heading';
 
-var _excluded$7 = ["className", "size", "svg"];
-function ownKeys$7(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread$7(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$7(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$7(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-var Icon = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
-  var className = _ref.className,
-    _ref$size = _ref.size,
-    size = _ref$size === void 0 ? 'level-3' : _ref$size,
-    svg = _ref.svg,
-    otherProps = _objectWithoutProperties(_ref, _excluded$7);
-  return jsxRuntime.jsx("span", _objectSpread$7(_objectSpread$7({
+var _excluded$6 = ["children"],
+  _excluded2$1 = ["children", "href"];
+function ownKeys$6(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread$6(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$6(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$6(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+var Breadcrumb = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
+  var children = _ref.children,
+    restProps = _objectWithoutProperties(_ref, _excluded$6);
+  return jsxRuntime.jsx("nav", _objectSpread$6(_objectSpread$6({}, restProps), {}, {
+    className: "amsterdam-breadcrumb",
     ref: ref,
-    className: clsx('amsterdam-icon', size === 'level-3' && 'amsterdam-icon-size-3', size === 'level-4' && 'amsterdam-icon-size-4', size === 'level-5' && 'amsterdam-icon-size-5', size === 'level-6' && 'amsterdam-icon-size-6', size === 'level-7' && 'amsterdam-icon-size-7', className)
-  }, otherProps), {}, {
-    children: svg()
+    children: jsxRuntime.jsx("ol", {
+      className: "amsterdam-breadcrumb__list",
+      children: children
+    })
   }));
 });
-Icon.displayName = 'Icon';
+Breadcrumb.displayName = 'Breadcrumb';
+var BreadcrumbItem = /*#__PURE__*/react.forwardRef(function (_ref2, ref) {
+  var children = _ref2.children,
+    href = _ref2.href,
+    restProps = _objectWithoutProperties(_ref2, _excluded2$1);
+  return jsxRuntime.jsx("li", _objectSpread$6(_objectSpread$6({}, restProps), {}, {
+    className: "amsterdam-breadcrumb-item",
+    ref: ref,
+    children: jsxRuntime.jsx("a", {
+      className: "amsterdam-breadcrumb-item__link",
+      href: href,
+      children: children
+    })
+  }));
+});
+BreadcrumbItem.displayName = 'BreadcrumbItem';
+Breadcrumb.Item = BreadcrumbItem;
 
-var _excluded$6 = ["children", "variant", "onBackground", "className"];
-function ownKeys$6(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread$6(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$6(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$6(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+var _excluded$5 = ["children", "variant", "icon", "onBackground", "className"];
+function ownKeys$5(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread$5(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$5(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$5(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var Link = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
   var children = _ref.children,
-    variant = _ref.variant,
+    _ref$variant = _ref.variant,
+    variant = _ref$variant === void 0 ? 'standalone' : _ref$variant,
+    icon = _ref.icon,
     onBackground = _ref.onBackground,
     className = _ref.className,
-    otherProps = _objectWithoutProperties(_ref, _excluded$6);
-  return jsxRuntime.jsxs("a", _objectSpread$6(_objectSpread$6({}, otherProps), {}, {
+    otherProps = _objectWithoutProperties(_ref, _excluded$5);
+  return jsxRuntime.jsxs("a", _objectSpread$5(_objectSpread$5({}, otherProps), {}, {
     ref: ref,
     className: clsx('amsterdam-link', {
+      'amsterdam-link--standalone': variant === 'standalone',
       'amsterdam-link--inline': variant === 'inline',
-      'amsterdam-link--standalone-bold': variant === 'standaloneBold',
       'amsterdam-link--in-list': variant === 'inList',
+      'amsterdam-link--in-list__chevron': variant === 'inList' && !icon,
       'amsterdam-link--on-background-light': onBackground === 'light',
       'amsterdam-link--on-background-dark': onBackground === 'dark'
     }, className),
     children: [variant === 'inList' && jsxRuntime.jsx(Icon, {
-      svg: designSystemReactIcons.ChevronRight,
+      svg: icon !== null && icon !== void 0 ? icon : designSystemReactIcons.ChevronRight,
       size: "level-7"
     }), children]
   }));
 });
 Link.displayName = 'Link';
 
-var _excluded$5 = ["children", "disabled", "variant"];
-function ownKeys$5(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread$5(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$5(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$5(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+var _excluded$4 = ["children", "disabled", "variant"];
+function ownKeys$4(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread$4(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$4(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$4(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 function getAppearance(variant) {
   switch (variant) {
     case 'secondary':
@@ -104,42 +525,44 @@ var Button = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
     disabled = _ref.disabled,
     _ref$variant = _ref.variant,
     variant = _ref$variant === void 0 ? 'primary' : _ref$variant,
-    restProps = _objectWithoutProperties(_ref, _excluded$5);
-  return jsxRuntime.jsx(componentLibraryReact.Button, _objectSpread$5(_objectSpread$5({}, restProps), {}, {
+    restProps = _objectWithoutProperties(_ref, _excluded$4);
+  return jsxRuntime.jsx(componentLibraryReact.Button, _objectSpread$4(_objectSpread$4({}, restProps), {}, {
     appearance: getAppearance(variant),
     ref: ref,
     disabled: disabled,
-    className: clsx('amsterdam-button', variant === 'secondary' && 'amsterdam-button--secondary'),
+    className: clsx('amsterdam-button', variant === 'secondary' && 'amsterdam-button--secondary', variant === 'tertiary' && 'amsterdam-button--tertiary'),
     children: children
   }));
 });
 Button.displayName = 'Button';
 
-var _excluded$4 = ["children", "size", "className"];
-function ownKeys$4(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread$4(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$4(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$4(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+var _excluded$3 = ["children", "className", "gridColumns", "inverseColor", "size"];
+function ownKeys$3(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread$3(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$3(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$3(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var Paragraph = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
   var children = _ref.children,
-    size = _ref.size,
     className = _ref.className,
-    otherProps = _objectWithoutProperties(_ref, _excluded$4);
-  return jsxRuntime.jsx("p", _objectSpread$4(_objectSpread$4({
+    gridColumns = _ref.gridColumns,
+    inverseColor = _ref.inverseColor,
+    size = _ref.size,
+    otherProps = _objectWithoutProperties(_ref, _excluded$3);
+  return jsxRuntime.jsx("p", _objectSpread$3(_objectSpread$3({
     ref: ref,
-    className: clsx('amsterdam-paragraph', size && "amsterdam-paragraph-".concat(size), className)
+    className: clsx('amsterdam-paragraph', size && "amsterdam-paragraph--".concat(size), inverseColor && 'amsterdam-paragraph--inverse-color', gridColumnClassNames(gridColumns), className)
   }, otherProps), {}, {
     children: children
   }));
 });
 Paragraph.displayName = 'Paragraph';
 
-var _excluded$3 = ["children", "className"];
-function ownKeys$3(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread$3(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$3(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$3(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+var _excluded$2 = ["children", "className"];
+function ownKeys$2(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread$2(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$2(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$2(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var FormLabel = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
   var children = _ref.children,
     className = _ref.className,
-    restProps = _objectWithoutProperties(_ref, _excluded$3);
-  return jsxRuntime.jsx("label", _objectSpread$3(_objectSpread$3({}, restProps), {}, {
+    restProps = _objectWithoutProperties(_ref, _excluded$2);
+  return jsxRuntime.jsx("label", _objectSpread$2(_objectSpread$2({}, restProps), {}, {
     ref: ref,
     className: clsx('amsterdam-form-label', className),
     children: children
@@ -147,17 +570,19 @@ var FormLabel = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
 });
 FormLabel.displayName = 'FormLabel';
 
-var _excluded$2 = ["children", "className"],
+var _excluded$1 = ["children", "markers", "className"],
   _excluded2 = ["children", "className"];
-function ownKeys$2(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread$2(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$2(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$2(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function ownKeys$1(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread$1(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$1(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$1(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var UnorderedList = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
   var children = _ref.children,
+    _ref$markers = _ref.markers,
+    markers = _ref$markers === void 0 ? true : _ref$markers,
     className = _ref.className,
-    restProps = _objectWithoutProperties(_ref, _excluded$2);
-  return jsxRuntime.jsx("ul", _objectSpread$2(_objectSpread$2({
+    restProps = _objectWithoutProperties(_ref, _excluded$1);
+  return jsxRuntime.jsx("ul", _objectSpread$1(_objectSpread$1({
     ref: ref,
-    className: clsx('amsterdam-unordered-list', className)
+    className: clsx('amsterdam-unordered-list', !markers && 'amsterdam-unordered-list--no-markers', className)
   }, restProps), {}, {
     children: children
   }));
@@ -167,7 +592,7 @@ var UnorderedListItem = /*#__PURE__*/react.forwardRef(function (_ref2, ref) {
   var children = _ref2.children,
     className = _ref2.className,
     restProps = _objectWithoutProperties(_ref2, _excluded2);
-  return jsxRuntime.jsx("li", _objectSpread$2(_objectSpread$2({
+  return jsxRuntime.jsx("li", _objectSpread$1(_objectSpread$1({
     ref: ref,
     className: clsx('amsterdam-unordered-list__item', className)
   }, restProps), {}, {
@@ -183,16 +608,16 @@ var defaultValues = {
 };
 var AccordionContext = /*#__PURE__*/react.createContext(defaultValues);
 
-var _excluded$1 = ["label", "expanded", "children", "className"];
-function ownKeys$1(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread$1(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$1(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$1(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+var _excluded = ["label", "expanded", "children", "className"];
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var AccordionSection = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
   var label = _ref.label,
     _ref$expanded = _ref.expanded,
     expanded = _ref$expanded === void 0 ? false : _ref$expanded,
     children = _ref.children,
     className = _ref.className,
-    otherProps = _objectWithoutProperties(_ref, _excluded$1);
+    otherProps = _objectWithoutProperties(_ref, _excluded);
   var _useContext = react.useContext(AccordionContext),
     headingLevel = _useContext.headingLevel,
     section = _useContext.section;
@@ -204,7 +629,7 @@ var AccordionSection = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
   var id = react.useId();
   var buttonId = "button-".concat(id);
   var panelId = "panel-".concat(id);
-  return jsxRuntime.jsxs("div", _objectSpread$1(_objectSpread$1({
+  return jsxRuntime.jsxs("div", _objectSpread(_objectSpread({
     className: clsx('amsterdam-accordion__section', className),
     ref: ref
   }, otherProps), {}, {
@@ -351,29 +776,24 @@ Accordion.displayName = 'Accordion';
 Accordion.Section = AccordionSection;
 Accordion.Section.displayName = 'Accordion.Section';
 
-var _excluded = ["children", "className"];
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-var List = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
-  var children = _ref.children,
-    className = _ref.className,
-    restProps = _objectWithoutProperties(_ref, _excluded);
-  return jsxRuntime.jsx("ul", _objectSpread(_objectSpread({
-    ref: ref,
-    className: clsx('amsterdam-list', className)
-  }, restProps), {}, {
-    children: children
-  }));
-});
-List.displayName = 'List';
-
 exports.Accordion = Accordion;
+exports.Blockquote = Blockquote;
+exports.Breadcrumb = Breadcrumb;
 exports.Button = Button;
+exports.Checkbox = Checkbox;
+exports.Footer = Footer;
 exports.FormLabel = FormLabel;
+exports.GridCell = GridCell;
 exports.Heading = Heading;
 exports.Icon = Icon;
 exports.Link = Link;
-exports.List = List;
+exports.OrderedList = OrderedList;
+exports.PageGrid = PageGrid;
+exports.PageHeading = PageHeading;
+exports.PageMenu = PageMenu;
 exports.Paragraph = Paragraph;
+exports.TopTaskLink = TopTaskLink;
 exports.UnorderedList = UnorderedList;
+exports.VisuallyHidden = VisuallyHidden;
+exports.gridColumnClassNames = gridColumnClassNames;
 //# sourceMappingURL=index.cjs.js.map