@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.
Files changed (168) hide show
  1. package/assets/css/components/actionbar.component.css +1 -1
  2. package/assets/css/components/actionbar.component.css.map +1 -1
  3. package/assets/css/components/address-lookup.component.css +1 -1
  4. package/assets/css/components/address-lookup.component.css.map +1 -1
  5. package/assets/css/components/applied-filters.css +1 -1
  6. package/assets/css/components/applied-filters.css.map +1 -1
  7. package/assets/css/components/barchart.component.css +1 -1
  8. package/assets/css/components/barchart.component.css.map +1 -1
  9. package/assets/css/components/button.component.css +1 -0
  10. package/assets/css/components/button.component.css.map +1 -0
  11. package/assets/css/components/calendar.component.css +1 -1
  12. package/assets/css/components/calendar.component.css.map +1 -1
  13. package/assets/css/components/card.component.css +1 -1
  14. package/assets/css/components/card.component.css.map +1 -1
  15. package/assets/css/components/carousel.component.css +1 -1
  16. package/assets/css/components/carousel.component.css.map +1 -1
  17. package/assets/css/components/collapsible-side.css +1 -1
  18. package/assets/css/components/collapsible-side.css.map +1 -1
  19. package/assets/css/components/config.component.css +1 -1
  20. package/assets/css/components/config.component.css.map +1 -1
  21. package/assets/css/components/content.component.css +1 -1
  22. package/assets/css/components/content.component.css.map +1 -1
  23. package/assets/css/components/doughnutchart.component.css +1 -1
  24. package/assets/css/components/doughnutchart.component.css.map +1 -1
  25. package/assets/css/components/fileupload.css +1 -1
  26. package/assets/css/components/fileupload.css.map +1 -1
  27. package/assets/css/components/menu.component.css +1 -1
  28. package/assets/css/components/menu.component.css.map +1 -1
  29. package/assets/css/components/menu.global.css +1 -1
  30. package/assets/css/components/menu.global.css.map +1 -1
  31. package/assets/css/components/modal.component.css +1 -1
  32. package/assets/css/components/modal.component.css.map +1 -1
  33. package/assets/css/components/multi-step-modal.component.css +1 -1
  34. package/assets/css/components/multi-step-modal.component.css.map +1 -1
  35. package/assets/css/components/multiselect.css +1 -1
  36. package/assets/css/components/multiselect.css.map +1 -1
  37. package/assets/css/components/nav.component.css +1 -1
  38. package/assets/css/components/nav.component.css.map +1 -1
  39. package/assets/css/components/nav.global.css +1 -1
  40. package/assets/css/components/nav.global.css.map +1 -1
  41. package/assets/css/components/pagination.css +1 -1
  42. package/assets/css/components/pagination.css.map +1 -1
  43. package/assets/css/components/rank.component.css +1 -1
  44. package/assets/css/components/rank.component.css.map +1 -1
  45. package/assets/css/components/rankings.component.css +1 -1
  46. package/assets/css/components/rankings.component.css.map +1 -1
  47. package/assets/css/components/rankings.global.css +1 -1
  48. package/assets/css/components/rankings.global.css.map +1 -1
  49. package/assets/css/components/split-button.component.css +1 -1
  50. package/assets/css/components/split-button.component.css.map +1 -1
  51. package/assets/css/components/tabs.component.css +1 -1
  52. package/assets/css/components/tabs.component.css.map +1 -1
  53. package/assets/css/components/tabs.config.css +1 -1
  54. package/assets/css/components/tabs.config.css.map +1 -1
  55. package/assets/css/components/video-card.component.css +1 -1
  56. package/assets/css/components/video-card.component.css.map +1 -1
  57. package/assets/css/components/video-modal.component.css +1 -1
  58. package/assets/css/components/video-modal.component.css.map +1 -1
  59. package/assets/css/core.min.css +1 -1
  60. package/assets/css/core.min.css.map +1 -1
  61. package/assets/css/elements/badge-tag.css +1 -1
  62. package/assets/css/elements/badge-tag.css.map +1 -1
  63. package/assets/css/elements/buttons--special.css +1 -1
  64. package/assets/css/elements/buttons--special.css.map +1 -1
  65. package/assets/css/elements/buttons.css +1 -1
  66. package/assets/css/elements/buttons.css.map +1 -1
  67. package/assets/css/elements/type.css +1 -1
  68. package/assets/css/elements/type.css.map +1 -1
  69. package/assets/css/style.min.css +1 -1
  70. package/assets/css/style.min.css.map +1 -1
  71. package/assets/js/components/accordion/accordion.component.min.js +1 -1
  72. package/assets/js/components/actionbar/actionbar.component.min.js +3 -3
  73. package/assets/js/components/address-lookup/address-lookup.component.min.js +2 -2
  74. package/assets/js/components/advanced-select/advanced-select.component.min.js +1 -1
  75. package/assets/js/components/applied-filters/applied-filters.component.min.js +3 -3
  76. package/assets/js/components/barchart/barchart.component.min.js +2 -2
  77. package/assets/js/components/bento-grid/bento-grid.component.min.js +1 -1
  78. package/assets/js/components/button/button.component.js +49 -0
  79. package/assets/js/components/button/button.component.min.js +13 -0
  80. package/assets/js/components/button/button.component.min.js.map +1 -0
  81. package/assets/js/components/calendar/calendar.component.min.js +2 -2
  82. package/assets/js/components/card/card.component.min.js +3 -3
  83. package/assets/js/components/carousel/carousel.component.js +12 -1
  84. package/assets/js/components/carousel/carousel.component.min.js +4 -4
  85. package/assets/js/components/carousel/carousel.component.min.js.map +1 -1
  86. package/assets/js/components/collapsible-side/collapsible-side.component.min.js +2 -2
  87. package/assets/js/components/config/config.component.min.js +2 -2
  88. package/assets/js/components/content/content.component.js +9 -3
  89. package/assets/js/components/content/content.component.min.js +5 -7
  90. package/assets/js/components/content/content.component.min.js.map +1 -1
  91. package/assets/js/components/darkmode/darkmode.component.min.js +1 -1
  92. package/assets/js/components/doughnutchart/doughnutchart.component.min.js +2 -2
  93. package/assets/js/components/fileupload/fileupload.component.min.js +2 -2
  94. package/assets/js/components/filter-card/filter-card.component.min.js +1 -1
  95. package/assets/js/components/filterlist/filterlist.component.min.js +1 -1
  96. package/assets/js/components/form/form.component.min.js +1 -1
  97. package/assets/js/components/header/header.component.min.js +1 -1
  98. package/assets/js/components/inline-edit/inline-edit.component.min.js +1 -1
  99. package/assets/js/components/input/input.component.min.js +1 -1
  100. package/assets/js/components/input-range/input-range.component.min.js +1 -1
  101. package/assets/js/components/marketing/marketing.component.min.js +1 -1
  102. package/assets/js/components/menu/menu.component.min.js +4 -4
  103. package/assets/js/components/milestone/milestone.component.min.js +1 -1
  104. package/assets/js/components/milestone-group/milestone-group.component.min.js +1 -1
  105. package/assets/js/components/modal/modal.component.min.js +2 -2
  106. package/assets/js/components/multi-step/multi-step.component.min.js +1 -1
  107. package/assets/js/components/multi-step-modal/multi-step-modal.component.min.js +2 -2
  108. package/assets/js/components/multiselect/multiselect.component.min.js +2 -2
  109. package/assets/js/components/nav/nav.component.js +1 -1
  110. package/assets/js/components/nav/nav.component.min.js +4 -4
  111. package/assets/js/components/nav/nav.component.min.js.map +1 -1
  112. package/assets/js/components/notification/notification.component.min.js +1 -1
  113. package/assets/js/components/pagination/pagination.component.min.js +2 -2
  114. package/assets/js/components/password/password.component.min.js +1 -1
  115. package/assets/js/components/popover/popover.component.min.js +1 -1
  116. package/assets/js/components/rank/rank.component.min.js +1 -1
  117. package/assets/js/components/rankings/rankings.component.min.js +3 -3
  118. package/assets/js/components/rating/rating.component.min.js +1 -1
  119. package/assets/js/components/record-card/record-card.component.min.js +1 -1
  120. package/assets/js/components/search/search.component.js +1 -0
  121. package/assets/js/components/search/search.component.min.js +2 -2
  122. package/assets/js/components/search/search.component.min.js.map +1 -1
  123. package/assets/js/components/slider/slider.component.min.js +1 -1
  124. package/assets/js/components/split-button/split-button.component.min.js +4 -4
  125. package/assets/js/components/std-address-lookup/std-address-lookup.component.min.js +2 -2
  126. package/assets/js/components/std-nav/std-nav.component.js +137 -0
  127. package/assets/js/components/std-nav/std-nav.component.min.js +63 -0
  128. package/assets/js/components/std-nav/std-nav.component.min.js.map +1 -0
  129. package/assets/js/components/table/table.component.min.js +2 -2
  130. package/assets/js/components/table-ajax/table-ajax.component.min.js +2 -2
  131. package/assets/js/components/table-basic/table-basic.component.min.js +1 -1
  132. package/assets/js/components/table-no-submit/table-no-submit.component.min.js +2 -2
  133. package/assets/js/components/table-submit/table-submit.component.min.js +2 -2
  134. package/assets/js/components/tabs/tabs.component.min.js +4 -4
  135. package/assets/js/components/tabs/tabs.component.min.js.map +1 -1
  136. package/assets/js/components/tag/tag.component.min.js +1 -1
  137. package/assets/js/components/tooltip/tooltip.component.min.js +1 -1
  138. package/assets/js/components/video/video.component.min.js +1 -1
  139. package/assets/js/components/video-card/video-card.component.min.js +2 -2
  140. package/assets/js/components/video-modal/video-modal.component.min.js +5 -5
  141. package/assets/js/components/word-count/word-count.component.min.js +1 -1
  142. package/assets/js/modules/carousel.js +16 -0
  143. package/assets/js/modules/tabs.js +8 -1
  144. package/assets/js/scripts.bundle.js +1 -1
  145. package/assets/js/scripts.bundle.min.js +1 -1
  146. package/assets/sass/components/button.component.scss +5 -0
  147. package/assets/sass/components/menu.component.scss +5 -5
  148. package/assets/sass/components/menu.global.scss +7 -0
  149. package/assets/sass/components/nav.global.scss +2 -2
  150. package/assets/sass/components/tabs.config.scss +2 -2
  151. package/assets/sass/elements/badge-tag.css +4 -0
  152. package/assets/sass/elements/buttons--special.css +1 -1
  153. package/assets/sass/elements/type.css +10 -0
  154. package/assets/sass/foundations/colours.scss +0 -1
  155. package/assets/sass/foundations/root.scss +1 -1
  156. package/assets/ts/components/button/button.component.ts +66 -0
  157. package/assets/ts/components/carousel/carousel.component.ts +15 -0
  158. package/assets/ts/components/content/content.component.ts +15 -3
  159. package/assets/ts/components/nav/nav.component.ts +1 -1
  160. package/assets/ts/components/search/search.component.ts +1 -0
  161. package/assets/ts/components/std-nav/std-nav.component.ts +179 -0
  162. package/assets/ts/modules/carousel.ts +24 -0
  163. package/assets/ts/modules/tabs.ts +10 -1
  164. package/dist/components.es.js +26 -26
  165. package/dist/components.umd.js +213 -149
  166. package/package.json +1 -1
  167. package/src/components/Button/Button.vue +20 -0
  168. package/src/components/STDNav/STDNav.vue +22 -0
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * iamKey v7.7.1--beta13
2
+ * iamKey v7.7.1--beta15
3
3
  * Copyright 2022-2026 iamproperty
