@dso-toolkit/core 95.0.0 → 95.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (51) hide show
  1. package/dist/bundle/dso-document-component.js +1 -1
  2. package/dist/bundle/dso-list-button.js +1 -1
  3. package/dist/bundle/dso-map-controls.js +1 -1
  4. package/dist/bundle/dso-modal.js +1 -1
  5. package/dist/bundle/dso-ozon-content.js +1 -1
  6. package/dist/bundle/dso-table.js +1 -1
  7. package/dist/bundle/dso-viewer-grid.js +2 -2
  8. package/dist/bundle/dsot-document-component-demo.js +4 -4
  9. package/dist/bundle/{p-BcejAJTk.js → p-B-VMnSMl.js} +10 -2
  10. package/dist/bundle/{p-CR-rxxZR.js → p-B5uIYOPn.js} +4 -4
  11. package/dist/bundle/{p-pAprbk-K.js → p-ClIxAe6b.js} +2 -2
  12. package/dist/bundle/{p-Drg4jBmd.js → p-DInlGNus.js} +3 -3
  13. package/dist/cjs/dso-alert_7.cjs.entry.js +2 -2
  14. package/dist/cjs/dso-annotation-locatie_2.cjs.entry.js +1 -1
  15. package/dist/cjs/dso-list-button.cjs.entry.js +1 -1
  16. package/dist/cjs/dso-map-controls.cjs.entry.js +1 -1
  17. package/dist/cjs/dso-modal.cjs.entry.js +10 -2
  18. package/dist/cjs/dso-viewer-grid.cjs.entry.js +2 -2
  19. package/dist/collection/components/document-component/document-component.css +0 -16
  20. package/dist/collection/components/list-button/list-button.css +0 -10
  21. package/dist/collection/components/map-controls/map-controls.css +0 -16
  22. package/dist/collection/components/modal/modal.js +10 -2
  23. package/dist/collection/components/ozon-content/ozon-content.css +0 -16
  24. package/dist/collection/components/table/table.css +0 -16
  25. package/dist/collection/components/viewer-grid/viewer-grid.css +11 -21
  26. package/dist/collection/components/viewer-grid/viewer-grid.js +1 -1
  27. package/dist/components/document-component.js +1 -1
  28. package/dist/components/dso-list-button.js +1 -1
  29. package/dist/components/dso-map-controls.js +1 -1
  30. package/dist/components/dso-viewer-grid.js +1 -1
  31. package/dist/components/modal.js +1 -1
  32. package/dist/components/ozon-content.js +1 -1
  33. package/dist/components/table.js +1 -1
  34. package/dist/dso-toolkit/dso-toolkit.esm.js +1 -1
  35. package/dist/dso-toolkit/{p-015bdc99.entry.js → p-2df078b0.entry.js} +1 -1
  36. package/dist/dso-toolkit/{p-8a6862d9.entry.js → p-3a3e6ad1.entry.js} +1 -1
  37. package/dist/dso-toolkit/p-432f4b4b.entry.js +1 -0
  38. package/dist/dso-toolkit/p-825dad32.entry.js +1 -0
  39. package/dist/dso-toolkit/{p-2b05f2ab.entry.js → p-846794a5.entry.js} +1 -1
  40. package/dist/dso-toolkit/p-c59bc8c0.entry.js +1 -0
  41. package/dist/esm/dso-alert_7.entry.js +2 -2
  42. package/dist/esm/dso-annotation-locatie_2.entry.js +1 -1
  43. package/dist/esm/dso-list-button.entry.js +1 -1
  44. package/dist/esm/dso-map-controls.entry.js +1 -1
  45. package/dist/esm/dso-modal.entry.js +10 -2
  46. package/dist/esm/dso-viewer-grid.entry.js +2 -2
  47. package/dist/types/components/modal/modal.d.ts +4 -0
  48. package/package.json +3 -3
  49. package/dist/dso-toolkit/p-978b1c1c.entry.js +0 -1
  50. package/dist/dso-toolkit/p-9c2cebf3.entry.js +0 -1
  51. package/dist/dso-toolkit/p-a85bbabe.entry.js +0 -1
package/dist/cjs/dso-annotation-locatie_2.cjs.entry.js CHANGED
@@ -53,7 +53,7 @@ const Heading = ({ heading, mode, href, onClick, ...props }, children) => {
53
53
  return headingElement;
54
54
  };
55
55
 
