@iamproperty/components 7.7.1--beta13 → 7.7.1--beta15
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.
- package/assets/css/components/actionbar.component.css +1 -1
- package/assets/css/components/actionbar.component.css.map +1 -1
- package/assets/css/components/address-lookup.component.css +1 -1
- package/assets/css/components/address-lookup.component.css.map +1 -1
- package/assets/css/components/applied-filters.css +1 -1
- package/assets/css/components/applied-filters.css.map +1 -1
- package/assets/css/components/barchart.component.css +1 -1
- package/assets/css/components/barchart.component.css.map +1 -1
- package/assets/css/components/button.component.css +1 -0
- package/assets/css/components/button.component.css.map +1 -0
- package/assets/css/components/calendar.component.css +1 -1
- package/assets/css/components/calendar.component.css.map +1 -1
- package/assets/css/components/card.component.css +1 -1
- package/assets/css/components/card.component.css.map +1 -1
- package/assets/css/components/carousel.component.css +1 -1
- package/assets/css/components/carousel.component.css.map +1 -1
- package/assets/css/components/collapsible-side.css +1 -1
- package/assets/css/components/collapsible-side.css.map +1 -1
- package/assets/css/components/config.component.css +1 -1
- package/assets/css/components/config.component.css.map +1 -1
- package/assets/css/components/content.component.css +1 -1
- package/assets/css/components/content.component.css.map +1 -1
- package/assets/css/components/doughnutchart.component.css +1 -1
- package/assets/css/components/doughnutchart.component.css.map +1 -1
- package/assets/css/components/fileupload.css +1 -1
- package/assets/css/components/fileupload.css.map +1 -1
- package/assets/css/components/menu.component.css +1 -1
- package/assets/css/components/menu.component.css.map +1 -1
- package/assets/css/components/menu.global.css +1 -1
- package/assets/css/components/menu.global.css.map +1 -1
- package/assets/css/components/modal.component.css +1 -1
- package/assets/css/components/modal.component.css.map +1 -1
- package/assets/css/components/multi-step-modal.component.css +1 -1
- package/assets/css/components/multi-step-modal.component.css.map +1 -1
- package/assets/css/components/multiselect.css +1 -1
- package/assets/css/components/multiselect.css.map +1 -1
- package/assets/css/components/nav.component.css +1 -1
- package/assets/css/components/nav.component.css.map +1 -1
- package/assets/css/components/nav.global.css +1 -1
- package/assets/css/components/nav.global.css.map +1 -1
- package/assets/css/components/pagination.css +1 -1
- package/assets/css/components/pagination.css.map +1 -1
- package/assets/css/components/rank.component.css +1 -1
- package/assets/css/components/rank.component.css.map +1 -1
- package/assets/css/components/rankings.component.css +1 -1
- package/assets/css/components/rankings.component.css.map +1 -1
- package/assets/css/components/rankings.global.css +1 -1
- package/assets/css/components/rankings.global.css.map +1 -1
- package/assets/css/components/split-button.component.css +1 -1
- package/assets/css/components/split-button.component.css.map +1 -1
- package/assets/css/components/tabs.component.css +1 -1
- package/assets/css/components/tabs.component.css.map +1 -1
- package/assets/css/components/tabs.config.css +1 -1
- package/assets/css/components/tabs.config.css.map +1 -1
- package/assets/css/components/video-card.component.css +1 -1
- package/assets/css/components/video-card.component.css.map +1 -1
- package/assets/css/components/video-modal.component.css +1 -1
- package/assets/css/components/video-modal.component.css.map +1 -1
- package/assets/css/core.min.css +1 -1
- package/assets/css/core.min.css.map +1 -1
- package/assets/css/elements/badge-tag.css +1 -1
- package/assets/css/elements/badge-tag.css.map +1 -1
- package/assets/css/elements/buttons--special.css +1 -1
- package/assets/css/elements/buttons--special.css.map +1 -1
- package/assets/css/elements/buttons.css +1 -1
- package/assets/css/elements/buttons.css.map +1 -1
- package/assets/css/elements/type.css +1 -1
- package/assets/css/elements/type.css.map +1 -1
- package/assets/css/style.min.css +1 -1
- package/assets/css/style.min.css.map +1 -1
- package/assets/js/components/accordion/accordion.component.min.js +1 -1
- package/assets/js/components/actionbar/actionbar.component.min.js +3 -3
- package/assets/js/components/address-lookup/address-lookup.component.min.js +2 -2
- package/assets/js/components/advanced-select/advanced-select.component.min.js +1 -1
- package/assets/js/components/applied-filters/applied-filters.component.min.js +3 -3
- package/assets/js/components/barchart/barchart.component.min.js +2 -2
- package/assets/js/components/bento-grid/bento-grid.component.min.js +1 -1
- package/assets/js/components/button/button.component.js +49 -0
- package/assets/js/components/button/button.component.min.js +13 -0
- package/assets/js/components/button/button.component.min.js.map +1 -0
- package/assets/js/components/calendar/calendar.component.min.js +2 -2
- package/assets/js/components/card/card.component.min.js +3 -3
- package/assets/js/components/carousel/carousel.component.js +12 -1
- package/assets/js/components/carousel/carousel.component.min.js +4 -4
- package/assets/js/components/carousel/carousel.component.min.js.map +1 -1
- package/assets/js/components/collapsible-side/collapsible-side.component.min.js +2 -2
- package/assets/js/components/config/config.component.min.js +2 -2
- package/assets/js/components/content/content.component.js +9 -3
- package/assets/js/components/content/content.component.min.js +5 -7
- package/assets/js/components/content/content.component.min.js.map +1 -1
- package/assets/js/components/darkmode/darkmode.component.min.js +1 -1
- package/assets/js/components/doughnutchart/doughnutchart.component.min.js +2 -2
- package/assets/js/components/fileupload/fileupload.component.min.js +2 -2
- package/assets/js/components/filter-card/filter-card.component.min.js +1 -1
- package/assets/js/components/filterlist/filterlist.component.min.js +1 -1
- package/assets/js/components/form/form.component.min.js +1 -1
- package/assets/js/components/header/header.component.min.js +1 -1
- package/assets/js/components/inline-edit/inline-edit.component.min.js +1 -1
- package/assets/js/components/input/input.component.min.js +1 -1
- package/assets/js/components/input-range/input-range.component.min.js +1 -1
- package/assets/js/components/marketing/marketing.component.min.js +1 -1
- package/assets/js/components/menu/menu.component.min.js +4 -4
- package/assets/js/components/milestone/milestone.component.min.js +1 -1
- package/assets/js/components/milestone-group/milestone-group.component.min.js +1 -1
- package/assets/js/components/modal/modal.component.min.js +2 -2
- package/assets/js/components/multi-step/multi-step.component.min.js +1 -1
- package/assets/js/components/multi-step-modal/multi-step-modal.component.min.js +2 -2
- package/assets/js/components/multiselect/multiselect.component.min.js +2 -2
- package/assets/js/components/nav/nav.component.js +1 -1
- package/assets/js/components/nav/nav.component.min.js +4 -4
- package/assets/js/components/nav/nav.component.min.js.map +1 -1
- package/assets/js/components/notification/notification.component.min.js +1 -1
- package/assets/js/components/pagination/pagination.component.min.js +2 -2
- package/assets/js/components/password/password.component.min.js +1 -1
- package/assets/js/components/popover/popover.component.min.js +1 -1
- package/assets/js/components/rank/rank.component.min.js +1 -1
- package/assets/js/components/rankings/rankings.component.min.js +3 -3
- package/assets/js/components/rating/rating.component.min.js +1 -1
- package/assets/js/components/record-card/record-card.component.min.js +1 -1
- package/assets/js/components/search/search.component.js +1 -0
- package/assets/js/components/search/search.component.min.js +2 -2
- package/assets/js/components/search/search.component.min.js.map +1 -1
- package/assets/js/components/slider/slider.component.min.js +1 -1
- package/assets/js/components/split-button/split-button.component.min.js +4 -4
- package/assets/js/components/std-address-lookup/std-address-lookup.component.min.js +2 -2
- package/assets/js/components/std-nav/std-nav.component.js +137 -0
- package/assets/js/components/std-nav/std-nav.component.min.js +63 -0
- package/assets/js/components/std-nav/std-nav.component.min.js.map +1 -0
- package/assets/js/components/table/table.component.min.js +2 -2
- package/assets/js/components/table-ajax/table-ajax.component.min.js +2 -2
- package/assets/js/components/table-basic/table-basic.component.min.js +1 -1
- package/assets/js/components/table-no-submit/table-no-submit.component.min.js +2 -2
- package/assets/js/components/table-submit/table-submit.component.min.js +2 -2
- package/assets/js/components/tabs/tabs.component.min.js +4 -4
- package/assets/js/components/tabs/tabs.component.min.js.map +1 -1
- package/assets/js/components/tag/tag.component.min.js +1 -1
- package/assets/js/components/tooltip/tooltip.component.min.js +1 -1
- package/assets/js/components/video/video.component.min.js +1 -1
- package/assets/js/components/video-card/video-card.component.min.js +2 -2
- package/assets/js/components/video-modal/video-modal.component.min.js +5 -5
- package/assets/js/components/word-count/word-count.component.min.js +1 -1
- package/assets/js/modules/carousel.js +16 -0
- package/assets/js/modules/tabs.js +8 -1
- package/assets/js/scripts.bundle.js +1 -1
- package/assets/js/scripts.bundle.min.js +1 -1
- package/assets/sass/components/button.component.scss +5 -0
- package/assets/sass/components/menu.component.scss +5 -5
- package/assets/sass/components/menu.global.scss +7 -0
- package/assets/sass/components/nav.global.scss +2 -2
- package/assets/sass/components/tabs.config.scss +2 -2
- package/assets/sass/elements/badge-tag.css +4 -0
- package/assets/sass/elements/buttons--special.css +1 -1
- package/assets/sass/elements/type.css +10 -0
- package/assets/sass/foundations/colours.scss +0 -1
- package/assets/sass/foundations/root.scss +1 -1
- package/assets/ts/components/button/button.component.ts +66 -0
- package/assets/ts/components/carousel/carousel.component.ts +15 -0
- package/assets/ts/components/content/content.component.ts +15 -3
- package/assets/ts/components/nav/nav.component.ts +1 -1
- package/assets/ts/components/search/search.component.ts +1 -0
- package/assets/ts/components/std-nav/std-nav.component.ts +179 -0
- package/assets/ts/modules/carousel.ts +24 -0
- package/assets/ts/modules/tabs.ts +10 -1
- package/dist/components.es.js +26 -26
- package/dist/components.umd.js +213 -149
- package/package.json +1 -1
- package/src/components/Button/Button.vue +20 -0
- package/src/components/STDNav/STDNav.vue +22 -0
|
@@ -1,6 +1,12 @@
|
|
|
1
1
|
class iamContent extends HTMLElement {
|
|
2
2
|
constructor() {
|
|
3
3
|
super();
|
|
4
|
+
this.addTitle = (title) => {
|
|
5
|
+
if (this.hasAttribute('data-title-tag')) {
|
|
6
|
+
return `<${this.getAttribute('data-title-tag')} class="${this.getAttribute('data-title-class')}">${title}</${this.getAttribute('data-title-tag')}>`;
|
|
7
|
+
}
|
|
8
|
+
return '';
|
|
9
|
+
};
|
|
4
10
|
this.attachShadow({ mode: 'open' });
|
|
5
11
|
const assetLocation = document.body.hasAttribute('data-assets-location')
|
|
6
12
|
? document.body.getAttribute('data-assets-location')
|
|
@@ -13,9 +19,7 @@ class iamContent extends HTMLElement {
|
|
|
13
19
|
|
|
14
20
|
${this.hasAttribute('css') ? `@import "${this.getAttribute('css')}";` : ``}
|
|
15
21
|
</style>
|
|
16
|
-
<
|
|
17
|
-
<slot></slot>
|
|
18
|
-
</div>
|
|
22
|
+
<slot></slot>
|
|
19
23
|
`;
|
|
20
24
|
this.shadowRoot.appendChild(template.content.cloneNode(true));
|
|
21
25
|
}
|
|
@@ -23,6 +27,7 @@ class iamContent extends HTMLElement {
|
|
|
23
27
|
// eslint-disable-next-line @typescript-eslint/no-this-alias
|
|
24
28
|
const component = this;
|
|
25
29
|
const url = this.getAttribute('data-url');
|
|
30
|
+
const addTitle = this.addTitle;
|
|
26
31
|
const registerComponents = (contentComponent) => {
|
|
27
32
|
const components = ['card', 'marketing', 'notification'];
|
|
28
33
|
const assetLocation = document.body.hasAttribute('data-assets-location')
|
|
@@ -55,6 +60,7 @@ class iamContent extends HTMLElement {
|
|
|
55
60
|
newXHRRequest.onload = function () {
|
|
56
61
|
if (this.status === 200) {
|
|
57
62
|
const response = JSON.parse(this.responseText);
|
|
63
|
+
component.insertAdjacentHTML('beforebegin', addTitle(response.title.rendered));
|
|
58
64
|
component.innerHTML = `${response.content.rendered}`;
|
|
59
65
|
registerComponents(component);
|
|
60
66
|
}
|
|
@@ -1,15 +1,13 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* iamKey v7.7.1--
|
|
2
|
+
* iamKey v7.7.1--beta15
|
|
3
3
|
* Copyright 2022-2026 iamproperty
|
|
4
|
-
*/class
|
|
4
|
+
*/class d extends HTMLElement{constructor(){super(),this.addTitle=n=>this.hasAttribute("data-title-tag")?`<${this.getAttribute("data-title-tag")} class="${this.getAttribute("data-title-class")}">${n}</${this.getAttribute("data-title-tag")}>`:"",this.attachShadow({mode:"open"}),document.body.hasAttribute("data-assets-location")&&document.body.getAttribute("data-assets-location");const t=document.createElement("template");t.innerHTML=`
|
|
5
5
|
<style>
|
|
6
|
-
@layer elements{button{border-radius:0;text-transform:none;margin:0;font-family:inherit;font-size:inherit;line-height:inherit}button:focus:not(:focus-visible){outline:0}:is(button,[type=button],[type=reset],[type=submit],[role=button]){-webkit-appearance:button;&:not(:disabled){cursor:pointer}}.btn{--btn-margin: 1rem;--btn-padding-block: 0.75rem;--btn-padding-inline: 2.5rem;--btn-border-width: 2px;--btn-font-size: 1.125rem;--btn-line-height: 1.25rem;display:inline-block;font-weight:bold;text-align:left;text-decoration:none;vertical-align:middle;cursor:pointer;user-select:none;color:var(--colour-btn);font-size:var(--btn-font-size);line-height:var(--btn-line-height);padding:var(--btn-padding-block) var(--btn-padding-inline);border-radius:1.5rem;margin-bottom:var(--btn-margin);background:none;transition:border .5s,background .5s,color .5s;height:auto;max-width:fit-content;appearance:none;white-space:nowrap;&:not(.btn-secondary)[class*=colour-]{--colour-btn-bg: var(--colour);--colour-btn-border: var(--colour)}&:is(.colour-primary,.colour-dark,.colour-danger,.colour-black){--colour-btn: #fcfcfc}&:not(.border-0){background:var(--colour-btn-bg);border:var(--btn-border-width) solid var(--colour-btn-border)}&:not(:last-child){margin-right:var(--btn-margin)}}@media screen and (min-width: 36em){.btn{--btn-margin: 1.5rem}}a:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) .btn,.btn:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){outline:0;text-decoration:none;background:var(--colour-btn-bg-hover);color:var(--colour-btn-hover);border-radius:1.5rem}a:is(:active,.active):not([disabled]) .btn,.btn:is(:active,.active):not([disabled]){filter:brightness(85%);transition:background .1s,color .1s;color:var(--colour-btn);border-radius:1.5rem}a:disabled .btn,.btn:disabled,[disabled] .btn,.btn[disabled]{opacity:.4;cursor:not-allowed}.btn.btn-complete{--colour: var(--colour-success);--colour-btn-bg-hover: var(--colour);--colour-btn-border-hover: var(--colour);--colour-btn-hover: var(--colour-primary-theme);--colour-btn-bg: var(--colour);--colour-btn-border: var(--colour);position:relative;padding-left:3.5rem;padding-right:3.5rem}a:is(:hover,:focus,.hover):not([disabled],:active,.active) .btn.btn-complete,.btn.btn-complete:is(:hover,:focus,.hover):not([disabled],:active,.active){padding-left:2.5rem;padding-right:2.5rem;&:before{content:"\uF00C";font-family:"Font Awesome 7 Pro";margin-right:1rem;font-style:inherit;width:1rem;display:inline-block;height:var(--btn-line-height);vertical-align:bottom}}.btn.btn-sm{--btn-padding-block: 0.5rem;--btn-padding-inline: 2rem;--btn-margin: 0.5rem;--btn-font-size: 1rem}.btn{&[class*=fa-]:before{content:var(--fa);font-family:"Font Awesome 7 Pro"}&[class*=fa-after]{padding-right:4rem}&[class*=fa-after]:before{margin-right:0;margin-right:.375rem;position:absolute;right:1.5rem;top:50%;transform:translate(0, -50%)}&:not(.btn-compact):before{margin-right:1rem}i[class*=fa-]{--fa-width: 1em;font-family:"Font Awesome 7 Pro";margin-right:1rem;line-height:1em;font-style:inherit;&:not(:first-child){margin-left:1rem;margin-right:0}}}.btn.btn--prompt{&:after{content:"";height:var(--btn-line-height);width:1rem;display:inline-block;background:currentColor;mask-image:var(--icon-arrow);mask-size:100%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon-arrow);-webkit-mask-size:100%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%;vertical-align:bottom;margin-left:1rem}}a:is(:hover,:focus,.hover):not([disabled],:active,.active) .btn.btn--prompt,.btn.btn--prompt:is(:hover,:focus,.hover):not([disabled],:active,.active){&:after{margin-left:1.5rem;margin-right:-0.5rem}}.btn-filter{&:after{content:"\uF1DE";display:inline-block;margin-left:1em;margin-bottom:-0.15em;height:1em;width:1em;z-index:var(--index-focus);color:currentColor;font-weight:300;font-family:"Font Awesome 7 Pro"}}}@layer elements{.btn-secondary{color:var(--colour-btn-secondary);&:not(.border-0){background:var(--colour-btn-secondary-bg);border:2px solid var(--colour-btn-secondary-border)}}a:is(:hover,:focus,.hover,:active,.active):not([disabled]) .btn-secondary,.btn-secondary:is(:hover,:focus,.hover,:focus-within,:active,.active):not([disabled]){background:var(--colour-btn-secondary-bg-hover);color:var(--colour-btn-secondary-hover)}}@layer elements{.btn.btn-tertiary{background-color:transparent;border:none;color:var(--colour-link);margin:0 var(--btn-margin) var(--btn-margin) 0;padding:0;font-size:1.125rem;font-weight:normal;line-height:1.5rem;min-height:1.5rem;position:relative;&:after{position:absolute;content:"";top:100%;left:50%;height:2px;width:100%;transform:translate(-50%, 0);background:var(--colour-underline);transition:width .5s}&.text-decoration-none:after{width:0%}&[class*=fa-]{margin-left:0;margin-right:.5rem}&[class*=fa-]:not(:first-child){margin-left:.5rem;margin-right:0}&:is(:hover,:focus,.hover,:focus-within):not([disabled],:disabled,:active,.active){&:after{width:60% !important}}&:is(:active,.active):not([disabled],:disabled){color:var(--colour-active)}}}@layer elements{.btn-action{--btn-border-width: 1px;--btn-padding-block: 0.3125rem /* 5px */;--btn-padding-inline: 0.3125rem /* 5px */;--btn-margin: 0.5rem;border-radius:.25rem !important;font-weight:400 !important;font-size:1rem;line-height:1.25rem;&:not(.btn-primary){color:var(--colour-heading)}&:not(.btn-primary):not(.border-0){background-color:var(--colour-canvas-2);border:var(--btn-border-width) solid var(--colour-muted)}&.btn[class*=fa-]:before{content:var(--fa);margin-right:.375rem}&.icon-only{position:relative;text-indent:-300vw;overflow:hidden;min-width:1.75rem;&:before{position:absolute;left:0;top:0;min-width:1.75rem;text-align:center;text-indent:0;padding-inline:.25rem;line-height:1.85rem}}a:not(.btn-primary):is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) &,&:not(.btn-primary):is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){background:var(--colour-btn-action-hover-bg)}.btn-primary:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) &,&.btn-primary:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){filter:brightness(90%);background:var(--colour-btn-bg);border:var(--btn-border-width) solid var(--colour-btn-border);color:var(--colour-btn)}a:is(:active,.active):not([disabled]):not(.btn-primary) &,&:is(:active,.active):not([disabled]):not(.btn-primary){filter:brightness(85%);transition:all .1s;color:var(--colour-heading)}}.btn-action:not(.btn-compact).fa-compact-only:before{display:none !important}}@layer elements{.btn-compact{--compact-size: 3rem;padding:0 !important;margin-bottom:.5rem;text-align:center;width:var(--compact-size);min-width:var(--compact-size);max-width:var(--compact-size);height:var(--compact-size) !important;min-height:var(--compact-size) !important;max-height:var(--compact-size) !important;align-content:center;line-height:1 !important;text-indent:-500px;overflow:hidden;position:relative;font-size:1rem;&:not(:last-child){margin-right:.5rem}&:before{content:var(--fa);position:absolute;display:block;top:0;left:0;width:100%;height:100%;text-indent:0;line-height:calc(var(--compact-size) - .25rem);font-weight:900}[class*=fa-]:before{line-height:calc(var(--compact-size) - .25rem);@container style(--theme: dark){color:white}}&.btn-sm{--compact-size: 2.5rem;font-size:1rem;padding:0 !important}&.btn-action{--compact-size: 2rem;font-size:1rem;&:before{font-size:1em;font-weight:400}}&.btn-secondary{--colour-btn-bg: transparent;--colour-btn-border: transparent;border-color:transparent;&:not([class*=colour-]){--colour: var(--colour-light)}}&.btn-secondary:is(:hover,:focus,.hover,:active,.active,[aria-expanded],:focus-within):not([disabled]):not(.btn-collapse){background-color:var(--colour);color:var(--colour-primary-theme);border-color:var(--colour);&:is(.colour-primary,.colour-dark,.colour-danger,.colour-black){color:var(--colour-inverted)}}&[data-number]{position:relative}&[data-number]:after{content:attr(data-number);position:absolute;top:.5em;z-index:99;background:var(--colour-danger);height:1.5em;width:1.5em;border-radius:50%;text-indent:0;left:50%;font-size:.5em;line-height:1.5em;text-align:center;color:white;letter-spacing:-0.1em;font-family:arial,sans-serif}}.btn-compact{&:is(.fa-left,.fa-chevron-left,.fa-right,.fa-chevron-right,.fa-up,.fa-chevron-up,.fa-down,.fa-chevron-down,.fa-plus,.fa-bars,.fa-edit,.fa-envelope,.fa-calendar){--iso-display: block;--iso-font-size: 1.5rem;--iso-border-radius: 50%;--iso-text-indent: -500px}}@container style(--font-body){.btn-compact{font-size:var(--iso-font-size, 0.6rem) !important;text-indent:var(--iso-text-indent, 0px);white-space:initial;&:not(.btn-action){border-radius:var(--iso-border-radius, 0.25rem) !important}&:before{display:var(--iso-display, none);font-family:monospace !important;content:var(--iso) !important}}}@container style(--fa-font-regular){.btn-compact{text-indent:-500px;font-size:1rem !important;&:not(.btn-action){border-radius:50% !important}&:before{font-family:"Font Awesome 7 Pro" !important;content:var(--fa) !important;display:block}}}}@layer elements{.btn[popovertarget]{position:relative;anchor-name:--button2;&>.fa-chevron-down{display:none}&:not(:has(i)):after{content:"";display:inline-block;margin-right:.25em;margin-left:1em;height:.8em;width:.8em;z-index:var(--index-focus);background:currentColor;mask-image:var(--icon-arrow);mask-size:100%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon-arrow);-webkit-mask-size:100%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%;transform:rotate(90deg)}&[aria-pressed]:after{transform:rotate(270deg)}}.btn:has(select){position:relative;padding:0;max-width:fit-content;min-width:fit-content;width:fit-content;select{all:unset !important;padding:var(--btn-padding-block) var(--btn-padding-inline) !important;padding-right:calc(var(--btn-padding-inline) + 2rem) !important;border-radius:1.5rem !important;appearance:none !important;background:none !important;border:none !important;color:currentColor !important;display:block;outline:none;font-weight:inherit !important;font-size:var(--btn-font-size) !important;line-height:var(--btn-line-height) !important;field-sizing:content !important;appearance:base-select !important;option{font-size:1rem;text-align:left;color:var(--colour-primary);padding-inline:var(--menu-item-padding, 0.5rem);padding-block:var(--menu-item-padding, 0.5rem) !important;border-radius:.25rem !important;&:not(:last-child){margin:var(--menu-item-margin, 0 0 0.25rem 0) !important}&:hover{background:var(--colour-light) !important}&:after{content:attr(data-email)}}}select::picker-icon{display:none}select::picker(select){appearance:base-select;background:var(--menu-bg, canvas);margin-block:var(--menu-margin, 0.25rem);padding:var(--menu-padding, 0.5rem) !important;border:none !important;border-radius:.5rem;box-shadow:0px 2px 9px rgba(0, 0, 0, 0.1);font-size:1rem}hr{height:1px !important;background-color:var(--menu-hr-border-color, var(--border-color, grey)) !important;width:100%;margin:var(--menu-item-margin, 0 0 0.25rem 0) !important;padding:0 !important}select option::checkmark{display:none}select selectedcontent span{display:none}&:after{position:absolute;top:.625rem;right:1.5rem;content:"";height:1.5rem;width:1rem;display:inline-block;background:currentColor;mask-image:var(--icon-arrow);mask-size:100%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon-arrow);-webkit-mask-size:100%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%;vertical-align:bottom;margin-left:1rem;transform:rotate(90deg);pointer-events:none}}.btn-action:has(select){padding-block:0;padding-right:2rem;font-size:1em;select{margin:0rem 0rem !important;padding-right:2rem !important;margin-right:-2rem !important;font-size:1rem !important}&:after{top:.2rem;right:.5rem}}}@layer elements{.btn__group{display:flex;flex-direction:column;row-gap:var(--gap);reading-flow:source-order;margin-bottom:1.5rem;.btn-compact{max-width:fit-content;margin-inline:auto}}:where(.btn__group,iam-modal){reading-flow:source-order;.btn{margin-inline-end:0;width:100%;max-width:100%;text-align:center;white-space:normal;margin:0;&:not(:last-child){margin-right:0}}.btn-tertiary{max-width:fit-content;margin-block:0 !important;margin-inline:auto !important;order:3;reading-order:3}.btn-secondary{order:2;reading-order:2}.btn-primary{order:1;reading-order:1;margin:0;&:not(:last-child){margin:0}}}:is(iam-form,form) .btn__group{padding-top:1rem}@container (min-width: 36em){.btn__group{flex-direction:row;row-gap:0;gap:var(--gap);flex-wrap:wrap;.btn-tertiary{max-width:fit-content;margin-inline:0 !important;margin-block:auto;order:1}.btn-secondary{order:2}.btn-primary{order:3}.btn-compact{margin-inline:0;margin-block:auto}}:where(iam-modal,.btn__group){.btn{max-width:fit-content;white-space:nowrap;margin-block:auto}}.btn__group{.btn-tertiary{reading-order:1}.btn-secondary{reading-order:2}.btn-primary{reading-order:3}}iam-modal{.btn-tertiary{reading-order:3;order:1}.btn-secondary{order:2;reading-order:2}.btn-primary{order:3;reading-order:1}}.btn__group.text-end{justify-content:flex-end}:is(iam-form,form) .btn__group{justify-content:flex-end;padding-top:3rem}iam-modal .btn__group:last-child .btn,dialog .btn__group:last-child .btn{margin-bottom:0}}}*,*::before,*::after{box-sizing:border-box}:host{display:contents}::slotted(iam-marketing:first-child:last-child){margin-bottom:0;min-height:100%;min-width:100%}/*# sourceMappingURL=assets/css/components/content.component.css.map */
|
|
6
|
+
@layer elements{button{border-radius:0;text-transform:none;margin:0;font-family:inherit;font-size:inherit;line-height:inherit}button:focus:not(:focus-visible){outline:0}:is(button,[type=button],[type=reset],[type=submit],[role=button]){-webkit-appearance:button;&:not(:disabled){cursor:pointer}}.btn{--btn-margin: 1rem;--btn-padding-block: 0.75rem;--btn-padding-inline: 2.5rem;--btn-border-width: 2px;--btn-font-size: 1.125rem;--btn-line-height: 1.25rem;display:inline-block;font-weight:bold;text-align:left;text-decoration:none;vertical-align:middle;cursor:pointer;user-select:none;color:var(--colour-btn);font-size:var(--btn-font-size);line-height:var(--btn-line-height);padding:var(--btn-padding-block) var(--btn-padding-inline);border-radius:1.5rem;margin-bottom:var(--btn-margin);background:none;transition:border .5s,background .5s,color .5s;height:auto;max-width:fit-content;appearance:none;white-space:nowrap;&:not(.btn-secondary)[class*=colour-]{--colour-btn-bg: var(--colour);--colour-btn-border: var(--colour)}&:is(.colour-primary,.colour-dark,.colour-danger,.colour-black){--colour-btn: #fcfcfc}&:not(.border-0){background:var(--colour-btn-bg);border:var(--btn-border-width) solid var(--colour-btn-border)}&:not(:last-child){margin-right:var(--btn-margin)}}@media screen and (min-width: 36em){.btn{--btn-margin: 1.5rem}}a:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) .btn,.btn:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){outline:0;text-decoration:none;background:var(--colour-btn-bg-hover);color:var(--colour-btn-hover);border-radius:1.5rem}a:is(:active,.active):not([disabled]) .btn,.btn:is(:active,.active):not([disabled]){filter:brightness(85%);transition:background .1s,color .1s;color:var(--colour-btn);border-radius:1.5rem}a:disabled .btn,.btn:disabled,[disabled] .btn,.btn[disabled]{opacity:.4;cursor:not-allowed}.btn.btn-complete{--colour: var(--colour-success);--colour-btn-bg-hover: var(--colour);--colour-btn-border-hover: var(--colour);--colour-btn-hover: var(--colour-primary-theme);--colour-btn-bg: var(--colour);--colour-btn-border: var(--colour);position:relative;padding-left:3.5rem;padding-right:3.5rem}a:is(:hover,:focus,.hover):not([disabled],:active,.active) .btn.btn-complete,.btn.btn-complete:is(:hover,:focus,.hover):not([disabled],:active,.active){padding-left:2.5rem;padding-right:2.5rem;&:before{content:"\uF00C";font-family:"Font Awesome 7 Pro";margin-right:1rem;font-style:inherit;width:1rem;display:inline-block;height:var(--btn-line-height);vertical-align:bottom}}.btn.btn-sm{--btn-padding-block: 0.5rem;--btn-padding-inline: 2rem;--btn-margin: 0.5rem;--btn-font-size: 1rem}.btn{&[class*=fa-]:before{content:var(--fa);font-family:"Font Awesome 7 Pro"}&[class*=fa-after]{padding-right:4rem}&[class*=fa-after]:before{margin-right:0;margin-right:.375rem;position:absolute;right:1.5rem;top:50%;transform:translate(0, -50%)}&:not(.btn-compact):before{margin-right:1rem}i[class*=fa-]{--fa-width: 1em;font-family:"Font Awesome 7 Pro";margin-right:1rem;line-height:1em;font-style:inherit;&:not(:first-child){margin-left:1rem;margin-right:0}}}.btn.btn--prompt{&:after{content:"";height:var(--btn-line-height);width:1rem;display:inline-block;background:currentColor;mask-image:var(--icon-arrow);mask-size:100%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon-arrow);-webkit-mask-size:100%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%;vertical-align:bottom;margin-left:1rem}}a:is(:hover,:focus,.hover):not([disabled],:active,.active) .btn.btn--prompt,.btn.btn--prompt:is(:hover,:focus,.hover):not([disabled],:active,.active){&:after{margin-left:1.5rem;margin-right:-0.5rem}}.btn-filter{&:after{content:"\uF1DE";display:inline-block;margin-left:1em;margin-bottom:-0.15em;height:1em;width:1em;z-index:var(--index-focus);color:currentColor;font-weight:300;font-family:"Font Awesome 7 Pro"}}}@layer elements{.btn-secondary{color:var(--colour-btn-secondary);&:not(.border-0){background:var(--colour-btn-secondary-bg);border:2px solid var(--colour-btn-secondary-border)}}a:is(:hover,:focus,.hover,:active,.active):not([disabled]) .btn-secondary,.btn-secondary:is(:hover,:focus,.hover,:focus-within,:active,.active):not([disabled]){background:var(--colour-btn-secondary-bg-hover);color:var(--colour-btn-secondary-hover)}}@layer elements{.btn.btn-tertiary{background-color:transparent;border:none;color:var(--colour-link);margin:0 var(--btn-margin) var(--btn-margin) 0;padding:0;font-size:1.125rem;font-weight:normal;line-height:1.5rem;min-height:1.5rem;position:relative;&:after{position:absolute;content:"";top:100%;left:50%;height:2px;width:100%;transform:translate(-50%, 0);background:var(--colour-underline);transition:width .5s}&.text-decoration-none:after{width:0%}&[class*=fa-]{margin-left:0;margin-right:.5rem}&[class*=fa-]:not(:first-child){margin-left:.5rem;margin-right:0}&:is(:hover,:focus,.hover,:focus-within):not([disabled],:disabled,:active,.active){&:after{width:60% !important}}&:is(:active,.active):not([disabled],:disabled){color:var(--colour-active)}}}@layer elements{.btn-action{--btn-border-width: 1px;--btn-padding-block: 0.3125rem /* 5px */;--btn-padding-inline: 0.3125rem /* 5px */;--btn-margin: 0.5rem;border-radius:.25rem !important;font-weight:400 !important;font-size:1rem;line-height:1.25rem;&:not(.btn-primary){color:var(--colour-heading)}&:not(.btn-primary):not(.border-0){background-color:var(--colour-canvas-2);border:var(--btn-border-width) solid var(--colour-muted)}&.btn[class*=fa-]:before{content:var(--fa);margin-right:.375rem}&.icon-only{position:relative;text-indent:-300vw;overflow:hidden;min-width:1.75rem;&:before{position:absolute;left:0;top:0;min-width:1.75rem;text-align:center;text-indent:0;padding-inline:.25rem;line-height:1.85rem}}a:not(.btn-primary):is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) &,&:not(.btn-primary):is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){background:var(--colour-btn-action-hover-bg)}.btn-primary:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) &,&.btn-primary:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){filter:brightness(90%);background:var(--colour-btn-bg);border:var(--btn-border-width) solid var(--colour-btn-border);color:var(--colour-btn)}a:is(:active,.active):not([disabled]):not(.btn-primary) &,&:is(:active,.active):not([disabled]):not(.btn-primary){filter:brightness(85%);transition:all .1s;color:var(--colour-heading)}}.btn-action:not(.btn-compact).fa-compact-only:before{display:none !important}}@layer elements{.btn-compact{--compact-size: 3rem;padding:0 !important;margin-bottom:.5rem;text-align:center;width:var(--compact-size);min-width:var(--compact-size);max-width:var(--compact-size);height:var(--compact-size) !important;min-height:var(--compact-size) !important;max-height:var(--compact-size) !important;align-content:center;line-height:1 !important;text-indent:-500px;overflow:hidden;position:relative;font-size:1rem;&:not(:last-child){margin-right:.5rem}&:before{content:var(--fa);position:absolute;display:block;top:0;left:0;width:100%;height:100%;text-indent:0;line-height:calc(var(--compact-size) - .25rem);font-weight:900}[class*=fa-]:before{line-height:calc(var(--compact-size) - .25rem);@container style(--theme: dark){color:white}}&.btn-sm{--compact-size: 2.5rem;font-size:1rem;padding:0 !important}&.btn-action{--compact-size: 2rem;font-size:1rem;&:before{font-size:1em;font-weight:400}}&.btn-secondary{--colour-btn-bg: transparent;--colour-btn-border: transparent;border-color:transparent;&:not([class*=colour-]){--colour: var(--colour-light)}}&.btn-secondary:is(:hover,:focus,.hover,:active,.active,[aria-expanded],:focus-within):not([disabled]):not(.btn-collapse){background-color:var(--colour);color:var(--colour-primary-theme);border-color:var(--colour);&:is(.colour-primary,.colour-dark,.colour-danger,.colour-black){color:var(--colour-inverted)}}&[data-number]{position:relative}&[data-number]:after{content:attr(data-number);position:absolute;top:.5em;z-index:99;background:var(--colour-danger);height:1.5em;width:1.5em;border-radius:50%;text-indent:0;left:50%;font-size:.5em;line-height:1.5em;text-align:center;color:white;letter-spacing:-0.1em;font-family:arial,sans-serif}}.btn-compact{&:is(.fa-left,.fa-chevron-left,.fa-right,.fa-chevron-right,.fa-up,.fa-chevron-up,.fa-down,.fa-chevron-down,.fa-plus,.fa-bars,.fa-edit,.fa-envelope,.fa-calendar){--iso-display: block;--iso-font-size: 1.5rem;--iso-border-radius: 50%;--iso-text-indent: -500px}}@container style(--font-body){.btn-compact{font-size:var(--iso-font-size, 0.6rem) !important;text-indent:var(--iso-text-indent, 0px);white-space:initial;&:not(.btn-action){border-radius:var(--iso-border-radius, 0.25rem) !important}&:before{display:var(--iso-display, none);font-family:monospace !important;content:var(--iso) !important}}}@container style(--fa-font-regular){.btn-compact{text-indent:-500px;font-size:1rem !important;&:not(.btn-action){border-radius:50% !important}&:before{font-family:"Font Awesome 7 Pro" !important;content:var(--fa) !important;display:block}}}}@layer elements{.btn[popovertarget]{position:relative;anchor-name:--button2;&>.fa-chevron-down{display:none}&:not(:has(i)):not(.no-icon):after{content:"";display:inline-block;margin-right:.25em;margin-left:1em;height:.8em;width:.8em;z-index:var(--index-focus);background:currentColor;mask-image:var(--icon-arrow);mask-size:100%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon-arrow);-webkit-mask-size:100%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%;transform:rotate(90deg)}&[aria-pressed]:after{transform:rotate(270deg)}}.btn:has(select){position:relative;padding:0;max-width:fit-content;min-width:fit-content;width:fit-content;select{all:unset !important;padding:var(--btn-padding-block) var(--btn-padding-inline) !important;padding-right:calc(var(--btn-padding-inline) + 2rem) !important;border-radius:1.5rem !important;appearance:none !important;background:none !important;border:none !important;color:currentColor !important;display:block;outline:none;font-weight:inherit !important;font-size:var(--btn-font-size) !important;line-height:var(--btn-line-height) !important;field-sizing:content !important;appearance:base-select !important;option{font-size:1rem;text-align:left;color:var(--colour-primary);padding-inline:var(--menu-item-padding, 0.5rem);padding-block:var(--menu-item-padding, 0.5rem) !important;border-radius:.25rem !important;&:not(:last-child){margin:var(--menu-item-margin, 0 0 0.25rem 0) !important}&:hover{background:var(--colour-light) !important}&:after{content:attr(data-email)}}}select::picker-icon{display:none}select::picker(select){appearance:base-select;background:var(--menu-bg, canvas);margin-block:var(--menu-margin, 0.25rem);padding:var(--menu-padding, 0.5rem) !important;border:none !important;border-radius:.5rem;box-shadow:0px 2px 9px rgba(0, 0, 0, 0.1);font-size:1rem}hr{height:1px !important;background-color:var(--menu-hr-border-color, var(--border-color, grey)) !important;width:100%;margin:var(--menu-item-margin, 0 0 0.25rem 0) !important;padding:0 !important}select option::checkmark{display:none}select selectedcontent span{display:none}&:after{position:absolute;top:.625rem;right:1.5rem;content:"";height:1.5rem;width:1rem;display:inline-block;background:currentColor;mask-image:var(--icon-arrow);mask-size:100%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon-arrow);-webkit-mask-size:100%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%;vertical-align:bottom;margin-left:1rem;transform:rotate(90deg);pointer-events:none}}.btn-action:has(select){padding-block:0;padding-right:2rem;font-size:1em;select{margin:0rem 0rem !important;padding-right:2rem !important;margin-right:-2rem !important;font-size:1rem !important}&:after{top:.2rem;right:.5rem}}}@layer elements{.btn__group{display:flex;flex-direction:column;row-gap:var(--gap);reading-flow:source-order;margin-bottom:1.5rem;.btn-compact{max-width:fit-content;margin-inline:auto}}:where(.btn__group,iam-modal){reading-flow:source-order;.btn{margin-inline-end:0;width:100%;max-width:100%;text-align:center;white-space:normal;margin:0;&:not(:last-child){margin-right:0}}.btn-tertiary{max-width:fit-content;margin-block:0 !important;margin-inline:auto !important;order:3;reading-order:3}.btn-secondary{order:2;reading-order:2}.btn-primary{order:1;reading-order:1;margin:0;&:not(:last-child){margin:0}}}:is(iam-form,form) .btn__group{padding-top:1rem}@container (min-width: 36em){.btn__group{flex-direction:row;row-gap:0;gap:var(--gap);flex-wrap:wrap;.btn-tertiary{max-width:fit-content;margin-inline:0 !important;margin-block:auto;order:1}.btn-secondary{order:2}.btn-primary{order:3}.btn-compact{margin-inline:0;margin-block:auto}}:where(iam-modal,.btn__group){.btn{max-width:fit-content;white-space:nowrap;margin-block:auto}}.btn__group{.btn-tertiary{reading-order:1}.btn-secondary{reading-order:2}.btn-primary{reading-order:3}}iam-modal{.btn-tertiary{reading-order:3;order:1}.btn-secondary{order:2;reading-order:2}.btn-primary{order:3;reading-order:1}}.btn__group.text-end{justify-content:flex-end}:is(iam-form,form) .btn__group{justify-content:flex-end;padding-top:3rem}iam-modal .btn__group:last-child .btn,dialog .btn__group:last-child .btn{margin-bottom:0}}}*,*::before,*::after{box-sizing:border-box}:host{display:contents}::slotted(iam-marketing:first-child:last-child){margin-bottom:0;min-height:100%;min-width:100%}/*# sourceMappingURL=assets/css/components/content.component.css.map */
|
|
7
7
|
|
|
8
8
|
|
|
9
9
|
${this.hasAttribute("css")?`@import "${this.getAttribute("css")}";`:""}
|
|
10
10
|
</style>
|
|
11
|
-
<
|
|
12
|
-
|
|
13
|
-
</div>
|
|
14
|
-
`,this.shadowRoot.appendChild(r.content.cloneNode(!0))}connectedCallback(){const r=this,i=this.getAttribute("data-url"),a=o=>{const n=["card","marketing","notification"],c=document.body.hasAttribute("data-assets-location")?document.body.getAttribute("data-assets-location"):"/assets";n.forEach(t=>{t=="notification"&&document.querySelectorAll("[data-notification]").forEach(e=>{e.outerHTML=e.outerHTML.replace(/<div/g,"<iam-notification").replace(/<\/div>/g,"</iam-notification>")}),o.getElementsByTagName(`iam-${t}`).length!==0&&import(`${c}/js/components/${t}/${t}.component.js`).then(e=>{window.customElements.get(`iam-${t}`)||window.customElements.define(`iam-${t}`,e.default)}).catch(e=>{console.log(e.message)})})};if(i){const o=new XMLHttpRequest;o.open("GET",i,!0),o.onload=function(){if(this.status===200){const n=JSON.parse(this.responseText);r.innerHTML=`${n.content.rendered}`,a(r)}},o.send()}}}export{s as default};
|
|
11
|
+
<slot></slot>
|
|
12
|
+
`,this.shadowRoot.appendChild(t.content.cloneNode(!0))}connectedCallback(){const t=this,n=this.getAttribute("data-url"),a=this.addTitle,s=o=>{const i=["card","marketing","notification"],c=document.body.hasAttribute("data-assets-location")?document.body.getAttribute("data-assets-location"):"/assets";i.forEach(e=>{e=="notification"&&document.querySelectorAll("[data-notification]").forEach(r=>{r.outerHTML=r.outerHTML.replace(/<div/g,"<iam-notification").replace(/<\/div>/g,"</iam-notification>")}),o.getElementsByTagName(`iam-${e}`).length!==0&&import(`${c}/js/components/${e}/${e}.component.js`).then(r=>{window.customElements.get(`iam-${e}`)||window.customElements.define(`iam-${e}`,r.default)}).catch(r=>{console.log(r.message)})})};if(n){const o=new XMLHttpRequest;o.open("GET",n,!0),o.onload=function(){if(this.status===200){const i=JSON.parse(this.responseText);t.insertAdjacentHTML("beforebegin",a(i.title.rendered)),t.innerHTML=`${i.content.rendered}`,s(t)}},o.send()}}}export{d as default};
|
|
15
13
|
//# sourceMappingURL=content.component.min.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"content.component.min.js","sources":["content.component.js"],"sourcesContent":["class iamContent extends HTMLElement {\n constructor() {\n super();\n this.attachShadow({ mode: 'open' });\n const assetLocation = document.body.hasAttribute('data-assets-location')\n ? document.body.getAttribute('data-assets-location')\n : '/assets';\n const loadCSS = `@import \"${assetLocation}/css/components/content.component.css\";`;\n const template = document.createElement('template');\n template.innerHTML = `\n <style>\n ${loadCSS}\n\n ${this.hasAttribute('css') ? `@import \"${this.getAttribute('css')}\";` : ``}\n </style>\n <
|
|
1
|
+
{"version":3,"file":"content.component.min.js","sources":["content.component.js"],"sourcesContent":["class iamContent extends HTMLElement {\n constructor() {\n super();\n this.addTitle = (title) => {\n if (this.hasAttribute('data-title-tag')) {\n return `<${this.getAttribute('data-title-tag')} class=\"${this.getAttribute('data-title-class')}\">${title}</${this.getAttribute('data-title-tag')}>`;\n }\n return '';\n };\n this.attachShadow({ mode: 'open' });\n const assetLocation = document.body.hasAttribute('data-assets-location')\n ? document.body.getAttribute('data-assets-location')\n : '/assets';\n const loadCSS = `@import \"${assetLocation}/css/components/content.component.css\";`;\n const template = document.createElement('template');\n template.innerHTML = `\n <style>\n ${loadCSS}\n\n ${this.hasAttribute('css') ? `@import \"${this.getAttribute('css')}\";` : ``}\n </style>\n <slot></slot>\n `;\n this.shadowRoot.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n // eslint-disable-next-line @typescript-eslint/no-this-alias\n const component = this;\n const url = this.getAttribute('data-url');\n const addTitle = this.addTitle;\n const registerComponents = (contentComponent) => {\n const components = ['card', 'marketing', 'notification'];\n const assetLocation = document.body.hasAttribute('data-assets-location')\n ? document.body.getAttribute('data-assets-location')\n : '/assets';\n // Load components - Each component will load once the first of its type has been loaded\n components.forEach((component) => {\n if (component == 'notification') {\n document.querySelectorAll('[data-notification]').forEach((element) => {\n element.outerHTML = element.outerHTML\n .replace(/<div/g, '<iam-notification')\n .replace(/<\\/div>/g, '</iam-notification>');\n });\n }\n if (contentComponent.getElementsByTagName(`iam-${component}`).length === 0)\n return;\n import(/* @vite-ignore */ `${assetLocation}/js/components/${component}/${component}.component.js`)\n .then((module) => {\n if (!window.customElements.get(`iam-${component}`))\n window.customElements.define(`iam-${component}`, module.default);\n })\n .catch((err) => {\n console.log(err.message);\n });\n });\n };\n if (url) {\n const newXHRRequest = new XMLHttpRequest();\n newXHRRequest.open('GET', url, true);\n newXHRRequest.onload = function () {\n if (this.status === 200) {\n const response = JSON.parse(this.responseText);\n component.insertAdjacentHTML('beforebegin', addTitle(response.title.rendered));\n component.innerHTML = `${response.content.rendered}`;\n registerComponents(component);\n }\n };\n newXHRRequest.send();\n }\n }\n}\nexport default iamContent;\n"],"names":["iamContent","title","template","component","url","addTitle","registerComponents","contentComponent","components","assetLocation","element","module","err","newXHRRequest","response"],"mappings":";;;IAAA,MAAMA,UAAmB,WAAY,CACjC,aAAc,CACV,MAAK,EACL,KAAK,SAAYC,GACT,KAAK,aAAa,gBAAgB,EAC3B,IAAI,KAAK,aAAa,gBAAgB,CAAC,WAAW,KAAK,aAAa,kBAAkB,CAAC,KAAKA,CAAK,KAAK,KAAK,aAAa,gBAAgB,CAAC,IAE7I,GAEX,KAAK,aAAa,CAAE,KAAM,MAAM,CAAE,EACZ,SAAS,KAAK,aAAa,sBAAsB,GACjE,SAAS,KAAK,aAAa,sBAAsB,EAGvD,MAAMC,EAAW,SAAS,cAAc,UAAU,EAClDA,EAAS,UAAY;AAAA;AAAA;AAAA;AAAA;AAAA,MAIvB,KAAK,aAAa,KAAK,EAAI,YAAY,KAAK,aAAa,KAAK,CAAC,KAAO,EAAE;AAAA;AAAA;AAAA,MAItE,KAAK,WAAW,YAAYA,EAAS,QAAQ,UAAU,EAAI,CAAC,CAChE,CACA,mBAAoB,CAEhB,MAAMC,EAAY,KACZC,EAAM,KAAK,aAAa,UAAU,EAClCC,EAAW,KAAK,SAChBC,EAAsBC,GAAqB,CAC7C,MAAMC,EAAa,CAAC,OAAQ,YAAa,cAAc,EACjDC,EAAgB,SAAS,KAAK,aAAa,sBAAsB,EACjE,SAAS,KAAK,aAAa,sBAAsB,EACjD,UAEND,EAAW,QAASL,GAAc,CAC1BA,GAAa,gBACb,SAAS,iBAAiB,qBAAqB,EAAE,QAASO,GAAY,CAClEA,EAAQ,UAAYA,EAAQ,UACvB,QAAQ,QAAS,mBAAmB,EACpC,QAAQ,WAAY,qBAAqB,CAClD,CAAC,EAEDH,EAAiB,qBAAqB,OAAOJ,CAAS,EAAE,EAAE,SAAW,GAEzE,OAA0B,GAAGM,CAAa,kBAAkBN,CAAS,IAAIA,CAAS,iBAC7E,KAAMQ,GAAW,CACb,OAAO,eAAe,IAAI,OAAOR,CAAS,EAAE,GAC7C,OAAO,eAAe,OAAO,OAAOA,CAAS,GAAIQ,EAAO,OAAO,CACvE,CAAC,EACI,MAAOC,GAAQ,CAChB,QAAQ,IAAIA,EAAI,OAAO,CAC3B,CAAC,CACL,CAAC,CACL,EACA,GAAIR,EAAK,CACL,MAAMS,EAAgB,IAAI,eAC1BA,EAAc,KAAK,MAAOT,EAAK,EAAI,EACnCS,EAAc,OAAS,UAAY,CAC/B,GAAI,KAAK,SAAW,IAAK,CACrB,MAAMC,EAAW,KAAK,MAAM,KAAK,YAAY,EAC7CX,EAAU,mBAAmB,cAAeE,EAASS,EAAS,MAAM,QAAQ,CAAC,EAC7EX,EAAU,UAAY,GAAGW,EAAS,QAAQ,QAAQ,GAClDR,EAAmBH,CAAS,CAChC,CACJ,EACAU,EAAc,KAAI,CACtB,CACJ,CACJ"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* iamKey v7.7.1--
|
|
2
|
+
* iamKey v7.7.1--beta15
|
|
3
3
|
* Copyright 2022-2026 iamproperty
|
|
4
4
|
*/window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"Dark mode button"});class i extends HTMLElement{constructor(){var e;super(),this.attachShadow({mode:"open"}),document.body.hasAttribute("data-assets-location")&&document.body.getAttribute("data-assets-location");const o=document.createElement("template");o.innerHTML=`
|
|
5
5
|
<style>::slotted(.toggle):after{--icon: var(--icon-light);background:red;mask-image:var(--icon);mask-size:100%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon);-webkit-mask-size:100%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%;z-index:2}::slotted(.toggle.dark-theme):after{--icon: var(--icon-dark)}/*# sourceMappingURL=assets/css/components/darkmode.component.css.map */
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* iamKey v7.7.1--
|
|
2
|
+
* iamKey v7.7.1--beta15
|
|
3
3
|
* Copyright 2022-2026 iamproperty
|
|
4
4
|
*/const L=t=>t.charAt(0).toUpperCase()+t.slice(1),q=t=>t.replace(/_/g," "),R=(t,r)=>{for(let a=1;a<=10;a++){if(t.hasAttribute(`data-colour-${a}`)){const c=t.getAttribute(`data-colour-${a}`);t.style.setProperty(`--chart-colour-${a}`,`var(--chart-colour-${c})`),t.style.setProperty(`--chart-colour-${a}-hover`,`var(--chart-colour-${c}-hover)`)}Array.from(r.querySelectorAll(`[data-colour-${a}]`)).forEach(c=>{const e=c.getAttribute(`data-colour-${a}`);c.style.setProperty(`--chart-colour-${a}`,`var(--chart-colour-${e})`),c.style.setProperty(`--chart-colour-${a}-hover`,`var(--chart-colour-${e}-hover)`)})}return!0},w=(t,r,a)=>{if(t.tagName=="IAM-DOUGHNUTCHART")return N(t,r,a),!0;const c=r.querySelector(".chart__key");c.innerHTML="";const e=r.querySelector(".chart__guidelines");e.innerHTML="";const i=r.querySelector(".chart__yaxis");i.innerHTML="",Array.from(r.querySelectorAll(':scope > input[type="checkbox"],:scope > input[type="radio"]')).map(n=>{n.remove()});const{xaxis:o}=v(t);return A(t,a),T(r,a,c),I(t,e),X(t,i),o&&K(r),!0},N=(t,r,a)=>{const c=r.querySelector(".chart__key");return c.innerHTML="",Array.from(r.querySelectorAll(':scope > input[type="checkbox"],:scope > input[type="radio"]')).map(e=>{e.remove()}),A(t,a),T(r,a,c),H(r),!0},j=function(t,r){const a=r.querySelector(".chart");a.addEventListener("mousemove",o=>{if(o&&o.target instanceof HTMLElement&&o.target.closest("td:not(:first-child")){const l=o.target.closest("td:not(:first-child").getBoundingClientRect(),d=o.clientX-l.left,h=o.clientY-l.top;a.setAttribute("style",`--cursor-x: ${d}px; --cursor-y: ${h}px;`)}});const c=r.querySelectorAll("label");Array.from(c).forEach(o=>{r.querySelector(`input#${o.getAttribute("for")}`).checked?o.setAttribute("part","key-checked"):o.setAttribute("part","key-unchecked")});const e=t.querySelector("table"),i=r.querySelector("table");r.addEventListener("change",function(o){const n=o.target,l=new CustomEvent("view-change",{detail:{"data-dataset":n.getAttribute("data-dataset"),label:n.getAttribute("data-label"),checked:n.checked}});t.dispatchEvent(l),Array.from(c).forEach(d=>{var h;!((h=r.querySelector(`input#${d.getAttribute("for")}`))===null||h===void 0)&&h.checked?d.setAttribute("part","key-checked"):d.setAttribute("part","key-unchecked")}),i.innerHTML=e.innerHTML,A(t,i),t.tagName=="IAM-DOUGHNUTCHART"&&H(r)})},B=function(t,r){const a=t.querySelector("table"),c=r.querySelector("table"),e=(l,d)=>{d.disconnect(),n.disconnect();for(const h of l)(h.attributeName=="class"||h.type==="attributes"||h.type==="attributes")&&(c.innerHTML=a.innerHTML,w(t,r,c));d.observe(a,{characterData:!0,subtree:!0}),n.observe(t,{attributes:!0})},i=(l,d)=>{d.disconnect(),n.disconnect();for(const h of l)(h.type=="characterData"||h.type=="childList"&&h.addedNodes.length)&&(c.innerHTML=a.innerHTML,w(t,r,c));d.observe(a,{characterData:!0,subtree:!0}),n.observe(t,{attributes:!0})},o=new MutationObserver(i),n=new MutationObserver(e);return o.observe(a,{characterData:!0,subtree:!0}),n.observe(t,{attributes:!0}),!0};function C(t,r){r>1&&(t=t-.25);const a=Math.cos(2*Math.PI*t),c=Math.sin(2*Math.PI*t);return[a*100,c*100]}const v=function(t){const r=t.shadowRoot.querySelector(".chart__wrapper table"),a=t.hasAttribute("data-min")?t.getAttribute("data-min"):0,c=t.hasAttribute("data-max")?t.getAttribute("data-max"):U(t,r),e=t.hasAttribute("data-yaxis")?t.getAttribute("data-yaxis").split(","):[],i=t.hasAttribute("data-guidelines")?t.getAttribute("data-guidelines").split(","):[],o=t.hasAttribute("data-xaxis")?t.getAttribute("data-xaxis").split(","):null;return{min:a,max:c,yaxis:e,xaxis:o,guidelines:i}};function U(t,r){const a=t.classList.contains("chart--stacked")?"tbody tr":"tbody td:not(:first-child)",c=Array.from(r.querySelectorAll(a)).map(i=>i.getAttribute("data-numeric")),e=Math.max(...c);return Math.ceil(e)}const x=function(t,r,a,c){let e=String(t);e=e.replace("\xA3",""),e=e.replace("%",""),e=e.replace(",",""),e=Number.parseFloat(e);let i=(e-r)/(a-r)*100,o=i,n=0;return c&&c!=0&&(n=(c-r)/(a-r)*100),r<0&&(n=Math.abs(r/(a-r)*100),e<0?(i=n-i,n=n-i,o=n):(i=i-n,o=i+n)),{percent:i,axis:o,bottom:n}},A=function(t,r){Array.from(r.querySelectorAll("tbody tr")).forEach(e=>{let i=0;Array.from(e.querySelectorAll("td:not(:first-child)")).forEach(o=>{const n=o.cloneNode(!0);Array.from(n.querySelectorAll("*")).forEach(h=>{h.remove()});const l=parseFloat(n.textContent.replace("\xA3","").replace("%","").replace(",",""));o.setAttribute("data-numeric",l),o.setAttribute("data-value",n.textContent),getComputedStyle(o).display!="none"&&(i+=l),Array.from(o.querySelectorAll("a, button")).forEach((h,b)=>{b==0&&h.insertAdjacentHTML("beforeBegin","<hr/>"),h.classList.add("btn"),h.classList.add("btn-tertiary")})}),e.setAttribute("data-numeric",i)});const{min:a,max:c}=v(t);Array.from(r.querySelectorAll("tbody tr")).forEach((e,i)=>{const o=e.querySelector("td:first-child, th:first-child")?e.querySelector("td:first-child, th:first-child").textContent:"";e.setAttribute("part","group");const n=(e.getAttribute("data-numeric")-a)/(c-a)*100;e.style.setProperty("--percent",`${n}%`),Array.from(e.querySelectorAll("td:not([data-label])")).forEach((h,b)=>{b==0?h.setAttribute("part","xaxis-label"):h.setAttribute("part","value"),e.querySelectorAll("td").length>2&&h.setAttribute("data-label",r.querySelectorAll("thead th")[b].textContent)});const l=e.hasAttribute("data-min")?e.getAttribute("data-min"):a,d=e.hasAttribute("data-max")?e.getAttribute("data-max"):c;if(l<0){const h=Math.abs(l/(d-l)*100);t.setAttribute("style",`--min-bottom: ${h}%;`)}e.style.setProperty("--row-index",i+1),Array.from(e.querySelectorAll('td[data-numeric]:not([data-label="Min"]):not([data-label="Max"]):not(:first-child)')).forEach(h=>{if(getComputedStyle(h).display=="none")return;const g=h.innerHTML,_=Number.parseFloat(h.getAttribute("data-numeric")),s=Number.parseFloat(h.getAttribute("data-start"));if(h.querySelector("span[data-group]")||(h.innerHTML=`<span data-group="${o}" ${h.hasAttribute("data-label")?`data-label="${h.getAttribute("data-label")}"`:""} part="popover">${g}</span>`),!h.hasAttribute("style")){const{percent:m,bottom:y,axis:p}=x(_,l,d,s);h.setAttribute("data-percent",m),h.setAttribute("style",`--bottom:${y}%;--percent:${m}%;--axis:${p}%;`)}})})},T=function(t,r,a){const c=`chart-${Date.now()+(Math.floor(Math.random()*100)+1)}`;let e;const i=Array.from(r.querySelectorAll("thead th"));return i.forEach((o,n)=>{n!=0&&(e=V(c,n,o.textContent,a,t,e)),n==50&&(i.length=n+1)}),!0};function V(t,r,a,c,e,i){var o;const n=document.createElement("input");n.setAttribute("name",`${t}-dataset-${r}`),n.setAttribute("id",`${t}-dataset-${r}`),n.setAttribute("data-dataset",`${r}`),n.setAttribute("data-label",`${a}`),n.checked=!0,n.setAttribute("type","checkbox"),r==1?e.prepend(n):e.insertBefore(n,i.nextSibling),i=n;const l=document.createElement("label");l.setAttribute("class","key btn btn-action"),l.setAttribute("for",`${t}-dataset-${r}`),l.setAttribute("data-label",`${a}`),l.setAttribute("part","key");const d=(o=e.querySelector(`tbody tr td:nth-child(${r+1})`))===null||o===void 0?void 0:o.getAttribute("data-numeric");return l.setAttribute("data-numeric",d),l.innerHTML=`${a}`,c.append(l),i}const I=function(t,r){const{min:a,max:c,yaxis:e}=v(t);let{guidelines:i}=v(t);i.length||(i=e),r.innerHTML="";for(let o=0;o<i.length;o++){const n=parseFloat(i[o].replace("\xA3","").replace("%","").replace(",","")),{axis:l}=x(n,a,c);r.innerHTML+=`<div class="guideline" style="--percent:${l}%;">${e.indexOf(i[o])!=-1?`<span>${i[o]}</span>`:""}</div>`}},X=function(t,r){const{min:a,max:c,yaxis:e}=v(t);r.innerHTML="";for(let i=0;i<e.length;i++){const o=parseFloat(e[i].replace("\xA3","").replace("%","")),{axis:n}=x(o,a,c);r.innerHTML+=`<div class="axis__point" style="--percent:${n}%;"><span>${e[i]}</span></div>`}},K=function(t){const r=t.querySelector(".chart");let a=t.querySelector(".chart__xaxis");a||(a=document.createElement("div"),a.setAttribute("class","chart__xaxis")),r.prepend(a)},H=function(t){let r="";const a=t.querySelector(".chart");let c=t.querySelector(".doughnuts");c||(c=document.createElement("div"),c.setAttribute("class","doughnuts"),a.append(c)),Array.from(a.querySelectorAll("tbody tr")).forEach((e,i)=>{let o="",n="",l=0,d=0;const b=e.querySelectorAll("td")[0].innerHTML;let g=0;const _=e.getAttribute("data-numeric");Array.from(e.querySelectorAll("td")).forEach((s,m)=>{const y=getComputedStyle(s).display;if(m!=0&&y!="none"){let p=s.getAttribute("data-numeric");p=p.replace("\xA3",""),p=p.replace("%",""),p=p.replace(",",""),p=Number.parseInt(p),d+=p,g++}}),Array.from(e.querySelectorAll("td")).forEach((s,m)=>{var y,p;const f=getComputedStyle(s).display;if(m!=0&&g==1&&f!="none")o+=`<path d="M 0 0 L 100 0 A 100 100 0 1 1 100 -0.01 L 0 0" style="${s.getAttribute("style")} --path-index: ${m};"></path>`,n+=`<span class="h5 mb-0" part="popover">${L(q(s.getAttribute("data-label"))).trim()}<br/>${s.hasAttribute("data-second")?`${s.getAttribute("data-second-label")}: ${s.getAttribute("data-second")}<br/>`:""}${(y=s.querySelector('[part="popover"]'))===null||y===void 0?void 0:y.innerHTML}</span>`;else if(m!=0){let u=s.getAttribute("data-numeric");const F=f=="none"?"display: none;":"";u=u.replace("\xA3",""),u=u.replace("%",""),u=u.replace(",",""),u=Number.parseInt(u);const k=u/d,[$,z]=C(l,g),[S,M]=C(l+k,g),P=k>.5?1:0,D=["M 0 0",`L ${$?$.toFixed(0):0} ${z?z.toFixed(0):0}`,`A 100 100 0 ${P} 1 ${S?S.toFixed(0):0} ${M?M.toFixed(0):0}`,"L 0 0"].join(" ");o+=`<path d="${D}" style="${s.getAttribute("style")} --path-index: ${m};${F}"></path>`,n+=`<span class="h5 mb-0" part="popover">${L(q(s.getAttribute("data-label"))).trim()}<br/>${s.hasAttribute("data-second")?`${s.getAttribute("data-second-label")}: ${s.getAttribute("data-second")}<br/>`:""}${(p=s.querySelector('[part="popover"]'))===null||p===void 0?void 0:p.innerHTML}</span>`,f!="none"&&(l+=k)}}),r+=`<div class="doughnut">
|
|
5
5
|
<svg viewBox="-105 -105 210 210" preserveAspectRatio="none" style="--row-index: ${i+1};">${o}</svg>
|
|
@@ -9,7 +9,7 @@
|
|
|
9
9
|
<style>
|
|
10
10
|
${this.hasAttribute("css")?`@import "${this.getAttribute("css")}";`:""}
|
|
11
11
|
|
|
12
|
-
.chart__key .key:nth-child(11n-10),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-9){--chart-colour: var(--chart-colour-1)}.chart__outer table tbody tr:nth-child(1):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-1)}.chart__key .key:nth-child(11n-9),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-8){--chart-colour: var(--chart-colour-2)}.chart__outer table tbody tr:nth-child(2):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-2)}.chart__key .key:nth-child(11n-8),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-7){--chart-colour: var(--chart-colour-3)}.chart__outer table tbody tr:nth-child(3):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-3)}.chart__key .key:nth-child(11n-7),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-6){--chart-colour: var(--chart-colour-4)}.chart__outer table tbody tr:nth-child(4):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-4)}.chart__key .key:nth-child(11n-6),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-5){--chart-colour: var(--chart-colour-5)}.chart__outer table tbody tr:nth-child(5):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-5)}.chart__key .key:nth-child(11n-5),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-4){--chart-colour: var(--chart-colour-6)}.chart__outer table tbody tr:nth-child(6):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-6)}.chart__key .key:nth-child(11n-4),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-3){--chart-colour: var(--chart-colour-7)}.chart__outer table tbody tr:nth-child(7):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-7)}.chart__key .key:nth-child(11n-3),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-2){--chart-colour: var(--chart-colour-8)}.chart__outer table tbody tr:nth-child(8):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-8)}.chart__key .key:nth-child(11n-2),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-1){--chart-colour: var(--chart-colour-9)}.chart__outer table tbody tr:nth-child(9):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-9)}.chart__key .key:nth-child(11n-1),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-0){--chart-colour: var(--chart-colour-10)}.chart__outer table tbody tr:nth-child(10):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-10)}::slotted(table){display:none !important}:host{container-type:inline-size;margin-bottom:2rem;display:block}.chart__outer{display:flex;flex-direction:column;position:relative;font-weight:var(--chart-font-weight, bold);color:var(--chart-text-color, black);--chart-height: 7.5rem;--chart-height-lg: 12.5rem;--chart-height-resp: var(--chart-height);--index-below: -1;--index-base: 0;--index-focus: 2;--index-above: 10;--index-floating: 100;--index-menu: 200;--index-overlay: 1000;--key-label-width: 100%;--label-size: 0.75rem;--line-thickness: 1px;--yaxis-width: auto;--yaxis-point-display: block;--yaxis-last-point-transform: translate(0, -50%);--bar-gap: min(10%, 0.75rem)}.chart__outer>*{display:block;order:2}.chart__outer tbody{--chart-direction: 360deg;--chart-day-bg-pos: 100% calc(var(--single-day) * 7)}@container (min-width: 36em){.chart__outer :has(tr:nth-child(5) td:nth-child(4)),.chart__outer :has(tr:nth-child(10)){--yaxis-width: 0;--yaxis-point-display: none;--yaxis-last-point-transform: translate(0, -100%);--bar-gap: 0}.chart__outer .chart__wrapper{--chart-height-resp: var(--chart-height-lg);--line-thickness: 0.8px;--yaxis-width: auto;--yaxis-point-display: block;--yaxis-last-point-transform: translate(0, -50%)}}@container (min-width: 62em){.chart__outer :has(tr:nth-child(10)){--bar-gap: 0}.chart__outer .chart__wrapper{--label-size: 0.875rem;--line-thickness: 0.5px}}.chart__outer .chart__spacer span{opacity:0}.chart__outer>input[type=checkbox]{opacity:0;position:absolute;pointer-events:none;bottom:50%;left:50%}.chart__key{padding:0 0 0 0;margin-bottom:1.5rem;display:flex;overflow:auto;scroll-snap-type:x mandatory;scroll-padding:.75rem;column-gap:.5rem}.chart__key:has(label:first-child:last-child){display:var(--single-key-display, none)}.chart__key .key{margin:0 !important}.chart__key .key:before{content:"";height:.8em;width:.8em;margin-right:.3em !important;background-color:var(--chart-colour);display:inline-block;border-radius:var(--key-border-radius, 4px)}.chart__key .key[data-label=Min],.chart__key .key[data-label=Max]{display:none}.chart__key .key .chart__total{display:none}.chart__outer input[type=checkbox]:focus:nth-child(1)~.chart__key .key:nth-child(1){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(2)~.chart__key .key:nth-child(2){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(3)~.chart__key .key:nth-child(3){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(4)~.chart__key .key:nth-child(4){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(5)~.chart__key .key:nth-child(5){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(6)~.chart__key .key:nth-child(6){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(7)~.chart__key .key:nth-child(7){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(8)~.chart__key .key:nth-child(8){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(9)~.chart__key .key:nth-child(9){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer>input[type=checkbox]:nth-of-type(1):not(:checked)~.chart__key .key:nth-of-type(1){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(2):not(:checked)~.chart__key .key:nth-of-type(2){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(3):not(:checked)~.chart__key .key:nth-of-type(3){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(4):not(:checked)~.chart__key .key:nth-of-type(4){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(5):not(:checked)~.chart__key .key:nth-of-type(5){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(6):not(:checked)~.chart__key .key:nth-of-type(6){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(7):not(:checked)~.chart__key .key:nth-of-type(7){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(8):not(:checked)~.chart__key .key:nth-of-type(8){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(9):not(:checked)~.chart__key .key:nth-of-type(9){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(10):not(:checked)~.chart__key .key:nth-of-type(10){opacity:.25}:host([data-yaxis]){--yaxis-display: flex}.chart__yaxis{display:var(--yaxis-display, none);flex-direction:column-reverse;width:var(--yaxis-width)}.chart__yaxis .axis__point{bottom:var(--percent);position:relative;height:0;white-space:nowrap}.chart__yaxis .axis__point:not(:last-child){display:var(--yaxis-point-display)}.chart__yaxis .axis__point span{display:block;transform:translate(0, -50%);padding-right:.25rem;text-align:right;font-weight:var(--chart-yaxis-fw, normal);font-size:var(--chart-yaxis-fs, 0.75rem);color:var(--colour-body)}.chart__yaxis .axis__point:last-child span{transform:var(--yaxis-last-point-transform)}.chart__xaxis{margin-bottom:1rem;display:flex;flex-direction:column-reverse;width:100%;position:absolute;left:0;bottom:-1rem}.chart__xaxis .axis__point{left:var(--percent);width:1px;position:absolute;height:0;white-space:nowrap}.chart__xaxis .axis__point span{display:block;transform:translate(-50%, 0%);text-align:center;font-size:var(--label-size);position:absolute;left:50%}.chart__guidelines{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;flex-direction:column-reverse;pointer-events:none}.chart__guidelines .guideline{bottom:var(--percent);position:absolute;right:0;width:100%;height:0px;margin-bottom:-1px;border-bottom:1px dashed #eee;pointer-events:none;z-index:var(--index-below)}.chart__guidelines .guideline:not(.guideline--target) span{display:none}.chart__guidelines .guideline--target{border-bottom:1px dashed #000;z-index:var(--index-above);text-shadow:1px solid #fff;overflow:visible}.chart__guidelines .guideline--target span{position:absolute;bottom:0;font-size:var(--label-size);text-shadow:1px 1px 2px #fff;background:hsla(0,0%,100%,.6)}.chart__guidelines [data-value="0"]{border-bottom:1px solid var(--colour-primary)}.chart__guidelines [data-value="0"]:not(:first-child){border-bottom:1px dashed var(--colour-primary)}[part=popover]{position:absolute;top:var(--cursor-y, 50%);left:var(--cursor-x, 50%);font-size:var(--label-size);line-height:1.2;background:var(--chart-details-bg, var(--colour-canvas-2, Canvas));opacity:0;pointer-events:none;padding:.5rem;border-radius:.5rem;margin-bottom:.25rem;display:block;white-space:pre;text-align:left;box-shadow:var(--chart-details-shadow, 0 0.125rem 0.75rem rgba(0, 0, 0, 0.25));transform:translate(-50%, -100%)}[part=popover]::before{content:attr(data-group) "\\a"}[part=popover][data-label]::before{content:attr(data-group) "\\a" attr(data-label) "\\a"}[part=popover]:has(:is(a,button)){top:0;left:50%;transform:translate(-50%, -100%);font-size:.9rem}[part=popover] hr{margin:0;opacity:0}[part=popover] :is(a,button){display:inline-block !important;clear:both !important;float:left !important;margin-top:1rem !important;margin-right:1rem !important;margin-bottom:.25em !important;font-size:1em !important}[part=popover] :is(a,button)+:is(a,button){margin-top:0 !important}.chart__wrapper{display:block;display:flex;flex-direction:row;position:relative}.chart__wrapper .chart{position:relative;flex-grow:1}.chart__wrapper table{display:block;width:100% !important;padding-top:var(--chart-height-resp);position:relative;margin-bottom:0;overflow:visible}.chart__wrapper table thead{display:none}.chart__wrapper table tbody{display:flex;position:absolute;width:100%;height:100%;top:0;left:0;flex-direction:row;border:none}.chart__wrapper table tbody tr{display:flex;flex-direction:row;justify-content:var(--chart-bar-alignment, left);align-items:flex-end;border:none;width:100%;height:100%;position:relative;padding:0 2px;gap:var(--bar-gap)}.chart__wrapper table tbody tr td{font-weight:inherit}.chart__wrapper table tbody tr td:first-child{position:absolute;top:100%;left:0%;width:fit-content;padding:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:var(--label-size);text-align:center}@container (min-width: 62em){.chart__wrapper table tbody tr td:first-child{display:block}}.chart__wrapper table tbody tr td:first-child button{all:unset;cursor:pointer}.chart__wrapper table tbody tr td[data-label=Min],.chart__wrapper table tbody tr td[data-label=Max]{display:none}.chart__wrapper table tbody tr:first-child td:first-child,.chart__wrapper table tbody tr:last-child td:first-child{display:block}.chart__wrapper table tbody tr td:not(:first-child){height:100%;height:var(--percent, 0%);bottom:var(--bottom, 0%);width:100%;max-width:7.5rem;position:relative;padding:0;background:var(--chart-colour);border-top-right-radius:4px;border-top-left-radius:4px}@media screen and (prefers-color-scheme: dark){.chart__wrapper table tbody tr td:not(:first-child){background:color-mix(in oklab, var(--chart-colour), black 20%)}}.chart__wrapper table tbody tr td:not(:first-child):hover{background:color-mix(in oklab, var(--chart-colour), #000000 5%)}.chart__wrapper table tbody tr td:not(:first-child):has(span:empty),.chart__wrapper table tbody tr td:not(:first-child):empty{display:none}.chart__wrapper table tbody tr td:not(:first-child)[data-label]:before{display:none}.chart__wrapper table tbody tr td:not(:first-child):hover [part=popover]{opacity:1;z-index:var(--index-above);pointer-events:all}.chart__wrapper table tbody tr td:first-child[data-label]:before{display:none}@container (min-width: 62em){.chart__wrapper table tbody:has(tr:nth-child(5) td:nth-child(4)) tr td:first-child,.chart__wrapper table tbody:has(tr:nth-child(10)) tr td:first-child{display:none}.chart__wrapper table tbody:has(tr:nth-child(5) td:nth-child(4)) tr:first-child td:first-child,.chart__wrapper table tbody:has(tr:nth-child(10)) tr:first-child td:first-child{left:0%;transform:translate(0, 0);display:block;text-align:left}.chart__wrapper table tbody:has(tr:nth-child(5) td:nth-child(4)) tr:last-child td:first-child,.chart__wrapper table tbody:has(tr:nth-child(10)) tr:last-child td:first-child{left:100%;transform:translate(-100%, 0);display:block;text-align:right}.chart__wrapper table tbody:has(tr:nth-child(5) td:nth-child(4)) tr:first-child td:not(:first-child) span,.chart__wrapper table tbody:has(tr:nth-child(10)) tr:first-child td:not(:first-child) span{left:-20%;transform:translate(0%, 0);text-align:left}.chart__wrapper table tbody:has(tr:nth-child(5) td:nth-child(4)) tr:last-child td:not(:first-child) span,.chart__wrapper table tbody:has(tr:nth-child(10)) tr:last-child td:not(:first-child) span{left:120%;transform:translate(-100%, 0);text-align:right}}@container (min-width: 36em){.chart__wrapper table tbody:has(tr:nth-child(25)) tr td:first-child{display:none !important}.chart__wrapper table tbody:has(tr:nth-child(25)) tr:is(:first-child,:nth-child(2n+1)) td:first-child{display:block !important}.chart__wrapper table tbody:has(tr:nth-child(50)) tr:is(:first-child,:nth-child(2n+1)) td:first-child,.chart__wrapper table tbody:has(tr:nth-child(50)) tr td:first-child{display:none !important}.chart__wrapper table tbody:has(tr:nth-child(50)) tr:is(:first-child,:nth-child(10n+1)) td:first-child{display:block !important}.chart__wrapper table tbody:has(tr:nth-child(100)) tr:is(:first-child,:nth-child(10n+1)) td:first-child,.chart__wrapper table tbody:has(tr:nth-child(100)) tr td:first-child{display:none !important}.chart__wrapper table tbody:has(tr:nth-child(100)) tr:is(:first-child,:nth-child(20n+1)) td:first-child{display:block !important}}:host(.chart-colour--success) td,:host(:is(.chart-colour--success,.chart-colour--danger,.chart-colour--wraning)) td.chart-colour--success,.chart-colour--success td{--chart-colour: var(--chart-colour-success) !important}:host(.chart-colour--danger) td,:host(:is(.chart-colour--success,.chart-colour--danger,.chart-colour--wraning)) td.chart-colour--danger,.chart-colour--danger,.chart-colour--danger td{--chart-colour: var(--chart-colour-danger) !important}:host(.chart-colour--warning) td,:host(:is(.chart-colour--success,.chart-colour--danger,.chart-colour--wraning)) td.chart-colour--warning,.chart-colour--warning,.chart-colour--warning td{--chart-colour: var(--chart-colour-warning) !important}.chart__outer>input[type=checkbox]:nth-of-type(1):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(2){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(2):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(3){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(3):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(4){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(4):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(5){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(5):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(6){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(6):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(7){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(7):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(8){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(8):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(9){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(9):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(10){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(10):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(11){display:none;opacity:0}@layer elements{button{border-radius:0;text-transform:none;margin:0;font-family:inherit;font-size:inherit;line-height:inherit}button:focus:not(:focus-visible){outline:0}:is(button,[type=button],[type=reset],[type=submit],[role=button]){-webkit-appearance:button;&:not(:disabled){cursor:pointer}}.btn{--btn-margin: 1rem;--btn-padding-block: 0.75rem;--btn-padding-inline: 2.5rem;--btn-border-width: 2px;--btn-font-size: 1.125rem;--btn-line-height: 1.25rem;display:inline-block;font-weight:bold;text-align:left;text-decoration:none;vertical-align:middle;cursor:pointer;user-select:none;color:var(--colour-btn);font-size:var(--btn-font-size);line-height:var(--btn-line-height);padding:var(--btn-padding-block) var(--btn-padding-inline);border-radius:1.5rem;margin-bottom:var(--btn-margin);background:none;transition:border .5s,background .5s,color .5s;height:auto;max-width:fit-content;appearance:none;white-space:nowrap;&:not(.btn-secondary)[class*=colour-]{--colour-btn-bg: var(--colour);--colour-btn-border: var(--colour)}&:is(.colour-primary,.colour-dark,.colour-danger,.colour-black){--colour-btn: #fcfcfc}&:not(.border-0){background:var(--colour-btn-bg);border:var(--btn-border-width) solid var(--colour-btn-border)}&:not(:last-child){margin-right:var(--btn-margin)}}@media screen and (min-width: 36em){.btn{--btn-margin: 1.5rem}}a:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) .btn,.btn:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){outline:0;text-decoration:none;background:var(--colour-btn-bg-hover);color:var(--colour-btn-hover);border-radius:1.5rem}a:is(:active,.active):not([disabled]) .btn,.btn:is(:active,.active):not([disabled]){filter:brightness(85%);transition:background .1s,color .1s;color:var(--colour-btn);border-radius:1.5rem}a:disabled .btn,.btn:disabled,[disabled] .btn,.btn[disabled]{opacity:.4;cursor:not-allowed}.btn.btn-complete{--colour: var(--colour-success);--colour-btn-bg-hover: var(--colour);--colour-btn-border-hover: var(--colour);--colour-btn-hover: var(--colour-primary-theme);--colour-btn-bg: var(--colour);--colour-btn-border: var(--colour);position:relative;padding-left:3.5rem;padding-right:3.5rem}a:is(:hover,:focus,.hover):not([disabled],:active,.active) .btn.btn-complete,.btn.btn-complete:is(:hover,:focus,.hover):not([disabled],:active,.active){padding-left:2.5rem;padding-right:2.5rem;&:before{content:"\uF00C";font-family:"Font Awesome 7 Pro";margin-right:1rem;font-style:inherit;width:1rem;display:inline-block;height:var(--btn-line-height);vertical-align:bottom}}.btn.btn-sm{--btn-padding-block: 0.5rem;--btn-padding-inline: 2rem;--btn-margin: 0.5rem;--btn-font-size: 1rem}.btn{&[class*=fa-]:before{content:var(--fa);font-family:"Font Awesome 7 Pro"}&[class*=fa-after]{padding-right:4rem}&[class*=fa-after]:before{margin-right:0;margin-right:.375rem;position:absolute;right:1.5rem;top:50%;transform:translate(0, -50%)}&:not(.btn-compact):before{margin-right:1rem}i[class*=fa-]{--fa-width: 1em;font-family:"Font Awesome 7 Pro";margin-right:1rem;line-height:1em;font-style:inherit;&:not(:first-child){margin-left:1rem;margin-right:0}}}.btn.btn--prompt{&:after{content:"";height:var(--btn-line-height);width:1rem;display:inline-block;background:currentColor;mask-image:var(--icon-arrow);mask-size:100%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon-arrow);-webkit-mask-size:100%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%;vertical-align:bottom;margin-left:1rem}}a:is(:hover,:focus,.hover):not([disabled],:active,.active) .btn.btn--prompt,.btn.btn--prompt:is(:hover,:focus,.hover):not([disabled],:active,.active){&:after{margin-left:1.5rem;margin-right:-0.5rem}}.btn-filter{&:after{content:"\uF1DE";display:inline-block;margin-left:1em;margin-bottom:-0.15em;height:1em;width:1em;z-index:var(--index-focus);color:currentColor;font-weight:300;font-family:"Font Awesome 7 Pro"}}}@layer elements{.btn-secondary{color:var(--colour-btn-secondary);&:not(.border-0){background:var(--colour-btn-secondary-bg);border:2px solid var(--colour-btn-secondary-border)}}a:is(:hover,:focus,.hover,:active,.active):not([disabled]) .btn-secondary,.btn-secondary:is(:hover,:focus,.hover,:focus-within,:active,.active):not([disabled]){background:var(--colour-btn-secondary-bg-hover);color:var(--colour-btn-secondary-hover)}}@layer elements{.btn.btn-tertiary{background-color:transparent;border:none;color:var(--colour-link);margin:0 var(--btn-margin) var(--btn-margin) 0;padding:0;font-size:1.125rem;font-weight:normal;line-height:1.5rem;min-height:1.5rem;position:relative;&:after{position:absolute;content:"";top:100%;left:50%;height:2px;width:100%;transform:translate(-50%, 0);background:var(--colour-underline);transition:width .5s}&.text-decoration-none:after{width:0%}&[class*=fa-]{margin-left:0;margin-right:.5rem}&[class*=fa-]:not(:first-child){margin-left:.5rem;margin-right:0}&:is(:hover,:focus,.hover,:focus-within):not([disabled],:disabled,:active,.active){&:after{width:60% !important}}&:is(:active,.active):not([disabled],:disabled){color:var(--colour-active)}}}@layer elements{.btn-action{--btn-border-width: 1px;--btn-padding-block: 0.3125rem /* 5px */;--btn-padding-inline: 0.3125rem /* 5px */;--btn-margin: 0.5rem;border-radius:.25rem !important;font-weight:400 !important;font-size:1rem;line-height:1.25rem;&:not(.btn-primary){color:var(--colour-heading)}&:not(.btn-primary):not(.border-0){background-color:var(--colour-canvas-2);border:var(--btn-border-width) solid var(--colour-muted)}&.btn[class*=fa-]:before{content:var(--fa);margin-right:.375rem}&.icon-only{position:relative;text-indent:-300vw;overflow:hidden;min-width:1.75rem;&:before{position:absolute;left:0;top:0;min-width:1.75rem;text-align:center;text-indent:0;padding-inline:.25rem;line-height:1.85rem}}a:not(.btn-primary):is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) &,&:not(.btn-primary):is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){background:var(--colour-btn-action-hover-bg)}.btn-primary:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) &,&.btn-primary:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){filter:brightness(90%);background:var(--colour-btn-bg);border:var(--btn-border-width) solid var(--colour-btn-border);color:var(--colour-btn)}a:is(:active,.active):not([disabled]):not(.btn-primary) &,&:is(:active,.active):not([disabled]):not(.btn-primary){filter:brightness(85%);transition:all .1s;color:var(--colour-heading)}}.btn-action:not(.btn-compact).fa-compact-only:before{display:none !important}}@layer elements{.btn-compact{--compact-size: 3rem;padding:0 !important;margin-bottom:.5rem;text-align:center;width:var(--compact-size);min-width:var(--compact-size);max-width:var(--compact-size);height:var(--compact-size) !important;min-height:var(--compact-size) !important;max-height:var(--compact-size) !important;align-content:center;line-height:1 !important;text-indent:-500px;overflow:hidden;position:relative;font-size:1rem;&:not(:last-child){margin-right:.5rem}&:before{content:var(--fa);position:absolute;display:block;top:0;left:0;width:100%;height:100%;text-indent:0;line-height:calc(var(--compact-size) - .25rem);font-weight:900}[class*=fa-]:before{line-height:calc(var(--compact-size) - .25rem);@container style(--theme: dark){color:white}}&.btn-sm{--compact-size: 2.5rem;font-size:1rem;padding:0 !important}&.btn-action{--compact-size: 2rem;font-size:1rem;&:before{font-size:1em;font-weight:400}}&.btn-secondary{--colour-btn-bg: transparent;--colour-btn-border: transparent;border-color:transparent;&:not([class*=colour-]){--colour: var(--colour-light)}}&.btn-secondary:is(:hover,:focus,.hover,:active,.active,[aria-expanded],:focus-within):not([disabled]):not(.btn-collapse){background-color:var(--colour);color:var(--colour-primary-theme);border-color:var(--colour);&:is(.colour-primary,.colour-dark,.colour-danger,.colour-black){color:var(--colour-inverted)}}&[data-number]{position:relative}&[data-number]:after{content:attr(data-number);position:absolute;top:.5em;z-index:99;background:var(--colour-danger);height:1.5em;width:1.5em;border-radius:50%;text-indent:0;left:50%;font-size:.5em;line-height:1.5em;text-align:center;color:white;letter-spacing:-0.1em;font-family:arial,sans-serif}}.btn-compact{&:is(.fa-left,.fa-chevron-left,.fa-right,.fa-chevron-right,.fa-up,.fa-chevron-up,.fa-down,.fa-chevron-down,.fa-plus,.fa-bars,.fa-edit,.fa-envelope,.fa-calendar){--iso-display: block;--iso-font-size: 1.5rem;--iso-border-radius: 50%;--iso-text-indent: -500px}}@container style(--font-body){.btn-compact{font-size:var(--iso-font-size, 0.6rem) !important;text-indent:var(--iso-text-indent, 0px);white-space:initial;&:not(.btn-action){border-radius:var(--iso-border-radius, 0.25rem) !important}&:before{display:var(--iso-display, none);font-family:monospace !important;content:var(--iso) !important}}}@container style(--fa-font-regular){.btn-compact{text-indent:-500px;font-size:1rem !important;&:not(.btn-action){border-radius:50% !important}&:before{font-family:"Font Awesome 7 Pro" !important;content:var(--fa) !important;display:block}}}}@layer elements{.btn[popovertarget]{position:relative;anchor-name:--button2;&>.fa-chevron-down{display:none}&:not(:has(i)):after{content:"";display:inline-block;margin-right:.25em;margin-left:1em;height:.8em;width:.8em;z-index:var(--index-focus);background:currentColor;mask-image:var(--icon-arrow);mask-size:100%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon-arrow);-webkit-mask-size:100%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%;transform:rotate(90deg)}&[aria-pressed]:after{transform:rotate(270deg)}}.btn:has(select){position:relative;padding:0;max-width:fit-content;min-width:fit-content;width:fit-content;select{all:unset !important;padding:var(--btn-padding-block) var(--btn-padding-inline) !important;padding-right:calc(var(--btn-padding-inline) + 2rem) !important;border-radius:1.5rem !important;appearance:none !important;background:none !important;border:none !important;color:currentColor !important;display:block;outline:none;font-weight:inherit !important;font-size:var(--btn-font-size) !important;line-height:var(--btn-line-height) !important;field-sizing:content !important;appearance:base-select !important;option{font-size:1rem;text-align:left;color:var(--colour-primary);padding-inline:var(--menu-item-padding, 0.5rem);padding-block:var(--menu-item-padding, 0.5rem) !important;border-radius:.25rem !important;&:not(:last-child){margin:var(--menu-item-margin, 0 0 0.25rem 0) !important}&:hover{background:var(--colour-light) !important}&:after{content:attr(data-email)}}}select::picker-icon{display:none}select::picker(select){appearance:base-select;background:var(--menu-bg, canvas);margin-block:var(--menu-margin, 0.25rem);padding:var(--menu-padding, 0.5rem) !important;border:none !important;border-radius:.5rem;box-shadow:0px 2px 9px rgba(0, 0, 0, 0.1);font-size:1rem}hr{height:1px !important;background-color:var(--menu-hr-border-color, var(--border-color, grey)) !important;width:100%;margin:var(--menu-item-margin, 0 0 0.25rem 0) !important;padding:0 !important}select option::checkmark{display:none}select selectedcontent span{display:none}&:after{position:absolute;top:.625rem;right:1.5rem;content:"";height:1.5rem;width:1rem;display:inline-block;background:currentColor;mask-image:var(--icon-arrow);mask-size:100%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon-arrow);-webkit-mask-size:100%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%;vertical-align:bottom;margin-left:1rem;transform:rotate(90deg);pointer-events:none}}.btn-action:has(select){padding-block:0;padding-right:2rem;font-size:1em;select{margin:0rem 0rem !important;padding-right:2rem !important;margin-right:-2rem !important;font-size:1rem !important}&:after{top:.2rem;right:.5rem}}}@layer elements{.btn__group{display:flex;flex-direction:column;row-gap:var(--gap);reading-flow:source-order;margin-bottom:1.5rem;.btn-compact{max-width:fit-content;margin-inline:auto}}:where(.btn__group,iam-modal){reading-flow:source-order;.btn{margin-inline-end:0;width:100%;max-width:100%;text-align:center;white-space:normal;margin:0;&:not(:last-child){margin-right:0}}.btn-tertiary{max-width:fit-content;margin-block:0 !important;margin-inline:auto !important;order:3;reading-order:3}.btn-secondary{order:2;reading-order:2}.btn-primary{order:1;reading-order:1;margin:0;&:not(:last-child){margin:0}}}:is(iam-form,form) .btn__group{padding-top:1rem}@container (min-width: 36em){.btn__group{flex-direction:row;row-gap:0;gap:var(--gap);flex-wrap:wrap;.btn-tertiary{max-width:fit-content;margin-inline:0 !important;margin-block:auto;order:1}.btn-secondary{order:2}.btn-primary{order:3}.btn-compact{margin-inline:0;margin-block:auto}}:where(iam-modal,.btn__group){.btn{max-width:fit-content;white-space:nowrap;margin-block:auto}}.btn__group{.btn-tertiary{reading-order:1}.btn-secondary{reading-order:2}.btn-primary{reading-order:3}}iam-modal{.btn-tertiary{reading-order:3;order:1}.btn-secondary{order:2;reading-order:2}.btn-primary{order:3;reading-order:1}}.btn__group.text-end{justify-content:flex-end}:is(iam-form,form) .btn__group{justify-content:flex-end;padding-top:3rem}iam-modal .btn__group:last-child .btn,dialog .btn__group:last-child .btn{margin-bottom:0}}}.d-block{display:block}.chart__wrapper .doughnut path:nth-child(11n-10){fill:var(--chart-colour-1)}.chart__wrapper .doughnut path:nth-child(11n-9){fill:var(--chart-colour-2)}.chart__wrapper .doughnut path:nth-child(11n-8){fill:var(--chart-colour-3)}.chart__wrapper .doughnut path:nth-child(11n-7){fill:var(--chart-colour-4)}.chart__wrapper .doughnut path:nth-child(11n-6){fill:var(--chart-colour-5)}.chart__wrapper .doughnut path:nth-child(11n-5){fill:var(--chart-colour-6)}.chart__wrapper .doughnut path:nth-child(11n-4){fill:var(--chart-colour-7)}.chart__wrapper .doughnut path:nth-child(11n-3){fill:var(--chart-colour-8)}.chart__wrapper .doughnut path:nth-child(11n-2){fill:var(--chart-colour-9)}.chart__wrapper .doughnut path:nth-child(11n-1){fill:var(--chart-colour-10)}.chart__wrapper{order:1}.chart__key{--key-border-radius: 50%;order:2;margin-bottom:0}.chart__key .btn-action{font-size:.75rem;margin-right:-0.375rem !important;border-color:rgba(0,0,0,0) !important}.chart__key .btn-action:not(:hover):not(:focus){border-color:rgba(0,0,0,0) !important;background:rgba(0,0,0,0) !important}:host(.chart--horizontal) .chart__outer{flex-direction:row}:host(.chart--horizontal) .chart__outer .chart__key{flex-direction:column;justify-content:center;overflow:visible}:host(.chart--horizontal) .chart__outer .chart__key .btn-action{margin-right:0 !important;margin-bottom:-0.75 !important}:host(.chart--horizontal.chart--show-totals) .chart__outer .chart__key .btn-action{min-width:100%;display:flex;align-items:center;min-width:100%}:host(.chart--horizontal.chart--show-totals) .chart__outer .chart__key .btn-action[data-numeric]:before{flex-shrink:0}:host(.chart--horizontal.chart--show-totals) .chart__outer .chart__key .btn-action[data-numeric]:after{content:attr(data-numeric);display:inline-block;flex-grow:1;flex-shrink:0;min-width:6ch;text-align:right}:host(.chart--lg){--doughnut-size: 17.875rem}:host{--doughnut-size: 14.75rem}:host(.chart--sm){--doughnut-size: 11.875rem}.chart__outer .chart__yaxis,.chart__outer .line{display:none}.chart__outer table{display:none}.chart__outer .chart{display:flex;align-items:center}.chart__outer .doughnuts{display:flex;flex-direction:row;flex-wrap:wrap}.chart__outer .doughnut{position:relative;aspect-ratio:1/1;min-width:11.875rem;flex:1 1 auto;display:inline-block;max-width:var(--doughnut-size)}@container (min-width: 36em){.chart__outer .doughnut{width:var(--doughnut-size)}}.chart__outer .doughnut:first-child{margin-left:0}.chart__outer .doughnut:last-child{margin-right:0}.chart__outer .doughnut svg{width:100%;height:100%}.chart__outer .doughnut>.doughnut__title:before{content:attr(data-numeric);display:block;text-align:center;color:var(--colour-heading);font-size:3rem}.chart__outer .doughnut>.doughnut__title{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);pointer-events:all;background:var(--bg-colour, var(--colour-canvas));border-radius:50%;z-index:var(--index-focus);padding:1rem;aspect-ratio:1/1;display:flex;justify-content:center;align-items:center;flex-direction:column;height:67%}.chart__outer .doughnut>.doughnut__title span{text-align:center;display:block}.chart__outer .doughnut svg:has(path:nth-child(1):hover)~.tooltips>[part=popover]:nth-child(1),.chart__outer .doughnut svg:has(path:nth-child(2):hover)~.tooltips>[part=popover]:nth-child(2),.chart__outer .doughnut svg:has(path:nth-child(3):hover)~.tooltips>[part=popover]:nth-child(3),.chart__outer .doughnut svg:has(path:nth-child(4):hover)~.tooltips>[part=popover]:nth-child(4),.chart__outer .doughnut svg:has(path:nth-child(5):hover)~.tooltips>[part=popover]:nth-child(5),.chart__outer .doughnut svg:has(path:nth-child(6):hover)~.tooltips>[part=popover]:nth-child(6),.chart__outer .doughnut svg:has(path:nth-child(7):hover)~.tooltips>[part=popover]:nth-child(7),.chart__outer .doughnut svg:has(path:nth-child(8):hover)~.tooltips>[part=popover]:nth-child(8),.chart__outer .doughnut svg:has(path:nth-child(9):hover)~.tooltips>[part=popover]:nth-child(9),.chart__outer .doughnut svg:has(path:nth-child(10):hover)~.tooltips>[part=popover]:nth-child(10),.chart__outer [part=popover]:hover{opacity:1;z-index:var(--index-above);pointer-events:all;z-index:99}.chart__outer .doughnut svg:has(path:nth-child(1):hover)~.tooltips>[part=popover]:nth-child(1):before,.chart__outer .doughnut svg:has(path:nth-child(2):hover)~.tooltips>[part=popover]:nth-child(2):before,.chart__outer .doughnut svg:has(path:nth-child(3):hover)~.tooltips>[part=popover]:nth-child(3):before,.chart__outer .doughnut svg:has(path:nth-child(4):hover)~.tooltips>[part=popover]:nth-child(4):before,.chart__outer .doughnut svg:has(path:nth-child(5):hover)~.tooltips>[part=popover]:nth-child(5):before,.chart__outer .doughnut svg:has(path:nth-child(6):hover)~.tooltips>[part=popover]:nth-child(6):before,.chart__outer .doughnut svg:has(path:nth-child(7):hover)~.tooltips>[part=popover]:nth-child(7):before,.chart__outer .doughnut svg:has(path:nth-child(8):hover)~.tooltips>[part=popover]:nth-child(8):before,.chart__outer .doughnut svg:has(path:nth-child(9):hover)~.tooltips>[part=popover]:nth-child(9):before,.chart__outer .doughnut svg:has(path:nth-child(10):hover)~.tooltips>[part=popover]:nth-child(10):before,.chart__outer [part=popover]:hover:before{display:none}.chart__outer .doughnut:has([part=popover]>:is(button,a)) svg:has(path:nth-child(1):hover)~.tooltips>[part=popover]:nth-child(1),.chart__outer .doughnut:has([part=popover]>:is(button,a)) [part=popover]:nth-child(1):hover{top:var(--middle-1-y, 50%);left:var(--middle-1-x, 50%);transform:translate(-50%, -50%)}.chart__outer .doughnut:has([part=popover]>:is(button,a)) svg:has(path:nth-child(2):hover)~.tooltips>[part=popover]:nth-child(2),.chart__outer .doughnut:has([part=popover]>:is(button,a)) [part=popover]:nth-child(2):hover{top:var(--middle-2-y, 50%);left:var(--middle-2-x, 50%);transform:translate(-50%, -50%)}.chart__outer .doughnut:has([part=popover]>:is(button,a)) svg:has(path:nth-child(3):hover)~.tooltips>[part=popover]:nth-child(3),.chart__outer .doughnut:has([part=popover]>:is(button,a)) [part=popover]:nth-child(3):hover{top:var(--middle-3-y, 50%);left:var(--middle-3-x, 50%);transform:translate(-50%, -50%)}.chart__outer .doughnut:has([part=popover]>:is(button,a)) svg:has(path:nth-child(4):hover)~.tooltips>[part=popover]:nth-child(4),.chart__outer .doughnut:has([part=popover]>:is(button,a)) [part=popover]:nth-child(4):hover{top:var(--middle-4-y, 50%);left:var(--middle-4-x, 50%);transform:translate(-50%, -50%)}.chart__outer .doughnut:has([part=popover]>:is(button,a)) svg:has(path:nth-child(5):hover)~.tooltips>[part=popover]:nth-child(5),.chart__outer .doughnut:has([part=popover]>:is(button,a)) [part=popover]:nth-child(5):hover{top:var(--middle-5-y, 50%);left:var(--middle-5-x, 50%);transform:translate(-50%, -50%)}.chart__outer .doughnut:has([part=popover]>:is(button,a)) svg:has(path:nth-child(6):hover)~.tooltips>[part=popover]:nth-child(6),.chart__outer .doughnut:has([part=popover]>:is(button,a)) [part=popover]:nth-child(6):hover{top:var(--middle-6-y, 50%);left:var(--middle-6-x, 50%);transform:translate(-50%, -50%)}.chart__outer .doughnut:has([part=popover]>:is(button,a)) svg:has(path:nth-child(7):hover)~.tooltips>[part=popover]:nth-child(7),.chart__outer .doughnut:has([part=popover]>:is(button,a)) [part=popover]:nth-child(7):hover{top:var(--middle-7-y, 50%);left:var(--middle-7-x, 50%);transform:translate(-50%, -50%)}.chart__outer .doughnut:has([part=popover]>:is(button,a)) svg:has(path:nth-child(8):hover)~.tooltips>[part=popover]:nth-child(8),.chart__outer .doughnut:has([part=popover]>:is(button,a)) [part=popover]:nth-child(8):hover{top:var(--middle-8-y, 50%);left:var(--middle-8-x, 50%);transform:translate(-50%, -50%)}.chart__outer .doughnut:has([part=popover]>:is(button,a)) svg:has(path:nth-child(9):hover)~.tooltips>[part=popover]:nth-child(9),.chart__outer .doughnut:has([part=popover]>:is(button,a)) [part=popover]:nth-child(9):hover{top:var(--middle-9-y, 50%);left:var(--middle-9-x, 50%);transform:translate(-50%, -50%)}/*# sourceMappingURL=assets/css/components/doughnutchart.component.css.map */
|
|
12
|
+
.chart__key .key:nth-child(11n-10),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-9){--chart-colour: var(--chart-colour-1)}.chart__outer table tbody tr:nth-child(1):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-1)}.chart__key .key:nth-child(11n-9),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-8){--chart-colour: var(--chart-colour-2)}.chart__outer table tbody tr:nth-child(2):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-2)}.chart__key .key:nth-child(11n-8),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-7){--chart-colour: var(--chart-colour-3)}.chart__outer table tbody tr:nth-child(3):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-3)}.chart__key .key:nth-child(11n-7),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-6){--chart-colour: var(--chart-colour-4)}.chart__outer table tbody tr:nth-child(4):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-4)}.chart__key .key:nth-child(11n-6),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-5){--chart-colour: var(--chart-colour-5)}.chart__outer table tbody tr:nth-child(5):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-5)}.chart__key .key:nth-child(11n-5),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-4){--chart-colour: var(--chart-colour-6)}.chart__outer table tbody tr:nth-child(6):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-6)}.chart__key .key:nth-child(11n-4),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-3){--chart-colour: var(--chart-colour-7)}.chart__outer table tbody tr:nth-child(7):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-7)}.chart__key .key:nth-child(11n-3),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-2){--chart-colour: var(--chart-colour-8)}.chart__outer table tbody tr:nth-child(8):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-8)}.chart__key .key:nth-child(11n-2),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-1){--chart-colour: var(--chart-colour-9)}.chart__outer table tbody tr:nth-child(9):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-9)}.chart__key .key:nth-child(11n-1),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-0){--chart-colour: var(--chart-colour-10)}.chart__outer table tbody tr:nth-child(10):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-10)}::slotted(table){display:none !important}:host{container-type:inline-size;margin-bottom:2rem;display:block}.chart__outer{display:flex;flex-direction:column;position:relative;font-weight:var(--chart-font-weight, bold);color:var(--chart-text-color, black);--chart-height: 7.5rem;--chart-height-lg: 12.5rem;--chart-height-resp: var(--chart-height);--index-below: -1;--index-base: 0;--index-focus: 2;--index-above: 10;--index-floating: 100;--index-menu: 200;--index-overlay: 1000;--key-label-width: 100%;--label-size: 0.75rem;--line-thickness: 1px;--yaxis-width: auto;--yaxis-point-display: block;--yaxis-last-point-transform: translate(0, -50%);--bar-gap: min(10%, 0.75rem)}.chart__outer>*{display:block;order:2}.chart__outer tbody{--chart-direction: 360deg;--chart-day-bg-pos: 100% calc(var(--single-day) * 7)}@container (min-width: 36em){.chart__outer :has(tr:nth-child(5) td:nth-child(4)),.chart__outer :has(tr:nth-child(10)){--yaxis-width: 0;--yaxis-point-display: none;--yaxis-last-point-transform: translate(0, -100%);--bar-gap: 0}.chart__outer .chart__wrapper{--chart-height-resp: var(--chart-height-lg);--line-thickness: 0.8px;--yaxis-width: auto;--yaxis-point-display: block;--yaxis-last-point-transform: translate(0, -50%)}}@container (min-width: 62em){.chart__outer :has(tr:nth-child(10)){--bar-gap: 0}.chart__outer .chart__wrapper{--label-size: 0.875rem;--line-thickness: 0.5px}}.chart__outer .chart__spacer span{opacity:0}.chart__outer>input[type=checkbox]{opacity:0;position:absolute;pointer-events:none;bottom:50%;left:50%}.chart__key{padding:0 0 0 0;margin-bottom:1.5rem;display:flex;overflow:auto;scroll-snap-type:x mandatory;scroll-padding:.75rem;column-gap:.5rem}.chart__key:has(label:first-child:last-child){display:var(--single-key-display, none)}.chart__key .key{margin:0 !important}.chart__key .key:before{content:"";height:.8em;width:.8em;margin-right:.3em !important;background-color:var(--chart-colour);display:inline-block;border-radius:var(--key-border-radius, 4px)}.chart__key .key[data-label=Min],.chart__key .key[data-label=Max]{display:none}.chart__key .key .chart__total{display:none}.chart__outer input[type=checkbox]:focus:nth-child(1)~.chart__key .key:nth-child(1){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(2)~.chart__key .key:nth-child(2){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(3)~.chart__key .key:nth-child(3){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(4)~.chart__key .key:nth-child(4){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(5)~.chart__key .key:nth-child(5){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(6)~.chart__key .key:nth-child(6){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(7)~.chart__key .key:nth-child(7){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(8)~.chart__key .key:nth-child(8){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(9)~.chart__key .key:nth-child(9){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer>input[type=checkbox]:nth-of-type(1):not(:checked)~.chart__key .key:nth-of-type(1){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(2):not(:checked)~.chart__key .key:nth-of-type(2){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(3):not(:checked)~.chart__key .key:nth-of-type(3){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(4):not(:checked)~.chart__key .key:nth-of-type(4){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(5):not(:checked)~.chart__key .key:nth-of-type(5){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(6):not(:checked)~.chart__key .key:nth-of-type(6){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(7):not(:checked)~.chart__key .key:nth-of-type(7){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(8):not(:checked)~.chart__key .key:nth-of-type(8){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(9):not(:checked)~.chart__key .key:nth-of-type(9){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(10):not(:checked)~.chart__key .key:nth-of-type(10){opacity:.25}:host([data-yaxis]){--yaxis-display: flex}.chart__yaxis{display:var(--yaxis-display, none);flex-direction:column-reverse;width:var(--yaxis-width)}.chart__yaxis .axis__point{bottom:var(--percent);position:relative;height:0;white-space:nowrap}.chart__yaxis .axis__point:not(:last-child){display:var(--yaxis-point-display)}.chart__yaxis .axis__point span{display:block;transform:translate(0, -50%);padding-right:.25rem;text-align:right;font-weight:var(--chart-yaxis-fw, normal);font-size:var(--chart-yaxis-fs, 0.75rem);color:var(--colour-body)}.chart__yaxis .axis__point:last-child span{transform:var(--yaxis-last-point-transform)}.chart__xaxis{margin-bottom:1rem;display:flex;flex-direction:column-reverse;width:100%;position:absolute;left:0;bottom:-1rem}.chart__xaxis .axis__point{left:var(--percent);width:1px;position:absolute;height:0;white-space:nowrap}.chart__xaxis .axis__point span{display:block;transform:translate(-50%, 0%);text-align:center;font-size:var(--label-size);position:absolute;left:50%}.chart__guidelines{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;flex-direction:column-reverse;pointer-events:none}.chart__guidelines .guideline{bottom:var(--percent);position:absolute;right:0;width:100%;height:0px;margin-bottom:-1px;border-bottom:1px dashed #eee;pointer-events:none;z-index:var(--index-below)}.chart__guidelines .guideline:not(.guideline--target) span{display:none}.chart__guidelines .guideline--target{border-bottom:1px dashed #000;z-index:var(--index-above);text-shadow:1px solid #fff;overflow:visible}.chart__guidelines .guideline--target span{position:absolute;bottom:0;font-size:var(--label-size);text-shadow:1px 1px 2px #fff;background:hsla(0,0%,100%,.6)}.chart__guidelines [data-value="0"]{border-bottom:1px solid var(--colour-primary)}.chart__guidelines [data-value="0"]:not(:first-child){border-bottom:1px dashed var(--colour-primary)}[part=popover]{position:absolute;top:var(--cursor-y, 50%);left:var(--cursor-x, 50%);font-size:var(--label-size);line-height:1.2;background:var(--chart-details-bg, var(--colour-canvas-2, Canvas));opacity:0;pointer-events:none;padding:.5rem;border-radius:.5rem;margin-bottom:.25rem;display:block;white-space:pre;text-align:left;box-shadow:var(--chart-details-shadow, 0 0.125rem 0.75rem rgba(0, 0, 0, 0.25));transform:translate(-50%, -100%)}[part=popover]::before{content:attr(data-group) "\\a"}[part=popover][data-label]::before{content:attr(data-group) "\\a" attr(data-label) "\\a"}[part=popover]:has(:is(a,button)){top:0;left:50%;transform:translate(-50%, -100%);font-size:.9rem}[part=popover] hr{margin:0;opacity:0}[part=popover] :is(a,button){display:inline-block !important;clear:both !important;float:left !important;margin-top:1rem !important;margin-right:1rem !important;margin-bottom:.25em !important;font-size:1em !important}[part=popover] :is(a,button)+:is(a,button){margin-top:0 !important}.chart__wrapper{display:block;display:flex;flex-direction:row;position:relative}.chart__wrapper .chart{position:relative;flex-grow:1}.chart__wrapper table{display:block;width:100% !important;padding-top:var(--chart-height-resp);position:relative;margin-bottom:0;overflow:visible}.chart__wrapper table thead{display:none}.chart__wrapper table tbody{display:flex;position:absolute;width:100%;height:100%;top:0;left:0;flex-direction:row;border:none}.chart__wrapper table tbody tr{display:flex;flex-direction:row;justify-content:var(--chart-bar-alignment, left);align-items:flex-end;border:none;width:100%;height:100%;position:relative;padding:0 2px;gap:var(--bar-gap)}.chart__wrapper table tbody tr td{font-weight:inherit}.chart__wrapper table tbody tr td:first-child{position:absolute;top:100%;left:0%;width:fit-content;padding:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:var(--label-size);text-align:center}@container (min-width: 62em){.chart__wrapper table tbody tr td:first-child{display:block}}.chart__wrapper table tbody tr td:first-child button{all:unset;cursor:pointer}.chart__wrapper table tbody tr td[data-label=Min],.chart__wrapper table tbody tr td[data-label=Max]{display:none}.chart__wrapper table tbody tr:first-child td:first-child,.chart__wrapper table tbody tr:last-child td:first-child{display:block}.chart__wrapper table tbody tr td:not(:first-child){height:100%;height:var(--percent, 0%);bottom:var(--bottom, 0%);width:100%;max-width:7.5rem;position:relative;padding:0;background:var(--chart-colour);border-top-right-radius:4px;border-top-left-radius:4px}@media screen and (prefers-color-scheme: dark){.chart__wrapper table tbody tr td:not(:first-child){background:color-mix(in oklab, var(--chart-colour), black 20%)}}.chart__wrapper table tbody tr td:not(:first-child):hover{background:color-mix(in oklab, var(--chart-colour), #000000 5%)}.chart__wrapper table tbody tr td:not(:first-child):has(span:empty),.chart__wrapper table tbody tr td:not(:first-child):empty{display:none}.chart__wrapper table tbody tr td:not(:first-child)[data-label]:before{display:none}.chart__wrapper table tbody tr td:not(:first-child):hover [part=popover]{opacity:1;z-index:var(--index-above);pointer-events:all}.chart__wrapper table tbody tr td:first-child[data-label]:before{display:none}@container (min-width: 62em){.chart__wrapper table tbody:has(tr:nth-child(5) td:nth-child(4)) tr td:first-child,.chart__wrapper table tbody:has(tr:nth-child(10)) tr td:first-child{display:none}.chart__wrapper table tbody:has(tr:nth-child(5) td:nth-child(4)) tr:first-child td:first-child,.chart__wrapper table tbody:has(tr:nth-child(10)) tr:first-child td:first-child{left:0%;transform:translate(0, 0);display:block;text-align:left}.chart__wrapper table tbody:has(tr:nth-child(5) td:nth-child(4)) tr:last-child td:first-child,.chart__wrapper table tbody:has(tr:nth-child(10)) tr:last-child td:first-child{left:100%;transform:translate(-100%, 0);display:block;text-align:right}.chart__wrapper table tbody:has(tr:nth-child(5) td:nth-child(4)) tr:first-child td:not(:first-child) span,.chart__wrapper table tbody:has(tr:nth-child(10)) tr:first-child td:not(:first-child) span{left:-20%;transform:translate(0%, 0);text-align:left}.chart__wrapper table tbody:has(tr:nth-child(5) td:nth-child(4)) tr:last-child td:not(:first-child) span,.chart__wrapper table tbody:has(tr:nth-child(10)) tr:last-child td:not(:first-child) span{left:120%;transform:translate(-100%, 0);text-align:right}}@container (min-width: 36em){.chart__wrapper table tbody:has(tr:nth-child(25)) tr td:first-child{display:none !important}.chart__wrapper table tbody:has(tr:nth-child(25)) tr:is(:first-child,:nth-child(2n+1)) td:first-child{display:block !important}.chart__wrapper table tbody:has(tr:nth-child(50)) tr:is(:first-child,:nth-child(2n+1)) td:first-child,.chart__wrapper table tbody:has(tr:nth-child(50)) tr td:first-child{display:none !important}.chart__wrapper table tbody:has(tr:nth-child(50)) tr:is(:first-child,:nth-child(10n+1)) td:first-child{display:block !important}.chart__wrapper table tbody:has(tr:nth-child(100)) tr:is(:first-child,:nth-child(10n+1)) td:first-child,.chart__wrapper table tbody:has(tr:nth-child(100)) tr td:first-child{display:none !important}.chart__wrapper table tbody:has(tr:nth-child(100)) tr:is(:first-child,:nth-child(20n+1)) td:first-child{display:block !important}}:host(.chart-colour--success) td,:host(:is(.chart-colour--success,.chart-colour--danger,.chart-colour--wraning)) td.chart-colour--success,.chart-colour--success td{--chart-colour: var(--chart-colour-success) !important}:host(.chart-colour--danger) td,:host(:is(.chart-colour--success,.chart-colour--danger,.chart-colour--wraning)) td.chart-colour--danger,.chart-colour--danger,.chart-colour--danger td{--chart-colour: var(--chart-colour-danger) !important}:host(.chart-colour--warning) td,:host(:is(.chart-colour--success,.chart-colour--danger,.chart-colour--wraning)) td.chart-colour--warning,.chart-colour--warning,.chart-colour--warning td{--chart-colour: var(--chart-colour-warning) !important}.chart__outer>input[type=checkbox]:nth-of-type(1):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(2){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(2):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(3){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(3):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(4){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(4):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(5){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(5):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(6){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(6):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(7){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(7):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(8){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(8):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(9){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(9):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(10){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(10):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(11){display:none;opacity:0}@layer elements{button{border-radius:0;text-transform:none;margin:0;font-family:inherit;font-size:inherit;line-height:inherit}button:focus:not(:focus-visible){outline:0}:is(button,[type=button],[type=reset],[type=submit],[role=button]){-webkit-appearance:button;&:not(:disabled){cursor:pointer}}.btn{--btn-margin: 1rem;--btn-padding-block: 0.75rem;--btn-padding-inline: 2.5rem;--btn-border-width: 2px;--btn-font-size: 1.125rem;--btn-line-height: 1.25rem;display:inline-block;font-weight:bold;text-align:left;text-decoration:none;vertical-align:middle;cursor:pointer;user-select:none;color:var(--colour-btn);font-size:var(--btn-font-size);line-height:var(--btn-line-height);padding:var(--btn-padding-block) var(--btn-padding-inline);border-radius:1.5rem;margin-bottom:var(--btn-margin);background:none;transition:border .5s,background .5s,color .5s;height:auto;max-width:fit-content;appearance:none;white-space:nowrap;&:not(.btn-secondary)[class*=colour-]{--colour-btn-bg: var(--colour);--colour-btn-border: var(--colour)}&:is(.colour-primary,.colour-dark,.colour-danger,.colour-black){--colour-btn: #fcfcfc}&:not(.border-0){background:var(--colour-btn-bg);border:var(--btn-border-width) solid var(--colour-btn-border)}&:not(:last-child){margin-right:var(--btn-margin)}}@media screen and (min-width: 36em){.btn{--btn-margin: 1.5rem}}a:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) .btn,.btn:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){outline:0;text-decoration:none;background:var(--colour-btn-bg-hover);color:var(--colour-btn-hover);border-radius:1.5rem}a:is(:active,.active):not([disabled]) .btn,.btn:is(:active,.active):not([disabled]){filter:brightness(85%);transition:background .1s,color .1s;color:var(--colour-btn);border-radius:1.5rem}a:disabled .btn,.btn:disabled,[disabled] .btn,.btn[disabled]{opacity:.4;cursor:not-allowed}.btn.btn-complete{--colour: var(--colour-success);--colour-btn-bg-hover: var(--colour);--colour-btn-border-hover: var(--colour);--colour-btn-hover: var(--colour-primary-theme);--colour-btn-bg: var(--colour);--colour-btn-border: var(--colour);position:relative;padding-left:3.5rem;padding-right:3.5rem}a:is(:hover,:focus,.hover):not([disabled],:active,.active) .btn.btn-complete,.btn.btn-complete:is(:hover,:focus,.hover):not([disabled],:active,.active){padding-left:2.5rem;padding-right:2.5rem;&:before{content:"\uF00C";font-family:"Font Awesome 7 Pro";margin-right:1rem;font-style:inherit;width:1rem;display:inline-block;height:var(--btn-line-height);vertical-align:bottom}}.btn.btn-sm{--btn-padding-block: 0.5rem;--btn-padding-inline: 2rem;--btn-margin: 0.5rem;--btn-font-size: 1rem}.btn{&[class*=fa-]:before{content:var(--fa);font-family:"Font Awesome 7 Pro"}&[class*=fa-after]{padding-right:4rem}&[class*=fa-after]:before{margin-right:0;margin-right:.375rem;position:absolute;right:1.5rem;top:50%;transform:translate(0, -50%)}&:not(.btn-compact):before{margin-right:1rem}i[class*=fa-]{--fa-width: 1em;font-family:"Font Awesome 7 Pro";margin-right:1rem;line-height:1em;font-style:inherit;&:not(:first-child){margin-left:1rem;margin-right:0}}}.btn.btn--prompt{&:after{content:"";height:var(--btn-line-height);width:1rem;display:inline-block;background:currentColor;mask-image:var(--icon-arrow);mask-size:100%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon-arrow);-webkit-mask-size:100%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%;vertical-align:bottom;margin-left:1rem}}a:is(:hover,:focus,.hover):not([disabled],:active,.active) .btn.btn--prompt,.btn.btn--prompt:is(:hover,:focus,.hover):not([disabled],:active,.active){&:after{margin-left:1.5rem;margin-right:-0.5rem}}.btn-filter{&:after{content:"\uF1DE";display:inline-block;margin-left:1em;margin-bottom:-0.15em;height:1em;width:1em;z-index:var(--index-focus);color:currentColor;font-weight:300;font-family:"Font Awesome 7 Pro"}}}@layer elements{.btn-secondary{color:var(--colour-btn-secondary);&:not(.border-0){background:var(--colour-btn-secondary-bg);border:2px solid var(--colour-btn-secondary-border)}}a:is(:hover,:focus,.hover,:active,.active):not([disabled]) .btn-secondary,.btn-secondary:is(:hover,:focus,.hover,:focus-within,:active,.active):not([disabled]){background:var(--colour-btn-secondary-bg-hover);color:var(--colour-btn-secondary-hover)}}@layer elements{.btn.btn-tertiary{background-color:transparent;border:none;color:var(--colour-link);margin:0 var(--btn-margin) var(--btn-margin) 0;padding:0;font-size:1.125rem;font-weight:normal;line-height:1.5rem;min-height:1.5rem;position:relative;&:after{position:absolute;content:"";top:100%;left:50%;height:2px;width:100%;transform:translate(-50%, 0);background:var(--colour-underline);transition:width .5s}&.text-decoration-none:after{width:0%}&[class*=fa-]{margin-left:0;margin-right:.5rem}&[class*=fa-]:not(:first-child){margin-left:.5rem;margin-right:0}&:is(:hover,:focus,.hover,:focus-within):not([disabled],:disabled,:active,.active){&:after{width:60% !important}}&:is(:active,.active):not([disabled],:disabled){color:var(--colour-active)}}}@layer elements{.btn-action{--btn-border-width: 1px;--btn-padding-block: 0.3125rem /* 5px */;--btn-padding-inline: 0.3125rem /* 5px */;--btn-margin: 0.5rem;border-radius:.25rem !important;font-weight:400 !important;font-size:1rem;line-height:1.25rem;&:not(.btn-primary){color:var(--colour-heading)}&:not(.btn-primary):not(.border-0){background-color:var(--colour-canvas-2);border:var(--btn-border-width) solid var(--colour-muted)}&.btn[class*=fa-]:before{content:var(--fa);margin-right:.375rem}&.icon-only{position:relative;text-indent:-300vw;overflow:hidden;min-width:1.75rem;&:before{position:absolute;left:0;top:0;min-width:1.75rem;text-align:center;text-indent:0;padding-inline:.25rem;line-height:1.85rem}}a:not(.btn-primary):is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) &,&:not(.btn-primary):is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){background:var(--colour-btn-action-hover-bg)}.btn-primary:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) &,&.btn-primary:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){filter:brightness(90%);background:var(--colour-btn-bg);border:var(--btn-border-width) solid var(--colour-btn-border);color:var(--colour-btn)}a:is(:active,.active):not([disabled]):not(.btn-primary) &,&:is(:active,.active):not([disabled]):not(.btn-primary){filter:brightness(85%);transition:all .1s;color:var(--colour-heading)}}.btn-action:not(.btn-compact).fa-compact-only:before{display:none !important}}@layer elements{.btn-compact{--compact-size: 3rem;padding:0 !important;margin-bottom:.5rem;text-align:center;width:var(--compact-size);min-width:var(--compact-size);max-width:var(--compact-size);height:var(--compact-size) !important;min-height:var(--compact-size) !important;max-height:var(--compact-size) !important;align-content:center;line-height:1 !important;text-indent:-500px;overflow:hidden;position:relative;font-size:1rem;&:not(:last-child){margin-right:.5rem}&:before{content:var(--fa);position:absolute;display:block;top:0;left:0;width:100%;height:100%;text-indent:0;line-height:calc(var(--compact-size) - .25rem);font-weight:900}[class*=fa-]:before{line-height:calc(var(--compact-size) - .25rem);@container style(--theme: dark){color:white}}&.btn-sm{--compact-size: 2.5rem;font-size:1rem;padding:0 !important}&.btn-action{--compact-size: 2rem;font-size:1rem;&:before{font-size:1em;font-weight:400}}&.btn-secondary{--colour-btn-bg: transparent;--colour-btn-border: transparent;border-color:transparent;&:not([class*=colour-]){--colour: var(--colour-light)}}&.btn-secondary:is(:hover,:focus,.hover,:active,.active,[aria-expanded],:focus-within):not([disabled]):not(.btn-collapse){background-color:var(--colour);color:var(--colour-primary-theme);border-color:var(--colour);&:is(.colour-primary,.colour-dark,.colour-danger,.colour-black){color:var(--colour-inverted)}}&[data-number]{position:relative}&[data-number]:after{content:attr(data-number);position:absolute;top:.5em;z-index:99;background:var(--colour-danger);height:1.5em;width:1.5em;border-radius:50%;text-indent:0;left:50%;font-size:.5em;line-height:1.5em;text-align:center;color:white;letter-spacing:-0.1em;font-family:arial,sans-serif}}.btn-compact{&:is(.fa-left,.fa-chevron-left,.fa-right,.fa-chevron-right,.fa-up,.fa-chevron-up,.fa-down,.fa-chevron-down,.fa-plus,.fa-bars,.fa-edit,.fa-envelope,.fa-calendar){--iso-display: block;--iso-font-size: 1.5rem;--iso-border-radius: 50%;--iso-text-indent: -500px}}@container style(--font-body){.btn-compact{font-size:var(--iso-font-size, 0.6rem) !important;text-indent:var(--iso-text-indent, 0px);white-space:initial;&:not(.btn-action){border-radius:var(--iso-border-radius, 0.25rem) !important}&:before{display:var(--iso-display, none);font-family:monospace !important;content:var(--iso) !important}}}@container style(--fa-font-regular){.btn-compact{text-indent:-500px;font-size:1rem !important;&:not(.btn-action){border-radius:50% !important}&:before{font-family:"Font Awesome 7 Pro" !important;content:var(--fa) !important;display:block}}}}@layer elements{.btn[popovertarget]{position:relative;anchor-name:--button2;&>.fa-chevron-down{display:none}&:not(:has(i)):not(.no-icon):after{content:"";display:inline-block;margin-right:.25em;margin-left:1em;height:.8em;width:.8em;z-index:var(--index-focus);background:currentColor;mask-image:var(--icon-arrow);mask-size:100%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon-arrow);-webkit-mask-size:100%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%;transform:rotate(90deg)}&[aria-pressed]:after{transform:rotate(270deg)}}.btn:has(select){position:relative;padding:0;max-width:fit-content;min-width:fit-content;width:fit-content;select{all:unset !important;padding:var(--btn-padding-block) var(--btn-padding-inline) !important;padding-right:calc(var(--btn-padding-inline) + 2rem) !important;border-radius:1.5rem !important;appearance:none !important;background:none !important;border:none !important;color:currentColor !important;display:block;outline:none;font-weight:inherit !important;font-size:var(--btn-font-size) !important;line-height:var(--btn-line-height) !important;field-sizing:content !important;appearance:base-select !important;option{font-size:1rem;text-align:left;color:var(--colour-primary);padding-inline:var(--menu-item-padding, 0.5rem);padding-block:var(--menu-item-padding, 0.5rem) !important;border-radius:.25rem !important;&:not(:last-child){margin:var(--menu-item-margin, 0 0 0.25rem 0) !important}&:hover{background:var(--colour-light) !important}&:after{content:attr(data-email)}}}select::picker-icon{display:none}select::picker(select){appearance:base-select;background:var(--menu-bg, canvas);margin-block:var(--menu-margin, 0.25rem);padding:var(--menu-padding, 0.5rem) !important;border:none !important;border-radius:.5rem;box-shadow:0px 2px 9px rgba(0, 0, 0, 0.1);font-size:1rem}hr{height:1px !important;background-color:var(--menu-hr-border-color, var(--border-color, grey)) !important;width:100%;margin:var(--menu-item-margin, 0 0 0.25rem 0) !important;padding:0 !important}select option::checkmark{display:none}select selectedcontent span{display:none}&:after{position:absolute;top:.625rem;right:1.5rem;content:"";height:1.5rem;width:1rem;display:inline-block;background:currentColor;mask-image:var(--icon-arrow);mask-size:100%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon-arrow);-webkit-mask-size:100%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%;vertical-align:bottom;margin-left:1rem;transform:rotate(90deg);pointer-events:none}}.btn-action:has(select){padding-block:0;padding-right:2rem;font-size:1em;select{margin:0rem 0rem !important;padding-right:2rem !important;margin-right:-2rem !important;font-size:1rem !important}&:after{top:.2rem;right:.5rem}}}@layer elements{.btn__group{display:flex;flex-direction:column;row-gap:var(--gap);reading-flow:source-order;margin-bottom:1.5rem;.btn-compact{max-width:fit-content;margin-inline:auto}}:where(.btn__group,iam-modal){reading-flow:source-order;.btn{margin-inline-end:0;width:100%;max-width:100%;text-align:center;white-space:normal;margin:0;&:not(:last-child){margin-right:0}}.btn-tertiary{max-width:fit-content;margin-block:0 !important;margin-inline:auto !important;order:3;reading-order:3}.btn-secondary{order:2;reading-order:2}.btn-primary{order:1;reading-order:1;margin:0;&:not(:last-child){margin:0}}}:is(iam-form,form) .btn__group{padding-top:1rem}@container (min-width: 36em){.btn__group{flex-direction:row;row-gap:0;gap:var(--gap);flex-wrap:wrap;.btn-tertiary{max-width:fit-content;margin-inline:0 !important;margin-block:auto;order:1}.btn-secondary{order:2}.btn-primary{order:3}.btn-compact{margin-inline:0;margin-block:auto}}:where(iam-modal,.btn__group){.btn{max-width:fit-content;white-space:nowrap;margin-block:auto}}.btn__group{.btn-tertiary{reading-order:1}.btn-secondary{reading-order:2}.btn-primary{reading-order:3}}iam-modal{.btn-tertiary{reading-order:3;order:1}.btn-secondary{order:2;reading-order:2}.btn-primary{order:3;reading-order:1}}.btn__group.text-end{justify-content:flex-end}:is(iam-form,form) .btn__group{justify-content:flex-end;padding-top:3rem}iam-modal .btn__group:last-child .btn,dialog .btn__group:last-child .btn{margin-bottom:0}}}.d-block{display:block}.chart__wrapper .doughnut path:nth-child(11n-10){fill:var(--chart-colour-1)}.chart__wrapper .doughnut path:nth-child(11n-9){fill:var(--chart-colour-2)}.chart__wrapper .doughnut path:nth-child(11n-8){fill:var(--chart-colour-3)}.chart__wrapper .doughnut path:nth-child(11n-7){fill:var(--chart-colour-4)}.chart__wrapper .doughnut path:nth-child(11n-6){fill:var(--chart-colour-5)}.chart__wrapper .doughnut path:nth-child(11n-5){fill:var(--chart-colour-6)}.chart__wrapper .doughnut path:nth-child(11n-4){fill:var(--chart-colour-7)}.chart__wrapper .doughnut path:nth-child(11n-3){fill:var(--chart-colour-8)}.chart__wrapper .doughnut path:nth-child(11n-2){fill:var(--chart-colour-9)}.chart__wrapper .doughnut path:nth-child(11n-1){fill:var(--chart-colour-10)}.chart__wrapper{order:1}.chart__key{--key-border-radius: 50%;order:2;margin-bottom:0}.chart__key .btn-action{font-size:.75rem;margin-right:-0.375rem !important;border-color:rgba(0,0,0,0) !important}.chart__key .btn-action:not(:hover):not(:focus){border-color:rgba(0,0,0,0) !important;background:rgba(0,0,0,0) !important}:host(.chart--horizontal) .chart__outer{flex-direction:row}:host(.chart--horizontal) .chart__outer .chart__key{flex-direction:column;justify-content:center;overflow:visible}:host(.chart--horizontal) .chart__outer .chart__key .btn-action{margin-right:0 !important;margin-bottom:-0.75 !important}:host(.chart--horizontal.chart--show-totals) .chart__outer .chart__key .btn-action{min-width:100%;display:flex;align-items:center;min-width:100%}:host(.chart--horizontal.chart--show-totals) .chart__outer .chart__key .btn-action[data-numeric]:before{flex-shrink:0}:host(.chart--horizontal.chart--show-totals) .chart__outer .chart__key .btn-action[data-numeric]:after{content:attr(data-numeric);display:inline-block;flex-grow:1;flex-shrink:0;min-width:6ch;text-align:right}:host(.chart--lg){--doughnut-size: 17.875rem}:host{--doughnut-size: 14.75rem}:host(.chart--sm){--doughnut-size: 11.875rem}.chart__outer .chart__yaxis,.chart__outer .line{display:none}.chart__outer table{display:none}.chart__outer .chart{display:flex;align-items:center}.chart__outer .doughnuts{display:flex;flex-direction:row;flex-wrap:wrap}.chart__outer .doughnut{position:relative;aspect-ratio:1/1;min-width:11.875rem;flex:1 1 auto;display:inline-block;max-width:var(--doughnut-size)}@container (min-width: 36em){.chart__outer .doughnut{width:var(--doughnut-size)}}.chart__outer .doughnut:first-child{margin-left:0}.chart__outer .doughnut:last-child{margin-right:0}.chart__outer .doughnut svg{width:100%;height:100%}.chart__outer .doughnut>.doughnut__title:before{content:attr(data-numeric);display:block;text-align:center;color:var(--colour-heading);font-size:3rem}.chart__outer .doughnut>.doughnut__title{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);pointer-events:all;background:var(--bg-colour, var(--colour-canvas));border-radius:50%;z-index:var(--index-focus);padding:1rem;aspect-ratio:1/1;display:flex;justify-content:center;align-items:center;flex-direction:column;height:67%}.chart__outer .doughnut>.doughnut__title span{text-align:center;display:block}.chart__outer .doughnut svg:has(path:nth-child(1):hover)~.tooltips>[part=popover]:nth-child(1),.chart__outer .doughnut svg:has(path:nth-child(2):hover)~.tooltips>[part=popover]:nth-child(2),.chart__outer .doughnut svg:has(path:nth-child(3):hover)~.tooltips>[part=popover]:nth-child(3),.chart__outer .doughnut svg:has(path:nth-child(4):hover)~.tooltips>[part=popover]:nth-child(4),.chart__outer .doughnut svg:has(path:nth-child(5):hover)~.tooltips>[part=popover]:nth-child(5),.chart__outer .doughnut svg:has(path:nth-child(6):hover)~.tooltips>[part=popover]:nth-child(6),.chart__outer .doughnut svg:has(path:nth-child(7):hover)~.tooltips>[part=popover]:nth-child(7),.chart__outer .doughnut svg:has(path:nth-child(8):hover)~.tooltips>[part=popover]:nth-child(8),.chart__outer .doughnut svg:has(path:nth-child(9):hover)~.tooltips>[part=popover]:nth-child(9),.chart__outer .doughnut svg:has(path:nth-child(10):hover)~.tooltips>[part=popover]:nth-child(10),.chart__outer [part=popover]:hover{opacity:1;z-index:var(--index-above);pointer-events:all;z-index:99}.chart__outer .doughnut svg:has(path:nth-child(1):hover)~.tooltips>[part=popover]:nth-child(1):before,.chart__outer .doughnut svg:has(path:nth-child(2):hover)~.tooltips>[part=popover]:nth-child(2):before,.chart__outer .doughnut svg:has(path:nth-child(3):hover)~.tooltips>[part=popover]:nth-child(3):before,.chart__outer .doughnut svg:has(path:nth-child(4):hover)~.tooltips>[part=popover]:nth-child(4):before,.chart__outer .doughnut svg:has(path:nth-child(5):hover)~.tooltips>[part=popover]:nth-child(5):before,.chart__outer .doughnut svg:has(path:nth-child(6):hover)~.tooltips>[part=popover]:nth-child(6):before,.chart__outer .doughnut svg:has(path:nth-child(7):hover)~.tooltips>[part=popover]:nth-child(7):before,.chart__outer .doughnut svg:has(path:nth-child(8):hover)~.tooltips>[part=popover]:nth-child(8):before,.chart__outer .doughnut svg:has(path:nth-child(9):hover)~.tooltips>[part=popover]:nth-child(9):before,.chart__outer .doughnut svg:has(path:nth-child(10):hover)~.tooltips>[part=popover]:nth-child(10):before,.chart__outer [part=popover]:hover:before{display:none}.chart__outer .doughnut:has([part=popover]>:is(button,a)) svg:has(path:nth-child(1):hover)~.tooltips>[part=popover]:nth-child(1),.chart__outer .doughnut:has([part=popover]>:is(button,a)) [part=popover]:nth-child(1):hover{top:var(--middle-1-y, 50%);left:var(--middle-1-x, 50%);transform:translate(-50%, -50%)}.chart__outer .doughnut:has([part=popover]>:is(button,a)) svg:has(path:nth-child(2):hover)~.tooltips>[part=popover]:nth-child(2),.chart__outer .doughnut:has([part=popover]>:is(button,a)) [part=popover]:nth-child(2):hover{top:var(--middle-2-y, 50%);left:var(--middle-2-x, 50%);transform:translate(-50%, -50%)}.chart__outer .doughnut:has([part=popover]>:is(button,a)) svg:has(path:nth-child(3):hover)~.tooltips>[part=popover]:nth-child(3),.chart__outer .doughnut:has([part=popover]>:is(button,a)) [part=popover]:nth-child(3):hover{top:var(--middle-3-y, 50%);left:var(--middle-3-x, 50%);transform:translate(-50%, -50%)}.chart__outer .doughnut:has([part=popover]>:is(button,a)) svg:has(path:nth-child(4):hover)~.tooltips>[part=popover]:nth-child(4),.chart__outer .doughnut:has([part=popover]>:is(button,a)) [part=popover]:nth-child(4):hover{top:var(--middle-4-y, 50%);left:var(--middle-4-x, 50%);transform:translate(-50%, -50%)}.chart__outer .doughnut:has([part=popover]>:is(button,a)) svg:has(path:nth-child(5):hover)~.tooltips>[part=popover]:nth-child(5),.chart__outer .doughnut:has([part=popover]>:is(button,a)) [part=popover]:nth-child(5):hover{top:var(--middle-5-y, 50%);left:var(--middle-5-x, 50%);transform:translate(-50%, -50%)}.chart__outer .doughnut:has([part=popover]>:is(button,a)) svg:has(path:nth-child(6):hover)~.tooltips>[part=popover]:nth-child(6),.chart__outer .doughnut:has([part=popover]>:is(button,a)) [part=popover]:nth-child(6):hover{top:var(--middle-6-y, 50%);left:var(--middle-6-x, 50%);transform:translate(-50%, -50%)}.chart__outer .doughnut:has([part=popover]>:is(button,a)) svg:has(path:nth-child(7):hover)~.tooltips>[part=popover]:nth-child(7),.chart__outer .doughnut:has([part=popover]>:is(button,a)) [part=popover]:nth-child(7):hover{top:var(--middle-7-y, 50%);left:var(--middle-7-x, 50%);transform:translate(-50%, -50%)}.chart__outer .doughnut:has([part=popover]>:is(button,a)) svg:has(path:nth-child(8):hover)~.tooltips>[part=popover]:nth-child(8),.chart__outer .doughnut:has([part=popover]>:is(button,a)) [part=popover]:nth-child(8):hover{top:var(--middle-8-y, 50%);left:var(--middle-8-x, 50%);transform:translate(-50%, -50%)}.chart__outer .doughnut:has([part=popover]>:is(button,a)) svg:has(path:nth-child(9):hover)~.tooltips>[part=popover]:nth-child(9),.chart__outer .doughnut:has([part=popover]>:is(button,a)) [part=popover]:nth-child(9):hover{top:var(--middle-9-y, 50%);left:var(--middle-9-x, 50%);transform:translate(-50%, -50%)}/*# sourceMappingURL=assets/css/components/doughnutchart.component.css.map */
|
|
13
13
|
|
|
14
14
|
</style>
|
|
15
15
|
<div class="chart__outer" part="outer">
|