4
4
  */const b=d=>{window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:d})},h=(d,r,a)=>(window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementAdded",element:r}),a.forEach(t=>{d.addEventListener(t,function(c){const s={event:t,element:r,target:c.target};Object.keys(c.detail).forEach(p=>{const o=c.detail[p];s[p]=o}),window.dataLayer.push(s)})}),!0),u=`<div class="card__head" part="head">
5
5
  <slot name="head"></slot>
@@ -17,7 +17,7 @@
17
17
  <slot name="footer"></slot>
18
18
  </div>`,v=d=>{var r;d.classList.add("card");const a=d.shadowRoot.querySelector(".card__head"),t=d.shadowRoot.querySelector(".card__body");d.hasAttribute("data-image")&&(a.innerHTML+=`<img src="${d.getAttribute("data-image")}" alt="" loading="lazy" part="image" />`),d.hasAttribute("data-total")?t?.querySelector(".card__total")?(r=t?.querySelector(".card__total"))===null||r===void 0||(r.innerHTML=d.getAttribute("data-total")):t.insertAdjacentHTML("beforeend",`<div class="card__total">${d.getAttribute("data-total")}</div>`):d.querySelector('[slot="total-icon"]')&&t.insertAdjacentHTML("beforeend",'<div class="card__total"><slot name="total-icon"></slot></div>'),d.querySelector('[slot="badges"]')?d.shadowRoot.querySelector(".card__badges").classList.remove("empty"):d.shadowRoot.querySelector(".card__badges").classList.add("empty")};class f extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"}),document.body.hasAttribute("data-assets-location")&&document.body.getAttribute("data-assets-location");const r=document.createElement("template");r.innerHTML=`
19
19
  <style>
20
- :host{inset:auto;top:anchor(bottom);left:anchor(left);position:fixed;position-try-fallbacks:flip-block,flip-inline;width:max-content !important;min-width:max-content !important;max-width:max-content !important;height:min-content;max-height:var(--menu-max-height, min(100vh - 6rem));background:var(--menu-bg, canvas);margin:var(--menu-margin, 0);padding:var(--menu-padding, 0.5rem) !important;border:var(--menu-border, 2px solid grey);overflow:auto;border:none !important;border-radius:.5rem;box-shadow:0px 2px 9px rgba(0,0,0,.1)}:host(.menu--fill){width:anchor-size(width) !important;min-width:anchor-size(width) !important;max-width:anchor-size(width) !important}:host(:popover-open),:host([popover-open]){display:block}:host(:not([popover])){position:static;display:block}:host(.menu--sm){width:10rem}:host(.menu--md){width:15rem}:host(.menu--lg){width:20rem}:host(.menu--height-sm){max-height:12.5rem}:host(.menu--height-lg){max-height:25rem}::slotted(*:is(button,a,label,span)){background:unset !important;border:unset !important;color:var(--colour-primary) !important;font-weight:inherit !important;font-family:inherit !important;font-size:1rem !important;line-height:1.1875rem !important;display:block !important;margin:var(--menu-item-margin, 0 0 0.25rem 0) !important;padding-block:var(--menu-item-padding, 0.5rem) !important;width:var(--menu-item-width, 100%) !important;max-width:var(--menu-item-width, 100%) !important;text-align:var(--menu-item-text-align, left) !important}::slotted(*:is(button,a,label)){padding-inline:var(--menu-item-padding, 0.5rem);cursor:var(--menu-item-cursor, pointer) !important}::slotted(*:is(span):first-child){padding-top:0 !important;font-weight:700 !important}::slotted(*:is(button,a,label,span):last-child){margin-bottom:0 !important}::slotted(*:is(label)){--radio-size: 1.25rem;--radio-inner-size: 0.75rem;--radio-inner-top: 0.75rem;--radio-inner-left: 0.75rem;--checkbox-tick-size: 0.75rem;--checkbox-inner-size: 0.625rem;--checkbox-inner-top: 0.375rem;--checkbox-inner-left: 0.5rem;padding-left:2.25rem}::slotted(*:is(button,a,label):is(.selected)){background:#e9f8fc !important;border-left:4px solid var(--colour-info) !important;border-radius:.25rem !important;padding-left:calc(var(--menu-item-padding, 0.5rem) - 4px) !important}@media(prefers-color-scheme: dark){::slotted(*:is(button,a,label):is(.selected):not(:hover,.hover)){color:#000 !important}}::slotted(*:is(button,a,label):is(:hover,.hover,:focus,.focus)){background:var(--colour-light) !important;border-radius:.25rem !important}::slotted(*:is(button,a,label):is(:active,.active)){background:#e0e0e0 !important;border-radius:.25rem !important}@media(prefers-color-scheme: dark){::slotted(*:is(button,a,label):is(:active,.active)){color:#000 !important}}::slotted(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}::slotted(iam-menu:not([popover])){border:none !important;border-radius:0 !important;box-shadow:none !important;padding:0;margin:0;width:auto}::slotted(iam-menu[popover]){top:anchor(top);left:calc(anchor(right) + 1rem)}/*# sourceMappingURL=assets/css/components/menu.component.css.map */
20
+ :host{inset:auto;top:anchor(bottom);left:anchor(left);position:fixed;position-try-fallbacks:flip-block,flip-inline;width:max-content !important;min-width:max-content !important;max-width:max-content !important;height:min-content;max-height:var(--menu-max-height, min(100vh - 6rem));background:var(--menu-bg, canvas);margin:var(--menu-margin, 0);padding:var(--menu-padding, 0.5rem) !important;border:var(--menu-border, 2px solid grey);overflow:auto;border:none !important;border-radius:.5rem;box-shadow:0px 2px 9px rgba(0,0,0,.1)}:host(.menu--fill){width:anchor-size(width) !important;min-width:anchor-size(width) !important;max-width:anchor-size(width) !important}:host(:popover-open),:host([popover-open]){display:block}:host(:not([popover])){position:static;display:block}:host(.menu--sm){width:10rem}:host(.menu--md){width:15rem}:host(.menu--lg){width:20rem}:host(.menu--height-sm){max-height:12.5rem}:host(.menu--height-lg){max-height:25rem}::slotted(*:is(button,a,label,span,iam-button)){background:unset !important;border:unset !important;color:var(--colour-primary) !important;font-weight:inherit !important;font-family:inherit !important;font-size:1rem !important;line-height:1.1875rem !important;display:block !important;margin:var(--menu-item-margin, 0 0 0.25rem 0) !important;padding-block:var(--menu-item-padding, 0.5rem) !important;width:var(--menu-item-width, 100%) !important;max-width:var(--menu-item-width, 100%) !important;text-align:var(--menu-item-text-align, left) !important}::slotted(*:is(button,a,label,iam-button)){padding-inline:var(--menu-item-padding, 0.5rem);cursor:var(--menu-item-cursor, pointer) !important}::slotted(*:is(span):first-child){padding-top:0 !important;font-weight:700 !important}::slotted(*:is(button,a,label,span,iam-button):last-child){margin-bottom:0 !important}::slotted(*:is(label)){--radio-size: 1.25rem;--radio-inner-size: 0.75rem;--radio-inner-top: 0.75rem;--radio-inner-left: 0.75rem;--checkbox-tick-size: 0.75rem;--checkbox-inner-size: 0.625rem;--checkbox-inner-top: 0.375rem;--checkbox-inner-left: 0.5rem;padding-left:2.25rem}::slotted(*:is(button,a,label):is(.selected)){background:#e9f8fc !important;border-left:4px solid var(--colour-info) !important;border-radius:.25rem !important;padding-left:calc(var(--menu-item-padding, 0.5rem) - 4px) !important}@media(prefers-color-scheme: dark){::slotted(*:is(button,a,label):is(.selected):not(:hover,.hover)){color:#000 !important}}::slotted(*:is(button,a,label,iam-button):is(:hover,.hover,:focus,.focus)){background:var(--colour-light) !important;border-radius:.25rem !important}::slotted(*:is(button,a,label,iam-button):is(:active,.active)){background:#e0e0e0 !important;border-radius:.25rem !important}@media(prefers-color-scheme: dark){::slotted(*:is(button,a,label):is(:active,.active)){color:#000 !important}}::slotted(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}::slotted(iam-menu:not([popover])){border:none !important;border-radius:0 !important;box-shadow:none !important;padding:0;margin:0;width:auto}::slotted(iam-menu[popover]){top:anchor(top);left:calc(anchor(right) + 1rem)}/*# sourceMappingURL=assets/css/components/menu.component.css.map */
21
21
 
22
22
  </style>
23
23
  <div class="menu--inner" part="inner">
@@ -26,7 +26,7 @@
26
26
  <style>
27
27
  ${this.hasAttribute("css")?`@import "${this.getAttribute("css")}";`:""}
28
28
 
29
- :host{--card-icon-right: 1rem;--card-head-top-padding: 2rem;--card-head-bottom-padding: 2rem;--card-footer-bottom-padding: 1.5rem;--card-head-height: 6rem;box-shadow:var(--card-box-shadow);border-radius:var(--card-border-radius);position:relative;font-weight:bold;font-size:1.125rem;line-height:1.5rem;color:var(--colour-primary);width:100%;text-align:left;display:flex;flex-direction:column;overflow:hidden;z-index:0;background:var(--colour-canvas-2);outline:2px solid var(--outline-colour, --colour-canvas-2);outline-offset:-2px;margin-bottom:2rem}:host>*{width:100%;box-sizing:border-box}:host-context(:is(a,label,button)){margin-bottom:0 !important}:host(.border-0){box-shadow:none;--card-left-padding: 0rem;outline-offset:1px !important}.card__head:has(img){min-height:var(--card-head-height);position:relative;overflow:hidden;background:rgba(0,0,0,.1);z-index:-1}.card__head:has(img)>img{position:absolute;top:0;left:0;margin:-2px;width:calc(100% + 4px);height:calc(100% + 4px);object-fit:cover}.card__body{padding:var(--card-head-top-padding) var(--card-right-padding) var(--card-head-bottom-padding) var(--card-left-padding)}.card__footer{margin-top:0;padding:0 var(--card-right-padding) 0 var(--card-left-padding)}::slotted(i){font-size:1.5rem !important;margin:-3px var(--card-icon-right) 0 0 !important;vertical-align:middle !important}::slotted(i:not(.fa-light):not(.fa-bold)){font-weight:400 !important}::slotted(.badge){margin-bottom:.375rem !important}::slotted(span:not(.badge)){display:block !important;font-weight:normal !important;font-size:1rem !important}::slotted(small){padding-top:1rem !important;display:block !important;font-weight:normal !important;padding-bottom:0 !important;color:var(--colour-body)}::slotted(span:not(.badge):not([class*=pt-])){padding-top:1.5rem !important}::slotted(:is(a,button)[slot=footer]){margin-bottom:var(--card-footer-bottom-padding) !important}.card__body:has(.card__total){--card-head-top-padding: 1rem;--card-head-bottom-padding: 1.5rem}.card__total{font-size:3rem;line-height:3rem;padding-right:1rem;margin-top:.5rem}.card__total i{font-family:var(--fa-style-family, "Font Awesome 7 Pro");font-weight:var(--fa-style, 900);display:block !important;font-size:2.5rem !important;margin:.5rem 0 .5rem 0 !important}::slotted([slot=total-icon]){display:block !important;font-size:2.5rem !important;margin:.5rem 0 .5rem 0 !important;line-height:2.5rem}.card__head:has(img)~.card__badges{position:absolute;top:0;text-align:left;left:0;z-index:9}.card__badges:not(.empty){padding:var(--card-badges-top-padding, 1rem) var(--card-right-padding) 0 var(--card-left-padding);margin-bottom:-1.5rem}.card__head:not(:has(img))~.card__badges{text-align:end}@layer elements{body:not(.js-enabled) dialog:not([open]):target{display:block}dialog,[popover]{--dialog-padding: 1.5rem;--mh-padding-inline: var(--dialog-padding);color:inherit;width:fit-content;height:fit-content;border:none;overscroll-behavior:contain;background:var(--colour-canvas-2);box-shadow:0px 2px 9px rgba(0,0,0,.11);border-radius:.625rem;padding:var(--dialog-padding);outline:var(--contrast-outline-width, 0px) solid var(--colour-primary)}dialog>*:last-child,[popover]>*:last-child{margin-bottom:0}dialog>:is(p):last-child,[popover]>:is(p):last-child{padding-bottom:0}dialog::backdrop{background:rgba(0,0,0,.3);backdrop-filter:blur(4px);overscroll-behavior:contain}dialog[open],[popover]:popover-open{display:flex;flex-direction:column}*:not(.dialog__wrapper)>dialog[open],*:not(.dialog__wrapper)>[popover]:popover-open{overflow-y:auto;width:90vw;max-width:20.25rem;max-height:min(90vh,47rem);overscroll-behavior:contain}@media screen and (min-width: 36em){*:not(.dialog__wrapper)>dialog[open],*:not(.dialog__wrapper)>[popover]:popover-open{min-width:20.9375rem;width:fit-content;max-width:42.875rem}}@media screen and (min-width: 62em){*:not(.dialog__wrapper)>dialog[open],*:not(.dialog__wrapper)>[popover]:popover-open{min-width:28.375rem;width:fit-content;max-width:46rem}}details.bg-light{margin-inline:calc(var(--dialog-padding)*-1);padding-inline:var(--dialog-padding)}}@layer elements{.dialog__wrapper{position:relative;display:inline-block;margin-bottom:calc(var(--btn-margin) - .25rem)}.dialog__wrapper:has(dialog[open],dialog:popover-open)>button{background:var(--colour-btn-secondary-bg-hover)}.dialog__wrapper:has(dialog[open],dialog:popover-open)>button:not(.btn-action){color:var(--colour-btn-secondary-hover)}.dialog__wrapper:has(dialog[open],dialog:popover-open)>button{filter:brightness(85%);transition:background .1s,color .1s;border-radius:1.5rem}.dialog__wrapper>.btn:first-child:not(.btn-compact):not([class*=fa-]):after{content:"";display:inline-block;margin-left:1em;height:1em;width:1em;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)}.dialog__wrapper>.btn:first-child[aria-expanded]:not([data-number]):after{transform:rotate(270deg)}.dialog__wrapper>.btn:first-child:has(+dialog[open]):not([data-number]):after{transform:rotate(270deg)}.dialog__wrapper>[popover]{display:var(--menu-display, none);position:fixed;top:anchor(bottom) !important;left:anchor(left) !important;position-try-fallbacks:flip-block,flip-inline !important;margin:0 0 0 .25rem;padding:1.5rem}.dialog__wrapper>[popover]::backdrop{display:none}.dialog__wrapper>[popover]:popover-open{display:block !important}.dialog__wrapper:has([popover]:popover-open)>button{background-color:var(--colour)}.dialog__wrapper>:is(dialog[open],dialog:popover-open){left:0;margin-top:-1rem;top:100%;z-index:var(--index-floating);min-width:20rem;border-radius:1rem;width:20rem}@media screen and (min-width: 36em){.dialog__wrapper>:is(dialog[open],dialog:popover-open){width:20.9375rem}}@media screen and (min-width: 62em){.dialog__wrapper>:is(dialog[open],dialog:popover-open){width:22.5rem}}.dialog__wrapper>:is(dialog[open],dialog:popover-open).dialog--list{width:fit-content !important;min-width:10rem !important;max-width:15rem !important;padding:var(--menu-padding, 0.5rem);margin:0;background:var(--menu-bg, canvas);border:var(--menu-border, 2px solid grey);overflow:auto;border:none !important;border-radius:.5rem;box-shadow:0px 2px 9px rgba(0,0,0,.1)}@media screen and (min-width: 36em){.dialog__wrapper>:is(dialog[open],dialog:popover-open).dialog--list{width:max-content !important}}.dialog__wrapper>:is(dialog[open],dialog:popover-open).dialog--list 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}.dialog__wrapper>:is(dialog[open],dialog:popover-open).dialog--list .radio--tick{margin-right:0;padding-left:1.5rem;margin-bottom:0}.dialog__wrapper>:is(dialog[open],dialog:popover-open).dialog--list .radio--tick:before{left:0;font-size:1em;top:.75rem}.dialog__wrapper>:is(dialog[open],dialog:popover-open).dialog--list a{padding:.375rem}.dialog__wrapper>:is(dialog[open],dialog:popover-open).dialog--list a:not(:hover,:focus,:active){border-color:rgba(0,0,0,0)}.dialog__wrapper>:is(dialog[open],dialog:popover-open).dialog--list a{margin:0}.dialog__wrapper>:is(dialog[open],dialog:popover-open).dialog--list a:after{display:none}.dialog__wrapper>:is(dialog[open],dialog:popover-open).dialog--list .btn-action{background:unset;border:unset;color:var(--colour-primary);font-weight:inherit;font-family:inherit;font-size:1rem;line-height:1.1875rem;display:block;margin:var(--menu-item-margin, 0 0 0.25rem 0);padding-block:var(--menu-item-padding, 0.5rem);width:var(--menu-item-width, 100%);max-width:var(--menu-item-width, 100%);text-align:var(--menu-item-text-align, left)}.dialog__wrapper>:is(dialog[open],dialog:popover-open).dialog--list .btn-action:not(:hover,:focus,:active){border-color:rgba(0,0,0,0)}.dialog__wrapper>:is(dialog[open],dialog:popover-open).dialog--list .btn-action:is(:hover,:focus){background:var(--colour-light) !important;border-radius:.25rem !important}.dialog__wrapper>:is(dialog[open],dialog:popover-open).dialog--list .btn-action:is(:active){background:#e0e0e0 !important;border-radius:.25rem !important}.dialog__wrapper>:is(dialog[open],dialog:popover-open) :is(dialog[open],dialog:popover-open){display:contents}.dialog__wrapper.dialog__wrapper--right>:is(dialog[open],dialog:popover-open){right:0;left:auto}.dialog__wrapper.dialog__wrapper--sm>:is(dialog[open],dialog:popover-open){width:14.9375rem}.dialog__wrapper.dialog__wrapper--lg>:is(dialog[open],dialog:popover-open){width:19.9375rem}@media screen and (min-width: 36em){.dialog__wrapper.dialog__wrapper--sm-left>dialog[open]{left:0;right:auto}.dialog__wrapper.dialog__wrapper--sm-right>dialog[open]{right:0;left:auto}.dialog__wrapper.dialog__wrapper--sm>dialog[open]{width:16.5625rem}.dialog__wrapper.dialog__wrapper--lg>dialog[open]{width:28.25rem}}@media screen and (min-width: 62em){.dialog__wrapper.dialog__wrapper--md-left>dialog[open]{left:0;right:auto}.dialog__wrapper.dialog__wrapper--md-right>dialog[open]{right:0;left:auto}.dialog__wrapper.dialog__wrapper--sm>dialog[open]{width:16.5625rem}.dialog__wrapper.dialog__wrapper--lg>dialog[open]{width:28.375rem}}.dialog__wrapper :is(.empty,.individual){display:none}@supports selector(:has(*)){.dialog__wrapper :is(.empty,.individual){display:inline}}.dialog__wrapper:has(input:checked) .empty,.dialog__wrapper:not(:has(input:checked)) .individual,.dialog__wrapper:has(input:checked~input:checked) .individual,.dialog__wrapper:not(:has(input:checked~input:checked)) .multiple{display:none}}@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}}}:host{--card-right-padding: 1rem;--card-icon-right: 1rem}:host(:is(:hover,:focus,.hover):not(.prevent-hover)){--hover-outline-colour-default: var(--colour, var(--colour-primary));outline:2px solid var(--hover-outline-colour, var(--hover-outline-colour-default));outline-offset:-2px}:host(:is(:active,.active):not(.prevent-hover)){--card-icon-right: var(--card-icon-right-overide, 0.5rem);outline:none}:host(.prevent-hover){pointer-events:none}:host(.prevent-hover) *{pointer-events:all}:host(.show-icon) .card__body{--card-right-padding: 3.5rem}:host(.show-icon) .card__body:before,:host(.show-icon) .card__body:after{content:"";position:absolute;right:var(--card-icon-right);bottom:var(--card-bottom-padding);height:1.5rem;width:1.5rem;background:var(--colour-warning);border-radius:50%}:host(.show-icon) .card__body:after{background:var(--colour-primary-theme);mask-image:var(--icon, var(--icon-arrow));mask-size:50%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon, var(--icon-arrow));-webkit-mask-size:50%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%;z-index:2}:host(.show-icon) .card__footer{--card-right-padding: 3.5rem}:host(:is(:hover,:focus,.hover):not(.prevent-hover):not([class*=colour-])) .card__body:before{background:var(--hover-icon-bg, var(--colour-primary-theme))}:host(:is(:hover,:focus,.hover):not(.prevent-hover):not([class*=colour-])) .card__body:after{background:var(--hover-icon-colour, #ffffff)}:host(:is(:active,.active):not(.prevent-hover):not([class*=colour-])) .card__body:before{background:var(--hover-icon-bg, var(--colour-primary-theme))}:host(:is(:active,.active):not(.prevent-hover):not([class*=colour-])) .card__body:after{background:var(--hover-icon-colour, #ffffff)}.card__body:has(.card__illustration){align-items:center;display:flex}.card__body:has(.card__illustration) .card__illustration{height:4rem;width:4rem;margin-right:1.5rem;margin-top:-1.25rem;margin-bottom:-1.25rem;position:relative}.card__body:has(.card__illustration) .card__illustration img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:contain}:host([class*=colour-]){border-left:.75rem solid var(--colour, var(--colour-primary))}slot[name=secondary]{display:block;position:absolute;top:.5rem;right:0;margin:.5rem .5rem 0 0;z-index:999}::slotted([slot=secondary]:not(:hover,:focus,:active,.hover)){background:none !important;color:var(--colour-btn) !important}::slotted([slot=checkbox]){position:absolute !important;top:.5rem;right:.5rem;width:2rem;height:2rem;height:2.5rem;overflow:hidden}.menu__wrapper{position:absolute;right:1rem;bottom:2rem;width:3rem !important;left:auto;z-index:999}.menu__wrapper>.btn:before{content:"\uF142";font-family:"Font Awesome 7 Pro"}::slotted([slot=btns]){border:none !important;margin:0 !important;display:block !important;width:fit-content}::slotted([slot=primary-action]){overflow:hidden;background-color:rgba(0,0,0,0);text-indent:-300%;position:absolute !important;inset:0;margin:0 !important;z-index:99;border:none}:host(:not(.prevent-hover)) ::slotted([slot=primary-action]:is(:hover,:focus,.hover)){--hover-outline-colour-default: var(--colour, var(--colour-primary));outline:2px solid var(--hover-outline-colour, var(--hover-outline-colour-default));outline-offset:-2px;border-radius:var(--card-border-radius) !important}/*# sourceMappingURL=assets/css/components/card.component.css.map */
29
+ :host{--card-icon-right: 1rem;--card-head-top-padding: 2rem;--card-head-bottom-padding: 2rem;--card-footer-bottom-padding: 1.5rem;--card-head-height: 6rem;box-shadow:var(--card-box-shadow);border-radius:var(--card-border-radius);position:relative;font-weight:bold;font-size:1.125rem;line-height:1.5rem;color:var(--colour-primary);width:100%;text-align:left;display:flex;flex-direction:column;overflow:hidden;z-index:0;background:var(--colour-canvas-2);outline:2px solid var(--outline-colour, --colour-canvas-2);outline-offset:-2px;margin-bottom:2rem}:host>*{width:100%;box-sizing:border-box}:host-context(:is(a,label,button)){margin-bottom:0 !important}:host(.border-0){box-shadow:none;--card-left-padding: 0rem;outline-offset:1px !important}.card__head:has(img){min-height:var(--card-head-height);position:relative;overflow:hidden;background:rgba(0,0,0,.1);z-index:-1}.card__head:has(img)>img{position:absolute;top:0;left:0;margin:-2px;width:calc(100% + 4px);height:calc(100% + 4px);object-fit:cover}.card__body{padding:var(--card-head-top-padding) var(--card-right-padding) var(--card-head-bottom-padding) var(--card-left-padding)}.card__footer{margin-top:0;padding:0 var(--card-right-padding) 0 var(--card-left-padding)}::slotted(i){font-size:1.5rem !important;margin:-3px var(--card-icon-right) 0 0 !important;vertical-align:middle !important}::slotted(i:not(.fa-light):not(.fa-bold)){font-weight:400 !important}::slotted(.badge){margin-bottom:.375rem !important}::slotted(span:not(.badge)){display:block !important;font-weight:normal !important;font-size:1rem !important}::slotted(small){padding-top:1rem !important;display:block !important;font-weight:normal !important;padding-bottom:0 !important;color:var(--colour-body)}::slotted(span:not(.badge):not([class*=pt-])){padding-top:1.5rem !important}::slotted(:is(a,button)[slot=footer]){margin-bottom:var(--card-footer-bottom-padding) !important}.card__body:has(.card__total){--card-head-top-padding: 1rem;--card-head-bottom-padding: 1.5rem}.card__total{font-size:3rem;line-height:3rem;padding-right:1rem;margin-top:.5rem}.card__total i{font-family:var(--fa-style-family, "Font Awesome 7 Pro");font-weight:var(--fa-style, 900);display:block !important;font-size:2.5rem !important;margin:.5rem 0 .5rem 0 !important}::slotted([slot=total-icon]){display:block !important;font-size:2.5rem !important;margin:.5rem 0 .5rem 0 !important;line-height:2.5rem}.card__head:has(img)~.card__badges{position:absolute;top:0;text-align:left;left:0;z-index:9}.card__badges:not(.empty){padding:var(--card-badges-top-padding, 1rem) var(--card-right-padding) 0 var(--card-left-padding);margin-bottom:-1.5rem}.card__head:not(:has(img))~.card__badges{text-align:end}@layer elements{body:not(.js-enabled) dialog:not([open]):target{display:block}dialog,[popover]{--dialog-padding: 1.5rem;--mh-padding-inline: var(--dialog-padding);color:inherit;width:fit-content;height:fit-content;border:none;overscroll-behavior:contain;background:var(--colour-canvas-2);box-shadow:0px 2px 9px rgba(0,0,0,.11);border-radius:.625rem;padding:var(--dialog-padding);outline:var(--contrast-outline-width, 0px) solid var(--colour-primary)}dialog>*:last-child,[popover]>*:last-child{margin-bottom:0}dialog>:is(p):last-child,[popover]>:is(p):last-child{padding-bottom:0}dialog::backdrop{background:rgba(0,0,0,.3);backdrop-filter:blur(4px);overscroll-behavior:contain}dialog[open],[popover]:popover-open{display:flex;flex-direction:column}*:not(.dialog__wrapper)>dialog[open],*:not(.dialog__wrapper)>[popover]:popover-open{overflow-y:auto;width:90vw;max-width:20.25rem;max-height:min(90vh,47rem);overscroll-behavior:contain}@media screen and (min-width: 36em){*:not(.dialog__wrapper)>dialog[open],*:not(.dialog__wrapper)>[popover]:popover-open{min-width:20.9375rem;width:fit-content;max-width:42.875rem}}@media screen and (min-width: 62em){*:not(.dialog__wrapper)>dialog[open],*:not(.dialog__wrapper)>[popover]:popover-open{min-width:28.375rem;width:fit-content;max-width:46rem}}details.bg-light{margin-inline:calc(var(--dialog-padding)*-1);padding-inline:var(--dialog-padding)}}@layer elements{.dialog__wrapper{position:relative;display:inline-block;margin-bottom:calc(var(--btn-margin) - .25rem)}.dialog__wrapper:has(dialog[open],dialog:popover-open)>button{background:var(--colour-btn-secondary-bg-hover)}.dialog__wrapper:has(dialog[open],dialog:popover-open)>button:not(.btn-action){color:var(--colour-btn-secondary-hover)}.dialog__wrapper:has(dialog[open],dialog:popover-open)>button{filter:brightness(85%);transition:background .1s,color .1s;border-radius:1.5rem}.dialog__wrapper>.btn:first-child:not(.btn-compact):not([class*=fa-]):after{content:"";display:inline-block;margin-left:1em;height:1em;width:1em;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)}.dialog__wrapper>.btn:first-child[aria-expanded]:not([data-number]):after{transform:rotate(270deg)}.dialog__wrapper>.btn:first-child:has(+dialog[open]):not([data-number]):after{transform:rotate(270deg)}.dialog__wrapper>[popover]{display:var(--menu-display, none);position:fixed;top:anchor(bottom) !important;left:anchor(left) !important;position-try-fallbacks:flip-block,flip-inline !important;margin:0 0 0 .25rem;padding:1.5rem}.dialog__wrapper>[popover]::backdrop{display:none}.dialog__wrapper>[popover]:popover-open{display:block !important}.dialog__wrapper:has([popover]:popover-open)>button{background-color:var(--colour)}.dialog__wrapper>:is(dialog[open],dialog:popover-open){left:0;margin-top:-1rem;top:100%;z-index:var(--index-floating);min-width:20rem;border-radius:1rem;width:20rem}@media screen and (min-width: 36em){.dialog__wrapper>:is(dialog[open],dialog:popover-open){width:20.9375rem}}@media screen and (min-width: 62em){.dialog__wrapper>:is(dialog[open],dialog:popover-open){width:22.5rem}}.dialog__wrapper>:is(dialog[open],dialog:popover-open).dialog--list{width:fit-content !important;min-width:10rem !important;max-width:15rem !important;padding:var(--menu-padding, 0.5rem);margin:0;background:var(--menu-bg, canvas);border:var(--menu-border, 2px solid grey);overflow:auto;border:none !important;border-radius:.5rem;box-shadow:0px 2px 9px rgba(0,0,0,.1)}@media screen and (min-width: 36em){.dialog__wrapper>:is(dialog[open],dialog:popover-open).dialog--list{width:max-content !important}}.dialog__wrapper>:is(dialog[open],dialog:popover-open).dialog--list 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}.dialog__wrapper>:is(dialog[open],dialog:popover-open).dialog--list .radio--tick{margin-right:0;padding-left:1.5rem;margin-bottom:0}.dialog__wrapper>:is(dialog[open],dialog:popover-open).dialog--list .radio--tick:before{left:0;font-size:1em;top:.75rem}.dialog__wrapper>:is(dialog[open],dialog:popover-open).dialog--list a{padding:.375rem}.dialog__wrapper>:is(dialog[open],dialog:popover-open).dialog--list a:not(:hover,:focus,:active){border-color:rgba(0,0,0,0)}.dialog__wrapper>:is(dialog[open],dialog:popover-open).dialog--list a{margin:0}.dialog__wrapper>:is(dialog[open],dialog:popover-open).dialog--list a:after{display:none}.dialog__wrapper>:is(dialog[open],dialog:popover-open).dialog--list .btn-action{background:unset;border:unset;color:var(--colour-primary);font-weight:inherit;font-family:inherit;font-size:1rem;line-height:1.1875rem;display:block;margin:var(--menu-item-margin, 0 0 0.25rem 0);padding-block:var(--menu-item-padding, 0.5rem);width:var(--menu-item-width, 100%);max-width:var(--menu-item-width, 100%);text-align:var(--menu-item-text-align, left)}.dialog__wrapper>:is(dialog[open],dialog:popover-open).dialog--list .btn-action:not(:hover,:focus,:active){border-color:rgba(0,0,0,0)}.dialog__wrapper>:is(dialog[open],dialog:popover-open).dialog--list .btn-action:is(:hover,:focus){background:var(--colour-light) !important;border-radius:.25rem !important}.dialog__wrapper>:is(dialog[open],dialog:popover-open).dialog--list .btn-action:is(:active){background:#e0e0e0 !important;border-radius:.25rem !important}.dialog__wrapper>:is(dialog[open],dialog:popover-open) :is(dialog[open],dialog:popover-open){display:contents}.dialog__wrapper.dialog__wrapper--right>:is(dialog[open],dialog:popover-open){right:0;left:auto}.dialog__wrapper.dialog__wrapper--sm>:is(dialog[open],dialog:popover-open){width:14.9375rem}.dialog__wrapper.dialog__wrapper--lg>:is(dialog[open],dialog:popover-open){width:19.9375rem}@media screen and (min-width: 36em){.dialog__wrapper.dialog__wrapper--sm-left>dialog[open]{left:0;right:auto}.dialog__wrapper.dialog__wrapper--sm-right>dialog[open]{right:0;left:auto}.dialog__wrapper.dialog__wrapper--sm>dialog[open]{width:16.5625rem}.dialog__wrapper.dialog__wrapper--lg>dialog[open]{width:28.25rem}}@media screen and (min-width: 62em){.dialog__wrapper.dialog__wrapper--md-left>dialog[open]{left:0;right:auto}.dialog__wrapper.dialog__wrapper--md-right>dialog[open]{right:0;left:auto}.dialog__wrapper.dialog__wrapper--sm>dialog[open]{width:16.5625rem}.dialog__wrapper.dialog__wrapper--lg>dialog[open]{width:28.375rem}}.dialog__wrapper :is(.empty,.individual){display:none}@supports selector(:has(*)){.dialog__wrapper :is(.empty,.individual){display:inline}}.dialog__wrapper:has(input:checked) .empty,.dialog__wrapper:not(:has(input:checked)) .individual,.dialog__wrapper:has(input:checked~input:checked) .individual,.dialog__wrapper:not(:has(input:checked~input:checked)) .multiple{display:none}}@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}}}:host{--card-right-padding: 1rem;--card-icon-right: 1rem}:host(:is(:hover,:focus,.hover):not(.prevent-hover)){--hover-outline-colour-default: var(--colour, var(--colour-primary));outline:2px solid var(--hover-outline-colour, var(--hover-outline-colour-default));outline-offset:-2px}:host(:is(:active,.active):not(.prevent-hover)){--card-icon-right: var(--card-icon-right-overide, 0.5rem);outline:none}:host(.prevent-hover){pointer-events:none}:host(.prevent-hover) *{pointer-events:all}:host(.show-icon) .card__body{--card-right-padding: 3.5rem}:host(.show-icon) .card__body:before,:host(.show-icon) .card__body:after{content:"";position:absolute;right:var(--card-icon-right);bottom:var(--card-bottom-padding);height:1.5rem;width:1.5rem;background:var(--colour-warning);border-radius:50%}:host(.show-icon) .card__body:after{background:var(--colour-primary-theme);mask-image:var(--icon, var(--icon-arrow));mask-size:50%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon, var(--icon-arrow));-webkit-mask-size:50%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%;z-index:2}:host(.show-icon) .card__footer{--card-right-padding: 3.5rem}:host(:is(:hover,:focus,.hover):not(.prevent-hover):not([class*=colour-])) .card__body:before{background:var(--hover-icon-bg, var(--colour-primary-theme))}:host(:is(:hover,:focus,.hover):not(.prevent-hover):not([class*=colour-])) .card__body:after{background:var(--hover-icon-colour, #ffffff)}:host(:is(:active,.active):not(.prevent-hover):not([class*=colour-])) .card__body:before{background:var(--hover-icon-bg, var(--colour-primary-theme))}:host(:is(:active,.active):not(.prevent-hover):not([class*=colour-])) .card__body:after{background:var(--hover-icon-colour, #ffffff)}.card__body:has(.card__illustration){align-items:center;display:flex}.card__body:has(.card__illustration) .card__illustration{height:4rem;width:4rem;margin-right:1.5rem;margin-top:-1.25rem;margin-bottom:-1.25rem;position:relative}.card__body:has(.card__illustration) .card__illustration img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:contain}:host([class*=colour-]){border-left:.75rem solid var(--colour, var(--colour-primary))}slot[name=secondary]{display:block;position:absolute;top:.5rem;right:0;margin:.5rem .5rem 0 0;z-index:999}::slotted([slot=secondary]:not(:hover,:focus,:active,.hover)){background:none !important;color:var(--colour-btn) !important}::slotted([slot=checkbox]){position:absolute !important;top:.5rem;right:.5rem;width:2rem;height:2rem;height:2.5rem;overflow:hidden}.menu__wrapper{position:absolute;right:1rem;bottom:2rem;width:3rem !important;left:auto;z-index:999}.menu__wrapper>.btn:before{content:"\uF142";font-family:"Font Awesome 7 Pro"}::slotted([slot=btns]){border:none !important;margin:0 !important;display:block !important;width:fit-content}::slotted([slot=primary-action]){overflow:hidden;background-color:rgba(0,0,0,0);text-indent:-300%;position:absolute !important;inset:0;margin:0 !important;z-index:99;border:none}:host(:not(.prevent-hover)) ::slotted([slot=primary-action]:is(:hover,:focus,.hover)){--hover-outline-colour-default: var(--colour, var(--colour-primary));outline:2px solid var(--hover-outline-colour, var(--hover-outline-colour-default));outline-offset:-2px;border-radius:var(--card-border-radius) !important}/*# sourceMappingURL=assets/css/components/card.component.css.map */
30
30
 
31
31
  </style>
32
32
  ${u}
@@ -1,4 +1,4 @@
1
- import { generateThumbnailList, generatePipsHTML, carousel } from '../../modules/carousel';
1
+ import { generateThumbnailList, generatePipsHTML, carousel, updateCarousel } from '../../modules/carousel';
2
2
  import { trackComponent, trackComponentRegistered } from '../_global';
3
3
  trackComponentRegistered('iam-carousel');
4
4
  class iamCarousel extends HTMLElement {
@@ -61,6 +61,17 @@ class iamCarousel extends HTMLElement {
61
61
  image.closest('div').classList.add('image__wrapper');
62
62
  });
63
63
  carousel(carouselComponent);
64
+ const observer = new MutationObserver(function (mutations) {
65
+ mutations.forEach(function (mutationRecord) {
66
+ const targetElement = mutationRecord.target;
67
+ updateCarousel(targetElement);
68
+ });
69
+ });
70
+ observer.observe(carouselComponent, {
71
+ attributes: false,
72
+ childList: true,
73
+ subtree: true,
74
+ });
64
75
  trackComponent(carouselComponent, 'iam-carousel', [
65
76
  'pip-clicked',
66
77
  'next-clicked',
@@ -1,9 +1,9 @@
1
1
  /*!
2
- * iamKey v7.7.1--beta13
2
+ * iamKey v7.7.1--beta15
3
3
  * Copyright 2022-2026 iamproperty
4
- */const M=function(e){const t=[];return Array.from(e.querySelectorAll(":scope > div")).forEach((n,o)=>{n.hasAttribute("data-thumbnail")&&(t[o]=n.getAttribute("data-thumbnail"))}),t},W=function(e,t){const n=e.querySelectorAll(":scope > div").length;let o="";for(let a=1;a<=n;a++){let r=null,i="";t.length&&t[a-1]?(i="has-thumbnail",r=`<img src="${t[a-1]}" alt="Slide ${a}" height="148"/>`):r=`Slide ${a}`,o+=`<button class="control-${a} ${i}" data-slide="${a}" ${a==1?"aria-current":""}>${r}</button>`}return o},x=function(e,t){return t==1?e:Math.ceil(e/t)*t-t+1},z=function(e,t){return(e-1)/(t-1)*100},P=function(e){let t;const n=e.shadowRoot.querySelector(".carousel"),o=n.querySelector(".carousel__inner"),a=n.querySelector(".carousel__controls"),r=n.querySelector('.carousel__progress [type="range"]'),i=e.querySelectorAll(":scope > div").length;let p=o.clientWidth,y=e.querySelector(":scope > div").scrollWidth,g=Math.round(p/y);r.setAttribute("min",1),r.setAttribute("step",g);let h=x(i,g);r.setAttribute("max",h),r.value=1;let u=z(1,h);r.style.setProperty("--percent",u+"%");let f,A="mouseup",L="mousedown";"ontouchstart"in document.documentElement&&(A="touchend",L="touchstart"),o.addEventListener("scroll",function(){clearTimeout(t),t=setTimeout(function(){const c=o.clientWidth,s=o.scrollWidth,b=o.scrollLeft;let l=Math.round(b/s*i)+1;const v=e.querySelector(":scope > div").scrollWidth,w=e.querySelector(":scope > div:last-child").offsetLeft,_=o.scrollLeft+c+o.getBoundingClientRect().left>=w+60,m=Math.round(c/v),k=Math.ceil(i/m)*m-i;r.setAttribute("step",m),k>0&&_&&(l=Math.floor(i/m)*m+1),Array.from(n.querySelectorAll(".carousel__controls button")).forEach(d=>{d.removeAttribute("aria-current")}),n.querySelector(".control-"+l).setAttribute("aria-current",!0),l==1?n.querySelector(".btn-prev").setAttribute("disabled","disabled"):n.querySelector(".btn-prev").removeAttribute("disabled"),l>i-m?n.querySelector(".btn-next").setAttribute("disabled","disabled"):n.querySelector(".btn-next").removeAttribute("disabled"),r.value=l,h=x(i,m),r.setAttribute("max",h),u=l/h*100,u=z(l,h),r.style.setProperty("--percent",u+"%")},100)},!1),a.addEventListener("click",function(c){for(let s=c.target;s&&s!=this;s=s.parentNode)if(typeof s.matches=="function"&&s.matches("button")){c.preventDefault(),Array.from(a.querySelectorAll("button")).forEach(v=>{v.removeAttribute("aria-current")}),s.setAttribute("aria-current",!0);const b=new CustomEvent("pip-clicked",{detail:{slide:s.getAttribute("data-slide")}});e.dispatchEvent(b);const l=e.querySelector(`:scope > *:nth-child(${s.getAttribute("data-slide")})`);o.scroll({top:0,left:l.offsetLeft-o.getBoundingClientRect().left,behavior:"smooth"});break}},!1),n.addEventListener("click",function(c){const s=o.clientWidth,b=e.querySelector(":scope > div").scrollWidth,l=Math.round(s/b),v=e.querySelector(":scope > div:last-child").offsetLeft,w=o.scrollLeft+s+o.getBoundingClientRect().left>=v+60,_=Math.ceil(i/l)*l-i,m=l-_,k=w&&_>0?m*b:o.clientWidth;for(let d=c.target;d&&d!=this;d=d.parentNode)if(typeof d.matches=="function"&&d.matches(".btn-next, .btn-prev")){const S=d.matches(".btn-next")?"next":"prev",E=new CustomEvent(`${S}-clicked`,{detail:{slide:d.getAttribute("data-go")}});e.dispatchEvent(E),c.preventDefault();const q=d.classList.contains("btn-prev")?o.scrollLeft-k:o.scrollLeft+o.clientWidth;o.scroll({top:0,left:q,behavior:"smooth"});break}},!1),r.addEventListener(L,function(){clearInterval(f),f=setInterval(function(){p=o.clientWidth,y=e.querySelector(":scope > div").scrollWidth,g=Math.round(p/y),r.setAttribute("step",g),h=x(i,g),r.setAttribute("max",h),u=z(r.value,h),r.style.setProperty("--percent",u+"%")},10)}),r.addEventListener(A,function(){clearInterval(f)}),r.addEventListener("change",function(){clearInterval(f);const c=e.querySelector(`:scope > *:nth-child(${r.value})`);o.scroll({top:0,left:c?c.offsetLeft-o.getBoundingClientRect().left:0,behavior:"smooth"});const s=new CustomEvent("slider-changed",{detail:{slide:r.value}});e.dispatchEvent(s)},!1)},$=e=>{window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:e})},C=(e,t,n)=>(window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementAdded",element:t}),n.forEach(o=>{e.addEventListener(o,function(a){const r={event:o,element:t,target:a.target};Object.keys(a.detail).forEach(i=>{const p=a.detail[i];r[i]=p}),window.dataLayer.push(r)})}),!0);$("iam-carousel");class I extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"}),document.body.hasAttribute("data-assets-location")&&document.body.getAttribute("data-assets-location");const t=document.createElement("template");t.innerHTML=`
4
+ */const W=function(o){const e=[];return Array.from(o.querySelectorAll(":scope > div")).forEach((a,r)=>{a.hasAttribute("data-thumbnail")&&(e[r]=a.getAttribute("data-thumbnail"))}),e},L=function(o,e){const a=o.querySelectorAll(":scope > div").length;let r="";for(let n=1;n<=a;n++){let t=null,i="";e.length&&e[n-1]?(i="has-thumbnail",t=`<img src="${e[n-1]}" alt="Slide ${n}" height="148"/>`):t=`Slide ${n}`,r+=`<button class="control-${n} ${i}" data-slide="${n}" ${n==1?"aria-current":""}>${t}</button>`}return r},w=function(o,e){return e==1?o:Math.ceil(o/e)*e-e+1},k=function(o,e){return(o-1)/(e-1)*100},P=function(o){let e;const a=o.shadowRoot.querySelector(".carousel"),r=a.querySelector(".carousel__inner"),n=a.querySelector(".carousel__controls"),t=a.querySelector('.carousel__progress [type="range"]'),i=o.querySelectorAll(":scope > div").length;let u=r.clientWidth,p=o.querySelector(":scope > div").scrollWidth,b=Math.round(u/p);t.setAttribute("min",1),t.setAttribute("step",b);let c=w(i,b);t.setAttribute("max",c),t.value=1;let g=k(1,c);t.style.setProperty("--percent",g+"%");let _,A="mouseup",S="mousedown";"ontouchstart"in document.documentElement&&(A="touchend",S="touchstart"),r.addEventListener("scroll",function(){clearTimeout(e),e=setTimeout(function(){const d=r.clientWidth,s=r.scrollWidth,v=r.scrollLeft;let l=Math.round(v/s*i)+1;const f=o.querySelector(":scope > div").scrollWidth,x=o.querySelector(":scope > div:last-child").offsetLeft,y=r.scrollLeft+d+r.getBoundingClientRect().left>=x+60,m=Math.round(d/f),z=Math.ceil(i/m)*m-i;t.setAttribute("step",m),z>0&&y&&(l=Math.floor(i/m)*m+1),Array.from(a.querySelectorAll(".carousel__controls button")).forEach(h=>{h.removeAttribute("aria-current")}),a.querySelector(".control-"+l).setAttribute("aria-current",!0),l==1?a.querySelector(".btn-prev").setAttribute("disabled","disabled"):a.querySelector(".btn-prev").removeAttribute("disabled"),l>i-m?a.querySelector(".btn-next").setAttribute("disabled","disabled"):a.querySelector(".btn-next").removeAttribute("disabled"),t.value=l,c=w(i,m),t.setAttribute("max",c),g=l/c*100,g=k(l,c),t.style.setProperty("--percent",g+"%")},100)},!1),n.addEventListener("click",function(d){for(let s=d.target;s&&s!=this;s=s.parentNode)if(typeof s.matches=="function"&&s.matches("button")){d.preventDefault(),Array.from(n.querySelectorAll("button")).forEach(f=>{f.removeAttribute("aria-current")}),s.setAttribute("aria-current",!0);const v=new CustomEvent("pip-clicked",{detail:{slide:s.getAttribute("data-slide")}});o.dispatchEvent(v);const l=o.querySelector(`:scope > *:nth-child(${s.getAttribute("data-slide")})`);r.scroll({top:0,left:l.offsetLeft-r.getBoundingClientRect().left,behavior:"smooth"});break}},!1),a.addEventListener("click",function(d){const s=r.clientWidth,v=o.querySelector(":scope > div").scrollWidth,l=Math.round(s/v),f=o.querySelector(":scope > div:last-child").offsetLeft,x=r.scrollLeft+s+r.getBoundingClientRect().left>=f+60,y=Math.ceil(i/l)*l-i,m=l-y,z=x&&y>0?m*v:r.clientWidth;for(let h=d.target;h&&h!=this;h=h.parentNode)if(typeof h.matches=="function"&&h.matches(".btn-next, .btn-prev")){const E=h.matches(".btn-next")?"next":"prev",q=new CustomEvent(`${E}-clicked`,{detail:{slide:h.getAttribute("data-go")}});o.dispatchEvent(q),d.preventDefault();const M=h.classList.contains("btn-prev")?r.scrollLeft-z:r.scrollLeft+r.clientWidth;r.scroll({top:0,left:M,behavior:"smooth"});break}},!1),t.addEventListener(S,function(){clearInterval(_),_=setInterval(function(){u=r.clientWidth,p=o.querySelector(":scope > div").scrollWidth,b=Math.round(u/p),t.setAttribute("step",b),c=w(i,b),t.setAttribute("max",c),g=k(t.value,c),t.style.setProperty("--percent",g+"%")},10)}),t.addEventListener(A,function(){clearInterval(_)}),t.addEventListener("change",function(){clearInterval(_);const d=o.querySelector(`:scope > *:nth-child(${t.value})`);r.scroll({top:0,left:d?d.offsetLeft-r.getBoundingClientRect().left:0,behavior:"smooth"});const s=new CustomEvent("slider-changed",{detail:{slide:t.value}});o.dispatchEvent(s)},!1)},I=function(o){const e=o.shadowRoot.querySelector(".carousel"),a=e.querySelector(".carousel__inner"),r=e.querySelector(".carousel__controls"),n=e.querySelector('.carousel__progress [type="range"]'),t=o.querySelectorAll(":scope > div").length;let i=a.clientWidth,u=o.querySelector(":scope > div").scrollWidth,p=Math.round(i/u);n.setAttribute("min",1),n.setAttribute("step",p);let b=w(t,p);n.setAttribute("max",b),n.value=1;let c=k(1,b);n.style.setProperty("--percent",c+"%"),r.innerHTML=L(o,[])},$=o=>{window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:o})},C=(o,e,a)=>(window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementAdded",element:e}),a.forEach(r=>{o.addEventListener(r,function(n){const t={event:r,element:e,target:n.target};Object.keys(n.detail).forEach(i=>{const u=n.detail[i];t[i]=u}),window.dataLayer.push(t)})}),!0);$("iam-carousel");class R extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"}),document.body.hasAttribute("data-assets-location")&&document.body.getAttribute("data-assets-location");const e=document.createElement("template");e.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:block;overflow:visible;container-type:inline-size}.carousel{margin-inline:calc(var(--carousel-spacing, 1.5rem)*-1);margin-bottom:2rem;display:block;overflow:visible}.carousel .carousel__wrapper{position:relative;overflow-x:clip}.carousel .carousel__inner{--gutter-x: 1rem;overflow-x:auto;padding-bottom:1rem;scroll-snap-type:x mandatory}.carousel .carousel__content{display:flex;flex-wrap:nowrap !important;margin-inline-end:0;padding-inline-start:var(--carousel-spacing, 1.5rem);padding-inline-end:var(--carousel-spacing, 1.5rem);margin-right:calc(-0.5*var(--gutter-x));margin-left:calc(-0.5*var(--gutter-x))}.carousel .col>*:last-child{margin-bottom:0;padding-bottom:0}::slotted(div){scroll-snap-align:start;scroll-margin-left:calc(var(--carousel-spacing, 1.5rem) - .5rem);flex-shrink:0;width:calc(100% + var(--last-item-extra, 0px));padding-right:.5rem;padding-left:.5rem;margin-top:var(--gutter-y)}::slotted(div:last-child){padding-inline-end:1.5rem;--last-item-extra: 1rem}@container (min-width: 36em){.carousel{margin-inline:calc(var(--carousel-spacing, 2.5rem)*-1)}.carousel .carousel__content{padding-inline-start:var(--carousel-spacing, 2.5rem);padding-inline-end:var(--carousel-spacing, 2.5rem)}:host([data-smcols]) ::slotted(div){scroll-snap-align:unset;flex:0 0 auto}:host([data-smcols="2"]) ::slotted(div){width:calc(50% + var(--last-item-extra, 0px))}:host([data-smcols="3"]) ::slotted(div){width:calc(33.3333333333% + var(--last-item-extra, 0px))}:host([data-smcols="4"]) ::slotted(div){width:calc(25% + var(--last-item-extra, 0px))}:host([data-smcols="2"]) ::slotted(div:nth-child(odd)),:host([data-smcols="3"]) ::slotted(div:nth-child(3n+1)),:host([data-smcols="4"]) ::slotted(div:nth-child(4n+1)){scroll-snap-align:start}::slotted(div){scroll-margin-left:calc(var(--carousel-spacing, 2.5rem) - .5rem)}::slotted(div:last-child){padding-inline-end:2.5rem;--last-item-extra: 2rem}}@container (min-width: 62em){.carousel{margin-inline:0;position:relative}.carousel__wrapper{overflow:hidden;margin-inline:-0.5rem}.carousel__content{padding-inline:0 !important;margin-inline:0 !important}::slotted(div){margin-left:0;scroll-margin-left:0}::slotted(div:last-child){padding-inline-end:.5rem;--last-item-extra: 0px}:host([data-mdcols]) ::slotted(div){scroll-snap-align:unset;flex:0 0 auto}:host([data-mdcols="2"]) ::slotted(div){width:calc(50% + var(--last-item-extra, 0px))}:host([data-mdcols="3"]) ::slotted(div){width:calc(33.3333333333% + var(--last-item-extra, 0px))}:host([data-mdcols="4"]) ::slotted(div){width:calc(25% + var(--last-item-extra, 0px))}:host([data-mdcols="5"]) ::slotted(div){width:calc(20% + var(--last-item-extra, 0px))}:host([data-mdcols="6"]) ::slotted(div){width:calc(16.6666666667% + var(--last-item-extra, 0px))}:host([data-mdcols="2"]) ::slotted(div:nth-child(odd)),:host([data-mdcols="3"]) ::slotted(div:nth-child(3n+1)),:host([data-mdcols="4"]) ::slotted(div:nth-child(4n+1)),:host([data-mdcols="5"]) ::slotted(div:nth-child(5n+1)),:host([data-mdcols="6"]) ::slotted(div:nth-child(6n+1)){scroll-snap-align:start}}.carousel__inner{scrollbar-width:none;-ms-overflow-style:none}.carousel__inner::-webkit-scrollbar{display:none}.carousel__btns{text-align:center;padding-bottom:.5rem}.btn-next,.btn-prev{margin:0 !important}.btn-next:after,.btn-prev:after{content:"";position:absolute;right:0;top:0;height:100%;width:100%;background:currentColor;mask-image:var(--icon-arrow);mask-size:50%;mask-repeat:no-repeat;mask-position:50% 60%;-webkit-mask-image:var(--icon-arrow);-webkit-mask-size:50%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:55% 50%;transform:rotate(0deg)}.btn-prev:after{transform:rotate(180deg)}@container (min-width: 62em){.carousel__btns{padding-bottom:0}.btn-prev{position:absolute;top:50%;left:0;margin:-2rem 0 0 -3rem !important}.btn-next{position:absolute;top:50%;right:0;margin:-2rem -3rem 0 0 !important}}.carousel .carousel__controls{overflow:hidden;margin-inline:auto;margin-bottom:1rem;text-align:center;max-width:30rem}@container (min-width: 36em){.carousel .carousel__controls{width:100%}}.carousel .carousel__controls button{padding:0;margin:0 .2rem .2rem;border:none}.carousel .carousel__controls button{width:.5rem;height:.5rem;min-height:.5rem;border-radius:50%;text-indent:-50rem;overflow:hidden;background:#a5ecfd;margin-inline:.375rem;cursor:pointer;border:none}.carousel .carousel__controls button:hover{background-color:var(--colour-info)}.carousel .carousel__controls button:before{display:none}.carousel .carousel__controls button:first-child:last-child{display:none}.carousel__controls>button[aria-current]{--colour-active-thumbnail: var(--colour-info);border-color:var(--colour-active-thumbnail);background:var(--colour-info);width:1rem;height:1rem;min-height:1rem;margin-inline:.125rem}.carousel__controls>button[aria-current]:hover{background:var(--colour-info)}.carousel__progress{text-align:center;margin-bottom:1rem;display:none}input[type=range]{--track-size: 0.5rem;--track-colour: #a5ecfd;--thumb-colour: var(--colour-info);--thumb-size: 1rem;--thumb-size-outline: 0;width:90%;max-width:10.75rem;background:rgba(0,0,0,0);cursor:pointer;margin:0;height:1rem;border-radius:50%;accent-color:var(--thumb-colour);-webkit-appearance:none;appearance:none}input[type=range]::-webkit-slider-runnable-track{background:var(--track-colour);height:var(--track-size);border-radius:.5625rem}input[type=range]::-moz-range-track{background:var(--track-colour);height:var(--track-size);border-radius:.5625rem}input[type=range]::-webkit-slider-runnable-track{background:linear-gradient(to right, var(--track-colour), var(--track-colour) var(--start-percent, 0%), var(--thumb-colour) var(--start-percent, 0%), var(--thumb-colour) calc(var(--percent, 0%)), var(--track-colour) calc(var(--percent, 0%)))}input[type=range]::-moz-range-track{background:linear-gradient(to right, var(--track-colour), var(--track-colour) var(--start-percent, 0%), var(--thumb-colour) var(--start-percent, 0%), var(--thumb-colour) calc(var(--percent, 0%)), var(--track-colour) calc(var(--percent, 0%)))}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;margin-top:-0.25rem;background-color:var(--thumb-colour);height:var(--thumb-size);width:var(--thumb-size);border-radius:50%;position:relative;z-index:99;pointer-events:all}input[type=range]::-moz-range-thumb{border:none;background-color:var(--thumb-colour);height:var(--thumb-size);width:var(--thumb-size);border-radius:50%;position:relative;z-index:99;pointer-events:all}input[type=range]:focus{outline:none}input[type=range]:hover::-webkit-slider-thumb,input[type=range]:focus::-webkit-slider-thumb{outline:var(--thumb-size-outline) solid var(--thumb-colour)}input[type=range]:active::-webkit-slider-thumb{outline:var(--thumb-size-outline) solid var(--thumb-colour)}input[type=range]:hover::-moz-range-thumb,input[type=range]:focus::-moz-range-thumb{outline:var(--thumb-size-outline) solid var(--thumb-colour)}input[type=range]:focus::-moz-range-thumb{outline:var(--thumb-size-outline) solid var(--thumb-colour)}.carousel__btns:has(~.carousel__controls button:first-child:nth-child(1):last-child){display:none}.carousel__controls:has(button:nth-child(5)){display:none}.carousel__controls:has(button:nth-child(5))~.carousel__progress{display:block}@container (min-width: 36em){:host([data-smcols="2"]) .carousel__controls>button:not(:nth-child(odd)),:host([data-smcols="3"]) .carousel__controls>button:not(:nth-child(3n+1)),:host([data-smcols="4"]) .carousel__controls>button:not(:nth-child(4n+1)){display:none}:host([data-smcols="2"]) .carousel__controls:has(button:first-child:nth-last-child(2)),:host([data-smcols="3"]) .carousel__controls:has(:is(button:first-child:nth-last-child(2),button:first-child:nth-last-child(3))),:host([data-smcols="4"]) .carousel__controls:has(:is(button:first-child:nth-last-child(2),button:first-child:nth-last-child(3),button:first-child:nth-last-child(4))),:host([data-smcols="2"]) .carousel__btns:has(~.carousel__controls button:first-child:nth-last-child(2)),:host([data-smcols="3"]) .carousel__btns:has(~.carousel__controls button:first-child:nth-last-child(2)),:host([data-smcols="3"]) .carousel__btns:has(~.carousel__controls button:first-child:nth-last-child(3)),:host([data-smcols="4"]) .carousel__btns:has(~.carousel__controls button:first-child:nth-last-child(2)),:host([data-smcols="4"]) .carousel__btns:has(~.carousel__controls button:first-child:nth-last-child(3)),:host([data-smcols="4"]) .carousel__btns:has(~.carousel__controls button:first-child:nth-last-child(4)){display:none}:host([data-smcols]) .carousel__controls{display:block}:host([data-smcols]) .carousel__controls~.carousel__progress{display:none}:host([data-smcols="2"]) .carousel__controls:has(button:nth-child(10)),:host([data-smcols="3"]) .carousel__controls:has(button:nth-child(15)),:host([data-smcols="4"]) .carousel__controls:has(button:nth-child(20)){display:none}:host([data-smcols="2"]) .carousel__controls:has(button:nth-child(10))~.carousel__progress,:host([data-smcols="3"]) .carousel__controls:has(button:nth-child(15))~.carousel__progress,:host([data-smcols="4"]) .carousel__controls:has(button:nth-child(20))~.carousel__progress{display:block}}@container (min-width: 62em){:host([data-mdcols]) .carousel__controls>button{display:inline-block !important}:host([data-mdcols]) .carousel__controls{display:block !important}:host([data-mdcols="2"]) .carousel__controls>button:not(:nth-child(odd)),:host([data-mdcols="3"]) .carousel__controls>button:not(:nth-child(3n+1)),:host([data-mdcols="4"]) .carousel__controls>button:not(:nth-child(4n+1)),:host([data-mdcols="5"]) .carousel__controls>button:not(:nth-child(5n+1)),:host([data-mdcols="6"]) .carousel__controls>button:not(:nth-child(6n+1)){display:none !important}:host([data-mdcols="2"]) .carousel__controls:has(button:first-child:nth-last-child(2)),:host([data-mdcols="3"]) .carousel__controls:has(:is(button:first-child:nth-last-child(2),button:first-child:nth-last-child(3))),:host([data-mdcols="4"]) .carousel__controls:has(:is(button:first-child:nth-last-child(2),button:first-child:nth-last-child(3),button:first-child:nth-last-child(4))),:host([data-mdcols="5"]) .carousel__controls:has(:is(button:first-child:nth-last-child(2),button:first-child:nth-last-child(3),button:first-child:nth-last-child(4),button:first-child:nth-last-child(5))),:host([data-mdcols="6"]) .carousel__controls:has(:is(button:first-child:nth-last-child(2),button:first-child:nth-last-child(3),button:first-child:nth-last-child(4),button:first-child:nth-last-child(5),button:first-child:nth-last-child(6))),:host([data-mdcols="2"]) .carousel__btns:has(~.carousel__controls button:first-child:nth-last-child(2)),:host([data-mdcols="3"]) .carousel__btns:has(~.carousel__controls button:first-child:nth-last-child(2)),:host([data-mdcols="3"]) .carousel__btns:has(~.carousel__controls button:first-child:nth-last-child(3)),:host([data-mdcols="4"]) .carousel__btns:has(~.carousel__controls button:first-child:nth-last-child(2)),:host([data-mdcols="4"]) .carousel__btns:has(~.carousel__controls button:first-child:nth-last-child(3)),:host([data-mdcols="4"]) .carousel__btns:has(~.carousel__controls button:first-child:nth-last-child(4)) :host([data-mdcols="5"]) .carousel__btns:has(~.carousel__controls button:first-child:nth-last-child(2)),:host([data-mdcols="5"]) .carousel__btns:has(~.carousel__controls button:first-child:nth-last-child(3)),:host([data-mdcols="5"]) .carousel__btns:has(~.carousel__controls button:first-child:nth-last-child(4)),:host([data-mdcols="5"]) .carousel__btns:has(~.carousel__controls button:first-child:nth-last-child(5)),:host([data-mdcols="6"]) .carousel__btns:has(~.carousel__controls button:first-child:nth-last-child(2)),:host([data-mdcols="6"]) .carousel__btns:has(~.carousel__controls button:first-child:nth-last-child(3)),:host([data-mdcols="6"]) .carousel__btns:has(~.carousel__controls button:first-child:nth-last-child(4)),:host([data-mdcols="6"]) .carousel__btns:has(~.carousel__controls button:first-child:nth-last-child(5)),:host([data-mdcols="6"]) .carousel__btns:has(~.carousel__controls button:first-child:nth-last-child(6)){display:none !important}:host([data-mdcols]) .carousel__controls{display:block !important}:host([data-mdcols]) .carousel__controls~.carousel__progress{display:none !important}:host([data-mdcols="2"]) .carousel__controls:has(button:nth-child(10)),:host([data-mdcols="3"]) .carousel__controls:has(button:nth-child(15)),:host([data-mdcols="4"]) .carousel__controls:has(button:nth-child(20)),:host([data-mdcols="5"]) .carousel__controls:has(button:nth-child(25)),:host([data-mdcols="6"]) .carousel__controls:has(button:nth-child(30)){display:none !important}:host([data-mdcols="2"]) .carousel__controls:has(button:nth-child(10))~.carousel__progress,:host([data-mdcols="3"]) .carousel__controls:has(button:nth-child(15))~.carousel__progress,:host([data-mdcols="4"]) .carousel__controls:has(button:nth-child(20))~.carousel__progress,:host([data-mdcols="5"]) .carousel__controls:has(button:nth-child(25))~.carousel__progress,:host([data-mdcols="6"]) .carousel__controls:has(button:nth-child(30))~.carousel__progress{display:block !important}}:host(.hide-btns) .carousel__btns,:host(.hide-controls) .carousel__controls{display:none}:host(.thumbnails) .carousel__controls{display:flex !important;flex-wrap:wrap;max-width:100%;overflow:visible}:host(.thumbnails) .carousel__controls button{padding:0;margin:0 .2rem .4rem;width:6rem;height:auto;aspect-ratio:var(--carousel-image-aspect-ratio, 3/2);border-radius:0;position:relative;border-radius:.25rem}:host(.thumbnails) .carousel__controls button img{position:absolute;inset:0;height:100%;width:100%;object-fit:cover;margin:0}:host(.thumbnails) .carousel__controls button[aria-current]{outline:2px solid var(--colour-info)}:host(.thumbnails) .carousel .carousel__btns{padding-bottom:.5rem}:host(.thumbnails) .carousel .btn-next,:host(.thumbnails) .carousel .btn-prev{position:relative;margin:0 !important}:host(.thumbnails) .carousel .carousel__progress{display:none !important}::slotted(div.image__wrapper){width:100%;aspect-ratio:var(--carousel-image-aspect-ratio, 3/2);position:relative}/*# sourceMappingURL=assets/css/components/carousel.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:block;overflow:visible;container-type:inline-size}.carousel{margin-inline:calc(var(--carousel-spacing, 1.5rem)*-1);margin-bottom:2rem;display:block;overflow:visible}.carousel .carousel__wrapper{position:relative;overflow-x:clip}.carousel .carousel__inner{--gutter-x: 1rem;overflow-x:auto;padding-bottom:1rem;scroll-snap-type:x mandatory}.carousel .carousel__content{display:flex;flex-wrap:nowrap !important;margin-inline-end:0;padding-inline-start:var(--carousel-spacing, 1.5rem);padding-inline-end:var(--carousel-spacing, 1.5rem);margin-right:calc(-0.5*var(--gutter-x));margin-left:calc(-0.5*var(--gutter-x))}.carousel .col>*:last-child{margin-bottom:0;padding-bottom:0}::slotted(div){scroll-snap-align:start;scroll-margin-left:calc(var(--carousel-spacing, 1.5rem) - .5rem);flex-shrink:0;width:calc(100% + var(--last-item-extra, 0px));padding-right:.5rem;padding-left:.5rem;margin-top:var(--gutter-y)}::slotted(div:last-child){padding-inline-end:1.5rem;--last-item-extra: 1rem}@container (min-width: 36em){.carousel{margin-inline:calc(var(--carousel-spacing, 2.5rem)*-1)}.carousel .carousel__content{padding-inline-start:var(--carousel-spacing, 2.5rem);padding-inline-end:var(--carousel-spacing, 2.5rem)}:host([data-smcols]) ::slotted(div){scroll-snap-align:unset;flex:0 0 auto}:host([data-smcols="2"]) ::slotted(div){width:calc(50% + var(--last-item-extra, 0px))}:host([data-smcols="3"]) ::slotted(div){width:calc(33.3333333333% + var(--last-item-extra, 0px))}:host([data-smcols="4"]) ::slotted(div){width:calc(25% + var(--last-item-extra, 0px))}:host([data-smcols="2"]) ::slotted(div:nth-child(odd)),:host([data-smcols="3"]) ::slotted(div:nth-child(3n+1)),:host([data-smcols="4"]) ::slotted(div:nth-child(4n+1)){scroll-snap-align:start}::slotted(div){scroll-margin-left:calc(var(--carousel-spacing, 2.5rem) - .5rem)}::slotted(div:last-child){padding-inline-end:2.5rem;--last-item-extra: 2rem}}@container (min-width: 62em){.carousel{margin-inline:0;position:relative}.carousel__wrapper{overflow:hidden;margin-inline:-0.5rem}.carousel__content{padding-inline:0 !important;margin-inline:0 !important}::slotted(div){margin-left:0;scroll-margin-left:0}::slotted(div:last-child){padding-inline-end:.5rem;--last-item-extra: 0px}:host([data-mdcols]) ::slotted(div){scroll-snap-align:unset;flex:0 0 auto}:host([data-mdcols="2"]) ::slotted(div){width:calc(50% + var(--last-item-extra, 0px))}:host([data-mdcols="3"]) ::slotted(div){width:calc(33.3333333333% + var(--last-item-extra, 0px))}:host([data-mdcols="4"]) ::slotted(div){width:calc(25% + var(--last-item-extra, 0px))}:host([data-mdcols="5"]) ::slotted(div){width:calc(20% + var(--last-item-extra, 0px))}:host([data-mdcols="6"]) ::slotted(div){width:calc(16.6666666667% + var(--last-item-extra, 0px))}:host([data-mdcols="2"]) ::slotted(div:nth-child(odd)),:host([data-mdcols="3"]) ::slotted(div:nth-child(3n+1)),:host([data-mdcols="4"]) ::slotted(div:nth-child(4n+1)),:host([data-mdcols="5"]) ::slotted(div:nth-child(5n+1)),:host([data-mdcols="6"]) ::slotted(div:nth-child(6n+1)){scroll-snap-align:start}}.carousel__inner{scrollbar-width:none;-ms-overflow-style:none}.carousel__inner::-webkit-scrollbar{display:none}.carousel__btns{text-align:center;padding-bottom:.5rem}.btn-next,.btn-prev{margin:0 !important}.btn-next:after,.btn-prev:after{content:"";position:absolute;right:0;top:0;height:100%;width:100%;background:currentColor;mask-image:var(--icon-arrow);mask-size:50%;mask-repeat:no-repeat;mask-position:50% 60%;-webkit-mask-image:var(--icon-arrow);-webkit-mask-size:50%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:55% 50%;transform:rotate(0deg)}.btn-prev:after{transform:rotate(180deg)}@container (min-width: 62em){.carousel__btns{padding-bottom:0}.btn-prev{position:absolute;top:50%;left:0;margin:-2rem 0 0 -3rem !important}.btn-next{position:absolute;top:50%;right:0;margin:-2rem -3rem 0 0 !important}}.carousel .carousel__controls{overflow:hidden;margin-inline:auto;margin-bottom:1rem;text-align:center;max-width:30rem}@container (min-width: 36em){.carousel .carousel__controls{width:100%}}.carousel .carousel__controls button{padding:0;margin:0 .2rem .2rem;border:none}.carousel .carousel__controls button{width:.5rem;height:.5rem;min-height:.5rem;border-radius:50%;text-indent:-50rem;overflow:hidden;background:#a5ecfd;margin-inline:.375rem;cursor:pointer;border:none}.carousel .carousel__controls button:hover{background-color:var(--colour-info)}.carousel .carousel__controls button:before{display:none}.carousel .carousel__controls button:first-child:last-child{display:none}.carousel__controls>button[aria-current]{--colour-active-thumbnail: var(--colour-info);border-color:var(--colour-active-thumbnail);background:var(--colour-info);width:1rem;height:1rem;min-height:1rem;margin-inline:.125rem}.carousel__controls>button[aria-current]:hover{background:var(--colour-info)}.carousel__progress{text-align:center;margin-bottom:1rem;display:none}input[type=range]{--track-size: 0.5rem;--track-colour: #a5ecfd;--thumb-colour: var(--colour-info);--thumb-size: 1rem;--thumb-size-outline: 0;width:90%;max-width:10.75rem;background:rgba(0,0,0,0);cursor:pointer;margin:0;height:1rem;border-radius:50%;accent-color:var(--thumb-colour);-webkit-appearance:none;appearance:none}input[type=range]::-webkit-slider-runnable-track{background:var(--track-colour);height:var(--track-size);border-radius:.5625rem}input[type=range]::-moz-range-track{background:var(--track-colour);height:var(--track-size);border-radius:.5625rem}input[type=range]::-webkit-slider-runnable-track{background:linear-gradient(to right, var(--track-colour), var(--track-colour) var(--start-percent, 0%), var(--thumb-colour) var(--start-percent, 0%), var(--thumb-colour) calc(var(--percent, 0%)), var(--track-colour) calc(var(--percent, 0%)))}input[type=range]::-moz-range-track{background:linear-gradient(to right, var(--track-colour), var(--track-colour) var(--start-percent, 0%), var(--thumb-colour) var(--start-percent, 0%), var(--thumb-colour) calc(var(--percent, 0%)), var(--track-colour) calc(var(--percent, 0%)))}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;margin-top:-0.25rem;background-color:var(--thumb-colour);height:var(--thumb-size);width:var(--thumb-size);border-radius:50%;position:relative;z-index:99;pointer-events:all}input[type=range]::-moz-range-thumb{border:none;background-color:var(--thumb-colour);height:var(--thumb-size);width:var(--thumb-size);border-radius:50%;position:relative;z-index:99;pointer-events:all}input[type=range]:focus{outline:none}input[type=range]:hover::-webkit-slider-thumb,input[type=range]:focus::-webkit-slider-thumb{outline:var(--thumb-size-outline) solid var(--thumb-colour)}input[type=range]:active::-webkit-slider-thumb{outline:var(--thumb-size-outline) solid var(--thumb-colour)}input[type=range]:hover::-moz-range-thumb,input[type=range]:focus::-moz-range-thumb{outline:var(--thumb-size-outline) solid var(--thumb-colour)}input[type=range]:focus::-moz-range-thumb{outline:var(--thumb-size-outline) solid var(--thumb-colour)}.carousel__btns:has(~.carousel__controls button:first-child:nth-child(1):last-child){display:none}.carousel__controls:has(button:nth-child(5)){display:none}.carousel__controls:has(button:nth-child(5))~.carousel__progress{display:block}@container (min-width: 36em){:host([data-smcols="2"]) .carousel__controls>button:not(:nth-child(odd)),:host([data-smcols="3"]) .carousel__controls>button:not(:nth-child(3n+1)),:host([data-smcols="4"]) .carousel__controls>button:not(:nth-child(4n+1)){display:none}:host([data-smcols="2"]) .carousel__controls:has(button:first-child:nth-last-child(2)),:host([data-smcols="3"]) .carousel__controls:has(:is(button:first-child:nth-last-child(2),button:first-child:nth-last-child(3))),:host([data-smcols="4"]) .carousel__controls:has(:is(button:first-child:nth-last-child(2),button:first-child:nth-last-child(3),button:first-child:nth-last-child(4))),:host([data-smcols="2"]) .carousel__btns:has(~.carousel__controls button:first-child:nth-last-child(2)),:host([data-smcols="3"]) .carousel__btns:has(~.carousel__controls button:first-child:nth-last-child(2)),:host([data-smcols="3"]) .carousel__btns:has(~.carousel__controls button:first-child:nth-last-child(3)),:host([data-smcols="4"]) .carousel__btns:has(~.carousel__controls button:first-child:nth-last-child(2)),:host([data-smcols="4"]) .carousel__btns:has(~.carousel__controls button:first-child:nth-last-child(3)),:host([data-smcols="4"]) .carousel__btns:has(~.carousel__controls button:first-child:nth-last-child(4)){display:none}:host([data-smcols]) .carousel__controls{display:block}:host([data-smcols]) .carousel__controls~.carousel__progress{display:none}:host([data-smcols="2"]) .carousel__controls:has(button:nth-child(10)),:host([data-smcols="3"]) .carousel__controls:has(button:nth-child(15)),:host([data-smcols="4"]) .carousel__controls:has(button:nth-child(20)){display:none}:host([data-smcols="2"]) .carousel__controls:has(button:nth-child(10))~.carousel__progress,:host([data-smcols="3"]) .carousel__controls:has(button:nth-child(15))~.carousel__progress,:host([data-smcols="4"]) .carousel__controls:has(button:nth-child(20))~.carousel__progress{display:block}}@container (min-width: 62em){:host([data-mdcols]) .carousel__controls>button{display:inline-block !important}:host([data-mdcols]) .carousel__controls{display:block !important}:host([data-mdcols="2"]) .carousel__controls>button:not(:nth-child(odd)),:host([data-mdcols="3"]) .carousel__controls>button:not(:nth-child(3n+1)),:host([data-mdcols="4"]) .carousel__controls>button:not(:nth-child(4n+1)),:host([data-mdcols="5"]) .carousel__controls>button:not(:nth-child(5n+1)),:host([data-mdcols="6"]) .carousel__controls>button:not(:nth-child(6n+1)){display:none !important}:host([data-mdcols="2"]) .carousel__controls:has(button:first-child:nth-last-child(2)),:host([data-mdcols="3"]) .carousel__controls:has(:is(button:first-child:nth-last-child(2),button:first-child:nth-last-child(3))),:host([data-mdcols="4"]) .carousel__controls:has(:is(button:first-child:nth-last-child(2),button:first-child:nth-last-child(3),button:first-child:nth-last-child(4))),:host([data-mdcols="5"]) .carousel__controls:has(:is(button:first-child:nth-last-child(2),button:first-child:nth-last-child(3),button:first-child:nth-last-child(4),button:first-child:nth-last-child(5))),:host([data-mdcols="6"]) .carousel__controls:has(:is(button:first-child:nth-last-child(2),button:first-child:nth-last-child(3),button:first-child:nth-last-child(4),button:first-child:nth-last-child(5),button:first-child:nth-last-child(6))),:host([data-mdcols="2"]) .carousel__btns:has(~.carousel__controls button:first-child:nth-last-child(2)),:host([data-mdcols="3"]) .carousel__btns:has(~.carousel__controls button:first-child:nth-last-child(2)),:host([data-mdcols="3"]) .carousel__btns:has(~.carousel__controls button:first-child:nth-last-child(3)),:host([data-mdcols="4"]) .carousel__btns:has(~.carousel__controls button:first-child:nth-last-child(2)),:host([data-mdcols="4"]) .carousel__btns:has(~.carousel__controls button:first-child:nth-last-child(3)),:host([data-mdcols="4"]) .carousel__btns:has(~.carousel__controls button:first-child:nth-last-child(4)) :host([data-mdcols="5"]) .carousel__btns:has(~.carousel__controls button:first-child:nth-last-child(2)),:host([data-mdcols="5"]) .carousel__btns:has(~.carousel__controls button:first-child:nth-last-child(3)),:host([data-mdcols="5"]) .carousel__btns:has(~.carousel__controls button:first-child:nth-last-child(4)),:host([data-mdcols="5"]) .carousel__btns:has(~.carousel__controls button:first-child:nth-last-child(5)),:host([data-mdcols="6"]) .carousel__btns:has(~.carousel__controls button:first-child:nth-last-child(2)),:host([data-mdcols="6"]) .carousel__btns:has(~.carousel__controls button:first-child:nth-last-child(3)),:host([data-mdcols="6"]) .carousel__btns:has(~.carousel__controls button:first-child:nth-last-child(4)),:host([data-mdcols="6"]) .carousel__btns:has(~.carousel__controls button:first-child:nth-last-child(5)),:host([data-mdcols="6"]) .carousel__btns:has(~.carousel__controls button:first-child:nth-last-child(6)){display:none !important}:host([data-mdcols]) .carousel__controls{display:block !important}:host([data-mdcols]) .carousel__controls~.carousel__progress{display:none !important}:host([data-mdcols="2"]) .carousel__controls:has(button:nth-child(10)),:host([data-mdcols="3"]) .carousel__controls:has(button:nth-child(15)),:host([data-mdcols="4"]) .carousel__controls:has(button:nth-child(20)),:host([data-mdcols="5"]) .carousel__controls:has(button:nth-child(25)),:host([data-mdcols="6"]) .carousel__controls:has(button:nth-child(30)){display:none !important}:host([data-mdcols="2"]) .carousel__controls:has(button:nth-child(10))~.carousel__progress,:host([data-mdcols="3"]) .carousel__controls:has(button:nth-child(15))~.carousel__progress,:host([data-mdcols="4"]) .carousel__controls:has(button:nth-child(20))~.carousel__progress,:host([data-mdcols="5"]) .carousel__controls:has(button:nth-child(25))~.carousel__progress,:host([data-mdcols="6"]) .carousel__controls:has(button:nth-child(30))~.carousel__progress{display:block !important}}:host(.hide-btns) .carousel__btns,:host(.hide-controls) .carousel__controls{display:none}:host(.thumbnails) .carousel__controls{display:flex !important;flex-wrap:wrap;max-width:100%;overflow:visible}:host(.thumbnails) .carousel__controls button{padding:0;margin:0 .2rem .4rem;width:6rem;height:auto;aspect-ratio:var(--carousel-image-aspect-ratio, 3/2);border-radius:0;position:relative;border-radius:.25rem}:host(.thumbnails) .carousel__controls button img{position:absolute;inset:0;height:100%;width:100%;object-fit:cover;margin:0}:host(.thumbnails) .carousel__controls button[aria-current]{outline:2px solid var(--colour-info)}:host(.thumbnails) .carousel .carousel__btns{padding-bottom:.5rem}:host(.thumbnails) .carousel .btn-next,:host(.thumbnails) .carousel .btn-prev{position:relative;margin:0 !important}:host(.thumbnails) .carousel .carousel__progress{display:none !important}::slotted(div.image__wrapper){width:100%;aspect-ratio:var(--carousel-image-aspect-ratio, 3/2);position:relative}/*# sourceMappingURL=assets/css/components/carousel.component.css.map */
7
7
 
8
8
  ${this.hasAttribute("css")?`@import "${this.getAttribute("css")}";`:""}
9
9
  </style>
@@ -28,5 +28,5 @@
28
28
  <input type="range" min="0" max="100" value="1" step="1" />
29
29
  </div>
30
30
  </div>
31
- `,this.shadowRoot.appendChild(t.content.cloneNode(!0))}connectedCallback(){const t=this;let n=[];const o=this.shadowRoot.querySelector(".carousel__controls");t.querySelector("[data-thumbnail]")&&(n=M(t),t.classList.add("thumbnails")),o.innerHTML=W(t,n),Array.from(t.querySelectorAll(":scope > div > img:first-child:last-child, :scope > div > picture:first-child:last-child img")).forEach(a=>{a.style.inset="0 0.5rem 0 0.5rem",a.style.position="absolute",a.style.width="calc(100% - 1rem)",a.style.height="100%",a.style["object-fit"]="cover",a.closest("div").classList.add("image__wrapper")}),P(t),C(t,"iam-carousel",["pip-clicked","next-clicked","prev-clicked","slider-changed"])}}export{I as default};
31
+ `,this.shadowRoot.appendChild(e.content.cloneNode(!0))}connectedCallback(){const e=this;let a=[];const r=this.shadowRoot.querySelector(".carousel__controls");e.querySelector("[data-thumbnail]")&&(a=W(e),e.classList.add("thumbnails")),r.innerHTML=L(e,a),Array.from(e.querySelectorAll(":scope > div > img:first-child:last-child, :scope > div > picture:first-child:last-child img")).forEach(t=>{t.style.inset="0 0.5rem 0 0.5rem",t.style.position="absolute",t.style.width="calc(100% - 1rem)",t.style.height="100%",t.style["object-fit"]="cover",t.closest("div").classList.add("image__wrapper")}),P(e),new MutationObserver(function(t){t.forEach(function(i){const u=i.target;I(u)})}).observe(e,{attributes:!1,childList:!0,subtree:!0}),C(e,"iam-carousel",["pip-clicked","next-clicked","prev-clicked","slider-changed"])}}export{R as default};
32
32
  //# sourceMappingURL=carousel.component.min.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"carousel.component.min.js","sources":["../../modules/carousel.js","../_global.js","carousel.component.js"],"sourcesContent":["export const generateThumbnailList = function (carouselComponent) {\n const thumbnailImages = [];\n Array.from(carouselComponent.querySelectorAll(':scope > div')).forEach((slide, index) => {\n if (slide.hasAttribute('data-thumbnail')) {\n thumbnailImages[index] = slide.getAttribute('data-thumbnail');\n }\n });\n return thumbnailImages;\n};\nexport const generatePipsHTML = function (carouselComponent, thumbnailImages) {\n const itemCount = carouselComponent.querySelectorAll(':scope > div').length;\n let pips = '';\n for (let i = 1; i <= itemCount; i++) {\n let pipContent = null;\n let pipClass = '';\n if (thumbnailImages.length && thumbnailImages[i - 1]) {\n pipClass = 'has-thumbnail';\n pipContent = `<img src=\"${thumbnailImages[i - 1]}\" alt=\"Slide ${i}\" height=\"148\"/>`;\n }\n else {\n pipContent = `Slide ${i}`;\n }\n pips += `<button class=\"control-${i} ${pipClass}\" data-slide=\"${i}\" ${i == 1 ? 'aria-current' : ''}>${pipContent}</button>`;\n }\n return pips;\n};\nexport const getProgressMax = function (itemCount, visibleItems) {\n if (visibleItems == 1) {\n return itemCount;\n }\n const max = Math.ceil(itemCount / visibleItems) * visibleItems - visibleItems;\n return max + 1;\n};\nconst getProgressPercent = function (value, max) {\n return ((value - 1) / (max - 1)) * 100;\n};\nexport const carousel = function (carouselComponent) {\n let scrollTimeout;\n const carouselElement = carouselComponent.shadowRoot.querySelector('.carousel');\n const carouselInner = carouselElement.querySelector('.carousel__inner');\n const carouselControls = carouselElement.querySelector('.carousel__controls');\n const carouselProgress = carouselElement.querySelector('.carousel__progress [type=\"range\"]');\n const itemCount = carouselComponent.querySelectorAll(':scope > div').length;\n let scrollArea = carouselInner.clientWidth;\n let itemWidth = carouselComponent.querySelector(':scope > div').scrollWidth;\n let visibleItems = Math.round(scrollArea / itemWidth);\n carouselProgress.setAttribute('min', 1);\n carouselProgress.setAttribute('step', visibleItems);\n let progressMax = getProgressMax(itemCount, visibleItems);\n carouselProgress.setAttribute('max', progressMax);\n carouselProgress.value = 1;\n let percent = getProgressPercent(1, progressMax);\n carouselProgress.style.setProperty('--percent', percent + '%');\n let stepperInterval, stepperEvent = 'mouseup', stepperStart = 'mousedown';\n if ('ontouchstart' in document.documentElement) {\n stepperEvent = 'touchend';\n stepperStart = 'touchstart';\n }\n // On scroll we need to make sure the buttons get corrected and the next testimonial is shown\n carouselInner.addEventListener('scroll', function () {\n clearTimeout(scrollTimeout);\n scrollTimeout = setTimeout(function () {\n const scrollArea = carouselInner.clientWidth;\n const scrollWidth = carouselInner.scrollWidth;\n const scrollLeft = carouselInner.scrollLeft;\n let targetSlide = Math.round((scrollLeft / scrollWidth) * itemCount) + 1;\n const itemWidth = carouselComponent.querySelector(':scope > div').scrollWidth;\n const lastItemOffset = carouselComponent.querySelector(':scope > div:last-child').offsetLeft;\n //+60px here is to account for when the next offscreen slide is visible beneath the next arrow\n const lastItemInView = carouselInner.scrollLeft + scrollArea + carouselInner.getBoundingClientRect().left >= lastItemOffset + 60;\n const visibleItems = Math.round(scrollArea / itemWidth);\n //Check if theres room for more slides than we have\n const leftOverSpace = Math.ceil(itemCount / visibleItems) * visibleItems - itemCount;\n carouselProgress.setAttribute('step', visibleItems);\n if (leftOverSpace > 0 && lastItemInView) {\n targetSlide = Math.floor(itemCount / visibleItems) * visibleItems + 1;\n }\n Array.from(carouselElement.querySelectorAll('.carousel__controls button')).forEach((button) => {\n button.removeAttribute('aria-current');\n });\n carouselElement.querySelector('.control-' + targetSlide).setAttribute('aria-current', true);\n // Disable the previous button\n if (targetSlide == 1)\n carouselElement.querySelector('.btn-prev').setAttribute('disabled', 'disabled');\n else\n carouselElement.querySelector('.btn-prev').removeAttribute('disabled');\n // Disable the next button if the last item is in view\n if (targetSlide > itemCount - visibleItems)\n carouselElement.querySelector('.btn-next').setAttribute('disabled', 'disabled');\n else\n carouselElement.querySelector('.btn-next').removeAttribute('disabled');\n carouselProgress.value = targetSlide;\n progressMax = getProgressMax(itemCount, visibleItems);\n carouselProgress.setAttribute('max', progressMax);\n percent = (targetSlide / progressMax) * 100;\n percent = getProgressPercent(targetSlide, progressMax);\n carouselProgress.style.setProperty('--percent', percent + '%');\n }, 100);\n }, false);\n // when the buttons are used we need to make sure the carousel scrolls to the correct place\n carouselControls.addEventListener('click', function (e) {\n for (let target = e.target; target && target != this; target = target.parentNode) {\n if (typeof target.matches == 'function' && target.matches('button')) {\n e.preventDefault();\n Array.from(carouselControls.querySelectorAll('button')).forEach((button) => {\n button.removeAttribute('aria-current');\n });\n target.setAttribute('aria-current', true);\n const customEvent = new CustomEvent('pip-clicked', {\n detail: {\n slide: target.getAttribute('data-slide'),\n },\n });\n carouselComponent.dispatchEvent(customEvent);\n const el = carouselComponent.querySelector(`:scope > *:nth-child(${target.getAttribute('data-slide')})`);\n carouselInner.scroll({\n top: 0,\n left: el.offsetLeft - carouselInner.getBoundingClientRect().left,\n behavior: 'smooth',\n });\n break;\n }\n }\n }, false);\n carouselElement.addEventListener('click', function (e) {\n const scrollArea = carouselInner.clientWidth;\n //const scrollWidth = carouselInner.scrollWidth;\n const itemWidth = carouselComponent.querySelector(':scope > div').scrollWidth;\n const visibleItems = Math.round(scrollArea / itemWidth);\n const lastItemOffset = carouselComponent.querySelector(':scope > div:last-child').offsetLeft;\n const lastItemInView = carouselInner.scrollLeft + scrollArea + carouselInner.getBoundingClientRect().left >= lastItemOffset + 60;\n //Check if theres room for more slides than we have\n const leftOverSpace = Math.ceil(itemCount / visibleItems) * visibleItems - itemCount;\n /*\n When the last slide isn't filled with items, we only want to move back the number of items on the slide,\n rather than the total number of possible visible items\n */\n const spacesToMove = visibleItems - leftOverSpace;\n //Only want to change the amount of movement if the last item is visible\n const movement = lastItemInView && leftOverSpace > 0 ? spacesToMove * itemWidth : carouselInner.clientWidth;\n for (let target = e.target; target && target != this; target = target.parentNode) {\n if (typeof target.matches == 'function' && target.matches('.btn-next, .btn-prev')) {\n const direction = target.matches('.btn-next') ? 'next' : 'prev';\n const customEvent = new CustomEvent(`${direction}-clicked`, {\n detail: {\n slide: target.getAttribute('data-go'),\n },\n });\n carouselComponent.dispatchEvent(customEvent);\n e.preventDefault();\n const scrollTo = target.classList.contains('btn-prev')\n ? carouselInner.scrollLeft - movement\n : carouselInner.scrollLeft + carouselInner.clientWidth;\n carouselInner.scroll({\n top: 0,\n left: scrollTo,\n behavior: 'smooth',\n });\n break;\n }\n }\n }, false);\n carouselProgress.addEventListener(stepperStart, function () {\n clearInterval(stepperInterval);\n stepperInterval = setInterval(function () {\n scrollArea = carouselInner.clientWidth;\n itemWidth = carouselComponent.querySelector(':scope > div').scrollWidth;\n visibleItems = Math.round(scrollArea / itemWidth);\n carouselProgress.setAttribute('step', visibleItems);\n progressMax = getProgressMax(itemCount, visibleItems);\n carouselProgress.setAttribute('max', progressMax);\n percent = getProgressPercent(carouselProgress.value, progressMax);\n carouselProgress.style.setProperty('--percent', percent + '%');\n }, 10);\n });\n carouselProgress.addEventListener(stepperEvent, function () {\n clearInterval(stepperInterval);\n });\n carouselProgress.addEventListener('change', function () {\n clearInterval(stepperInterval);\n const target = carouselComponent.querySelector(`:scope > *:nth-child(${carouselProgress.value})`);\n carouselInner.scroll({\n top: 0,\n left: target ? target.offsetLeft - carouselInner.getBoundingClientRect().left : 0,\n behavior: 'smooth',\n });\n //const direction = target.matches('.btn-next') ? 'next' : 'prev';\n const customEvent = new CustomEvent(`slider-changed`, {\n detail: {\n slide: carouselProgress.value,\n },\n });\n carouselComponent.dispatchEvent(customEvent);\n }, false);\n};\nexport const updateCarousel = function (carouselComponent) {\n};\nexport default carousel;\n","export const trackComponentRegistered = (componentName) => {\n // Data layer Web component created\n window.dataLayer = window.dataLayer || [];\n window.dataLayer.push({\n event: 'customElementRegistered',\n element: componentName,\n });\n};\nexport const trackComponent = (component, componentName, trackEvents) => {\n // Data layer Web component created\n window.dataLayer = window.dataLayer || [];\n window.dataLayer.push({\n event: 'customElementAdded',\n element: componentName,\n });\n trackEvents.forEach((eventName) => {\n component.addEventListener(eventName, function (event) {\n const eventDetails = {\n event: eventName,\n element: componentName,\n target: event.target,\n };\n Object.keys(event.detail).forEach((eventKey) => {\n const eventDetail = event.detail[eventKey];\n eventDetails[eventKey] = eventDetail;\n });\n window.dataLayer.push(eventDetails);\n });\n });\n return true;\n};\n","import { generateThumbnailList, generatePipsHTML, carousel } from '../../modules/carousel';\nimport { trackComponent, trackComponentRegistered } from '../_global';\ntrackComponentRegistered('iam-carousel');\nclass iamCarousel 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/carousel.component.css\";`;\n const template = document.createElement('template');\n template.innerHTML = /* HTML */ `\n <style>\n ${loadCSS}\n ${this.hasAttribute('css') ? `@import \"${this.getAttribute('css')}\";` : ``}\n </style>\n <div class=\"carousel\" part=\"carousel\">\n <div class=\"carousel__wrapper\">\n <div class=\"carousel__inner\">\n <div class=\"carousel__content\" part=\"content\">\n <slot></slot>\n </div>\n </div>\n </div>\n <div class=\"carousel__btns\" part=\"btns\">\n <button class=\"btn btn-secondary btn-compact fa-plus-large btn-prev\" data-go=\"0\" disabled part=\"prev\">\n Prev\n </button>\n <button class=\"btn btn-secondary btn-compact fa-plus-large btn-next\" data-go=\"2\" part=\"next\">Next</button>\n </div>\n\n <div class=\"carousel__controls\" part=\"controls\"></div>\n\n <div class=\"carousel__progress\" part=\"progress\">\n <input type=\"range\" min=\"0\" max=\"100\" value=\"1\" step=\"1\" />\n </div>\n </div>\n `;\n this.shadowRoot.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n // eslint-disable-next-line @typescript-eslint/no-this-alias\n const carouselComponent = this;\n //const carouselElement = this.shadowRoot.querySelector('.carousel');\n //const row = this.shadowRoot.querySelector('.row');\n let thumbnailImages = [];\n const carouselControls = this.shadowRoot.querySelector('.carousel__controls');\n if (carouselComponent.querySelector('[data-thumbnail]')) {\n thumbnailImages = generateThumbnailList(carouselComponent);\n carouselComponent.classList.add('thumbnails');\n }\n // populate the pips\n carouselControls.innerHTML = generatePipsHTML(carouselComponent, thumbnailImages);\n Array.from(carouselComponent.querySelectorAll(':scope > div > img:first-child:last-child, :scope > div > picture:first-child:last-child img')).forEach((image) => {\n image.style.inset = '0 0.5rem 0 0.5rem';\n image.style.position = 'absolute';\n image.style.width = 'calc(100% - 1rem)';\n image.style.height = '100%';\n image.style['object-fit'] = 'cover';\n image.closest('div').classList.add('image__wrapper');\n });\n carousel(carouselComponent);\n trackComponent(carouselComponent, 'iam-carousel', [\n 'pip-clicked',\n 'next-clicked',\n 'prev-clicked',\n 'slider-changed',\n ]);\n }\n}\nexport default iamCarousel;\n"],"names":["generateThumbnailList","carouselComponent","thumbnailImages","slide","index","generatePipsHTML","itemCount","pips","i","pipContent","pipClass","getProgressMax","visibleItems","getProgressPercent","value","max","carousel","scrollTimeout","carouselElement","carouselInner","carouselControls","carouselProgress","scrollArea","itemWidth","progressMax","percent","stepperInterval","stepperEvent","stepperStart","scrollWidth","scrollLeft","targetSlide","lastItemOffset","lastItemInView","leftOverSpace","button","e","target","customEvent","el","spacesToMove","movement","direction","scrollTo","trackComponentRegistered","componentName","trackComponent","component","trackEvents","eventName","event","eventDetails","eventKey","eventDetail","iamCarousel","template","image"],"mappings":"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"}