56
- const documentComponentCss = () => `button { -webkit-appearance: button; color: inherit; cursor: pointer; font: inherit; font-family: inherit; font-size: inherit; line-height: inherit; margin: 0; overflow: visible; text-transform: none; } button[disabled] { cursor: default; } button::-moz-focus-inner { border: 0; padding: 0; } a.dso-primary, button.dso-primary, label.dso-primary { display: inline-block; font-size: 1em; font-weight: 500; margin-block-end: 0; text-decoration: none; touch-action: manipulation; text-align: var(--_dt-button-text-align, start); user-select: none; vertical-align: middle; background-clip: padding-box; } a.dso-primary:focus, a.dso-primary:focus-visible, button.dso-primary:focus, button.dso-primary:focus-visible, label.dso-primary:focus, label.dso-primary:focus-visible { outline-offset: 2px; } a.dso-primary:active, button.dso-primary:active, label.dso-primary:active { outline: 0; } a.dso-primary.extern::after, a.dso-primary.download::after, button.dso-primary.extern::after, button.dso-primary.download::after, label.dso-primary.extern::after, label.dso-primary.download::after { content: ""; display: inline-block; } a.dso-primary, button.dso-primary, label.dso-primary { background-color: var(--_dso-button-primary-background-color, #39870c); border-color: var(--_dso-button-primary-border-color, #39870c); color: var(--_dso-button-primary-color, #fff); float: var(--_dt-button-float-primary, none); border-width: 1px; border-style: solid; border-radius: 4px; line-height: 1.5; min-inline-size: 56px; inline-size: var(--_dt-button-inline-size, auto); padding-block: 11px; padding-inline: 15px; } a.dso-primary:hover, button.dso-primary:hover, label.dso-primary:hover { background-color: var(--_dso-button-primary-hover-background-color, #275937); border-color: var(--_dso-button-primary-hover-border-color, #275937); color: var(--_dso-button-primary-hover-color, #fff); float: var(--_dt-button-float-primary, none); } a.dso-primary:active, button.dso-primary:active, label.dso-primary:active { background-color: var(--_dso-button-primary-active-background-color, #173521); border-color: var(--_dso-button-primary-active-border-color, #173521); color: var(--_dso-button-primary-active-color, #fff); float: var(--_dt-button-float-primary, none); } a.dso-primary[disabled], a.dso-primary[disabled]:hover, button.dso-primary[disabled], button.dso-primary[disabled]:hover, label.dso-primary[disabled], label.dso-primary[disabled]:hover { background-color: var(--_dso-button-primary-disabled-background-color, #afcf9d); border-color: var(--_dso-button-primary-disabled-border-color, #afcf9d); color: var(--_dso-button-primary-disabled-color, #fff); float: var(--_dt-button-float-primary, none); } a.dso-primary.dso-small, button.dso-primary.dso-small, label.dso-primary.dso-small { line-height: 1rem; } a.dso-primary.dso-small dso-icon, a.dso-primary.dso-small.extern::after, a.dso-primary.dso-small.download::after, a.dso-primary.dso-small.dso-spinner::before, button.dso-primary.dso-small dso-icon, button.dso-primary.dso-small.extern::after, button.dso-primary.dso-small.download::after, button.dso-primary.dso-small.dso-spinner::before, label.dso-primary.dso-small dso-icon, label.dso-primary.dso-small.extern::after, label.dso-primary.dso-small.download::after, label.dso-primary.dso-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-primary.dso-small.dso-spinner-left::before, button.dso-primary.dso-small.dso-spinner-left::before, label.dso-primary.dso-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-primary.dso-small.dso-spinner-right::after, button.dso-primary.dso-small.dso-spinner-right::after, label.dso-primary.dso-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-primary.dso-extra-small, button.dso-primary.dso-extra-small, label.dso-primary.dso-extra-small { line-height: 1rem; } a.dso-primary.dso-extra-small dso-icon, a.dso-primary.dso-extra-small.extern::after, a.dso-primary.dso-extra-small.download::after, a.dso-primary.dso-extra-small.dso-spinner::before, button.dso-primary.dso-extra-small dso-icon, button.dso-primary.dso-extra-small.extern::after, button.dso-primary.dso-extra-small.download::after, button.dso-primary.dso-extra-small.dso-spinner::before, label.dso-primary.dso-extra-small dso-icon, label.dso-primary.dso-extra-small.extern::after, label.dso-primary.dso-extra-small.download::after, label.dso-primary.dso-extra-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-primary.dso-extra-small.dso-spinner-left::before, button.dso-primary.dso-extra-small.dso-spinner-left::before, label.dso-primary.dso-extra-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-primary.dso-extra-small.dso-spinner-right::after, button.dso-primary.dso-extra-small.dso-spinner-right::after, label.dso-primary.dso-extra-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-primary.dso-extra-small, button.dso-primary.dso-extra-small, label.dso-primary.dso-extra-small { padding-block: 9px; } a.dso-primary dso-icon:has(+ span:not(.sr-only)), button.dso-primary dso-icon:has(+ span:not(.sr-only)), label.dso-primary dso-icon:has(+ span:not(.sr-only)) { margin-inline-start: -8px; } a.dso-primary span:not(.sr-only) + dso-icon, button.dso-primary span:not(.sr-only) + dso-icon, label.dso-primary span:not(.sr-only) + dso-icon { margin-inline-start: 8px; margin-inline-end: -8px; } a.dso-primary dso-icon + span:not(.sr-only), button.dso-primary dso-icon + span:not(.sr-only), label.dso-primary dso-icon + span:not(.sr-only) { margin-inline-start: 8px; } a.dso-primary.dso-spinner-left[disabled], a.dso-primary.dso-spinner-right[disabled], button.dso-primary.dso-spinner-left[disabled], button.dso-primary.dso-spinner-right[disabled], label.dso-primary.dso-spinner-left[disabled], label.dso-primary.dso-spinner-right[disabled] { background-color: #39870c; border-color: #39870c; color: #fff; } a.dso-primary.dso-spinner-left::before, button.dso-primary.dso-spinner-left::before, label.dso-primary.dso-spinner-left::before { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-end: 8px; } a.dso-primary.dso-spinner-right::after, button.dso-primary.dso-spinner-right::after, label.dso-primary.dso-spinner-right::after { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-start: 8px; } a.dso-primary.download::after, button.dso-primary.download::after, label.dso-primary.download::after { background: url("./di.svg#download-wit") no-repeat center; background-size: cover; block-size: 24px; vertical-align: top; inline-size: 24px; } a.dso-primary.extern::after, button.dso-primary.extern::after, label.dso-primary.extern::after { background: url("./di.svg#external-link-wit") no-repeat center; background-size: cover; block-size: 24px; vertical-align: top; inline-size: 24px; } a.dso-secondary, button.dso-secondary, label.dso-secondary { display: inline-block; font-size: 1em; font-weight: 500; margin-block-end: 0; text-decoration: none; touch-action: manipulation; text-align: var(--_dt-button-text-align, start); user-select: none; vertical-align: middle; background-clip: padding-box; } a.dso-secondary:focus, a.dso-secondary:focus-visible, button.dso-secondary:focus, button.dso-secondary:focus-visible, label.dso-secondary:focus, label.dso-secondary:focus-visible { outline-offset: 2px; } a.dso-secondary:active, button.dso-secondary:active, label.dso-secondary:active { outline: 0; } a.dso-secondary.extern::after, a.dso-secondary.download::after, button.dso-secondary.extern::after, button.dso-secondary.download::after, label.dso-secondary.extern::after, label.dso-secondary.download::after { content: ""; display: inline-block; } a.dso-secondary, button.dso-secondary, label.dso-secondary { background-color: var(--_dso-button-secondary-background-color, #fff); border-color: var(--_dso-button-secondary-border-color, #39870c); color: var(--_dso-button-secondary-color, #39870c); float: var(--_dt-button-float-secondary, none); border-width: 1px; border-style: solid; border-radius: 4px; line-height: 1.5; min-inline-size: 56px; inline-size: var(--_dt-button-inline-size, auto); padding-block: 11px; padding-inline: 15px; } a.dso-secondary:hover, button.dso-secondary:hover, label.dso-secondary:hover { background-color: var(--_dso-button-secondary-hover-background-color, #d7e7ce); border-color: var(--_dso-button-secondary-hover-border-color, #275937); color: var(--_dso-button-secondary-hover-color, #275937); float: var(--_dt-button-float-secondary, none); } a.dso-secondary:active, button.dso-secondary:active, label.dso-secondary:active { background-color: var(--_dso-button-secondary-active-background-color, #275937); border-color: var(--_dso-button-secondary-active-border-color, #275937); color: var(--_dso-button-secondary-active-color, #fff); float: var(--_dt-button-float-secondary, none); } a.dso-secondary[disabled], a.dso-secondary[disabled]:hover, button.dso-secondary[disabled], button.dso-secondary[disabled]:hover, label.dso-secondary[disabled], label.dso-secondary[disabled]:hover { background-color: var(--_dso-button-secondary-disabled-background-color, #fff); border-color: var(--_dso-button-secondary-disabled-border-color, #afcf9d); color: var(--_dso-button-secondary-disabled-color, #afcf9d); float: var(--_dt-button-float-secondary, none); } a.dso-secondary.dso-small, button.dso-secondary.dso-small, label.dso-secondary.dso-small { line-height: 1rem; } a.dso-secondary.dso-small dso-icon, a.dso-secondary.dso-small.extern::after, a.dso-secondary.dso-small.download::after, a.dso-secondary.dso-small.dso-spinner::before, button.dso-secondary.dso-small dso-icon, button.dso-secondary.dso-small.extern::after, button.dso-secondary.dso-small.download::after, button.dso-secondary.dso-small.dso-spinner::before, label.dso-secondary.dso-small dso-icon, label.dso-secondary.dso-small.extern::after, label.dso-secondary.dso-small.download::after, label.dso-secondary.dso-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-secondary.dso-small.dso-spinner-left::before, button.dso-secondary.dso-small.dso-spinner-left::before, label.dso-secondary.dso-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-secondary.dso-small.dso-spinner-right::after, button.dso-secondary.dso-small.dso-spinner-right::after, label.dso-secondary.dso-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-secondary.dso-extra-small, button.dso-secondary.dso-extra-small, label.dso-secondary.dso-extra-small { line-height: 1rem; } a.dso-secondary.dso-extra-small dso-icon, a.dso-secondary.dso-extra-small.extern::after, a.dso-secondary.dso-extra-small.download::after, a.dso-secondary.dso-extra-small.dso-spinner::before, button.dso-secondary.dso-extra-small dso-icon, button.dso-secondary.dso-extra-small.extern::after, button.dso-secondary.dso-extra-small.download::after, button.dso-secondary.dso-extra-small.dso-spinner::before, label.dso-secondary.dso-extra-small dso-icon, label.dso-secondary.dso-extra-small.extern::after, label.dso-secondary.dso-extra-small.download::after, label.dso-secondary.dso-extra-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-secondary.dso-extra-small.dso-spinner-left::before, button.dso-secondary.dso-extra-small.dso-spinner-left::before, label.dso-secondary.dso-extra-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-secondary.dso-extra-small.dso-spinner-right::after, button.dso-secondary.dso-extra-small.dso-spinner-right::after, label.dso-secondary.dso-extra-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-secondary.dso-extra-small, button.dso-secondary.dso-extra-small, label.dso-secondary.dso-extra-small { padding-block: 9px; } a.dso-secondary dso-icon:has(+ span:not(.sr-only)), button.dso-secondary dso-icon:has(+ span:not(.sr-only)), label.dso-secondary dso-icon:has(+ span:not(.sr-only)) { margin-inline-start: -8px; } a.dso-secondary span:not(.sr-only) + dso-icon, button.dso-secondary span:not(.sr-only) + dso-icon, label.dso-secondary span:not(.sr-only) + dso-icon { margin-inline-start: 8px; margin-inline-end: -8px; } a.dso-secondary dso-icon + span:not(.sr-only), button.dso-secondary dso-icon + span:not(.sr-only), label.dso-secondary dso-icon + span:not(.sr-only) { margin-inline-start: 8px; } a.dso-secondary.dso-spinner-left[disabled], a.dso-secondary.dso-spinner-right[disabled], button.dso-secondary.dso-spinner-left[disabled], button.dso-secondary.dso-spinner-right[disabled], label.dso-secondary.dso-spinner-left[disabled], label.dso-secondary.dso-spinner-right[disabled] { background-color: #fff; border-color: #39870c; color: #39870c; } a.dso-secondary.dso-spinner-left::before, button.dso-secondary.dso-spinner-left::before, label.dso-secondary.dso-spinner-left::before { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-end: 8px; } a.dso-secondary.dso-spinner-left:not([disabled]):hover::before, button.dso-secondary.dso-spinner-left:not([disabled]):hover::before, label.dso-secondary.dso-spinner-left:not([disabled]):hover::before { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-end: 8px; } a.dso-secondary.dso-spinner-left:not([disabled]).dso-small:hover::before, button.dso-secondary.dso-spinner-left:not([disabled]).dso-small:hover::before, label.dso-secondary.dso-spinner-left:not([disabled]).dso-small:hover::before { block-size: 16px; inline-size: 16px; } a.dso-secondary.dso-spinner-right::after, button.dso-secondary.dso-spinner-right::after, label.dso-secondary.dso-spinner-right::after { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-start: 8px; } a.dso-secondary.dso-spinner-right:not([disabled]):hover::after, button.dso-secondary.dso-spinner-right:not([disabled]):hover::after, label.dso-secondary.dso-spinner-right:not([disabled]):hover::after { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-start: 8px; } a.dso-secondary.dso-spinner-right:not([disabled]).dso-small:hover::after, button.dso-secondary.dso-spinner-right:not([disabled]).dso-small:hover::after, label.dso-secondary.dso-spinner-right:not([disabled]).dso-small:hover::after { block-size: 16px; inline-size: 16px; } a.dso-secondary.download::after, button.dso-secondary.download::after, label.dso-secondary.download::after { background: url("./di.svg#download") no-repeat center; background-size: cover; block-size: 24px; vertical-align: top; inline-size: 24px; } a.dso-secondary.download:hover::after, button.dso-secondary.download:hover::after, label.dso-secondary.download:hover::after { background-image: var(--_dso-di-background-image, url("./di.svg#download-bosgroen")); } a.dso-secondary.download[disabled]::after, button.dso-secondary.download[disabled]::after, label.dso-secondary.download[disabled]::after { background-image: var(--_dso-di-background-image, url("./di.svg#download-grasgroen-40")); } a.dso-secondary.extern::after, button.dso-secondary.extern::after, label.dso-secondary.extern::after { background: url("./di.svg#external-link") no-repeat center; background-size: cover; block-size: 24px; vertical-align: top; inline-size: 24px; } a.dso-secondary.extern:hover::after, button.dso-secondary.extern:hover::after, label.dso-secondary.extern:hover::after { background-image: var(--_dso-di-background-image, url("./di.svg#external-link-bosgroen")); } a.dso-secondary.extern[disabled]::after, button.dso-secondary.extern[disabled]::after, label.dso-secondary.extern[disabled]::after { background-image: var(--_dso-di-background-image, url("./di.svg#external-link-grasgroen-40")); } a.dso-tertiary, button.dso-tertiary, label.dso-tertiary { display: inline-block; font-size: 1em; font-weight: 500; margin-block-end: 0; text-decoration: none; touch-action: manipulation; text-align: var(--_dt-button-text-align, start); user-select: none; vertical-align: middle; background-clip: padding-box; } a.dso-tertiary:focus, a.dso-tertiary:focus-visible, button.dso-tertiary:focus, button.dso-tertiary:focus-visible, label.dso-tertiary:focus, label.dso-tertiary:focus-visible { outline-offset: 2px; } a.dso-tertiary:active, button.dso-tertiary:active, label.dso-tertiary:active { outline: 0; } a.dso-tertiary.extern::after, a.dso-tertiary.download::after, button.dso-tertiary.extern::after, button.dso-tertiary.download::after, label.dso-tertiary.extern::after, label.dso-tertiary.download::after { content: ""; display: inline-block; } a.dso-tertiary, button.dso-tertiary, label.dso-tertiary { display: inline-block; font-size: 1em; font-weight: 500; margin-block-end: 0; text-decoration: none; touch-action: manipulation; text-align: var(--_dt-button-text-align, start); user-select: none; vertical-align: middle; background-clip: padding-box; } a.dso-tertiary:focus, a.dso-tertiary:focus-visible, button.dso-tertiary:focus, button.dso-tertiary:focus-visible, label.dso-tertiary:focus, label.dso-tertiary:focus-visible { outline-offset: 2px; } a.dso-tertiary:active, button.dso-tertiary:active, label.dso-tertiary:active { outline: 0; } a.dso-tertiary.extern::after, a.dso-tertiary.download::after, button.dso-tertiary.extern::after, button.dso-tertiary.download::after, label.dso-tertiary.extern::after, label.dso-tertiary.download::after { content: ""; display: inline-block; } a.dso-tertiary, button.dso-tertiary, label.dso-tertiary { background-color: var(--_dso-button-tertiary-background-color, ); border-color: var(--_dso-button-tertiary-border-color, ); color: var(--_dso-button-tertiary-color, #39870c); float: var(--_dt-button-float-tertiary, none); border-width: 1px; border-style: solid; border-radius: 4px; line-height: 1.5; min-inline-size: auto; inline-size: var(--_dt-button-inline-size, auto); padding-block: 11px; padding-inline: 15px; } a.dso-tertiary:hover, button.dso-tertiary:hover, label.dso-tertiary:hover { background-color: var(--_dso-button-tertiary-hover-background-color, ); border-color: var(--_dso-button-tertiary-hover-border-color, ); color: var(--_dso-button-tertiary-hover-color, #275937); float: var(--_dt-button-float-tertiary, none); } a.dso-tertiary:active, button.dso-tertiary:active, label.dso-tertiary:active { background-color: var(--_dso-button-tertiary-active-background-color, ); border-color: var(--_dso-button-tertiary-active-border-color, ); color: var(--_dso-button-tertiary-active-color, #173521); float: var(--_dt-button-float-tertiary, none); } a.dso-tertiary[disabled], a.dso-tertiary[disabled]:hover, button.dso-tertiary[disabled], button.dso-tertiary[disabled]:hover, label.dso-tertiary[disabled], label.dso-tertiary[disabled]:hover { background-color: var(--_dso-button-tertiary-disabled-background-color, ); border-color: var(--_dso-button-tertiary-disabled-border-color, ); color: var(--_dso-button-tertiary-disabled-color, #afcf9d); float: var(--_dt-button-float-tertiary, none); } a.dso-tertiary.dso-small, button.dso-tertiary.dso-small, label.dso-tertiary.dso-small { line-height: 1rem; } a.dso-tertiary.dso-small dso-icon, a.dso-tertiary.dso-small.extern::after, a.dso-tertiary.dso-small.download::after, a.dso-tertiary.dso-small.dso-spinner::before, button.dso-tertiary.dso-small dso-icon, button.dso-tertiary.dso-small.extern::after, button.dso-tertiary.dso-small.download::after, button.dso-tertiary.dso-small.dso-spinner::before, label.dso-tertiary.dso-small dso-icon, label.dso-tertiary.dso-small.extern::after, label.dso-tertiary.dso-small.download::after, label.dso-tertiary.dso-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-tertiary.dso-small.dso-spinner-left::before, button.dso-tertiary.dso-small.dso-spinner-left::before, label.dso-tertiary.dso-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-tertiary.dso-small.dso-spinner-right::after, button.dso-tertiary.dso-small.dso-spinner-right::after, label.dso-tertiary.dso-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-tertiary.dso-extra-small, button.dso-tertiary.dso-extra-small, label.dso-tertiary.dso-extra-small { line-height: 1rem; } a.dso-tertiary.dso-extra-small dso-icon, a.dso-tertiary.dso-extra-small.extern::after, a.dso-tertiary.dso-extra-small.download::after, a.dso-tertiary.dso-extra-small.dso-spinner::before, button.dso-tertiary.dso-extra-small dso-icon, button.dso-tertiary.dso-extra-small.extern::after, button.dso-tertiary.dso-extra-small.download::after, button.dso-tertiary.dso-extra-small.dso-spinner::before, label.dso-tertiary.dso-extra-small dso-icon, label.dso-tertiary.dso-extra-small.extern::after, label.dso-tertiary.dso-extra-small.download::after, label.dso-tertiary.dso-extra-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-tertiary.dso-extra-small.dso-spinner-left::before, button.dso-tertiary.dso-extra-small.dso-spinner-left::before, label.dso-tertiary.dso-extra-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-tertiary.dso-extra-small.dso-spinner-right::after, button.dso-tertiary.dso-extra-small.dso-spinner-right::after, label.dso-tertiary.dso-extra-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-tertiary.dso-extra-small, button.dso-tertiary.dso-extra-small, label.dso-tertiary.dso-extra-small { padding-block: 9px; } a.dso-tertiary dso-icon:has(+ span:not(.sr-only)), button.dso-tertiary dso-icon:has(+ span:not(.sr-only)), label.dso-tertiary dso-icon:has(+ span:not(.sr-only)) { margin-inline-start: -8px; } a.dso-tertiary span:not(.sr-only) + dso-icon, button.dso-tertiary span:not(.sr-only) + dso-icon, label.dso-tertiary span:not(.sr-only) + dso-icon { margin-inline-start: 8px; margin-inline-end: -8px; } a.dso-tertiary dso-icon + span:not(.sr-only), button.dso-tertiary dso-icon + span:not(.sr-only), label.dso-tertiary dso-icon + span:not(.sr-only) { margin-inline-start: 8px; } a.dso-tertiary, button.dso-tertiary, label.dso-tertiary { border: 0; line-height: 1; padding-inline: 0; padding-block: var(--_dt-button-padding-block-tertiary, 0); background-color: transparent; } a.dso-tertiary[disabled].dso-spinner-left, a.dso-tertiary[disabled].dso-spinner-right, button.dso-tertiary[disabled].dso-spinner-left, button.dso-tertiary[disabled].dso-spinner-right, label.dso-tertiary[disabled].dso-spinner-left, label.dso-tertiary[disabled].dso-spinner-right { color: #39870c; } a.dso-tertiary:not([disabled]):hover, button.dso-tertiary:not([disabled]):hover, label.dso-tertiary:not([disabled]):hover { text-decoration: underline; text-underline-position: under; } a.dso-tertiary.dso-align, button.dso-tertiary.dso-align, label.dso-tertiary.dso-align { line-height: calc(1.5em - 1px); padding-block: 11px; padding-inline: 0; position: relative; } a.dso-tertiary.dso-truncate, button.dso-tertiary.dso-truncate, label.dso-tertiary.dso-truncate { max-inline-size: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } a.dso-tertiary.dso-spinner-left::before, button.dso-tertiary.dso-spinner-left::before, label.dso-tertiary.dso-spinner-left::before { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: middle; inline-size: 24px; margin-inline-end: 8px; } a.dso-tertiary.dso-spinner-right::after, button.dso-tertiary.dso-spinner-right::after, label.dso-tertiary.dso-spinner-right::after { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: middle; inline-size: 24px; margin-inline-start: 8px; } a.dso-tertiary dso-icon + span:not(.sr-only), a.dso-tertiary span:not(.sr-only) + dso-icon, button.dso-tertiary dso-icon + span:not(.sr-only), button.dso-tertiary span:not(.sr-only) + dso-icon, label.dso-tertiary dso-icon + span:not(.sr-only), label.dso-tertiary span:not(.sr-only) + dso-icon { margin-inline-start: 8px; } a.dso-tertiary dso-icon[icon=chevron-left] + span:not(.sr-only), a.dso-tertiary dso-icon[icon=chevron-right] + span:not(.sr-only), a.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-left], a.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-right], button.dso-tertiary dso-icon[icon=chevron-left] + span:not(.sr-only), button.dso-tertiary dso-icon[icon=chevron-right] + span:not(.sr-only), button.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-left], button.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-right], label.dso-tertiary dso-icon[icon=chevron-left] + span:not(.sr-only), label.dso-tertiary dso-icon[icon=chevron-right] + span:not(.sr-only), label.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-left], label.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-right] { margin-inline-start: 0; } a.dso-tertiary dso-icon, a.dso-tertiary span, button.dso-tertiary dso-icon, button.dso-tertiary span, label.dso-tertiary dso-icon, label.dso-tertiary span { vertical-align: middle; } a.dso-tertiary.extern::after, a.dso-tertiary.download::after, button.dso-tertiary.extern::after, button.dso-tertiary.download::after, label.dso-tertiary.extern::after, label.dso-tertiary.download::after { position: relative; inset-block-start: -2px; } a.dso-tertiary.download::after, button.dso-tertiary.download::after, label.dso-tertiary.download::after { background: url("./di.svg#download") no-repeat center; background-size: cover; block-size: 24px; vertical-align: top; inline-size: 24px; } a.dso-tertiary.download[disabled]::after, button.dso-tertiary.download[disabled]::after, label.dso-tertiary.download[disabled]::after { background-image: var(--_dso-di-background-image, url("./di.svg#download-grasgroen-40")); } a.dso-tertiary.download:not([disabled]):hover::after, a.dso-tertiary.download:not([disabled]):active::after, button.dso-tertiary.download:not([disabled]):hover::after, button.dso-tertiary.download:not([disabled]):active::after, label.dso-tertiary.download:not([disabled]):hover::after, label.dso-tertiary.download:not([disabled]):active::after { background-image: var(--_dso-di-background-image, url("./di.svg#download-bosgroen")); } a.dso-tertiary.extern::after, button.dso-tertiary.extern::after, label.dso-tertiary.extern::after { background: url("./di.svg#external-link") no-repeat center; background-size: cover; block-size: 24px; vertical-align: top; inline-size: 24px; } a.dso-tertiary.extern[disabled]::after, button.dso-tertiary.extern[disabled]::after, label.dso-tertiary.extern[disabled]::after { background-image: var(--_dso-di-background-image, url("./di.svg#external-link-grasgroen-40")); } a.dso-tertiary.extern:not([disabled]):hover::after, a.dso-tertiary.extern:not([disabled]):active::after, button.dso-tertiary.extern:not([disabled]):hover::after, button.dso-tertiary.extern:not([disabled]):active::after, label.dso-tertiary.extern:not([disabled]):hover::after, label.dso-tertiary.extern:not([disabled]):active::after { background-image: var(--_dso-di-background-image, url("./di.svg#external-link-bosgroen")); } a.dso-map, button.dso-map, label.dso-map { display: inline-block; font-size: 1em; font-weight: 500; margin-block-end: 0; text-decoration: none; touch-action: manipulation; text-align: var(--_dt-button-text-align, start); user-select: none; vertical-align: middle; background-clip: padding-box; } a.dso-map:focus, a.dso-map:focus-visible, button.dso-map:focus, button.dso-map:focus-visible, label.dso-map:focus, label.dso-map:focus-visible { outline-offset: 2px; } a.dso-map:active, button.dso-map:active, label.dso-map:active { outline: 0; } a.dso-map, button.dso-map, label.dso-map { background-color: var(--_dso-button-secondary-background-color, #fff); border-color: var(--_dso-button-secondary-border-color, #39870c); color: var(--_dso-button-secondary-color, #39870c); float: var(--_dt-button-float-secondary, none); border-width: 1px; border-style: solid; border-radius: 4px; line-height: 1.5; min-inline-size: 56px; inline-size: var(--_dt-button-inline-size, auto); padding-block: 11px; padding-inline: 15px; } a.dso-map:hover, button.dso-map:hover, label.dso-map:hover { background-color: var(--_dso-button-secondary-hover-background-color, #d7e7ce); border-color: var(--_dso-button-secondary-hover-border-color, #275937); color: var(--_dso-button-secondary-hover-color, #275937); float: var(--_dt-button-float-secondary, none); } a.dso-map:active, button.dso-map:active, label.dso-map:active { background-color: var(--_dso-button-secondary-active-background-color, #275937); border-color: var(--_dso-button-secondary-active-border-color, #275937); color: var(--_dso-button-secondary-active-color, #fff); float: var(--_dt-button-float-secondary, none); } a.dso-map[disabled], a.dso-map[disabled]:hover, button.dso-map[disabled], button.dso-map[disabled]:hover, label.dso-map[disabled], label.dso-map[disabled]:hover { background-color: var(--_dso-button-secondary-disabled-background-color, #fff); border-color: var(--_dso-button-secondary-disabled-border-color, #afcf9d); color: var(--_dso-button-secondary-disabled-color, #afcf9d); float: var(--_dt-button-float-secondary, none); } a.dso-map.dso-small, button.dso-map.dso-small, label.dso-map.dso-small { line-height: 1rem; } a.dso-map.dso-small dso-icon, a.dso-map.dso-small.extern::after, a.dso-map.dso-small.download::after, a.dso-map.dso-small.dso-spinner::before, button.dso-map.dso-small dso-icon, button.dso-map.dso-small.extern::after, button.dso-map.dso-small.download::after, button.dso-map.dso-small.dso-spinner::before, label.dso-map.dso-small dso-icon, label.dso-map.dso-small.extern::after, label.dso-map.dso-small.download::after, label.dso-map.dso-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-map.dso-small.dso-spinner-left::before, button.dso-map.dso-small.dso-spinner-left::before, label.dso-map.dso-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-map.dso-small.dso-spinner-right::after, button.dso-map.dso-small.dso-spinner-right::after, label.dso-map.dso-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-map.dso-extra-small, button.dso-map.dso-extra-small, label.dso-map.dso-extra-small { line-height: 1rem; } a.dso-map.dso-extra-small dso-icon, a.dso-map.dso-extra-small.extern::after, a.dso-map.dso-extra-small.download::after, a.dso-map.dso-extra-small.dso-spinner::before, button.dso-map.dso-extra-small dso-icon, button.dso-map.dso-extra-small.extern::after, button.dso-map.dso-extra-small.download::after, button.dso-map.dso-extra-small.dso-spinner::before, label.dso-map.dso-extra-small dso-icon, label.dso-map.dso-extra-small.extern::after, label.dso-map.dso-extra-small.download::after, label.dso-map.dso-extra-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-map.dso-extra-small.dso-spinner-left::before, button.dso-map.dso-extra-small.dso-spinner-left::before, label.dso-map.dso-extra-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-map.dso-extra-small.dso-spinner-right::after, button.dso-map.dso-extra-small.dso-spinner-right::after, label.dso-map.dso-extra-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-map.dso-extra-small, button.dso-map.dso-extra-small, label.dso-map.dso-extra-small { padding-block: 9px; } a.dso-map dso-icon:has(+ span:not(.sr-only)), button.dso-map dso-icon:has(+ span:not(.sr-only)), label.dso-map dso-icon:has(+ span:not(.sr-only)) { margin-inline-start: -8px; } a.dso-map span:not(.sr-only) + dso-icon, button.dso-map span:not(.sr-only) + dso-icon, label.dso-map span:not(.sr-only) + dso-icon { margin-inline-start: 8px; margin-inline-end: -8px; } a.dso-map dso-icon + span:not(.sr-only), button.dso-map dso-icon + span:not(.sr-only), label.dso-map dso-icon + span:not(.sr-only) { margin-inline-start: 8px; } a.dso-map.dso-spinner-left[disabled], a.dso-map.dso-spinner-right[disabled], button.dso-map.dso-spinner-left[disabled], button.dso-map.dso-spinner-right[disabled], label.dso-map.dso-spinner-left[disabled], label.dso-map.dso-spinner-right[disabled] { background-color: #fff; border-color: #39870c; color: #39870c; } a.dso-map.dso-spinner-left::before, button.dso-map.dso-spinner-left::before, label.dso-map.dso-spinner-left::before { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-end: 8px; } a.dso-map.dso-spinner-left:not([disabled]):hover::before, button.dso-map.dso-spinner-left:not([disabled]):hover::before, label.dso-map.dso-spinner-left:not([disabled]):hover::before { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-end: 8px; } a.dso-map.dso-spinner-left:not([disabled]).dso-small:hover::before, button.dso-map.dso-spinner-left:not([disabled]).dso-small:hover::before, label.dso-map.dso-spinner-left:not([disabled]).dso-small:hover::before { block-size: 16px; inline-size: 16px; } a.dso-map.dso-spinner-right::after, button.dso-map.dso-spinner-right::after, label.dso-map.dso-spinner-right::after { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-start: 8px; } a.dso-map.dso-spinner-right:not([disabled]):hover::after, button.dso-map.dso-spinner-right:not([disabled]):hover::after, label.dso-map.dso-spinner-right:not([disabled]):hover::after { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-start: 8px; } a.dso-map.dso-spinner-right:not([disabled]).dso-small:hover::after, button.dso-map.dso-spinner-right:not([disabled]).dso-small:hover::after, label.dso-map.dso-spinner-right:not([disabled]).dso-small:hover::after { block-size: 16px; inline-size: 16px; } a.dso-map, button.dso-map, label.dso-map { box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.5); border: 0; font-weight: 600; margin-inline-end: 16px; padding-block: 8px; padding-inline: 16px; white-space: nowrap; } a.dso-map:focus, a.dso-map:focus-visible, button.dso-map:focus, button.dso-map:focus-visible, label.dso-map:focus, label.dso-map:focus-visible { outline-offset: -1px; } a.dso-map:has(span.sr-only):has(dso-icon), button.dso-map:has(span.sr-only):has(dso-icon), label.dso-map:has(span.sr-only):has(dso-icon) { padding: 8px; min-inline-size: auto; block-size: 40px; inline-size: 40px; } a.dso-primary, a.dso-primary:hover, a.dso-primary:visited, a.dso-primary:focus-visible { color: #fff; text-decoration: none; } a.dso-secondary { text-decoration: none; } a.dso-secondary, a.dso-secondary:visited { color: #39870c; } a.dso-secondary:hover, a.dso-secondary:focus-visible { color: #275937; text-decoration: none; } a.dso-tertiary { text-decoration: none; } a.dso-tertiary, a.dso-tertiary:visited { color: #39870c; } .dso-primary + .dso-primary, .dso-primary + .dso-secondary, .dso-primary + .dso-tertiary, .dso-secondary + .dso-primary, .dso-secondary + .dso-secondary, .dso-secondary + .dso-tertiary, .dso-tertiary + .dso-primary, .dso-tertiary + .dso-secondary, .dso-tertiary + .dso-tertiary { margin-block-start: var(--_dt-button-after-button-margin-block-start, 0); margin-inline-start: var(--_dt-button-after-button-margin-inline-start, 16px); } mark { background-color: var(--_dt-mark-bg-color, #f8f5ce); color: var(--_dt-mark-color, #000); padding-block: var(--_dt-mark-padding-block, 0.2rem); font-weight: var(--_dt-mark-font-weight, normal); } mark.dso-highlight { background-color: #dbd136; } .sr-only { position: absolute; inline-size: 1px; block-size: 1px; padding: 0; margin: -1px; border: 0; overflow: hidden; clip-path: rect(0 0 0 0); } :host { display: block; --depth: var(--a, 0); } :host([not-collapsible]:where([wijzigactie=verwijder], [wijzigactie=voegtoe])) { padding-inline-start: 8px; margin-inline-end: 8px; } :host(:where([wijzigactie=verwijder], [wijzigactie=voegtoe])), :host(:where([wijzigactie=nieuweContainer], [wijzigactie=verwijderContainer])) .heading-container { padding-block-start: 4px; padding-block-end: 4px; } :host([wijzigactie=verwijderContainer]) .heading-container, :host(:where([wijzigactie=verwijder])) { --_dso-document-component-text-decoration: line-through; --_dso-alert-success-border-color: #39870c; --_dso-alert-error-border-color: #ce3f51; --_dso-alert-info-border-color: #6ca4d9; --_dso-alert-warning-border-color: #dcd400; --link-color: currentColor; --link-hover-color: currentColor; --link-visited-color: currentColor; } :host([wijzigactie=verwijderContainer]) .heading-container a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.download, .download:hover, .download:focus-visible), :host(:where([wijzigactie=verwijder])) a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.download, .download:hover, .download:focus-visible) { background-image: var(--_dso-di-background-image, url("./di.svg#download-zwart")); } :host([wijzigactie=verwijderContainer]) .heading-container a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.extern, .extern:hover, .extern:focus-visible), :host(:where([wijzigactie=verwijder])) a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.extern, .extern:hover, .extern:focus-visible) { background-image: var(--_dso-di-background-image, url("./di.svg#external-link-zwart")); } :host([wijzigactie=verwijderContainer]) .heading-container a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="tel:"], [href^="tel:"]:hover, [href^="tel:"]:focus-visible), :host(:where([wijzigactie=verwijder])) a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="tel:"], [href^="tel:"]:hover, [href^="tel:"]:focus-visible) { background-image: var(--_dso-di-background-image, url("./di.svg#call-zwart")); } :host([wijzigactie=verwijderContainer]) .heading-container a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="mailto:"], [href^="mailto:"]:hover, [href^="mailto:"]:focus-visible), :host(:where([wijzigactie=verwijder])) a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="mailto:"], [href^="mailto:"]:hover, [href^="mailto:"]:focus-visible) { background-image: var(--_dso-di-background-image, url("./di.svg#mail-outline-zwart")); } :host([wijzigactie=verwijderContainer]) .heading-container, :host(:where([wijzigactie=verwijder])) { --_dso-icon-button-tertiary-color: #191919; --_dso-icon-button-tertiary-hover-color: #4c4c4c; --_dso-icon-button-tertiary-active-color: #173521; --_dso-icon-button-tertiary-disabled-color: #999; --_dso-button-tertiary-color: #191919; --_dso-button-tertiary-hover-color: #4c4c4c; --_dso-button-tertiary-active-color: #173521; --_dso-button-tertiary-disabled-color: #999; background-color: #f5d8dc; color: #191919; --_dt-ozon-content-toggletip-color: #000; } .heading-element, .content { text-decoration: var(--_dso-document-component-text-decoration); --_dt-ozon-content-toggletip-text-decoration: underline var(--_dso-document-component-text-decoration); } @media screen and (min--moz-device-pixel-ratio: 0) { .heading-element, .content { font-family: sans-serif; } } :host([wijzigactie=nieuweContainer]) .heading-container, :host([wijzigactie=voegtoe]) { --_dso-alert-success-border-color: #39870c; --_dso-alert-error-border-color: #ce3f51; --_dso-alert-info-border-color: #6ca4d9; --_dso-alert-warning-border-color: #dcd400; --link-color: currentColor; --link-hover-color: currentColor; --link-visited-color: currentColor; } :host([wijzigactie=nieuweContainer]) .heading-container a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.download, .download:hover, .download:focus-visible), :host([wijzigactie=voegtoe]) a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.download, .download:hover, .download:focus-visible) { background-image: var(--_dso-di-background-image, url("./di.svg#download-zwart")); } :host([wijzigactie=nieuweContainer]) .heading-container a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.extern, .extern:hover, .extern:focus-visible), :host([wijzigactie=voegtoe]) a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.extern, .extern:hover, .extern:focus-visible) { background-image: var(--_dso-di-background-image, url("./di.svg#external-link-zwart")); } :host([wijzigactie=nieuweContainer]) .heading-container a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="tel:"], [href^="tel:"]:hover, [href^="tel:"]:focus-visible), :host([wijzigactie=voegtoe]) a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="tel:"], [href^="tel:"]:hover, [href^="tel:"]:focus-visible) { background-image: var(--_dso-di-background-image, url("./di.svg#call-zwart")); } :host([wijzigactie=nieuweContainer]) .heading-container a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="mailto:"], [href^="mailto:"]:hover, [href^="mailto:"]:focus-visible), :host([wijzigactie=voegtoe]) a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="mailto:"], [href^="mailto:"]:hover, [href^="mailto:"]:focus-visible) { background-image: var(--_dso-di-background-image, url("./di.svg#mail-outline-zwart")); } :host([wijzigactie=nieuweContainer]) .heading-container, :host([wijzigactie=voegtoe]) { --_dso-icon-button-tertiary-color: #191919; --_dso-icon-button-tertiary-hover-color: #4c4c4c; --_dso-icon-button-tertiary-active-color: #173521; --_dso-icon-button-tertiary-disabled-color: #999; --_dso-button-tertiary-color: #191919; --_dso-button-tertiary-hover-color: #4c4c4c; --_dso-button-tertiary-active-color: #173521; --_dso-button-tertiary-disabled-color: #999; background-color: #e4f1d4; color: #191919; box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.5); --_dt-ozon-content-toggletip-color: #000; } :host([filtered]) { position: relative; } :host([filtered])::before { content: ""; inset-inline-start: -3px; position: absolute; display: block; inline-size: 3px; inset-block-start: 0; inset-block-end: 0; background-color: #6ca4d9; } :host([open]) .annotation-container, :host([open]) .heading-container, :host([open-annotation]) .annotation-container, :host([open-annotation]) .heading-container { margin-block-end: 8px; } :host(:not([open])) dso-ozon-content::part(_subtitels), :host([mode=table-of-contents]) dso-ozon-content::part(_subtitels) { display: none; } .recursive-toggle, .toggle-button { --_dso-icon-button-tertiary-color: #275937; border: 0; padding: 0; background: 0; color: #275937; } .heading-anchor { display: flex; flex-wrap: nowrap; overflow-wrap: anywhere; background-color: transparent; color: var(--link-color); text-decoration: underline; text-underline-offset: 15%; } .heading-anchor:hover, .heading-anchor:focus-visible { color: var(--link-hover-color); text-decoration: underline; } .heading-anchor:active { text-decoration: none; } .heading-anchor .sr-only + dso-icon { margin-inline-start: 0; } .heading-anchor:visited { color: var(--link-visited-color); } .heading-anchor { text-decoration: none; } .heading-element { align-items: start; display: flex; font-size: 1rem; color: #275937; margin: 0; } .heading-element > * { vertical-align: middle; } .alternative-title { cursor: pointer; } .alternative-title:hover, .alternative-title:focus-visible { color: var(--link-hover-color); text-decoration: underline; } .alternative-title:active { text-decoration: none; } :host([not-collapsible]) .heading-container { margin-block-end: 0; } :host([not-collapsible]) .editaction-label { margin-inline-start: 0; } :host([not-collapsible]) dso-ozon-content.kop::part(_kop) { color: #000; } :host(:not([not-collapsible])) dso-ozon-content[inline].kop::part(_kop) { display: inline; } :host([mode=document]:not([not-collapsible])) { --link-color: #39870c; --link-hover-color: #676cb0; } :host([mode=document]:not([not-collapsible])) dso-ozon-content.kop::part(_kop) { cursor: pointer; } :host([mode=document]:not([not-collapsible])) dso-ozon-content.kop::part(_kop):hover { color: var(--link-hover-color); text-decoration: underline; } :host([mode=document]:not([not-collapsible])) .editaction-label { margin-inline-start: 24px; } :host([mode=document]:not([not-collapsible]):active) dso-ozon-content.kop::part(_kop) { text-decoration: none; } :host([mode=table-of-contents]) .heading-container { padding-inline-start: 8px; } :host([mode=table-of-contents]) .heading-element { color: inherit; } :host([mode=table-of-contents]) .editaction-label { margin-inline-start: 0; } :host([mode=table-of-contents][type=ARTIKEL]) dso-ozon-content.kop::part(_kop) { --_dso-icon-button-tertiary-color: inherit; color: inherit; } :host([mode=table-of-contents]:not([type=HOOFDSTUK])) dso-ozon-content.kop::part(_kop) { font-weight: normal; } .addons { margin-inline-start: auto; display: flex; gap: 8px; } .heading { display: flex; align-items: start; gap: 8px; } :host([type=ARTIKEL]:not([alternative-title]):not([mode=table-of-contents])) dso-ozon-content.kop::part(_kop), :host([type=ARTIKEL]:not([alternative-title]):not([mode=table-of-contents])) .toggle-button { --_dso-icon-button-tertiary-color: #000; color: #000; } :host([type=LID][open-annotation]) .annotation-container { margin-block-start: 8px; } .editaction-label { font-style: italic; margin-inline-start: 8px; } .content, .heading-container { padding-inline-end: 8px; } .content { --_dso-alert-margin-block-end: 8px; } .annotation-container { padding-inline-end: 8px; } .annotation-container dso-panel { --_dso-panel-body-background-color: #fff; } :host(:where([annotations-wijzigactie=verwijder])) .annotation-container dso-panel { --_dso-panel-body-background-color: #faecee; --_dso-renvooi-text-decoration: line-through; } :host([annotations-wijzigactie=voegtoe]) .annotation-container dso-panel { --_dso-panel-body-background-color: #f2f8ea; }`;
56
+ const documentComponentCss = () => `button { -webkit-appearance: button; color: inherit; cursor: pointer; font: inherit; font-family: inherit; font-size: inherit; line-height: inherit; margin: 0; overflow: visible; text-transform: none; } button[disabled] { cursor: default; } button::-moz-focus-inner { border: 0; padding: 0; } a.dso-primary, button.dso-primary, label.dso-primary { display: inline-block; font-size: 1em; font-weight: 500; margin-block-end: 0; text-decoration: none; touch-action: manipulation; text-align: var(--_dt-button-text-align, start); user-select: none; vertical-align: middle; background-clip: padding-box; } a.dso-primary:focus, a.dso-primary:focus-visible, button.dso-primary:focus, button.dso-primary:focus-visible, label.dso-primary:focus, label.dso-primary:focus-visible { outline-offset: 2px; } a.dso-primary:active, button.dso-primary:active, label.dso-primary:active { outline: 0; } a.dso-primary.extern::after, a.dso-primary.download::after, button.dso-primary.extern::after, button.dso-primary.download::after, label.dso-primary.extern::after, label.dso-primary.download::after { content: ""; display: inline-block; } a.dso-primary, button.dso-primary, label.dso-primary { background-color: var(--_dso-button-primary-background-color, #39870c); border-color: var(--_dso-button-primary-border-color, #39870c); color: var(--_dso-button-primary-color, #fff); float: var(--_dt-button-float-primary, none); border-width: 1px; border-style: solid; border-radius: 4px; line-height: 1.5; min-inline-size: 56px; inline-size: var(--_dt-button-inline-size, auto); padding-block: 11px; padding-inline: 15px; } a.dso-primary:hover, button.dso-primary:hover, label.dso-primary:hover { background-color: var(--_dso-button-primary-hover-background-color, #275937); border-color: var(--_dso-button-primary-hover-border-color, #275937); color: var(--_dso-button-primary-hover-color, #fff); float: var(--_dt-button-float-primary, none); } a.dso-primary:active, button.dso-primary:active, label.dso-primary:active { background-color: var(--_dso-button-primary-active-background-color, #173521); border-color: var(--_dso-button-primary-active-border-color, #173521); color: var(--_dso-button-primary-active-color, #fff); float: var(--_dt-button-float-primary, none); } a.dso-primary[disabled], a.dso-primary[disabled]:hover, button.dso-primary[disabled], button.dso-primary[disabled]:hover, label.dso-primary[disabled], label.dso-primary[disabled]:hover { background-color: var(--_dso-button-primary-disabled-background-color, #afcf9d); border-color: var(--_dso-button-primary-disabled-border-color, #afcf9d); color: var(--_dso-button-primary-disabled-color, #fff); float: var(--_dt-button-float-primary, none); } a.dso-primary.dso-small, button.dso-primary.dso-small, label.dso-primary.dso-small { line-height: 1rem; } a.dso-primary.dso-small dso-icon, a.dso-primary.dso-small.extern::after, a.dso-primary.dso-small.download::after, a.dso-primary.dso-small.dso-spinner::before, button.dso-primary.dso-small dso-icon, button.dso-primary.dso-small.extern::after, button.dso-primary.dso-small.download::after, button.dso-primary.dso-small.dso-spinner::before, label.dso-primary.dso-small dso-icon, label.dso-primary.dso-small.extern::after, label.dso-primary.dso-small.download::after, label.dso-primary.dso-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-primary.dso-small.dso-spinner-left::before, button.dso-primary.dso-small.dso-spinner-left::before, label.dso-primary.dso-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-primary.dso-small.dso-spinner-right::after, button.dso-primary.dso-small.dso-spinner-right::after, label.dso-primary.dso-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-primary.dso-extra-small, button.dso-primary.dso-extra-small, label.dso-primary.dso-extra-small { line-height: 1rem; } a.dso-primary.dso-extra-small dso-icon, a.dso-primary.dso-extra-small.extern::after, a.dso-primary.dso-extra-small.download::after, a.dso-primary.dso-extra-small.dso-spinner::before, button.dso-primary.dso-extra-small dso-icon, button.dso-primary.dso-extra-small.extern::after, button.dso-primary.dso-extra-small.download::after, button.dso-primary.dso-extra-small.dso-spinner::before, label.dso-primary.dso-extra-small dso-icon, label.dso-primary.dso-extra-small.extern::after, label.dso-primary.dso-extra-small.download::after, label.dso-primary.dso-extra-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-primary.dso-extra-small.dso-spinner-left::before, button.dso-primary.dso-extra-small.dso-spinner-left::before, label.dso-primary.dso-extra-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-primary.dso-extra-small.dso-spinner-right::after, button.dso-primary.dso-extra-small.dso-spinner-right::after, label.dso-primary.dso-extra-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-primary.dso-extra-small, button.dso-primary.dso-extra-small, label.dso-primary.dso-extra-small { padding-block: 9px; } a.dso-primary dso-icon:has(+ span:not(.sr-only)), button.dso-primary dso-icon:has(+ span:not(.sr-only)), label.dso-primary dso-icon:has(+ span:not(.sr-only)) { margin-inline-start: -8px; } a.dso-primary span:not(.sr-only) + dso-icon, button.dso-primary span:not(.sr-only) + dso-icon, label.dso-primary span:not(.sr-only) + dso-icon { margin-inline-start: 8px; margin-inline-end: -8px; } a.dso-primary dso-icon + span:not(.sr-only), button.dso-primary dso-icon + span:not(.sr-only), label.dso-primary dso-icon + span:not(.sr-only) { margin-inline-start: 8px; } a.dso-primary.dso-spinner-left[disabled], a.dso-primary.dso-spinner-right[disabled], button.dso-primary.dso-spinner-left[disabled], button.dso-primary.dso-spinner-right[disabled], label.dso-primary.dso-spinner-left[disabled], label.dso-primary.dso-spinner-right[disabled] { background-color: #39870c; border-color: #39870c; color: #fff; } a.dso-primary.dso-spinner-left::before, button.dso-primary.dso-spinner-left::before, label.dso-primary.dso-spinner-left::before { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-end: 8px; } a.dso-primary.dso-spinner-right::after, button.dso-primary.dso-spinner-right::after, label.dso-primary.dso-spinner-right::after { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-start: 8px; } a.dso-primary.download::after, button.dso-primary.download::after, label.dso-primary.download::after { background: url("./di.svg#download-wit") no-repeat center; background-size: cover; block-size: 24px; vertical-align: top; inline-size: 24px; } a.dso-primary.extern::after, button.dso-primary.extern::after, label.dso-primary.extern::after { background: url("./di.svg#external-link-wit") no-repeat center; background-size: cover; block-size: 24px; vertical-align: top; inline-size: 24px; } a.dso-secondary, button.dso-secondary, label.dso-secondary { display: inline-block; font-size: 1em; font-weight: 500; margin-block-end: 0; text-decoration: none; touch-action: manipulation; text-align: var(--_dt-button-text-align, start); user-select: none; vertical-align: middle; background-clip: padding-box; } a.dso-secondary:focus, a.dso-secondary:focus-visible, button.dso-secondary:focus, button.dso-secondary:focus-visible, label.dso-secondary:focus, label.dso-secondary:focus-visible { outline-offset: 2px; } a.dso-secondary:active, button.dso-secondary:active, label.dso-secondary:active { outline: 0; } a.dso-secondary.extern::after, a.dso-secondary.download::after, button.dso-secondary.extern::after, button.dso-secondary.download::after, label.dso-secondary.extern::after, label.dso-secondary.download::after { content: ""; display: inline-block; } a.dso-secondary, button.dso-secondary, label.dso-secondary { background-color: var(--_dso-button-secondary-background-color, #fff); border-color: var(--_dso-button-secondary-border-color, #39870c); color: var(--_dso-button-secondary-color, #39870c); float: var(--_dt-button-float-secondary, none); border-width: 1px; border-style: solid; border-radius: 4px; line-height: 1.5; min-inline-size: 56px; inline-size: var(--_dt-button-inline-size, auto); padding-block: 11px; padding-inline: 15px; } a.dso-secondary:hover, button.dso-secondary:hover, label.dso-secondary:hover { background-color: var(--_dso-button-secondary-hover-background-color, #d7e7ce); border-color: var(--_dso-button-secondary-hover-border-color, #275937); color: var(--_dso-button-secondary-hover-color, #275937); float: var(--_dt-button-float-secondary, none); } a.dso-secondary:active, button.dso-secondary:active, label.dso-secondary:active { background-color: var(--_dso-button-secondary-active-background-color, #275937); border-color: var(--_dso-button-secondary-active-border-color, #275937); color: var(--_dso-button-secondary-active-color, #fff); float: var(--_dt-button-float-secondary, none); } a.dso-secondary[disabled], a.dso-secondary[disabled]:hover, button.dso-secondary[disabled], button.dso-secondary[disabled]:hover, label.dso-secondary[disabled], label.dso-secondary[disabled]:hover { background-color: var(--_dso-button-secondary-disabled-background-color, #fff); border-color: var(--_dso-button-secondary-disabled-border-color, #afcf9d); color: var(--_dso-button-secondary-disabled-color, #afcf9d); float: var(--_dt-button-float-secondary, none); } a.dso-secondary.dso-small, button.dso-secondary.dso-small, label.dso-secondary.dso-small { line-height: 1rem; } a.dso-secondary.dso-small dso-icon, a.dso-secondary.dso-small.extern::after, a.dso-secondary.dso-small.download::after, a.dso-secondary.dso-small.dso-spinner::before, button.dso-secondary.dso-small dso-icon, button.dso-secondary.dso-small.extern::after, button.dso-secondary.dso-small.download::after, button.dso-secondary.dso-small.dso-spinner::before, label.dso-secondary.dso-small dso-icon, label.dso-secondary.dso-small.extern::after, label.dso-secondary.dso-small.download::after, label.dso-secondary.dso-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-secondary.dso-small.dso-spinner-left::before, button.dso-secondary.dso-small.dso-spinner-left::before, label.dso-secondary.dso-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-secondary.dso-small.dso-spinner-right::after, button.dso-secondary.dso-small.dso-spinner-right::after, label.dso-secondary.dso-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-secondary.dso-extra-small, button.dso-secondary.dso-extra-small, label.dso-secondary.dso-extra-small { line-height: 1rem; } a.dso-secondary.dso-extra-small dso-icon, a.dso-secondary.dso-extra-small.extern::after, a.dso-secondary.dso-extra-small.download::after, a.dso-secondary.dso-extra-small.dso-spinner::before, button.dso-secondary.dso-extra-small dso-icon, button.dso-secondary.dso-extra-small.extern::after, button.dso-secondary.dso-extra-small.download::after, button.dso-secondary.dso-extra-small.dso-spinner::before, label.dso-secondary.dso-extra-small dso-icon, label.dso-secondary.dso-extra-small.extern::after, label.dso-secondary.dso-extra-small.download::after, label.dso-secondary.dso-extra-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-secondary.dso-extra-small.dso-spinner-left::before, button.dso-secondary.dso-extra-small.dso-spinner-left::before, label.dso-secondary.dso-extra-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-secondary.dso-extra-small.dso-spinner-right::after, button.dso-secondary.dso-extra-small.dso-spinner-right::after, label.dso-secondary.dso-extra-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-secondary.dso-extra-small, button.dso-secondary.dso-extra-small, label.dso-secondary.dso-extra-small { padding-block: 9px; } a.dso-secondary dso-icon:has(+ span:not(.sr-only)), button.dso-secondary dso-icon:has(+ span:not(.sr-only)), label.dso-secondary dso-icon:has(+ span:not(.sr-only)) { margin-inline-start: -8px; } a.dso-secondary span:not(.sr-only) + dso-icon, button.dso-secondary span:not(.sr-only) + dso-icon, label.dso-secondary span:not(.sr-only) + dso-icon { margin-inline-start: 8px; margin-inline-end: -8px; } a.dso-secondary dso-icon + span:not(.sr-only), button.dso-secondary dso-icon + span:not(.sr-only), label.dso-secondary dso-icon + span:not(.sr-only) { margin-inline-start: 8px; } a.dso-secondary.dso-spinner-left[disabled], a.dso-secondary.dso-spinner-right[disabled], button.dso-secondary.dso-spinner-left[disabled], button.dso-secondary.dso-spinner-right[disabled], label.dso-secondary.dso-spinner-left[disabled], label.dso-secondary.dso-spinner-right[disabled] { background-color: #fff; border-color: #39870c; color: #39870c; } a.dso-secondary.dso-spinner-left::before, button.dso-secondary.dso-spinner-left::before, label.dso-secondary.dso-spinner-left::before { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-end: 8px; } a.dso-secondary.dso-spinner-left:not([disabled]):hover::before, button.dso-secondary.dso-spinner-left:not([disabled]):hover::before, label.dso-secondary.dso-spinner-left:not([disabled]):hover::before { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-end: 8px; } a.dso-secondary.dso-spinner-left:not([disabled]).dso-small:hover::before, button.dso-secondary.dso-spinner-left:not([disabled]).dso-small:hover::before, label.dso-secondary.dso-spinner-left:not([disabled]).dso-small:hover::before { block-size: 16px; inline-size: 16px; } a.dso-secondary.dso-spinner-right::after, button.dso-secondary.dso-spinner-right::after, label.dso-secondary.dso-spinner-right::after { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-start: 8px; } a.dso-secondary.dso-spinner-right:not([disabled]):hover::after, button.dso-secondary.dso-spinner-right:not([disabled]):hover::after, label.dso-secondary.dso-spinner-right:not([disabled]):hover::after { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-start: 8px; } a.dso-secondary.dso-spinner-right:not([disabled]).dso-small:hover::after, button.dso-secondary.dso-spinner-right:not([disabled]).dso-small:hover::after, label.dso-secondary.dso-spinner-right:not([disabled]).dso-small:hover::after { block-size: 16px; inline-size: 16px; } a.dso-secondary.download::after, button.dso-secondary.download::after, label.dso-secondary.download::after { background: url("./di.svg#download") no-repeat center; background-size: cover; block-size: 24px; vertical-align: top; inline-size: 24px; } a.dso-secondary.download:hover::after, button.dso-secondary.download:hover::after, label.dso-secondary.download:hover::after { background-image: var(--_dso-di-background-image, url("./di.svg#download-bosgroen")); } a.dso-secondary.download[disabled]::after, button.dso-secondary.download[disabled]::after, label.dso-secondary.download[disabled]::after { background-image: var(--_dso-di-background-image, url("./di.svg#download-grasgroen-40")); } a.dso-secondary.extern::after, button.dso-secondary.extern::after, label.dso-secondary.extern::after { background: url("./di.svg#external-link") no-repeat center; background-size: cover; block-size: 24px; vertical-align: top; inline-size: 24px; } a.dso-secondary.extern:hover::after, button.dso-secondary.extern:hover::after, label.dso-secondary.extern:hover::after { background-image: var(--_dso-di-background-image, url("./di.svg#external-link-bosgroen")); } a.dso-secondary.extern[disabled]::after, button.dso-secondary.extern[disabled]::after, label.dso-secondary.extern[disabled]::after { background-image: var(--_dso-di-background-image, url("./di.svg#external-link-grasgroen-40")); } a.dso-tertiary, button.dso-tertiary, label.dso-tertiary { display: inline-block; font-size: 1em; font-weight: 500; margin-block-end: 0; text-decoration: none; touch-action: manipulation; text-align: var(--_dt-button-text-align, start); user-select: none; vertical-align: middle; background-clip: padding-box; } a.dso-tertiary:focus, a.dso-tertiary:focus-visible, button.dso-tertiary:focus, button.dso-tertiary:focus-visible, label.dso-tertiary:focus, label.dso-tertiary:focus-visible { outline-offset: 2px; } a.dso-tertiary:active, button.dso-tertiary:active, label.dso-tertiary:active { outline: 0; } a.dso-tertiary.extern::after, a.dso-tertiary.download::after, button.dso-tertiary.extern::after, button.dso-tertiary.download::after, label.dso-tertiary.extern::after, label.dso-tertiary.download::after { content: ""; display: inline-block; } a.dso-tertiary, button.dso-tertiary, label.dso-tertiary { display: inline-block; font-size: 1em; font-weight: 500; margin-block-end: 0; text-decoration: none; touch-action: manipulation; text-align: var(--_dt-button-text-align, start); user-select: none; vertical-align: middle; background-clip: padding-box; } a.dso-tertiary:focus, a.dso-tertiary:focus-visible, button.dso-tertiary:focus, button.dso-tertiary:focus-visible, label.dso-tertiary:focus, label.dso-tertiary:focus-visible { outline-offset: 2px; } a.dso-tertiary:active, button.dso-tertiary:active, label.dso-tertiary:active { outline: 0; } a.dso-tertiary.extern::after, a.dso-tertiary.download::after, button.dso-tertiary.extern::after, button.dso-tertiary.download::after, label.dso-tertiary.extern::after, label.dso-tertiary.download::after { content: ""; display: inline-block; } a.dso-tertiary, button.dso-tertiary, label.dso-tertiary { background-color: var(--_dso-button-tertiary-background-color, ); border-color: var(--_dso-button-tertiary-border-color, ); color: var(--_dso-button-tertiary-color, #39870c); float: var(--_dt-button-float-tertiary, none); border-width: 1px; border-style: solid; border-radius: 4px; line-height: 1.5; min-inline-size: auto; inline-size: var(--_dt-button-inline-size, auto); padding-block: 11px; padding-inline: 15px; } a.dso-tertiary:hover, button.dso-tertiary:hover, label.dso-tertiary:hover { background-color: var(--_dso-button-tertiary-hover-background-color, ); border-color: var(--_dso-button-tertiary-hover-border-color, ); color: var(--_dso-button-tertiary-hover-color, #275937); float: var(--_dt-button-float-tertiary, none); } a.dso-tertiary:active, button.dso-tertiary:active, label.dso-tertiary:active { background-color: var(--_dso-button-tertiary-active-background-color, ); border-color: var(--_dso-button-tertiary-active-border-color, ); color: var(--_dso-button-tertiary-active-color, #173521); float: var(--_dt-button-float-tertiary, none); } a.dso-tertiary[disabled], a.dso-tertiary[disabled]:hover, button.dso-tertiary[disabled], button.dso-tertiary[disabled]:hover, label.dso-tertiary[disabled], label.dso-tertiary[disabled]:hover { background-color: var(--_dso-button-tertiary-disabled-background-color, ); border-color: var(--_dso-button-tertiary-disabled-border-color, ); color: var(--_dso-button-tertiary-disabled-color, #afcf9d); float: var(--_dt-button-float-tertiary, none); } a.dso-tertiary.dso-small, button.dso-tertiary.dso-small, label.dso-tertiary.dso-small { line-height: 1rem; } a.dso-tertiary.dso-small dso-icon, a.dso-tertiary.dso-small.extern::after, a.dso-tertiary.dso-small.download::after, a.dso-tertiary.dso-small.dso-spinner::before, button.dso-tertiary.dso-small dso-icon, button.dso-tertiary.dso-small.extern::after, button.dso-tertiary.dso-small.download::after, button.dso-tertiary.dso-small.dso-spinner::before, label.dso-tertiary.dso-small dso-icon, label.dso-tertiary.dso-small.extern::after, label.dso-tertiary.dso-small.download::after, label.dso-tertiary.dso-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-tertiary.dso-small.dso-spinner-left::before, button.dso-tertiary.dso-small.dso-spinner-left::before, label.dso-tertiary.dso-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-tertiary.dso-small.dso-spinner-right::after, button.dso-tertiary.dso-small.dso-spinner-right::after, label.dso-tertiary.dso-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-tertiary.dso-extra-small, button.dso-tertiary.dso-extra-small, label.dso-tertiary.dso-extra-small { line-height: 1rem; } a.dso-tertiary.dso-extra-small dso-icon, a.dso-tertiary.dso-extra-small.extern::after, a.dso-tertiary.dso-extra-small.download::after, a.dso-tertiary.dso-extra-small.dso-spinner::before, button.dso-tertiary.dso-extra-small dso-icon, button.dso-tertiary.dso-extra-small.extern::after, button.dso-tertiary.dso-extra-small.download::after, button.dso-tertiary.dso-extra-small.dso-spinner::before, label.dso-tertiary.dso-extra-small dso-icon, label.dso-tertiary.dso-extra-small.extern::after, label.dso-tertiary.dso-extra-small.download::after, label.dso-tertiary.dso-extra-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-tertiary.dso-extra-small.dso-spinner-left::before, button.dso-tertiary.dso-extra-small.dso-spinner-left::before, label.dso-tertiary.dso-extra-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-tertiary.dso-extra-small.dso-spinner-right::after, button.dso-tertiary.dso-extra-small.dso-spinner-right::after, label.dso-tertiary.dso-extra-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-tertiary.dso-extra-small, button.dso-tertiary.dso-extra-small, label.dso-tertiary.dso-extra-small { padding-block: 9px; } a.dso-tertiary, button.dso-tertiary, label.dso-tertiary { border: 0; line-height: 1; padding-inline: 0; padding-block: var(--_dt-button-padding-block-tertiary, 0); background-color: transparent; } a.dso-tertiary[disabled].dso-spinner-left, a.dso-tertiary[disabled].dso-spinner-right, button.dso-tertiary[disabled].dso-spinner-left, button.dso-tertiary[disabled].dso-spinner-right, label.dso-tertiary[disabled].dso-spinner-left, label.dso-tertiary[disabled].dso-spinner-right { color: #39870c; } a.dso-tertiary:not([disabled]):hover, button.dso-tertiary:not([disabled]):hover, label.dso-tertiary:not([disabled]):hover { text-decoration: underline; text-underline-position: under; } a.dso-tertiary.dso-align, button.dso-tertiary.dso-align, label.dso-tertiary.dso-align { line-height: calc(1.5em - 1px); padding-block: 11px; padding-inline: 0; position: relative; } a.dso-tertiary.dso-truncate, button.dso-tertiary.dso-truncate, label.dso-tertiary.dso-truncate { max-inline-size: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } a.dso-tertiary.dso-spinner-left::before, button.dso-tertiary.dso-spinner-left::before, label.dso-tertiary.dso-spinner-left::before { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: middle; inline-size: 24px; margin-inline-end: 8px; } a.dso-tertiary.dso-spinner-right::after, button.dso-tertiary.dso-spinner-right::after, label.dso-tertiary.dso-spinner-right::after { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: middle; inline-size: 24px; margin-inline-start: 8px; } a.dso-tertiary dso-icon + span:not(.sr-only), a.dso-tertiary span:not(.sr-only) + dso-icon, button.dso-tertiary dso-icon + span:not(.sr-only), button.dso-tertiary span:not(.sr-only) + dso-icon, label.dso-tertiary dso-icon + span:not(.sr-only), label.dso-tertiary span:not(.sr-only) + dso-icon { margin-inline-start: 8px; } a.dso-tertiary dso-icon[icon=chevron-left] + span:not(.sr-only), a.dso-tertiary dso-icon[icon=chevron-right] + span:not(.sr-only), a.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-left], a.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-right], button.dso-tertiary dso-icon[icon=chevron-left] + span:not(.sr-only), button.dso-tertiary dso-icon[icon=chevron-right] + span:not(.sr-only), button.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-left], button.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-right], label.dso-tertiary dso-icon[icon=chevron-left] + span:not(.sr-only), label.dso-tertiary dso-icon[icon=chevron-right] + span:not(.sr-only), label.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-left], label.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-right] { margin-inline-start: 0; } a.dso-tertiary dso-icon, a.dso-tertiary span, button.dso-tertiary dso-icon, button.dso-tertiary span, label.dso-tertiary dso-icon, label.dso-tertiary span { vertical-align: middle; } a.dso-tertiary.extern::after, a.dso-tertiary.download::after, button.dso-tertiary.extern::after, button.dso-tertiary.download::after, label.dso-tertiary.extern::after, label.dso-tertiary.download::after { position: relative; inset-block-start: -2px; } a.dso-tertiary.download::after, button.dso-tertiary.download::after, label.dso-tertiary.download::after { background: url("./di.svg#download") no-repeat center; background-size: cover; block-size: 24px; vertical-align: top; inline-size: 24px; } a.dso-tertiary.download[disabled]::after, button.dso-tertiary.download[disabled]::after, label.dso-tertiary.download[disabled]::after { background-image: var(--_dso-di-background-image, url("./di.svg#download-grasgroen-40")); } a.dso-tertiary.download:not([disabled]):hover::after, a.dso-tertiary.download:not([disabled]):active::after, button.dso-tertiary.download:not([disabled]):hover::after, button.dso-tertiary.download:not([disabled]):active::after, label.dso-tertiary.download:not([disabled]):hover::after, label.dso-tertiary.download:not([disabled]):active::after { background-image: var(--_dso-di-background-image, url("./di.svg#download-bosgroen")); } a.dso-tertiary.extern::after, button.dso-tertiary.extern::after, label.dso-tertiary.extern::after { background: url("./di.svg#external-link") no-repeat center; background-size: cover; block-size: 24px; vertical-align: top; inline-size: 24px; } a.dso-tertiary.extern[disabled]::after, button.dso-tertiary.extern[disabled]::after, label.dso-tertiary.extern[disabled]::after { background-image: var(--_dso-di-background-image, url("./di.svg#external-link-grasgroen-40")); } a.dso-tertiary.extern:not([disabled]):hover::after, a.dso-tertiary.extern:not([disabled]):active::after, button.dso-tertiary.extern:not([disabled]):hover::after, button.dso-tertiary.extern:not([disabled]):active::after, label.dso-tertiary.extern:not([disabled]):hover::after, label.dso-tertiary.extern:not([disabled]):active::after { background-image: var(--_dso-di-background-image, url("./di.svg#external-link-bosgroen")); } a.dso-map, button.dso-map, label.dso-map { display: inline-block; font-size: 1em; font-weight: 500; margin-block-end: 0; text-decoration: none; touch-action: manipulation; text-align: var(--_dt-button-text-align, start); user-select: none; vertical-align: middle; background-clip: padding-box; } a.dso-map:focus, a.dso-map:focus-visible, button.dso-map:focus, button.dso-map:focus-visible, label.dso-map:focus, label.dso-map:focus-visible { outline-offset: 2px; } a.dso-map:active, button.dso-map:active, label.dso-map:active { outline: 0; } a.dso-map, button.dso-map, label.dso-map { background-color: var(--_dso-button-secondary-background-color, #fff); border-color: var(--_dso-button-secondary-border-color, #39870c); color: var(--_dso-button-secondary-color, #39870c); float: var(--_dt-button-float-secondary, none); border-width: 1px; border-style: solid; border-radius: 4px; line-height: 1.5; min-inline-size: 56px; inline-size: var(--_dt-button-inline-size, auto); padding-block: 11px; padding-inline: 15px; } a.dso-map:hover, button.dso-map:hover, label.dso-map:hover { background-color: var(--_dso-button-secondary-hover-background-color, #d7e7ce); border-color: var(--_dso-button-secondary-hover-border-color, #275937); color: var(--_dso-button-secondary-hover-color, #275937); float: var(--_dt-button-float-secondary, none); } a.dso-map:active, button.dso-map:active, label.dso-map:active { background-color: var(--_dso-button-secondary-active-background-color, #275937); border-color: var(--_dso-button-secondary-active-border-color, #275937); color: var(--_dso-button-secondary-active-color, #fff); float: var(--_dt-button-float-secondary, none); } a.dso-map[disabled], a.dso-map[disabled]:hover, button.dso-map[disabled], button.dso-map[disabled]:hover, label.dso-map[disabled], label.dso-map[disabled]:hover { background-color: var(--_dso-button-secondary-disabled-background-color, #fff); border-color: var(--_dso-button-secondary-disabled-border-color, #afcf9d); color: var(--_dso-button-secondary-disabled-color, #afcf9d); float: var(--_dt-button-float-secondary, none); } a.dso-map.dso-small, button.dso-map.dso-small, label.dso-map.dso-small { line-height: 1rem; } a.dso-map.dso-small dso-icon, a.dso-map.dso-small.extern::after, a.dso-map.dso-small.download::after, a.dso-map.dso-small.dso-spinner::before, button.dso-map.dso-small dso-icon, button.dso-map.dso-small.extern::after, button.dso-map.dso-small.download::after, button.dso-map.dso-small.dso-spinner::before, label.dso-map.dso-small dso-icon, label.dso-map.dso-small.extern::after, label.dso-map.dso-small.download::after, label.dso-map.dso-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-map.dso-small.dso-spinner-left::before, button.dso-map.dso-small.dso-spinner-left::before, label.dso-map.dso-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-map.dso-small.dso-spinner-right::after, button.dso-map.dso-small.dso-spinner-right::after, label.dso-map.dso-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-map.dso-extra-small, button.dso-map.dso-extra-small, label.dso-map.dso-extra-small { line-height: 1rem; } a.dso-map.dso-extra-small dso-icon, a.dso-map.dso-extra-small.extern::after, a.dso-map.dso-extra-small.download::after, a.dso-map.dso-extra-small.dso-spinner::before, button.dso-map.dso-extra-small dso-icon, button.dso-map.dso-extra-small.extern::after, button.dso-map.dso-extra-small.download::after, button.dso-map.dso-extra-small.dso-spinner::before, label.dso-map.dso-extra-small dso-icon, label.dso-map.dso-extra-small.extern::after, label.dso-map.dso-extra-small.download::after, label.dso-map.dso-extra-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-map.dso-extra-small.dso-spinner-left::before, button.dso-map.dso-extra-small.dso-spinner-left::before, label.dso-map.dso-extra-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-map.dso-extra-small.dso-spinner-right::after, button.dso-map.dso-extra-small.dso-spinner-right::after, label.dso-map.dso-extra-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-map.dso-extra-small, button.dso-map.dso-extra-small, label.dso-map.dso-extra-small { padding-block: 9px; } a.dso-map dso-icon:has(+ span:not(.sr-only)), button.dso-map dso-icon:has(+ span:not(.sr-only)), label.dso-map dso-icon:has(+ span:not(.sr-only)) { margin-inline-start: -8px; } a.dso-map span:not(.sr-only) + dso-icon, button.dso-map span:not(.sr-only) + dso-icon, label.dso-map span:not(.sr-only) + dso-icon { margin-inline-start: 8px; margin-inline-end: -8px; } a.dso-map dso-icon + span:not(.sr-only), button.dso-map dso-icon + span:not(.sr-only), label.dso-map dso-icon + span:not(.sr-only) { margin-inline-start: 8px; } a.dso-map.dso-spinner-left[disabled], a.dso-map.dso-spinner-right[disabled], button.dso-map.dso-spinner-left[disabled], button.dso-map.dso-spinner-right[disabled], label.dso-map.dso-spinner-left[disabled], label.dso-map.dso-spinner-right[disabled] { background-color: #fff; border-color: #39870c; color: #39870c; } a.dso-map.dso-spinner-left::before, button.dso-map.dso-spinner-left::before, label.dso-map.dso-spinner-left::before { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-end: 8px; } a.dso-map.dso-spinner-left:not([disabled]):hover::before, button.dso-map.dso-spinner-left:not([disabled]):hover::before, label.dso-map.dso-spinner-left:not([disabled]):hover::before { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-end: 8px; } a.dso-map.dso-spinner-left:not([disabled]).dso-small:hover::before, button.dso-map.dso-spinner-left:not([disabled]).dso-small:hover::before, label.dso-map.dso-spinner-left:not([disabled]).dso-small:hover::before { block-size: 16px; inline-size: 16px; } a.dso-map.dso-spinner-right::after, button.dso-map.dso-spinner-right::after, label.dso-map.dso-spinner-right::after { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-start: 8px; } a.dso-map.dso-spinner-right:not([disabled]):hover::after, button.dso-map.dso-spinner-right:not([disabled]):hover::after, label.dso-map.dso-spinner-right:not([disabled]):hover::after { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-start: 8px; } a.dso-map.dso-spinner-right:not([disabled]).dso-small:hover::after, button.dso-map.dso-spinner-right:not([disabled]).dso-small:hover::after, label.dso-map.dso-spinner-right:not([disabled]).dso-small:hover::after { block-size: 16px; inline-size: 16px; } a.dso-map, button.dso-map, label.dso-map { box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.5); border: 0; font-weight: 600; margin-inline-end: 16px; padding-block: 8px; padding-inline: 16px; white-space: nowrap; } a.dso-map:focus, a.dso-map:focus-visible, button.dso-map:focus, button.dso-map:focus-visible, label.dso-map:focus, label.dso-map:focus-visible { outline-offset: -1px; } a.dso-map:has(span.sr-only):has(dso-icon), button.dso-map:has(span.sr-only):has(dso-icon), label.dso-map:has(span.sr-only):has(dso-icon) { padding: 8px; min-inline-size: auto; block-size: 40px; inline-size: 40px; } a.dso-primary, a.dso-primary:hover, a.dso-primary:visited, a.dso-primary:focus-visible { color: #fff; text-decoration: none; } a.dso-secondary { text-decoration: none; } a.dso-secondary, a.dso-secondary:visited { color: #39870c; } a.dso-secondary:hover, a.dso-secondary:focus-visible { color: #275937; text-decoration: none; } a.dso-tertiary { text-decoration: none; } a.dso-tertiary, a.dso-tertiary:visited { color: #39870c; } .dso-primary + .dso-primary, .dso-primary + .dso-secondary, .dso-primary + .dso-tertiary, .dso-secondary + .dso-primary, .dso-secondary + .dso-secondary, .dso-secondary + .dso-tertiary, .dso-tertiary + .dso-primary, .dso-tertiary + .dso-secondary, .dso-tertiary + .dso-tertiary { margin-block-start: var(--_dt-button-after-button-margin-block-start, 0); margin-inline-start: var(--_dt-button-after-button-margin-inline-start, 16px); } mark { background-color: var(--_dt-mark-bg-color, #f8f5ce); color: var(--_dt-mark-color, #000); padding-block: var(--_dt-mark-padding-block, 0.2rem); font-weight: var(--_dt-mark-font-weight, normal); } mark.dso-highlight { background-color: #dbd136; } .sr-only { position: absolute; inline-size: 1px; block-size: 1px; padding: 0; margin: -1px; border: 0; overflow: hidden; clip-path: rect(0 0 0 0); } :host { display: block; --depth: var(--a, 0); } :host([not-collapsible]:where([wijzigactie=verwijder], [wijzigactie=voegtoe])) { padding-inline-start: 8px; margin-inline-end: 8px; } :host(:where([wijzigactie=verwijder], [wijzigactie=voegtoe])), :host(:where([wijzigactie=nieuweContainer], [wijzigactie=verwijderContainer])) .heading-container { padding-block-start: 4px; padding-block-end: 4px; } :host([wijzigactie=verwijderContainer]) .heading-container, :host(:where([wijzigactie=verwijder])) { --_dso-document-component-text-decoration: line-through; --_dso-alert-success-border-color: #39870c; --_dso-alert-error-border-color: #ce3f51; --_dso-alert-info-border-color: #6ca4d9; --_dso-alert-warning-border-color: #dcd400; --link-color: currentColor; --link-hover-color: currentColor; --link-visited-color: currentColor; } :host([wijzigactie=verwijderContainer]) .heading-container a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.download, .download:hover, .download:focus-visible), :host(:where([wijzigactie=verwijder])) a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.download, .download:hover, .download:focus-visible) { background-image: var(--_dso-di-background-image, url("./di.svg#download-zwart")); } :host([wijzigactie=verwijderContainer]) .heading-container a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.extern, .extern:hover, .extern:focus-visible), :host(:where([wijzigactie=verwijder])) a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.extern, .extern:hover, .extern:focus-visible) { background-image: var(--_dso-di-background-image, url("./di.svg#external-link-zwart")); } :host([wijzigactie=verwijderContainer]) .heading-container a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="tel:"], [href^="tel:"]:hover, [href^="tel:"]:focus-visible), :host(:where([wijzigactie=verwijder])) a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="tel:"], [href^="tel:"]:hover, [href^="tel:"]:focus-visible) { background-image: var(--_dso-di-background-image, url("./di.svg#call-zwart")); } :host([wijzigactie=verwijderContainer]) .heading-container a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="mailto:"], [href^="mailto:"]:hover, [href^="mailto:"]:focus-visible), :host(:where([wijzigactie=verwijder])) a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="mailto:"], [href^="mailto:"]:hover, [href^="mailto:"]:focus-visible) { background-image: var(--_dso-di-background-image, url("./di.svg#mail-outline-zwart")); } :host([wijzigactie=verwijderContainer]) .heading-container, :host(:where([wijzigactie=verwijder])) { --_dso-icon-button-tertiary-color: #191919; --_dso-icon-button-tertiary-hover-color: #4c4c4c; --_dso-icon-button-tertiary-active-color: #173521; --_dso-icon-button-tertiary-disabled-color: #999; --_dso-button-tertiary-color: #191919; --_dso-button-tertiary-hover-color: #4c4c4c; --_dso-button-tertiary-active-color: #173521; --_dso-button-tertiary-disabled-color: #999; background-color: #f5d8dc; color: #191919; --_dt-ozon-content-toggletip-color: #000; } .heading-element, .content { text-decoration: var(--_dso-document-component-text-decoration); --_dt-ozon-content-toggletip-text-decoration: underline var(--_dso-document-component-text-decoration); } @media screen and (min--moz-device-pixel-ratio: 0) { .heading-element, .content { font-family: sans-serif; } } :host([wijzigactie=nieuweContainer]) .heading-container, :host([wijzigactie=voegtoe]) { --_dso-alert-success-border-color: #39870c; --_dso-alert-error-border-color: #ce3f51; --_dso-alert-info-border-color: #6ca4d9; --_dso-alert-warning-border-color: #dcd400; --link-color: currentColor; --link-hover-color: currentColor; --link-visited-color: currentColor; } :host([wijzigactie=nieuweContainer]) .heading-container a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.download, .download:hover, .download:focus-visible), :host([wijzigactie=voegtoe]) a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.download, .download:hover, .download:focus-visible) { background-image: var(--_dso-di-background-image, url("./di.svg#download-zwart")); } :host([wijzigactie=nieuweContainer]) .heading-container a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.extern, .extern:hover, .extern:focus-visible), :host([wijzigactie=voegtoe]) a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.extern, .extern:hover, .extern:focus-visible) { background-image: var(--_dso-di-background-image, url("./di.svg#external-link-zwart")); } :host([wijzigactie=nieuweContainer]) .heading-container a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="tel:"], [href^="tel:"]:hover, [href^="tel:"]:focus-visible), :host([wijzigactie=voegtoe]) a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="tel:"], [href^="tel:"]:hover, [href^="tel:"]:focus-visible) { background-image: var(--_dso-di-background-image, url("./di.svg#call-zwart")); } :host([wijzigactie=nieuweContainer]) .heading-container a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="mailto:"], [href^="mailto:"]:hover, [href^="mailto:"]:focus-visible), :host([wijzigactie=voegtoe]) a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="mailto:"], [href^="mailto:"]:hover, [href^="mailto:"]:focus-visible) { background-image: var(--_dso-di-background-image, url("./di.svg#mail-outline-zwart")); } :host([wijzigactie=nieuweContainer]) .heading-container, :host([wijzigactie=voegtoe]) { --_dso-icon-button-tertiary-color: #191919; --_dso-icon-button-tertiary-hover-color: #4c4c4c; --_dso-icon-button-tertiary-active-color: #173521; --_dso-icon-button-tertiary-disabled-color: #999; --_dso-button-tertiary-color: #191919; --_dso-button-tertiary-hover-color: #4c4c4c; --_dso-button-tertiary-active-color: #173521; --_dso-button-tertiary-disabled-color: #999; background-color: #e4f1d4; color: #191919; box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.5); --_dt-ozon-content-toggletip-color: #000; } :host([filtered]) { position: relative; } :host([filtered])::before { content: ""; inset-inline-start: -3px; position: absolute; display: block; inline-size: 3px; inset-block-start: 0; inset-block-end: 0; background-color: #6ca4d9; } :host([open]) .annotation-container, :host([open]) .heading-container, :host([open-annotation]) .annotation-container, :host([open-annotation]) .heading-container { margin-block-end: 8px; } :host(:not([open])) dso-ozon-content::part(_subtitels), :host([mode=table-of-contents]) dso-ozon-content::part(_subtitels) { display: none; } .recursive-toggle, .toggle-button { --_dso-icon-button-tertiary-color: #275937; border: 0; padding: 0; background: 0; color: #275937; } .heading-anchor { display: flex; flex-wrap: nowrap; overflow-wrap: anywhere; background-color: transparent; color: var(--link-color); text-decoration: underline; text-underline-offset: 15%; } .heading-anchor:hover, .heading-anchor:focus-visible { color: var(--link-hover-color); text-decoration: underline; } .heading-anchor:active { text-decoration: none; } .heading-anchor .sr-only + dso-icon { margin-inline-start: 0; } .heading-anchor:visited { color: var(--link-visited-color); } .heading-anchor { text-decoration: none; } .heading-element { align-items: start; display: flex; font-size: 1rem; color: #275937; margin: 0; } .heading-element > * { vertical-align: middle; } .alternative-title { cursor: pointer; } .alternative-title:hover, .alternative-title:focus-visible { color: var(--link-hover-color); text-decoration: underline; } .alternative-title:active { text-decoration: none; } :host([not-collapsible]) .heading-container { margin-block-end: 0; } :host([not-collapsible]) .editaction-label { margin-inline-start: 0; } :host([not-collapsible]) dso-ozon-content.kop::part(_kop) { color: #000; } :host(:not([not-collapsible])) dso-ozon-content[inline].kop::part(_kop) { display: inline; } :host([mode=document]:not([not-collapsible])) { --link-color: #39870c; --link-hover-color: #676cb0; } :host([mode=document]:not([not-collapsible])) dso-ozon-content.kop::part(_kop) { cursor: pointer; } :host([mode=document]:not([not-collapsible])) dso-ozon-content.kop::part(_kop):hover { color: var(--link-hover-color); text-decoration: underline; } :host([mode=document]:not([not-collapsible])) .editaction-label { margin-inline-start: 24px; } :host([mode=document]:not([not-collapsible]):active) dso-ozon-content.kop::part(_kop) { text-decoration: none; } :host([mode=table-of-contents]) .heading-container { padding-inline-start: 8px; } :host([mode=table-of-contents]) .heading-element { color: inherit; } :host([mode=table-of-contents]) .editaction-label { margin-inline-start: 0; } :host([mode=table-of-contents][type=ARTIKEL]) dso-ozon-content.kop::part(_kop) { --_dso-icon-button-tertiary-color: inherit; color: inherit; } :host([mode=table-of-contents]:not([type=HOOFDSTUK])) dso-ozon-content.kop::part(_kop) { font-weight: normal; } .addons { margin-inline-start: auto; display: flex; gap: 8px; } .heading { display: flex; align-items: start; gap: 8px; } :host([type=ARTIKEL]:not([alternative-title]):not([mode=table-of-contents])) dso-ozon-content.kop::part(_kop), :host([type=ARTIKEL]:not([alternative-title]):not([mode=table-of-contents])) .toggle-button { --_dso-icon-button-tertiary-color: #000; color: #000; } :host([type=LID][open-annotation]) .annotation-container { margin-block-start: 8px; } .editaction-label { font-style: italic; margin-inline-start: 8px; } .content, .heading-container { padding-inline-end: 8px; } .content { --_dso-alert-margin-block-end: 8px; } .annotation-container { padding-inline-end: 8px; } .annotation-container dso-panel { --_dso-panel-body-background-color: #fff; } :host(:where([annotations-wijzigactie=verwijder])) .annotation-container dso-panel { --_dso-panel-body-background-color: #faecee; --_dso-renvooi-text-decoration: line-through; } :host([annotations-wijzigactie=voegtoe]) .annotation-container dso-panel { --_dso-panel-body-background-color: #f2f8ea; }`;
57
57
 
58
58
  const wijzigactieLabels = {
59
59
  nieuweContainer: "Toegevoegd",
package/dist/cjs/dso-list-button.cjs.entry.js CHANGED
@@ -3,7 +3,7 @@
3
3
  var index = require('./index-v3FWnSvn.js');
4
4
  var clsx = require('./clsx-BtxeOLZW.js');
5
5
 
6
- const listButtonCss = () => `*, *::after, *::before { box-sizing: border-box; } :host { display: block; } .sr-only { position: absolute; inline-size: 1px; block-size: 1px; padding: 0; margin: -1px; border: 0; overflow: hidden; clip-path: rect(0 0 0 0); } .dso-tertiary { display: inline-block; font-size: 1em; font-weight: 500; margin-block-end: 0; text-decoration: none; touch-action: manipulation; text-align: var(--_dt-button-text-align, start); user-select: none; vertical-align: middle; background-clip: padding-box; } .dso-tertiary:focus, .dso-tertiary:focus-visible { outline-offset: 2px; } .dso-tertiary:active { outline: 0; } .dso-tertiary { display: inline-block; font-size: 1em; font-weight: 500; margin-block-end: 0; text-decoration: none; touch-action: manipulation; text-align: var(--_dt-button-text-align, start); user-select: none; vertical-align: middle; background-clip: padding-box; } .dso-tertiary:focus, .dso-tertiary:focus-visible { outline-offset: 2px; } .dso-tertiary:active { outline: 0; } .dso-tertiary { background-color: var(--_dso-button-tertiary-background-color, ); border-color: var(--_dso-button-tertiary-border-color, ); color: var(--_dso-button-tertiary-color, #39870c); float: var(--_dt-button-float-tertiary, none); border-width: 1px; border-style: solid; border-radius: 4px; line-height: 1.5; min-inline-size: auto; inline-size: var(--_dt-button-inline-size, auto); padding-block: 11px; padding-inline: 15px; } .dso-tertiary:hover { background-color: var(--_dso-button-tertiary-hover-background-color, ); border-color: var(--_dso-button-tertiary-hover-border-color, ); color: var(--_dso-button-tertiary-hover-color, #275937); float: var(--_dt-button-float-tertiary, none); } .dso-tertiary:active { background-color: var(--_dso-button-tertiary-active-background-color, ); border-color: var(--_dso-button-tertiary-active-border-color, ); color: var(--_dso-button-tertiary-active-color, #173521); float: var(--_dt-button-float-tertiary, none); } .dso-tertiary[disabled], .dso-tertiary[disabled]:hover { background-color: var(--_dso-button-tertiary-disabled-background-color, ); border-color: var(--_dso-button-tertiary-disabled-border-color, ); color: var(--_dso-button-tertiary-disabled-color, #afcf9d); float: var(--_dt-button-float-tertiary, none); } .dso-tertiary.dso-small { line-height: 1rem; } .dso-tertiary.dso-small dso-icon, .dso-tertiary.dso-small.extern::after, .dso-tertiary.dso-small.download::after, .dso-tertiary.dso-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } .dso-tertiary.dso-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } .dso-tertiary.dso-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } .dso-tertiary.dso-extra-small { line-height: 1rem; } .dso-tertiary.dso-extra-small dso-icon, .dso-tertiary.dso-extra-small.extern::after, .dso-tertiary.dso-extra-small.download::after, .dso-tertiary.dso-extra-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } .dso-tertiary.dso-extra-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } .dso-tertiary.dso-extra-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } .dso-tertiary.dso-extra-small { padding-block: 9px; } .dso-tertiary dso-icon:has(+ span:not(.sr-only)) { margin-inline-start: -8px; } .dso-tertiary span:not(.sr-only) + dso-icon { margin-inline-start: 8px; margin-inline-end: -8px; } .dso-tertiary dso-icon + span:not(.sr-only) { margin-inline-start: 8px; } .dso-tertiary { border: 0; line-height: 1; padding-inline: 0; padding-block: var(--_dt-button-padding-block-tertiary, 0); background-color: transparent; } .dso-tertiary[disabled].dso-spinner-left, .dso-tertiary[disabled].dso-spinner-right { color: #39870c; } .dso-tertiary:not([disabled]):hover { text-decoration: underline; text-underline-position: under; } .dso-tertiary.dso-align { line-height: calc(1.5em - 1px); padding-block: 11px; padding-inline: 0; position: relative; } .dso-tertiary.dso-truncate { max-inline-size: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .dso-tertiary.dso-spinner-left::before { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: middle; inline-size: 24px; margin-inline-end: 8px; } .dso-tertiary.dso-spinner-right::after { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: middle; inline-size: 24px; margin-inline-start: 8px; } .dso-tertiary dso-icon + span:not(.sr-only), .dso-tertiary span:not(.sr-only) + dso-icon { margin-inline-start: 8px; } .dso-tertiary dso-icon[icon=chevron-left] + span:not(.sr-only), .dso-tertiary dso-icon[icon=chevron-right] + span:not(.sr-only), .dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-left], .dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-right] { margin-inline-start: 0; } .dso-tertiary dso-icon, .dso-tertiary span { vertical-align: middle; } .dso-tertiary { cursor: pointer; } .dso-input-number { align-items: center; display: flex; } .dso-input-number .dso-input-step-counter { text-align: center; inline-size: 1.5rem; font-size: 14px; } .dso-button-group { display: flex; flex-direction: row; } .dso-button-group.dso-disabled > * { background-color: #fff; border-color: #e5e5e5; color: #666; pointer-events: none; } .dso-button-group > * { border-radius: 0; } .dso-button-group > *:first-child { border-radius: 4px 0 0 4px; } .dso-button-group > *:not(:first-child) { border-inline-start-style: none !important; } .dso-button-group > *:last-child { border-radius: 0 4px 4px 0; } .dso-button-group > *:only-child { border-radius: 4px; } .dso-button-group > .dso-input-number { border-style: solid; border-width: 1px; flex-wrap: nowrap; padding-block: 0; padding-inline: 16px; background-color: #fff; border-color: #ccc; color: #191919; } @media screen and (max-width: 767px) { .dso-button-group > .dso-input-number { justify-content: center; } } .dso-button-group > *:hover + .dso-input-number, .dso-button-group > *:focus + .dso-input-number { background-color: #fff; border-color: #d7e7ce; color: #191919; } .dso-button-group > *.dso-selected + .dso-input-number { box-shadow: inset 0 -1px 0 0 #39870c, inset 0 1px 0 0 #39870c, inset -1px 0 0 0 #39870c; background-color: #fff; border-color: #39870c; color: #191919; } .dso-button-group > *:active + .dso-input-number, .dso-button-group > *:active + .dso-input-number:hover, .dso-button-group > *.active + .dso-input-number, .dso-button-group > *.active + .dso-input-number:hover { background-color: #fff; border-color: #d7e7ce; color: #191919; } .dso-button-group > *.disabled + .dso-input-number, .dso-button-group > *.disabled + .dso-input-number:hover, .dso-button-group > *[disabled] + .dso-input-number, .dso-button-group > *[disabled] + .dso-input-number:hover { opacity: 1; background-color: #fff; border-color: #ccc; color: #666; } .dso-button-group .dso-list-button { padding-inline-end: 15px; } .dso-list-button { display: inline-block; font-size: 1em; font-weight: 500; margin-block-end: 0; text-decoration: none; touch-action: manipulation; text-align: var(--_dt-button-text-align, start); user-select: none; vertical-align: middle; background-clip: padding-box; } .dso-list-button:focus, .dso-list-button:focus-visible { outline-offset: 2px; } .dso-list-button:active { outline: 0; } .dso-list-button { background-color: #fff; border-color: #ccc; color: #191919; border-radius: 4px; border-width: 1px; border-style: solid; font-weight: 600; padding-block: 15px; padding-inline: 15px 47px; position: relative; text-align: start; white-space: normal; inline-size: 100%; cursor: pointer; } .dso-list-button:hover, .dso-list-button:focus { background-color: #fff; border-color: #39870c; color: #191919; } .dso-list-button:active, .dso-list-button:active:hover, .dso-list-button.active, .dso-list-button.active:hover { background-color: #fff; border-color: #d7e7ce; color: #191919; } .dso-list-button.disabled, .dso-list-button.disabled:hover, .dso-list-button[disabled], .dso-list-button[disabled]:hover { background-color: #fff; border-color: #ccc; color: #666; opacity: 1; } .dso-list-button dso-selectable:not(:last-child) { margin-block-end: 0; } .dso-list-button .dso-selectable-container label { font-weight: 700; } .dso-list-button.dso-selected { border-color: #39870c; border-width: 1px; box-shadow: inset 0px 0px 0px 1px #39870c, inset -1px 0px 0px 0px #39870c; } @media screen and (min-width: 768px) { .dso-list-button.dso-selected.dso-single-count { border-inline-end: 0; box-shadow: #39870c 0px 1px 0px 0px inset, #39870c 1px 0px 0px 0px inset, #39870c 0px -1px 0px 0px inset; } } .dso-list-button label { cursor: inherit; } .dso-list-button > span { display: block; } .dso-list-button .dso-sublabel, .dso-list-button .subcontent { font-weight: 400; inline-size: 100%; padding-inline-start: 32px; } .dso-list-button dso-icon { block-size: 24px; color: #39870c; inset-block-start: 15px; inset-inline-end: 15px; inline-size: 24px; break-before: page; position: absolute; } @media screen and (max-width: 767px) { .dso-list-button.dso-selected.dso-single-count::after { inline-size: 0; } }`;
6
+ const listButtonCss = () => `*, *::after, *::before { box-sizing: border-box; } :host { display: block; } .sr-only { position: absolute; inline-size: 1px; block-size: 1px; padding: 0; margin: -1px; border: 0; overflow: hidden; clip-path: rect(0 0 0 0); } .dso-tertiary { display: inline-block; font-size: 1em; font-weight: 500; margin-block-end: 0; text-decoration: none; touch-action: manipulation; text-align: var(--_dt-button-text-align, start); user-select: none; vertical-align: middle; background-clip: padding-box; } .dso-tertiary:focus, .dso-tertiary:focus-visible { outline-offset: 2px; } .dso-tertiary:active { outline: 0; } .dso-tertiary { display: inline-block; font-size: 1em; font-weight: 500; margin-block-end: 0; text-decoration: none; touch-action: manipulation; text-align: var(--_dt-button-text-align, start); user-select: none; vertical-align: middle; background-clip: padding-box; } .dso-tertiary:focus, .dso-tertiary:focus-visible { outline-offset: 2px; } .dso-tertiary:active { outline: 0; } .dso-tertiary { background-color: var(--_dso-button-tertiary-background-color, ); border-color: var(--_dso-button-tertiary-border-color, ); color: var(--_dso-button-tertiary-color, #39870c); float: var(--_dt-button-float-tertiary, none); border-width: 1px; border-style: solid; border-radius: 4px; line-height: 1.5; min-inline-size: auto; inline-size: var(--_dt-button-inline-size, auto); padding-block: 11px; padding-inline: 15px; } .dso-tertiary:hover { background-color: var(--_dso-button-tertiary-hover-background-color, ); border-color: var(--_dso-button-tertiary-hover-border-color, ); color: var(--_dso-button-tertiary-hover-color, #275937); float: var(--_dt-button-float-tertiary, none); } .dso-tertiary:active { background-color: var(--_dso-button-tertiary-active-background-color, ); border-color: var(--_dso-button-tertiary-active-border-color, ); color: var(--_dso-button-tertiary-active-color, #173521); float: var(--_dt-button-float-tertiary, none); } .dso-tertiary[disabled], .dso-tertiary[disabled]:hover { background-color: var(--_dso-button-tertiary-disabled-background-color, ); border-color: var(--_dso-button-tertiary-disabled-border-color, ); color: var(--_dso-button-tertiary-disabled-color, #afcf9d); float: var(--_dt-button-float-tertiary, none); } .dso-tertiary.dso-small { line-height: 1rem; } .dso-tertiary.dso-small dso-icon, .dso-tertiary.dso-small.extern::after, .dso-tertiary.dso-small.download::after, .dso-tertiary.dso-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } .dso-tertiary.dso-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } .dso-tertiary.dso-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } .dso-tertiary.dso-extra-small { line-height: 1rem; } .dso-tertiary.dso-extra-small dso-icon, .dso-tertiary.dso-extra-small.extern::after, .dso-tertiary.dso-extra-small.download::after, .dso-tertiary.dso-extra-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } .dso-tertiary.dso-extra-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } .dso-tertiary.dso-extra-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } .dso-tertiary.dso-extra-small { padding-block: 9px; } .dso-tertiary { border: 0; line-height: 1; padding-inline: 0; padding-block: var(--_dt-button-padding-block-tertiary, 0); background-color: transparent; } .dso-tertiary[disabled].dso-spinner-left, .dso-tertiary[disabled].dso-spinner-right { color: #39870c; } .dso-tertiary:not([disabled]):hover { text-decoration: underline; text-underline-position: under; } .dso-tertiary.dso-align { line-height: calc(1.5em - 1px); padding-block: 11px; padding-inline: 0; position: relative; } .dso-tertiary.dso-truncate { max-inline-size: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .dso-tertiary.dso-spinner-left::before { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: middle; inline-size: 24px; margin-inline-end: 8px; } .dso-tertiary.dso-spinner-right::after { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: middle; inline-size: 24px; margin-inline-start: 8px; } .dso-tertiary dso-icon + span:not(.sr-only), .dso-tertiary span:not(.sr-only) + dso-icon { margin-inline-start: 8px; } .dso-tertiary dso-icon[icon=chevron-left] + span:not(.sr-only), .dso-tertiary dso-icon[icon=chevron-right] + span:not(.sr-only), .dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-left], .dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-right] { margin-inline-start: 0; } .dso-tertiary dso-icon, .dso-tertiary span { vertical-align: middle; } .dso-tertiary { cursor: pointer; } .dso-input-number { align-items: center; display: flex; } .dso-input-number .dso-input-step-counter { text-align: center; inline-size: 1.5rem; font-size: 14px; } .dso-button-group { display: flex; flex-direction: row; } .dso-button-group.dso-disabled > * { background-color: #fff; border-color: #e5e5e5; color: #666; pointer-events: none; } .dso-button-group > * { border-radius: 0; } .dso-button-group > *:first-child { border-radius: 4px 0 0 4px; } .dso-button-group > *:not(:first-child) { border-inline-start-style: none !important; } .dso-button-group > *:last-child { border-radius: 0 4px 4px 0; } .dso-button-group > *:only-child { border-radius: 4px; } .dso-button-group > .dso-input-number { border-style: solid; border-width: 1px; flex-wrap: nowrap; padding-block: 0; padding-inline: 16px; background-color: #fff; border-color: #ccc; color: #191919; } @media screen and (max-width: 767px) { .dso-button-group > .dso-input-number { justify-content: center; } } .dso-button-group > *:hover + .dso-input-number, .dso-button-group > *:focus + .dso-input-number { background-color: #fff; border-color: #d7e7ce; color: #191919; } .dso-button-group > *.dso-selected + .dso-input-number { box-shadow: inset 0 -1px 0 0 #39870c, inset 0 1px 0 0 #39870c, inset -1px 0 0 0 #39870c; background-color: #fff; border-color: #39870c; color: #191919; } .dso-button-group > *:active + .dso-input-number, .dso-button-group > *:active + .dso-input-number:hover, .dso-button-group > *.active + .dso-input-number, .dso-button-group > *.active + .dso-input-number:hover { background-color: #fff; border-color: #d7e7ce; color: #191919; } .dso-button-group > *.disabled + .dso-input-number, .dso-button-group > *.disabled + .dso-input-number:hover, .dso-button-group > *[disabled] + .dso-input-number, .dso-button-group > *[disabled] + .dso-input-number:hover { opacity: 1; background-color: #fff; border-color: #ccc; color: #666; } .dso-button-group .dso-list-button { padding-inline-end: 15px; } .dso-list-button { display: inline-block; font-size: 1em; font-weight: 500; margin-block-end: 0; text-decoration: none; touch-action: manipulation; text-align: var(--_dt-button-text-align, start); user-select: none; vertical-align: middle; background-clip: padding-box; } .dso-list-button:focus, .dso-list-button:focus-visible { outline-offset: 2px; } .dso-list-button:active { outline: 0; } .dso-list-button { background-color: #fff; border-color: #ccc; color: #191919; border-radius: 4px; border-width: 1px; border-style: solid; font-weight: 600; padding-block: 15px; padding-inline: 15px 47px; position: relative; text-align: start; white-space: normal; inline-size: 100%; cursor: pointer; } .dso-list-button:hover, .dso-list-button:focus { background-color: #fff; border-color: #39870c; color: #191919; } .dso-list-button:active, .dso-list-button:active:hover, .dso-list-button.active, .dso-list-button.active:hover { background-color: #fff; border-color: #d7e7ce; color: #191919; } .dso-list-button.disabled, .dso-list-button.disabled:hover, .dso-list-button[disabled], .dso-list-button[disabled]:hover { background-color: #fff; border-color: #ccc; color: #666; opacity: 1; } .dso-list-button dso-selectable:not(:last-child) { margin-block-end: 0; } .dso-list-button .dso-selectable-container label { font-weight: 700; } .dso-list-button.dso-selected { border-color: #39870c; border-width: 1px; box-shadow: inset 0px 0px 0px 1px #39870c, inset -1px 0px 0px 0px #39870c; } @media screen and (min-width: 768px) { .dso-list-button.dso-selected.dso-single-count { border-inline-end: 0; box-shadow: #39870c 0px 1px 0px 0px inset, #39870c 1px 0px 0px 0px inset, #39870c 0px -1px 0px 0px inset; } } .dso-list-button label { cursor: inherit; } .dso-list-button > span { display: block; } .dso-list-button .dso-sublabel, .dso-list-button .subcontent { font-weight: 400; inline-size: 100%; padding-inline-start: 32px; } .dso-list-button dso-icon { block-size: 24px; color: #39870c; inset-block-start: 15px; inset-inline-end: 15px; inline-size: 24px; break-before: page; position: absolute; } @media screen and (max-width: 767px) { .dso-list-button.dso-selected.dso-single-count::after { inline-size: 0; } }`;
7
7
 
8
8
  const ListButton = class {
9
9
  constructor(hostRef) {
package/dist/cjs/dso-map-controls.cjs.entry.js CHANGED
@@ -24,7 +24,7 @@ const translations = {
24
24
  },
25
25
  };
26
26
 
27
- const mapControlsCss = () => `button { -webkit-appearance: button; color: inherit; cursor: pointer; font: inherit; font-family: inherit; font-size: inherit; line-height: inherit; margin: 0; overflow: visible; text-transform: none; } button[disabled] { cursor: default; } button::-moz-focus-inner { border: 0; padding: 0; } a.dso-primary, button.dso-primary, label.dso-primary { display: inline-block; font-size: 1em; font-weight: 500; margin-block-end: 0; text-decoration: none; touch-action: manipulation; text-align: var(--_dt-button-text-align, start); user-select: none; vertical-align: middle; background-clip: padding-box; } a.dso-primary:focus, a.dso-primary:focus-visible, button.dso-primary:focus, button.dso-primary:focus-visible, label.dso-primary:focus, label.dso-primary:focus-visible { outline-offset: 2px; } a.dso-primary:active, button.dso-primary:active, label.dso-primary:active { outline: 0; } a.dso-primary.extern::after, a.dso-primary.download::after, button.dso-primary.extern::after, button.dso-primary.download::after, label.dso-primary.extern::after, label.dso-primary.download::after { content: ""; display: inline-block; } a.dso-primary, button.dso-primary, label.dso-primary { background-color: var(--_dso-button-primary-background-color, #39870c); border-color: var(--_dso-button-primary-border-color, #39870c); color: var(--_dso-button-primary-color, #fff); float: var(--_dt-button-float-primary, none); border-width: 1px; border-style: solid; border-radius: 4px; line-height: 1.5; min-inline-size: 56px; inline-size: var(--_dt-button-inline-size, auto); padding-block: 11px; padding-inline: 15px; } a.dso-primary:hover, button.dso-primary:hover, label.dso-primary:hover { background-color: var(--_dso-button-primary-hover-background-color, #275937); border-color: var(--_dso-button-primary-hover-border-color, #275937); color: var(--_dso-button-primary-hover-color, #fff); float: var(--_dt-button-float-primary, none); } a.dso-primary:active, button.dso-primary:active, label.dso-primary:active { background-color: var(--_dso-button-primary-active-background-color, #173521); border-color: var(--_dso-button-primary-active-border-color, #173521); color: var(--_dso-button-primary-active-color, #fff); float: var(--_dt-button-float-primary, none); } a.dso-primary[disabled], a.dso-primary[disabled]:hover, button.dso-primary[disabled], button.dso-primary[disabled]:hover, label.dso-primary[disabled], label.dso-primary[disabled]:hover { background-color: var(--_dso-button-primary-disabled-background-color, #afcf9d); border-color: var(--_dso-button-primary-disabled-border-color, #afcf9d); color: var(--_dso-button-primary-disabled-color, #fff); float: var(--_dt-button-float-primary, none); } a.dso-primary.dso-small, button.dso-primary.dso-small, label.dso-primary.dso-small { line-height: 1rem; } a.dso-primary.dso-small dso-icon, a.dso-primary.dso-small.extern::after, a.dso-primary.dso-small.download::after, a.dso-primary.dso-small.dso-spinner::before, button.dso-primary.dso-small dso-icon, button.dso-primary.dso-small.extern::after, button.dso-primary.dso-small.download::after, button.dso-primary.dso-small.dso-spinner::before, label.dso-primary.dso-small dso-icon, label.dso-primary.dso-small.extern::after, label.dso-primary.dso-small.download::after, label.dso-primary.dso-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-primary.dso-small.dso-spinner-left::before, button.dso-primary.dso-small.dso-spinner-left::before, label.dso-primary.dso-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-primary.dso-small.dso-spinner-right::after, button.dso-primary.dso-small.dso-spinner-right::after, label.dso-primary.dso-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-primary.dso-extra-small, button.dso-primary.dso-extra-small, label.dso-primary.dso-extra-small { line-height: 1rem; } a.dso-primary.dso-extra-small dso-icon, a.dso-primary.dso-extra-small.extern::after, a.dso-primary.dso-extra-small.download::after, a.dso-primary.dso-extra-small.dso-spinner::before, button.dso-primary.dso-extra-small dso-icon, button.dso-primary.dso-extra-small.extern::after, button.dso-primary.dso-extra-small.download::after, button.dso-primary.dso-extra-small.dso-spinner::before, label.dso-primary.dso-extra-small dso-icon, label.dso-primary.dso-extra-small.extern::after, label.dso-primary.dso-extra-small.download::after, label.dso-primary.dso-extra-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-primary.dso-extra-small.dso-spinner-left::before, button.dso-primary.dso-extra-small.dso-spinner-left::before, label.dso-primary.dso-extra-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-primary.dso-extra-small.dso-spinner-right::after, button.dso-primary.dso-extra-small.dso-spinner-right::after, label.dso-primary.dso-extra-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-primary.dso-extra-small, button.dso-primary.dso-extra-small, label.dso-primary.dso-extra-small { padding-block: 9px; } a.dso-primary dso-icon:has(+ span:not(.sr-only)), button.dso-primary dso-icon:has(+ span:not(.sr-only)), label.dso-primary dso-icon:has(+ span:not(.sr-only)) { margin-inline-start: -8px; } a.dso-primary span:not(.sr-only) + dso-icon, button.dso-primary span:not(.sr-only) + dso-icon, label.dso-primary span:not(.sr-only) + dso-icon { margin-inline-start: 8px; margin-inline-end: -8px; } a.dso-primary dso-icon + span:not(.sr-only), button.dso-primary dso-icon + span:not(.sr-only), label.dso-primary dso-icon + span:not(.sr-only) { margin-inline-start: 8px; } a.dso-primary.dso-spinner-left[disabled], a.dso-primary.dso-spinner-right[disabled], button.dso-primary.dso-spinner-left[disabled], button.dso-primary.dso-spinner-right[disabled], label.dso-primary.dso-spinner-left[disabled], label.dso-primary.dso-spinner-right[disabled] { background-color: #39870c; border-color: #39870c; color: #fff; } a.dso-primary.dso-spinner-left::before, button.dso-primary.dso-spinner-left::before, label.dso-primary.dso-spinner-left::before { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-end: 8px; } a.dso-primary.dso-spinner-right::after, button.dso-primary.dso-spinner-right::after, label.dso-primary.dso-spinner-right::after { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-start: 8px; } a.dso-primary.download::after, button.dso-primary.download::after, label.dso-primary.download::after { background: url("./di.svg#download-wit") no-repeat center; background-size: cover; block-size: 24px; vertical-align: top; inline-size: 24px; } a.dso-primary.extern::after, button.dso-primary.extern::after, label.dso-primary.extern::after { background: url("./di.svg#external-link-wit") no-repeat center; background-size: cover; block-size: 24px; vertical-align: top; inline-size: 24px; } a.dso-secondary, button.dso-secondary, label.dso-secondary { display: inline-block; font-size: 1em; font-weight: 500; margin-block-end: 0; text-decoration: none; touch-action: manipulation; text-align: var(--_dt-button-text-align, start); user-select: none; vertical-align: middle; background-clip: padding-box; } a.dso-secondary:focus, a.dso-secondary:focus-visible, button.dso-secondary:focus, button.dso-secondary:focus-visible, label.dso-secondary:focus, label.dso-secondary:focus-visible { outline-offset: 2px; } a.dso-secondary:active, button.dso-secondary:active, label.dso-secondary:active { outline: 0; } a.dso-secondary.extern::after, a.dso-secondary.download::after, button.dso-secondary.extern::after, button.dso-secondary.download::after, label.dso-secondary.extern::after, label.dso-secondary.download::after { content: ""; display: inline-block; } a.dso-secondary, button.dso-secondary, label.dso-secondary { background-color: var(--_dso-button-secondary-background-color, #fff); border-color: var(--_dso-button-secondary-border-color, #39870c); color: var(--_dso-button-secondary-color, #39870c); float: var(--_dt-button-float-secondary, none); border-width: 1px; border-style: solid; border-radius: 4px; line-height: 1.5; min-inline-size: 56px; inline-size: var(--_dt-button-inline-size, auto); padding-block: 11px; padding-inline: 15px; } a.dso-secondary:hover, button.dso-secondary:hover, label.dso-secondary:hover { background-color: var(--_dso-button-secondary-hover-background-color, #d7e7ce); border-color: var(--_dso-button-secondary-hover-border-color, #275937); color: var(--_dso-button-secondary-hover-color, #275937); float: var(--_dt-button-float-secondary, none); } a.dso-secondary:active, button.dso-secondary:active, label.dso-secondary:active { background-color: var(--_dso-button-secondary-active-background-color, #275937); border-color: var(--_dso-button-secondary-active-border-color, #275937); color: var(--_dso-button-secondary-active-color, #fff); float: var(--_dt-button-float-secondary, none); } a.dso-secondary[disabled], a.dso-secondary[disabled]:hover, button.dso-secondary[disabled], button.dso-secondary[disabled]:hover, label.dso-secondary[disabled], label.dso-secondary[disabled]:hover { background-color: var(--_dso-button-secondary-disabled-background-color, #fff); border-color: var(--_dso-button-secondary-disabled-border-color, #afcf9d); color: var(--_dso-button-secondary-disabled-color, #afcf9d); float: var(--_dt-button-float-secondary, none); } a.dso-secondary.dso-small, button.dso-secondary.dso-small, label.dso-secondary.dso-small { line-height: 1rem; } a.dso-secondary.dso-small dso-icon, a.dso-secondary.dso-small.extern::after, a.dso-secondary.dso-small.download::after, a.dso-secondary.dso-small.dso-spinner::before, button.dso-secondary.dso-small dso-icon, button.dso-secondary.dso-small.extern::after, button.dso-secondary.dso-small.download::after, button.dso-secondary.dso-small.dso-spinner::before, label.dso-secondary.dso-small dso-icon, label.dso-secondary.dso-small.extern::after, label.dso-secondary.dso-small.download::after, label.dso-secondary.dso-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-secondary.dso-small.dso-spinner-left::before, button.dso-secondary.dso-small.dso-spinner-left::before, label.dso-secondary.dso-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-secondary.dso-small.dso-spinner-right::after, button.dso-secondary.dso-small.dso-spinner-right::after, label.dso-secondary.dso-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-secondary.dso-extra-small, button.dso-secondary.dso-extra-small, label.dso-secondary.dso-extra-small { line-height: 1rem; } a.dso-secondary.dso-extra-small dso-icon, a.dso-secondary.dso-extra-small.extern::after, a.dso-secondary.dso-extra-small.download::after, a.dso-secondary.dso-extra-small.dso-spinner::before, button.dso-secondary.dso-extra-small dso-icon, button.dso-secondary.dso-extra-small.extern::after, button.dso-secondary.dso-extra-small.download::after, button.dso-secondary.dso-extra-small.dso-spinner::before, label.dso-secondary.dso-extra-small dso-icon, label.dso-secondary.dso-extra-small.extern::after, label.dso-secondary.dso-extra-small.download::after, label.dso-secondary.dso-extra-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-secondary.dso-extra-small.dso-spinner-left::before, button.dso-secondary.dso-extra-small.dso-spinner-left::before, label.dso-secondary.dso-extra-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-secondary.dso-extra-small.dso-spinner-right::after, button.dso-secondary.dso-extra-small.dso-spinner-right::after, label.dso-secondary.dso-extra-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-secondary.dso-extra-small, button.dso-secondary.dso-extra-small, label.dso-secondary.dso-extra-small { padding-block: 9px; } a.dso-secondary dso-icon:has(+ span:not(.sr-only)), button.dso-secondary dso-icon:has(+ span:not(.sr-only)), label.dso-secondary dso-icon:has(+ span:not(.sr-only)) { margin-inline-start: -8px; } a.dso-secondary span:not(.sr-only) + dso-icon, button.dso-secondary span:not(.sr-only) + dso-icon, label.dso-secondary span:not(.sr-only) + dso-icon { margin-inline-start: 8px; margin-inline-end: -8px; } a.dso-secondary dso-icon + span:not(.sr-only), button.dso-secondary dso-icon + span:not(.sr-only), label.dso-secondary dso-icon + span:not(.sr-only) { margin-inline-start: 8px; } a.dso-secondary.dso-spinner-left[disabled], a.dso-secondary.dso-spinner-right[disabled], button.dso-secondary.dso-spinner-left[disabled], button.dso-secondary.dso-spinner-right[disabled], label.dso-secondary.dso-spinner-left[disabled], label.dso-secondary.dso-spinner-right[disabled] { background-color: #fff; border-color: #39870c; color: #39870c; } a.dso-secondary.dso-spinner-left::before, button.dso-secondary.dso-spinner-left::before, label.dso-secondary.dso-spinner-left::before { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-end: 8px; } a.dso-secondary.dso-spinner-left:not([disabled]):hover::before, button.dso-secondary.dso-spinner-left:not([disabled]):hover::before, label.dso-secondary.dso-spinner-left:not([disabled]):hover::before { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-end: 8px; } a.dso-secondary.dso-spinner-left:not([disabled]).dso-small:hover::before, button.dso-secondary.dso-spinner-left:not([disabled]).dso-small:hover::before, label.dso-secondary.dso-spinner-left:not([disabled]).dso-small:hover::before { block-size: 16px; inline-size: 16px; } a.dso-secondary.dso-spinner-right::after, button.dso-secondary.dso-spinner-right::after, label.dso-secondary.dso-spinner-right::after { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-start: 8px; } a.dso-secondary.dso-spinner-right:not([disabled]):hover::after, button.dso-secondary.dso-spinner-right:not([disabled]):hover::after, label.dso-secondary.dso-spinner-right:not([disabled]):hover::after { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-start: 8px; } a.dso-secondary.dso-spinner-right:not([disabled]).dso-small:hover::after, button.dso-secondary.dso-spinner-right:not([disabled]).dso-small:hover::after, label.dso-secondary.dso-spinner-right:not([disabled]).dso-small:hover::after { block-size: 16px; inline-size: 16px; } a.dso-secondary.download::after, button.dso-secondary.download::after, label.dso-secondary.download::after { background: url("./di.svg#download") no-repeat center; background-size: cover; block-size: 24px; vertical-align: top; inline-size: 24px; } a.dso-secondary.download:hover::after, button.dso-secondary.download:hover::after, label.dso-secondary.download:hover::after { background-image: var(--_dso-di-background-image, url("./di.svg#download-bosgroen")); } a.dso-secondary.download[disabled]::after, button.dso-secondary.download[disabled]::after, label.dso-secondary.download[disabled]::after { background-image: var(--_dso-di-background-image, url("./di.svg#download-grasgroen-40")); } a.dso-secondary.extern::after, button.dso-secondary.extern::after, label.dso-secondary.extern::after { background: url("./di.svg#external-link") no-repeat center; background-size: cover; block-size: 24px; vertical-align: top; inline-size: 24px; } a.dso-secondary.extern:hover::after, button.dso-secondary.extern:hover::after, label.dso-secondary.extern:hover::after { background-image: var(--_dso-di-background-image, url("./di.svg#external-link-bosgroen")); } a.dso-secondary.extern[disabled]::after, button.dso-secondary.extern[disabled]::after, label.dso-secondary.extern[disabled]::after { background-image: var(--_dso-di-background-image, url("./di.svg#external-link-grasgroen-40")); } a.dso-tertiary, button.dso-tertiary, label.dso-tertiary { display: inline-block; font-size: 1em; font-weight: 500; margin-block-end: 0; text-decoration: none; touch-action: manipulation; text-align: var(--_dt-button-text-align, start); user-select: none; vertical-align: middle; background-clip: padding-box; } a.dso-tertiary:focus, a.dso-tertiary:focus-visible, button.dso-tertiary:focus, button.dso-tertiary:focus-visible, label.dso-tertiary:focus, label.dso-tertiary:focus-visible { outline-offset: 2px; } a.dso-tertiary:active, button.dso-tertiary:active, label.dso-tertiary:active { outline: 0; } a.dso-tertiary.extern::after, a.dso-tertiary.download::after, button.dso-tertiary.extern::after, button.dso-tertiary.download::after, label.dso-tertiary.extern::after, label.dso-tertiary.download::after { content: ""; display: inline-block; } a.dso-tertiary, button.dso-tertiary, label.dso-tertiary { display: inline-block; font-size: 1em; font-weight: 500; margin-block-end: 0; text-decoration: none; touch-action: manipulation; text-align: var(--_dt-button-text-align, start); user-select: none; vertical-align: middle; background-clip: padding-box; } a.dso-tertiary:focus, a.dso-tertiary:focus-visible, button.dso-tertiary:focus, button.dso-tertiary:focus-visible, label.dso-tertiary:focus, label.dso-tertiary:focus-visible { outline-offset: 2px; } a.dso-tertiary:active, button.dso-tertiary:active, label.dso-tertiary:active { outline: 0; } a.dso-tertiary.extern::after, a.dso-tertiary.download::after, button.dso-tertiary.extern::after, button.dso-tertiary.download::after, label.dso-tertiary.extern::after, label.dso-tertiary.download::after { content: ""; display: inline-block; } a.dso-tertiary, button.dso-tertiary, label.dso-tertiary { background-color: var(--_dso-button-tertiary-background-color, ); border-color: var(--_dso-button-tertiary-border-color, ); color: var(--_dso-button-tertiary-color, #39870c); float: var(--_dt-button-float-tertiary, none); border-width: 1px; border-style: solid; border-radius: 4px; line-height: 1.5; min-inline-size: auto; inline-size: var(--_dt-button-inline-size, auto); padding-block: 11px; padding-inline: 15px; } a.dso-tertiary:hover, button.dso-tertiary:hover, label.dso-tertiary:hover { background-color: var(--_dso-button-tertiary-hover-background-color, ); border-color: var(--_dso-button-tertiary-hover-border-color, ); color: var(--_dso-button-tertiary-hover-color, #275937); float: var(--_dt-button-float-tertiary, none); } a.dso-tertiary:active, button.dso-tertiary:active, label.dso-tertiary:active { background-color: var(--_dso-button-tertiary-active-background-color, ); border-color: var(--_dso-button-tertiary-active-border-color, ); color: var(--_dso-button-tertiary-active-color, #173521); float: var(--_dt-button-float-tertiary, none); } a.dso-tertiary[disabled], a.dso-tertiary[disabled]:hover, button.dso-tertiary[disabled], button.dso-tertiary[disabled]:hover, label.dso-tertiary[disabled], label.dso-tertiary[disabled]:hover { background-color: var(--_dso-button-tertiary-disabled-background-color, ); border-color: var(--_dso-button-tertiary-disabled-border-color, ); color: var(--_dso-button-tertiary-disabled-color, #afcf9d); float: var(--_dt-button-float-tertiary, none); } a.dso-tertiary.dso-small, button.dso-tertiary.dso-small, label.dso-tertiary.dso-small { line-height: 1rem; } a.dso-tertiary.dso-small dso-icon, a.dso-tertiary.dso-small.extern::after, a.dso-tertiary.dso-small.download::after, a.dso-tertiary.dso-small.dso-spinner::before, button.dso-tertiary.dso-small dso-icon, button.dso-tertiary.dso-small.extern::after, button.dso-tertiary.dso-small.download::after, button.dso-tertiary.dso-small.dso-spinner::before, label.dso-tertiary.dso-small dso-icon, label.dso-tertiary.dso-small.extern::after, label.dso-tertiary.dso-small.download::after, label.dso-tertiary.dso-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-tertiary.dso-small.dso-spinner-left::before, button.dso-tertiary.dso-small.dso-spinner-left::before, label.dso-tertiary.dso-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-tertiary.dso-small.dso-spinner-right::after, button.dso-tertiary.dso-small.dso-spinner-right::after, label.dso-tertiary.dso-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-tertiary.dso-extra-small, button.dso-tertiary.dso-extra-small, label.dso-tertiary.dso-extra-small { line-height: 1rem; } a.dso-tertiary.dso-extra-small dso-icon, a.dso-tertiary.dso-extra-small.extern::after, a.dso-tertiary.dso-extra-small.download::after, a.dso-tertiary.dso-extra-small.dso-spinner::before, button.dso-tertiary.dso-extra-small dso-icon, button.dso-tertiary.dso-extra-small.extern::after, button.dso-tertiary.dso-extra-small.download::after, button.dso-tertiary.dso-extra-small.dso-spinner::before, label.dso-tertiary.dso-extra-small dso-icon, label.dso-tertiary.dso-extra-small.extern::after, label.dso-tertiary.dso-extra-small.download::after, label.dso-tertiary.dso-extra-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-tertiary.dso-extra-small.dso-spinner-left::before, button.dso-tertiary.dso-extra-small.dso-spinner-left::before, label.dso-tertiary.dso-extra-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-tertiary.dso-extra-small.dso-spinner-right::after, button.dso-tertiary.dso-extra-small.dso-spinner-right::after, label.dso-tertiary.dso-extra-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-tertiary.dso-extra-small, button.dso-tertiary.dso-extra-small, label.dso-tertiary.dso-extra-small { padding-block: 9px; } a.dso-tertiary dso-icon:has(+ span:not(.sr-only)), button.dso-tertiary dso-icon:has(+ span:not(.sr-only)), label.dso-tertiary dso-icon:has(+ span:not(.sr-only)) { margin-inline-start: -8px; } a.dso-tertiary span:not(.sr-only) + dso-icon, button.dso-tertiary span:not(.sr-only) + dso-icon, label.dso-tertiary span:not(.sr-only) + dso-icon { margin-inline-start: 8px; margin-inline-end: -8px; } a.dso-tertiary dso-icon + span:not(.sr-only), button.dso-tertiary dso-icon + span:not(.sr-only), label.dso-tertiary dso-icon + span:not(.sr-only) { margin-inline-start: 8px; } a.dso-tertiary, button.dso-tertiary, label.dso-tertiary { border: 0; line-height: 1; padding-inline: 0; padding-block: var(--_dt-button-padding-block-tertiary, 0); background-color: transparent; } a.dso-tertiary[disabled].dso-spinner-left, a.dso-tertiary[disabled].dso-spinner-right, button.dso-tertiary[disabled].dso-spinner-left, button.dso-tertiary[disabled].dso-spinner-right, label.dso-tertiary[disabled].dso-spinner-left, label.dso-tertiary[disabled].dso-spinner-right { color: #39870c; } a.dso-tertiary:not([disabled]):hover, button.dso-tertiary:not([disabled]):hover, label.dso-tertiary:not([disabled]):hover { text-decoration: underline; text-underline-position: under; } a.dso-tertiary.dso-align, button.dso-tertiary.dso-align, label.dso-tertiary.dso-align { line-height: calc(1.5em - 1px); padding-block: 11px; padding-inline: 0; position: relative; } a.dso-tertiary.dso-truncate, button.dso-tertiary.dso-truncate, label.dso-tertiary.dso-truncate { max-inline-size: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } a.dso-tertiary.dso-spinner-left::before, button.dso-tertiary.dso-spinner-left::before, label.dso-tertiary.dso-spinner-left::before { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: middle; inline-size: 24px; margin-inline-end: 8px; } a.dso-tertiary.dso-spinner-right::after, button.dso-tertiary.dso-spinner-right::after, label.dso-tertiary.dso-spinner-right::after { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: middle; inline-size: 24px; margin-inline-start: 8px; } a.dso-tertiary dso-icon + span:not(.sr-only), a.dso-tertiary span:not(.sr-only) + dso-icon, button.dso-tertiary dso-icon + span:not(.sr-only), button.dso-tertiary span:not(.sr-only) + dso-icon, label.dso-tertiary dso-icon + span:not(.sr-only), label.dso-tertiary span:not(.sr-only) + dso-icon { margin-inline-start: 8px; } a.dso-tertiary dso-icon[icon=chevron-left] + span:not(.sr-only), a.dso-tertiary dso-icon[icon=chevron-right] + span:not(.sr-only), a.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-left], a.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-right], button.dso-tertiary dso-icon[icon=chevron-left] + span:not(.sr-only), button.dso-tertiary dso-icon[icon=chevron-right] + span:not(.sr-only), button.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-left], button.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-right], label.dso-tertiary dso-icon[icon=chevron-left] + span:not(.sr-only), label.dso-tertiary dso-icon[icon=chevron-right] + span:not(.sr-only), label.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-left], label.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-right] { margin-inline-start: 0; } a.dso-tertiary dso-icon, a.dso-tertiary span, button.dso-tertiary dso-icon, button.dso-tertiary span, label.dso-tertiary dso-icon, label.dso-tertiary span { vertical-align: middle; } a.dso-tertiary.extern::after, a.dso-tertiary.download::after, button.dso-tertiary.extern::after, button.dso-tertiary.download::after, label.dso-tertiary.extern::after, label.dso-tertiary.download::after { position: relative; inset-block-start: -2px; } a.dso-tertiary.download::after, button.dso-tertiary.download::after, label.dso-tertiary.download::after { background: url("./di.svg#download") no-repeat center; background-size: cover; block-size: 24px; vertical-align: top; inline-size: 24px; } a.dso-tertiary.download[disabled]::after, button.dso-tertiary.download[disabled]::after, label.dso-tertiary.download[disabled]::after { background-image: var(--_dso-di-background-image, url("./di.svg#download-grasgroen-40")); } a.dso-tertiary.download:not([disabled]):hover::after, a.dso-tertiary.download:not([disabled]):active::after, button.dso-tertiary.download:not([disabled]):hover::after, button.dso-tertiary.download:not([disabled]):active::after, label.dso-tertiary.download:not([disabled]):hover::after, label.dso-tertiary.download:not([disabled]):active::after { background-image: var(--_dso-di-background-image, url("./di.svg#download-bosgroen")); } a.dso-tertiary.extern::after, button.dso-tertiary.extern::after, label.dso-tertiary.extern::after { background: url("./di.svg#external-link") no-repeat center; background-size: cover; block-size: 24px; vertical-align: top; inline-size: 24px; } a.dso-tertiary.extern[disabled]::after, button.dso-tertiary.extern[disabled]::after, label.dso-tertiary.extern[disabled]::after { background-image: var(--_dso-di-background-image, url("./di.svg#external-link-grasgroen-40")); } a.dso-tertiary.extern:not([disabled]):hover::after, a.dso-tertiary.extern:not([disabled]):active::after, button.dso-tertiary.extern:not([disabled]):hover::after, button.dso-tertiary.extern:not([disabled]):active::after, label.dso-tertiary.extern:not([disabled]):hover::after, label.dso-tertiary.extern:not([disabled]):active::after { background-image: var(--_dso-di-background-image, url("./di.svg#external-link-bosgroen")); } a.dso-map, button.dso-map, label.dso-map { display: inline-block; font-size: 1em; font-weight: 500; margin-block-end: 0; text-decoration: none; touch-action: manipulation; text-align: var(--_dt-button-text-align, start); user-select: none; vertical-align: middle; background-clip: padding-box; } a.dso-map:focus, a.dso-map:focus-visible, button.dso-map:focus, button.dso-map:focus-visible, label.dso-map:focus, label.dso-map:focus-visible { outline-offset: 2px; } a.dso-map:active, button.dso-map:active, label.dso-map:active { outline: 0; } a.dso-map, button.dso-map, label.dso-map { background-color: var(--_dso-button-secondary-background-color, #fff); border-color: var(--_dso-button-secondary-border-color, #39870c); color: var(--_dso-button-secondary-color, #39870c); float: var(--_dt-button-float-secondary, none); border-width: 1px; border-style: solid; border-radius: 4px; line-height: 1.5; min-inline-size: 56px; inline-size: var(--_dt-button-inline-size, auto); padding-block: 11px; padding-inline: 15px; } a.dso-map:hover, button.dso-map:hover, label.dso-map:hover { background-color: var(--_dso-button-secondary-hover-background-color, #d7e7ce); border-color: var(--_dso-button-secondary-hover-border-color, #275937); color: var(--_dso-button-secondary-hover-color, #275937); float: var(--_dt-button-float-secondary, none); } a.dso-map:active, button.dso-map:active, label.dso-map:active { background-color: var(--_dso-button-secondary-active-background-color, #275937); border-color: var(--_dso-button-secondary-active-border-color, #275937); color: var(--_dso-button-secondary-active-color, #fff); float: var(--_dt-button-float-secondary, none); } a.dso-map[disabled], a.dso-map[disabled]:hover, button.dso-map[disabled], button.dso-map[disabled]:hover, label.dso-map[disabled], label.dso-map[disabled]:hover { background-color: var(--_dso-button-secondary-disabled-background-color, #fff); border-color: var(--_dso-button-secondary-disabled-border-color, #afcf9d); color: var(--_dso-button-secondary-disabled-color, #afcf9d); float: var(--_dt-button-float-secondary, none); } a.dso-map.dso-small, button.dso-map.dso-small, label.dso-map.dso-small { line-height: 1rem; } a.dso-map.dso-small dso-icon, a.dso-map.dso-small.extern::after, a.dso-map.dso-small.download::after, a.dso-map.dso-small.dso-spinner::before, button.dso-map.dso-small dso-icon, button.dso-map.dso-small.extern::after, button.dso-map.dso-small.download::after, button.dso-map.dso-small.dso-spinner::before, label.dso-map.dso-small dso-icon, label.dso-map.dso-small.extern::after, label.dso-map.dso-small.download::after, label.dso-map.dso-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-map.dso-small.dso-spinner-left::before, button.dso-map.dso-small.dso-spinner-left::before, label.dso-map.dso-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-map.dso-small.dso-spinner-right::after, button.dso-map.dso-small.dso-spinner-right::after, label.dso-map.dso-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-map.dso-extra-small, button.dso-map.dso-extra-small, label.dso-map.dso-extra-small { line-height: 1rem; } a.dso-map.dso-extra-small dso-icon, a.dso-map.dso-extra-small.extern::after, a.dso-map.dso-extra-small.download::after, a.dso-map.dso-extra-small.dso-spinner::before, button.dso-map.dso-extra-small dso-icon, button.dso-map.dso-extra-small.extern::after, button.dso-map.dso-extra-small.download::after, button.dso-map.dso-extra-small.dso-spinner::before, label.dso-map.dso-extra-small dso-icon, label.dso-map.dso-extra-small.extern::after, label.dso-map.dso-extra-small.download::after, label.dso-map.dso-extra-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-map.dso-extra-small.dso-spinner-left::before, button.dso-map.dso-extra-small.dso-spinner-left::before, label.dso-map.dso-extra-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-map.dso-extra-small.dso-spinner-right::after, button.dso-map.dso-extra-small.dso-spinner-right::after, label.dso-map.dso-extra-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-map.dso-extra-small, button.dso-map.dso-extra-small, label.dso-map.dso-extra-small { padding-block: 9px; } a.dso-map dso-icon:has(+ span:not(.sr-only)), button.dso-map dso-icon:has(+ span:not(.sr-only)), label.dso-map dso-icon:has(+ span:not(.sr-only)) { margin-inline-start: -8px; } a.dso-map span:not(.sr-only) + dso-icon, button.dso-map span:not(.sr-only) + dso-icon, label.dso-map span:not(.sr-only) + dso-icon { margin-inline-start: 8px; margin-inline-end: -8px; } a.dso-map dso-icon + span:not(.sr-only), button.dso-map dso-icon + span:not(.sr-only), label.dso-map dso-icon + span:not(.sr-only) { margin-inline-start: 8px; } a.dso-map.dso-spinner-left[disabled], a.dso-map.dso-spinner-right[disabled], button.dso-map.dso-spinner-left[disabled], button.dso-map.dso-spinner-right[disabled], label.dso-map.dso-spinner-left[disabled], label.dso-map.dso-spinner-right[disabled] { background-color: #fff; border-color: #39870c; color: #39870c; } a.dso-map.dso-spinner-left::before, button.dso-map.dso-spinner-left::before, label.dso-map.dso-spinner-left::before { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-end: 8px; } a.dso-map.dso-spinner-left:not([disabled]):hover::before, button.dso-map.dso-spinner-left:not([disabled]):hover::before, label.dso-map.dso-spinner-left:not([disabled]):hover::before { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-end: 8px; } a.dso-map.dso-spinner-left:not([disabled]).dso-small:hover::before, button.dso-map.dso-spinner-left:not([disabled]).dso-small:hover::before, label.dso-map.dso-spinner-left:not([disabled]).dso-small:hover::before { block-size: 16px; inline-size: 16px; } a.dso-map.dso-spinner-right::after, button.dso-map.dso-spinner-right::after, label.dso-map.dso-spinner-right::after { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-start: 8px; } a.dso-map.dso-spinner-right:not([disabled]):hover::after, button.dso-map.dso-spinner-right:not([disabled]):hover::after, label.dso-map.dso-spinner-right:not([disabled]):hover::after { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-start: 8px; } a.dso-map.dso-spinner-right:not([disabled]).dso-small:hover::after, button.dso-map.dso-spinner-right:not([disabled]).dso-small:hover::after, label.dso-map.dso-spinner-right:not([disabled]).dso-small:hover::after { block-size: 16px; inline-size: 16px; } a.dso-map, button.dso-map, label.dso-map { box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.5); border: 0; font-weight: 600; margin-inline-end: 16px; padding-block: 8px; padding-inline: 16px; white-space: nowrap; } a.dso-map:focus, a.dso-map:focus-visible, button.dso-map:focus, button.dso-map:focus-visible, label.dso-map:focus, label.dso-map:focus-visible { outline-offset: -1px; } a.dso-map:has(span.sr-only):has(dso-icon), button.dso-map:has(span.sr-only):has(dso-icon), label.dso-map:has(span.sr-only):has(dso-icon) { padding: 8px; min-inline-size: auto; block-size: 40px; inline-size: 40px; } a.dso-primary, a.dso-primary:hover, a.dso-primary:visited, a.dso-primary:focus-visible { color: #fff; text-decoration: none; } a.dso-secondary { text-decoration: none; } a.dso-secondary, a.dso-secondary:visited { color: #39870c; } a.dso-secondary:hover, a.dso-secondary:focus-visible { color: #275937; text-decoration: none; } a.dso-tertiary { text-decoration: none; } a.dso-tertiary, a.dso-tertiary:visited { color: #39870c; } .dso-primary + .dso-primary, .dso-primary + .dso-secondary, .dso-primary + .dso-tertiary, .dso-secondary + .dso-primary, .dso-secondary + .dso-secondary, .dso-secondary + .dso-tertiary, .dso-tertiary + .dso-primary, .dso-tertiary + .dso-secondary, .dso-tertiary + .dso-tertiary { margin-block-start: var(--_dt-button-after-button-margin-block-start, 0); margin-inline-start: var(--_dt-button-after-button-margin-inline-start, 16px); } :host { background-color: #fff; border: 1px solid #ccc; inset-block-end: 0; display: block; font-family: Asap, sans-serif; position: absolute; inset-block-start: 0; inset-inline-start: 100%; transition: transform 300ms ease; inline-size: 300px; } *, *::after, *::before { box-sizing: border-box; } :host([open]) { box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.3); transform: translateX(-100%); } :host([open]) .toggle-visibility-button, :host([open]) .toggle-visibility-icon-button { display: none; } :host([open]) .zoom-buttons { inset-block-start: 16px; } .toggle-visibility-icon-button { display: none; } .toggle-visibility-button { position: absolute; inset-inline-end: calc(100% + 56px); inset-block-start: 16px; } .zoom-buttons { position: absolute; inset-inline-end: calc(100% + 16px); inset-block-start: 16px; } .close-button { padding: 0; position: absolute; inset-inline-end: 16px; inset-block-start: 16px; } section:not([hidden]) { display: flex; flex-direction: column; block-size: 100%; } header, .content { padding: 16px; } header { border-block-end: 1px solid #ccc; flex-grow: 0; position: relative; } header h2 { color: #275937; font-family: "Asap", sans-serif; line-height: 1; margin: 0; } @media screen and (max-width: 767px) { button.toggle-visibility-button { display: none; } .toggle-visibility-icon-button { display: inline-block; position: absolute; inset-block-start: 16px; inset-inline-end: calc(100% + 16px); } .zoom-buttons { inset-block-start: 72px; } }`;
27
+ const mapControlsCss = () => `button { -webkit-appearance: button; color: inherit; cursor: pointer; font: inherit; font-family: inherit; font-size: inherit; line-height: inherit; margin: 0; overflow: visible; text-transform: none; } button[disabled] { cursor: default; } button::-moz-focus-inner { border: 0; padding: 0; } a.dso-primary, button.dso-primary, label.dso-primary { display: inline-block; font-size: 1em; font-weight: 500; margin-block-end: 0; text-decoration: none; touch-action: manipulation; text-align: var(--_dt-button-text-align, start); user-select: none; vertical-align: middle; background-clip: padding-box; } a.dso-primary:focus, a.dso-primary:focus-visible, button.dso-primary:focus, button.dso-primary:focus-visible, label.dso-primary:focus, label.dso-primary:focus-visible { outline-offset: 2px; } a.dso-primary:active, button.dso-primary:active, label.dso-primary:active { outline: 0; } a.dso-primary.extern::after, a.dso-primary.download::after, button.dso-primary.extern::after, button.dso-primary.download::after, label.dso-primary.extern::after, label.dso-primary.download::after { content: ""; display: inline-block; } a.dso-primary, button.dso-primary, label.dso-primary { background-color: var(--_dso-button-primary-background-color, #39870c); border-color: var(--_dso-button-primary-border-color, #39870c); color: var(--_dso-button-primary-color, #fff); float: var(--_dt-button-float-primary, none); border-width: 1px; border-style: solid; border-radius: 4px; line-height: 1.5; min-inline-size: 56px; inline-size: var(--_dt-button-inline-size, auto); padding-block: 11px; padding-inline: 15px; } a.dso-primary:hover, button.dso-primary:hover, label.dso-primary:hover { background-color: var(--_dso-button-primary-hover-background-color, #275937); border-color: var(--_dso-button-primary-hover-border-color, #275937); color: var(--_dso-button-primary-hover-color, #fff); float: var(--_dt-button-float-primary, none); } a.dso-primary:active, button.dso-primary:active, label.dso-primary:active { background-color: var(--_dso-button-primary-active-background-color, #173521); border-color: var(--_dso-button-primary-active-border-color, #173521); color: var(--_dso-button-primary-active-color, #fff); float: var(--_dt-button-float-primary, none); } a.dso-primary[disabled], a.dso-primary[disabled]:hover, button.dso-primary[disabled], button.dso-primary[disabled]:hover, label.dso-primary[disabled], label.dso-primary[disabled]:hover { background-color: var(--_dso-button-primary-disabled-background-color, #afcf9d); border-color: var(--_dso-button-primary-disabled-border-color, #afcf9d); color: var(--_dso-button-primary-disabled-color, #fff); float: var(--_dt-button-float-primary, none); } a.dso-primary.dso-small, button.dso-primary.dso-small, label.dso-primary.dso-small { line-height: 1rem; } a.dso-primary.dso-small dso-icon, a.dso-primary.dso-small.extern::after, a.dso-primary.dso-small.download::after, a.dso-primary.dso-small.dso-spinner::before, button.dso-primary.dso-small dso-icon, button.dso-primary.dso-small.extern::after, button.dso-primary.dso-small.download::after, button.dso-primary.dso-small.dso-spinner::before, label.dso-primary.dso-small dso-icon, label.dso-primary.dso-small.extern::after, label.dso-primary.dso-small.download::after, label.dso-primary.dso-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-primary.dso-small.dso-spinner-left::before, button.dso-primary.dso-small.dso-spinner-left::before, label.dso-primary.dso-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-primary.dso-small.dso-spinner-right::after, button.dso-primary.dso-small.dso-spinner-right::after, label.dso-primary.dso-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-primary.dso-extra-small, button.dso-primary.dso-extra-small, label.dso-primary.dso-extra-small { line-height: 1rem; } a.dso-primary.dso-extra-small dso-icon, a.dso-primary.dso-extra-small.extern::after, a.dso-primary.dso-extra-small.download::after, a.dso-primary.dso-extra-small.dso-spinner::before, button.dso-primary.dso-extra-small dso-icon, button.dso-primary.dso-extra-small.extern::after, button.dso-primary.dso-extra-small.download::after, button.dso-primary.dso-extra-small.dso-spinner::before, label.dso-primary.dso-extra-small dso-icon, label.dso-primary.dso-extra-small.extern::after, label.dso-primary.dso-extra-small.download::after, label.dso-primary.dso-extra-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-primary.dso-extra-small.dso-spinner-left::before, button.dso-primary.dso-extra-small.dso-spinner-left::before, label.dso-primary.dso-extra-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-primary.dso-extra-small.dso-spinner-right::after, button.dso-primary.dso-extra-small.dso-spinner-right::after, label.dso-primary.dso-extra-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-primary.dso-extra-small, button.dso-primary.dso-extra-small, label.dso-primary.dso-extra-small { padding-block: 9px; } a.dso-primary dso-icon:has(+ span:not(.sr-only)), button.dso-primary dso-icon:has(+ span:not(.sr-only)), label.dso-primary dso-icon:has(+ span:not(.sr-only)) { margin-inline-start: -8px; } a.dso-primary span:not(.sr-only) + dso-icon, button.dso-primary span:not(.sr-only) + dso-icon, label.dso-primary span:not(.sr-only) + dso-icon { margin-inline-start: 8px; margin-inline-end: -8px; } a.dso-primary dso-icon + span:not(.sr-only), button.dso-primary dso-icon + span:not(.sr-only), label.dso-primary dso-icon + span:not(.sr-only) { margin-inline-start: 8px; } a.dso-primary.dso-spinner-left[disabled], a.dso-primary.dso-spinner-right[disabled], button.dso-primary.dso-spinner-left[disabled], button.dso-primary.dso-spinner-right[disabled], label.dso-primary.dso-spinner-left[disabled], label.dso-primary.dso-spinner-right[disabled] { background-color: #39870c; border-color: #39870c; color: #fff; } a.dso-primary.dso-spinner-left::before, button.dso-primary.dso-spinner-left::before, label.dso-primary.dso-spinner-left::before { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-end: 8px; } a.dso-primary.dso-spinner-right::after, button.dso-primary.dso-spinner-right::after, label.dso-primary.dso-spinner-right::after { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-start: 8px; } a.dso-primary.download::after, button.dso-primary.download::after, label.dso-primary.download::after { background: url("./di.svg#download-wit") no-repeat center; background-size: cover; block-size: 24px; vertical-align: top; inline-size: 24px; } a.dso-primary.extern::after, button.dso-primary.extern::after, label.dso-primary.extern::after { background: url("./di.svg#external-link-wit") no-repeat center; background-size: cover; block-size: 24px; vertical-align: top; inline-size: 24px; } a.dso-secondary, button.dso-secondary, label.dso-secondary { display: inline-block; font-size: 1em; font-weight: 500; margin-block-end: 0; text-decoration: none; touch-action: manipulation; text-align: var(--_dt-button-text-align, start); user-select: none; vertical-align: middle; background-clip: padding-box; } a.dso-secondary:focus, a.dso-secondary:focus-visible, button.dso-secondary:focus, button.dso-secondary:focus-visible, label.dso-secondary:focus, label.dso-secondary:focus-visible { outline-offset: 2px; } a.dso-secondary:active, button.dso-secondary:active, label.dso-secondary:active { outline: 0; } a.dso-secondary.extern::after, a.dso-secondary.download::after, button.dso-secondary.extern::after, button.dso-secondary.download::after, label.dso-secondary.extern::after, label.dso-secondary.download::after { content: ""; display: inline-block; } a.dso-secondary, button.dso-secondary, label.dso-secondary { background-color: var(--_dso-button-secondary-background-color, #fff); border-color: var(--_dso-button-secondary-border-color, #39870c); color: var(--_dso-button-secondary-color, #39870c); float: var(--_dt-button-float-secondary, none); border-width: 1px; border-style: solid; border-radius: 4px; line-height: 1.5; min-inline-size: 56px; inline-size: var(--_dt-button-inline-size, auto); padding-block: 11px; padding-inline: 15px; } a.dso-secondary:hover, button.dso-secondary:hover, label.dso-secondary:hover { background-color: var(--_dso-button-secondary-hover-background-color, #d7e7ce); border-color: var(--_dso-button-secondary-hover-border-color, #275937); color: var(--_dso-button-secondary-hover-color, #275937); float: var(--_dt-button-float-secondary, none); } a.dso-secondary:active, button.dso-secondary:active, label.dso-secondary:active { background-color: var(--_dso-button-secondary-active-background-color, #275937); border-color: var(--_dso-button-secondary-active-border-color, #275937); color: var(--_dso-button-secondary-active-color, #fff); float: var(--_dt-button-float-secondary, none); } a.dso-secondary[disabled], a.dso-secondary[disabled]:hover, button.dso-secondary[disabled], button.dso-secondary[disabled]:hover, label.dso-secondary[disabled], label.dso-secondary[disabled]:hover { background-color: var(--_dso-button-secondary-disabled-background-color, #fff); border-color: var(--_dso-button-secondary-disabled-border-color, #afcf9d); color: var(--_dso-button-secondary-disabled-color, #afcf9d); float: var(--_dt-button-float-secondary, none); } a.dso-secondary.dso-small, button.dso-secondary.dso-small, label.dso-secondary.dso-small { line-height: 1rem; } a.dso-secondary.dso-small dso-icon, a.dso-secondary.dso-small.extern::after, a.dso-secondary.dso-small.download::after, a.dso-secondary.dso-small.dso-spinner::before, button.dso-secondary.dso-small dso-icon, button.dso-secondary.dso-small.extern::after, button.dso-secondary.dso-small.download::after, button.dso-secondary.dso-small.dso-spinner::before, label.dso-secondary.dso-small dso-icon, label.dso-secondary.dso-small.extern::after, label.dso-secondary.dso-small.download::after, label.dso-secondary.dso-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-secondary.dso-small.dso-spinner-left::before, button.dso-secondary.dso-small.dso-spinner-left::before, label.dso-secondary.dso-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-secondary.dso-small.dso-spinner-right::after, button.dso-secondary.dso-small.dso-spinner-right::after, label.dso-secondary.dso-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-secondary.dso-extra-small, button.dso-secondary.dso-extra-small, label.dso-secondary.dso-extra-small { line-height: 1rem; } a.dso-secondary.dso-extra-small dso-icon, a.dso-secondary.dso-extra-small.extern::after, a.dso-secondary.dso-extra-small.download::after, a.dso-secondary.dso-extra-small.dso-spinner::before, button.dso-secondary.dso-extra-small dso-icon, button.dso-secondary.dso-extra-small.extern::after, button.dso-secondary.dso-extra-small.download::after, button.dso-secondary.dso-extra-small.dso-spinner::before, label.dso-secondary.dso-extra-small dso-icon, label.dso-secondary.dso-extra-small.extern::after, label.dso-secondary.dso-extra-small.download::after, label.dso-secondary.dso-extra-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-secondary.dso-extra-small.dso-spinner-left::before, button.dso-secondary.dso-extra-small.dso-spinner-left::before, label.dso-secondary.dso-extra-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-secondary.dso-extra-small.dso-spinner-right::after, button.dso-secondary.dso-extra-small.dso-spinner-right::after, label.dso-secondary.dso-extra-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-secondary.dso-extra-small, button.dso-secondary.dso-extra-small, label.dso-secondary.dso-extra-small { padding-block: 9px; } a.dso-secondary dso-icon:has(+ span:not(.sr-only)), button.dso-secondary dso-icon:has(+ span:not(.sr-only)), label.dso-secondary dso-icon:has(+ span:not(.sr-only)) { margin-inline-start: -8px; } a.dso-secondary span:not(.sr-only) + dso-icon, button.dso-secondary span:not(.sr-only) + dso-icon, label.dso-secondary span:not(.sr-only) + dso-icon { margin-inline-start: 8px; margin-inline-end: -8px; } a.dso-secondary dso-icon + span:not(.sr-only), button.dso-secondary dso-icon + span:not(.sr-only), label.dso-secondary dso-icon + span:not(.sr-only) { margin-inline-start: 8px; } a.dso-secondary.dso-spinner-left[disabled], a.dso-secondary.dso-spinner-right[disabled], button.dso-secondary.dso-spinner-left[disabled], button.dso-secondary.dso-spinner-right[disabled], label.dso-secondary.dso-spinner-left[disabled], label.dso-secondary.dso-spinner-right[disabled] { background-color: #fff; border-color: #39870c; color: #39870c; } a.dso-secondary.dso-spinner-left::before, button.dso-secondary.dso-spinner-left::before, label.dso-secondary.dso-spinner-left::before { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-end: 8px; } a.dso-secondary.dso-spinner-left:not([disabled]):hover::before, button.dso-secondary.dso-spinner-left:not([disabled]):hover::before, label.dso-secondary.dso-spinner-left:not([disabled]):hover::before { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-end: 8px; } a.dso-secondary.dso-spinner-left:not([disabled]).dso-small:hover::before, button.dso-secondary.dso-spinner-left:not([disabled]).dso-small:hover::before, label.dso-secondary.dso-spinner-left:not([disabled]).dso-small:hover::before { block-size: 16px; inline-size: 16px; } a.dso-secondary.dso-spinner-right::after, button.dso-secondary.dso-spinner-right::after, label.dso-secondary.dso-spinner-right::after { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-start: 8px; } a.dso-secondary.dso-spinner-right:not([disabled]):hover::after, button.dso-secondary.dso-spinner-right:not([disabled]):hover::after, label.dso-secondary.dso-spinner-right:not([disabled]):hover::after { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-start: 8px; } a.dso-secondary.dso-spinner-right:not([disabled]).dso-small:hover::after, button.dso-secondary.dso-spinner-right:not([disabled]).dso-small:hover::after, label.dso-secondary.dso-spinner-right:not([disabled]).dso-small:hover::after { block-size: 16px; inline-size: 16px; } a.dso-secondary.download::after, button.dso-secondary.download::after, label.dso-secondary.download::after { background: url("./di.svg#download") no-repeat center; background-size: cover; block-size: 24px; vertical-align: top; inline-size: 24px; } a.dso-secondary.download:hover::after, button.dso-secondary.download:hover::after, label.dso-secondary.download:hover::after { background-image: var(--_dso-di-background-image, url("./di.svg#download-bosgroen")); } a.dso-secondary.download[disabled]::after, button.dso-secondary.download[disabled]::after, label.dso-secondary.download[disabled]::after { background-image: var(--_dso-di-background-image, url("./di.svg#download-grasgroen-40")); } a.dso-secondary.extern::after, button.dso-secondary.extern::after, label.dso-secondary.extern::after { background: url("./di.svg#external-link") no-repeat center; background-size: cover; block-size: 24px; vertical-align: top; inline-size: 24px; } a.dso-secondary.extern:hover::after, button.dso-secondary.extern:hover::after, label.dso-secondary.extern:hover::after { background-image: var(--_dso-di-background-image, url("./di.svg#external-link-bosgroen")); } a.dso-secondary.extern[disabled]::after, button.dso-secondary.extern[disabled]::after, label.dso-secondary.extern[disabled]::after { background-image: var(--_dso-di-background-image, url("./di.svg#external-link-grasgroen-40")); } a.dso-tertiary, button.dso-tertiary, label.dso-tertiary { display: inline-block; font-size: 1em; font-weight: 500; margin-block-end: 0; text-decoration: none; touch-action: manipulation; text-align: var(--_dt-button-text-align, start); user-select: none; vertical-align: middle; background-clip: padding-box; } a.dso-tertiary:focus, a.dso-tertiary:focus-visible, button.dso-tertiary:focus, button.dso-tertiary:focus-visible, label.dso-tertiary:focus, label.dso-tertiary:focus-visible { outline-offset: 2px; } a.dso-tertiary:active, button.dso-tertiary:active, label.dso-tertiary:active { outline: 0; } a.dso-tertiary.extern::after, a.dso-tertiary.download::after, button.dso-tertiary.extern::after, button.dso-tertiary.download::after, label.dso-tertiary.extern::after, label.dso-tertiary.download::after { content: ""; display: inline-block; } a.dso-tertiary, button.dso-tertiary, label.dso-tertiary { display: inline-block; font-size: 1em; font-weight: 500; margin-block-end: 0; text-decoration: none; touch-action: manipulation; text-align: var(--_dt-button-text-align, start); user-select: none; vertical-align: middle; background-clip: padding-box; } a.dso-tertiary:focus, a.dso-tertiary:focus-visible, button.dso-tertiary:focus, button.dso-tertiary:focus-visible, label.dso-tertiary:focus, label.dso-tertiary:focus-visible { outline-offset: 2px; } a.dso-tertiary:active, button.dso-tertiary:active, label.dso-tertiary:active { outline: 0; } a.dso-tertiary.extern::after, a.dso-tertiary.download::after, button.dso-tertiary.extern::after, button.dso-tertiary.download::after, label.dso-tertiary.extern::after, label.dso-tertiary.download::after { content: ""; display: inline-block; } a.dso-tertiary, button.dso-tertiary, label.dso-tertiary { background-color: var(--_dso-button-tertiary-background-color, ); border-color: var(--_dso-button-tertiary-border-color, ); color: var(--_dso-button-tertiary-color, #39870c); float: var(--_dt-button-float-tertiary, none); border-width: 1px; border-style: solid; border-radius: 4px; line-height: 1.5; min-inline-size: auto; inline-size: var(--_dt-button-inline-size, auto); padding-block: 11px; padding-inline: 15px; } a.dso-tertiary:hover, button.dso-tertiary:hover, label.dso-tertiary:hover { background-color: var(--_dso-button-tertiary-hover-background-color, ); border-color: var(--_dso-button-tertiary-hover-border-color, ); color: var(--_dso-button-tertiary-hover-color, #275937); float: var(--_dt-button-float-tertiary, none); } a.dso-tertiary:active, button.dso-tertiary:active, label.dso-tertiary:active { background-color: var(--_dso-button-tertiary-active-background-color, ); border-color: var(--_dso-button-tertiary-active-border-color, ); color: var(--_dso-button-tertiary-active-color, #173521); float: var(--_dt-button-float-tertiary, none); } a.dso-tertiary[disabled], a.dso-tertiary[disabled]:hover, button.dso-tertiary[disabled], button.dso-tertiary[disabled]:hover, label.dso-tertiary[disabled], label.dso-tertiary[disabled]:hover { background-color: var(--_dso-button-tertiary-disabled-background-color, ); border-color: var(--_dso-button-tertiary-disabled-border-color, ); color: var(--_dso-button-tertiary-disabled-color, #afcf9d); float: var(--_dt-button-float-tertiary, none); } a.dso-tertiary.dso-small, button.dso-tertiary.dso-small, label.dso-tertiary.dso-small { line-height: 1rem; } a.dso-tertiary.dso-small dso-icon, a.dso-tertiary.dso-small.extern::after, a.dso-tertiary.dso-small.download::after, a.dso-tertiary.dso-small.dso-spinner::before, button.dso-tertiary.dso-small dso-icon, button.dso-tertiary.dso-small.extern::after, button.dso-tertiary.dso-small.download::after, button.dso-tertiary.dso-small.dso-spinner::before, label.dso-tertiary.dso-small dso-icon, label.dso-tertiary.dso-small.extern::after, label.dso-tertiary.dso-small.download::after, label.dso-tertiary.dso-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-tertiary.dso-small.dso-spinner-left::before, button.dso-tertiary.dso-small.dso-spinner-left::before, label.dso-tertiary.dso-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-tertiary.dso-small.dso-spinner-right::after, button.dso-tertiary.dso-small.dso-spinner-right::after, label.dso-tertiary.dso-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-tertiary.dso-extra-small, button.dso-tertiary.dso-extra-small, label.dso-tertiary.dso-extra-small { line-height: 1rem; } a.dso-tertiary.dso-extra-small dso-icon, a.dso-tertiary.dso-extra-small.extern::after, a.dso-tertiary.dso-extra-small.download::after, a.dso-tertiary.dso-extra-small.dso-spinner::before, button.dso-tertiary.dso-extra-small dso-icon, button.dso-tertiary.dso-extra-small.extern::after, button.dso-tertiary.dso-extra-small.download::after, button.dso-tertiary.dso-extra-small.dso-spinner::before, label.dso-tertiary.dso-extra-small dso-icon, label.dso-tertiary.dso-extra-small.extern::after, label.dso-tertiary.dso-extra-small.download::after, label.dso-tertiary.dso-extra-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-tertiary.dso-extra-small.dso-spinner-left::before, button.dso-tertiary.dso-extra-small.dso-spinner-left::before, label.dso-tertiary.dso-extra-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-tertiary.dso-extra-small.dso-spinner-right::after, button.dso-tertiary.dso-extra-small.dso-spinner-right::after, label.dso-tertiary.dso-extra-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-tertiary.dso-extra-small, button.dso-tertiary.dso-extra-small, label.dso-tertiary.dso-extra-small { padding-block: 9px; } a.dso-tertiary, button.dso-tertiary, label.dso-tertiary { border: 0; line-height: 1; padding-inline: 0; padding-block: var(--_dt-button-padding-block-tertiary, 0); background-color: transparent; } a.dso-tertiary[disabled].dso-spinner-left, a.dso-tertiary[disabled].dso-spinner-right, button.dso-tertiary[disabled].dso-spinner-left, button.dso-tertiary[disabled].dso-spinner-right, label.dso-tertiary[disabled].dso-spinner-left, label.dso-tertiary[disabled].dso-spinner-right { color: #39870c; } a.dso-tertiary:not([disabled]):hover, button.dso-tertiary:not([disabled]):hover, label.dso-tertiary:not([disabled]):hover { text-decoration: underline; text-underline-position: under; } a.dso-tertiary.dso-align, button.dso-tertiary.dso-align, label.dso-tertiary.dso-align { line-height: calc(1.5em - 1px); padding-block: 11px; padding-inline: 0; position: relative; } a.dso-tertiary.dso-truncate, button.dso-tertiary.dso-truncate, label.dso-tertiary.dso-truncate { max-inline-size: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } a.dso-tertiary.dso-spinner-left::before, button.dso-tertiary.dso-spinner-left::before, label.dso-tertiary.dso-spinner-left::before { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: middle; inline-size: 24px; margin-inline-end: 8px; } a.dso-tertiary.dso-spinner-right::after, button.dso-tertiary.dso-spinner-right::after, label.dso-tertiary.dso-spinner-right::after { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: middle; inline-size: 24px; margin-inline-start: 8px; } a.dso-tertiary dso-icon + span:not(.sr-only), a.dso-tertiary span:not(.sr-only) + dso-icon, button.dso-tertiary dso-icon + span:not(.sr-only), button.dso-tertiary span:not(.sr-only) + dso-icon, label.dso-tertiary dso-icon + span:not(.sr-only), label.dso-tertiary span:not(.sr-only) + dso-icon { margin-inline-start: 8px; } a.dso-tertiary dso-icon[icon=chevron-left] + span:not(.sr-only), a.dso-tertiary dso-icon[icon=chevron-right] + span:not(.sr-only), a.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-left], a.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-right], button.dso-tertiary dso-icon[icon=chevron-left] + span:not(.sr-only), button.dso-tertiary dso-icon[icon=chevron-right] + span:not(.sr-only), button.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-left], button.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-right], label.dso-tertiary dso-icon[icon=chevron-left] + span:not(.sr-only), label.dso-tertiary dso-icon[icon=chevron-right] + span:not(.sr-only), label.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-left], label.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-right] { margin-inline-start: 0; } a.dso-tertiary dso-icon, a.dso-tertiary span, button.dso-tertiary dso-icon, button.dso-tertiary span, label.dso-tertiary dso-icon, label.dso-tertiary span { vertical-align: middle; } a.dso-tertiary.extern::after, a.dso-tertiary.download::after, button.dso-tertiary.extern::after, button.dso-tertiary.download::after, label.dso-tertiary.extern::after, label.dso-tertiary.download::after { position: relative; inset-block-start: -2px; } a.dso-tertiary.download::after, button.dso-tertiary.download::after, label.dso-tertiary.download::after { background: url("./di.svg#download") no-repeat center; background-size: cover; block-size: 24px; vertical-align: top; inline-size: 24px; } a.dso-tertiary.download[disabled]::after, button.dso-tertiary.download[disabled]::after, label.dso-tertiary.download[disabled]::after { background-image: var(--_dso-di-background-image, url("./di.svg#download-grasgroen-40")); } a.dso-tertiary.download:not([disabled]):hover::after, a.dso-tertiary.download:not([disabled]):active::after, button.dso-tertiary.download:not([disabled]):hover::after, button.dso-tertiary.download:not([disabled]):active::after, label.dso-tertiary.download:not([disabled]):hover::after, label.dso-tertiary.download:not([disabled]):active::after { background-image: var(--_dso-di-background-image, url("./di.svg#download-bosgroen")); } a.dso-tertiary.extern::after, button.dso-tertiary.extern::after, label.dso-tertiary.extern::after { background: url("./di.svg#external-link") no-repeat center; background-size: cover; block-size: 24px; vertical-align: top; inline-size: 24px; } a.dso-tertiary.extern[disabled]::after, button.dso-tertiary.extern[disabled]::after, label.dso-tertiary.extern[disabled]::after { background-image: var(--_dso-di-background-image, url("./di.svg#external-link-grasgroen-40")); } a.dso-tertiary.extern:not([disabled]):hover::after, a.dso-tertiary.extern:not([disabled]):active::after, button.dso-tertiary.extern:not([disabled]):hover::after, button.dso-tertiary.extern:not([disabled]):active::after, label.dso-tertiary.extern:not([disabled]):hover::after, label.dso-tertiary.extern:not([disabled]):active::after { background-image: var(--_dso-di-background-image, url("./di.svg#external-link-bosgroen")); } a.dso-map, button.dso-map, label.dso-map { display: inline-block; font-size: 1em; font-weight: 500; margin-block-end: 0; text-decoration: none; touch-action: manipulation; text-align: var(--_dt-button-text-align, start); user-select: none; vertical-align: middle; background-clip: padding-box; } a.dso-map:focus, a.dso-map:focus-visible, button.dso-map:focus, button.dso-map:focus-visible, label.dso-map:focus, label.dso-map:focus-visible { outline-offset: 2px; } a.dso-map:active, button.dso-map:active, label.dso-map:active { outline: 0; } a.dso-map, button.dso-map, label.dso-map { background-color: var(--_dso-button-secondary-background-color, #fff); border-color: var(--_dso-button-secondary-border-color, #39870c); color: var(--_dso-button-secondary-color, #39870c); float: var(--_dt-button-float-secondary, none); border-width: 1px; border-style: solid; border-radius: 4px; line-height: 1.5; min-inline-size: 56px; inline-size: var(--_dt-button-inline-size, auto); padding-block: 11px; padding-inline: 15px; } a.dso-map:hover, button.dso-map:hover, label.dso-map:hover { background-color: var(--_dso-button-secondary-hover-background-color, #d7e7ce); border-color: var(--_dso-button-secondary-hover-border-color, #275937); color: var(--_dso-button-secondary-hover-color, #275937); float: var(--_dt-button-float-secondary, none); } a.dso-map:active, button.dso-map:active, label.dso-map:active { background-color: var(--_dso-button-secondary-active-background-color, #275937); border-color: var(--_dso-button-secondary-active-border-color, #275937); color: var(--_dso-button-secondary-active-color, #fff); float: var(--_dt-button-float-secondary, none); } a.dso-map[disabled], a.dso-map[disabled]:hover, button.dso-map[disabled], button.dso-map[disabled]:hover, label.dso-map[disabled], label.dso-map[disabled]:hover { background-color: var(--_dso-button-secondary-disabled-background-color, #fff); border-color: var(--_dso-button-secondary-disabled-border-color, #afcf9d); color: var(--_dso-button-secondary-disabled-color, #afcf9d); float: var(--_dt-button-float-secondary, none); } a.dso-map.dso-small, button.dso-map.dso-small, label.dso-map.dso-small { line-height: 1rem; } a.dso-map.dso-small dso-icon, a.dso-map.dso-small.extern::after, a.dso-map.dso-small.download::after, a.dso-map.dso-small.dso-spinner::before, button.dso-map.dso-small dso-icon, button.dso-map.dso-small.extern::after, button.dso-map.dso-small.download::after, button.dso-map.dso-small.dso-spinner::before, label.dso-map.dso-small dso-icon, label.dso-map.dso-small.extern::after, label.dso-map.dso-small.download::after, label.dso-map.dso-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-map.dso-small.dso-spinner-left::before, button.dso-map.dso-small.dso-spinner-left::before, label.dso-map.dso-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-map.dso-small.dso-spinner-right::after, button.dso-map.dso-small.dso-spinner-right::after, label.dso-map.dso-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-map.dso-extra-small, button.dso-map.dso-extra-small, label.dso-map.dso-extra-small { line-height: 1rem; } a.dso-map.dso-extra-small dso-icon, a.dso-map.dso-extra-small.extern::after, a.dso-map.dso-extra-small.download::after, a.dso-map.dso-extra-small.dso-spinner::before, button.dso-map.dso-extra-small dso-icon, button.dso-map.dso-extra-small.extern::after, button.dso-map.dso-extra-small.download::after, button.dso-map.dso-extra-small.dso-spinner::before, label.dso-map.dso-extra-small dso-icon, label.dso-map.dso-extra-small.extern::after, label.dso-map.dso-extra-small.download::after, label.dso-map.dso-extra-small.dso-spinner::before { margin-block-end: -4px; margin-block-start: -4px; } a.dso-map.dso-extra-small.dso-spinner-left::before, button.dso-map.dso-extra-small.dso-spinner-left::before, label.dso-map.dso-extra-small.dso-spinner-left::before { block-size: 16px; inline-size: 16px; } a.dso-map.dso-extra-small.dso-spinner-right::after, button.dso-map.dso-extra-small.dso-spinner-right::after, label.dso-map.dso-extra-small.dso-spinner-right::after { block-size: 16px; inline-size: 16px; } a.dso-map.dso-extra-small, button.dso-map.dso-extra-small, label.dso-map.dso-extra-small { padding-block: 9px; } a.dso-map dso-icon:has(+ span:not(.sr-only)), button.dso-map dso-icon:has(+ span:not(.sr-only)), label.dso-map dso-icon:has(+ span:not(.sr-only)) { margin-inline-start: -8px; } a.dso-map span:not(.sr-only) + dso-icon, button.dso-map span:not(.sr-only) + dso-icon, label.dso-map span:not(.sr-only) + dso-icon { margin-inline-start: 8px; margin-inline-end: -8px; } a.dso-map dso-icon + span:not(.sr-only), button.dso-map dso-icon + span:not(.sr-only), label.dso-map dso-icon + span:not(.sr-only) { margin-inline-start: 8px; } a.dso-map.dso-spinner-left[disabled], a.dso-map.dso-spinner-right[disabled], button.dso-map.dso-spinner-left[disabled], button.dso-map.dso-spinner-right[disabled], label.dso-map.dso-spinner-left[disabled], label.dso-map.dso-spinner-right[disabled] { background-color: #fff; border-color: #39870c; color: #39870c; } a.dso-map.dso-spinner-left::before, button.dso-map.dso-spinner-left::before, label.dso-map.dso-spinner-left::before { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-end: 8px; } a.dso-map.dso-spinner-left:not([disabled]):hover::before, button.dso-map.dso-spinner-left:not([disabled]):hover::before, label.dso-map.dso-spinner-left:not([disabled]):hover::before { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-end: 8px; } a.dso-map.dso-spinner-left:not([disabled]).dso-small:hover::before, button.dso-map.dso-spinner-left:not([disabled]).dso-small:hover::before, label.dso-map.dso-spinner-left:not([disabled]).dso-small:hover::before { block-size: 16px; inline-size: 16px; } a.dso-map.dso-spinner-right::after, button.dso-map.dso-spinner-right::after, label.dso-map.dso-spinner-right::after { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-start: 8px; } a.dso-map.dso-spinner-right:not([disabled]):hover::after, button.dso-map.dso-spinner-right:not([disabled]):hover::after, label.dso-map.dso-spinner-right:not([disabled]):hover::after { background-image: url("data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 42.4; stroke-dashoffset: 0; transform-origin: center; stroke: %23fff; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 42.4; %7D 50%25 %7B stroke-dashoffset: 10.4; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 42.4; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='1.6' stroke-linecap='butt' cx='12' cy='12' r='7.2'%3E%3C/circle%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; block-size: 24px; vertical-align: top; inline-size: 24px; margin-inline-start: 8px; } a.dso-map.dso-spinner-right:not([disabled]).dso-small:hover::after, button.dso-map.dso-spinner-right:not([disabled]).dso-small:hover::after, label.dso-map.dso-spinner-right:not([disabled]).dso-small:hover::after { block-size: 16px; inline-size: 16px; } a.dso-map, button.dso-map, label.dso-map { box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.5); border: 0; font-weight: 600; margin-inline-end: 16px; padding-block: 8px; padding-inline: 16px; white-space: nowrap; } a.dso-map:focus, a.dso-map:focus-visible, button.dso-map:focus, button.dso-map:focus-visible, label.dso-map:focus, label.dso-map:focus-visible { outline-offset: -1px; } a.dso-map:has(span.sr-only):has(dso-icon), button.dso-map:has(span.sr-only):has(dso-icon), label.dso-map:has(span.sr-only):has(dso-icon) { padding: 8px; min-inline-size: auto; block-size: 40px; inline-size: 40px; } a.dso-primary, a.dso-primary:hover, a.dso-primary:visited, a.dso-primary:focus-visible { color: #fff; text-decoration: none; } a.dso-secondary { text-decoration: none; } a.dso-secondary, a.dso-secondary:visited { color: #39870c; } a.dso-secondary:hover, a.dso-secondary:focus-visible { color: #275937; text-decoration: none; } a.dso-tertiary { text-decoration: none; } a.dso-tertiary, a.dso-tertiary:visited { color: #39870c; } .dso-primary + .dso-primary, .dso-primary + .dso-secondary, .dso-primary + .dso-tertiary, .dso-secondary + .dso-primary, .dso-secondary + .dso-secondary, .dso-secondary + .dso-tertiary, .dso-tertiary + .dso-primary, .dso-tertiary + .dso-secondary, .dso-tertiary + .dso-tertiary { margin-block-start: var(--_dt-button-after-button-margin-block-start, 0); margin-inline-start: var(--_dt-button-after-button-margin-inline-start, 16px); } :host { background-color: #fff; border: 1px solid #ccc; inset-block-end: 0; display: block; font-family: Asap, sans-serif; position: absolute; inset-block-start: 0; inset-inline-start: 100%; transition: transform 300ms ease; inline-size: 300px; } *, *::after, *::before { box-sizing: border-box; } :host([open]) { box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.3); transform: translateX(-100%); } :host([open]) .toggle-visibility-button, :host([open]) .toggle-visibility-icon-button { display: none; } :host([open]) .zoom-buttons { inset-block-start: 16px; } .toggle-visibility-icon-button { display: none; } .toggle-visibility-button { position: absolute; inset-inline-end: calc(100% + 56px); inset-block-start: 16px; } .zoom-buttons { position: absolute; inset-inline-end: calc(100% + 16px); inset-block-start: 16px; } .close-button { padding: 0; position: absolute; inset-inline-end: 16px; inset-block-start: 16px; } section:not([hidden]) { display: flex; flex-direction: column; block-size: 100%; } header, .content { padding: 16px; } header { border-block-end: 1px solid #ccc; flex-grow: 0; position: relative; } header h2 { color: #275937; font-family: "Asap", sans-serif; line-height: 1; margin: 0; } @media screen and (max-width: 767px) { button.toggle-visibility-button { display: none; } .toggle-visibility-icon-button { display: inline-block; position: absolute; inset-block-start: 16px; inset-inline-end: calc(100% + 16px); } .zoom-buttons { inset-block-start: 72px; } }`;
28
28
 
29
29
  var __classPrivateFieldGet = (undefined && undefined.__classPrivateFieldGet) || function (receiver, state, kind, f) {
30
30
  if (kind === "a" && !f)