1
+ {"version":3,"file":"carousel.component.min.js","sources":["../../modules/carousel.js","../_global.js","carousel.component.js"],"sourcesContent":["export const generateThumbnailList = function (carouselComponent) {\n const thumbnailImages = [];\n Array.from(carouselComponent.querySelectorAll(':scope > div')).forEach((slide, index) => {\n if (slide.hasAttribute('data-thumbnail')) {\n thumbnailImages[index] = slide.getAttribute('data-thumbnail');\n }\n });\n return thumbnailImages;\n};\nexport const generatePipsHTML = function (carouselComponent, thumbnailImages) {\n const itemCount = carouselComponent.querySelectorAll(':scope > div').length;\n let pips = '';\n for (let i = 1; i <= itemCount; i++) {\n let pipContent = null;\n let pipClass = '';\n if (thumbnailImages.length && thumbnailImages[i - 1]) {\n pipClass = 'has-thumbnail';\n pipContent = `<img src=\"${thumbnailImages[i - 1]}\" alt=\"Slide ${i}\" height=\"148\"/>`;\n }\n else {\n pipContent = `Slide ${i}`;\n }\n pips += `<button class=\"control-${i} ${pipClass}\" data-slide=\"${i}\" ${i == 1 ? 'aria-current' : ''}>${pipContent}</button>`;\n }\n return pips;\n};\nexport const getProgressMax = function (itemCount, visibleItems) {\n if (visibleItems == 1) {\n return itemCount;\n }\n const max = Math.ceil(itemCount / visibleItems) * visibleItems - visibleItems;\n return max + 1;\n};\nconst getProgressPercent = function (value, max) {\n return ((value - 1) / (max - 1)) * 100;\n};\nexport const carousel = function (carouselComponent) {\n let scrollTimeout;\n const carouselElement = carouselComponent.shadowRoot.querySelector('.carousel');\n const carouselInner = carouselElement.querySelector('.carousel__inner');\n const carouselControls = carouselElement.querySelector('.carousel__controls');\n const carouselProgress = carouselElement.querySelector('.carousel__progress [type=\"range\"]');\n const itemCount = carouselComponent.querySelectorAll(':scope > div').length;\n let scrollArea = carouselInner.clientWidth;\n let itemWidth = carouselComponent.querySelector(':scope > div').scrollWidth;\n let visibleItems = Math.round(scrollArea / itemWidth);\n carouselProgress.setAttribute('min', 1);\n carouselProgress.setAttribute('step', visibleItems);\n let progressMax = getProgressMax(itemCount, visibleItems);\n carouselProgress.setAttribute('max', progressMax);\n carouselProgress.value = 1;\n let percent = getProgressPercent(1, progressMax);\n carouselProgress.style.setProperty('--percent', percent + '%');\n let stepperInterval, stepperEvent = 'mouseup', stepperStart = 'mousedown';\n if ('ontouchstart' in document.documentElement) {\n stepperEvent = 'touchend';\n stepperStart = 'touchstart';\n }\n // On scroll we need to make sure the buttons get corrected and the next testimonial is shown\n carouselInner.addEventListener('scroll', function () {\n clearTimeout(scrollTimeout);\n scrollTimeout = setTimeout(function () {\n const scrollArea = carouselInner.clientWidth;\n const scrollWidth = carouselInner.scrollWidth;\n const scrollLeft = carouselInner.scrollLeft;\n let targetSlide = Math.round((scrollLeft / scrollWidth) * itemCount) + 1;\n const itemWidth = carouselComponent.querySelector(':scope > div').scrollWidth;\n const lastItemOffset = carouselComponent.querySelector(':scope > div:last-child').offsetLeft;\n //+60px here is to account for when the next offscreen slide is visible beneath the next arrow\n const lastItemInView = carouselInner.scrollLeft + scrollArea + carouselInner.getBoundingClientRect().left >= lastItemOffset + 60;\n const visibleItems = Math.round(scrollArea / itemWidth);\n //Check if theres room for more slides than we have\n const leftOverSpace = Math.ceil(itemCount / visibleItems) * visibleItems - itemCount;\n carouselProgress.setAttribute('step', visibleItems);\n if (leftOverSpace > 0 && lastItemInView) {\n targetSlide = Math.floor(itemCount / visibleItems) * visibleItems + 1;\n }\n Array.from(carouselElement.querySelectorAll('.carousel__controls button')).forEach((button) => {\n button.removeAttribute('aria-current');\n });\n carouselElement.querySelector('.control-' + targetSlide).setAttribute('aria-current', true);\n // Disable the previous button\n if (targetSlide == 1)\n carouselElement.querySelector('.btn-prev').setAttribute('disabled', 'disabled');\n else\n carouselElement.querySelector('.btn-prev').removeAttribute('disabled');\n // Disable the next button if the last item is in view\n if (targetSlide > itemCount - visibleItems)\n carouselElement.querySelector('.btn-next').setAttribute('disabled', 'disabled');\n else\n carouselElement.querySelector('.btn-next').removeAttribute('disabled');\n carouselProgress.value = targetSlide;\n progressMax = getProgressMax(itemCount, visibleItems);\n carouselProgress.setAttribute('max', progressMax);\n percent = (targetSlide / progressMax) * 100;\n percent = getProgressPercent(targetSlide, progressMax);\n carouselProgress.style.setProperty('--percent', percent + '%');\n }, 100);\n }, false);\n // when the buttons are used we need to make sure the carousel scrolls to the correct place\n carouselControls.addEventListener('click', function (e) {\n for (let target = e.target; target && target != this; target = target.parentNode) {\n if (typeof target.matches == 'function' && target.matches('button')) {\n e.preventDefault();\n Array.from(carouselControls.querySelectorAll('button')).forEach((button) => {\n button.removeAttribute('aria-current');\n });\n target.setAttribute('aria-current', true);\n const customEvent = new CustomEvent('pip-clicked', {\n detail: {\n slide: target.getAttribute('data-slide'),\n },\n });\n carouselComponent.dispatchEvent(customEvent);\n const el = carouselComponent.querySelector(`:scope > *:nth-child(${target.getAttribute('data-slide')})`);\n carouselInner.scroll({\n top: 0,\n left: el.offsetLeft - carouselInner.getBoundingClientRect().left,\n behavior: 'smooth',\n });\n break;\n }\n }\n }, false);\n carouselElement.addEventListener('click', function (e) {\n const scrollArea = carouselInner.clientWidth;\n //const scrollWidth = carouselInner.scrollWidth;\n const itemWidth = carouselComponent.querySelector(':scope > div').scrollWidth;\n const visibleItems = Math.round(scrollArea / itemWidth);\n const lastItemOffset = carouselComponent.querySelector(':scope > div:last-child').offsetLeft;\n const lastItemInView = carouselInner.scrollLeft + scrollArea + carouselInner.getBoundingClientRect().left >= lastItemOffset + 60;\n //Check if theres room for more slides than we have\n const leftOverSpace = Math.ceil(itemCount / visibleItems) * visibleItems - itemCount;\n /*\n When the last slide isn't filled with items, we only want to move back the number of items on the slide,\n rather than the total number of possible visible items\n */\n const spacesToMove = visibleItems - leftOverSpace;\n //Only want to change the amount of movement if the last item is visible\n const movement = lastItemInView && leftOverSpace > 0 ? spacesToMove * itemWidth : carouselInner.clientWidth;\n for (let target = e.target; target && target != this; target = target.parentNode) {\n if (typeof target.matches == 'function' && target.matches('.btn-next, .btn-prev')) {\n const direction = target.matches('.btn-next') ? 'next' : 'prev';\n const customEvent = new CustomEvent(`${direction}-clicked`, {\n detail: {\n slide: target.getAttribute('data-go'),\n },\n });\n carouselComponent.dispatchEvent(customEvent);\n e.preventDefault();\n const scrollTo = target.classList.contains('btn-prev')\n ? carouselInner.scrollLeft - movement\n : carouselInner.scrollLeft + carouselInner.clientWidth;\n carouselInner.scroll({\n top: 0,\n left: scrollTo,\n behavior: 'smooth',\n });\n break;\n }\n }\n }, false);\n carouselProgress.addEventListener(stepperStart, function () {\n clearInterval(stepperInterval);\n stepperInterval = setInterval(function () {\n scrollArea = carouselInner.clientWidth;\n itemWidth = carouselComponent.querySelector(':scope > div').scrollWidth;\n visibleItems = Math.round(scrollArea / itemWidth);\n carouselProgress.setAttribute('step', visibleItems);\n progressMax = getProgressMax(itemCount, visibleItems);\n carouselProgress.setAttribute('max', progressMax);\n percent = getProgressPercent(carouselProgress.value, progressMax);\n carouselProgress.style.setProperty('--percent', percent + '%');\n }, 10);\n });\n carouselProgress.addEventListener(stepperEvent, function () {\n clearInterval(stepperInterval);\n });\n carouselProgress.addEventListener('change', function () {\n clearInterval(stepperInterval);\n const target = carouselComponent.querySelector(`:scope > *:nth-child(${carouselProgress.value})`);\n carouselInner.scroll({\n top: 0,\n left: target ? target.offsetLeft - carouselInner.getBoundingClientRect().left : 0,\n behavior: 'smooth',\n });\n //const direction = target.matches('.btn-next') ? 'next' : 'prev';\n const customEvent = new CustomEvent(`slider-changed`, {\n detail: {\n slide: carouselProgress.value,\n },\n });\n carouselComponent.dispatchEvent(customEvent);\n }, false);\n};\nexport const updateCarousel = function (carouselComponent) {\n const carouselElement = carouselComponent.shadowRoot.querySelector('.carousel');\n const carouselInner = carouselElement.querySelector('.carousel__inner');\n const carouselControls = carouselElement.querySelector('.carousel__controls');\n const carouselProgress = carouselElement.querySelector('.carousel__progress [type=\"range\"]');\n const itemCount = carouselComponent.querySelectorAll(':scope > div').length;\n let scrollArea = carouselInner.clientWidth;\n let itemWidth = carouselComponent.querySelector(':scope > div').scrollWidth;\n let visibleItems = Math.round(scrollArea / itemWidth);\n carouselProgress.setAttribute('min', 1);\n carouselProgress.setAttribute('step', visibleItems);\n let progressMax = getProgressMax(itemCount, visibleItems);\n carouselProgress.setAttribute('max', progressMax);\n carouselProgress.value = 1;\n let percent = getProgressPercent(1, progressMax);\n carouselProgress.style.setProperty('--percent', percent + '%');\n carouselControls.innerHTML = generatePipsHTML(carouselComponent, []);\n};\nexport default carousel;\n","export const trackComponentRegistered = (componentName) => {\n // Data layer Web component created\n window.dataLayer = window.dataLayer || [];\n window.dataLayer.push({\n event: 'customElementRegistered',\n element: componentName,\n });\n};\nexport const trackComponent = (component, componentName, trackEvents) => {\n // Data layer Web component created\n window.dataLayer = window.dataLayer || [];\n window.dataLayer.push({\n event: 'customElementAdded',\n element: componentName,\n });\n trackEvents.forEach((eventName) => {\n component.addEventListener(eventName, function (event) {\n const eventDetails = {\n event: eventName,\n element: componentName,\n target: event.target,\n };\n Object.keys(event.detail).forEach((eventKey) => {\n const eventDetail = event.detail[eventKey];\n eventDetails[eventKey] = eventDetail;\n });\n window.dataLayer.push(eventDetails);\n });\n });\n return true;\n};\n","import { generateThumbnailList, generatePipsHTML, carousel, updateCarousel } from '../../modules/carousel';\nimport { trackComponent, trackComponentRegistered } from '../_global';\ntrackComponentRegistered('iam-carousel');\nclass iamCarousel 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/carousel.component.css\";`;\n const template = document.createElement('template');\n template.innerHTML = /* HTML */ `\n <style>\n ${loadCSS}\n ${this.hasAttribute('css') ? `@import \"${this.getAttribute('css')}\";` : ``}\n </style>\n <div class=\"carousel\" part=\"carousel\">\n <div class=\"carousel__wrapper\">\n <div class=\"carousel__inner\">\n <div class=\"carousel__content\" part=\"content\">\n <slot></slot>\n </div>\n </div>\n </div>\n <div class=\"carousel__btns\" part=\"btns\">\n <button class=\"btn btn-secondary btn-compact fa-plus-large btn-prev\" data-go=\"0\" disabled part=\"prev\">\n Prev\n </button>\n <button class=\"btn btn-secondary btn-compact fa-plus-large btn-next\" data-go=\"2\" part=\"next\">Next</button>\n </div>\n\n <div class=\"carousel__controls\" part=\"controls\"></div>\n\n <div class=\"carousel__progress\" part=\"progress\">\n <input type=\"range\" min=\"0\" max=\"100\" value=\"1\" step=\"1\" />\n </div>\n </div>\n `;\n this.shadowRoot.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n // eslint-disable-next-line @typescript-eslint/no-this-alias\n const carouselComponent = this;\n //const carouselElement = this.shadowRoot.querySelector('.carousel');\n //const row = this.shadowRoot.querySelector('.row');\n let thumbnailImages = [];\n const carouselControls = this.shadowRoot.querySelector('.carousel__controls');\n if (carouselComponent.querySelector('[data-thumbnail]')) {\n thumbnailImages = generateThumbnailList(carouselComponent);\n carouselComponent.classList.add('thumbnails');\n }\n // populate the pips\n carouselControls.innerHTML = generatePipsHTML(carouselComponent, thumbnailImages);\n Array.from(carouselComponent.querySelectorAll(':scope > div > img:first-child:last-child, :scope > div > picture:first-child:last-child img')).forEach((image) => {\n image.style.inset = '0 0.5rem 0 0.5rem';\n image.style.position = 'absolute';\n image.style.width = 'calc(100% - 1rem)';\n image.style.height = '100%';\n image.style['object-fit'] = 'cover';\n image.closest('div').classList.add('image__wrapper');\n });\n carousel(carouselComponent);\n const observer = new MutationObserver(function (mutations) {\n mutations.forEach(function (mutationRecord) {\n const targetElement = mutationRecord.target;\n updateCarousel(targetElement);\n });\n });\n observer.observe(carouselComponent, {\n attributes: false,\n childList: true,\n subtree: true,\n });\n trackComponent(carouselComponent, 'iam-carousel', [\n 'pip-clicked',\n 'next-clicked',\n 'prev-clicked',\n 'slider-changed',\n ]);\n }\n}\nexport default iamCarousel;\n"],"names":["generateThumbnailList","carouselComponent","thumbnailImages","slide","index","generatePipsHTML","itemCount","pips","i","pipContent","pipClass","getProgressMax","visibleItems","getProgressPercent","value","max","carousel","scrollTimeout","carouselElement","carouselInner","carouselControls","carouselProgress","scrollArea","itemWidth","progressMax","percent","stepperInterval","stepperEvent","stepperStart","scrollWidth","scrollLeft","targetSlide","lastItemOffset","lastItemInView","leftOverSpace","button","e","target","customEvent","el","spacesToMove","movement","direction","scrollTo","updateCarousel","trackComponentRegistered","componentName","trackComponent","component","trackEvents","eventName","event","eventDetails","eventKey","eventDetail","iamCarousel","template","image","mutations","mutationRecord","targetElement"],"mappings":"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"}