1"use strict" 2/*! For license information please see 3.js.LICENSE.txt */ 3;(self.webpackChunkslick=self.webpackChunkslick||[]).push([[3],{1762(t,e,i){i.d(e,["i",0,(t,e,i)=>(i.configurable=!0,i.enumerable=!0,Reflect.decorate&&"object"!=typeof e&&Object.defineProperty(t,e,i),i)])},6505(t,e,i){i.d(e,["E",0,t=>(e,i)=>{void 0!==i?i.addInitializer(()=>{customElements.define(t,e)}):customElements.define(t,e)}])},5694(t,e,i){i.d(e,{M:()=>a});var o=i(842);const r={attribute:!0,type:String,converter:o.W3,reflect:!1,hasChanged:o.Ec},s=(t=r,e,i)=>{const{kind:o,metadata:s}=i;let a=globalThis.litPropertyMetadata.get(s);if(void 0===a&&globalThis.litPropertyMetadata.set(s,a=new Map),"setter"===o&&((t=Object.create(t)).wrapped=!0),a.set(i.name,t),"accessor"===o){const{name:o}=i;return{set(i){const r=e.get.call(this);e.set.call(this,i),this.requestUpdate(o,r,t,!0,i)},init(e){return void 0!==e&&this.C(o,void 0,t,e),e}}}if("setter"===o){const{name:o}=i;return function(i){const r=this[o];e.call(this,i),this.requestUpdate(o,r,t,!0,i)}}throw Error("Unsupported decorator location: "+o)};function a(t){return(e,i)=>"object"==typeof i?s(t,e,i):((t,e,i)=>{const o=e.hasOwnProperty(i);return e.constructor.createProperty(i,t),o?Object.getOwnPropertyDescriptor(e,i):void 0})(t,e,i)}},1124(t,e,i){i.d(e,{K:()=>r});var o=i(1762);function r(t){return(e,i)=>{const{slot:r,selector:s}=t??{},a="slot"+(r?`[name=${r}]`:":not([name])");return(0,o.i)(e,i,{get(){const e=this.renderRoot?.querySelector(a),i=e?.assignedElements(t)??[];return void 0===s?i:i.filter(t=>t.matches(s))}})}}},1895(t,e,i){i.d(e,{P:()=>r});var o=i(1762);function r(t,e){return(i,r,s)=>{const a=e=>e.renderRoot?.querySelector(t)??null;if(e){const{get:t,set:e}="object"==typeof r?i:s??(()=>{const t=Symbol();return{get(){return this[t]},set(e){this[t]=e}}})();return(0,o.i)(i,r,{get(){let i=t.call(this);return void 0===i&&(i=a(this),(null!==i||this.hasUpdated)&&e.call(this,i)),i}})}return(0,o.i)(i,r,{get(){return a(this)}})}}},4290(t,e,i){i.d(e,{w:()=>r});var o=i(5694);function r(t){return(0,o.M)({...t,state:!0,attribute:!1})}},842(t,e,i){i.d(e,{mN:()=>$,AH:()=>l,W3:()=>x,Ec:()=>C});const o=globalThis,r=o.ShadowRoot&&(void 0===o.ShadyCSS||o.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,s=Symbol(),a=new WeakMap;class n{constructor(t,e,i){if(this._$cssResult$=!0,i!==s)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=t,this.t=e}get styleSheet(){let t=this.o;const e=this.t;if(r&&void 0===t){const i=void 0!==e&&1===e.length;i&&(t=a.get(e)),void 0===t&&((this.o=t=new CSSStyleSheet).replaceSync(this.cssText),i&&a.set(e,t))}return t}toString(){return this.cssText}}const l=(t,...e)=>{const i=1===t.length?t[0]:e.reduce((e,i,o)=>e+(t=>{if(!0===t._$cssResult$)return t.cssText;if("number"==typeof t)return t;throw Error("Value passed to 'css' function must be a 'css' function result: "+t+". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.")})(i)+t[o+1],t[0]);return new n(i,t,s)},d=(t,e)=>{if(r)t.adoptedStyleSheets=e.map(t=>t instanceof CSSStyleSheet?t:t.styleSheet);else for(const i of e){const e=document.createElement("style"),r=o.litNonce;void 0!==r&&e.setAttribute("nonce",r),e.textContent=i.cssText,t.appendChild(e)}},c=r?t=>t:t=>t instanceof CSSStyleSheet?(t=>{let e="";for(const i of t.cssRules)e+=i.cssText;return(t=>new n("string"==typeof t?t:t+"",void 0,s))(e)})(t):t,{is:u,defineProperty:m,getOwnPropertyDescriptor:h,getOwnPropertyNames:p,getOwnPropertySymbols:g,getPrototypeOf:b}=Object,v=globalThis,y=v.trustedTypes,f=y?y.emptyScript:"",_=v.reactiveElementPolyfillSupport,w=(t,e)=>t,x={toAttribute(t,e){switch(e){case Boolean:t=t?f:null;break;case Object:case Array:t=null==t?t:JSON.stringify(t)}return t},fromAttribute(t,e){let i=t;switch(e){case Boolean:i=null!==t;break;case Number:i=null===t?null:Number(t);break;case Object:case Array:try{i=JSON.parse(t)}catch(t){i=null}}return i}},C=(t,e)=>!u(t,e),k={attribute:!0,type:String,converter:x,reflect:!1,useDefault:!1,hasChanged:C};Symbol.metadata??=Symbol("metadata"),v.litPropertyMetadata??=new WeakMap;class $ extends HTMLElement{static addInitializer(t){this._$Ei(),(this.l??=[]).push(t)}static get observedAttributes(){return this.finalize(),this._$Eh&&[...this._$Eh.keys()]}static createProperty(t,e=k){if(e.state&&(e.attribute=!1),this._$Ei(),this.prototype.hasOwnProperty(t)&&((e=Object.create(e)).wrapped=!0),this.elementProperties.set(t,e),!e.noAccessor){const i=Symbol(),o=this.getPropertyDescriptor(t,i,e);void 0!==o&&m(this.prototype,t,o)}}static getPropertyDescriptor(t,e,i){const{get:o,set:r}=h(this.prototype,t)??{get(){return this[e]},set(t){this[e]=t}};return{get:o,set(e){const s=o?.call(this);r?.call(this,e),this.requestUpdate(t,s,i)},configurable:!0,enumerable:!0}}static getPropertyOptions(t){return this.elementProperties.get(t)??k}static _$Ei(){if(this.hasOwnProperty(w("elementProperties")))return;const t=b(this);t.finalize(),void 0!==t.l&&(this.l=[...t.l]),this.elementProperties=new Map(t.elementProperties)}static finalize(){if(this.hasOwnProperty(w("finalized")))return;if(this.finalized=!0,this._$Ei(),this.hasOwnProperty(w("properties"))){const t=this.properties,e=[...p(t),...g(t)];for(const i of e)this.createProperty(i,t[i])}const t=this[Symbol.metadata];if(null!==t){const e=litPropertyMetadata.get(t);if(void 0!==e)for(const[t,i]of e)this.elementProperties.set(t,i)}this._$Eh=new Map;for(const[t,e]of this.elementProperties){const i=this._$Eu(t,e);void 0!==i&&this._$Eh.set(i,t)}this.elementStyles=this.finalizeStyles(this.styles)}static finalizeStyles(t){const e=[];
3if(Array.isArray(t)){const i=new Set(t.flat(1/0).reverse());for(const t of i)e.unshift(c(t))}else void 0!==t&&e.push(c(t));return e}static _$Eu(t,e){const i=e.attribute;return!1===i?void 0:"string"==typeof i?i:"string"==typeof t?t.toLowerCase():void 0}constructor(){super(),this._$Ep=void 0,this.isUpdatePending=!1,this.hasUpdated=!1,this._$Em=null,this._$Ev()}_$Ev(){this._$ES=new Promise(t=>this.enableUpdating=t),this._$AL=new Map,this._$E_(),this.requestUpdate(),this.constructor.l?.forEach(t=>t(this))}addController(t){(this._$EO??=new Set).add(t),void 0!==this.renderRoot&&this.isConnected&&t.hostConnected?.()}removeController(t){this._$EO?.delete(t)}_$E_(){const t=new Map,e=this.constructor.elementProperties;for(const i of e.keys())this.hasOwnProperty(i)&&(t.set(i,this[i]),delete this[i]);t.size>0&&(this._$Ep=t)}createRenderRoot(){const t=this.shadowRoot??this.attachShadow(this.constructor.shadowRootOptions);return d(t,this.constructor.elementStyles),t}connectedCallback(){this.renderRoot??=this.createRenderRoot(),this.enableUpdating(!0),this._$EO?.forEach(t=>t.hostConnected?.())}enableUpdating(t){}disconnectedCallback(){this._$EO?.forEach(t=>t.hostDisconnected?.())}attributeChangedCallback(t,e,i){this._$AK(t,i)}_$ET(t,e){const i=this.constructor.elementProperties.get(t),o=this.constructor._$Eu(t,i);if(void 0!==o&&!0===i.reflect){const r=(void 0!==i.converter?.toAttribute?i.converter:x).toAttribute(e,i.type);this._$Em=t,null==r?this.removeAttribute(o):this.setAttribute(o,r),this._$Em=null}}_$AK(t,e){const i=this.constructor,o=i._$Eh.get(t);if(void 0!==o&&this._$Em!==o){const t=i.getPropertyOptions(o),r="function"==typeof t.converter?{fromAttribute:t.converter}:void 0!==t.converter?.fromAttribute?t.converter:x;this._$Em=o;const s=r.fromAttribute(e,t.type);this[o]=s??this._$Ej?.get(o)??s,this._$Em=null}}requestUpdate(t,e,i,o=!1,r){if(void 0!==t){const s=this.constructor;if(!1===o&&(r=this[t]),i??=s.getPropertyOptions(t),!((i.hasChanged??C)(r,e)||i.useDefault&&i.reflect&&r===this._$Ej?.get(t)&&!this.hasAttribute(s._$Eu(t,i))))return;this.C(t,e,i)}!1===this.isUpdatePending&&(this._$ES=this._$EP())}C(t,e,{useDefault:i,reflect:o,wrapped:r},s){i&&!(this._$Ej??=new Map).has(t)&&(this._$Ej.set(t,s??e??this[t]),!0!==r||void 0!==s)||(this._$AL.has(t)||(this.hasUpdated||i||(e=void 0),this._$AL.set(t,e)),!0===o&&this._$Em!==t&&(this._$Eq??=new Set).add(t))}async _$EP(){this.isUpdatePending=!0;try{await this._$ES}catch(t){Promise.reject(t)}const t=this.scheduleUpdate();return null!=t&&await t,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){if(!this.isUpdatePending)return;if(!this.hasUpdated){if(this.renderRoot??=this.createRenderRoot(),this._$Ep){for(const[t,e]of this._$Ep)this[t]=e;this._$Ep=void 0}const t=this.constructor.elementProperties;if(t.size>0)for(const[e,i]of t){const{wrapped:t}=i,o=this[e];!0!==t||this._$AL.has(e)||void 0===o||this.C(e,void 0,i,o)}}let t=!1;const e=this._$AL;try{t=this.shouldUpdate(e),t?(this.willUpdate(e),this._$EO?.forEach(t=>t.hostUpdate?.()),this.update(e)):this._$EM()}catch(e){throw t=!1,this._$EM(),e}t&&this._$AE(e)}willUpdate(t){}_$AE(t){this._$EO?.forEach(t=>t.hostUpdated?.()),this.hasUpdated||(this.hasUpdated=!0,this.firstUpdated(t)),this.updated(t)}_$EM(){this._$AL=new Map,this.isUpdatePending=!1}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this._$ES}shouldUpdate(t){return!0}update(t){this._$Eq&&=this._$Eq.forEach(t=>this._$ET(t,this[t])),this._$EM()}updated(t){}firstUpdated(t){}}$.elementStyles=[],$.shadowRootOptions={mode:"open"},$[w("elementProperties")]=new Map,$[w("finalized")]=new Map,_?.({ReactiveElement:$}),(v.reactiveElementVersions??=[]).push("2.1.2")},7313(t,e,i){function o(t,e,i,o){var r,s=arguments.length,a=s<3?e:null===o?o=Object.getOwnPropertyDescriptor(e,i):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(t,e,i,o);else for(var n=t.length-1;n>=0;n--)(r=t[n])&&(a=(s<3?r(a):s>3?r(e,i,a):r(e,i))||a);return s>3&&a&&Object.defineProperty(e,i,a),a}"function"==typeof SuppressedError&&SuppressedError;var r=i(2618),s=i(6505),a=i(9563),n=i(7509),l=i(7621),d=i(3720),c=i(1145),u=i(31),m=i(6752);const{I:h}=m.ge;var p=i(7804);const g=(t,e)=>{const i=t._$AN;if(void 0===i)return!1;for(const t of i)t._$AO?.(e,!1),g(t,e);return!0},b=t=>{let e,i;do{if(void 0===(e=t._$AM))break;i=e._$AN,i.delete(t),t=e}while(0===i?.size)},v=t=>{for(let e;e=t._$AM;t=e){let i=e._$AN;if(void 0===i)e._$AN=i=new Set;else if(i.has(t))break;i.add(t),_(e)}};function y(t){void 0!==this._$AN?(b(this),this._$AM=t,v(this)):this._$AM=t}function f(t,e=!1,i=0){const o=this._$AH,r=this._$AN;if(void 0!==r&&0!==r.size)if(e)if(Array.isArray(o))for(let t=i;t<o.length;t++)g(o[t],!1),b(o[t]);else null!=o&&(g(o,!1),b(o));else g(this,t)}const _=t=>{t.type==p.OA.CHILD&&(t._$AP??=f,t._$AQ??=y)};class w extends p.WL{constructor(){super(...arguments),this._$AN=void 0}_$AT(t,e,i){super._$AT(t,e,i),v(this),this.isConnected=t._$AU}_$AO(t,e=!0){t!==this.isConnected&&(this.isConnected=t,t?this.reconnected?.():this.disconnected?.()),e&&(g(this,t),b(this))}setValue(t){if((t=>void 0===t.strings)(this._$Ct))this._$Ct._$AI(t,this);else{const e=[...this._$Ct._$AH];e[this._$Ci]=t,this._$Ct._$AI(e,this,0)}}disconnected(){}reconnected(){}}class x{constructor(t){this.G=t}disconnect(){this.G=void 0}reconnect(t){this.G=t}deref(){return this.G}}class C{constructor(){this.Y=void 0,this.Z=void 0}get(){return this.Y}pause(){this.Y??=new Promise(t=>this.Z=t)}resume(){this.Z?.(),this.Y=this.Z=void 0}}const k=t=>!(t=>null===t||"object"!=typeof t&&"function"!=typeof t)(t)&&"function"==typeof t.then,$=1073741823;const M=(0,p.u$)(class extends w{constructor(){super(...arguments),this._$Cwt=$,this._$Cbt=[],this._$CK=new x(this),this._$CX=new C}render(...t){return t.find(t=>!k(t))??m.c0}update(t,e){const i=this._$Cbt;let o=i.length;this._$Cbt=e;const r=this._$CK,s=this._$CX;this.isConnected||this.disconnected();for(let t=0;t<e.length&&!(t>this._$Cwt);t++){const a=e[t];if(!k(a))return this._$Cwt=t,a;t<o&&a===i[t]||(this._$Cwt=$,o=0,Promise.resolve(a).then(async t=>{for(;s.get();)await s.get();const e=r.deref();if(void 0!==e){const i=e._$Cbt.indexOf(a);i>-1&&i<e._$Cwt&&(e._$Cwt=i,e.setValue(t))}}))}return m.c0}disconnected(){this._$CK.disconnect(),this._$CX.pause()}reconnected(){this._$CK.reconnect(this),this._$CX.resume()}}),S=r.AH` 4 5 /* Box sizing */ 6 *, *:before, *:after { 7 box-sizing: border-box; 8 } 9 10 /* Font family type groups */ 11 h1,h2,h3,h4,h5,h6 { 12 font-family: var(--umg-font-heading-family, 'Roboto Serif', Times, 'Times New Roman', Georgia, serif); 13 } 14 15 p { 16 font-family: var(--umg-font-body-family, Roboto, Arial, Helvetica, sans-serif); 17 } 18 19 /* Hidden elements */ 20 *[hidden="true" i] { display: none } 21 22 /* Browser native features */ 23 summary { 24 -webkit-tap-highlight-color: transparent; 25 } 26 27 /* Accessibilty states */ 28 *:focus-visible:not(umg-button-icon) { 29 outline: 0.125rem solid rgba(var(--umg-color-base-background, 0,0,0), 0.5); 30 outline-offset: 0.1875rem; 31 box-shadow: 0 0 0 0.15rem rgb(var(--umg-color-base-text, 255,255,255)),0 0 0.25rem 0.2rem rgba(var(--umg-color-base-background, 0,0,0), 0.5); 32 } 33 @supports (color: rgb(from white r g b)) { 34 *:focus-visible:not(umg-button-icon) { 35 outline: 0.125rem solid rgb(from var(--umg-color-base-background, rgb(0,0,0)) r g b / alpha); 36 outline-offset: 0.1875rem; 37 box-shadow: 0 0 0 0.15rem rgb(from var(--umg-color-base-text, rgb(255,255,255)) r g b / alpha), 0 0 0.25rem 0.2rem rgb(from var(--umg-color-base-background, rgb(0,0,0)) r g b / alpha); 38 } 39 } 40`;var A=i(6040);class z{constructor(t){this.listeners=new Map,this.target=t}addEventListener(t,e,i){const o=this.listeners.get(t)||new Set;return this.listeners.set(t,o),o.add(e),this.target.addEventListener(t,e,i),()=>{this.removeEventListener(t,e,i)}}removeEventListener(t,e,i){const o=this.listeners.get(t);o&&(o.delete(e),0===o.size&&this.listeners.delete(t)),this.target.removeEventListener(t,e,i)}dispatchCustomEvent(t,e,i){this.target.dispatchEvent(new CustomEvent(t,{detail:e,...i}))}}const{prefix:H}={prefix:"umgs"};let E=class extends r.WF{constructor(){super(...arguments),this.labels={contents:"Your cart contents:",empty:"Your cart is empty.",adding:"Adding item",add:"Items added to your cart.",removing:"Removing items",remove:"Item removed from cart.",updatedCart:"Item updated.",checkout:"Checkout now",continue:"Continue shopping"},this.drawerType="drop-down",this.drawerWidth="28",this.checkoutType="checkout",this.open=!1,this._region="default",this._init=!1,this._currentMessage="empty",this._updatedCartMessage=!1,this._maxQuantities={},this._cartErrors={},this._clientValidationErrorResult={},this.cart={id:"",totalQuantity:0,cost:{totalAmount:{amount:0,currencyCode:"GBP"},subtotalAmount:{amount:0,currencyCode:"GBP"}},checkoutUrl:"",lines:[],userErrors:""},this.cartEventManager=new z(this),this.windowEventManager=new z(window),this._eventsHandler=t=>{const e=t;if("umg-disclosure:opened"===t.type&&this._cartOverlay?.classList.remove("hidden"),"umg-disclosure:closed"===t.type&&(this._cartOverlay?.classList.add("hidden"),this._clearUpdatedCartMessage(),this._cartErrors={},this._clientValidationErrorResult={},this.cart.userErrors=""),e.detail&&("click"===t.type&&"umgs-cart:add"===e.detail.eventName&&this._addTocart(t),"change"===t.type&&"line-item-quantity[]"===e.detail.fieldName&&e.detail.fieldId&&this._updateCart(t),"umgs-cart:error"===t.type&&"umgs-cart:error"===e.detail.eventName)){if(this._cartErrors={},e.detail.errors&&Array.isArray(e.detail.errors))if(e.detail.errors.length>0&&e.detail.errors[0].lineItemId)this._clientValidationErrorResult={}
40,e.detail.errors.forEach(t=>{t.lineItemId&&(this._clientValidationErrorResult[t.lineItemId]=t.message)}),this._cartErrors={};else{this._cartErrors={};const i=e.detail.errors[0]?.message||"An unknown error occurred.";try{const t=JSON.parse(i);if(Array.isArray(t)&&t.length>0&&(t[0].error||t[0].variants&&t[0].variants.length>0&&t[0].variants[0].error)){const e=this._findBundleLineItemIdByComponentProductId("gid://shopify/Product/"+t[0].id,this.cart.lines),i=e||"gid://shopify/Product/"+t[0].id;let o=t[0].error;!o&&t[0].variants&&t[0].variants.length>0&&(o=t[0].variants[0].error),this._cartErrors[i]=o}else this._cartErrors.general_api_error=i}catch(t){this._cartErrors.general_api_error=i}this._clientValidationErrorResult={}}this._openCart()}"umg-store:region-change"===t.type&&this._regionChangeHandler(e)}}connectedCallback(){super.connectedCallback(),this.initCart(),this.windowEventManager.addEventListener("click",this._eventsHandler),this.windowEventManager.addEventListener("change",this._eventsHandler),this.windowEventManager.addEventListener("umgs-cart:error",this._eventsHandler),this.cartEventManager.addEventListener("umg-disclosure:opened",this._eventsHandler),this.cartEventManager.addEventListener("umg-disclosure:closed",this._eventsHandler),this.windowEventManager.addEventListener("umg-store:region-change",this._eventsHandler)}disconnectedCallback(){this.windowEventManager.removeEventListener("click",this._eventsHandler),this.windowEventManager.removeEventListener("change",this._eventsHandler),this.windowEventManager.removeEventListener("umgs-cart:error",this._eventsHandler),this.cartEventManager.removeEventListener("umg-disclosure:opened",this._eventsHandler),this.cartEventManager.removeEventListener("umg-disclosure:closed",this._eventsHandler),super.disconnectedCallback()}_validateBundleComponentLimits(t,e,i,o){const r=[];if(e<=0||!i||0===i.length||!t)return r;const s=o.find(e=>e.id===t);let a=100;if(s){const i=s.merchandise?.product;if(i&&i.purchaseLimit){a=parseInt(i.purchaseLimit.value);if((s.quantity||0)+e>a)return r.push({lineItemId:t,message:`${i.title} has a maximum purchasable quantity of ${a}`}),r}}for(const s of i){const i=s.id;let a=100;if(s.product.variants?.edges[0]?.node?.purchaseLimit?a=s.product.variants.edges[0].node.purchaseLimit.value:s.product.purchaseLimit?a=s.product.purchaseLimit.value:s.product.variants?.edges[0]?.node?.quantityAvailable&&(a=s.product.variants.edges[0].node.quantityAvailable),i&&a&&!isNaN(a)&&a>0){let n=0;o.forEach(t=>{t.merchandise?.id===i&&(n+=t.quantity||0),t.merchandise?.umgBundlesDetails&&t.merchandise.umgBundlesDetails.forEach(e=>{e.id===i&&(n+=t.quantity||0)})});if(n+e>a){const e=s.product?.title||"component";r.push({lineItemId:t,message:`${e} has a maximum purchasable quantity of ${a}`});break}}}return r}_validateSimpleProductLimits(t,e,i,o){const r=[];if(i<=0)return r;const s=o.find(e=>e.id===t);if(!s||!s.merchandise||s.merchandise.id!==e)return console.warn("Could not find matching line item for validation:",{lineItemId:t,variantId:e}),r;const a=(s.quantity||0)+i,n=s.merchandise,l=n?.product?.title||"Item",d="Default Title"===n?.title?"":n?.title,c=d?`${l} - ${d}`:l;let u;const m=n?.product?.variants?.edges?.[0]?.node,h=m?.purchaseLimit?.value;if(h){const t=parseInt(h);!isNaN(t)&&t>=0&&(u=t)}
40if(void 0===u){const t=n?.product?.purchaseLimit?.value;if(t){const e=parseInt(t);!isNaN(e)&&e>=0&&(u=e)}}if(void 0===u){const t=m?.quantityAvailable;null!=t&&t>=0&&(u=t)}return void 0===u&&(u=100),a>u&&r.push({lineItemId:t,message:`${c} has a maximum purchasable quantity of ${u}`}),r}_revertNumberFieldValue(t,e){void 0!==e&&requestAnimationFrame(()=>{const i=this.shadowRoot?.querySelector(`umg-number-field[id="${t}"]`);if(i){let t=i.shadowRoot?.querySelector('input[part="text-field"]');if(t||(t=i.shadowRoot?.querySelector(".input-container input")),t||(t=i.shadowRoot?.querySelector("input")),t){t.value=e.toString(),i.setAttribute("value",e.toString());const o=new CustomEvent("input",{bubbles:!0});t.dispatchEvent(o)}}})}_regionChangeHandler(t){const e=t.detail.region;e!==this._region&&(this._region=e,this.apiClient?.clearCart(),this.cart={id:"",totalQuantity:0,cost:{totalAmount:{amount:0,currencyCode:""},subtotalAmount:{amount:0,currencyCode:""}},checkoutUrl:"",lines:[],userErrors:""})}async _getItemShippingInfo(t){try{return window.UMGGR_Store&&"function"==typeof window.UMGGR_Store.getShipDate?await window.UMGGR_Store.getShipDate(t):null}catch(t){return console.error("Error getting shipping info for cart item:",t),null}}updated(t){(!1===this._init&&t.has("storefrontDomain")&&t.has("storefrontApiKey")||t.has("storefrontDomain")&&t.has("storefrontApiKey")&&"storefrontDomain"in t&&"storefrontApiKey"in t&&(t.storefrontDomain!==this.storefrontApiKey||t.storefrontApiKey!==this.storefrontApiKey)&&this.storefrontDomain&&this.storefrontApiKey)&&this.initCart()}async initCart(){if(this.storefrontDomain&&this.storefrontApiKey){this.apiClient=new A.A(this.storefrontDomain,this.storefrontApiKey),this._init=!0;const t=await this.apiClient.getCart();if(t){if("lines"in t&&Array.isArray(t.lines))for(const e in t.lines)if("object"==typeof t.lines[e]&&"merchandise"in t.lines[e]&&t.lines[e].merchandise&&"object"==typeof t.lines[e].merchandise&&"umgBundles"in t.lines[e].merchandise&&t.lines[e].merchandise.umgBundles&&"value"in t.lines[e].merchandise.umgBundles)try{const i=JSON.parse(t.lines[e].merchandise.umgBundles.value).map(t=>`gid://shopify/ProductVariant/${t.component_variant_id}`),o=await this.apiClient.getBundleProductCart(i);o&&(t.lines[e].merchandise.umgBundlesDetails=o)}catch(t){console.log(t)}this.cart=t,t.lines.length?this._updateCartMessage("contents"):t.lines.length||this._updateCartMessage("empty")}}}_updateCartMessage(t){this._currentMessage=t}_clearUpdatedCartMessage(){this._updatedCartMessage&&this.cart.lines.length?(this._updateCartMessage("contents"),this._updatedCartMessage=!1):this._updatedCartMessage&&!this.cart.lines.length&&(this._updateCartMessage("empty"),this._updatedCartMessage=!1)}getCartDetails(){return this.cart}async _addTocart(t){const e=t.detail.variant,i=parseInt(t.detail.quantity)||1,o=e?.id;if(!o){console.error("Add to cart failed: Missing variant ID.");const t={bubbles:!0,composed:!0},e={eventName:"umgs-cart:error",errors:[{message:"Cannot add item: Missing variant ID."}]};return void this.windowEventManager.dispatchCustomEvent("umgs-cart:error",e,t)}const r=this.cart.lines.find(t=>t.merchandise?.id===o);let s,a=o;r&&(a=r.id);try{if(e.umgBundles&&this.apiClient){const t=e.umgBundles.map(t=>`gid://shopify/ProductVariant/${t.component_variant_id}`);s=await this.apiClient.getBundleProductCart(t)}}catch(t){console.log(t)}if(s&&s.length>0){const t=this._validateBundleComponentLimits(a,i,s,this.cart.lines);if(t.length>0){const e={bubbles:!0,composed:!0},i={eventName:"umgs-cart:error",errors:t};return void this.windowEventManager.dispatchCustomEvent("umgs-cart:error",i,e)}}if(this.apiClient){this._updateCartMessage("adding");const e=await this.apiClient.addToCart([{quantity:i,merchandiseId:o,attributes:t.detail.properties}]);if(!e){console.error("Add to cart failed: No response from API.");const t={bubbles:!0,composed:!0},e={eventName:"umgs-cart:error",errors:[{message:"An unknown error occurred. Please try again."}]};return void this.windowEventManager.dispatchCustomEvent("umgs-cart:error",e,t)}if(e.errors&&0!==e.errors.length){const t={bubbles:!0,composed:!0},i={eventName:"umgs-cart:error",errors:e.errors};this._updateCartMessage("contents"),this.windowEventManager.dispatchCustomEvent("umgs-cart:error",i,t)}else{if("lines"in e&&Array.isArray(e.lines))for(const t in e.lines)if("object"==typeof e.lines[t]&&"merchandise"in e.lines[t]&&e.lines[t].merchandise&&"object"==typeof e.lines[t].merchandise&&"umgBundles"in e.lines[t].merchandise&&e.lines[t].merchandise.umgBundles&&"value"in e.lines[t].merchandise.umgBundles)try{const i=JSON.parse(e.lines[t].merchandise.umgBundles.value).map(t=>`gid://shopify/ProductVariant/${t.component_variant_id}`),o=await this.apiClient.getBundleProductCart(i);o&&(e.lines[t].merchandise.umgBundlesDetails=o)}catch(t){console.log(t)}this.cart=e,this._updateCartMessage("add"),this._openCart()}}}
40async _removeFromCart(t){if(this._updateCartMessage("removing"),this.apiClient){const e=[];this.cart.lines.forEach(i=>{if(i.id===t&&i.merchandise?.id){const t={id:i.id,quantity:0,merchandiseId:i.merchandise?.id};e.push(t)}else if(i.id&&i.merchandise?.id&&i.quantity){const t={id:i.id,quantity:i.quantity,merchandiseId:i.merchandise?.id};e.push(t)}});const i=await this.apiClient.updateItemsInCart(this.cart.id,e);if(i){if("lines"in i&&Array.isArray(i.lines))for(const t in i.lines)if("object"==typeof i.lines[t]&&"merchandise"in i.lines[t]&&i.lines[t].merchandise&&"object"==typeof i.lines[t].merchandise&&"umgBundles"in i.lines[t].merchandise&&i.lines[t].merchandise.umgBundles&&"value"in i.lines[t].merchandise.umgBundles)try{const e=JSON.parse(i.lines[t].merchandise.umgBundles.value).map(t=>`gid://shopify/ProductVariant/${t.component_variant_id}`),o=await this.apiClient.getBundleProductCart(e);o&&(i.lines[t].merchandise.umgBundlesDetails=o)}catch(t){console.log(t)}this.cart=i,this.cart.lines.length||this._updateCartMessage("empty")}this._updateCartMessage("remove")}}async _updateCart(t){if(this.apiClient){const e=t.detail.fieldId,i=parseInt(t.detail.value),o=this.cart.lines.find(t=>t.id===e);if(!o)return void console.error("Could not find line item to update:",e);const r=o.quantity||0,s=i-r;let a=[];if(o?.merchandise?.umgBundlesDetails?a=this._validateBundleComponentLimits(o.id,s,o.merchandise.umgBundlesDetails,this.cart.lines):o?.merchandise?.id&&(a=this._validateSimpleProductLimits(o.id,o.merchandise.id,s,this.cart.lines)),a.length>0){const t={bubbles:!0,composed:!0},i={eventName:"umgs-cart:error",errors:a};return this.windowEventManager.dispatchCustomEvent("umgs-cart:error",i,t),void this._revertNumberFieldValue(e,r)}const n={[e]:r},l=[];this.cart.lines.forEach(e=>{if(e.id===t.detail.fieldId&&e.merchandise?.id){const i={id:e.id,quantity:parseInt(t.detail.value),merchandiseId:e.merchandise?.id};l.push(i)}else if(e.id&&e.merchandise?.id&&e.quantity){const t={id:e.id,quantity:e.quantity,merchandiseId:e.merchandise?.id};l.push(t)}});const d=await this.apiClient.updateItemsInCart(this.cart.id,l);if(d&&(d.userErrors&&d.userErrors.length>0||d.cart&&d.cart.userErrors&&d.cart.userErrors.length>0)){const t=n[e];this._revertNumberFieldValue(e,t);const i={bubbles:!0,composed:!0},o={eventName:"umgs-cart:error",errors:d.userErrors};this.windowEventManager.dispatchCustomEvent("umgs-cart:error",o,i)}else this._cartErrors={},this._clientValidationErrorResult={},this._maxQuantities={};if(d){if("lines"in d&&Array.isArray(d.lines))for(const t in d.lines)if("object"==typeof d.lines[t]&&"merchandise"in d.lines[t]&&d.lines[t].merchandise&&"object"==typeof d.lines[t].merchandise&&"umgBundles"in d.lines[t].merchandise&&d.lines[t].merchandise.umgBundles&&"value"in d.lines[t].merchandise.umgBundles)try{const e=JSON.parse(d.lines[t].merchandise.umgBundles.value).map(t=>`gid://shopify/ProductVariant/${t.component_variant_id}`),i=await this.apiClient.getBundleProductCart(e);i&&(d.lines[t].merchandise.umgBundlesDetails=i)}catch(t){console.log(t)}this.cart=d}else this._currentMessage="empty"}}_checkoutAction(){if("cart"===this.checkoutType){const{hostname:t}=new URL(this.cart.checkoutUrl),e=this.generateUtmURL(`https://${t}/cart/clear?`,!1)+"&return_to=/cart/update?";let i="";this.cart.lines.forEach((t,e)=>{e>0&&(i=`${i}%26`),t&&"merchandise"in t&&t.merchandise&&"id"in t.merchandise&&(i=`${i}updates[${t.merchandise.id.replace("gid://shopify/ProductVariant/","")}]=${t.quantity}`)}),window.location.href=`${e}${i}`}else window.location.href=this.generateUtmURL(this.cart.checkoutUrl,!0)}_openCart(){this._disclosure?.disclosureOpen(),this._cartOverlay?.classList.remove("hidden")}_closeCart(){this._disclosure?.disclosureClose(),this._cartOverlay?.classList.add("hidden")}_openDirection(){return"drop-down"===this.drawerType?"down":"from-right"}zeroPad(t,e="GBP"){return Intl.NumberFormat("en-GB",{style:"currency",currency:e}).format(t)}generateUtmURL(t,e){let i="";return 1==e&&(i=t.includes("?")?"&":""),i+=""!==this.checkoutUtmSource?`utm_source=${this.checkoutUtmSource}&`:"",i+=""!==this.checkoutUtmCampaign?`utm_campaign=${this.checkoutUtmCampaign}&`:"",i+=""!==this.checkoutUtmMedium?`utm_medium=${this.checkoutUtmMedium}`:"",t+i}_cartMessage(){switch(this._currentMessage){case"contents":return r.qy` 41 <umg-text part="cart-message" as="span" variant="bodySm"> 42 ${this.labels.contents} 43 </umg-text> 44 `;case"adding":return this._updatedCartMessage=!0,r.qy` 45 <umg-icon 46 class="spinner" 47 icon="spinner" 48 size="small" 49 ></umg-icon> 50 <umg-text 51 part="cart-message" 52 as="span" 53 variant="bodySm" 54 color="subdued" 55 > 56 ${this.labels.adding} 57 </umg-text> 58 `;case"add":return this._updatedCartMessage=!0,r.qy` 59 <umg-icon 60 part="cart-check" 61 icon="check" 62 size="small" 63 ></umg-icon> 64 <umg-text part="cart-message" as="span" variant="bodySm"> 65 ${this.labels.add} 66 </umg-text> 67 `;case"removing":return this._updatedCartMessage=!0,r.qy` 68 <umg-icon 69 class="spinner" 70 icon="spinner" 71 size="small" 72 ></umg-icon> 73 <umg-text 74 part="cart-message" 75 as="span" 76 variant="bodySm" 77 color="subdued" 78 > 79 ${this.labels.removing} 80 </umg-text> 81 `;case"remove":return this._updatedCartMessage=!0,r.qy` 82 <umg-icon 83 part="cart-check" 84 icon="check" 85 size="small" 86 ></umg-icon> 87 <umg-text part="cart-message" as="span" variant="bodySm"> 88 ${this.labels.remove} 89 </umg-text> 90 `;default:return r.qy` 91 <umg-text part="cart-message" as="span" variant="bodySm"> 92 ${this.labels.empty} 93 </umg-text> 94 `}}_cartBundleItems(t){if(t&&t.merchandise?.umgBundlesDetails&&Array(t.merchandise?.umgBundlesDetails)&&t.merchandise?.umgBundlesDetails.length)return r.qy` 95 <umg-accordion 96 class="subitems-accordion" 97 justify="start" 98 iconSize="xsmall" 99 iconAnimation="flip" 100 open="true" 101 > 102 <umg-text 103 slot="header" 104 as="p" 105 variant="bodyXs" 106 alignment="left" 107 withoutMargin 108 > 109 Show ${t.merchandise?.umgBundlesDetails.length} 110 items 111 </umg-text> 112 <umg-box slot="content" padding="10, 0, 10, 0"> 113 ${t.merchandise?.umgBundlesDetails.map(t=>r.qy`<div 114part="subitem-container" 115class="subitem-container sub-items"><div 116part="subitem-image" 117class="subitem__image"><umg-image 118src="${(0,u.J)(t.product.featuredImage?.smallSrc)}" 119width="100" 120height="100"></umg-image></div><div 121part="subitem-content" 122class="subitem__content"><umg-text 123class="subitem__title" 124as="h4" 125variant="bodySm" 126withoutMargin>${t.product.title}</umg-text>${t.product.variants?.edges&&t.product.variants.edges.length>1?r.qy` 127 <umg-text 128 class="subitem__subtitle" 129 as="span" 130 variant="bodyXs" 131 withoutMargin 132 > 133 ${t.title} 134 </umg-text> 135 `:r.s6}</div></div>`)} 136 </umg-box> 137 </umg-accordion> 138 `}_cartItems(){if(Array.isArray(this.cart.lines)){const t={},e={};if(void 0!==this.cart.userErrors&&Array.isArray(this.cart.userErrors)&&this.cart.userErrors.length>
1380){this.cart.userErrors.forEach(i=>{JSON.parse(i.message).forEach(i=>{t["gid://shopify/Product/"+i.id]=i.error,e["gid://shopify/Product/"+i.id]=i.productLevelLimit})})}return r.qy` 139 ${this.cart.lines.map(i=>{const o=i.merchandise?.product.id,s=i.id;let a;s&&(a=this._clientValidationErrorResult[s]),!a&&o&&(a=t[o]),!a&&s&&this._cartErrors&&this._cartErrors[s]&&(a=this._cartErrors[s]),!a&&o&&this._cartErrors&&this._cartErrors[o]&&(a=this._cartErrors[o]),!a&&this._cartErrors&&this._cartErrors.general_api_error&&(a=this._cartErrors.general_api_error);const n=void 0!==a?1:0,l=i.merchandise?.product&&i.merchandise?.product.featuredImage?i.merchandise.product.featuredImage.smallSrc:void 0,d=0===this._maxQuantities[i.id],c=i.cost?.totalAmount?.amount?i.cost?.totalAmount?.amount:0,m=this.cart.cost.totalAmount?this.cart.cost.totalAmount?.currencyCode:"",h=i.merchandise?i.merchandise.id:"",p=o?e[o]??this._maxQuantities[h]??9999:this._maxQuantities[h]??9999,g=i.quantity;return r.qy`<div part="item-container"class="item-container"><div class="item"><div part="item-image"class="item__image"><umg-image 140src="${(0,u.J)(l)}" 141width="100" 142height="100"></umg-image></div><div part="item-content"class="item__content"><div class="item__meta"><umg-text 143class="item__title" 144as="h3" 145variant="bodyMd" 146fontWeight="bold" 147withoutMargin>${i.merchandise?.product.title}</umg-text><div class="item__details"><div class="item__details-row">${i.merchandise?.product.variants?.edges&&i.merchandise.product.variants.edges.length>1?r.qy` 148 <umg-text 149 class="item__subtitle" 150 as="span" 151 variant="bodySm" 152 withoutMargin 153 > 154 ${i.merchandise?.title} 155 </umg-text> 156 `:r.s6}<umg-text 157class="item__price" 158as="span" 159variant="bodySm" 160fontWeight="medium" 161withoutMargin>${this.zeroPad(c,m)}</umg-text></div>${M(this._getItemShippingInfo(i).then(t=>{if(!t)return r.s6;const e=t.split(":"),i=e[0]?.trim(),o=e[1]?.trim();return r.qy` 162 <div class="item__details-row"> 163 <umg-text 164 class="item__shipping-label" 165 as="span" 166 variant="bodySm" 167 fontWeight="700" 168 withoutMargin 169 > 170 ${i}: 171 </umg-text> 172 <umg-text 173 class="item__shipping-date" 174 as="span" 175 variant="bodySm" 176 withoutMargin 177 > 178 ${o?r.qy`${o}`:r.s6} 179 </umg-text> 180 </div> 181 `}),r.s6)}</div></div>${this._cartBundleItems(i)}<div 182part="item-update" 183class="item-update"><div class="quantity"><umg-number-field 184id="${i.id}" 185type="number" 186name="line-item-quantity[]" 187value="${(0,u.J)(g)}" 188max=${p} 189spinnerType="symbols" 190hideLabel?disabled=${d} 191data-error-state=${n}></umg-number-field></div><umg-button-icon@click=${()=>this._removeFromCart(i.id)} 192data-shopify-remove-from-cart 193part="remove-icon" 194class="remove-icon" 195icon="bin-x-solid" 196size="small" 197padding="0"></umg-button-icon></div><div part="item-error"><small style="color:red;">${a||""}</small></div></div></div></div>`})} 198 `}return r.s6}_cartPrice(){if(this.cart.cost.totalAmount&&this.cart.cost.totalAmount.amount){const t=this.cart.cost.totalAmount.amount,e=this.cart.cost.totalAmount.currencyCode?this.cart.cost.totalAmount.currencyCode:"";return this.zeroPad(t,e)}return r.s6}cartDrawerClasses(){const t={};return"side"===this.drawerType&&(t["cart-drawer--side"]=!0),t}cartDrawerStyles(){return{"--size-cart-drawer-width":this.drawerWidth+"rem"}}render(){const t=this.cart.cost?.subtotalAmount?.amount?this.cart.cost?.subtotalAmount?.amount:0,e=this.cart.cost.subtotalAmount?.currencyCode?this.cart.cost.subtotalAmount?.currencyCode:"";return r.qy` 199 <div 200 part="cart" 201 class="cart${(0,d.H)(this.cartDrawerClasses())}" 202 style="${(0,c.W)(this.cartDrawerStyles())}" 203 > 204 <umg-disclosure 205 class="cart-drawer" 206 justify="end" 207 direction="${this._openDirection()}" 208 iconPosition="left" 209 iconAnimation="none" 210 overlay 211 >
212 <span 213 slot="cart-drawer-summary" 214 class="cart-drawer__summary" 215 > 216 <umg-text as="span" variant="bodyXs"> 217 ${this._cartPrice()} 218 </umg-text> 219 </span> 220 <umg-button 221 slot="icon" 222 class="cart-button" 223 buttonStyle="plain" 224 data-shopify-open-cart 225 > 226 <span 227 part="cart-button-amount" 228 class="cart-button__amount" 229 > 230 ${this.cart.totalQuantity} 231 </span> 232 <umg-icon 233 part="cart-button-icon" 234 class="cart-button__icon" 235 icon="bag-shopping-thin" 236 size="2xlarge" 237 > 238 </umg-icon> 239 </umg-button> 240 <div slot="content" class="cart-drawer__content"> 241 <div class="cart-drawer__content-inner"> 242 <div class="cart-message"> 243 ${this._cartMessage()} 244 </div> 245 <div class="cart-items">${this._cartItems()}</div> 246 <div class="cart-subtotal-container"> 247 <div class="cart-subtotal"> 248 <umg-text 249 variant="bodyMd" 250 fontWeight="semibold" 251 fontSize="bodyMd" 252 withoutMargin 253 > 254 Subtotal: 255 </umg-text> 256 257 <umg-text 258 variant="bodyMd" 259 fontWeight="semibold" 260 fontSize="bodyMd" 261 withoutMargin 262 > 263 ${this.zeroPad(t,e)} 264 </umg-text> 265 </div> 266 <umg-text 267 variant="bodySm" 268 fontWeight="regular" 269 fontSize="bodySm" 270 withoutMargin 271 > 272 Shipping will be calculated at checkout 273 </umg-text> 274 </div> 275 <div part="cart-buttons" class="cart-buttons"> 276 <umg-button-group stack> 277 <umg-button 278 part="primary-button" 279 class="primary-button" 280 size="large" 281 fullWidth 282 borderRadius="full" 283 @click=${this._checkoutAction} 284 ?disabled=${!this.cart.lines.length} 285 > 286 ${this.labels.checkout} 287 </umg-button> 288 <umg-button 289 part="secondary-button" 290 class="secondary-button" 291 @click=${()=>this._closeCart()} 292 fullWidth 293 buttonStyle="outline" 294 > 295 ${this.labels.continue} 296 </umg-button> 297 </umg-button-group> 298 </div> 299 </div> 300 </div> 301 </umg-disclosure> 302 </div> 303 <div id="cart-overlay" class="cart-overlay hidden" @click=${()=>this._closeCart()}></div> 304 `}_findBundleLineItemIdByComponentProductId(t,e){if(!t||!e||0===e.length)return null;for(const i of e){const e=i.merchandise?.umgBundlesDetails;if(e&&Array.isArray(e)&&e.length>0){if(e.some(e=>e?.product?.id===t))return i.id}}return null}};E.styles=[S,r.AH` 305 /* Cart */ 306 .cart { 307 max-width: fit-content; 308 } 309 .cart-drawer { 310 position: initial; 311 } 312 313 .cart-drawer__content { 314 height: max-content; 315 } 316 .cart-drawer__content-inner { 317 display: flex; 318 flex-direction: column; 319 gap: var(--umg-space-24); 320 } 321 322 .cart-drawer ::part(disclosure-content), 323 .cart-drawer--side ::part(disclosure-content) { 324 height: 100%; 325 padding: var(--umg-space-24) var(--umg-space-24); 326 327 --umg-space-summary-padding: 0 1rem; 328 --umg-color-summary-border: transparent; 329 --umg-color-details-text: var( 330 --umg-color-cart-text, 331 rgb(0, 0, 0) 332 ); 333 --umg-color-details-background: var( 334 --umg-color-cart-background, 335 rgb(255, 255, 255) 336 ); 337 --umg-color-icon-text: var(--umg-color-cart-text, rgb(0, 0, 0)); 338 --umg-color-icon-background: var( 339 --umg-color-cart-background, 340 rgb(255, 255, 255) 341 ); 342 --umg-border-input-corner-radius: 0.25rem; 343 } 344 345 @media screen and (max-width: 48rem) { 346 .cart-drawer--side ::part(disclosure-content) { 347 padding: var(--umg-space-24) var(--umg-space-40); 348 } 349 } 350 351 /* Cart drawer display options */ 352 /* Drop down */ 353 .cart-drawer ::part(disclosure-drawer) { 354 position: absolute; 355 top: var(--umg-size-header-inner-height); 356 left: unset; 357 right: unset; 358 z-index: 510; /* over overlay z-index */ 359 min-width: max-content; 360 } 361 362 /* Side panel */ 363 .cart-drawer--side ::part(disclosure-drawer) { 364 position: fixed; 365 top: var(--umg-size-header-inner-height); 366 right: 0; 367 left: unset; 368 bottom: 0; 369 min-width: var(--size-cart-drawer-width, 20rem); 370 z-index: 510; /* over overlay z-index */
371 margin-top: 1px; 372 } 373 @media screen and (max-width: 48rem) { 374 .cart-drawer--side ::part(disclosure-drawer) { 375 min-width: 100vw; 376 } 377 } 378 379 /* Cart subtotal */ 380 .cart-subtotal { 381 width: 100%; 382 display: flex; 383 justify-content: space-between; 384 align-items: center; 385 } 386 387 .cart-subtotal-container { 388 width: 100%; 389 display: flex; 390 flex-direction: column; 391 align-items: start; 392 gap: var(--umg-space-12); 393 } 394 395 /* Cart button */ 396 .cart-button { 397 position: relative; 398 --umg-color-button-background: var(--umg-color-base-text); 399 } 400 401 .cart-button__amount { 402 font-size: var(--umg-font-body-size-xs); 403 position: absolute; 404 left: 0; 405 right: 0; 406 top: 52%; 407 width: 100%; 408 line-height: 0; 409 } 410 411 .primary-button, 412 .secondary-button { 413 --umg-border-button-corner-radius: 0.25rem; 414 } 415 416 /* Cart message */ 417 .cart-message { 418 display: flex; 419 align-items: center; 420 gap: var(--umg-space-8); 421 } 422 .cart-message .spinner { 423 opacity: 0.5; 424 } 425 426 /* Cart items */ 427 .item-container:not(:last-child) { 428 margin-bottom: var(--umg-space-24); 429 padding-bottom: var(--umg-space-24); 430 border-bottom: 0.0625rem solid 431 rgb( 432 from var(--umg-color-base-border, rgb(0, 0, 0, 0.5)) r g 433 b 434 ); 435 } 436 .item-container:last-child { 437 margin-bottom: 0; 438 } 439 .item-container > *:not(:last-child) { 440 margin-bottom: var(--umg-space-12); 441 } 442 .item-container .sub-items > *:not(:last-child) { 443 margin-bottom: var(--umg-space-8); 444 } 445 .item, 446 .subitem-container { 447 display: flex; 448 gap: var(--umg-space-12); 449 align-items: start; 450 } 451 .subitem-container { 452 align-items: center; 453 } 454 .item__image { 455 width: 25%; 456 } 457 .subitem__image { 458 width: 20%; 459 } 460 .item__image > * { 461 border: 0.0625rem solid rgb(255, 255, 255); 462 height: auto; 463 width: 100%; 464 } 465 .item__content { 466 display: flex; 467 justify-content: space-between; 468 flex-direction: column; 469 gap: var(--umg-space-8); 470 padding-bottom: var(--umg-space-8); 471 } 472 .item__content > * { 473 display: block; 474 } 475 .item__content { 476 width: 65%; 477 } 478 .item__meta { 479 display: flex; 480 flex-direction: column; 481 } 482 .item__details { 483 display: flex; 484 flex-direction: column; 485 gap: var(--umg-space-4); 486 } 487 .item__details-row { 488 display: flex; 489 justify-content: space-between; 490 align-items: center; 491 } 492 493 .item__options { 494 margin-bottom: var(--umg-space-8); 495 } 496 .item__options > *:not(:last-child)::after { 497 content: '|'; 498 opacity: 0.5; 499 padding: 0 0.125rem; 500 } 501 .item-update { 502 display: flex; 503 justify-content: space-between; 504 gap: var(--umg-space-12); 505 } 506 507 /* Cart sub items */ 508 .sub-items { 509 flex: 1 0 100%; 510 position: relative; 511 } 512 .subitems-accordion { 513 --umg-color-header-border: transparent; 514 --umg-color-drawer-border: transparent; 515 --umg-space-header-padding: 0rem; 516 --umg-space-drawer-padding: 0rem; 517 --umg-space-padding: 1rem 0.5rem; 518 } 519 520 /* Cart overlay */ 521 .cart-overlay { 522 position: fixed; 523 inset: 0; 524 top: var(--umg-size-header-inner-height); 525 z-index: 0; 526 background-color: var( 527 --umg-color-cart-overlay-background, 528 rgb(0, 0, 0, 0.7) 529 ); 530 } 531 @supports (color: rgb(from white r g b)) { 532 .cart-overlay { 533 background-color: rgb( 534 from 535 var( 536 --umg-color-cart-overlay-background, 537 var(--umg-color-cart-text, rgb(0, 0, 0, 0.7)) 538 ) 539 r g b / 0.7 540 ); 541 } 542 } 543 544 .cart-overlay.hidden { 545 display: none; 546 } 547 `],o([(0,a.M)({type:Object})],E.prototype,"labels",void 0),o([(0,a.M)()],E.prototype,"drawerType",void 0),o([(0,a.M)()],E.prototype,"drawerWidth",void 0),o([(0,a.M)()],E.prototype,"storefrontApiKey",void 0),o([(0,a.M)()],E.prototype,"storefrontDomain",void 0),o([(0,a.M)()],E.prototype,"checkoutType",void 0),o([(0,a.M)()],E.prototype,"open",void 0),o([(0,a.M)()],E.prototype,"checkoutUtmSource",void 0),o([(0,a.M)()],E.prototype,"checkoutUtmCampaign",void 0),o([(0,a.M)()],E.prototype,"checkoutUtmMedium",void 0),o([(0,l.P)("umg-disclosure")],E.prototype,"_disclosure",void 0),o([(0,l.P)("#cart-overlay")],E.prototype,"_cartOverlay",void 0),o([(0,n.w)()],E.prototype,"_region",void 0),o([(0,n.w)()],E.prototype,"_init",void 0),o([(0,n.w)()],E.prototype,"_currentMessage",void 0),o([(0,n.w)()],E.prototype,"_updatedCartMessage",void 0),o([(0,n.w)()],E.prototype,"_maxQuantities",void 0),o([(0,n.w)()],E.prototype,"_cartErrors",void 0),o([(0,n.w)()],E.prototype,"_clientValidationErrorResult",void 0),o([(0,n.w)()],E.prototype,"cart",void 0),E=o([(0,s.E)(`${H}-cart-drawer`)],E)},1088(t,e,i){i.d(e,{E:()=>o});class o{constructor(t){this.listeners=new Map,this.target=t}addEventListener(t,e,i){const o=this.listeners.get(t)||new Set;return this.listeners.set(t,o),o.add(e),this.target.addEventListener(t,e,i),()=>{this.removeEventListener(t,e,i)}}removeEventListener(t,e,i){const o=this.listeners.get(t);o&&(o.delete(e),0===o.size&&this.listeners.delete(t)),this.target.removeEventListener(t,e,i)}dispatchCustomEvent(t,e,i){this.target.dispatchEvent(new CustomEvent(t,{detail:e,...i}))}}},5438(t,e,i){var o=i(8472),r=i(2618),s=i(6505),a=i(8698),n=i(7621);const{prefix:l}=a.W;let d=class extends r.WF{constructor(){super(),this._clickHandler=t=>{if("summary-click"===t.type){const e=[...this._accordions],i=t.detail.target;e&&e.length>0&&e.filter(t=>t!==i).map(t=>{t.closeAccordion()})}},this.addEventListener("summary-click",this._clickHandler)}render(){return r.qy` 548 <div 549 part="accordion-group" 550 class="accordion-group" 551 @click="${this._clickHandler}" 552 > 553 <slot name="accordion"></slot> 554 </div> 555 `}};(0,o.C)([(0,n.KN)({slot:"accordion"})],d.prototype,"_accordions",void 0),d=(0,o.C)([(0,s.E)(`${l}-accordion-group`)],d)},7802(t,e,i){var o=i(8472),r=i(2618),s=i(6505),a=i(9924),n=i(8698),l=i(2609),d=i(7621),c=i(3720);i(4630);const{prefix:u}=n.W;let m=class extends r.WF{constructor(){super(...arguments),this.icon="chevron-down",this.iconSize="xsmall",this.iconAnimation="flip",this.iconPosition="right",this.open=!1,this._open=!1,this.justify="space-between",this.closeAccordion=()=>{this._open=!1,this._accordion.removeAttribute("open"),setTimeout(()=>
555{this._accordionDetails.classList.remove("opening")})},this.openAccordion=()=>{this._open=!0,this._accordion.setAttribute("open",""),setTimeout(()=>{this._accordionDetails.classList.add("opening")})},this._handleAccordionBlock=t=>{"accordion"===t.type&&("closeAccordion"===t.detail.eventName&&this.closeAccordion(),"openAccordion"===t.detail.eventName&&this.openAccordion())}}connectedCallback(){super.connectedCallback(),window.addEventListener("accordion",this._handleAccordionBlock)}disconnectedCallback(){window.removeEventListener("accordion",this._handleAccordionBlock),super.disconnectedCallback()}updated(t){t.has("open")&&(this.open?(this._open=!0,this.openAccordion()):this.open||(this._open=!1,this.closeAccordion()))}_handleSummaryClick(){const t=this._open?"closeAccordion":"openAccordion";this._open?(setTimeout(()=>{this._accordionDetails.classList.remove("opening")}),window.removeEventListener("accordion",this._handleAccordionBlock)):(setTimeout(()=>{this._accordionDetails.classList.add("opening")}),window.addEventListener("accordion",this._handleAccordionBlock)),this._open=!this._open,this.dispatchEvent(new CustomEvent("summary-click",{detail:{eventName:t,target:this},bubbles:!0,composed:!0}))}summaryClasses(){const t={};return t["accordion__summary--icon-"+this.iconAnimation]=!0,t["accordion__summary--icon-position-"+this.iconPosition]=!0,t["accordion__summary--justify-"+this.justify]=!0,t}render(){return r.qy` 556 <details 557 part="accordion" 558 class="accordion" 559 > 560 <summary 561 part="accordion-summary" 562 class="accordion__summary${(0,c.H)(this.summaryClasses())}" 563 aria-label="Accordion block summary" 564 role="button" 565 aria-expanded=${this._open} 566 @click=${this._handleSummaryClick} 567 > 568 <slot name="header"></slot> 569 <umg-icon 570 part="accordion-icon" 571 exportparts="icon,icon-svg" 572 class="accordion__icon" 573 icon="${this.icon}" 574 size="${this.iconSize}" 575 > 576 </umg-icon> 577 </summary> 578 <div 579 part="accordion-details" 580 class="accordion__details" 581 aria-hidden=${!this._open} 582 > 583 <slot name="content"></slot> 584 </div> 585 </details> 586 `}};m.styles=(0,l.Z)([a.S,r.AH` 587 :host{ 588 display: block; 589 } 590 ::slotted(*[slot=header]) { 591 flex: 0 1 auto; 592 } 593 594 .accordion { 595 font-family: var(--umg-font-body-family); 596 overflow: hidden; 597 border-radius: var(--umg-border-header-corner-radius, var(--umg-border-base-corner-radius, 0)) var(--umg-border-header-corner-radius, var(--umg-border-base-corner-radius, 0)) 0 0; 598 } 599 600 .accordion__icon { 601 transition: all 0.2s; 602 } 603 604 .accordion[open] .accordion__summary--icon-flip .accordion__icon { 605 transition: all 0.2s; 606 transform: rotate(180deg); 607 } 608 609 /** Summary */ 610 details summary::-webkit-details-marker { 611 display:none; 612 } 613 614 .accordion__summary { 615 cursor: pointer; 616 list-style: none; 617 618 display: flex; 619 align-items: center; 620 justify-content: space-between; 621 gap: var(--umg-space-8, 0.5rem); 622 623 position: relative; 624 z-index: 2; 625 626 height: 2.5rem; 627 width: 100%; 628 padding: var(--umg-space-header-padding, 2rem 0rem); 629 630 color: var(--umg-color-accordion-header-text, var(--umg-color-base-text, rgb(0,0,0))); 631 background-color: var(--umg-color-accordion-header-background, var(--umg-color-base-background, rgb(255, 255, 255))); 632 633 border-bottom: 0.0625rem solid var(--umg-color-accordion-header-border, var(--umg-color-base-border, rgb(180,180,180,1))); 634 border-radius: var(--umg-border-accordion-header-corner-radius, var(--umg-border-base-corner-radius, 0)) var(--umg-border-accordion-header-corner-radius, var(--umg-border-base-corner-radius, 0)) 0 0; 635 } 636 637 @supports (color: rgb(from white r g b)) { 638 .accordion__summary { 639 border-color: rgb(from var(--umg-color-accordion-header-border, var(--umg-color-base-border, rgb(180,180,180))) r g b / alpha); 640 color: var(--umg-color-accordion-header-text, var(--umg-color-base-text, rgb(0,0,0))); 641 background-color: var(--umg-color-accordion-header-background, var(--umg-color-base-background, rgb(255, 255, 255))); 642 } 643 } 644 645 /** Flip icon if .accordion__summary--icon-flip */ 646 .accordion__summary > * { 647 transition: transform 0.2s ease; 648 --umg-color-icon-text: var(--umg-color-accordion-header-text, var(--umg-color-base-text, rgb(0,0,0))); 649 } 650 .accordion[open] .accordion__summary--icon-flip > * { 651 transform: rotate(180deg); 652 } 653 654 /** Summary justify content */ 655 .accordion__summary--justify-center { 656 justify-content: center; 657 } 658 .accordion__summary--justify-end { 659 justify-content: end; 660 } 661 .accordion__summary--justify-start { 662 justify-content: start; 663 } 664 665 /** Summary icon position */ 666 .accordion__summary--icon-position-left { 667 flex-direction: row-reverse; 668 } 669 670 /** Details */ 671 .accordion__details { 672 visibility: hidden; 673 opacity: 0; 674 overflow: hidden; 675 overflow-y: auto; 676 width: 100%; 677 678 transform: translateY(-100%); 679 position: relative; 680 z-index: 1; 681 682 border-radius: 0 0 var(--umg-border-drawer-corner-radius, var(--umg-border-base-corner-radius, 0)) var(--umg-border-drawer-corner-radius, var(--umg-border-base-corner-radius, 0)); 683 border-bottom: 0.0625rem solid var(--umg-color-drawer-border, var(--umg-color-base-border, rgb(180,180,180,1))); 684 685 padding: var(--umg-space-drawer-padding, 2rem 0rem); 686 687 color: var(--umg-color-drawer-text, var(--umg-color-base-text, rgb(0,0,0))); 688 background-color: var(--umg-color-drawer-background, var(--umg-color-base-background, rgb(255, 255, 255))); 689 690 691 --umg-color-base-text: var(--umg-color-drawer-text); 692 --umg-color-base-background: var(--umg-color-drawer-background); 693 } 694 695 @supports (color: rgb(from white r g b)) { 696 .accordion__details { 697 color: rgb(from var(--umg-color-drawer-text, var(--umg-color-base-text, rgb(0,0,0))) r g b); 698 background-color: rgb(from var(--umg-color-drawer-background, var(--umg-color-base-background, rgb(255, 255, 255))) r g b); 699 border-color: rgb(from var(--umg-color-drawer-border, var(--umg-color-base-border, rgb(0,0,0,0))) r g b / alpha); 700 } 701 } 702 703 /* Open state */ 704 .accordion[open] .accordion__details.opening { 705 visibility: visible; 706 transform: translateY(0); 707 opacity: 1; 708 transition: transform 0.2s ease, opacity 0.2s ease; 709 } 710 711 /* Scroll */ 712 .accordion__details::-webkit-scrollbar {
713 width: 0.125rem; 714 } 715 .accordion__details::-webkit-scrollbar-track { 716 background: var(--umg-color-base-text, rgb(0,0,0,0.05)); 717 border-radius: var(--umg-border-radius-30); 718 } 719 .accordion__details::-webkit-scrollbar-thumb { 720 background: var(--umg-color-base-text, rgb(0,0,0,0.1)); 721 border-radius: var(--umg-border-radius-30); 722 } 723 @supports (color: rgb(from white r g b)) { 724 .accordion__details::-webkit-scrollbar-track { 725 background: rgb(from var(--umg-color-base-text, rgb(0,0,0,0.05)) r g b / 0.05); 726 } 727 .accordion__details::-webkit-scrollbar-thumb { 728 background: rgb(from var(--umg-color-base-text, rgb(0,0,0,0.1)) r g b / 0.1); 729 } 730 } 731 `]),(0,o.C)([(0,d.MZ)()],m.prototype,"icon",void 0),(0,o.C)([(0,d.MZ)()],m.prototype,"iconSize",void 0),(0,o.C)([(0,d.MZ)()],m.prototype,"iconAnimation",void 0),(0,o.C)([(0,d.MZ)()],m.prototype,"iconPosition",void 0),(0,o.C)([(0,d.MZ)({type:Boolean})],m.prototype,"open",void 0),(0,o.C)([(0,d.wk)()],m.prototype,"_open",void 0),(0,o.C)([(0,d.MZ)()],m.prototype,"justify",void 0),(0,o.C)([(0,d.P)("summary")],m.prototype,"_summary",void 0),(0,o.C)([(0,d.P)("details")],m.prototype,"_accordion",void 0),(0,o.C)([(0,d.P)(".accordion__details")],m.prototype,"_accordionDetails",void 0),m=(0,o.C)([(0,s.E)(`${u}-accordion`)],m)},3212(t,e,i){var o=i(8472),r=i(2618),s=i(6505),a=i(9563),n=i(3720),l=i(31),d=i(9924),c=i(4379),u=i(8698),m=i(2609);const{prefix:h}=u.W;let p=class extends r.WF{constructor(){super(...arguments),this.imgAlt="",this.width=100,this.height=100,this.mobileHeight=this.width,this.mobileWidth=this.height,this.load="lazy"}dispatchEvents(){const t=this.width/this.height,e=this.mobileWidth/this.mobileHeight,i=new CustomEvent("media-details",{detail:{mediaAspectRatio:t,mobileMediaAspectRatio:e},bubbles:!0,composed:!0});this.dispatchEvent(i)}imageClasses(){const t={};return t["without-mobile"]=!this.mobileSrc,t}mobileImage(){return this.mobileSrc?r.qy` 732 <img 733 part="banner-image" 734 class="image image--mobile" 735 width="${this.mobileWidth}" 736 height="${this.mobileHeight}" 737 src="${(0,l.J)(this.mobileSrc)}" 738 srcset="${(0,l.J)(this.mobileSrcSet)}" 739 sizes="${(0,l.J)(this.mobileSizes)}" 740 alt="${this.imgAlt}" 741 loading="${this.load}" 742 > 743 `:r.s6}desktopImage(){return this.src?r.qy` 744 <img 745 part="banner-image" 746 class="image image--desktop${(0,n.H)(this.imageClasses())}" 747 width="${this.width}" 748 height="${this.height}" 749 src="${(0,l.J)(this.src)}" 750 srcset="${(0,l.J)(this.imgSrcSet)}" 751 sizes="${(0,l.J)(this.sizes)}" 752 alt="${this.imgAlt}" 753 loading="${this.load}" 754 > 755 `:r.qy` 756 <div class="placeholder image image--desktop${(0,n.H)(this.imageClasses())}" style="aspect-ratio: ${this.width/this.height}"> 757 <div class="placeholder-inner"> 758 <svg class="icon" xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 576 512" fill="currentcolor"> 759 <path d="M70.5 138.1C31 172.2 16 219.1 16 272c0 52 18.4 91.6 46.9 118.3C91.6 417.2 131.5 432 176 432h8.4c18.2 0 34.8-10.3 42.9-26.5l23.2-46.3C257.6 345 272.1 336 288 336s30.4 9 37.5 23.2l23.2 46.3c8.1 16.3 24.8 26.5 42.9 26.5H400c44.5 0 84.4-14.8 113.1-41.7C541.6 363.6 560 324 560 272c0-52.9-15-99.8-54.5-133.9C465.6 103.6 398.1 80 288 80s-177.6 23.6-217.5 58.1zM0 272C0 160 64 64 288 64s288 96 288 208s-80 176-176 176h-8.4c-24.2 0-46.4-13.7-57.2-35.4l-23.2-46.3c-4.4-8.8-13.3-14.3-23.2-14.3s-18.8 5.5-23.2 14.3l-23.2 46.3c-10.8 21.7-33 35.4-57.2 35.4H176C80 448 0 384 0 272zm160 32a48 48 0 1 0 0-96 48 48 0 1 0 0 96zm0-112a64 64 0 1 1 0 128 64 64 0 1 1 0-128zm304 64a48 48 0 1 0 -96 0 48 48 0 1 0 96 0zm-112 0a64 64 0 1 1 128 0 64 64 0 1 1 -128 0z"/> 760 </svg> 761 </div> 762 </div> 763 `}getImage(){return r.qy` 764 ${this.desktopImage()} 765 ${this.mobileImage()} 766 `}render(){return this.dispatchEvents(),r.qy` 767 ${this.getImage()} 768 `}};p.styles=(0,m.Z)([d.S,c.o,r.AH` 769 .image { 770 object-fit: cover; 771 height: 100%; 772 width: 100%; 773 max-width: 100%; 774 } 775 776 /* Art directed images */ 777 .image--desktop { 778 display: block; 779 } 780 .image--mobile { 781 display: none; 782 } 783 784 @media only screen and (max-width: 48rem) { 785 .image--desktop { 786 display: none; 787 } 788 .image--mobile { 789 display: block; 790 } 791 .without-mobile.image--desktop { 792 display: block; 793 } 794 } 795 `]),(0,o.C)([(0,a.M)()],p.prototype,"imgAlt",void 0),(0,o.C)([(0,a.M)()],p.prototype,"src",void 0),(0,o.C)([(0,a.M)({type:String})],p.prototype,"imgSrcSet",void 0),(0,o.C)([(0,a.M)({type:String})],p.prototype,"sizes",void 0),(0,o.C)([(0,a.M)({type:Number})],p.prototype,"width",void 0),(0,o.C)([(0,a.M)({type:Number})],p.prototype,"height",void 0),(0,o.C)([(0,a.M)()],p.prototype,"mobileSrc",void 0),(0,o.C)([(0,a.M)({type:String})],p.prototype,"mobileSrcSet",void 0),(0,o.C)([(0,a.M)({type:String})],p.prototype,"mobileSizes",void 0),(0,o.C)([(0,a.M)({type:Number})],p.prototype,"mobileHeight",void 0),(0,o.C)([(0,a.M)({type:Number})],p.prototype,"mobileWidth",void 0),(0,o.C)([(0,a.M)()],p.prototype,"load",void 0),p=(0,o.C)([(0,s.E)(`${h}-banner-image`)],p)},4316(t,e,i){var o=i(8472),r=i(2618),s=i(6505),a=i(9563),n=i(7509),l=i(31),d=i(3720),c=i(1145),u=i(9924),m=i(8698),h=i(2609);i(3919),i(1682);const{prefix:p}=m.W;let g=class extends r.WF{constructor(){super(),this.height="medium",this.mobileAdapt=!1,this.contentPosition="over",this.contentFullWidth=!1,this.contentAlign="center",this.contentJustify="center",this.contentAdaptivePadding=!1,this.mobilePadding="16",this._headerHeight="",this._withoutContent=!0,this.addEventListener("media-details",this.eventNotifications)}connectedCallback(){super.connectedCallback(),window.addEventListener("header-details",this.eventNotifications.bind(this))}disconnectedCallback(){window.removeEventListener("header-details",this.eventNotifications.bind(this)),super.disconnectedCallback()}async eventNotifications(t){"media-details"===t.type&&(t.detail.mediaAspectRatio&&(this._mediaAspectRatio=t.detail.mediaAspectRatio.toString()),t.detail.mobileMediaAspectRatio?this._mobileMediaAspectRatio=t.detail.mobileMediaAspectRatio.toString():t.detail.mediaAspectRatio&&(this._mediaAspectRatio=t.detail.mediaAspectRatio.toString())),"header-details"===t.type&&(this._headerHeight=t.detail.height)}handleSlotchange(t){t.target&&"content"===t.target.getAttribute("name")&&(this._withoutContent=!1)}bannerClasses(){const t={};return t["media-height--"+this.height]=!0,t["media-mobile-adapt"]=this.mobileAdapt,"under"!==this.contentPosition&&"above"!==this.contentPosition&&"side"!==this.contentPosition||(t["content--inline"]=!0,t["content-position--"+this.contentPosition]=!0),t}bannerStyles(){let t={};return this._mediaAspectRatio&&(t={...t,"--umg-aspect-ratio":this._mediaAspectRatio}),this._mobileMediaAspectRatio?t={...t,"--umg-mobile-aspect-ratio":this._mobileMediaAspectRatio}:this._mediaAspectRatio&&(t={...t,"--umg-mobile-aspect-ratio":this._mediaAspectRatio}),this._headerHeight&&"stretch"===this.height&&(t={...t,"--umg-size-header-outer-height":this._headerHeight+"px"}),t}bannercontentClasses(){const t={};return t["content-align--"+this.contentAlign]=!0,t["content-justify--"+this.contentJustify]=!0,t["content--without-content"]=this._withoutContent,t}bannercontentStyles(){let t={};return t={...t,"--umg-size-width":this.contentFullWidth?"100%":"auto"},t}render(){return r.qy` 796 <div 797 part="banner" 798 class="banner${(0,d.H)(this.bannerClasses())}" 799 style="${(0,c.W)(this.bannerStyles())}" 800 > 801 <div 802 part="banner-container" 803 class="banner__container" 804 > 805 <div 806 part="banner-media" 807 class="banner__media" 808 > 809 <slot name="media"></slot> 810 </div> 811 <div 812 part="banner-content" 813 class="banner__content${(0,d.H)(this.bannercontentClasses())}" 814 style="${(0,c.W)(this.bannercontentStyles())}" 815 > 816 ${"over"===this.contentPosition||"side"===this.contentPosition?r.qy`<umg-box 817part="banner-content-box" 818exportparts="box,box-content" 819class="banner__content-inner" 820padding=${"over"===this.contentPosition?(0,l.J)(this.contentOuterPadding):"0"} 821mobilePadding='0'><umg-box 822part="banner-caption" 823exportparts="box:box--caption,box-content:box-content--caption" 824class="banner__content-caption"?adaptivePadding=${this.contentAdaptivePadding} 825padding=${(0,l.J)(this.contentInnerPadding)} 826mobilePadding=${this.mobilePadding} 827width="${this.contentFullWidth?"fill":"fit-content"}"><umg-vertical-stack 828exportparts="vertical-stack" 829class="caption-inner" 830align=${this.contentJustify} 831mobileAlign=${this.mobileContentJustify?this.mobileContentJustify:this.contentJustify} 832spacing="${(0,l.J)(this.contentSpacing)}"><slot name="content"@slotchange=${this.handleSlotchange}></slot></umg-vertical-stack></umg-box></umg-box>`:r.qy`<umg-box 833part="banner-caption" 834exportparts="box,box-content" 835class="banner__content-caption"?adaptivePadding=${this.contentAdaptivePadding} 836padding=${(0,l.J)(this.contentInnerPadding)} 837mobilePadding=${this.mobilePadding} 838width="${this.contentFullWidth?"fill":"fit-content"}"><umg-vertical-stack 839part="banner-caption-inner" 840exportparts="vertical-stack" 841class="caption-inner" 842align=${this.contentJustify} 843mobileAlign=${this.mobileContentJustify?this.mobileContentJustify:this.contentJustify} 844spacing="${(0,l.J)(this.contentSpacing)}"><slot name="content"@slotchange=${this.handleSlotchange}></slot></umg-vertical-stack></umg-box>`} 845 </div> 846 </div> 847 </div> 848 `}};g.styles=(0,h.Z)([u.S,r.AH` 849 :host { 850 position: relative; 851 display: block; 852 width: 100%; 853 overflow: hidden; 854 } 855 856 /* Media overlay */ 857 .banner__container { 858 position: relative; 859 } 860 861 @media only screen and (min-width: 48.06rem) { 862 .banner:not(.content--inline) .banner__container::after { 863 content: ''; 864 display: block; 865 position: absolute; 866 top: 0; 867 left: 0; 868 height: 100%; 869 width: 100%; 870 z-index: 1; 871 background-color: var(--umg-color-overlay-background, 255,255,255,0); 872 } 873 @supports (color: rgb(from white r g b)) { 874 .banner:not(.content--inline) .banner__container::after { 875 background-color: rgb(from var(--umg-color-overlay-background, 255,255,255,0) r g b / alpha); 876 } 877 } 878 } 879 880 /* Caption color */ 881 .banner__content-caption { 882 --umg-color-base-text: var(--umg-color-caption-text); 883 --umg-color-base-background: rgb(from var(--umg-color-caption-background) r g b / calc(alpha * var(--umg-opacity-caption-background, 1))); 884 } 885 @media only screen and (max-width: 48rem) { 886 .banner__content-caption { 887 --umg-color-base-background: rgb(from var(--umg-color-caption-background) r g b / 1); 888 } 889 } 890 891 /* Banner media height */ 892 @media only screen and (max-width: 30rem) { 893 .media-height--xsmall .banner__media { 894 height: 10em; 895 } 896 .media-height--small .banner__media { 897 height: 15rem; 898 } 899 .media-height--medium .banner__media { 900 height: 20rem; 901 } 902 .media-height--large .banner__media { 903 height: 25rem; 904 } 905 .media-height--xlarge .banner__media { 906 height: 27rem; 907 } 908 .media-height--2xlarge .banner__media { 909 height: 30rem; 910 } 911 } 912 @media only screen and (min-width: 30.06rem) { 913 .media-height--xsmall .banner__media { 914 height: 15rem; 915 } 916 .media-height--small .banner__media { 917 height: 20rem; 918 } 919 .media-height--medium .banner__media { 920 height: 25rem; 921 } 922 .media-height--large .banner__media { 923 height: 30rem; 924 } 925 .media-height--xlarge .banner__media { 926 height: 35rem; 927 } 928 .media-height--2xlarge .banner__media { 929 height: 40rem; 930 } 931 } 932 933 .media-height--stretch .banner__media { 934 height: calc(100vh - var(--umg-size-header-outer-height, 0px)); 935 } 936 937 /* Adapt banner to media height */ 938 .banner.media-height--adapt .banner__media { 939 aspect-ratio: var(--umg-aspect-ratio); 940 } 941 @media only screen and (max-width: 48rem) { 942 .banner.media-height--adapt .banner__media, 943 .banner.media-mobile-adapt .banner__media { 944 height: auto; 945 aspect-ratio: var(--umg-mobile-aspect-ratio); 946 } 947 } 948 949 /* Without content? */ 950 .content--without-content { 951 display: none; 952 } 953 954 /* Content positions */ 955 956 @media only screen and (max-width: 48.06rem) { 957 /* All positions - mobile content box is full width */ 958 .banner__content-caption { 959 width: 100%; 960 } 961 } 962 963 /* Desktop content over media */ 964 @media only screen and (min-width: 48.06rem) { 965 .banner:not(.content--inline) .banner__content { 966 position: absolute; 967 top: 0; 968 left: 0; 969 height: 100%; 970 width: 100%; 971 z-index: 10; 972 } 973 } 974 975 /* Desktop content to side of media */ 976 .content-position--side .banner__content { 977 position: relative; 978 } 979 .content-position--side .banner__content-inner { 980 position: relative; 981 z-index: 10; 982 } 983 .content-position--side .banner__content-caption::part(box-content) { 984 background-color: transparent; 985 } 986 .content-position--side .banner__content:after { 987 content: ''; 988 position: absolute; 989 inset: 0; 990 z-index: 0; 991 background-color: var(--umg-color-caption-background); 992 } 993 @supports (color: rgb(from white r g b)) { 994 .content-position--side .banner__content:after { 995 background-color: rgb(from var(--umg-color-caption-background) r g b / alpha); 996 } 997 } 998 .content-position--side .banner__container { 999
999 background-color: var(--umg-color-base-background); 1000 } 1001 @supports (color: rgb(from white r g b)) { 1002 .content-position--side .banner__container { 1003 background-color: rgb(from var(--umg-color-base-background) r g b / alpha); 1004 } 1005 } 1006 1007 @media only screen and (min-width: 48.06rem) { 1008 .content--inline.content-position--side .banner__container { 1009 flex-direction: row-reverse 1010 } 1011 .content--inline.content-position--side .banner__media { 1012 flex: 1 0 auto; 1013 width: 70%; 1014 } 1015 .content--inline.content-position--side .banner__content ::slotted(*) { 1016 height: 100%; 1017 } 1018 } 1019 1020 /* Inline with media, side/above/under*/ 1021 .content--inline .banner__container { 1022 display: flex; 1023 flex-direction: column; 1024 } 1025 1026 .content-position--above .banner__media { 1027 order: 2; 1028 } 1029 .content-position--above .banner__content { 1030 order: 1; 1031 } 1032 .content-position--under .banner__media { 1033 order: 1; 1034 } 1035 .content-position--under .banner__content { 1036 order: 2; 1037 } 1038 1039 /* Content over media box alignments */ 1040 .banner__content-inner { 1041 height: 100%; 1042 } 1043 .banner__content-inner::part(box-content) { 1044 background-color: transparent; 1045 display: flex; 1046 } 1047 .banner__content-caption::part(box-content) { 1048 height: auto; 1049 } 1050 1051 .content-justify--start .banner__content-inner::part(box-content) { 1052 justify-content: start; 1053 } 1054 .content-justify--center .banner__content-inner::part(box-content) { 1055 justify-content: center; 1056 } 1057 .content-justify--end .banner__content-inner::part(box-content) { 1058 justify-content: end; 1059 } 1060 .content-align--start .banner__content-inner::part(box-content) { 1061 align-items: start; 1062 } 1063 .content-align--center .banner__content-inner::part(box-content) { 1064 align-items: center; 1065 } 1066 .content-align--end .banner__content-inner::part(box-content) { 1067 align-items: end; 1068 } 1069 `]),(0,o.C)([(0,a.M)()],g.prototype,"height",void 0),(0,o.C)([(0,a.M)({type:Boolean})],g.prototype,"mobileAdapt",void 0),(0,o.C)([(0,a.M)()],g.prototype,"contentPosition",void 0),(0,o.C)([(0,a.M)({type:Boolean})],g.prototype,"contentFullWidth",void 0),(0,o.C)([(0,a.M)()],g.prototype,"contentAlign",void 0),(0,o.C)([(0,a.M)()],g.prototype,"contentJustify",void 0),(0,o.C)([(0,a.M)()],g.prototype,"mobileContentJustify",void 0),(0,o.C)([(0,a.M)()],g.prototype,"contentSpacing",void 0),(0,o.C)([(0,a.M)({type:Boolean})],g.prototype,"contentAdaptivePadding",void 0),(0,o.C)([(0,a.M)()],g.prototype,"contentInnerPadding",void 0),(0,o.C)([(0,a.M)()],g.prototype,"contentOuterPadding",void 0),(0,o.C)([(0,a.M)()],g.prototype,"mobilePadding",void 0),(0,o.C)([(0,n.w)()],g.prototype,"_mediaAspectRatio",void 0),(0,o.C)([(0,n.w)()],g.prototype,"_mobileMediaAspectRatio",void 0),(0,o.C)([(0,n.w)()],g.prototype,"_headerHeight",void 0),(0,o.C)([(0,n.w)()],g.prototype,"_withoutContent",void 0),g=(0,o.C)([(0,s.E)(`${p}-banner`)],g)},3919(t,e,i){var o=i(8472),r=i(2618),s=i(6505),a=i(9563),n=i(7509),l=i(1145),d=i(3720);function c(t){let e=[];
1069if(Array.isArray(t)&&t&&t.length){t.forEach(t=>{t.map(t=>""===t?"0":t)}),e=t[0];for(let i=1;i<t.length;i++)if(Array.isArray(t[i])&&void 0!==t[i])for(let o=0;o<t[i].length;o++)""!==t[i][o]&&(e[o]=t[i][o]);const i=e.map(t=>(Number(t)/16).toString()+"rem");return{unitless:{top:e[0],right:e[1],bottom:e[2],left:e[3]},rem:{top:(Number(e[0])/16).toString()+"rem",right:(Number(e[1])/16).toString()+"rem",bottom:(Number(e[2])/16).toString()+"rem",left:(Number(e[3])/16).toString()+"rem"},cssRem:i.join(" ")}}}function u(t){if(t){return t.split(",").map(t=>"0"!==t?(Number(t)/16).toString()+"rem":"0").join(" ")}}var m=i(9924),h=i(8698),p=i(2609);const{prefix:g}=h.W;let b=class extends r.WF{constructor(){super(...arguments),this.adaptivePadding=!1,this.colorBlend=!1,this.blendDirection="to-top",this.border=!1}firstUpdated(){this._cssShorthandPadding=c(this.getShorthandPaddingArrays()),this._mobilePadding=u(this.mobilePadding)}updated(t){(t.has("padding")||t.has("paddingTop")||t.has("paddingRight")||t.has("paddingBottom")||t.has("paddingLeft")||t.has("mobilePadding"))&&(this._cssShorthandPadding=c(this.getShorthandPaddingArrays()),this._mobilePadding=u(this.mobilePadding))}getShorthandPaddingArrays(){const t=[],e=function(t){const e=t?.split(",");if(void 0!==e&&Array.isArray(e)&&e.length&&e.length<=4)return 1===e.length?Array(4).fill(e[0]).flat():2===e.length?Array(2).fill(e).flat():3===e.length?(e.push(e[1]),e):e;void 0!==e&&Array.isArray(e)&&e.length>4&&console.log("Maximum 4 values required in padding array.")}(this.padding);if(e&&t.push(...t,e),(this.paddingTop||this.paddingRight||this.paddingBottom||this.paddingLeft)&&t.push(...t,[void 0!==this.paddingTop?this.paddingTop:"",void 0!==this.paddingRight?this.paddingRight:"",void 0!==this.paddingBottom?this.paddingBottom:"",void 0!==this.paddingLeft?this.paddingLeft:""]),t.length)return t}boxStyles(){let t={};return void 0!==this.maxWidth&&this.maxWidth>0?this.style.maxWidth=this.maxWidth/16+"rem":void 0!==this.maxWidth&&this.maxWidth<=0&&(this.style.maxWidth="100%"),this._cssShorthandPadding&&(t={...t,"--umg-space-padding-top":this._cssShorthandPadding.unitless.top,"--umg-space-padding-right":this._cssShorthandPadding.unitless.right,"--umg-space-padding-bottom":this._cssShorthandPadding.unitless.bottom,"--umg-space-padding-left":this._cssShorthandPadding.unitless.left,"--umg-space-padding-top-rem":this._cssShorthandPadding.rem.top,"--umg-space-padding-right-rem":this._cssShorthandPadding.rem.right,"--umg-space-padding-bottom-rem":this._cssShorthandPadding.rem.bottom,"--umg-space-padding-left-rem":this._cssShorthandPadding.rem.left}),this._mobilePadding&&(t={...t,"--umg-space-padding-mobile":this._mobilePadding}),t}boxClasses(){const t={};return this.colorBlend&&(t["box--gradient"]=!0,t["box--gradient-"+this.blendDirection]=!0),this._cssShorthandPadding&&this.adaptivePadding?t["box--adaptive-padding"]=!0:void 0===this._cssShorthandPadding||this.adaptivePadding?t["box--token-padding"]=!0:t["box--fixed-padding"]=!0,this.border&&(t["box--border"]=!0),t}render(){return r.qy` 1070 <div 1071 part="box" 1072 class="box${(0,d.H)(this.boxClasses())}" 1073 style="${(0,l.W)(this.boxStyles())}" 1074 > 1075 <div part="box-content" class="box__content"> 1076 <slot></slot> 1077 </div> 1078 </div> 1079 `}};b.styles=(0,p.Z)([m.S,r.AH` 1080 1081 /* Box width */ 1082 :host, 1083 :host([width=fill]) { 1084 display: block; 1085 width: var(--umg-size-width, 100%); 1086 } 1087 :host([width=fit-content]) { 1088 width: fit-content; 1089 } 1090 :host([width=auto]) { 1091 width: auto; 1092 } 1093 @media only screen and (max-width: 48rem) { 1094 :host, 1095 :host([mobileWidth=fill]) { 1096 display: block; 1097 width: var(--umg-size-width, 100%); 1098 } 1099 :host([mobileWidth=fit-content]) { 1100 width: fit-content; 1101 } 1102 :host([mobileWidth=auto]) { 1103 width: auto; 1104 } 1105 } 1106 1107 .box { 1108 height: 100%; 1109 } 1110 .box__content { 1111 border-radius: var(--umg-border-base-corner-radius, 0); 1112 height: 100%; 1113 color: var(--umg-color-base-text, rgb(0,0,0)); 1114 background-color: var(--umg-color-base-background, rgb(255,255,255,0)); 1115 } 1116 .box--border .box__content { 1117 border-width: var(--umg-border-base-width, 0.0625rem); 1118 border-style: solid; 1119 border-color: var(--umg-color-base-border, rgb(0,0,0,0.3)); 1120 } 1121 1122 @supports (color: rgb(from white r g b)) { 1123 .box--border .box__content { 1124 border-color: rgb(from var(--umg-color-base-border, rgb(0,0,0,0.3)) r g b / alpha); 1125 } 1126 .box__content { 1127 color: rgb(from var(--umg-color-base-text, rgb(0,0,0)) r g b / alpha); 1128 background-color: rgb(from var(--umg-color-base-background, rgb(255,255,255,0)) r g b / alpha); 1129 } 1130 } 1131 1132 /* Gradient background */ 1133 .box--gradient .box__content { 1134 background-color: transparent; 1135 } 1136 .box--gradient.box--gradient-to-top .box__content { 1137 background-image: linear-gradient(to top, 1138 rgb(from var(--umg-color-base-background) r g b / 1) 0%, 1139 rgb(from var(--umg-color-base-background) r g b / 0.3) 50%, 1140 rgb(from var(--umg-color-base-background) r g b / 0.15) 65%, 1141 rgb(from var(--umg-color-base-background) r g b / 0.075) 75.5%, 1142 rgb(from var(--umg-color-base-background) r g b / 0.037) 82.85%, 1143 rgb(from var(--umg-color-base-background) r g b / 0.019) 88%, 1144 rgb(from var(--umg-color-base-background) r g b / 0) 100% 1145 ); 1146 } 1147 .box--gradient.box--gradient-to-bottom .box__content { 1148 background-image: linear-gradient(to bottom, 1149 rgb(from var(--umg-color-base-background) r g b / 1) 0%, 1150 rgb(from var(--umg-color-base-background) r g b / 0.3) 50%, 1151 rgb(from var(--umg-color-base-background) r g b / 0.15) 65%, 1152 rgb(from var(--umg-color-base-background) r g b / 0.075) 75.5%, 1153 rgb(from var(--umg-color-base-background) r g b / 0.037) 82.85%, 1154 rgb(from var(--umg-color-base-background) r g b / 0.019) 88%, 1155 rgb(from var(--umg-color-base-background) r g b / 0) 100% 1156 ); 1157 } 1158 .box--gradient.box--gradient-to-left .box__content { 1159 background-image: linear-gradient(to left, 1160 rgb(from var(--umg-color-base-background) r g b / 1) 0%, 1161 rgb(from var(--umg-color-base-background) r g b / 0.3) 50%, 1162 rgb(from var(--umg-color-base-background) r g b / 0.15) 65%, 1163 rgb(from var(--umg-color-base-background) r g b / 0.075) 75.5%, 1164 rgb(from var(--umg-color-base-background) r g b / 0.037) 82.85%, 1165 rgb(from var(--umg-color-base-background) r g b / 0.019) 88%, 1166 rgb(from var(--umg-color-base-background) r g b / 0) 100% 1167 ); 1168 } 1169 .box--gradient.box--gradient-to-right .box__content { 1170 background-image: linear-gradient(to right, 1171 rgb(from var(--umg-color-base-background) r g b / 1) 0%, 1172 rgb(from var(--umg-color-base-background) r g b / 0.3) 50%, 1173 rgb(from var(--umg-color-base-background) r g b / 0.15) 65%, 1174 rgb(from var(--umg-color-base-background) r g b / 0.075) 75.5%, 1175 rgb(from var(--umg-color-base-background) r g b / 0.037) 82.85%, 1176 rgb(from var(--umg-color-base-background) r g b / 0.019) 88%, 1177 rgb(from var(--umg-color-base-background) r g b / 0) 100% 1178 ); 1179 } 1180 1181 /* Adaptive padding */ 1182 .box--adaptive-padding .box__content { 1183 padding-top: clamp(1rem, 100vw * 0.04, var(--umg-space-padding-top-rem)); 1184 padding-right: clamp(1rem, 100vw * 0.04, var(--umg-space-padding-right-rem)); 1185 padding-bottom: clamp(1rem, 100vw * 0.04, var(--umg-space-padding-bottom-rem)); 1186 padding-left: clamp(1rem, 100vw * 0.04, var(--umg-space-padding-left-rem)); 1187 } 1188 1189 /* Fixed padding */ 1190 .box--fixed-padding .box__content { 1191 padding-top: var(--umg-space-padding-top-rem); 1192 padding-right: var(--umg-space-padding-right-rem); 1193 padding-bottom: var(--umg-space-padding-bottom-rem); 1194 padding-left: var(--umg-space-padding-left-rem); 1195 } 1196 .box--token-padding .box__content { 1197 padding: var(--umg-space-padding, 1.5rem); 1198 } 1199 1200 @media only screen and (max-width: 48rem) { 1201 .box__content, 1202 .box--token-padding .box__content, 1203 .box--adaptive-padding .box__content, 1204 .box--fixed-padding .box__content { 1205 padding: var(--umg-space-padding-mobile, 1rem); 1206 } 1207 } 1208 `]),(0,o.C)([(0,a.M)({type:Number})],b.prototype,"maxWidth",void 0),(0,o.C)([(0,a.M)()],b.prototype,"padding",void 0),(0,o.C)([(0,a.M)()],b.prototype,"mobilePadding",void 0),(0,o.C)([(0,a.M)()],b.prototype,"paddingTop",void 0),(0,o.C)([(0,a.M)()],b.prototype,"paddingRight",void 0),(0,o.C)([(0,a.M)()],b.prototype,"paddingBottom",void 0),(0,o.C)([(0,a.M)()],b.prototype,"paddingLeft",void 0),(0,o.C)([(0,a.M)({type:Boolean})],b.prototype,"adaptivePadding",void 0),(0,o.C)([(0,a.M)({type:Boolean})],b.prototype,"colorBlend",void 0),(0,o.C)([(0,a.M)()],b.prototype,"blendDirection",void 0),(0,o.C)([(0,a.M)({type:Boolean})],b.prototype,"border",void 0),(0,o.C)([(0,n.w)()],b.prototype,"_cssShorthandPadding",void 0),(0,o.C)([(0,n.w)()],b.prototype,"_mobilePadding",void 0),b=(0,o.C)([(0,s.E)(`${g}-box`)],b)},9976(t,e,i){var o=i(8472),r=i(2618),s=i(6505),a=i(9563),n=i(3720),l=i(9924),d=i(328),c=i(8698),u=i(2609);const{prefix:m}=c.W;let h=class extends r.WF{constructor(){super(...arguments),this.spacing="normal",this.justify="start",this.mobileJustify="start",this.stack=!1,this.mobileStack=!1}buttonGroupClasses(){const t={"button-group":!0};return t["group-spacing--"+this.spacing]=!0,t["group-justify--"+this.justify]=!0,t["group-mobile-justify--"+this.mobileJustify]=!0,t["group--stack"]=this.stack,t["group--mobile-stack"]=this.mobileStack,t}render(){return r.qy` 1209 <div part="button-group" class="${(0,n.H)(this.buttonGroupClasses())}" 1210 > 1211 <slot part="button"></slot> 1212 </div> 1213 `}};h.styles=(0,u.Z)([l.S,r.AH` 1214 @media screen and (max-width: 48rem) { 1215 :host([stack]), :host([mobileStack]) { 1216 display: block; 1217 width: var(--umg-size-button-width, 100%); 1218 } 1219 } 1220 1221 .button-group { 1222 align-items: center; 1223 display: flex; 1224 flex-wrap: wrap; 1225 width: 100%; 1226 } 1227 @media screen and (max-width: 48rem) { 1228 .button-group.group--mobile-stack { 1229 flex-direction: column; 1230 } 1231 .button-group.group--mobile-stack ::slotted(*) { 1232 overflow: hidden; 1233 display: block; 1234 width: 100%; 1235 --umg-size-button-width: 100% 1236 } 1237 } 1238 @media screen and (min-width: 48.06rem) { 1239 .button-group.group--stack { 1240 flex-direction: column; 1241 } 1242 .button-group.group--stack ::slotted(*) { 1243 overflow: hidden; 1244 display: block; 1245 width: 100%; 1246 --umg-size-button-width: 100% 1247 } 1248 } 1249 `,d.Xv,d.yw,d.Oh]),(0,o.C)([(0,a.M)()],h.prototype,"spacing",void 0),(0,o.C)([(0,a.M)()],h.prototype,"justify",void 0),(0,o.C)([(0,a.M)()],h.prototype,"mobileJustify",void 0),(0,o.C)([(0,a.M)({type:Boolean})],h.prototype,"stack",void 0),(0,o.C)([(0,a.M)({type:Boolean})],h.prototype,"mobileStack",void 0),h=(0,o.C)([(0,s.E)(`${m}-button-group`)],h)}
1249,8766(t,e,i){var o=i(8472),r=i(2618),s=i(6505),a=i(9563),n=i(31),l=i(3720),d=i(1145),c=i(9924),u=i(5846),m=i(8698),h=i(2609);i(4630);const{prefix:p}=m.W;let g=class extends r.WF{constructor(){super(),this.as="button",this.for=void 0,this.clickAction=void 0,this.url=void 0,this.target="_self",this.type="button",this.icon="user",this.size="xlarge",this.extendInteraction=!1,this.disabled=!1,this.loading=!1,this.border=!1,this.label="Accessible",this._extendedInteraction()}async _extendedInteraction(){await this.updateComplete,this.disabled||"link"===this.as&&void 0!==this.url&&this.extendInteraction&&this.dispatchEvent(new CustomEvent("extend-interaction",{detail:{url:this.url,target:this.target},bubbles:!0,composed:!0}))}handleClick(){if(!this.disabled&&!this.loading&&this.clickAction){const t=new CustomEvent(this.clickAction,{bubbles:!0,composed:!0});this.dispatchEvent(t)}}buttonIconClasses(){return{"btn--border":this.border,"btn--extend-interactive":this.extendInteraction}}buttonIconStyles(){let t={};return this.padding&&(t={...t,"--umg-space-padding":"var(--umg-space-"+this.padding+", 0)"}),this.size&&(t={...t,"--umg-font-size-icon":(0,u.R)(this.size)}),t}buttonIcon(){return this.loading?r.qy` 1250 <umg-icon 1251 part="icon" 1252 exportparts="icon-container,icon-svg,icon-image" 1253 class="spinner" 1254 icon="spinner" 1255 > 1256 </umg-icon> 1257 `:r.qy` 1258 <umg-icon 1259 part="icon" 1260 exportparts="icon-container,icon-svg,icon-image" 1261 icon=${this.icon} 1262 > 1263 </umg-icon> 1264 `}buttonAs(){return"button"===this.as||void 0===this.url||""===this.url?r.qy` 1265 <button 1266 part="button-icon" 1267 class="button-icon${(0,l.H)(this.buttonIconClasses())}" 1268 style="${(0,d.W)(this.buttonIconStyles())}" 1269 type=${this.type} 1270 aria-label=${this.label} 1271 aria-controls=${(0,n.J)(this.for)} 1272 clickAction=${(0,n.J)(this.clickAction)} 1273 @click=${this.handleClick} 1274 ?disabled=${this.disabled} 1275 > 1276 ${this.buttonIcon()} 1277 </button> 1278 `:this.url?r.qy` 1279 <a 1280 part="button-icon" 1281 class="button-icon${(0,l.H)(this.buttonIconClasses())}" 1282 style="${(0,d.W)(this.buttonIconStyles())}" 1283 href="${this.url}" 1284 target="${this.target}" 1285 aria-label=${this.label} 1286 ?disabled=${this.disabled} 1287 > 1288 ${this.buttonIcon()} 1289 </a> 1290 `:void 0}render(){return r.qy` 1291 ${this.buttonAs()} 1292 `}};g.shadowRootOptions={...r.WF.shadowRootOptions,delegatesFocus:!0},g.styles=(0,h.Z)([c.S,r.AH` 1293 :host { 1294 display: inline-flex; 1295 } 1296 button[disabled] { 1297 opacity: 0.3; 1298 cursor: default; 1299 } 1300 .button-icon { 1301 cursor: pointer; 1302 border: none; 1303 border-radius: var(--umg-border-icon-corner-radius, var(--umg-border-base-corner-radius, 0)); 1304 font-size: var(--umg-font-size-icon, 1.5rem); 1305 padding: 0; 1306 color: var(--umg-color-icon-text, inherit); 1307 background-color: var(--umg-color-icon-background, inherit); 1308 } 1309 @supports (color: rgb(from white r g b)) { 1310 .button-icon { 1311 color: rgb(from var(--umg-color-icon-text, inherit) r g b / alpha); 1312 background-color: rgb(from var(--umg-color-icon-background, inherit) r g b / alpha); 1313 } 1314 } 1315 a.button-icon { 1316 display: inline-block; 1317 line-height: normal 1318 } 1319 .button-icon > * { 1320 position: relative; 1321 display: block; 1322 padding: var(--umg-space-icon-padding, var(--umg-space-padding, 0.5rem)); 1323 } 1324 1325 /* States */ 1326 .button-icon:hover { 1327 opacity: 0.7; 1328 } 1329 .button-icon[disabled]:hover { 1330 opacity: 0.3; 1331 } 1332 1333 /* Behaviour */ 1334 .btn--extend-interactive::after { 1335 content: ''; 1336 position:absolute; 1337 top:0; 1338 left:0; 1339 height: 100%; 1340 width: 100%; 1341 z-index: 1; 1342 } 1343 1344 /* Shape */ 1345 .btn--border > *::after { 1346 content: ''; 1347 position: absolute; 1348 left: 0; 1349 right: 0; 1350 top: 0; 1351 bottom: 0; 1352 box-shadow: 0 0 0 var(--umg-border-icon-width, var(--umg-border-base-width, 0.0625rem)) var(--umg-color-icon-text, var(--umg-color-base-text, rgb(0,0,0,0.5))); 1353 border-radius: var(--umg-border-icon-corner-radius, var(--umg-border-base-corner-radius, 0)); 1354 } 1355 1356 @supports (color: rgb(from white r g b)) { 1357 .btn--border > *::after { 1358 box-shadow: 0 0 0 var(--umg-border-icon-width, var(--umg-border-base-width, 0.0625rem)) rgb(from var(--umg-color-icon-border, var(--umg-color-base-text, rgb(0,0,0,0.5))) r g b / var(--umg-opacity-icon-border)); 1359 } 1360 } 1361 .spinner { 1362 animation-name: spin; 1363 animation-duration: 500ms; 1364 animation-timing-function: cubic-bezier(0, 0, 1, 1); 1365 animation-iteration-count: infinite; 1366 animation-direction: both; 1367 } 1368 @keyframes spin {to{transform: rotate(1turn)}}; 1369 `]),(0,o.C)([(0,a.M)()],g.prototype,"as",void 0),(0,o.C)([(0,a.M)()],g.prototype,"for",void 0),(0,o.C)([(0,a.M)()],g.prototype,"clickAction",void 0),(0,o.C)([(0,a.M)()],g.prototype,"url",void 0),(0,o.C)([(0,a.M)()],g.prototype,"target",void 0),(0,o.C)([(0,a.M)()],g.prototype,"type",void 0),(0,o.C)([(0,a.M)()],g.prototype,"icon",void 0),(0,o.C)([(0,a.M)()],g.prototype,"size",void 0),(0,o.C)([(0,a.M)({type:Boolean})],g.prototype,"extendInteraction",void 0),(0,o.C)([(0,a.M)({type:Boolean,reflect:!0})],g.prototype,"disabled",void 0),(0,o.C)([(0,a.M)({type:Boolean,reflect:!0})],g.prototype,"loading",void 0),(0,o.C)([(0,a.M)()],g.prototype,"padding",void 0),(0,o.C)([(0,a.M)({type:Boolean})],g.prototype,"border",void 0),(0,o.C)([(0,a.M)()],g.prototype,"label",void 0),g=(0,o.C)([(0,s.E)(`${p}-button-icon`)],g)},3556(t,e,i){var o=i(8472),r=i(2618),s=i(6505),a=i(9563),n=i(31),l=i(3720),d=i(9924);const c=r.AH` 1370 /* Base */ 1371 .button { 1372 cursor: pointer; 1373 font-family: var(--umg-font-button-family, var(--umg-font-family, var(--umg-font-body-family, inherit))); 1374 font-weight: var(--umg-font-button-weight, var(--umg-font-base-weight, 700)); 1375 font-size: var(--umg-font-button-size, var(--umg-font-size, var(--umg-font-body-size-sm, 0.875rem))); 1376 letter-spacing: 0.06rem; 1377 background-clip: padding-box; 1378 border-radius: var(--umg-border-button-corner-radius, var(--umg-border-base-corner-radius, 0)); 1379 border-width: var(--umg-border-button-width, var(--umg-border-base-width, 0.0625rem)); 1380 border-style: solid; 1381 outline: none; 1382 appearance: none; 1383 text-decoration: none; 1384 appearance: none; 1385 --webkit-appearance: none; 1386 } 1387 1388 .button { 1389 color: rgb(from var(--umg-color-button-text, var(--umg-color-base-background, rgb(255,255,255))) r g b / alpha); 1390 background-color: rgb(from var(--umg-color-button-background, var(--umg-color-base-text, rgb(0,0,0))) r g b / alpha); 1391 border-color: rgb(from var(--umg-color-button-background, var(--umg-color-base-text, rgb(0,0,0))) r g b / alpha); 1392 } 1393 .button > * { 1394 /* Child elements */ 1395 --umg-color-base-text: rgb(from var(--umg-color-button-text, var(--umg-color-base-background, rgb(255,255,255))) r g b / alpha); 1396 } 1397 .button:not(.btn--plain):not(.btn--plain-underline):not(.btn--outline):hover { 1398 box-shadow: 0 0 0 0.0625rem rgb(from var(--umg-color-button-background, var(--umg-color-base-text, rgb(0,0,0))) r g b / alpha); 1399 background-color: rgb(from var(--umg-color-button-background-hover, var(--umg-color-base-text, rgb(0,0,0,0.8))) r g b / alpha); 1400 } 1401 .button:not(.btn--plain):not(.btn--plain-underline):not(.btn--outline):focus-visible { 1402 outline: 0.125rem solid rgb(from var(--umg-color-button-background, var(--umg-color-base-text, rgb(0,0,0))) r g b / alpha); 1403 box-shadow: 0 0 0 0.15rem rgb(from var(--umg-color-button-text, var(--umg-color-base-background, rgb(255,255,255))) r g b / alpha), 0 0 0.25rem 0.2rem rgb(from var(--umg-color-button-background, var(--umg-color-base-text, rgb(0,0,0)) r g b / alpha)); 1404 background-color: rgb(from var(--umg-color-button-background-focus, var(--umg-color-base-text, rgb(0,0,0,0.8))) r g b / alpha); 1405 } 1406 1407 /* States */ 1408 .button[disabled], 1409 .button[disabled]:hover { 1410 cursor: default; 1411 color: rgb(from var(--umg-color-base-text-disabled, rgb(160, 160, 160)) r g b / alpha); 1412 } 1413 1414 .button[disabled]:not(.btn--plain):not(.btn--plain-underline):not(.btn--outline), 1415 .button[disabled]:not(.btn--plain):not(.btn--plain-underline):not(.btn--outline):hover { 1416 border: none; 1417 box-shadow: none; 1418 background-color: rgb(from var(--umg-color-base-background-disabled, rgb(220, 220, 220)) r g b / alpha); 1419 } 1420 1421 .button:active { 1422 outline: none; 1423 } 1424 1425 *:focus-visible { 1426 outline-offset: 0.1875rem; 1427 } 1428 1429 a.button { 1430 display: inline-flex; 1431 align-items: center; 1432 justify-content: center; 1433 line-height: normal; 1434 } 1435 1436`,u=r.AH` 1437 .button { 1438 line-height: 1; 1439 height: var(--umg-size-button-height, var(--umg-space-48, 2.5rem)); 1440 padding: var(--umg-space-button-padding, 0 2rem); 1441 width: var(--umg-size-button-width, auto); 1442 } 1443 1444 .button__label { 1445 display: flex; 1446 gap: 0.25rem; 1447 align-items: center; 1448 justify-content: center; 1449 } 1450 1451 /* Text alignment */ 1452 .btn--text-align-left .button__label { 1453 justify-content: start; 1454 } 1455 .btn--text-align-center .button__label { 1456 justify-content: center; 1457 } 1458 .btn--text-align-right .button__label { 1459 justify-content: end; 1460 } 1461 1462 /* Width */ 1463 .btn--fullwidth { 1464 width: 100%; 1465 } 1466 1467 /* Size */ 1468 .btn--size-large:not(.btn--plain) { 1469 --umg-size-button-height: var(--umg-space-48, 3rem); 1470 padding: 0 var(--umg-space-32, 2rem); 1471 } 1472 .btn--size-medium:not(.btn--plain) { 1473 --umg-size-button-height: 2.75rem; 1474 padding: 0 var(--umg-space-20, 1.5rem); 1475 } 1476 .btn--size-small:not(.btn--plain) { 1477 --umg-size-button-height: var(--umg-space-40, 2.5rem); 1478 padding: 0 var(--umg-space-16, 1rem); 1479 font-size: var(--umg-font-body-size-sm); 1480 font-weight: var(--umg-font-button-weight, var(--umg-font-base-weight-regular)); 1481 } 1482 .btn--size-xsmall:not(.btn--plain) { 1483 --umg-size-button-height: var(--umg-space-32, 2rem); 1484 padding: 0 var(--umg-space-12, 0.75rem); 1485 font-size: var(--umg-font-body-size-xs); 1486 font-weight: var(--umg-font-button-weight, var(--umg-font-base-weight-regular)); 1487 } 1488 .btn--size-slim:not(.btn--plain) { 1489 --umg-size-button-height: var(--umg-space-24, 1.5rem); 1490 font-weight: var(--umg-font-button-weight, var(--umg-font-base-weight-regular)); 1491 font-size: var(--umg-font-body-size-xs); 1492 padding: 0 var(--umg-space-12, 0.75rem); 1493 } 1494 .btn--size-small.btn--plain { 1495 font-size: var(--umg-font-body-size-sm); 1496 } 1497 .btn--size-slim.btn--plain { 1498 font-size: var(--umg-font-body-size-xs); 1499 } 1500 1501 /* Behaviour */ 1502 .btn--extend:not([disabled]):after, 1503 .btn--extend-hidden:not([disabled]):after { 1504 content: ''; 1505 position:absolute; 1506 top:0; 1507 left:0; 1508 height: 100%; 1509 width: 100%; 1510 z-index: 1; 1511 cursor: pointer; 1512 } 1513 1514 /* Loading state */ 1515 .btn--loading { 1516 position: relative; 1517 } 1518 .btn--loading ::slotted(*), 1519 .btn--loading .button__label { 1520 opacity: 0; 1521 } 1522 .button__spinner { 1523 animation-name: spin; 1524 animation-duration: 500ms; 1525 animation-timing-function: cubic-bezier(0, 0, 1, 1); 1526 animation-iteration-count: infinite; 1527 animation-direction: both; 1528 fill: currentColor; 1529 height: 1rem; 1530 left: 50%; 1531 margin: calc(var(--umg-space-16, 1rem) / 2 * -1) 0 0 calc(var(--umg-space-16, 1rem) / 2 * -1); 1532 position: absolute; 1533 top: 50%; 1534 width: 1rem; 1535 }
1536 @keyframes spin {to{transform: rotate(1turn)}}; 1537`,m=r.AH` 1538 .btn--outline { 1539 background-color: transparent; 1540 border-color: rgb(from var(--umg-color-button-background, var(--umg-color-base-text, rgb(0,0,0))) r g b / alpha); 1541 color: rgb(from var(--umg-color-button-background, var(--umg-color-base-text, rgb(0,0,0))) r g b / alpha); 1542 } 1543 1544 .btn--outline[disabled], 1545 .btn--outline[disabled]:hover { 1546 cursor: default; 1547 box-shadow: none; 1548 color: rgb(from var(--umg-color-base-background-disabled, rgb(220, 220, 220)) R G B / alpha); 1549 border-color: rgb(from var(--umg-color-base-background-disabled, rgb(220, 220, 220)) R G B / alpha); 1550 background-color: transparent; 1551 } 1552 1553 .btn--outline:hover { 1554 border-color: transparent; 1555 box-shadow: 0 0 0 0.0625rem rgb(from var(--umg-color-button-background, var(--umg-color-base-text, rgb(0,0,0))) r g b / alpha); 1556 } 1557 1558 .btn--outline > * { 1559 --umg-color-base-text: rgb(var(--umg-color-button-background) r g b / alpha); 1560 } 1561`,h=r.AH` 1562 .btn--plain[disabled], .btn--plain-underline[disabled] { 1563 background-color: transparent; 1564 color: var(--umg-color-base-text-disabled, rgb(160, 160, 160)); 1565 } 1566 @supports (color: rgb(from white r g b)) { 1567 .btn--plain[disabled], .btn--plain-underline[disabled] { 1568 color: rgb(from var(--umg-color-base-text-disabled, rgb(160, 160, 160)) r g b / alpha); 1569 } 1570 } 1571 .btn--plain, .btn--plain-underline { 1572 border: none; 1573 padding: 0; 1574 height: auto; 1575 background-color: transparent; 1576 color: var(--umg-color-base-text, inherit); 1577 } 1578 @supports (color: rgb(from white r g b)) { 1579 .btn--plain, .btn--plain-underline { 1580 color: rgb(from var(--umg-color-base-text, inherit) r g b / alpha); 1581 } 1582 } 1583 .btn--plain:focus-visible { 1584 outline: none; 1585 box-shadow: none; 1586 } 1587 .btn--plain:not(.btn--plain-underline):not([disabled]):hover, 1588 .btn--plain:not(.btn--plain-underline):not([disabled]):focus-visible { 1589 text-decoration: underline; 1590 text-underline-offset: 0.2rem; 1591 } 1592 .btn--plain:not(.btn--plain-underline):not([disabled]):focus-visible { 1593 text-decoration-thickness: 0.125rem; 1594 } 1595 .btn--plain-underline { 1596 text-decoration: underline; 1597 text-underline-offset: 0.2rem; 1598 transition: text-decoration-color 0.2s; 1599 } 1600 .btn--plain-underline:not([disabled]):hover { 1601 text-decoration-color: var(--umg-color-base-text, inherit); 1602 } 1603 @supports (color: rgb(from white r g b)) { 1604 .btn--plain-underline:not([disabled]):hover { 1605 text-decoration-color: rgb(from var(--umg-color-base-text, inherit) r g b / 0.5) 1606 } 1607 } 1608 .btn--plain-underline:not([disabled]):focus-visible { 1609 outline: none; 1610 box-shadow: none; 1611 text-decoration-thickness: 0.125rem; 1612 text-underline-offset: 0.25rem; 1613 } 1614`;var p=i(8698),g=i(2609);const{prefix:b}=p.W;let v=class extends r.WF{constructor(){super(),this.as="button",this.type="button",this.for=void 0,this.clickAction=void 0,this.url=void 0,this.target="_self",this.buttonStyle="solid",this.textAlign="center",this.disabled=!1,this.fullWidth=!1,this.extendInteraction=!1,this.extendInteractionHidden=!1,this.loading=!1,this._extendedInteraction()}async _extendedInteraction(){await this.updateComplete,this.disabled||"link"===this.as&&void 0!==this.url&&this.extendInteraction&&this.dispatchEvent(new CustomEvent("extend-interaction",{detail:{url:this.url,target:this.target},bubbles:!0,composed:!0}))}handleClick(){if(!this.disabled&&this.clickAction){const t=new CustomEvent(this.clickAction,{bubbles:!0,composed:!0});this.dispatchEvent(t)}}buttonClasses(){const t={"btn--plain":"plain"===this.buttonStyle,"btn--plain-underline":"plain-underline"===this.buttonStyle,"btn--outline":"outline"===this.buttonStyle,"btn--fullwidth":this.fullWidth,"btn--extend":this.extendInteraction,"btn--extend-hidden":this.extendInteractionHidden,"btn--loading":this.loading};return t["btn--size-"+this.size]=!0,t["btn--text-align-"+this.textAlign]=!0,t}buttonAs(){return"button"===this.as||void 0===this.url||""===this.url?r.qy` 1615 <button 1616 part="button"
1617 class="button${(0,l.H)(this.buttonClasses())}" 1618 type=${this.type} 1619 aria-controls="${(0,n.J)(this.for)}" 1620 clickAction="${(0,n.J)(this.clickAction)}" 1621 ?disabled=${this.disabled} 1622 @click=${this.handleClick} 1623 > 1624 ${this.buttonContent()} 1625 </button> 1626 `:this.url?r.qy` 1627 <a 1628 part="button" 1629 href="${this.url}" 1630 class="button${(0,l.H)(this.buttonClasses())}" 1631 target="${this.target}" 1632 ?disabled=${this.disabled} 1633 > 1634 ${this.buttonContent()} 1635 </a> 1636 `:void 0}buttonContent(){return this.loading?r.qy` 1637 <slot name="label"></slot> 1638 <slot> 1639 <span part="button-label" class="button__label">Label</span> 1640 </slot> 1641 <svg class="button__spinner" width="16" height="16" xmlns="http://www.w3.org/2000/svg" focusable="false" role="presentation" aria-hidden="true" viewBox="0 0 512 512"> 1642 <path d="M463.9 376c7.6 4.4 17.5 1.8 21.4-6.1c17.1-34.3 26.7-73 26.7-113.9C512 120 405.9 8.8 272 .5c-8.8-.5-16 6.7-16 15.5v0c0 8.8 7.2 15.9 16 16.6C388.2 40.8 480 137.7 480 256c0 35.1-8.1 68.3-22.5 97.9c-3.9 8-1.3 17.7 6.4 22.2v0z"/> 1643 </svg> 1644 `:r.qy` 1645 <span part="button-label" class="button__label"> 1646 <slot name="label"></slot> 1647 <slot> 1648 Label 1649 </slot> 1650 </span> 1651 `}render(){return r.qy` 1652 ${this.buttonAs()} 1653 `}};v.shadowRootOptions={...r.WF.shadowRootOptions,delegatesFocus:!0},v.styles=(0,g.Z)([d.S,c,u,m,h,r.AH` 1654 /* Parent */ 1655 :host([fullwidth]) { 1656 width: 100%; 1657 } 1658 1659 :host([extendInteractionHidden]) { 1660 display: block; 1661 overflow: hidden; 1662 width: 0; 1663 height: 0!important; 1664 margin: -1px; 1665 padding: 0; 1666 border: 0; 1667 clip: rect(0 0 0 0); 1668 } 1669 1670 .btn--plain > *, 1671 .btn--plain-underline > *, 1672 .btn--outline > * { 1673 /* Child elements */ 1674 --umg-color-base-text: var(--umg-color-button-background); 1675 } 1676 1677 `]),(0,o.C)([(0,a.M)()],v.prototype,"as",void 0),(0,o.C)([(0,a.M)()],v.prototype,"type",void 0),(0,o.C)([(0,a.M)()],v.prototype,"for",void 0),(0,o.C)([(0,a.M)()],v.prototype,"clickAction",void 0),(0,o.C)([(0,a.M)()],v.prototype,"url",void 0),(0,o.C)([(0,a.M)()],v.prototype,"target",void 0),(0,o.C)([(0,a.M)()],v.prototype,"size",void 0),(0,o.C)([(0,a.M)()],v.prototype,"buttonStyle",void 0),(0,o.C)([(0,a.M)()],v.prototype,"textAlign",void 0),(0,o.C)([(0,a.M)({type:Boolean,reflect:!0})],v.prototype,"disabled",void 0),(0,o.C)([(0,a.M)({type:Boolean})],v.prototype,"fullWidth",void 0),(0,o.C)([(0,a.M)({type:Boolean})],v.prototype,"extendInteraction",void 0),(0,o.C)([(0,a.M)({type:Boolean})],v.prototype,"extendInteractionHidden",void 0),(0,o.C)([(0,a.M)({type:Boolean})],v.prototype,"loading",void 0),v=(0,o.C)([(0,s.E)(`${b}-button`)],v)},8903(t,e,i){var o=i(8472),r=i(2618),s=i(6505),a=i(9563),n=i(7509),l=i(31),d=i(3720),c=i(1145),u=i(9061),m=i(1088),h=i(9924),p=i(8698),g=i(2609);i(3919),i(1682),i(5686),i(8766);const{prefix:b}=p.W;let v=class extends r.WF{constructor(){super(...arguments),this.visible=!1}_closePopover(){this.visible=!1,document.body.style.overflow=""}popoverClasses(){return{"popover--visible":this.visible}}popoverStyles(){return{visibility:this.visible?"visible":"hidden"}}closeButton(){if(this.visible)return r.qy` 1678 <umg-button-icon 1679 part="close-button" 1680 exportparts="button-icon,icon-container,icon-svg,icon-image" 1681 class="close-button" 1682 icon="close" 1683 padding="4" 1684 @click="${this._closePopover}" 1685 > 1686 </umg-button-icon> 1687 `}render(){return r.qy` 1688 <div 1689 id="popover-content" 1690 role="tooltip" 1691 class="popover color-popover${(0,d.H)(this.popoverClasses())}" 1692 style="${(0,c.W)(this.popoverStyles())}" 1693 > 1694 <div class="popover-inner"> 1695 <div 1696 class="popover-content color-popover-content" 1697 aria-labelledby="popover" 1698 role="region" 1699 > 1700 <div class="popover-title"> 1701 <slot name="title"></slot> 1702 ${this.closeButton()} 1703 </div> 1704 <slot name="content"></slot> 1705 </div> 1706 </div> 1707 </div> 1708 `}};v.styles=(0,g.Z)([h.S,r.AH` 1709 .popover { 1710 position: fixed; 1711 visibility: hidden; 1712 inset: 0; 1713 z-index: 499; // under overlay z-index 1714 flex-direction: column; 1715 justify-content: stretch; 1716 overflow: hidden; 1717 border-width: var(--umg-border-base-width, 0.0625rem); 1718 border-style: solid; 1719 background-clip: padding-box; 1720 } 1721 1722 .popover-inner { 1723 display: flex; 1724 flex-direction: column; 1725 align-items: center; 1726 justify-content: center; 1727 height: 100%; 1728 width: 100%; 1729 overflow-y: auto; 1730 } 1731 1732 .popover-content { 1733 display: flex; 1734 flex-direction: column; 1735 align-items: center; 1736 justify-content: start; 1737 gap: var(--umg-space-24); 1738 padding: var(--umg-space-24); 1739 width: 100%; 1740 } 1741 1742 .popover-inner::-webkit-scrollbar {
1743 width: 0.25rem; 1744 } 1745 .popover-inner::-webkit-scrollbar-track { 1746 background: var(--umg-color-popover-text, rgb(0,0,0,0.05)); 1747 border-radius: var(--umg-border-radius-30); 1748 } 1749 .popover-inner::-webkit-scrollbar-thumb{ 1750 background: var(--umg-color-popover-text, rgb(0,0,0,0.1)); 1751 border-radius: var(--umg-border-radius-30); 1752 } 1753 1754 @supports (color: rgb(from white r g b)) { 1755 .popover-inner::-webkit-scrollbar-track { 1756 background: rgb(from var(--umg-color-popover-text, rgb(0,0,0)) r g b / 0.05); 1757 } 1758 .popover-inner::-webkit-scrollbar-thumb{ 1759 background: rgb(from var(--umg-color-popover-text, rgb(0,0,0)) r g b / 0.1); 1760 } 1761 } 1762 1763 @media only screen and (hover: hover) { 1764 .close-button { 1765 display: none; 1766 } 1767 .popover { 1768 position: absolute; 1769 border-radius: var(--umg-border-base-corner-radius); 1770 } 1771 .popover-inner { 1772 opacity: 0; 1773 max-width: 320px; 1774 margin: 0 auto; 1775 } 1776 .popover--visible .popover-inner { 1777 opacity: 1; 1778 transition: opacity 0.3s 1779 } 1780 .popover-title { 1781 display: none; 1782 } 1783 } 1784 1785 @media screen and (hover: none) { 1786 .close-button { 1787 display: block; 1788 margin-left: auto; 1789 } 1790 .popover { 1791 border: none; 1792 transform: translateX(-100%); 1793 } 1794 .popover-inner { 1795 padding: var(--umg-space-24); 1796 transform: translateX(-100%); 1797 margin: 0 auto; 1798 } 1799 .popover--visible { 1800 transform: translateX(0); 1801 } 1802 .popover--visible .popover-inner { 1803 transform: translateX(0); 1804 transition: all 0.3s 1805 } 1806 .popover-content { 1807 border-radius: var(--umg-border-radius-30); 1808 padding: var(--umg-space-24); 1809 border-width: var(--umg-border-base-width, 0.0625rem); 1810 border-style: solid; 1811 } 1812 .popover-title { 1813 display: flex; 1814 align-items: center; 1815 justify-content: space-between; 1816 width: 100%; 1817 } 1818 } 1819 1820 /* Colour classes */ 1821 .color-popover { 1822 background-color: var(--umg-color-popover-background, rgb(255,255,255,0.9)); 1823 border-color: var(--umg-color-popover-text, rgb(240,240,240)); 1824 } 1825 .color-popover-content { 1826 color: var(--umg-color-popover-text, rgb(0,0,0)); 1827 background-color: transparent; 1828 --umg-color-base-text: var(--umg-color-popover-text); 1829 --umg-color-base-background: transparent; 1830 } 1831 1832 @supports (color: rgb(from white r g b)) { 1833 .color-popover { 1834 background-color: rgb(from var(--umg-color-popover-background, rgb(255,255,255,0.9)) r g b / alpha); 1835 border-color: rgb(from var(--umg-color-popover-text, rgb(240,240,240)) r g b / alpha); 1836 1837 } 1838 .color-popover-content { 1839 color: rgb(from var(--umg-color-popover-text, rgb(0,0,0)) r g b / 1); 1840 } 1841 } 1842 1843 @media screen and (hover: none) { 1844 .color-popover-content { 1845 background-color: var(--umg-color-popover-background, rgb(255,255,255)); 1846 border-color: var(--umg-color-popover-text, rgb(240,240,240)); 1847 } 1848 @supports (color: rgb(from white r g b)) { 1849 .color-popover-content { 1850 background-color: rgb(from var(--umg-color-popover-background, rgb(255,255,255)) r g b / 1); 1851 border-color: rgb(from var(--umg-color-popover-text, rgb(240,240,240)) r g b / 1); 1852 } 1853 } 1854 } 1855 `]),(0,o.C)([(0,a.M)({type:Boolean,reflect:!0})],v.prototype,"visible",void 0),v=(0,o.C)([(0,s.E)(`${b}-card-popover`)],v);const{prefix:y}=p.W;let f=class extends r.WF{constructor(){super(),this.position="under",this.mobilePosition="under",this.align="stretch",this.colorBlend=!1,this.border=!1,this._hasPopover=!1,this._cardPopover=null,this._tabElements=null,this.eventManager=new m.E(this),this._isDragging=!1,this._touchStartX=0,this._touchStartY=0,this._onTouchStart=t=>{1===t.touches.length&&(this._touchStartX=t.touches[0].clientX,this._touchStartY=t.touches[0].clientY,this._isDragging=!1)},this._onTouchMove=t=>{const e=t.touches[0];(Math.abs(e.clientX-this._touchStartX)>10||Math.abs(e.clientY-this._touchStartY)>10)&&(this._isDragging=!0)},this._onTouchEnd=t=>{if(!this._isDragging){const e=t.target;this._cardPopover&&!this._cardPopover.contains(e)&&this._togglePopoverMobile()}},this._onMouseEnter=()=>{this._togglePopover()},this._onMouseLeave=()=>{this._togglePopover()},this._onKeyDown=t=>{if(this._cardPopover?.hasAttribute("visible")){const e=this._cardPopover.querySelectorAll("a[href], input, button, video, iframe, umg-button, umg-link, umg-socials, umg-link-group, umg-button-icon"),i=Array.prototype.slice.call(e),o=i.indexOf(document.activeElement);if("ArrowDown"===t.key){t.preventDefault();i[(o+1)%i.length].focus()}else if("ArrowUp"===t.key){t.preventDefault();i[(o-1+i.length)%i.length].focus()}}},this._eventsHandler=t=>{if("focusin"===t.type&&this._cardPopover&&this._cardPopover.setAttribute("visible",""),"focusout"===t.type&&this._cardPopover){const e=t.currentTarget,i=t.relatedTarget;if(i&&this._cardPopover.contains(i))return;e.contains(i)||(this._cardPopover.removeAttribute("visible"),this._removeKeyboardListeners())}},this.eventManager.addEventListener("media-details",this._setMediaAspectRatio),this.eventManager.addEventListener("keyup",this._eventsHandler)}updated(){this._hasPopover?(this.eventManager.addEventListener("touchstart",this._onTouchStart),this.eventManager.addEventListener("touchmove",this._onTouchMove),this.eventManager.addEventListener("touchend",this._onTouchEnd),this.eventManager.addEventListener("focusin",this._eventsHandler),this.eventManager.addEventListener("focusout",this._eventsHandler),this.eventManager.addEventListener("keydown",this._onKeyDown),window.matchMedia("(hover: hover)").matches&&(this.eventManager.addEventListener("mouseenter",this._onMouseEnter),this.eventManager.addEventListener("mouseleave",this._onMouseLeave))):(this.eventManager.removeEventListener("touchstart",this._onTouchStart),this.eventManager.removeEventListener("touchmove",this._onTouchMove),this.eventManager.removeEventListener("touchend",this._onTouchEnd),this.eventManager.removeEventListener("focusin",this._eventsHandler),this.eventManager.removeEventListener("focusout",this._eventsHandler),this.eventManager.removeEventListener("keydown",this._onKeyDown),window.matchMedia("(hover: hover)").matches&&(this.eventManager.removeEventListener("mouseenter",this._onMouseEnter),this.eventManager.removeEventListener("mouseleave",this._onMouseLeave)))}_setMediaAspectRatio(t){"media-details"===t.type&&(t.detail.mediaAspectRatio&&(this._mediaAspectRatio=t.detail.mediaAspectRatio.toString()),t.detail.mobileMediaAspectRatio?this._mobileMediaAspectRatio=t.detail.mobileMediaAspectRatio.toString():t.detail.mediaAspectRatio&&(this._mediaAspectRatio=t.detail.mediaAspectRatio.toString()))}_addKeyboardListeners(){this._cardPopover?.addEventListener("keydown",this._onKeyDown)}_removeKeyboardListeners(){this._cardPopover?.removeEventListener("keydown",this._onKeyDown)}_togglePopoverMobile(){this._cardPopover&&(this._cardPopover.hasAttribute("visible")?(this._cardPopover.removeAttribute("visible"),document.body.style.overflow="auto"):(this._cardPopover.setAttribute("visible",""),document.body.style.overflow="hidden"))}_togglePopover(){this._cardPopover&&(this._cardPopover.hasAttribute("visible")?(this._cardPopover.removeAttribute("visible"),this._removeKeyboardListeners()):(this._cardPopover.setAttribute("visible",""),this._addKeyboardListeners()))}
1855_handleSlotChange(t){this._hasPopover=(0,u.Y)(t,"popover"),this._cardPopover=this.querySelector("umg-card-popover"),this._tabElements=this.querySelectorAll("a[href], input, button, video, iframe, umg-button, umg-link, umg-socials, umg-link-group, umg-button-icon"),this._tabElements.forEach(t=>{t.setAttribute("tabindex","-1")}),this.setAttribute("tabindex","0"),this.setAttribute("aria-describedby","popover-content")}cardClasses(){const t={"caption-card--border":this.border};return"under"===this.position&&(t["caption--inline"]=!0,t["caption-position--"+this.position]=!0),"over"===this.position&&(t["caption-position--"+this.position]=!0),"under"===this.mobilePosition&&(t["caption-mobile--inline"]=!0,t["caption-mobile-position--"+this.mobilePosition]=!0),"over"===this.mobilePosition&&(t["caption-mobile-position--"+this.mobilePosition]=!0),t}cardStyles(){let t={};return t={"--umg-aspect-ratio":this._mediaAspectRatio,"--umg-mobile-aspect-ratio":this._mobileMediaAspectRatio},t}captionClasses(){const t={};return this.align&&(t["caption-align--"+this.align]=!0),this.justify&&(t["caption-justify--"+this.justify]=!0),t}mobileGap(){if(this.spacing)return.75*Number(this.spacing)}render(){return r.qy` 1856 <div 1857 part="caption-card" 1858 class="caption-card${(0,d.H)(this.cardClasses())}" 1859 style="${(0,c.W)(this.cardStyles())}" 1860 > 1861 <div 1862 part="caption-card-inner" 1863 class="caption-card__inner" 1864 > 1865 <div 1866 part="card-media" 1867 class="media" 1868 > 1869 <slot name="media"></slot> 1870 <div 1871 part="card-badge" 1872 class="badge" 1873 > 1874 <slot name="badge"></slot> 1875 </div> 1876 </div> 1877 <div 1878 part="card-caption" 1879 class="caption${(0,d.H)(this.captionClasses())}" 1880 > 1881 <div part="card-caption-inner" class="caption-inner"> 1882 <umg-box 1883 part="caption-content" 1884 exportparts="box,box-content" 1885 class="caption-content" 1886 blendDirection="to-top" 1887 padding=${(0,l.J)(this.padding)} 1888 mobilePadding=${(0,l.J)(this.mobilePadding)} 1889 ?colorBlend="${this.colorBlend}" 1890 fixPadding 1891 > 1892 <umg-vertical-stack 1893 part="caption-stack" 1894 exportparts="vertical-stack" 1895 class="caption-stack" 1896 spacing="${(0,l.J)(this.spacing)}" 1897 mobileSpacing="${(0,l.J)(this.mobileGap())}" 1898 justify="space-between" 1899 > 1900 <slot name="content"></slot> 1901 </umg-vertical-stack> 1902 </umg-box> 1903 </div> 1904 </div> 1905 </div> 1906 <slot name="popover" @slotchange=${this._handleSlotChange}></slot> 1907 </div> 1908 `}};f.styles=(0,g.Z)([h.S,r.AH` 1909 :host { 1910 position: relative; 1911 display: block; 1912 height: 100%; 1913 width: 100%; 1914 } 1915 1916 /** Card */ 1917 .caption-card { 1918 position: relative; 1919 height: 100%; 1920 width: 100%; 1921 overflow: hidden; 1922 } 1923 .caption-card__inner { 1924 height: 100%; 1925 position: relative; 1926 overflow: hidden; 1927 border-radius: var(--umg-border-base-corner-radius); 1928 } 1929 1930 /* Card overlay */ 1931 .caption-card__inner .media::after { 1932 content: ''; 1933 display: block; 1934 height: 100%; 1935 left: 0; 1936 position: absolute; 1937 top: 0; 1938 width: 100%; 1939 z-index: 1; 1940 pointer-events: none; 1941 background-color: var(--umg-color-overlay-background); 1942 border-radius: var(--umg-border-base-corner-radius) var(--umg-border-base-corner-radius) 0 0; 1943 } 1944 1945 /* Standard border */ 1946 .caption-card__inner { 1947 border-width: var(--umg-border-base-width, 0); 1948 border-style: solid; 1949 border-color: var(--umg-color-base-border, rgb(0,0,0,0)); 1950 --umg-color-base-text: var(--umg-color-card-text); 1951 --umg-color-base-background: var(--umg-color-card-background); 1952 } 1953 1954 /* Card padded border */ 1955 .caption-card--border .caption-card__inner { 1956 padding: var(--umg-space-padding, 1rem); 1957 background-color: var(--umg-color-card-background, rgb(240,240,240)); 1958 } 1959 1960 @media screen and (min-width: 30.06rem) { 1961 .caption-card--border.caption-position--over .caption { 1962 padding: var(--umg-space-padding, 1rem); 1963 } 1964 } 1965 @media screen and (max-width: 30rem) { 1966 .caption-card--border.caption-mobile-position--over .caption { 1967 padding: var(--umg-space-padding, 1rem); 1968 } 1969 } 1970 1971 @supports (color: rgb(from white r g b)) { 1972 .caption-card__inner { 1973 border-color: rgb(from var(--umg-color-base-border, rgb(0,0,0)) r g b / alpha); 1974 } 1975 .caption-card__inner .media::after { 1976 background-color: rgb(from var(--umg-color-overlay-background) r g b / calc(alpha * var(--umg-opacity-overlay-background))); 1977 } 1978 .caption-card--border .caption-card__inner { 1979 background-color: rgb(from var(--umg-color-card-background, rgb(240,240,240)) r g b / alpha); 1980 --umg-color-base-background: transparent; 1981 } 1982 } 1983 1984 /** Caption content */ 1985 .caption { 1986 flex: 1; 1987 z-index: 20; 1988 } 1989 .caption umg-vertical-stack ::slotted(umg-button) { 1990 margin-top: auto; 1991 } 1992 1993 /* Card badge */ 1994 .badge { 1995 position: absolute; 1996 top: 1rem; 1997 left: 1rem; 1998 z-index: 1; 1999 letter-spacing: 0.07rem; 2000 pointer-events: none; 2001 } 2002 2003 /** Media content */ 2004 .media { 2005 position: relative; 2006 aspect-ratio: var(--umg-mobile-aspect-ratio); 2007 flex-shrink: 1; 2008 padding: var(--umg-space-caption-card-media-padding); 2009 height: auto; 2010 background-color: rgb(from var(--umg-color-card-background, transparent) r g b / alpha); 2011 } 2012 2013 @media only screen and (min-width: 30.06rem) { 2014 .media { 2015 aspect-ratio: var(--umg-aspect-ratio); 2016 } 2017 } 2018 2019 /* Border corner radius */ 2020 .media { 2021 border-radius: calc(var(--umg-border-base-corner-radius) * 0.7) calc(var(--umg-border-base-corner-radius) * 0.7) 0 0; 2022 overflow: hidden; 2023 } 2024 @media only screen and (min-width: 30.06rem) { 2025 .caption-position--over .caption-inner, 2026 .caption-position--over .media { 2027 border-radius: calc(var(--umg-border-base-corner-radius) * 0.7); 2028 overflow: hidden; 2029 } 2030 } 2031 @media only screen and (max-width: 30rem) { 2032 .caption-mobile-position--over .caption-inner, 2033 .caption-mobile-position--over .media { 2034 border-radius: calc(var(--umg-border-base-corner-radius) * 0.7); 2035 overflow: hidden; 2036 } 2037 } 2038 .caption-inner ::part(box-content) { 2039 border-radius: 0; 2040 } 2041 2042 /* Caption positioning */ 2043 @media only screen and (min-width: 30.06rem) { 2044 .caption--inline .caption-card__inner { 2045 display: flex; 2046 flex-direction: column; 2047 } 2048 .caption-position--under .media { 2049 order: 1; 2050 } 2051 .caption-position--under .caption { 2052 order: 2; 2053 } 2054 } 2055 @media only screen and (max-width: 30rem) { 2056 .caption-mobile--inline .caption-card__inner { 2057 display: flex; 2058 flex-direction: column; 2059 } 2060 .caption-mobile-position--under .media { 2061 order: 1; 2062 } 2063 .caption-mobile-position--under .caption { 2064 order: 2; 2065 } 2066 } 2067 2068 2069 @media only screen and (min-width: 30.06rem) { 2070 .caption-card:not(.caption--inline) .caption { 2071 position: absolute; 2072 top: 0; 2073 left: 0; 2074 height: 100%; 2075 width: 100%; 2076 z-index: 10; 2077 } 2078 .caption-position--over { 2079 height: auto; 2080 aspect-ratio: var(--umg-aspect-ratio); 2081 } 2082 } 2083 @media only screen and (max-width: 30rem) { 2084 .caption-card:not(.caption-mobile--inline) .caption { 2085 position: absolute; 2086 top: 0; 2087 left: 0; 2088 height: 100%; 2089 width: 100%; 2090 z-index: 10; 2091 } 2092 .caption-mobile-position--over { 2093 height: auto; 2094 aspect-ratio: var(--umg-mobile-aspect-ratio); 2095 } 2096 } 2097 2098 /* Caption alignment */ 2099 .caption-card .caption-inner { 2100 display: flex; 2101 height: 100%; 2102 width: 100%; 2103 } 2104 .caption-align--start .caption-inner { 2105 align-items: start; 2106 } 2107 .caption-align--center .caption-inner { 2108 align-items: center; 2109 } 2110 .caption-align--end .caption-inner { 2111 align-items: end; 2112 } 2113 .caption-align--stretch .caption-inner { 2114 align-items: stretch; 2115 } 2116 2117 /* Caption text alignment */ 2118 .caption-justify--start .caption-inner { 2119 justify-content: start; 2120 text-align: left; 2121 } 2122 .caption-justify--center .caption-inner { 2123 justify-content: center; 2124 text-align: center; 2125 } 2126 .caption-justify--end .caption-inner { 2127 justify-content: end; 2128 text-align: right; 2129 } 2130 2131 /* Extended interaction */ 2132 .caption-card.is-button .media { 2133 position: relative; 2134 } 2135 .caption-card.is-button .media::after { 2136 content: ''; 2137 position: absolute; 2138 inset: 0; 2139 z-index: 10; 2140 cursor: pointer; 2141 } 2142 `]),(0,o.C)([(0,a.M)()],f.prototype,"position",void 0),(0,o.C)([(0,a.M)()],f.prototype,"mobilePosition",void 0),(0,o.C)([(0,a.M)()],f.prototype,"align",void 0),(0,o.C)([(0,a.M)()],f.prototype,"justify",void 0),(0,o.C)([(0,a.M)()],f.prototype,"padding",void 0),(0,o.C)([(0,a.M)()],f.prototype,"mobilePadding",void 0),(0,o.C)([(0,a.M)()],f.prototype,"spacing",void 0),(0,o.C)([(0,a.M)({type:Boolean})],f.prototype,"colorBlend",void 0),(0,o.C)([(0,a.M)({type:Boolean})],f.prototype,"border",void 0),(0,o.C)([(0,n.w)()],f.prototype,"_mediaAspectRatio",void 0),(0,o.C)([(0,n.w)()],f.prototype,"_mobileMediaAspectRatio",void 0),(0,o.C)([(0,n.w)()],f.prototype,"_hasPopover",void 0),(0,o.C)([(0,n.w)()],f.prototype,"_cardPopover",void 0),(0,o.C)([(0,n.w)()],f.prototype,"_tabElements",void 0),f=(0,o.C)([(0,s.E)(`${y}-caption-card`)],f)},6235(t,e,i){var o=i(8472),r=i(2618),s=i(6505),a=i(9563),n=i(7509),l=i(3720),d=i(1145),c=i(9924),u=i(8698),m=i(2609),h=i(31);i(5421),i(4565);const p=r.AH` 2143 .modal { 2144 display: none; 2145 position: fixed; 2146 top: 0; 2147 left: 0; 2148 bottom: 0; 2149 width: 100%; 2150 z-index: 502; /* over sticky header option and overlay z-index */ 2151 color: var(--umg-color-modal-text, var(--umg-color-base-text, rgb(0,0,0))); 2152 background-color: var(--umg-color-modal-background, var(--umg-color-base-background, rgb(255,255,255))); 2153 background-image: var(--umg-image-modal-background); 2154 background-size: cover; 2155 background-repeat: no-repeat; 2156 } 2157 .modal::after { 2158 content: ''; 2159 position: absolute; 2160 inset: 0; 2161 z-index: -1; 2162 background-color: rgb(from var(--umg-color-modal-background) r g b / calc(alpha * var(--umg-opacity-modal-background, 1))); 2163 } 2164 2165 @supports (color: rgb(from white r g b)) { 2166 .modal { 2167 color: rgb(from var(--umg-color-modal-text, var(--umg-color-base-text, rgb(0,0,0))) r g b); 2168 background-color: rgb(from var(--umg-color-modal-background, var(--umg-color-base-background, rgb(255,255,255))) r g b / calc(alpha * var(--umg-opacity-modal-background, 1))); 2169 } 2170 } 2171
2172 .modal--visible { 2173 display: block; 2174 } 2175 2176 .modal__inner { 2177 display: flex; 2178 flex-direction: column; 2179 height: 100svh; 2180 overflow-y: scroll; 2181 overflow-x: hidden; 2182 } 2183 2184 @media screen and (min-width: 48.06) { 2185 .modal__inner::-webkit-scrollbar { 2186 width: 0.5rem; 2187 } 2188 .modal__inner::-webkit-scrollbar-track { 2189 background: var(--umg-color-modal-text, var(--umg-color-base-text, rgb(0,0,0,0.2))); 2190 } 2191 .modal__inner::-webkit-scrollbar-thumb{ 2192 background: var(--umg-color-modal-text, var(--umg-color-base-text, rgb(0,0,0,0.5))); 2193 } 2194 @supports (color: rgb(from white r g b)) { 2195 .modal__inner::-webkit-scrollbar-track { 2196 background: rgb(from var(--umg-color-modal-text, var(--umg-color-base-text, rgb(0,0,0))) r g b / 0.2); 2197 } 2198 .modal__inner::-webkit-scrollbar-thumb{ 2199 background: rgb(from var(--umg-color-modal-text, var(--umg-color-base-text, rgb(0,0,0))) r g b / 0.5); 2200 } 2201 } 2202 } 2203`,g=r.AH` 2204 .section__header { 2205 position: relative; 2206 display: flex; 2207 align-items: center; 2208 padding: var(--umg-space-16, 1rem) var(--umg-space-24, 1.5rem); 2209 line-height: 1; 2210 } 2211 2212 /* Sticky option */ 2213 .modal-header--sticky .section__header { 2214 position: sticky; 2215 top: 0; 2216 left: 0; 2217 z-index: 100; 2218 width: 100%; 2219 } 2220 2221 /* Center title */ 2222 .section__header .col { 2223 flex: 1; 2224 } 2225 .section__header .col:first-child { 2226 margin-right: auto; 2227 } 2228 .section__header .title { 2229 margin-left: auto; 2230 text-align: center; 2231 } 2232 .section__header .close-button { 2233 margin-left: auto; 2234 text-align: right; 2235 } 2236 2237 /* Icon position */ 2238 .modal-header-icon--left .section__header { 2239 flex-direction: row-reverse; 2240 } 2241 .modal-header-icon--left .section__header .col:first-child { 2242 margin-left: auto; 2243 } 2244 .modal-header-icon--left .section__header .col:last-child { 2245 margin-right: auto; 2246 text-align: left; 2247 } 2248 @media screen and (max-width: 48rem) { 2249 .section__header .title { 2250 text-align: left; 2251 }
2252 .modal-header-icon--left .section__header .title { 2253 text-align: right; 2254 } 2255 } 2256 2257 /* Mobile header */ 2258 @media screen and (max-width: 48rem) { 2259 .modal-header--sticky.modal-header-sticky--bottom .section__header { 2260 position: fixed; 2261 top: initial; 2262 bottom: 0; 2263 z-index: 100; 2264 width: 100%; 2265 } 2266 .section__header { 2267 padding: var(--umg-space-16); 2268 } 2269 .section__header .close-button { 2270 flex: 0; 2271 } 2272 .section__header .title { 2273 --umg-font-heading-scale: 0.6; 2274 } 2275 .section__header .col:first-child { 2276 display: none; 2277 } 2278 } 2279 2280 /** Header colour */ 2281 .section__header { 2282 color: var(--umg-color-modal-text, var(--umg-color-base-text)); 2283 background-color: var(--umg-color-modal-background, var(--umg-color-base-background)); 2284 --umg-color-base-text: var(--umg-color-modal-header-text, var(--umg-color-modal-text)); 2285 --umg-color-button-text: var(--umg-color-modal-header-background, var(--umg-color-base-background)); 2286 --umg-color-button-background: var(--umg-color-modal-header-text, var(--umg-color-modal-text, var(--umg-color-base-text))); 2287 --umg-color-icon-text: var(--umg-color-modal-header-text, , var(--umg-color-modal-text, var(--umg-color-base-text))); 2288 --umg-color-icon-border: var(--umg-color-modal-header-text, var(--umg-color-modal-text, var(--umg-color-base-text))); 2289 --umg-color-icon-background: transparent; 2290 } 2291 2292 @supports (color: rgb(from white r g b)) { 2293 .section__header { 2294 color: rgb(from var(--umg-color-modal-header-text, var(--umg-color-modal-text, var(--umg-color-base-text))) r g b); 2295 background-color: rgb(from var(--umg-color-modal-header-background, var(--umg-color-modal-background, var(--umg-color-base-background))) r g b / alpha); 2296 } 2297 } 2298`,b=r.AH` 2299.section { 2300 display: flex; 2301 flex: 1; 2302 flex-direction: column; 2303 margin: 0 auto; 2304 width: 100%; 2305} 2306 2307.section__inner { 2308 display: flex; 2309 flex-direction: column; 2310 justify-content: center; 2311 align-items: stretch; 2312 width: 100%; 2313 --umg-color-base-text: var(--umg-color-modal-text); 2314 --umg-color-section-background: transparent; 2315 --umg-color-button-text: var(--umg-color-modal-background, var(--umg-color-base-background)); 2316 --umg-color-button-background: var(--umg-color-modal-text, var(--umg-color-base-text)); 2317 --umg-color-icon-text: var(--umg-color-modal-text, var(--umg-color-base-text)); 2318 --umg-color-icon-border: var(--umg-color-modal-text, var(--umg-color-base-text)); 2319 --umg-color-icon-background: transparent; 2320} 2321 2322/* Vertical alignment */ 2323.content-justify--start { 2324 justify-content: start; 2325} 2326.content-justify--center { 2327 justify-content: center; 2328} 2329.content-justify--end { 2330 justify-content: end; 2331} 2332`,v=r.AH` 2333 2334 @media screen and (min-width: 48.06rem) { 2335 .desktop-title { 2336 display: block; 2337 } 2338 .mobile-title { 2339 display: none; 2340 } 2341 2342 } 2343 @media screen and (max-width: 48rem) { 2344 .desktop-title { 2345 display: none; 2346 } 2347 .mobile-title { 2348 display: block; 2349 } 2350 } 2351 2352 /* Maintain centred title */ 2353 .desktop-title, 2354 .mobile-title { 2355 text-align: center; 2356 } 2357`;i(8766);const{prefix:y}=u.W;let f=class extends r.WF{constructor(){super(...arguments),this.visible=!1,this.stickyHeader=!1,this.mobileStickyBottom=!1,this.contentWidth="page-width",this.paddingType="full-bleed",this.mobilePaddingType="full-bleed",this.icon="close",this.buttonPosition="right",this._ownsHistoryEntry=!1,this._ignorePopState=!1,this._handlePopState=()=>{this._ignorePopState?this._ignorePopState=!1:this.visible&&this._ownsHistoryEntry&&(this._ownsHistoryEntry=!1,this._closeModalUI())},this._handleKeyUp=t=>{"Escape"===t.key&&this._closeModal()},this.openModal=()=>{this._openModal()},this.closeModal=()=>{this._closeModal()},this._isNumeric=t=>("number"==typeof t||"string"==typeof t&&""!==t.trim())&&!isNaN(t)}connectedCallback(){window.addEventListener("keyup",this._handleKeyUp),window.addEventListener("popstate",this._handlePopState),super.connectedCallback()}disconnectedCallback(){window.removeEventListener("keyup",this._handleKeyUp),window.removeEventListener("popstate",this._handlePopState),super.disconnectedCallback()}_pushHistoryEntry(){this._ownsHistoryEntry||(window.history.pushState(window.history.state,""),this._ownsHistoryEntry=!0)}_closeModal(){if(!this.visible)return;const t=this._ownsHistoryEntry;this._ownsHistoryEntry=!1,this._closeModalUI(),t&&(this._ignorePopState=!0,window.history.back())}_closeModalUI(){if(!this.visible)return;this._releaseFocus(),this.visible=!1,document.body.removeAttribute("style");const t=new CustomEvent("close-modal",{bubbles:!0,composed:!0});this.dispatchEvent(t)}_openModal(){this.visible||(this._setTabbableElements(),this._setlastActiveElement(),this._trapFocus(),document.body.style.overflow="hidden",this.visible=!0,this._pushHistoryEntry())}_setTabbableElements(){this._tabbableElements||(this._tabbableElements=document.querySelectorAll("umg-header, umg-footer, umg-page, main"))}_setlastActiveElement(){const t=document.activeElement;t&&(this._lastActiveElement=t)}_trapFocus(){this._tabbableElements&&this._tabbableElements.length&&this._tabbableElements.forEac
2357h(t=>{t.setAttribute("inert","")})}_releaseFocus(){this._tabbableElements&&this._tabbableElements.length&&this._tabbableElements.forEach(t=>{t.removeAttribute("inert")}),this._lastActiveElement instanceof HTMLElement&&this._lastActiveElement.focus()}modalClasses(){let t={"modal--visible":this.visible,"modal-header--sticky":this.stickyHeader,"modal-header-sticky--bottom":this.mobileStickyBottom};return"left"===this.buttonPosition&&(t={...t,"modal-header-icon--left":!0}),t}sectionClasses(){let t={};return this.contentWidth&&!this._isNumeric(this.contentWidth)&&(t={...t,["section-inner--"+this.contentWidth]:!0}),this.justifyContent&&(t={...t,["content-justify--"+this.justifyContent]:!0}),t}sectionInnerStyles(){let t={};return this.contentWidth&&this._isNumeric(this.contentWidth)&&(t={...t,"--umg-size-content-max-width":Number(this.contentWidth)/16+"rem"}),this.maxScreenWidth&&(t={...t,"--umg-size-max-width":Number(this.maxScreenWidth)/16+"rem"}),t}render(){return r.qy` 2358 <div 2359 part="modal" 2360 class="modal${(0,l.H)(this.modalClasses())}" 2361 role="dialog" 2362 aria-labelledby="dialog-title" 2363 aria-modal="true" 2364 > 2365 <div part="modal-inner" class="modal__inner"> 2366 <header 2367 part="modal-header" 2368 class="section__header" 2369 > 2370 <div class="col"></div> 2371 <div 2372 part="modal-title" 2373 class="title col" 2374 > 2375 <slot name="title"></slot> 2376 </div> 2377 <div 2378 part="modal-close-button" 2379 class="close-button col" 2380 > 2381 <slot name="close-button"> 2382 <umg-button-icon 2383 part="modal-close-icon" 2384 exportparts="button-icon,icon-container,icon-svg,icon-image" 2385 class="close-modal" 2386 icon="${this.icon}" 2387 size="xlarge" 2388 padding="0" 2389 extendInteraction 2390 @click=${()=>{this._closeModal()}} 2391 > 2392 </umg-button-icon> 2393 </slot> 2394 </div> 2395 </header> 2396 <umg-section 2397 part="modal-section" 2398 exportparts="section" 2399 class="section${(0,l.H)(this.sectionClasses())}" 2400 > 2401 <umg-section-block 2402 part="modal-section-block" 2403 exportparts="section-block" 2404 class="section__inner" 2405 style="${(0,d.W)(this.sectionInnerStyles())}" 2406 paddingTop=${(0,h.J)(this.paddingTop)} 2407 paddingBottom=${(0,h.J)(this.paddingBottom)} 2408 mobilePaddingTop=${(0,h.J)(this.mobilePaddingTop)} 2409 mobilePaddingBottom=${(0,h.J)(this.mobilePaddingBottom)} 2410 paddingType=${this.paddingType} 2411 mobilePaddingType=${this.mobilePaddingType} 2412 width=${this.contentWidth} 2413 > 2414 <slot name="content"></slot> 2415 </umg-section-block> 2416 </umg-section> 2417 </div> 2418 </div> 2419 `}};f.styles=[c.S,p,g,b,v,r.AH` 2420 :host { 2421 display: block; 2422 } 2423 `],(0,o.C)([(0,a.M)({type:Boolean,reflect:!0})],f.prototype,"visible",void 0),(0,o.C)([(0,a.M)({reflect:!0,type:Boolean})],f.prototype,"stickyHeader",void 0),(0,o.C)([(0,a.M)({reflect:!0,type:Boolean})],f.prototype,"mobileStickyBottom",void 0),(0,o.C)([(0,a.M)()],f.prototype,"contentWidth",void 0),(0,o.C)([(0,a.M)({type:Number})],f.prototype,"maxScreenWidth",void 0),(0,o.C)([(0,a.M)()],f.prototype,"justifyContent",void 0),(0,o.C)([(0,a.M)()],f.prototype,"paddingType",void 0),(0,o.C)([(0,a.M)()],f.prototype,"mobilePaddingType",void 0),(0,o.C)([(0,a.M)()],f.prototype,"paddingTop",void 0),(0,o.C)([(0,a.M)()],f.prototype,"paddingBottom",void 0),(0,o.C)([(0,a.M)()],f.prototype,"mobilePaddingTop",void 0),(0,o.C)([(0,a.M)()],f.prototype,"mobilePaddingBottom",void 0),(0,o.C)([(0,a.M)()],f.prototype,"icon",void 0),(0,o.C)([(0,a.M)()],f.prototype,"buttonPosition",void 0),f=(0,o.C)([(0,s.E)(`${y}-media-modal`)],f);const{prefix:_}=u.W;let w=class extends r.WF{constructor(){super(),this.source="",this.title="",this.enableModal=!1,this.showButtonOnHover=!1,this._videoPlaying=!1,this._modalOpen=!1,this.addEventListener("open-modal",this.handleButtonClick),this.addEventListener("close-modal",this.handleButtonClick),this.addEventListener("media-details",this.eventNotifications)}async eventNotifications(t){"media-details"===t.type&&(t.detail.mediaAspectRatio&&(this._mediaAspectRatio=t.detail.mediaAspectRatio.toString()),(t.detail.mobileMediaAspectRatio||t.detail.mediaAspectRatio)&&(this._mobileMediaAspectRatio=t.detail.mobileMediaAspectRatio.toString()))}handleButtonClick(t){"open-modal"===t.type&&(this.enableModal?this._modalOpen=!0:this._videoPlaying=!0),"close-modal"===t.type&&(this._videoPlaying=!1,this._modalOpen=!1)}deferredMediaClasses(){return{"deferred-media":!0,"deferred-media--button-hover":this.showButtonOnHover}}deferredMediaStyles(){let t={};return this._mediaAspectRatio&&(t={...t,"--umg-aspect-ratio":this._mediaAspectRatio}),this._mobileMediaAspectRatio?t={...t,"--umg-mobile-aspect-ratio":this._mobileMediaAspectRatio}:this._mediaAspectRatio&&(t={...t,"--umg-mobile-aspect-ratio":this._mediaAspectRatio}),t}coverTemplate(){return r.qy` 2424 <slot name="image"></slot> 2425 <div class="deferred-media__play"> 2426 <slot name="media-play"> 2427 <umg-button-icon 2428 part="deferred-play-button" 2429 exportparts="button-icon,icon-container,icon-svg,icon-image" 2430 clickAction="open-modal" 2431 type="button" 2432 icon="play" 2433 size="3xlarge" 2434 label="Click to play a video" 2435 extendInteraction 2436 ?border=${!0} 2437 > 2438 </umg-button-icon> 2439 </slot> 2440 </div> 2441 `}createModal(){if(this.enableModal)return r.qy` 2442 <umg-media-modal 2443 part="media-modal" 2444 layout="single" 2445 ?visible=${this._modalOpen} 2446 > 2447 ${this.renderVideoInPopup()} 2448 </umg-media-modal> 2449 `}videoTemplate(){return r.qy` 2450 <div 2451 part="video-container" 2452 class="video-container" 2453 slot="content" 2454 > 2455 <iframe 2456 class="video-holder__item" 2457 src="${this.source}" 2458 title="${this.title}" 2459 allow="autoplay; fullscreen; picture-in-picture;" 2460 allowfullscreen 2461 ></iframe> 2462 </div> 2463 `}renderVideoInPopup(){if(this._modalOpen)return r.qy` 2464 ${this.videoTemplate()} 2465 `}renderVideoInBlock(){return r.qy` 2466 ${this._videoPlaying?this.videoTemplate():this.coverTemplate()} 2467 `}render(){return r.qy` 2468 <div 2469 part="deferred-media" 2470 class="${(0,l.H)(this.deferredMediaClasses())}" 2471 style="${(0,d.W)(this.deferredMediaStyles())}" 2472 ?enableModal=${this.enableModal} 2473 > 2474 <div class="deferred-media__image"> 2475 ${this.renderVideoInBlock()} 2476 </div> 2477 ${this.createModal()} 2478 </div> 2479 `}};w.styles=(0,m.Z)([c.S,r.AH` 2480 .deferred-media { 2481 width: 100%; 2482 } 2483 2484 /* Adapt banner to media height */ 2485 .deferred-media__image { 2486 position: relative; 2487 width: 100%; 2488 aspect-ratio: var(--umg-mobile-aspect-ratio); 2489 height: auto; 2490 } 2491 2492 @media only screen and (min-width: 30.06rem) { 2493 .deferred-media__image { 2494 aspect-ratio: var(--umg-aspect-ratio); 2495 } 2496 } 2497 2498 .deferred-media__play { 2499 position: absolute; 2500 inset: 0; 2501 display: flex; 2502 align-items: center; 2503 justify-content: center; 2504 z-index: 100; 2505 --umg-space-padding: 1.5rem; 2506 --umg-border-base-corner-radius: 3rem; 2507 } 2508 .video-container { 2509 height: 0; 2510 padding-bottom: 56.25%; 2511 position: relative; 2512 width: 100%; 2513 } 2514 .video-holder__item { 2515 border: 0; 2516 height: 100%; 2517 inset: 0; 2518 position: absolute; 2519 width: 100%; 2520 } 2521 .deferred-media--button-hover .deferred-media__play { 2522 opacity: 0; 2523 background-color: rgb(0,0,0,0.2); 2524 transition: opacity 0.3s; 2525 } 2526 .deferred-media--button-hover .deferred-media__play:hover { 2527 opacity: 1; 2528 } 2529 `]),(0,o.C)([(0,a.M)({type:String})],w.prototype,"source",void 0),(0,o.C)([(0,a.M)({type:String})],w.prototype,"title",void 0),(0,o.C)([(0,a.M)({type:Boolean})],w.prototype,"enableModal",void 0),(0,o.C)([(0,a.M)({type:Boolean})],w.prototype,"showButtonOnHover",void 0),(0,o.C)([(0,n.w)()],w.prototype,"_mediaAspectRatio",void 0),(0,o.C)([(0,n.w)()],w.prototype,"_mobileMediaAspectRatio",void 0),(0,o.C)([(0,n.w)()],w.prototype,"_videoPlaying",void 0),(0,o.C)([(0,n.w)()],w.prototype,"_modalOpen",void 0),w=(0,o.C)([(0,s.E)(`${_}-deferred-media`)],w)},5840(t,e,i){var o=i(8472),r=i(2618),s=i(6505),a=i(3720),n=i(1145),l=i(9563),d=i(1895);function c(t,e,i){return new Promise(o=>{if(i?.duration===1/0)throw new Error("Promise-based animations must be finite.");const r=t.animate(e,{...i,duration:u()?0:i.duration});r.addEventListener("cancel",o,{once:!0}),r.addEventListener("finish",o,{once:!0})})}function u(){return window.matchMedia("(prefers-reduced-motion: reduce)").matches}function m(t){return Promise.all(t.getAnimations().map(t=>new Promise(e=>{t.cancel(),requestAnimationFrame(e)})))}var h=i(9924),p=i(8698),g=i(2609);class b{constructor(){this.groups=new Map,this.hosts=new Set,this.groupsWithOpenDisclosures=new Set,this.outsideClickHandler=null}static getInstance(){return b.instance||(b.instance=new b),b.instance}hostConnected(){1===this.hosts.size&&this.setupGlobalListeners()}hostDisconnected(){1===this.hosts.size&&this.cleanupGlobalListeners()}addHost(t){this.hosts.add(t),t.addController(this)}removeHost(t){this.hosts.delete(t),t.removeController?.(this)}registerDisclosure(t,e){let i=this.groups.get(e);i||(i={disclosures:new Set,policy:{mode:"exclusive"}},this.groups.set(e,i)),i.disclosures.add(t),this.requestUpdateAll()}unregisterDisclosure(t,e){const i=this.groups.get(e);i&&(i.disclosures.delete(t),0===i.disclosures.size&&(this.groups.delete(e),this.groupsWithOpenDisclosures.delete(e)),this.requestUpdateAll())}async notifyDisclosureOpening(t,e){const i=this.groups.get(e);if(!i)return;const o=[];
2529if("exclusive"===i.policy.mode)i.disclosures.forEach(e=>{e!==t&&e.getDisclosureOpenState()&&o.push(e.disclosureClose())});else if("multi-select"===i.policy.mode&&i.policy.maxOpen){const t=Array.from(i.disclosures).filter(t=>t.getDisclosureOpenState());t.length>=i.policy.maxOpen&&o.push(t[0].disclosureClose())}await Promise.all(o),this.setupOutsideClickListener(e),this.requestUpdateAll()}notifyDisclosureClosing(t,e){const i=this.groups.get(e);if(!i)return;Array.from(i.disclosures).some(t=>t.getDisclosureOpenState())||this.cleanupOutsideClickListener(e),this.requestUpdateAll()}setGroupPolicy(t,e){const i=this.groups.get(t);i?i.policy=e:this.groups.set(t,{disclosures:new Set,policy:e}),this.requestUpdateAll()}getGroupDisclosures(t){return this.groups.get(t)?.disclosures}closeAllInGroup(t){const e=this.groups.get(t);e&&(e.disclosures.forEach(t=>{t.getDisclosureOpenState()&&t.disclosureClose()}),this.cleanupOutsideClickListener(t),this.requestUpdateAll())}getGroupStats(t){const e=this.groups.get(t);if(!e)return null;return{total:e.disclosures.size,open:Array.from(e.disclosures).filter(t=>t.getDisclosureOpenState()).length}}hasGroup(t){return this.groups.has(t)}requestUpdateAll(){this.hosts.forEach(t=>{t.requestUpdate()})}setupOutsideClickListener(t){this.groupsWithOpenDisclosures.has(t)||(this.groupsWithOpenDisclosures.add(t),1!==this.groupsWithOpenDisclosures.size||this.outsideClickHandler||(this.outsideClickHandler=this._handleOutsideClick.bind(this),window.addEventListener("click",this.outsideClickHandler,!0)))}cleanupOutsideClickListener(t){this.groupsWithOpenDisclosures.delete(t),0===this.groupsWithOpenDisclosures.size&&this.outsideClickHandler&&(window.removeEventListener("click",this.outsideClickHandler,!0),this.outsideClickHandler=null)}_handleOutsideClick(t){this.groupsWithOpenDisclosures.forEach(e=>{const i=this.groups.get(e);if(i){Array.from(i.disclosures).some(e=>t.composedPath().includes(e)||e.contains(t.target))||this.closeAllInGroup(e)}})}setupGlobalListeners(){}cleanupGlobalListeners(){this.outsideClickHandler&&(window.removeEventListener("click",this.outsideClickHandler,!0),this.outsideClickHandler=null),this.groupsWithOpenDisclosures.clear()}}const{prefix:v}=p.W;let y=class extends r.WF{constructor(){super(...arguments),this.direction="down",this.mobileDirectionInverse=!1,this.overlay=!1,this.summaryWidth="fit-content",this.detailsWidth="fit-content",this.justify="start",this.iconPosition="right",this.iconAnimation="flip",this.border=!1,this.open=!1,this.controller=b.getInstance(),this.isAnimating=!1,this.lastInteractionWasKeyboard=!1,this.disclosureOpen=async()=>{for(this.open=!0,await new Promise(t=>{requestAnimationFrame(()=>t())});this.isAnimating;)await new Promise(t=>{requestAnimationFrame(()=>t())})},this.disclosureClose=async()=>{for(this.open=!1,await new Promise(t=>{requestAnimationFrame(()=>t())});this.isAnimating;)await new Promise(t=>{requestAnimationFrame(()=>t())})},this.getDisclosureOpenState=()=>this.open,this._handleKeyDown=()=>{this.lastInteractionWasKeyboard=!0},this._handleMouseDown=()=>{this.lastInteractionWasKeyboard=!1},this._handleTouchStart=()=>{this.lastInteractionWasKeyboard=!1}}connectedCallback(){super.connectedCallback(),this.groupId&&(this.controller.addHost(this),this._registerWithGroup()),document.addEventListener("keydown",this._handleKeyDown,!0),document.addEventListener("mousedown",this._handleMouseDown,!0),document.addEventListener("touchstart",this._handleTouchStart,!0)}disconnectedCallback(){super.disconnectedCallback(),this.currentGroupId&&this.controller.unregisterDisclosure(this,this.currentGroupId),this.groupId&&this.controller.removeHost(this),document.removeEventListener("keydown",this._handleKeyDown,!0),document.removeEventListener("mousedown",this._handleMouseDown,!0),document.removeEventListener("touchstart",this._handleTouchStart,!0),this.currentGroupId=void 0}_registerWithGroup(){this.groupId&&(this.currentGroupId=this.groupId,this.controller.registerDisclosure(this,this.groupId))}_handleGroupIdChange(){this.currentGroupId&&(this.controller.unregisterDisclosure(this,this.currentGroupId),this.currentGroupId=void 0),this.groupId?(this.controller.addHost(this),this._registerWithGroup()):this.controller.removeHost(this)}async firstUpdated(){this.open&&this._detailsContent?(this._detailsContent.style.height="0",this._detailsContent.style.overflowY="hidden",await new Promise(t=>{requestAnimationFrame(()=>{requestAnimationFrame(()=>{t()})})}),this.open&&this._detailsContent&&await this._startOpeningAnimation()):this._detailsContent&&(this._detailsContent.style.overflowY="hidden")}async _startOpeningAnimation(){if(!this._drawer||!this._detailsContent)return;if(await m(this._detailsContent),this._details.setAttribute("open",""),this._detailsContent.style.height="0",this._detailsContent.style.opacity="0",this._detailsContent.style.overflowY="hidden",await new Promise(t=>{requestAnimationFrame(()=>{requestAnimationFrame(()=>{t()})})}),!this.open||!this._detailsContent)return void(this.isAnimating=!1);const t=[{height:"0",opacity:"0"},{height:`${this._detailsContent.scrollHeight}px`,opacity:"1"}];await c(this._detailsContent,t,{duration:100,easing:"linear"}),this._detailsContent.style.height="auto",this._detailsContent.style.opacity="1",this._detailsContent.style.overflowY="auto",this.isAnimating=!1}async _startClosingAnimation(){if(!this._drawer||!this._detailsContent)return;await m(this._detailsContent);const t=this._detailsContent.scrollHeight;this._detailsContent.style.height=`${t}px`,this._detailsContent.style.overflowY="auto",await new Promise(t=>{requestAnimationFrame(()=>t())});const e=[{height:`${t}px`,opacity:"1"},{height:"0",opacity:"0"}];await c(this._detailsContent,e,{duration:200,easing:"linear"}),this._detailsContent.style.height="0",this._detailsContent.style.opacity="0",this._detailsContent.style.overflowY="hidden",this._details.removeAttribute("open"),this.isAnimating=!1}updated(t){if(t.has("groupId")&&this._handleGroupIdChange(),t.has("open"))if(this.open?this._details.setAttribute("open",""):this._details.removeAttribute("open"),!0===this.open){if(this.isAnimating)return;this.isAnimating=!0,this.currentGroupId?this.controller.notifyDisclosureOpening(this,this.currentGroupId).then(()=>{this.open?this._startOpeningAnimation():this.isAnimating=!1}):this._startOpeningAnimation(),this.dispatchEvent(new CustomEvent("umg-disclosure:opened",{detail:{target:this},bubbles:!0,composed:!0}))}else if(!1===this.open){if(this.isAnimating)return;this.isAnimating=!0,this.currentGroupId&&this.controller.notifyDisclosureClosing(this,this.currentGroupId),this._startClosingAnimation(),this.dispatchEvent(new CustomEvent("umg-disclosure:closed",{detail:{target:this},bubbles:!0,composed:!0}))}}_summaryClick(t){t.preventDefault(),this.open=!this.open}summaryClasses(){const t={};
2529return t["disclosure__summary--icon-"+this.iconAnimation]=!0,t["disclosure__summary--justify-"+this.justify]=!0,t["disclosure__summary--"+this.summaryWidth]=!0,t["disclosure__summary--icon-position-"+this.iconPosition]=!0,t}drawerClasses(){const t={};return t["disclosure__drawer--overlay"]=this.overlay,t["disclosure__drawer--"+this.detailsWidth]=!0,this.align&&(t[`disclosure__drawer--align-${this.align}`]=!0),t}drawerStyles(){let t={},e=100;return"down"!==this.direction&&"from-left"!==this.direction||(e=-100),t={...t,"--umg-animation-disclosure-origin":e+"%"},t=this.mobileDirectionInverse?{...t,"--umg-animation-disclosure-origin-mobile":-1*e+"%"}:{...t,"--umg-animation-disclosure-origin-mobile":e+"%"},t}contentClasses(){const t={};return t["disclosure__content--border"]=this.border,"from-left"===this.direction||"from-right"===this.direction?t["open--horizontal"]=!0:"up"!==this.direction&&"down"!==this.direction||(t["open--vertical"]=!0),t}_handleFocusIn(t){if(this.lastInteractionWasKeyboard){t.composedPath()[1].classList.add("focus-visible")}}_handleFocusOut(t){t.composedPath()[1].classList.remove("focus-visible")}render(){const t="pin-left"===this.iconPosition&&"center"===this.justify||"pin-right"===this.iconPosition&&"center"===this.justify?r.qy`<div class="summary-centering-pin"></div>`:r.s6;return r.qy` 2530 <details 2531 part="disclosure" 2532 class="disclosure__details" 2533 @focusin=${this._handleFocusIn} 2534 @focusout=${this._handleFocusOut} 2535 > 2536 <summary 2537 part="disclosure-summary" 2538 class="disclosure__summary${(0,a.H)(this.summaryClasses())}" 2539 aria-label="Main Menu" 2540 role="button" 2541 aria-expanded=${this.open} 2542 @click=${this._summaryClick} 2543 > 2544 <div class="disclosure__summary-content"> 2545 ${t} 2546 <div class="summary__content"> 2547 <slot name="summary"></slot> 2548 </div> 2549 <div class="summary__icon"> 2550 <slot name="icon"></slot> 2551 </div> 2552 </div> 2553 </summary> 2554 <div 2555 part="disclosure-drawer" 2556 class="disclosure__drawer${(0,a.H)(this.drawerClasses())}" 2557 style="${(0,n.W)(this.drawerStyles())}" 2558 aria-hidden=${!this.open} 2559 > 2560 <div 2561 part="disclosure-content" 2562 class="disclosure__content${(0,a.H)(this.contentClasses())}" 2563 aria-hidden=${!this.open} 2564 > 2565 <slot name="content"></slot> 2566 </div> 2567 </div> 2568 </details> 2569 `}};y.styles=(0,g.Z)([h.S,r.AH` 2570 :host { 2571 display: block; 2572 } 2573 2574 :host([overlay]) { 2575 position: relative; 2576 } 2577 2578 ::slotted(*[slot=summary]) { 2579 flex: 0 1 auto; 2580 } 2581 2582 ::slotted(*[slot=icon]) { 2583 transition: transform 0.2s ease; 2584 } 2585 2586 .disclosure__details { 2587 overflow: hidden; 2588 border-style: solid; 2589 border-radius: var(--umg-border-disclosure-corner-radius, 0); 2590 border-width: var(--umg-border-disclosure-width, 0.0625em); 2591 border-color: rgb(from var(--umg-color-disclosure-border, rgb(0, 0, 0, 0)) r g b / alpha); 2592 padding: var(--umg-space-disclosure-padding, 0.5rem); 2593 } 2594 2595 /** Summary */ 2596 .disclosure__details summary::-webkit-details-marker { 2597 display:none; 2598 } 2599 2600 .disclosure__summary { 2601 cursor: pointer; 2602 list-style: none; 2603 padding: var(--umg-space-summary-padding, 0.5rem); 2604 color: rgb(from var(--umg-color-summary-text, var(--umg-color-base-text, rgb(0,0,0))) r g b); 2605 background-color: rgb(from var(--umg-color-summary-background, var(--umg-color-base-background, rgb(255, 255, 255))) r g b / alpha); 2606 border-style: solid; 2607 border-width: var(--umg-border-summary-width, 0.0625em); 2608 border-color: rgb(from var(--umg-color-summary-border, rgb(0,0,0,0)) r g b / alpha); 2609 border-radius: var(--umg-border-base-corner-radius, 0); 2610 --umg-color-base-text: var(--umg-color-summary-text, inherit); 2611 } 2612 2613 .disclosure__summary-content { 2614 display: flex; 2615 align-items: center; 2616 justify-content: start; 2617 gap: var(--umg-space-8, 0.5rem); 2618 } 2619 2620 /** Summary width */ 2621 .disclosure__summary--fit-content { 2622 width: fit-content; 2623 } 2624 2625 .disclosure__summary--fill { 2626 width: 100%; 2627 } 2628 2629 /** Summary content alignment */ 2630 .disclosure__summary--justify-start .disclosure__summary-content { 2631 justify-content: start; 2632 } 2633 2634 .disclosure__summary--justify-center .disclosure__summary-content { 2635 justify-content: center; 2636 } 2637 2638 .disclosure__summary--justify-end .disclosure__summary-content { 2639 justify-content: end; 2640 } 2641 2642 /* Summary icon position */ 2643 .disclosure__summary--icon-position-left .disclosure__summary-content, 2644 .disclosure__summary--icon-position-pin-left .disclosure__summary-content { 2645 flex-direction: row-reverse; 2646 } 2647 2648 .disclosure__summary--icon-position-pin-right .summary-centering-pin { 2649 flex: 1; 2650 margin-right: auto; 2651 } 2652 2653 .disclosure__summary--icon-position-pin-left .summary-centering-pin { 2654 flex: 1; 2655 margin-left: auto; 2656 } 2657 2658 /* Icon pinned Left */ 2659 .disclosure__summary--icon-position-pin-left .summary__icon { 2660 flex: 1; 2661 margin-right: auto; 2662 } 2663 2664 .disclosure__summary--icon-position-pin-left.disclosure__summary--justify-start .summary__icon { 2665 flex: 0; 2666 margin-right: unset; 2667 } 2668 2669 .disclosure__summary--icon-position-pin-left.disclosure__summary--justify-center .summary__content, 2670 .disclosure__summary--icon-position-pin-right.disclosure__summary--justify-center .summary__content { 2671 flex: 0 0 auto; 2672 margin-left: auto; 2673 margin-right: auto; 2674 } 2675 2676 /* Icon pinned Right */ 2677 .disclosure__summary--icon-position-pin-right .disclosure__summary-content .summary__icon { 2678 flex: 1; 2679 margin-left: auto; 2680 } 2681 2682 .disclosure__summary--icon-position-pin-right .disclosure__summary-content .summary__icon ::slotted(*[slot=icon]) { 2683 display: block; 2684 width: fit-content; 2685 margin-left: auto; 2686 } 2687 2688 .disclosure__summary--icon-position-pin-right.disclosure__summary--justify-end .summary__icon { 2689 flex: 0 0 auto; 2690 margin-left: unset; 2691 } 2692 2693 /** Drawer */ 2694 .disclosure__drawer { 2695 min-width: fit-content; 2696 overflow: hidden; 2697 } 2698
2699 .disclosure__drawer:not(.disclosure__drawer--overlay) { 2700 margin-top: var(--umg-space-disclosure-distance, 1rem) 2701 } 2702 2703 .disclosure__drawer--overlay { 2704 position: absolute; 2705 top: var(--umg-space-disclosure-distance, 2.5rem); 2706 left: 0; 2707 z-index: 200; 2708 } 2709 2710 .disclosure__drawer--overlay.disclosure__drawer--align-left { 2711 left: -0.5rem 2712 } 2713 2714 .disclosure__drawer--overlay.disclosure__drawer--align-right { 2715 left: auto; 2716 right: -0.5rem 2717 } 2718 2719 @media screen and (min-width: 48.06rem) { 2720 .disclosure__drawer--overlay.disclosure__drawer--align-right:not(.disclosure__drawer--fill) .disclosure__content { 2721 box-shadow: -0.250rem 0.250rem 0.5rem 0 rgb(from var(--umg-color-base-shadow, rgb(0,0,0,0)) r g b / alpha); 2722 margin: 0 0 0.750rem 0.750rem; 2723 } 2724 } 2725 2726 @media screen and (min-width: 48.06rem) { 2727 .disclosure__drawer--overlay.disclosure__drawer--align-left:not(.disclosure__drawer--fill) .disclosure__content { 2728 box-shadow: 0.250rem 0.250rem 0.5rem 0 rgb(from var(--umg-color-base-sh
2728adow, rgb(0,0,0,0)) r g b / alpha); 2729 margin: 0 0.750rem 0.750rem 0; 2730 } 2731 } 2732 2733 .disclosure__drawer--fill.disclosure__drawer--overlay { 2734 right: 0; 2735 } 2736 2737 .disclosure__drawer--fit-content { 2738 width: fit-content; 2739 } 2740 .disclosure__drawer--fill { 2741 width: 100%; 2742 } 2743 .disclosure__drawer--auto { 2744 width: auto; 2745 } 2746 2747 /* Disclosure content */ 2748 .disclosure__content { 2749 border-radius: var(--umg-border-base-corner-radius); 2750 overflow: hidden; 2751 border-style: solid; 2752 border-width: var(--umg-border-details-width, 0.0625em); 2753 border-color: rgb(from var(--umg-color-details-border, var(--umg-color-base-border, rgb(0,0,0,0))) r g b / alpha); 2754 padding: var(--umg-space-details-padding, 0.5rem); 2755 color: rgb(from var(--umg-color-details-text, var(--umg-color-base-text, rgb(0,0,0))) r g b); 2756 background-color: rgb(from var(--umg-color-details-background, var(--umg-color-base-background, rgb(255, 255, 255))) r g b); 2757 height: 0; 2758 min-height: 0; 2759 2760 --umg-color-base-text: var(--umg-color-details-text); 2761 --umg-color-base-background: var(--umg-color-details-background); 2762 } 2763 2764 2765 /* Toggle state */ 2766 .disclosure__details[open] .disclosure__summary--icon-flip ::slotted(*[slot=icon]) { 2767 transform: rotate(180deg); 2768 } 2769 2770 /* Content overflow scrollbar */ 2771 .disclosure__content::-webkit-scrollbar {
2772 width: 0.125rem; 2773 } 2774 .disclosure__content::-webkit-scrollbar-track { 2775 background: var(--umg-color-base-text, rgb(0,0,0,0.05)); 2776 border-radius: var(--umg-border-radius-30); 2777 } 2778 .disclosure__content::-webkit-scrollbar-thumb { 2779 background: var(--umg-color-base-text, rgb(0,0,0,0.1)); 2780 border-radius: var(--umg-border-radius-30); 2781 } 2782 @supports (color: rgb(from white r g b)) { 2783 .disclosure__content::-webkit-scrollbar-track { 2784 background: rgb(from var(--umg-color-base-text, rgb(0,0,0,0.05)) r g b / 0.05); 2785 } 2786 .disclosure__content::-webkit-scrollbar-thumb { 2787 background: rgb(from var(--umg-color-base-text, rgb(0,0,0,0.1)) r g b / 0.1); 2788 } 2789 } 2790 `]),(0,o.C)([(0,l.M)()],y.prototype,"direction",void 0),(0,o.C)([(0,l.M)({type:Boolean})],y.prototype,"mobileDirectionInverse",void 0),(0,o.C)([(0,l.M)({type:Boolean})],y.prototype,"overlay",void 0),(0,o.C)([(0,l.M)()],y.prototype,"summaryWidth",void 0),(0,o.C)([(0,l.M)()],y.prototype,"detailsWidth",void 0),(0,o.C)([(0,l.M)()],y.prototype,"justify",void 0),(0,o.C)([(0,l.M)()],y.prototype,"iconPosition",void 0),(0,o.C)([(0,l.M)()],y.prototype,"iconAnimation",void 0),(0,o.C)([(0,l.M)({type:Boolean})],y.prototype,"border",void 0),(0,o.C)([(0,l.M)()],y.prototype,"align",void 0),(0,o.C)([(0,l.M)({type:Boolean,reflect:!0})],y.prototype,"open",void 0),(0,o.C)([(0,l.M)()],y.prototype,"groupId",void 0),(0,o.C)([(0,d.P)("summary")],y.prototype,"_summary",void 0),(0,o.C)([(0,d.P)("details")],y.prototype,"_details",void 0),(0,o.C)([(0,d.P)(".disclosure__content")],y.prototype,"_detailsContent",void 0),(0,o.C)([(0,d.P)(".disclosure__drawer")],y.prototype,"_drawer",void 0),y=(0,o.C)([(0,s.E)(`${v}-disclosure`)],y)},1849(t,e,i){var o=i(8472),r=i(2618),s=i(6505),a=i(9563),n=i(3720),l=i(1145),d=i(31),c=i(9924),u=i(8698),m=i(2609),h=i(7621);class p{constructor(t,...e){this.slotNames=[],this.handleSlotChange=t=>{const e=t.target;(this.slotNames.includes("[default]")&&!e.name||e.name&&this.slotNames.includes(e.name))&&this.host.requestUpdate()},(this.host=t).addController(this),this.slotNames=e}hasDefaultSlot(){return[...this.host.childNodes].some(t=>
2790{if(t.nodeType===t.TEXT_NODE&&""!==t.textContent.trim())return!0;if(t.nodeType===t.ELEMENT_NODE){const e=t;if("umg-visually-hidden"===e.tagName.toLowerCase())return!1;if(!e.hasAttribute("slot"))return!0}return!1})}hasNamedSlot(t){return null!==this.host.querySelector(`:scope > [slot="${t}"]`)}test(t){return"[default]"===t?this.hasDefaultSlot():this.hasNamedSlot(t)}hostConnected(){this.host.shadowRoot.addEventListener("slotchange",this.handleSlotChange)}hostDisconnected(){this.host.shadowRoot.removeEventListener("slotchange",this.handleSlotChange)}}i(9976),i(5840),i(4630);const{prefix:g}=u.W;let b=class extends r.WF{constructor(){super(...arguments),this.as="table",this.ticketsAs="list",this.ticketsLabel="Tickets",this.divider=!1,this.centerContent=!1,this.mobileCenterContent=!1,this.hasSlotController=new p(this,"ticket-links","link","rsvp-link")}itemClasses(){return{"event-table__item--divider":this.divider,"event-table--grid":"grid"===this.as,"event-table--center-content":this.centerContent,"event-table-center-content":this.mobileCenterContent}}ticketDropdownClasses(){return{"event-table__ticket-dropdown":!0,"event-table__ticket-dropdown--floating":"floating-dropdown"===this.ticketsAs,"event-table__ticket-dropdown--inline":"inline-dropdown"===this.ticketsAs}}render(){const t=this.hasSlotController.test("link"),e=this.hasSlotController.test("ticket-links"),i=this.hasSlotController.test("rsvp-link");return r.qy` 2791 <div 2792 part="event-item" 2793 class="event-table__item${(0,n.H)(this.itemClasses())}" 2794 role="row" 2795 > 2796 <div 2797 part="event-date" 2798 class="event-table__date" 2799 > 2800 <slot name="date"></slot> 2801 </div> 2802 <div 2803 part="event-content" 2804 class="event-table__content" 2805 > 2806 <slot name="content"></slot> 2807 </div> 2808 ${t?r.qy`<div part="event-link"class="event-table__single-link"><slot name="link"></slot></div>`:r.s6} 2809 ${i?r.qy`<div part="event-rsvp"class="event-table__rsvp-link"><slot name="rsvp-link"></slot></div>`:r.s6} 2810 ${e?r.qy`<div part="event-links"class="event-table__ticket-list">${"list"===this.ticketsAs?r.qy` 2811 <umg-button-group 2812 part="event-links" 2813 exportparts="link-group" 2814 class="event-table__ticket-list" 2815 spacing="none" 2816 justify="${this.centerContent?"center":""}" 2817 > 2818 <slot name="ticket-links"></slot> 2819 </umg-button-group> 2820 `:"floating-dropdown"===this.ticketsAs||"inline-dropdown"===this.ticketsAs?r.qy` 2821 <umg-disclosure 2822 part="event-ticket-dropdown" 2823 class=${(0,n.H)(this.ticketDropdownClasses())} 2824 groupId="event-table-ticket-dropdown" 2825 summaryWidth="match-details" 2826 detailsWidth="fill" 2827 justify="center" 2828 iconPosition="pin-right" 2829 > 2830 <div slot="summary"> 2831 <umg-text 2832 as="span" 2833 variant="bodySm" 2834 fontWeight="medium" 2835 spacing="loose" 2836 > 2837 ${this.ticketsLabel} 2838 </umg-text> 2839 </div> 2840 <umg-icon 2841 slot="icon" 2842 icon="chevron-down" 2843 size="xsmall" 2844 > 2845 </umg-icon> 2846 <umg-button-group slot="content" spacing="none" stack> 2847 <slot name="ticket-links"></slot> 2848 </umg-button-group> 2849 </umg-disclosure> 2850 `:r.s6}</div>`:r.s6} 2851 </div> 2852 `}};b.styles=(0,m.Z)([c.S,r.AH` 2853 .event-table__item { 2854 display: flex; 2855 gap: var(--umg-space-event-table-gap, 1rem); 2856 width: 100%; 2857 height: 100%; 2858 } 2859 @media only screen and (max-width: 48rem) { 2860 .event-table__item { 2861 flex-direction: column; 2862 gap: var(--umg-space-event-table-mobile-gap, 0.5rem); 2863 } 2864 } 2865 2866 /* Grid layout */ 2867 .event-table__item.event-table--grid { 2868 gap: var(--umg-space-event-table-grid-gap, 0.75rem); 2869 flex-direction: column; 2870 justify-content: stretch; 2871 } 2872 2873 .event-table--grid.event-table--center-content { 2874 text-align: center; 2875 } 2876 2877 /* Content */ 2878 .event-table__content { 2879 flex: 1 0 auto; 2880 } 2881 2882 .event-table__rsvp-link { 2883 flex: 0; 2884 min-width: var(--umg-size-buttons-width, 12rem); 2885 } 2886 2887 .event-table__single-link { 2888 display: flex; 2889 flex: 0; 2890 gap: var(--umg-space-event-links-gap, 1rem); 2891 } 2892 2893 .event-table__ticket-list { 2894 flex: 0; 2895 position: relative; 2896 min-width: var(--umg-size-buttons-width, 12rem); 2897 } 2898 2899 .event-table__ticket-dropdown { 2900 --umg-space-disclosure-distance: 0; 2901 --umg-color-base-border: transparent; 2902 min-width: var(--umg-size-buttons-width, 12rem); 2903 } 2904 2905 .event-table--grid .event-table__rsvp-link, 2906 .event-table--grid .event-table__ticket-list, 2907 .event-table__ticket-dropdown { 2908 min-width: 100%; 2909 } 2910 2911 .event-table__item.event-table--grid .event-table__ticket-dropdown--floating { 2912 position: absolute; 2913 top: 0; 2914 right: 0; 2915 left: 0; 2916 z-index: 1; 2917 } 2918 .event-table__item.event-table--grid .event-table__ticket-dropdown--floating[open] { 2919 z-index: 2; 2920 } 2921 2922 @media (min-width: 48rem) { 2923 .event-table__ticket-dropdown--floating { 2924 position: absolute; 2925 top: 0; 2926 right: 0; 2927 left: 0; 2928 z-index: 1; 2929 } 2930 .event-table__ticket-dropdown--floating[open] { 2931 z-index: 2; 2932 } 2933 } 2934 2935 @media (max-width: 47.99rem) { 2936 .event-table__rsvp-link { 2937 margin-top: var(--umg-space-16, 1rem); 2938 } 2939 } 2940 2941 /* Divider */ 2942 .event-table__item--divider { 2943 border-bottom: 1px solid var(--umg-color-event-divider, var(--umg-color-section-text, rgb(180,180,180, var(--umg-opacity-divider-bg, 1)))); 2944 padding-bottom: var(--umg-space-grid-vertical-desktop, 1.5rem); 2945 } 2946 2947 .event-table__item--divider.event-table__grid { 2948 border-left: 1px solid var(--umg-color-event-divider, var(--umg-color-section-text, rgb(180,180,180, var(--umg-opacity-divider-bg, 1)))); 2949 padding-left: var(--umg-space-20, 1.25rem); 2950 } 2951 @media only screen and (max-width: 48rem) { 2952 .event-table__item--divider { 2953 padding-bottom: var(--umg-space-grid-vertical-mobile, 0.5rem); 2954 } 2955 } 2956 `]),(0,o.C)([(0,h.MZ)()],b.prototype,"as",void 0),(0,o.C)([(0,h.MZ)()],b.prototype,"ticketsAs",void 0),(0,o.C)([(0,h.MZ)()],b.prototype,"ticketsLabel",void 0),(0,o.C)([(0,h.MZ)({type:Boolean})],b.prototype,"divider",void 0),(0,o.C)([(0,h.MZ)({type:Boolean})],b.prototype,"centerContent",void 0),(0,o.C)([(0,h.MZ)({type:Boolean})],b.prototype,"mobileCenterContent",void 0),b=(0,o.C)([(0,s.E)(`${g}-event`)],b);i(4742);const{prefix:v}=u.W;let y=class extends r.WF{constructor(){super(...arguments),this.as="table",this.divider=!1,this.gridColumns=4,this.mobileGridColumns=1,this.fill=!1}tableClasses(){return{"event-table--divider":this.divider}}tableStyles(){let t={};return this.spacing&&(t={...t,"--umg-space-grid-horizontal-desktop":Number(this.spacing)/16+"rem","--umg-space-grid-vertical-desktop":Number(this.spacing)/16+"rem"}),this.mobileSpacing?t={...t,"--umg-space-grid-horizontal-mobile":Number(this.mobileSpacing)/16+"rem","--umg-space-grid-vertical-mobile":Number(this.mobileSpacing)/16+"rem"}:this.spacing&&(t={...t,"--umg-space-grid-horizontal-mobile":Number(this.spacing)/16+"rem","--umg-space-grid-vertical-mobile":Number(this.spacing)/16+"rem"}),t}tableAs(){return"grid"===this.as?r.qy` 2957 <umg-grid 2958 part="event-table" 2959 exportparts="grid" 2960 class="event-table${(0,n.H)(this.tableClasses())}" 2961 role="table" 2962 aria-label="Events" 2963 columns=${this.gridColumns} 2964 mobileColumns=${this.mobileGridColumns} 2965 spacing=${(0,d.J)(this.spacing)} 2966 mobileSpacing=${(0,d.J)(this.mobileSpacing)} 2967 ?fill=${this.fill} 2968 > 2969 <slot name="event"></slot> 2970 </umg-grid> 2971 `:"table"===this.as?r.qy` 2972 <umg-grid 2973 part="event-table" 2974 exportparts="grid" 2975 class="event-table${(0,n.H)(this.tableClasses())}" 2976 style="${(0,l.W)(this.tableStyles())}" 2977 role="table" 2978 aria-label="Events" 2979 columns=${1} 2980 mobileColumns=${1} 2981 ?fill=${!1} 2982 spacing=${(0,d.J)(this.spacing)} 2983 mobileSpacing=${(0,d.J)(this.mobileSpacing)} 2984 > 2985 <slot name="event"></slot> 2986 </umg-grid> 2987 `:void 0}render(){return r.qy` 2988 ${this.tableAs()} 2989 `}};y.styles=(0,m.Z)([c.S,r.AH` 2990 :host { 2991 display: block; 2992 width: 100%; 2993 2994 --umg-space-group: var(--umg-button-group-gap-y, 0.0625rem); 2995 --umg-size-buttons-width: var(--umg-dropdown-width 12rem); 2996 --umg-color-summary-background: var(--umg-dropdown-button-background, rgb(0, 0, 0)); 2997 --umg-color-summary-text: var(--umg-dropdown-button-color, rgb(255, 255, 255)); 2998 --umg-color-disclosure-border: var(--umg-dropdown-border-color, rgb(0, 0, 0)); 2999 --umg-border-disclosure-corner-radius: var(--umg-dropdown-border-radius, 0); 3000 --umg-space-disclosure-padding: var(--umg-dropdown-container-padding, 0); 3001 --umg-space-summary-padding: var(--umg-dropdown-button-padding, 0.5rem 1rem); 3002 --umg-space-details-padding: var(--umg-dropdown-content-padding, 0.0625rem 0 0 0); 3003 --umg-border-details-width: var(--umg-dropdown-content-border-width, 0); 3004 3005 } 3006 .event-table--divider { 3007 border-top: 1px solid var(--umg-color-event-divider, var(--umg-color-section-text, rgb(180,180,180, var(--umg-opacity-divider-bg, 1)))); 3008 padding-top: var(--umg-space-grid-vertical-desktop, 1rem); 3009 } 3010 3011 /* Rows */ 3012 .event-table { 3013 color: inherit; 3014 width: 100%; 3015 } 3016 3017 `]),(0,o.C)([(0,a.M)()],y.prototype,"as",void 0),(0,o.C)([(0,a.M)({type:Boolean})],y.prototype,"divider",void 0),(0,o.C)([(0,a.M)({type:Number})],y.prototype,"gridColumns",void 0),(0,o.C)([(0,a.M)({type:Number})],y.prototype,"mobileGridColumns",void 0),(0,o.C)([(0,a.M)({type:Boolean})],y.prototype,"fill",void 0),(0,o.C)([(0,a.M)()],y.prototype,"spacing",void 0),(0,o.C)([(0,a.M)()],y.prototype,"mobileSpacing",void 0),y=(0,o.C)([(0,s.E)(`${v}-event-table`)],y)}
3017,706(t,e,i){var o=i(8472),r=i(2618),s=i(6505),a=i(9563),n=i(7509),l=i(3720),d=i(1145),c=i(9061),u=i(9924),m=i(8698),h=i(2609);const{prefix:p}=m.W;let g=class extends r.WF{constructor(){super(...arguments),this.width="page-width",this.paddingTop="",this.paddingBottom="",this.socialsHidden=!1,this.centerContent=!1,this._slotHasChildren=!1,this._optionalSlotChildren="socials"}_handleSlotChange(t){this._slotHasChildren=(0,c.Y)(t,this._optionalSlotChildren)}footerClasses(){return{footer:!0,"footer--socials-hidden":this.socialsHidden,"footer--center":this.centerContent,"footer--socials-show":this._slotHasChildren}}footerStyles(){let t={};return this.paddingTop&&(t={...t,"--umg-space-footer-padding-top":"var(--umg-space-"+this.paddingTop+")"}),this.paddingBottom&&(t={...t,"--umg-space-footer-padding-bottom":"var(--umg-space-"+this.paddingBottom+")"}),t}footerInnerStyles(){let t={};return"full-width"===this.width&&(t={...t,"--umg-size-content-max-width":"100%"}),t}render(){return r.qy` 3018 <footer 3019 part="footer" 3020 class="${(0,l.H)(this.footerClasses())}" 3021 style="${(0,d.W)(this.footerStyles())}" 3022 > 3023 <div 3024 part="footer-inner" 3025 class="footer__inner" 3026 style="${(0,d.W)(this.footerInnerStyles())}" 3027 > 3028 <slot part="footer-links" name="links"></slot> 3029 <slot part="footer-content"></slot> 3030 <slot part="footer-socials" name="socials" @slotchange=${this._handleSlotChange}></slot> 3031 </div> 3032 </footer> 3033 `}};g.styles=(0,h.Z)([u.S,r.AH` 3034 .footer { 3035 color: var(--umg-color-base-text, rgb(0,0,0)); 3036 background-color: var(--umg-color-base-background, rgb(240,240,240)); 3037 --umg-color-icon-text: var(--umg-color-base-text); 3038 } 3039 @supports (color: rgb(from white r g b)) { 3040 .footer { 3041 color: rgb(from var(--umg-color-base-text, rgb(0,0,0)) r g b); 3042 background-color: rgb(from var(--umg-color-base-background, rgb(240,240,240)) r g b / alpha); 3043 } 3044 } 3045 3046 .footer__inner { 3047 display: flex; 3048 flex-wrap: wrap; 3049 align-items: center; 3050 justify-content: space-between; 3051 margin: 0 auto; 3052 max-width: var(--umg-size-content-max-width, 75rem); 3053 } 3054 3055 slot[name=links], 3056 slot[name=socials] { 3057 display: block; 3058 } 3059 3060 @media screen and (max-width: 48rem) { 3061 .footer { 3062 padding-top: var(--umg-space-footer-padding-top, 3rem); 3063 padding-bottom: var(--umg-space-footer-padding-bottom, 3rem); 3064 } 3065 .footer__inner { 3066 flex-direction: column-reverse; 3067 padding-left: var(--umg-space-base-side-padding-mobile, 1rem); 3068 padding-right: var(--umg-space-base-side-padding-mobile, 1rem); 3069 gap: var(--umg-space-24, 1.5rem); 3070 } 3071 slot[name=socials] { 3072 display: block; 3073 } 3074 } 3075 @media screen and (min-width: 48.06rem) { 3076 .footer { 3077 padding-top: var(--umg-space-footer-padding-top, 3rem); 3078 padding-bottom: var(--umg-space-footer-padding-bottom, 3rem); 3079 } 3080 .footer__inner { 3081 gap: var(--umg-space-24, 1.5rem); 3082 padding-left: var(--umg-space-base-side-padding, 1.5rem); 3083 padding-right: var(--umg-space-base-side-padding, 1.5rem); 3084 } 3085 } 3086 3087 /* Show/hide socials slot by option or when empty */ 3088 slot[name=socials], 3089 .footer--socials-hidden slot[name=socials] { 3090 display: none; 3091 } 3092 3093 .footer--socials-show:not(.footer--socials-hidden) slot[name=socials] { 3094 display: block; 3095 } 3096 3097 /* Centered content */ 3098 .footer--center .footer__inner { 3099 gap: var(--umg-space-32, 2rem); 3100 justify-content: center; 3101 } 3102 `]),(0,o.C)([(0,a.M)()],g.prototype,"width",void 0),(0,o.C)([(0,a.M)({type:Number})],g.prototype,"paddingTop",void 0),(0,o.C)([(0,a.M)({type:Number})],g.prototype,"paddingBottom",void 0),(0,o.C)([(0,a.M)({type:Boolean})],g.prototype,"socialsHidden",void 0),(0,o.C)([(0,a.M)({type:Boolean})],g.prototype,"centerContent",void 0),(0,o.C)([(0,n.w)()],g.prototype,"_slotHasChildren",void 0),g=(0,o.C)([(0,s.E)(`${p}-footer`)],g)},4742(t,e,i){var o=i(8472),r=i(2618),s=i(6505),a=i(9563),n=i(3720),l=i(1145),d=i(9924),c=i(3023),u=i(8698),m=i(2609);const{prefix:h}=u.W;let p=class extends r.WF{render(){return r.qy` 3103 <div 3104 part="grid-cell" 3105 class="grid-item" 3106 > 3107 <slot></slot> 3108 </div> 3109 `}};p.styles=(0,m.Z)([d.S,r.AH` 3110 .grid-item { 3111 height: 100%; 3112 width: 100%; 3113 } 3114 `]),p=(0,o.C)([(0,s.E)(`${h}-grid-cell`)],p);const{prefix:g}=u.W;let b=class extends r.WF{constructor(){super(...arguments),this.columns=4,this.mobileColumns="1",this.gapless=!1,this.fill=!1}gridClasses(){const t={};return t["grid--gapless"]=this.gapless,t["grid--fill"]=this.fill,t["grid--"+this.columns+"-col-tablet"]=this.columns<3,t["grid--3-col-tablet"]=this.columns>=3,t["grid--"+this.columns+"-col-desktop"]=!0,t["grid--"+this.mobileColumns+"-col-tablet-down"]=!0,t}gridStyles(){let t={};return 6===this.columns&&(t={...t,"--umg-grid-desktop-columns-width":"16.66%","--umg-grid-desktop-columns":"6","--umg-grid-desktop-gaps":"5","--umg-grid-desktop-peek":"1.5"}),5===this.columns&&(t={...t,"--umg-grid-desktop-columns-width":"20%","--umg-grid-desktop-columns":"5","--umg-grid-desktop-gaps":"4","--umg-grid-desktop-peek":"2"}),4===this.columns&&(t={...t,"--umg-grid-desktop-columns-width":"25%","--umg-grid-desktop-columns":"4","--umg-grid-desktop-gaps":"3","--umg-grid-desktop-peek":"2.5"}),3===this.columns&&(t={...t,"--umg-grid-desktop-columns-width":"33.33%","--umg-grid-desktop-columns":"3","--umg-grid-desktop-gaps":"2","--umg-grid-desktop-peek":"3"}),2===this.columns&&(t={...t,"--umg-grid-desktop-columns-width":"50%","--umg-grid-desktop-columns":"2","--umg-grid-desktop-gaps":"1","--umg-grid-desktop-peek":"4"}),1===this.columns&&(t={...t,"--umg-grid-desktop-columns-width":"100%","--umg-grid-desktop-columns":"1","--umg-grid-desktop-gaps":"0","--umg-grid-desktop-peek":"9"}),this.spacing&&(t={...t,"--umg-space-grid-horizontal-desktop":Number(this.spacing)/16+"rem","--umg-space-grid-vertical-desktop":Number(this.spacing)/16+"rem"}),this.mobileSpacing?t={...t,"--umg-space-grid-horizontal-mobile":Number(this.mobileSpacing)/16+"rem","--umg-space-grid-vertical-mobile":Number(this.mobileSpacing)/16+"rem"}:this.spacing&&(t={...t,"--umg-space-grid-horizontal-mobile":Number(this.spacing)/16+"rem","--umg-space-grid-vertical-mobile":Number(this.spacing)/16+"rem"}),t}render(){return r.qy` 3115 <div 3116 part="grid" 3117 class="grid${(0,n.H)(this.gridClasses())}" 3118 style="${(0,l.W)(this.gridStyles())}" 3119 > 3120 <slot></slot> 3121 </div> 3122 `}};b.styles=(0,m.Z)([d.S,r.AH` 3123 :host { 3124 display: block; 3125 } 3126 `,c.V]),(0,o.C)([(0,a.M)({type:Number})],b.prototype,"columns",void 0),(0,o.C)([(0,a.M)()],b.prototype,"mobileColumns",void 0),(0,o.C)([(0,a.M)()],b.prototype,"spacing",void 0),(0,o.C)([(0,a.M)()],b.prototype,"mobileSpacing",void 0),(0,o.C)([(0,a.M)({type:Boolean})],b.prototype,"gapless",void 0),(0,o.C)([(0,a.M)({type:Boolean})],b.prototype,"fill",void 0),b=(0,o.C)([(0,s.E)(`${g}-grid`)],b)},9306(t,e,i){var o=i(8472),r=i(2618),s=i(6505),a=i(9563),n=i(7509),l=i(7621),d=i(3720),c=i(9061),u=i(9924),m=i(8698),h=i(2609),p=(i(5840),i(1895));const{prefix:g}=m.W;let b=class extends r.WF{constructor(){super(),this.clickOpenAction="",this.clickBackAction="",this._subN
3126avOpen=!1,this.closeDrawer=()=>{setTimeout(()=>{this._menuDrawer.classList.remove("menu-opening"),this._menuDrawer.removeAttribute("open")}),this._subNavOpen=!this._subNavOpen}}_handleSummaryClick(){setTimeout(()=>{this._menuDrawer.classList.add("menu-opening")}),this._subNavOpen=!this._subNavOpen}handleBackClick(){this._menuDrawer.removeAttribute("open"),this._menuDrawer.classList.remove("menu-opening"),this._subNavOpen=!this._subNavOpen}render(){return r.qy` 3127 <details 3128 part="menu-drawer" 3129 class="menu-drawer" 3130 > 3131 <summary 3132 part="menu-drawer-summary" 3133 class="menu-drawer__summary" 3134 aria-label="Main menu" 3135 role="button" 3136 aria-expanded=${!!this._subNavOpen} 3137 @click=${this._handleSummaryClick} 3138 > 3139 <slot name="summary"></slot> 3140 <umg-icon 3141 part="icon" 3142 class="submenu__arrow" 3143 icon="arrow-right-long" 3144 size="medium" 3145 aria-hidden="true" 3146 focusable="false" 3147 role="presentation" 3148 > 3149 </umg-icon> 3150 </summary> 3151 <div 3152 part="sub-menu" 3153 class="sub-menu" 3154 aria-hidden=${!this._subNavOpen} 3155 > 3156 <button 3157 part="sub-menu-button" 3158 class="submenu__back-btn" 3159 type="button" 3160 @click=${this.handleBackClick} 3161 > 3162 <umg-icon 3163 part="icon" 3164 class="submenu__arrow--back" 3165 icon="arrow-left-long" 3166 size="medium" 3167 aria-hidden="true" 3168 focusable="false" 3169 role="presentation" 3170 > 3171 </umg-icon> 3172 <slot name="summary-back"></slot> 3173 </button> 3174 <slot name="submenu"></slot> 3175 </div> 3176 </details> 3177 `}};b.styles=(0,h.Z)([u.S,r.AH` 3178 :host { 3179 width: 100%; 3180 } 3181 3182 details summary::-webkit-details-marker { 3183 display:none; 3184 } 3185 3186 /* menu drawer states */ 3187 .menu-drawer[open].menu-opening .sub-menu { 3188 transition: transform 0.2s ease, visibility 0.2s ease; 3189 transform: translateX(0); 3190 visibility: visible; 3191 } 3192 3193 .sub-menu { 3194 position: absolute; 3195 inset: 0; 3196 padding: var(--umg-space-32, 2rem) 0; 3197 transform: translateX(100%); 3198 visibility: hidden; 3199 background-color: var(--umg-color-menu-drawer-background, rgb(236, 236, 236)); 3200 } 3201 @supports (color: rgb(from white r g b)) { 3202 .sub-menu { 3203 background-color: rgb(from var(--umg-color-menu-drawer-background, rgb(236, 236, 236)) r g b / alpha); 3204 } 3205 } 3206 3207 /* Summary */ 3208 .menu-drawer__summary { 3209 align-items: center; 3210 color: inherit; 3211 cursor: pointer; 3212 display: flex; 3213 list-style: none; 3214 padding: var(--umg-space-12, 0.75rem) var(--umg-space-24, 1.5rem); 3215 transition: background-color var(--umg-animation-duration-04, 0.4s ease); 3216 } 3217 .menu-drawer__summary:hover { 3218 background-color: var(--umg-color-base-background); 3219 } 3220 @supports (color: rgb(from white r g b)) { 3221 .menu-drawer__summary:hover { 3222 background-color: rgb(from var(--umg-color-base-background) r g b / 0.75); 3223 } 3224 } 3225 3226 /* Submenu buttons */ 3227 .submenu__back-btn { 3228 cursor: pointer; 3229 display: flex; 3230 align-items: center; 3231 border: 0; 3232 box-shadow: none; 3233 column-gap: var(--umg-space-8, 0.5rem); 3234 font-size: var(--umg-font-body-size-sm, 0.875rem); 3235 padding: var(--umg-space-20, 1.25rem) var(--umg-space-24, 1.5rem); 3236 transition: background-color var(--umg-animation-duration-04, 0.4s ease); 3237 text-transform: uppercase; 3238 width: 100%; 3239 3240 color: var(--umg-color-menu-drawer-text, var(--umg-color-base-text, rgb(62,62,62))); 3241 background-color: transparent; 3242 } 3243 @supports (color: rgb(from white r g b)) { 3244 .submenu__back-btn { 3245 color: rgb(from var(--umg-color-menu-drawer-text, var(--umg-color-base-text, rgb(62,62,62))) r g b / alpha); 3246 } 3247 } 3248 .submenu__arrow { 3249 height: var(--umg-space-16, 1rem); 3250 margin-left: auto; 3251 width: var(--umg-space-16, 1rem); 3252 } 3253 .submenu__arrow--back { 3254 margin-left: 0; 3255 } 3256 3257 .submenu__back-btn:hover { 3258 background-color: var(--umg-color-base-background); 3259 } 3260 @supports (color: rgb(from white r g b)) { 3261 .submenu__back-btn:hover { 3262 background-color: rgb(from var(--umg-color-base-background) r g b / 0.75); 3263 } 3264 } 3265 `]),(0,o.C)([(0,a.M)({type:String})],b.prototype,"clickOpenAction",void 0),(0,o.C)([(0,a.M)({type:String})],b.prototype,"clickBackAction",void 0),(0,o.C)([(0,a.M)({state:!0,type:Boolean})],b.prototype,"_subNavOpen",void 0),(0,o.C)([(0,p.P)(".menu-drawer")],b.prototype,"_menuDrawer",void 0),b=(0,o.C)([(0,s.E)(`${g}-menu-drawer`)],b);i(4630);const{prefix:v}=m.W;let y=class extends r.WF{constructor(){super(...arguments),this.src="",this.direction="from-left",this._drawerOpen=!1,this._slotHasChildren=!1}async firstUpdated(){void 0===this.data&&this.src&&await this.fetchData()}async fetchData(){this.data=await fetch(this.src).then(t=>t.json()),this.requestUpdate()}closeDrawer(){this._drawerOpen=!1,this._drawer.disclosureClose(),document.body.removeAttribute("style"),this._closeActiveDrawers()}
3265_handleSlotChange(t){this._slotHasChildren=(0,c.Y)(t,"socials")}_openDrawer(){this._drawerOpen=!0,document.body.style.overflow="hidden"}_closeDrawer(){this._drawerOpen=!1,document.body.removeAttribute("style"),this._closeActiveDrawers()}_closeActiveDrawers(){if(!this._drawerOpen){const t=this.shadowRoot?.querySelectorAll("umg-menu-drawer");t&&t.length&&t.forEach(t=>{t.closeDrawer()})}}menuDrawerClasses(){return{"header-drawer--has-socials":this._slotHasChildren,"header-drawer--overlay":this._drawerOpen}}menuList(){if(this.data)return r.qy` 3266 <nav part="menu-nav"> 3267 <ul part="menu-list" class="menu__list"> 3268 ${this.data.map(t=>r.qy`<li part="menu-item">${t.subItems?r.qy` 3269 <umg-menu-drawer part="menu-drawer"> 3270 <span part="submenu-link-title" slot="summary"> 3271 ${t.linkText} 3272 </span> 3273 <span part="back-link-title" slot="summary-back"> 3274 ${t.linkText} 3275 </span> 3276 <ul part="submenu" slot="submenu" class="submenu"> 3277 ${t.subItems.map(t=>r.qy`<li part="submenu-item">${t.subItems?r.qy` 3278 <umg-menu-drawer part="submenu-drawer"> 3279 <span part="submenu-link-title" slot="summary"> 3280 ${t.linkText} 3281 </span> 3282 <span part="back-link-title" slot="summary-back"> 3283 ${t.linkText} 3284 </span> 3285 <ul part="submenu-list" class="submenu" slot="submenu"> 3286 ${t.subItems.map(t=>r.qy`<li part="submenu-list-item"><a 3287part="submenu-link" 3288class="submenu__link" 3289href="${t.linkUrl}"@click=${this.closeDrawer}>${t.linkText}</a></li>`)} 3290 </ul> 3291 </umg-menu-drawer> 3292 `:r.qy` 3293 <a 3294 part="submenu-link" 3295 class="submenu__link" 3296 href="${t.linkUrl}" 3297 @click=${this.closeDrawer} 3298 > 3299 ${t.linkText} 3300 </a> 3301 `}</li>`)} 3302 </ul> 3303 </umg-menu-drawer> 3304 `:r.qy` 3305 <a 3306 part="submenu-link" 3307 class="submenu__link" 3308 href="${t.linkUrl}" 3309 @click=${this.closeDrawer} 3310 > 3311 ${t.linkText} 3312 </a> 3313 `}</li>`)} 3314 </ul> 3315 </nav> 3316 `}render(){return r.qy` 3317 <umg-disclosure 3318 exportparts="disclosure,disclosure-summary,disclosure-drawer,disclosure-content" 3319 part="disclosure" 3320 class="header-drawer${(0,d.H)(this.menuDrawerClasses())}" 3321 direction=${this.direction} 3322 overlay 3323 > 3324 <span part='disclosure-button' slot="icon"> 3325 <umg-icon 3326 exportparts="icon-container,icon-svg,icon-image" 3327 part="menu-icon menu-icon-open" 3328 class="menu-icon icon--open" 3329 icon="bars" 3330 size="2xlarge" 3331 ?open=${this._drawerOpen} 3332 @click=${this._openDrawer} 3333 role="presentation" 3334 aria-hidden="true" 3335 focusable="false" 3336 > 3337 </umg-icon> 3338 <umg-icon 3339 exportparts="icon-container,icon-svg,icon-image" 3340 part="menu-icon menu-icon-close" 3341 class="menu-icon icon--close" 3342 icon="close" 3343 size="2xlarge" 3344 ?open=${this._drawerOpen} 3345 @click=${this._closeDrawer} 3346 role="presentation" 3347 aria-hidden="true" 3348 focusable="false" 3349 > 3350 </umg-icon> 3351 </span> 3352 <div part="menu" class="menu" slot="content"> 3353 <div 3354 part="menu-drawer" 3355 class="menu-drawer" 3356 > 3357 ${this.menuList()} 3358 </div> 3359 <div 3360 part="socials" 3361 class="socials" 3362 > 3363 <slot name="socials" @slotchange=${this._handleSlot
3363Change}></slot> 3364 </div> 3365 </div> 3366 </umg-disclosure> 3367 `}};y.styles=(0,h.Z)([u.S,r.AH` 3368 /* Burger button */ 3369 .menu-icon[open].icon--close { 3370 display: block; 3371 } 3372 .menu-icon[open].icon--open { 3373 display: none; 3374 } 3375 .icon--close { 3376 display: none; 3377 } 3378 .icon--open { 3379 display: block; 3380 } 3381 3382 /* Header drawer */ 3383 .header-drawer { 3384 position: initial; 3385 --umg-space-summary-padding: 0; 3386 3387 } 3388 .header-drawer--overlay:after { 3389 content: ''; 3390 position: fixed; 3391 inset: 0; 3392 z-index:-1; 3393 background-color: var(--umg-color-overlay-background, rgb(0,0,0,0.4)); 3394 } 3395 3396 @supports (color: rgb(from white r g b)) { 3397 .header-drawer--overlay:after { 3398 background-color: rgb(from var(--umg-color-overlay-background, rgb(0,0,0,0.4)) r g b / alpha); 3399 } 3400 } 3401 3402 .header-drawer::part(disclosure-drawer) { 3403 --umg-color-base-border: transparent; 3404 --umg-color-base-text: var(--umg-color-menu-drawer-text); 3405 --umg-color-icon-text: var(--umg-color-menu-drawer-text); 3406 --umg-color-summary-background: transparent; 3407 --umg-color-details-background: var(--umg-color-menu-drawer-background, rgb(240,240,240)); 3408 --umg-space-disclosure-distance: var(--umg-size-header-inner-height, 0); 3409 --umg-space-details-padding: 0; 3410 width: 90%; 3411 } 3412 3413 /* Menu drawer */ 3414 .menu { 3415 display: flex; 3416 flex-direction: column; 3417 font-family: var(--umg-font-menu-family, inherit); 3418 font-size: var(--umg-font-menu-size, inherit); 3419 letter-spacing: 0.05rem; 3420 height: calc(100svh - var(--umg-size-header-outer-height)); 3421 } 3422 .menu-drawer { 3423 flex: 1; 3424 position: relative; 3425 overflow-x: hidden; 3426 } 3427 3428 .menu__list { 3429 display: flex; 3430 flex-direction: column; 3431 list-style: none; 3432 margin: 0; 3433 padding: var(--umg-space-32, 2rem) 0; 3434 color: var(--umg-color-menu-drawer-text, var(--umg-color-base-text, rgb(0,0,0))); 3435 } 3436 @supports (color: rgb(from white r g b)) { 3437 .menu__list { 3438 color: rgb(from var(--umg-color-menu-drawer-text, var(--umg-color-base-text, rgb(0,0,0))) r g b / 1); 3439 } 3440 } 3441 3442 /* Submenus */ 3443 .submenu { 3444 display: flex; 3445 flex-direction: column; 3446 list-style: none; 3447 margin: 0; 3448 padding: 0; 3449 width: 100%; 3450 } 3451 .submenu__link { 3452 display: block; 3453 color: inherit; 3454 padding: var(--umg-space-12, 0.75rem) var(--umg-space-24, 1.5rem); 3455 text-decoration: none; 3456 transition: background-color var(--umg-animation-duration-04, 0.4s) ease; 3457 } 3458 .submenu__link:hover { 3459 background-color: var(--umg-color-base-background); 3460 } 3461 @supports (color: rgb(from white r g b)) { 3462 .submenu__link:hover { 3463 background-color: rgb(from var(--umg-color-base-background) r g b / 0.7); 3464 } 3465 } 3466 3467 /* Socials */ 3468 .socials { 3469 display: none; 3470 align-items: center; 3471 justify-content: center; 3472 padding: var(--umg-space-24, 1.5rem) var(--umg-space-16, 1.5rem) var(--umg-space-48, 3rem); 3473 } 3474 .header-drawer--has-socials .socials { 3475 display: flex; 3476 } 3477 `]),(0,o.C)([(0,a.M)()],y.prototype,"src",void 0),(0,o.C)([(0,a.M)({type:Object})],y.prototype,"data",void 0),(0,o.C)([(0,a.M)({type:String})],y.prototype,"direction",void 0),(0,o.C)([(0,n.w)()],y.prototype,"_drawerOpen",void 0),(0,o.C)([(0,l.P)("umg-disclosure")],y.prototype,"_drawer",void 0),(0,o.C)([(0,n.w)()],y.prototype,"_slotHasChildren",void 0),y=(0,o.C)([(0,s.E)(`${v}-header-drawer`)],y)},7314(t,e,i){var o=i(8472),r=i(2618),s=i(6505),a=i(9563),n=i(7621),l=i(7509),d=i(3720),c=i(1145),u=i(9924),m=i(8698),h=i(2609);const{prefix:p}=m.W;let g=class extends r.WF{constructor(){super(...arguments),this.width="page-width",this.paddingTop="",this.paddingBottom="",this.layout="logo-left",this.logoHidden=!1,this.menuHidden=!1,this.socialsHidden=!1,this.socialsAlwaysVisible=!1,this.signupHidden=!1,this.sticky=!1,this.stickyHideOnScroll=!1,this.transparent=!1,this._transparentScrolling=!1,this._currentScrollPosition=0,this._hasUserSlotContent=!1,this._hasSocialsSlotContent=!1,this._hasSignupSlotContent=!1,this._hasLogoSlotContent=!1,this._hasMenuSlotContent=!1,this._hasHeaderDrawerSlotContent=!1,this._isScrolling=!1,this._handleScroll=()=>{this._isScrolling||(this._isScrolling=!0,this._scrollAnimationFrame=requestAnimationFrame(()=>{this._processScroll(),this._isScrolling=!1}))}}updated(t){super.updated(t);const e=this.stickyHideOnScroll||this.sticky&&this.transparent;(t.has("stickyHideOnScroll")||t.has("transparent")||t.has("sticky"))&&(window.removeEventListener("scroll",this._handleScroll),e?window.addEventListener("scroll",this._handleScroll,{passive:!0}):(this.removeAttribute("scrolling-down"),this._transparentScrolling=!1))}disconnectedCallback(){window.removeEventListener("scroll",this._handleScroll),this._scrollAnimationFrame&&cancelAnimationFrame(this._scrollAnimationFrame),this._resizeObserver&&(this._resizeObserver.disconnect(),this._resizeObserver=void 0),super.disconnectedCallback()}firstUpdated(){this._resizeObserver=new ResizeObserver(()=>{requestAnimationFrame(()=>this._initHeader())}),this._resizeObserver.observe(this)}
3477_handleSlotChange(t){const e=t.target,i=e.name,o=e.assignedElements().length>0||e.assignedNodes().filter(t=>t.nodeType===Node.TEXT_NODE&&""!==t.textContent?.trim()).length>0;switch(i){case"user":this._hasUserSlotContent=o;break;case"socials":this._hasSocialsSlotContent=o;break;case"signup":this._hasSignupSlotContent=o;break;case"logo":this._hasLogoSlotContent=o;break;case"menu":this._hasMenuSlotContent=o;break;case"header-drawer":this._hasHeaderDrawerSlotContent=o}}get _hasActionsContent(){return this._hasUserSlotContent||this._hasSocialsSlotContent||this._hasSignupSlotContent}get _hasActionsGroupContent(){return!this.socialsHidden&&this._hasSocialsSlotContent||!this.signupHidden&&this._hasSignupSlotContent}_initHeader(){this._currentScrollPosition=window.scrollY||document.documentElement.scrollTop,this._headerOuterHeight=this.getBoundingClientRect().bottom;const t=this.offsetHeight;this.style.setProperty("--umg-size-header-inner-height",t/16+"rem"),this.style.setProperty("--umg-size-header-outer-height",this._headerOuterHeight/16+"rem");const e=new CustomEvent("header-details",{detail:{height:this._headerOuterHeight},bubbles:!0,composed:!0});this.dispatchEvent(e)}_processScroll(){const t=window.scrollY;if(this.sticky&&this.transparent){const e=this._transparentScrolling;this._transparentScrolling=t>0,e!==this._transparentScrolling&&this.requestUpdate()}this.stickyHideOnScroll&&this._updateStickyVisibility(t),this._currentScrollPosition=t}_updateStickyVisibility(t){const e=this.hasAttribute("scrolling-down");let i=!1;i=!(this._headerOuterHeight&&t<=this._headerOuterHeight)&&t>this._currentScrollPosition,i!==e&&(i?this.setAttribute("scrolling-down",""):this.removeAttribute("scrolling-down"))}render(){return r.qy` 3478 <header> 3479 <div 3480 part="header" 3481 class="header${(0,d.H)({[`header--${this.layout}`]:!!this.layout,"header--actions-show":this._hasActionsContent,"header--socials-always-visible":this.socialsAlwaysVisible})}" 3482 style="${(0,c.W)({"--umg-space-header-padding-top":this.paddingTop?`var(--umg-space-${this.paddingTop})`:"","--umg-space-header-padding-bottom":this.paddingBottom?`var(--umg-space-${this.paddingBottom})`:"","--umg-color-base-background":this.transparent&&!this._transparentScrolling?"transparent":""})}" 3483 > 3484 <div 3485 part="header-inner" 3486 class="header__inner" 3487 style="${(0,c.W)({"--umg-size-header-width":"full-width"===this.width?"min(100vw, var(--umg-size-screen-max-width, 100vw))":""})}" 3488 > 3489 <div part="menu-drawer" class="header__menu-drawer" 3490 ?hidden=${!this._hasHeaderDrawerSlotContent}> 3491 <slot name="header-drawer" @slotchange=${this._handleSlotChange}></slot> 3492 </div> 3493 3494 <div part="logo" class="header__logo" 3495 ?hidden=${this.logoHidden||!this._hasLogoSlotContent}> 3496 <slot name="logo" @slotchange=${this._handleSlotChange}></slot> 3497 </div> 3498 3499 <div part="menu" class="header__menu" 3500 ?hidden=${this.menuHidden||!this._hasMenuSlotContent}> 3501 <slot name="menu" @slotchange=${this._handleSlotChange}></slot> 3502 </div> 3503 3504 <div part="actions" class="header__actions" 3505 ?hidden=${!this._hasActionsContent}> 3506 <div part="cart" class="header__cart" 3507 ?hidden=${!this._hasUserSlotContent}> 3508 <slot name="user" @slotchange=${this._handleSlotChange}></slot> 3509 </div> 3510 <div class="header__actions-group" 3511 ?hidden=${!this._hasActionsGroupContent}> 3512 <div part="socials" class="header__socials" 3513 ?hidden=${this.socialsHidden||!this._hasSocialsSlotContent}> 3514 <slot name="socials" @slotchange=${this._handleSlot
3514Change}></slot> 3515 </div> 3516 <div part="signup" class="header__signup" 3517 ?hidden=${this.signupHidden||!this._hasSignupSlotContent}> 3518 <slot name="signup" @slotchange=${this._handleSlotChange}></slot> 3519 </div> 3520 </div> 3521 </div> 3522 </div> 3523 </div> 3524 </header> 3525 `}};g.styles=(0,h.Z)([u.S,r.AH` 3526 :host { 3527 display: block; 3528 position: relative; 3529 z-index: 501; /* over overlay z-index */ 3530 } 3531 3532 /* Header base styles */ 3533 .header { 3534 transition: all var(--umg-animation, 0.4s) ease; 3535 overflow: hidden; 3536 color: var(--umg-color-base-text, rgb(0,0,0)); 3537 background-color: var(--umg-color-base-background, rgb(240,240,240)); 3538 --umg-color-icon-text: var(--umg-color-base-text); 3539 } 3540 3541 @supports (color: rgb(from white r g b)) { 3542 .header { 3543 color: rgb(from var(--umg-color-base-text, rgb(0,0,0)) r g b); 3544 background-color: rgb(from var(--umg-color-base-background, rgb(240,240,240)) r g b / alpha); 3545 } 3546 } 3547 3548 .header__inner { 3549 display: flex; 3550 align-items: center; 3551 margin: 0 auto; 3552 max-width: var(--umg-size-header-width, var(--umg-size-content-max-width, 75rem)); 3553 transition: padding var(--umg-animation, 0.4s) ease; 3554 } 3555 3556 /* Responsive padding and spacing */ 3557 @media screen and (max-width: 48rem) { 3558 .header { 3559 padding-top: calc(var(--umg-space-header-padding-top, 1rem) * 0.5); 3560 padding-bottom: calc(var(--umg-space-header-padding-bottom, 1rem) * 0.5); 3561 } 3562 .header__inner { 3563 gap: var(--umg-space-24, 1rem); 3564 padding-left: var(--umg-space-base-side-padding-mobile, 1rem); 3565 padding-right: var(--umg-space-base-side-padding-mobile, 1rem); 3566 } 3567 } 3568 3569 @media screen and (min-width: 48.06rem) { 3570 .header { 3571 padding-top: var(--umg-space-header-padding-top, 1rem); 3572 padding-bottom: var(--umg-space-header-padding-bottom, 1rem); 3573 } 3574 .header__inner { 3575 gap: var(--umg-space-24, 1.5rem); 3576 padding-left: var(--umg-space-base-side-padding, 1.5rem); 3577 padding-right: var(--umg-space-base-side-padding, 1.5rem); 3578 } 3579 } 3580 3581 /* Sticky header behavior */ 3582 :host([sticky]) { 3583 position: sticky; 3584 top: 0; 3585 z-index: 501; /* over overlay z-index */ 3586 } 3587 3588 :host([transparent]) { 3589 position: absolute; 3590 width: 100%; 3591 } 3592 3593 :host([transparent][sticky]) { 3594 position: fixed; 3595 width: 100%; 3596 } 3597 3598 :host([sticky][scrolling-down]) header { 3599 transform: translateY(-100%); 3600 } 3601 3602 header { 3603 transition: all var(--umg-animation, 0.4s) ease; 3604 } 3605 3606 /* Header content layout */ 3607 .header .header__menu { 3608 margin-right: auto; 3609 } 3610 3611 .header__actions { 3612 display: none; 3613 align-items: center; 3614 gap: var(--umg-space-32, 2rem); 3615 margin-left: auto; 3616 } 3617 3618 .header--actions-show .header__actions { 3619 display: flex; 3620 } 3621 3622 .header__actions-group { 3623 display: flex; 3624 align-items: center; 3625 gap: var(--umg-space-gap-normal, var(--umg-space-16, 1rem)); 3626 } 3627 3628 .header__signup { 3629 white-space: nowrap; 3630 } 3631 3632 /* Mobile header */ 3633 .header__menu-drawer { 3634 display: block; 3635 } 3636 3637 /* Desktop layouts */ 3638 @media only screen and (min-width: 64.06rem) { 3639 .header__menu-drawer { 3640 display: none; 3641 } 3642 3643 /* Logo center layout */ 3644 .header--logo-center .header__menu { 3645 width: 100%; 3646 } 3647 .header--logo-center .header__logo { 3648 display: flex; 3649 order: 2; 3650 justify-content: center; 3651 width: 100%; 3652 } 3653 .header--logo-center .header__actions { 3654 justify-content: flex-end; 3655 order: 3; 3656 width: 100%; 3657 } 3658 3659 /* Nav center layout */ 3660 .header--nav-center .header__menu { 3661 display: flex; 3662 flex: 1; 3663 justify-content: center; 3664 } 3665 .header--nav-center .header__logo { 3666 margin-right: auto; 3667 } 3668 .header--nav-center .header__actions { 3669 margin-left: auto; 3670 } 3671 .header--nav-center .header__logo, 3672 .header--nav-center .header__actions { 3673 flex: 1; 3674 } 3675 .header--nav-center .header__actions { 3676 display: flex; 3677 justify-content: flex-end; 3678 } 3679 3680 /* Content right layout */ 3681 .header--content-right .header__menu { 3682 display: flex; 3683 flex: 1; 3684 justify-content: right; 3685 } 3686 .header--content-right .header__logo { 3687 margin-left: auto; 3688 } 3689 } 3690 3691 /* Mobile responsive overrides */ 3692 @media only screen and (max-width: 64rem) { 3693 .header__menu, 3694 .header__socials, 3695 .header--nav-center .header__menu { 3696 display: none; 3697 } 3698 3699 /* Override mobile hiding for socials when always visible */ 3700 .header--socials-always-visible .header__socials { 3701 display: block; 3702 --umg-space-gap-normal: 0.5rem; 3703 } 3704 3705 .header__menu-drawer { 3706 display: block; 3707 margin-right: auto; 3708 width: 100%; 3709 } 3710 .header__logo { 3711 display: flex; 3712 justify-content: center; 3713 width: 100%; 3714 } 3715 .header__actions { 3716 justify-content: flex-end; 3717 width: 100%; 3718 } 3719 } 3720 3721 /* Mobile logo alignment when socials always visible */ 3722 @media only screen and (max-width: 48rem) { 3723 .header--socials-always-visible .header__logo { 3724 justify-content: flex-start; 3725 } 3726 .header--socials-always-visible .header__actions { 3727 flex: 1 0 auto; 3728 width: auto; 3729 3730 } 3731 .header--socials-always-visible .header__menu-drawer { 3732 width: auto; 3733 margin-right: 0; 3734 } 3735 } 3736 `]),(0,o.C)([(0,a.M)()],g.prototype,"width",void 0),(0,o.C)([(0,a.M)()],g.prototype,"paddingTop",void 0),(0,o.C)([(0,a.M)()],g.prototype,"paddingBottom",void 0),(0,o.C)([(0,a.M)({type:String})],g.prototype,"layout",void 0),(0,o.C)([(0,a.M)({type:Boolean})],g.prototype,"logoHidden",void 0),(0,o.C)([(0,a.M)({type:Boolean})],g.prototype,"menuHidden",void 0),(0,o.C)([(0,a.M)({type:Boolean})],g.prototype,"socialsHidden",void 0),(0,o.C)([(0,a.M)({type:Boolean})],g.prototype,"socialsAlwaysVisible",void 0),(0,o.C)([(0,a.M)({type:Boolean})],g.prototype,"signupHidden",void 0),(0,o.C)([(0,a.M)({type:Boolean})],g.prototype,"sticky",void 0),(0,o.C)([(0,a.M)({type:Boolean})],g.prototype,"stickyHideOnScroll",void 0),(0,o.C)([(0,a.M)({type:Boolean})],g.prototype,"transparent",void 0),(0,o.C)([(0,l.w)()],g.prototype,"_headerOuterHeight",void 0),(0,o.C)([(0,l.w)()],g.prototype,"_transparentScrolling",void 0),(0,o.C)([(0,l.w)()],g.prototype,"_currentScrollPosition",void 0),(0,o.C)([(0,l.w)()],g.prototype,"_hasUserSlotContent",void 0),(0,o.C)([(0,l.w)()],g.prototype,"_hasSocialsSlotContent",void 0),(0,o.C)([(0,l.w)()],g.prototype,"_hasSignupSlotContent",void 0),(0,o.C)([(0,l.w)()],g.prototype,"_hasLogoSlotContent",void 0),(0,o.C)([(0,l.w)()],g.prototype,"_hasMenuSlotContent",void 0),(0,o.C)([(0,l.w)()],g.prototype,"_hasHeaderDrawerSlotContent",void 0),(0,o.C)([(0,n.P)(".header")],g.prototype,"_header",void 0),g=(0,o.C)([(0,s.E)(`${p}-header`)],g)},5686(t,e,i){var o=i(8472),r=i(2618),s=i(1145),a=i(3720),n=i(6505),l=i(9563),d=i(8698),c=i(9924),u=i(328),m=i(2609);const{prefix:h}=d.W;let p=class extends r.WF{constructor(){super(...arguments),this.align="start",this.justify="start",this.wrap=!1}stackStyles(){let t={};return this.spacing&&(t={...t,"--umg-space-grid-horizontal-desktop":Number(this.spacing)/16+"rem"}),this.mobileSpacing?t={...t,"--umg-space-grid-horizontal-mobile":Number(this.mobileSpacing)/16+"rem"}:this.spacing&&(t={...t,"--umg-space-grid-horizontal-mobile":Number(this.spacing)/16+"rem"}),t}stackClasses(){const t={};return t["group-justify--"+this.justify]=!0,t["group-align--"+this.align]=!0,t["group-wrap"]=this.wrap,this.mobileJustify?t["group-mobile-justify--"+this.mobileJustify]=!0:t["group-mobile-justify--"+this.justify]=!0,this.mobileAlign?t["group-mobile-align--"+this.mobileAlign]=!0:t["group-mobile-align--"+this.align]=!0,t}render(){return r.qy` 3737 <div 3738 part="horizontal-stack" 3739 class="horizontal-stack${(0,a.H)(this.stackClasses())}" 3740 style="${(0,s.W)(this.stackStyles())}" 3741 > 3742 <slot></slot> 3743 </div> 3744 `}};p.styles=(0,m.Z)([c.S,r.AH` 3745 :host { 3746 display: block; 3747 width: 100%; 3748 } 3749 3750 ::slotted(*) { 3751 flex-shrink: 1; 3752 } 3753 3754 .horizontal-stack { 3755 display: flex; 3756 } 3757 @media screen and (min-width: 48.06rem) { 3758 .horizontal-stack { 3759 column-gap: var(--umg-space-grid-horizontal-desktop, 1rem); 3760 row-gap: var(--umg-space-grid-vertical-desktop, 0); 3761 } 3762 } 3763 @media screen and (max-width: 48rem) { 3764 .horizontal-stack { 3765 column-gap: var(--umg-space-grid-horizontal-mobile, 1rem); 3766 row-gap: var(--umg-space-grid-vertical-mobile, 0); 3767 } 3768 } 3769 .horizontal-stack.group-wrap { 3770 flex-wrap: wrap; 3771 } 3772 .horizontal-stack.group-justify--stretch ::slotted(*) { 3773 flex-grow: 1; 3774 flex-shrink: 0; 3775 } 3776 `,u.rw,u.Oh,u.jt,u.yw]),(0,o.C)([(0,l.M)()],p.prototype,"spacing",void 0),(0,o.C)([(0,l.M)()],p.prototype,"mobileSpacing",void 0),(0,o.C)([(0,l.M)()],p.prototype,"align",void 0),(0,o.C)([(0,l.M)()],p.prototype,"mobileAlign",void 0),(0,o.C)([(0,l.M)()],p.prototype,"justify",void 0),(0,o.C)([(0,l.M)()],p.prototype,"mobileJustify",void 0),(0,o.C)([(0,l.M)({type:Boolean})],p.prototype,"wrap",void 0),p=(0,o.C)([(0,n.E)(`${h}-horizontal-stack`)],p)},4630(t,e,i){var o=i(8472),r=i(2618),s=i(6505),a=i(7621),n=i(1145),l=i(3720),d=i(9924),c=i(5846),u=i(8698),m=i(2609);const{prefix:h}=u.W;let p=class extends r.WF{constructor(){super(),this.icon="user",this.size=void 0,this._blobUrl=this.dataURItoBlobUrl('<svg xmlns="http://www.w3.org/2000/svg">\n <symbol id="arrow-down" class="icon" width="1em" height="1em" viewBox="0 0 384 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M203.3 467.3L192 478.6l-11.3-11.3-168-168L1.4 288 24 265.4l11.3 11.3L176 417.4V48 32h32V48 417.4L348.7 276.7 360 265.4 382.6 288l-11.3 11.3-168 168z"/>\n </symbol>\n <symbol id="arrow-left" class="icon" width="1em" height="1em" viewBox="0 0 448 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M12.7 244.7L1.4 256l11.3 11.3 168 168L192 446.6 214.6 424l-11.3-11.3L62.6 272 432 272l16 0 0-32-16 0L62.6 240 203.3 99.3 214.6 88 192 65.4 180.7 76.7l-168 168z"/>\n </symbol>\n <symbol id="arrow-left-long" class="icon" width="1em" height="1em" viewBox="0 0 512 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M11.3 244.7L0 256l11.3 11.3 144 144 11.3 11.3L189.3 400l-11.3-11.3L61.3 272 496 272l16 0 0-32-16 0L61.3 240 177.9 123.3 189.3 112 166.6 89.4l-11.3 11.3-144 144z"/>\n </symbol>\n <symbol id="arrow-right" class="icon" width="1em" height="1em" viewBox="0 0 448 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M435.3 267.3L446.6 256l-11.3-11.3-168-168L256 65.4 233.4 88l11.3 11.3L385.4 240 16 240 0 240l0 32 16 0 369.4 0L244.7 412.7 233.4 424 256 446.6l11.3-11.3 168-168z"/>\n </symbol>\n <symbol id="arrow-right-long" class="icon" width="1em" height="1em" viewBox="0 0 512 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">
3776\n <path d="M500.7 267.3L512 256l-11.3-11.3-144-144L345.4 89.4 322.7 112l11.3 11.3L450.7 240 16 240 0 240l0 32 16 0 434.7 0L334.1 388.7 322.7 400l22.6 22.6 11.3-11.3 144-144z"/>\n </symbol>\n <symbol id="arrow-up" class="icon" width="1em" height="1em" viewBox="0 0 384 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M203.3 44.7L192 33.4 180.7 44.7l-168 168L1.4 224 24 246.6l11.3-11.3L176 94.6V464v16h32V464 94.6L348.7 235.3 360 246.6 382.6 224l-11.3-11.3-168-168z"/>\n </symbol>\n <symbol id="bag-shopping" class="icon" width="1em" height="1em" viewBox="0 0 448 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M160 96v32H288V96c0-35.3-28.7-64-64-64s-64 28.7-64 64zm-32 64H48c-8.8 0-16 7.2-16 16V416c0 35.3 28.7 64 64 64H352c35.3 0 64-28.7 64-64V176c0-8.8-7.2-16-16-16H320v80c0 8.8-7.2 16-16 16s-16-7.2-16-16V160H160v80c0 8.8-7.2 16-16 16s-16-7.2-16-16V160zm0-32V96c0-53 43-96 96-96s96 43 96 96v32h80c26.5 0 48 21.5 48 48V416c0 53-43 96-96 96H96c-53 0-96-43-96-96V176c0-26.5 21.5-48 48-48h80z"/>\n </symbol>\n <symbol id="bag-shopping-thin" class="icon" width="1em" height="1em" viewBox="0 0 448 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M144 96v32H304V96c0-44.2-35.8-80-80-80s-80 35.8-80 80zm-16 48H48c-17.7 0-32 14.3-32 32V416c0 44.2 35.8 80 80 80H352c44.2 0 80-35.8 80-80V176c0-17.7-14.3-32-32-32H320v88c0 4.4-3.6 8-8 8s-8-3.6-8-8V144H144v88c0 4.4-3.6 8-8 8s-8-3.6-8-8V144zm0-16V96c0-53 43-96 96-96s96 43 96 96v32h80c26.5 0 48 21.5 48 48V416c0 53-43 96-96 96H96c-53 0-96-43-96-96V176c0-26.5 21.5-48 48-48h80z"/>\n </symbol>\n <symbol id="bars" class="icon" width="1em" height="1em" viewBox="0 0 448 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M0 80c0-8.8 7.2-16 16-16H432c8.8 0 16 7.2 16 16s-7.2 16-16 16H16C7.2 96 0 88.8 0 80zM0 240c0-8.8 7.2-16 16-16H432c8.8 0 16 7.2 16 16s-7.2 16-16 16H16c-8.8 0-16-7.2-16-16zM448 400c0 8.8-7.2 16-16 16H16c-8.8 0-16-7.2-16-16s7.2-16 16-16H432c8.8 0 16 7.2 16 16z"/>\n </symbol>\n <symbol id="bin-x-solid" class="icon" width="1em" height="1em" viewBox="0 0 448 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M163.8 0H284.2c12.1 0 23.2 6.8 28.6 17.7L320 32h96c17.7 0 32 14.3 32 32s-14.3 32-32 32H32C14.3 96 0 81.7 0 64S14.3 32 32 32h96l7.2-14.3C140.6 6.8 151.7 0 163.8 0zM32 128H416V448c0 35.3-28.7 64-64 64H96c-35.3 0-64-28.7-64-64V128zM143 239c-9.4 9.4-9.4 24.6 0 33.9l47 47-47 47c-9.4 9.4-9.4 24.6 0 33.9s24.6 9.4 33.9 0l47-47 47 47c9.4 9.4 24.6 9.4 33.9 0s9.4-24.6 0-33.9l-47-47 47-47c9.4-9.4 9.4-24.6 0-33.9s-24.6-9.4-33.9 0l-47 47-47-47c-9.4-9.4-24.6-9.4-33.9 0z"/>\n </symbol>\n <symbol id="carat-up" class="icon" width="1em" height="1em" viewBox="0 0 320 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M0 272L160 128 320 272v48H0V272z"/>\n </symbol>\n <symbol id="cart" class="icon" width="1em" height="1em" viewBox="0 0 576 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M16 0H0V32H16 67.2l77.2 339.5 2.8 12.5H160 496h16V352H496 172.8l-14.5-64H496L566 64l10-32H542.5 100L95.6 12.5 92.8 0H80 16zm91.3 64H532.5l-60 192H151L107.3 64zM184 432a24 24 0 1 1 0 48 24 24 0 1 1 0-48zm0 80a56 56 0 1 0 0-112 56 56 0 1 0 0 112zm248-56a24 24 0 1 1 48 0 24 24 0 1 1 -48 0zm80 0a56 56 0 1 0 -112 0 56 56 0 1 0 112 0z"/>\n </symbol>\n <symbol id="check" class="icon" width="1em" height="1em" viewBox="0 0 448 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M448.1 118.2L437 129.7 173.6 404l-11.5 12-11.5-12L11.1 258.8 0 247.2l23.1-22.2 11.1 11.5L162.1 369.8 414 107.5 425 96l23.1 22.2z"/>\n </symbol>\n <symbol id="chevron-left" class="icon" width="1em" height="1em" viewBox="0 0 320 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M9.4 256l11.3-11.3 192-192L224 41.4 246.6 64 235.3 75.3 54.6 256 235.3 436.7 246.6 448 224 470.6l-11.3-11.3-192-192L9.4 256z"/>\n </symbol>\n <symbol id="chevron-right" class="icon" width="1em" height="1em" viewBox="0 0 320 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M310.6 256l-11.3 11.3-192 192L96 470.6 73.4 448l11.3-11.3L265.4 256 84.7 75.3 73.4 64 96 41.4l11.3 11.3 192 192L310.6 256z"/>\n </symbol>\n <symbol id="chevron-up" class="icon" width="1em" height="1em" viewBox="0 0 512 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M256 105.4l11.3 11.3 192 192L470.6 320 448 342.6l-11.3-11.3L256 150.6 75.3 331.3 64 342.6 41.4 320l11.3-11.3 192-192L256 105.4z"/>\n </symbol>\n <symbol id="chevron-down" class="icon" width="1em" height="1em" viewBox="0 0 512 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M256 406.6l11.3-11.3 192-192L470.6 192 448 169.4l-11.3 11.3L256 361.4 75.3 180.7 64 169.4 41.4 192l11.3 11.3 192 192L256 406.6z"/>\n </symbol>\n <symbol id="close" class="icon" width="1em" height="1em" viewBox="0 0 384 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M192 233.4L59.5 100.9 36.9 123.5 169.4 256 36.9 388.5l22.6 22.6L192 278.6 324.5 411.1l22.6-22.6L214.6 256 347.1 123.5l-22.6-22.6L192 233.4z"/>\n </symbol>\n <symbol id="crosshairs" class="icon" width="1em" height="1em" viewBox="0 0 512 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M256 0c13.3 0 24 10.7 24 24V65.5C366.8 76.3 435.7 145.2 446.5 232H488c13.3 0 24 10.7 24 24s-10.7 24-24 24H446.5C435.7 366.8 366.8 435.7 280 446.5V488c0 13.3-10.7 24-24 24s-24-10.7-24-24V446.5C145.2 435.7 76.3 366.8 65.5 280H24c-13.3 0-24-10.7-24-24s10.7-24 24-24H65.5C76.3 145.2 145.2 76.3 232 65.5V24c0-13.3 10.7-24 24-24zM112 256a144 144 0 1 0 288 0 144 144 0 1 0 -288 0zm192 0a48 48 0 1 0 -96 0 48 48 0 1 0 96 0zm-144 0a96 96 0 1 1 192 0 96 96 0 1 1 -192 0z"/>\n </symbol>\n <symbol id="ellipsis-vertical" class="icon" width="1em" height="1em" viewBox="0 0 128 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M64 384a32 32 0 1 0 0 64 32 32 0 1 0 0-64zm0-160a32 32 0 1 0 0 64 32 32 0 1 0 0-64zM96 96A32 32 0 1 0 32 96a32 32 0 1 0 64 0z"/>\n </symbol>\n <symbol id="email" class="icon" width="1em" height="1em" viewBox="0 0 512 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M32 159.2l224 154 224-154V96H32v63.2zM480 198L256 352 32 198V416H480V198zM0 416V176 96 64H32 480h32V96v80V416v32H480 32 0V416z"/>\n </symbol>\n <symbol id="email-solid" class="icon" width="1em" height="1em" viewBox="0 0 512 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M0 64H512v80L256 320 0 144V64zM0 448V182.8L237.9 346.4 256 358.8l18.1-12.5L512 182.8V448H0z"/>\n </symbol>\n <symbol id="external" class="icon" width="1em" height="1em" viewBox="0 0 512 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M336 0H320V32h16H457.4L212.7 276.7 201.4 288 224 310.6l11.3-11.3L480 54.6V176v16h32V176 16 0H49
37766 336zM16 32H0V48 496v16H16 464h16V496 304 288H448v16V480H32V64H208h16V32H208 16z"/>\n </symbol>\n <symbol id="info" class="icon" width="1em" height="1em" viewBox="0 0 320 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M48 160c0-53 43-96 96-96h32c53 0 96 43 96 96c0 25.2-11.9 48.9-32 64l-89.6 67.2L144 296v8 48 16h32V352 312l83.2-62.4C287.4 228.4 304 195.3 304 160c0-70.7-57.3-128-128-128H144C73.3 32 16 89.3 16 160H48zM184 424H136v48h48V424z"/>\n </symbol>\n <symbol id="location" class="icon" width="1em" height="1em" viewBox="0 0 384 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M192 512s192-208 192-320C384 86 298 0 192 0S0 86 0 192C0 304 192 512 192 512zm0-384a64 64 0 1 1 0 128 64 64 0 1 1 0-128z"/>\n </symbol>\n <symbol id="minus" class="icon" width="1em" height="1em" viewBox="0 0 448 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M432 256c0 8.8-7.2 16-16 16L32 272c-8.8 0-16-7.2-16-16s7.2-16 16-16l384 0c8.8 0 16 7.2 16 16z"/>\n </symbol>\n <symbol id="mobile-solid" class="icon" width="1em" height="1em" viewBox="0 0 384 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M80 0C44.7 0 16 28.7 16 64V448c0 35.3 28.7 64 64 64H304c35.3 0 64-28.7 64-64V64c0-35.3-28.7-64-64-64H80zm80 432h64c8.8 0 16 7.2 16 16s-7.2 16-16 16H160c-8.8 0-16-7.2-16-16s7.2-16 16-16z"/>\n </symbol>\n <symbol id="mute" class="icon" width="1em" height="1em" viewBox="0 0 576 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M0 160V352H128L272 480h48V32H272L128 160H0zm441 23l-17-17L390.1 200l17 17 39 39-39 39-17 17L424 345.9l17-17 39-39 39 39 17 17L569.9 312l-17-17-39-39 39-39 17-17L536 166.1l-17 17-39 39-39-39z"/>\n </symbol>\n <symbol id="mute-light" class="icon" width="1em" height="1em" viewBox="0 0 576 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M149.3 328.1l-9.1-8.1H128 32V192h96 12.2l9.1-8.1L284.2 64H288V448h-3.8L149.3 328.1zM0 352H32h96L272 480h16 32V448 64 32H288 272L128 160H32 0v32V320v32zm411.3-4.7L480 278.6l68.7 68.7 22.6-22.6L502.6 256l68.7-68.7-22.6-22.6L480 233.4l-68.7-68.7-22.6 22.6L457.4 256l-68.7 68.7 22.6 22.6z"/>\n </symbol>\n <symbol id="partner" class="icon" width="1em" height="1em" viewBox="0 0 640 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M263.9 64c-33.9 0-66.7 12-92.6 33.7L144 120.7v39.1c2.7-.5 5.3-1.7 7.4-3.5l40.5-34c13.3-11.2 28.9-19 45.5-23.1L272.6 64h-8.7zM112 352.3c8.9 1 17.2 5 23.6 11.4l28.6 28.6 15.4 15.4 .1 .1 24.3 24.3c25.1 25.1 65.4 26.2 91.8 2.6c.8-.7 1.6-1.4 2.3-2.2c26.3 21.3 65.3 18.6 88.4-7.3c6-6.7 10.3-14.4 13-22.5c19.2 4 40-.8 55.7-14.8c11.3-10.1 18.2-23.2 20.6-37H528V368c0 26.5 21.5 48 48 48h16c26.5 0 48-21.5 48-48V160c0-17.7-14.3-32-32-32H560 528v32V318.8H473.1c-3.1-8.7-8.1-17-15.1-24l-85.6-85.6 8.1-7.5c6.5-6 6.9-16.1 .9-22.6s-16.1-6.9-22.6-.9l-76.1 70.2c-13.2 12.2-33.6 12.4-47 .4c-15.4-13.7-15.7-37.5-.8-51.6l79.4-75C332.2 105.4 355.8 96 380.4 96c22.7 0 44.6 8 61.9 22.6l44.8 37.7c2.5 2.1 5.6 3.4 8.8 3.7V121.8L462.9 94.1C439.8 74.6 410.6 64 380.4 64c-32.8 0-64.3 12.5-88.1 35l-79.4 75c-28.6 27-27.9 72.7 1.5 98.8c25.8 22.9 64.7 22.5 90-.8l44.5-41 86.5 86.5c13 13 12.4 34.3-1.4 46.5c-10.9 9.7-26.7 10.6-38.6 3c-5-3.3-11.4-3.4-16.6-.5s-8.3 8.6-8 14.6c.4 8.1-2.3 16.3-8.1 22.9c-12.3 13.9-33.8 14.5-46.9 1.4l-8.1-8.1c-3.6-3.6-8.7-5.3-13.7-4.5s-9.4 3.9-11.8 8.4c-1.9 3.6-4.4 6.9-7.6 9.8c-13.8 12.3-34.8 11.7-47.8-1.3l-39.9-39.8-28.6-28.6c-12.4-12.4-28.9-19.8-46.3-20.9V160 128H80 32c-17.7 0-32 14.3-32 32V368c0 26.5 21.5 48 48 48H64c26.5 0 48-21.5 48-48V352.3zM80 160V368c0 8.8-7.2 16-16 16H48c-8.8 0-16-7.2-16-16V160H80zm528 0V368c0 8.8-7.2 16-16 16H576c-8.8 0-16-7.2-16-16V160h48z"/>\n </symbol>\n <symbol id="play" class="icon" width="1em" height="1em" viewBox="0 0 384 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M384 256L0 32V480L384 256z"/>\n </symbol>\n <symbol id="play-pause" class="icon" width="1em" height="1em" viewBox="0 0 384 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M32 461.3L0 480V443 69 32L32 50.7 352.2 237.5 384 256l-31.8 18.5L32 461.3zM320.5 256L32 87.7V424.3L320.5 256z"/>\n </symbol>\n <symbol id="pause" class="icon" width="1em" height="1em" viewBox="0 0 156 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M32,96.5v352H0V64.5H32Zm124,0v352H124V64.5h32Z"/>\n </symbol>\n <symbol id="phone-solid" class="icon" width="1em" height="1em" viewBox="0 0 512 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M164.9 24.6c-7.7-18.6-28-28.5-47.4-23.2l-88 24C12.1 30.2 0 46 0 64C0 311.4 200.6 512 448 512c18 0 33.8-12.1 38.6-29.5l24-88c5.3-19.4-4.6-39.7-23.2-47.4l-96-40c-16.3-6.8-35.2-2.1-46.3 11.6L304.7 368C234.3 334.7 177.3 277.7 144 207.3L193.3 167c13.7-11.2 18.4-30 11.6-46.3l-40-96z"/>\n </symbol>\n <symbol id="plus" class="icon" width="1em" height="1em" viewBox="0 0 448 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M240 64c0-8.8-7.2-16-16-16s-16 7.2-16 16V240H32c-8.8 0-16 7.2-16 16s7.2 16 16 16H208V448
3776c0 8.8 7.2 16 16 16s16-7.2 16-16V272H416c8.8 0 16-7.2 16-16s-7.2-16-16-16H240V64z"/>\n </symbol>\n <symbol id="search" class="icon" width="1em" height="1em" viewBox="0 0 512 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M384 208A176 176 0 1 0 32 208a176 176 0 1 0 352 0zM343.3 366C307 397.2 259.7 416 208 416C93.1 416 0 322.9 0 208S93.1 0 208 0S416 93.1 416 208c0 51.7-18.8 99-50 135.3L507.3 484.7c6.2 6.2 6.2 16.4 0 22.6s-16.4 6.2-22.6 0L343.3 366z"/>\n </symbol>\n <symbol id="spinner" class="icon" width="1em" height="1em" viewBox="0 0 512 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M457 372c11.5 6.6 26.3 2.7 31.8-9.3C503.7 330.2 512 294.1 512 256C512 122.7 410.1 13.2 280 1.1C266.8-.1 256 10.7 256 24s10.8 23.9 24 25.4C383.5 61.2 464 149.2 464 256c0 29.3-6.1 57.3-17 82.6c-5.3 12.2-1.5 26.8 10 33.5z"/>\n </symbol>\n <symbol id="store" class="icon" width="1em" height="1em" viewBox="0 0 640 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M515.5 48l69.8 128H54.7L124.5 48h391zM96 0L0 176v48H48 64V488v24H88 360h24V488 224H528V488v24h48V488 224h16 48V176L544 0H96zM336 224v96H112V224H336zM112 464V368H336v96H112z"/>\n </symbol>\n <symbol id="swatch" class="icon" width="1em" height="1em" viewBox="0 0 512 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M0 416c0 53 43 96 96 96H496h16V496 336 320H496 331.7L447.3 204.5l11.3-11.3-11.3-11.3L334.2 68.7 322.8 57.4 311.5 68.7 192 188.2V16 0H176 16 0V16 416zm480 64H171.7l128-128H480V480zM413.4 193.1L192 414.5v-181L322.8 102.6l90.5 90.5zM96 480c-35.3 0-64-28.7-64-64l0-128H160V416c0 35.3-28.7 64-64 64zM32 256V160H160v96H32zm0-128V32l128 0v96H32zM96 440a24 24 0 1 0 0-48 24 24 0 1 0 0 48z"/>\n </symbol>\n <symbol id="square-solid" class="icon" width="1em" height="1em" viewBox="0 0 448 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M0 96C0 60.7 28.7 32 64 32H384c35.3 0 64 28.7 64 64V416c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V96z"/>\n </symbol>\n <symbol id="smile" class="icon" width="1em" height="1em" viewBox="0 0 512 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M480 256A224 224 0 1 0 32 256a224 224 0 1 0 448 0zM0 256a256 256 0 1 1 512 0A256 256 0 1 1 0 256zm129.7 71.2l28.6-14.3c8.7 17.5 41.3 55.2 97.7 55.2s88.9-37.7 97.7-55.2l28.6 14.3C369.7 352.3 327.6 400 256 400s-113.7-47.7-126.3-72.8zM152.4 208a24 24 0 1 1 48 0 24 24 0 1 1 -48 0zm184-24a24 24 0 1 1 0 48 24 24 0 1 1 0-48z"/>\n </symbol>\n <symbol id="trowel" class="icon" width="1em" height="1em" viewBox="0 0 512 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M343.9 213.4L245.3 312l65.4 65.4c7.9 7.9 11.1 19.4 8.4 30.3s-10.8 19.6-21.5 22.9l-256 80c-11.4 3.5-23.8 .5-32.2-7.9S-2.1 481.8 1.5 470.5l80-256c3.3-10.7 12-18.9 22.9-21.5s22.4 .5 30.3 8.4L200 266.7l98.6-98.6c-14.3-14.6-14.2-38 .3-52.5l95.4-95.4c26.9-26.9 70.5-26.9 97.5 0s26.9 70.5 0 97.5l-95.4 95.4c-14.5 14.5-37.9 14.6-52.5 .3z"/>\n </symbol>\n <symbol id="unmute" class="icon" width="1em" height="1em" viewBox="0 0 576 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M32 160V352H160L304 480h48V32H304L160 160H32zM441.6 332.8C464.9 315.3 480 287.4 480 256s-15.1-59.3-38.4-76.8l-28.8 38.4c11.7 8.8 19.2 22.7 19.2 38.4s-7.5 29.6-19.2 38.4l28.8 38.4zm57.6 76.8c46.6-35 76.8-90.8 76.8-153.6s-30.2-118.6-76.8-153.6l-28.8 38.4c35 26.3 57.6 68.1 57.6 115.2s-22.6 88.9-57.6 115.2l28.8 38.4z"/>\n </symbol>\n <symbol id="unmute-light" class="icon" width="1em" height="1em" viewBox="0 0 576 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M181.3 328.1l-9.1-8.1H160 64V192h96 12.2l9.1-8.1L316.2 64H320V448h-3.8L181.3 328.1zM32 352H64h96L304 480h16 32V448 64 32H320 304L160 160H64 32v32V320v32zm409.6-19.2C464.9 315.3 480 287.4 48
37760 256s-15.1-59.3-38.4-76.8l-19.2 25.6C437.9 216.5 448 235.1 448 256s-10.1 39.5-25.6 51.2l19.2 25.6zm57.6 76.8c46.6-35 76.8-90.8 76.8-153.6s-30.2-118.6-76.8-153.6L480 128c38.9 29.2 64 75.7 64 128s-25.1 98.8-64 128l19.2 25.6z"/>\n </symbol>\n <symbol id="user" class="icon" width="1em" height="1em" viewBox="0 0 448 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M320 128a96 96 0 1 0 -192 0 96 96 0 1 0 192 0zM96 128a128 128 0 1 1 256 0A128 128 0 1 1 96 128zM32 480H416c-1.2-79.7-66.2-144-146.3-144H178.3c-80 0-145 64.3-146.3 144zM0 482.3C0 383.8 79.8 304 178.3 304h91.4C368.2 304 448 383.8 448 482.3c0 16.4-13.3 29.7-29.7 29.7H29.7C13.3 512 0 498.7 0 482.3z"/>\n </symbol>\n <symbol id="users" class="icon" width="1em" height="1em" viewBox="0 0 640 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M144 0a80 80 0 1 1 0 160A80 80 0 1 1 144 0zM512 0a80 80 0 1 1 0 160A80 80 0 1 1 512 0zM0 298.7C0 239.8 47.8 192 106.7 192l42.7 0c15.9 0 31 3.5 44.6 9.7c-1.3 7.2-1.9 14.7-1.9 22.3c0 38.2 16.8 72.5 43.3 96c-.2 0-.4 0-.7 0L21.3 320C9.6 320 0 310.4 0 298.7zM405.3 320c-.2 0-.4 0-.7 0c26.6-23.5 43.3-57.8 43.3-96c0-7.6-.7-15-1.9-22.3c13.6-6.3 28.7-9.7 44.6-9.7l42.7 0C592.2 192 640 239.8 640 298.7c0 11.8-9.6 21.3-21.3 21.3l-213.3 0zM224 224a96 96 0 1 1 192 0 96 96 0 1 1 -192 0zM128 485.3C128 411.7 187.7 352 261.3 352l117.3 0C452.3 352 512 411.7 512 485.3c0 14.7-11.9 26.7-26.7 26.7l-330.7 0c-14.7 0-26.7-11.9-26.7-26.7z"/>\n </symbol>\n <symbol id="warning" class="icon" width="1em" height="1em" viewBox="0 0 64 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M48 48V32H16V48 352v16H48V352 48zm8 376H8v48H56V424z"/>\n </symbol>\n <symbol id="write" class="icon" width="1em" height="1em" viewBox="0 0 512 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M330 137.9L374.1 182 233.7 322.4l-50.4 6.3 6.3-50.4L330 137.9zM425 199l17-17 36.1-36.1L512 112 478.1 78.1 433.9 33.9 400 0 366.1 33.9 330 70 313 87l-17 17L144 256l-9.9 78.9L128 384l49.1-6.1L256 368 408 216l17-17zm-17-50.9L363.9 104 400 67.9 444.1 112 408 148.1zM24 64L0 64 0 88 0 488l0 24 24 0 400 0 24 0 0-24 0-176 0-24-48 0 0 24 0 152L48 464l0-352 152 0 24 0 0-48-24 0L24 64z"/>\n </symbol>\n <symbol id="amazon" class="icon" width="1em" height="1em" viewBox="0 0 448 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M257.2 162.7c-48.7 1.8-169.5 15.5-169.5 117.5 0 109.5 138.3 114 183.5 43.2 6.5 10.2 35.4 37.5 45.3 46.8l56.8-56S341 288.9 341 261.4V114.3C341 89 316.5 32 228.7 32 140.7 32 94 87 94 136.3l73.5 6.8c16.3-49.5 54.2-49.5 54.2-49.5 40.7-.1 35.5 29.8 35.5 69.1zm0 86.8c0 80-84.2 68-84.2 17.2 0-47.2 50.5-56.7 84.2-57.8v40.6zm136 163.5c-7.7 10-70 67-174.5 67S34.2 408.5 9.7 379c-6.8-7.7 1-11.3 5.5-8.3C88.5 415.2 203 488.5 387.7 401c7.5-3.7 13.3 2 5.5 12zm39.8 2.2c-6.5 15.8-16 26.8-21.2 31-5.5 4.5-9.5 2.7-6.5-3.8s19.3-46.5 12.7-55c-6.5-8.3-37-4.3-48-3.2-10.8 1-13 2-14-.3-2.3-5.7 21.7-15.5 37.5-17.5 15.7-1.8 41-.8 46 5.7 3.7 5.1 0 27.1-6.5 43.1z"/>\n </symbol>\n <symbol id="amazon-music" class="icon" width="1em" height="1em" viewBox="0 0 512 311" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M25.49,211.74C34.86,206,44.28,201.29,54.8,200c11.25-1.44,22.43-1.53,31.17,7.71,4.59,4.86,4.59,4.82,10.41,1.53,11.44-6.45,23.5-10.3,36.87-9.85,16.56.56,27.66,11.23,27.76,27.72.14,24.28.06,48.55,0,72.83,0,5.33-1,6.32-6.43,6.54-2.79.11-5.58.1-8.37,0-5.58-.19-6.65-1.27-6.66-6.92q-.06-30.92,0-61.82a43.6,43.6,0,0,0-.94-9.34c-1.58-7.29-6-11.32-13.4-11.63-10.38-.43-19.91,2.64-29,7.4C93.53,225.53,94,227.76,94,230q0,33.53,0,67.06c0,1.57,0,3.15-.08,4.72-.16,2.66-1.7,4.33-4.26,4.47-4.34.23-8.72.23-13.07.06C73.37,306.15,72,304,71.94,301c-.1-4.37-.08-8.74-.08-13.1q0-24.88,0-49.78a70.58,70.58,0,0,0-.36-8.36c-1-8.24-6-12.82-14.32-13.06-9.25-.26-17.87,2.26-26.22,6.11-3.35,1.54-4.4,3.76-4.37,7.35.13,21.83.06,43.66.06,65.49,0,10.47-.36,10.83-10.88,10.83-11.24,0-11.24,0-11.24-11.44q0-42.18,0-84.35c0-7.62.52-8.12,7.94-8.14H13C22.41,202.52,22.41,202.52,25.49,211.74ZM106.54,8.45c-.15-5.56-1.13-6.55-6.83-6.73-2.26-.07-4.53,0-6.8,0-7.71.05-8.47.76-8.48,8.32q0,34.05,0,68.09c0,2.27,0,4.54.07,6.8.1,3.15,1.68,4.83,4.91,4.82,3.67,0,7.33,0,11,0,6.48,0,7.17-.73,7.18-7.29q0-22.51,0-45a24,24,0,0,1,2-10.68c1.78-3.7,4.85-5.27,9-5s6.31,2.56,7.4,6.25a28.68,28.68,0,0,1,1.11,8.26q-.07,23.57,0,47.13c0,5.5.85,6.28,6.41,6.38,2.79.05,5.58,0,8.37,0,7.6,0,8.35-.72,8.36-8.38,0-14.31,0-28.63,0-42.94,0-3.14-.14-6.31.83-9.35a10.23,10.23,0,0,1,10.78-7.28c4.69.6,6.85,3.34,7.2,9.27.15,2.44.2,4.88.21,7.33,0,14.83,0,29.67,0,44.51,0,5.9.91,6.75,6.58,6.83,3.32.05,6.63.06,9.95,0,5.59-.1,6.43-.91,6.5-6.36.07-5.24.07-10.47.07-15.71,0-15,.22-30-.1-45C192,11.28,186.21,4.12,175.79,1.17a23.69,23.69,0,0,0-26.28,9.3c-.65.92-.83,2.33-2.33,2.47-8.71-16.6-30-17-40.64-.91C106.54,10.19,106.56,9.32,106.54,8.45ZM257.7,302.5c.49,2.6,1.52,5,4.4,5.05,4.56,0,9.44,1.85,13.58-1.55.94-.78,1.1-2.16,1.16-3.39.08-1.4.1-2.79.1-4.19q0-42.67,0-85.34c0-1.57,0-3.15-.15-4.7-.3-3.06-1.92-4.75-5.13-4.72-3.83,0-7.67,0-11.51,0-3.17,0-4.8,1.77-5.12,4.79a43.45,43.45,0,0,0-.11,4.71q0,33,0,66c0,2.17.55,4.47-2,6-10,6.05-20.7,9.17-32.41,7.48A12.17,12.17,0,0,1,210.2,284a37.6,37.6,0,0,1-2-12.31q0-30.89,0-61.78c0-5.19-1-6.16-6.07-6.29-3.32-.08-6.63,0-9.94,0-3.65,0-5.42,1.77-5.41,5.48,0,24.78-.3,49.57.19,74.34.29,14.63,9.24,24,23.41,26.59,11.84,2.2,22.83-.6,33.45-5.43,4.24-1.93,8.24-4.4,12.58-6.75C256.88,299.58,257.42,301,257.7,302.5Zm209.07-295c.14-3.76-1.7-5.56-5.26-5.65q-6-.17-12,0c-3.23.1-5.12,1.5-5.11,5.16q.09,38.74,0,77.49c0,3.85,1.86,5.34,5.47,5.29s7.33,0,11,0c6.18-.06,7-.85,7-6.94q0-21.72,0-43.46a24.53,24.53,0,0,1,3.3-13A9.24,9.24,0,0,1,481,21.72c4.08.54,5.75,3.41,6.87,
37766.94a22.3,22.3,0,0,1,.63,6.74c0,10,0,19.9,0,29.85,0,6.28,0,12.56,0,18.85,0,3.21,1.06,5.54,4.69,5.59q7.33.11,14.65,0c2.75,0,4.09-1.57,4.08-4.34-.06-21,.29-41.9-.3-62.83C511.26,10.73,504.79,3.19,494.43,1,484.32-1.21,474.57.9,468.37,11.52a5.78,5.78,0,0,1-1.15,1.08C466.3,10.84,466.7,9.09,466.77,7.45ZM320.27,200.52c-13.84,3-24.22,13.09-25.55,25.06-1.63,14.67,5.26,25.8,19.86,32,1.76.75,3.56,1.41,5.34,2.1,7.14,2.78,14.32,5.44,21.39,8.39,3.22,1.34,6.19,3.23,7.65,6.74,3.14,7.54-1.44,15.49-10.3,17.81-8.51,2.24-17,.77-25.39-.47a95.42,95.42,0,0,1-13.15-3.29c-2.05-.61-4.62-1.38-6.12,1.17-2.94,5,.22,13.49,5.66,15.58a81.77,81.77,0,0,0,26,5.15c10.95.46,21.49-1.16,31.05-7.21,17.28-10.93,19.33-40.06-2.3-50.36-4.41-2.1-8.93-3.89-13.46-5.69-6.79-2.7-13.82-4.85-20.2-8.54-4.58-2.66-6.44-6.64-5.81-11.87.59-4.95,3.75-7.69,8.09-9.3a23.91,23.91,0,0,1,7.16-1.29,78.74,78.74,0,0,1,27.33,3.4c2.18.68,4.47,1.51,6.05-1.08,2.95-4.8.05-13.3-5.25-15.19a65.77,65.77,0,0,0-24.56-4.26A57.25,57.25,0,0,0,320.27,200.52Zm134,47.21c1.35-16,6.74-30.1,31-30.18A76.68,76.68,0,0,1,505.48,220c2,.52,3.8.73,5.1-1.27,3.38-5.25.4-13.95-5.43-16.07-9.38-3.42-19.11-3.82-28.89-3.13-21.33,1.5-37.45,14.85-42.88,35.48a80.56,80.56,0,0,0-1.14,35.79c2.78,14.71,9.38,27.1,23.43,34,15.28,7.46,31.22,7.8,47.34,3.08,8.53-2.49,9-3.27,8.9-12,0-6.76-1.06-7.54-7.85-5.8a70.45,70.45,0,0,1-19.59,2.65c-17.18-.5-26.17-8.24-29.52-25.12-.83-4.18-.56-8.34-.68-12.51C454.27,252.62,454.09,250.16,454.29,247.73ZM318,27.84c-7.51,10.7-14.59,21.75-22.71,32-5.69,7.17-7,14.81-6.65,23.43.21,4.8,2,8,7.86,4.87,8.28-4.37,17.54-5.86,26.86-5.3a60.71,60.71,0,0,1,23.13,5.87c3.5,1.69,5.67.32,6-3.63.28-3.12.11-6.28.08-9.42a8.09,8.09,0,0,0-5.18-7.77,52.63,52.63,0,0,0-16-4.67c-3.17-.35-6.32-.84-9.53-1.27.62-2.61,2-4,3.12-5.53,6.91-9.85,13.67-19.81,20.88-29.43a22.05,22.05,0,0,0,4.85-15.46c-.42-6.32-.61-6.85-7-6.87-13.6,0-27.21,0-40.81,0-11.6,0-11.6,0-11.35,11.55.13,6,.76,6.63,6.64,6.66,7.28,0,14.56,0,22.92,0C319.63,25.22,318.84,26.56,318,27.84ZM239.6,148.5c25-4.27,48.59-12.2,70.09-25.88a48.62,48.62,0,0,0,5.09-3.66c1.53-1.29,2.6-2.9,1.48-5-1-1.93-2.72-2.55-4.8-2.46s-3.68,1-5.46,1.7c-42.43,16.26-86.15,21.84-131.32,16.28A272.82,272.82,0,0,1,79.53,99.69c-2.3-1.22-5.17-4.1-7.36-1s1.41,4.85,3.43,6.52c37.49,31,80.89,45.52,128,46.42A214.41,214.41,0,0,0,239.6,148.5Zm70.83-44.06c-5.95-.47-11.75,1.28-17.68,1.27-1.4,0-3,.39-3.46-1.41-.44-1.56.54-2.69,1.77-3.46a40.61,40.61,0,0,1,5.41-3.13,57.16,57.16,0,0,1,34.68-3.83c6.68,1.32,8.39,3.29,7.78,10-1.17,13-5.47,24.75-14.21,34.65a24.74,24.74,0,0,1-3.1,2.76c-1.17.94-2.59,1.37-3.86.45-1.43-1-.7-2.49-.22-3.8,2.37-6.53,5-13,6.68-19.75,2.77-11.47,1.16-13.64-10.65-13.77Zm76.31,199.18c0,6.2,1,7.17,7.37,7.25,2.44,0,4.88,0,7.32,0,7.66,0,8.73-1.08,8.74-8.79q0-45,0-90c0-.88,0-1.75,0-2.62-.3-4.22-1.62-5.62-5.76-5.78-3.48-.13-7-.07-10.46,0-6.35.07-7.17.89-7.18,7.34q0,23,0,46.05Q386.73,280.33,386.74,303.62Zm-2.1-128.48c0-8.8,4.7-13.46,13.55-13.47s14.12,5.05,14.06,13.75c-.05,8.1-5.67,13.72-13.83,13.86C390,189.41,384.62,183.89,384.64,175.14ZM73.88,78.8c-3.26,2.63-6.43,5.37-9.58,8.12-2.51,2.19-4.93,2.39-7.38,0-1.11-1.1-2.3-2.14-3.34-3.31-3.8-4.31-3.79-4.34-8.6-.71-9,6.84-19.09,8-29.71,5-7-2-11.57-6.91-13.77-13.88C-3.29,58.71,3.64,44.41,18.59,38.76,25.16,36.27,32,35.32,39,34.81c7.55-.56,9.07-3.2,6.49-10.48-1.41-4-4.23-5.72-8.3-6-5.07-.3-9.37,1-11.95,5.73-3.41,6.28-3.36,6.26-10.67,5.24-2.41-.33-4.89-.21-7.3-.59-4-.65-4.92-2.08-4-6.12,2.22-9.49,8.39-15.55,17.2-18.9a47.3,47.3,0,0,1,28.26-2c14,3.31,20.29,11.06,20.74,25.53.17,5.58,0,11.17,0,16.76h0c0,3.49.12,7,0,10.48C69.28,61,70.07,67,74.67,72.08,76.83,74.46,76.43,76.75,73.88,78.8Zm-29.55-31c-4.73-1.36-14.5,2.06-17.54,6C23,58.78,23.92,68.42,28.47,71.3c5,3.14,11.68.61,15.15-5.79a26.24,26.24,0,0,0,2.8-11.77C45.71,51.91,47.88,48.85,44.33,47.82ZM278.14,79.48c-2.94,2.48-5.95,4.86-8.81,7.42s-5.27,2.21-7.72-.42c-1.18-1.28-2.76-2.32-3.56-3.8-2.25-4.13-4.37-3-7.2-.55-8.49,7.29-18.54,8.54-29,6.17s-17.09-11.72-16.3-23.66c0-13.09,6.76-22.18,19.61-26.48,7.16-2.4,14.64-3.11,22.07-3.79,4.16-.38,4.79-2.39,4.33-5.82-.85-6.32-3.23-9.35-8.09-10.06-6.6-1-11.34,1.21-13.58,7.05-1.49,3.91-3.81,5.19-7.59,4.3-3.09-.74-6.25-.58-9.35-1-4.67-.66-5.59-2.18
3776-4.39-6.71,1.93-7.32,6.14-13,12.86-16.37,13.39-6.65,27.11-7.32,40.8-.89,7.64,3.59,11.19,10,12,18.29,1.09,11.34.56,22.68.59,34,0,5.25.95,9.91,4.33,14.14C282.3,75.29,282,76.24,278.14,79.48ZM251.7,52.94c-.49-1.95,1-4.89-2.27-5.1-6.24-.4-12.37.46-16.84,5.33a12.41,12.41,0,0,0-2.41,13.62c1.31,3.37,3.59,5.61,7.31,5.78,5.34.23,8.7-2.83,11.24-7.15C251,61.51,250.9,57.07,251.7,52.94ZM432.28,45.6c0,8.85-1.67,17.35-5.93,25.17-7,12.81-17.75,19.57-32.4,18.88-14.31-.67-24.33-8.36-29.45-21.5-7.44-19.1-7.28-38.14,5.1-55.25,12.89-17.8,40.92-16.92,53.67,1C429.14,22.17,432.27,33.21,432.28,45.6ZM407.8,44.3a60.09,60.09,0,0,0-2.27-19.25c-1.3-4.24-4.08-6.87-8.54-7.39-4.09-.48-7.79,1.92-10,6.27a23.68,23.68,0,0,0-1.94,6.48,77.08,77.08,0,0,0-.87,18.26c.38,5.89.66,11.88,3.24,17.37,2.41,5.13,7.23,7.23,12.12,5.24,3.31-1.35,5-4.21,6.13-7.44C407.88,57.8,407.85,51.52,407.8,44.3Z"/>\n </symbol>\n <symbol id="apple" class="icon" width="1em" height="1em" viewBox="0 0 384 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M318.7 268.7c-.2-36.7 16.4-64.4 50-84.8-18.8-26.9-47.2-41.7-84.7-44.6-35.5-2.8-74.3 20.7-88.5 20.7-15 0-49.4-19.7-76.4-19.7C63.3 141.2 4 184.8 4 273.5q0 39.3 14.4 81.2c12.8 36.7 59 126.7 107.2 125.2 25.2-.6 43-17.9 75.8-17.9 31.8 0 48.3 17.9 76.4 17.9 48.6-.7 90.4-82.5 102.6-119.3-65.2-30.7-61.7-90-61.7-91.9zm-56.6-164.2c27.3-32.4 24.8-61.9 24-72.5-24.1 1.4-52 16.4-67.9 34.9-17.5 19.8-27.8 44.3-25.6 71.9 26.1 2 49.9-11.4 69.5-34.3z"/>\n </symbol>\n <symbol id="apple-music" class="icon" width="1em" height="1em" viewBox="0 0 384 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M381.9 388.2c-6.4 27.4-27.2 42.8-55.1 48-24.5 4.5-44.9 5.6-64.5-10.2-23.9-20.1-24.2-53.4-2.7-74.4 17-16.2 40.9-19.5 76.8-25.8 6-1.1 11.2-2.5 15.6-7.4 6.4-7.2 4.4-4.1 4.4-163.2 0-11.2-5.5-14.3-17-12.3-8.2 1.4-185.7 34.6-185.7 34.6-10.2 2.2-13.4 5.2-13.4 16.7 0 234.7 1.1 223.9-2.5 239.5-4.2 18.2-15.4 31.9-30.2 39.5-16.8 9.3-47.2 13.4-63.4 10.4-43.2-8.1-58.4-58-29.1-86.6 17-16.2 40.9-19.5 76.8-25.8 6-1.1 11.2-2.5 15.6-7.4 10.1-11.5 1.8-256.6 5.2-270.2 .8-5.2 3-9.6 7.1-12.9 4.2-3.5 11.8-5.5 13.4-5.5 204-38.2 228.9-43.1 232.4-43.1 11.5-.8 18.1 6 18.1 17.6 .2 344.5 1.1 326-1.8 338.5z"/>\n </symbol>\n <symbol id="backstage" class="icon" width="1em" height="1em" viewBox="0 0 403 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M361.79,198.41A96.56,96.56,0,0,0,377.85,186c.95-.92,1.85-1.83,2.75-2.75a99.36,99.36,0,0,0,9.47-11.21,75.39,75.39,0,0,0,7.54-12.87,58,58,0,0,0,5.2-19.59c1.78-23.17-11.94-46.21-42.53-64.79L237.09,0,93.49,137.68,0,227.32l129.67,78.76a133.1,133.1,0,0,0,69,19.6c29.76,0,58.27-10.51,79.31-30.69,22.88-21.94,30.47-50.33,16.36-73.93a59.26,59.26,0,0,0-8.12-10.6A105.93,105.93,0,0,0,309.26,213h.17a101.45,101.45,0,0,0,37-6.92A95.67,95.67,0,0,0,361.79,198.41ZM241.73,269.87c-23.07,22.12-60.18,25.37-90.39,7.05l-89.72-54.5,80.54-77.23,91.24,55.42C266.27,220.55,264.47,248.07,241.73,269.87Zm10.67-98.24L168,120.38l76.9-73.78,82.83,50.3c31,18.79,35,44.21,12.6,65.72A72.41,72.41,0,0,1,252.4,171.63Zm35.65,227c-23.37,22.4-55.13,34.75-89.41,34.75a147.65,147.65,0,0,1-76.54-21.74L0,337.57v29.48L129.67,445.8a133.12,133.12,0,0,0,69,19.62c29.76,0,58.27-10.52,79.31-30.69,15.38-14.75,23.88-32.42,23.5-49.58V383a104.51,104.51,0,0,1-13.4,15.69Zm0-46.6c-23.37,22.4-55.13,34.74-89.41,34.74a147.74,147.74,0,0,1-76.54-21.73L0,291v29.48l129.67,78.76a133.21,133.21,0,0,0,69,19.62c29.76,0,58.27-10.53,79.31-30.7,15.38-14.74,23.88-32.41,23.5-49.58v-2.13a105,105,0,0,1-13.4,15.69Zm0-46.6c-23.37,22.41-55.13,34.75-89.41,34.75a147.74,147.74,0,0,1-76.54-21.73L0,244.41V273.9l129.67,78.75a133.2,133.2,0,0,0,69,19.61c29.76,0,58.27-10.51,79.31-30.68,15.38-14.76,23.88-32.42,23.5-49.59v-2.18a103.18,103.18,0,0,1-13.4,15.73ZM388,336.21a112.41,112.41,0,0,1-71.88,30.9h0v32a97.46,97.46,0,0,0,61.78-26.73c16.72-16,25.24-33.59,25.07-50.95v-2.62a113.09,113.09,0,0,1-15,17.5Zm-99.94,109C264.68,467.61,232.92,480,198.64,480a147.65,147.65,0,0,1-76.54-21.74L0,384.15v29.49l129.67,78.74a133.21,133.21,0,0,0,69,19.62c29.76,0,58.27-10.51,79.31-30.7,15.38-14.74,23.88-32.41,23.5-49.57v-2.14a103.36,103.36,0,0,1-13.4,15.69Zm102.4-251.09c-.81.82-1.61,1.64-2.45,2.46a112.31,112.31,0,0,1-12.7,10.33,109.62,109.62,0,0,1-13.85,8.37,113,113,0,0,1-31.33,10.4,115.89,115.89,0,0,1-16.91,1.88c.59,1.92,1.07,3.88,1.49,5.86a63.88,63.88,0,0,1,1.36,14.33v11.55h.06a100.85,100.85,0,0,0,30.27-6.64,96.69,96.69,0,0,0,31.51-20.09c1-.92,1.79-1.87,2.7-2.8a97.46,97.46,0,0,0,9.47-11.21,76.09,76.09,0,0,0,7.54-12.83,57.86,57.86,0,0,0,5.16-19.66c.11-1.47.24-2.95.23-4.42v-2.41q-1.29,1.85-2.69,3.69A116.37,116.37,0,0,1,390.45,194.11Zm0,93.1c-.82.84-1.56,1.68-2.39,2.51a112.46,112.46,0,0,1-71.88,30.9h0v31.87h0A97.46,97.46,0,0,0,378,325.76a87.62,87.62,0,0,0,19.65-26.89,58,58,0,0,0,5.16-19.64c.11-1.48.24-3,.23-4.43v-2.62c-.88,1.28-1.74,2.57-2.71,3.83A112.63,112.63,0,0,1,390.45,287.21Zm0-46.6c-.82.84-1.56,1.68-2.39,2.51a115.7,115.7,0,0,1-26.58,18.7A114,114,0,0,1,316.18,274h0v31.91h0A97.51,97.51,0,0,0,378,279.16c1-.92,1.79-1.87,2.7-2.8a97.46,97.46,0,0,0,9.47-11.21,76,76,0,0,0,7.48-12.85,58.09,58.09,0,0,0,5.16-19.65c.11-1.48.24-3,.23-4.43v-2.63c-.88,1.29-1.74,2.58-2.71,3.85a113.65,113.65,0,0,1-9.84,11.19Z"/>\n </symbol>\n <symbol id="bands-town" class="icon" width="1em" height="1em" viewBox="0 0 512 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M136.52,102.39h102.4v136.54h-102.4V102.39ZM273.06,102.39h102.4v136.54h-102.4V102.39ZM409.6,0h102.4v238.92h-102.4V0ZM136.52,273.06v102.4h273.08v34.13H102.39V0H0v511.98h511.98v-238.92H136.52Z"/>\n </symbol>\n <symbol id="deezer" class="icon" width="1em" height="1em" viewBox="0 0 576 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M451.46,244.71H576V172H451.46Zm0-173.89v72.67H576V70.82Zm0,275.06H576V273.2H451.46ZM0,447.09H124.54V374.42H0Zm150.47,0H275V374.42H150.47Zm150.52,0H425.53V374.42H301Zm150.47,0H576V374.42H451.46ZM301,345.88H425.53V273.2H301Zm-150.52,0H275V273.2H150.47Zm0-101.17H275V172H150.47Z"/>\n </symbol>\n <symbol id="discord" class="icon" width="1em" height="1em" viewBox="0 0 640 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M524.531,69.836a1.5,1.5,0,0,0-.764-.7A485.065,485.065,0,0,0,404.081,32.03a1.816,1.816,0,0,0-1.923.91,337.461,337.461,0,0,0-14.9,30.6,447.848,447.848,0,0,0-134.426,0,309.541,309.541,0,0,0-15.135-30.6,1.89,1.89,0,0,0-1.924-.91A483.689,483.689,0,0,0,116.085,69.137a1.712,1.712,0,0,0-.788.676C39.068,183.651,18.186,294.69,28.43,404.354a2.016,2.016,0,0,0,.765,1.375A487.666,487.666,0,0,0,176.02,479.918a1.9,1.9,0,0,0,2.063-.676A348.2,348.2,0,0,0,208.12,430.4a1.86,1.86,0,0,0-1.019-2.588,321.173,321.173,0,0,1-45.868-21.853,1.885,1.885,0,0,1-.185-3.126c3.082-2.309,6.166-4.711,9.109
3776-7.137a1.819,1.819,0,0,1,1.9-.256c96.229,43.917,200.41,43.917,295.5,0a1.812,1.812,0,0,1,1.924.233c2.944,2.426,6.027,4.851,9.132,7.16a1.884,1.884,0,0,1-.162,3.126,301.407,301.407,0,0,1-45.89,21.83,1.875,1.875,0,0,0-1,2.611,391.055,391.055,0,0,0,30.014,48.815,1.864,1.864,0,0,0,2.063.7A486.048,486.048,0,0,0,610.7,405.729a1.882,1.882,0,0,0,.765-1.352C623.729,277.594,590.933,167.465,524.531,69.836ZM222.491,337.58c-28.972,0-52.844-26.587-52.844-59.239S193.056,219.1,222.491,219.1c29.665,0,53.306,26.82,52.843,59.239C275.334,310.993,251.924,337.58,222.491,337.58Zm195.38,0c-28.971,0-52.843-26.587-52.843-59.239S388.437,219.1,417.871,219.1c29.667,0,53.307,26.82,52.844,59.239C470.715,310.993,447.538,337.58,417.871,337.58Z"/>\n </symbol>\n <symbol id="instagram" class="icon" width="1em" height="1em" viewBox="0 0 448 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M224.1 141c-63.6 0-114.9 51.3-114.9 114.9s51.3 114.9 114.9 114.9S339 319.5 339 255.9 287.7 141 224.1 141zm0 189.6c-41.1 0-74.7-33.5-74.7-74.7s33.5-74.7 74.7-74.7 74.7 33.5 74.7 74.7-33.6 74.7-74.7 74.7zm146.4-194.3c0 14.9-12 26.8-26.8 26.8-14.9 0-26.8-12-26.8-26.8s12-26.8 26.8-26.8 26.8 12 26.8 26.8zm76.1 27.2c-1.7-35.9-9.9-67.7-36.2-93.9-26.2-26.2-58-34.4-93.9-36.2-37-2.1-147.9-2.1-184.9 0-35.8 1.7-67.6 9.9-93.9 36.1s-34.4 58-36.2 93.9c-2.1 37-2.1 147.9 0 184.9 1.7 35.9 9.9 67.7 36.2 93.9s58 34.4 93.9 36.2c37 2.1 147.9 2.1 184.9 0 35.9-1.7 67.7-9.9 93.9-36.2 26.2-26.2 34.4-58 36.2-93.9 2.1-37 2.1-147.8 0-184.8zM398.8 388c-7.8 19.6-22.9 34.7-42.6 42.6-29.5 11.7-99.5 9-132.1 9s-102.7 2.6-132.1-9c-19.6-7.8-34.7-22.9-42.6-42.6-11.7-29.5-9-99.5-9-132.1s-2.6-102.7 9-132.1c7.8-19.6 22.9-34.7 42.6-42.6 29.5-11.7 99.5-9 132.1-9s102.7-2.6 132.1 9c19.6 7.8 34.7 22.9 42.6 42.6 11.7 29.5 9 99.5 9 132.1s2.7 102.7-9 132.1z"/>\n </symbol>\n <symbol id="facebook" class="icon" width="1em" height="1em" viewBox="0 0 512 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M504 256C504 119 393 8 256 8S8 119 8 256c0 123.78 90.69 226.38 209.25 245V327.69h-63V256h63v-54.64c0-62.15 37-96.48 93.67-96.48 27.14 0 55.52 4.84 55.52 4.84v61h-31.28c-30.8 0-40.41 19.12-40.41 38.73V256h68.78l-11 71.69h-57.78V501C413.31 482.38 504 379.78 504 256z"/>\n </symbol>\n <symbol id="facebook-like" class="icon" width="1em" height="1em" viewBox="0 0 512 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M288.8 81.7c3.5-12.8 16.7-20.3 29.5-16.8s20.3 16.7 16.8 29.5l-4.5 16.4c-5.5 20.2-13.9 39.3-24.7 56.9c-3.1 4.9-3.2 11.1-.4 16.2s8.2 8.2 14 8.2H448c17.7 0 32 14.3 32 32c0 11.3-5.9 21.3-14.8 27c-7.2 4.6-9.5 13.9-5.3 21.3c2.6 4.6 4.1 10 4.1 15.7c0 12.4-7 23.1-17.3 28.5c-4.2 2.2-7.3 6.1-8.3 10.8s.1 9.5 3 13.2c4.2 5.4 6.7 12.2 6.7 19.5c0 14.2-9.2 26.3-22.1 30.4c-7.8 2.6-12.4 10.6-10.7 18.6c.5 2.2 .7 4.5 .7 6.9c0 17.7-14.3 32-32 32H294.5c-15.8 0-31.2-4.7-44.4-13.4l-38.5-25.7c-9-6-16.6-13.7-22.4-22.6c-4.9-7.4-14.8-9.4-22.2-4.6s-9.4 14.8-4.6 22.2c8.1 12.3 18.7 23.1 31.4 31.6l38.5 25.7c18.4 12.3 40 18.8 62.1 18.8H384c35.3 0 64-28.7 64-64l0-.6c19.1-11.1 32-31.7 32-55.4c0-8.7-1.8-17.1-4.9-24.7C487.9 323.6 496 306.8 496 288c0-6.5-1-12.8-2.8-18.7C504.8 257.7 512 241.7 512 224c0-35.3-28.7-64-64-64H346.4c6.2-13.1 11.3-26.7 15.1-40.9l4.5-16.4c8.1-29.8-9.5-60.6-39.3-68.8s-60.6 9.5-68.8 39.3l-4.5 16.4c-8.9 32.6-29.6 60.8-58.2 79l-3.1 2c-11.8 7.5-21.7 17.1-29.5 28.2c-5.1 7.2-3.3 17.2 4 22.3s17.2 3.3 22.3-4c5.4-7.7 12.2-14.4 20.4-19.5l3.1-2c35.3-22.4 60.9-57.2 71.9-97.5l4.5-16.4zM32 224H96V448H32V224zM0 224V448
3776c0 17.7 14.3 32 32 32H96c17.7 0 32-14.3 32-32V224c0-17.7-14.3-32-32-32H32c-17.7 0-32 14.3-32 32z"/>\n </symbol>\n <symbol id="facebook-like-solid" class="icon" width="1em" height="1em" viewBox="0 0 512 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M313.4 32.9c26 5.2 42.9 30.5 37.7 56.5l-2.3 11.4c-5.3 26.7-15.1 52.1-28.8 75.2H464c26.5 0 48 21.5 48 48c0 18.5-10.5 34.6-25.9 42.6C497 275.4 504 288.9 504 304c0 23.4-16.8 42.9-38.9 47.1c4.4 7.3 6.9 15.8 6.9 24.9c0 21.3-13.9 39.4-33.1 45.6c.7 3.3 1.1 6.8 1.1 10.4c0 26.5-21.5 48-48 48H294.5c-19 0-37.5-5.6-53.3-16.1l-38.5-25.7C176 420.4 160 390.4 160 358.3V320 272 247.1c0-29.2 13.3-56.7 36-75l7.4-5.9c26.5-21.2 44.6-51 51.2-84.2l2.3-11.4c5.2-26 30.5-42.9 56.5-37.7zM32 192H96c17.7 0 32 14.3 32 32V448c0 17.7-14.3 32-32 32H32c-17.7 0-32-14.3-32-32V224c0-17.7 14.3-32 32-32z"/>\n </symbol>\n <symbol id="facebook-messenger" class="icon" width="1em" height="1em" viewBox="0 0 512 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M256.55 8C116.52 8 8 110.34 8 248.57c0 72.3 29.71 134.78 78.07 177.94 8.35 7.51 6.63 11.86 8.05 58.23A19.92 19.92 0 0 0 122 502.31c52.91-23.3 53.59-25.14 62.56-22.7C337.85 521.8 504 423.7 504 248.57 504 110.34 396.59 8 256.55 8zm149.24 185.13l-73 115.57a37.37 37.37 0 0 1-53.91 9.93l-58.08-43.47a15 15 0 0 0-18 0l-78.37 59.44c-10.46 7.93-24.16-4.6-17.11-15.67l73-115.57a37.36 37.36 0 0 1 53.91-9.93l58.06 43.46a15 15 0 0 0 18 0l78.41-59.38c10.44-7.98 24.14 4.54 17.09 15.62z"/>\n </symbol>\n <symbol id="giphy" class="icon" width="1em" height="1em" viewBox="0 0 398 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M0,0V512H398V184.87l-56.88,56.92V455.13H56.88V56.92h99.48L213.2,0ZM227.44,0V170.67H398V113.79H341.12V56.92H284.28V0"/>\n </symbol>\n <symbol id="globe" class="icon" width="1em" height="1em" viewBox="0 0 512 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M352 256c0 22.2-1.2 43.6-3.3 64H163.3c-2.2-20.4-3.3-41.8-3.3-64s1.2-43.6 3.3-64H348.7c2.2 20.4 3.3 41.8 3.3 64zm28.8-64H503.9c5.3 20.5 8.1 41.9 8.1 64s-2.8 43.5-8.1 64H380.8c2.1-20.6 3.2-42 3.2-64s-1.1-43.4-3.2-64zm112.6-32H376.7c-10-63.9-29.8-117.4-55.3-151.6c78.3 20.7 142 77.5 171.9 151.6zm-149.1 0H167.7c6.1-36.4 15.5-68.6 27-94.7c10.5-23.6 22.2-40.7 33.5-51.5C239.4 3.2 248.7 0 256 0s16.6 3.2 27.8 13.8c11.3 10.8 23 27.9 33.5 51.5c11.6 26 20.9 58.2 27 94.7zm-209 0H18.6C48.6 85.9 112.2 29.1 190.6 8.4C165.1 42.6 145.3 96.1 135.3 160zM8.1 192H131.2c-2.1 20.6-3.2 42-3.2 64s1.1 43.4 3.2 64H8.1C2.8 299.5 0 278.1 0 256s2.8-43.5 8.1-64zM194.7 446.6c-11.6-26-20.9-58.2-27-94.6H344.3c-6.1 36.4-15.5 68.6-27 94.6c-10.5 23.6-22.2 40.7-33.5 51.5C272.6 508.8 263.3 512 256 512s-16.6-3.2-27.8-13.8c-11.3-10.8-23-27.9-33.5-51.5zM135.3 352c10 63.9 29.8 117.4 55.3 151.6C112.2 482.9 48.6 426.1 18.6 352H135.3zm358.1 0c-30 74.1-93.6 130.9-171.9 151.6c25.5-34.2 45.2-87.7 55.3-151.6H493.4z"/>\n </symbol>\n <symbol id="google-plus" class="icon" width="1em" height="1em" viewBox="0 0 640 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M386.061 228.496c1.834 9.692 3.143 19.384 3.143 31.956C389.204 370.205 315.599 448 204.8 448c-106.084 0-192-85.915-192-192s85.916-192 192-192c51.864 0 95.083 18.859 128.611 50.292l-52.126 50.03c-14.145-13.621-39.028-29.599-76.485-29.599-65.484 0-118.92 54.221-118.92 121.277 0 67.056 53.436 121.277 118.92 121.277 75.961 0 104.513-54.745 108.965-82.773H204.8v-66.009h181.261zm185.406 6.437V179.2h-56.001v55.733h-55.733v56.001h55.733v55.733h56.001v-55.733H627.2v-56.001h-55.733z"/>\n </symbol>\n <symbol id="mix-cloud" class="icon" width="1em" height="1em" viewBox="0 0 640 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M212.98 346.566H179.789V195.114L185.973 173.47H175.262L137.127 346.566H76.1069L37.7323 173.47H27.276L33.1913 195.114V346.566H0V165H65.6506L102.248 338.096H110.747L147.329 165H212.98L212.98 346.566ZM544.459 283.589L458.434 345.655V307.534L531.329 255.776L458.434 204.017V165.896L544.459 228.231H553.721L640 165.896V204.017L566.866 255.7
377676L640 307.549V345.655L553.721 283.589H544.459ZM430.157 272.311H248.113V239.255H430.157V272.311Z"/>\n </symbol>\n <symbol id="magic" class="icon" width="1em" height="1em" viewBox="0 0 448 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path fill="#6851ff" d="M224,0a632.54,632.54,0,0,0,77,75.31,585.47,585.47,0,0,0,0,361.38A632.54,632.54,0,0,0,224,512a632.54,632.54,0,0,0-77-75.31A582.93,582.93,0,0,0,175.54,256,582.93,582.93,0,0,0,147,75.31,632.54,632.54,0,0,0,224,0ZM93.67,397.2A653.77,653.77,0,0,0,0,345.49,291.55,291.55,0,0,0,14,256,291.55,291.55,0,0,0,0,166.51,653.77,653.77,0,0,0,93.67,114.8,583.43,583.43,0,0,1,110.93,256,583.43,583.43,0,0,1,93.67,397.2ZM337.07,256a583.43,583.43,0,0,0,17.26,141.2A653.77,653.77,0,0,1,448,345.49a292.82,292.82,0,0,1,0-179,653.77,653.77,0,0,1-93.67-51.71A583.43,583.43,0,0,0,337.07,256Z"/>\n </symbol>\n <symbol id="musically" class="icon" width="1em" height="1em" viewBox="0 0 512 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M256,0C114.62,0,0,114.61,0,256S114.61,512,256,512,512,397.39,512,256,397.38,0,256,0ZM398.21,303l-1.48.64v.72H340a34,34,0,0,1-33.93-33.93v-38a8,8,0,0,0-8-8h0a8,8,0,0,0-8,8v93a33.93,33.93,0,0,1-67.86,0V186.58a8,8,0,0,0-16.06,0v83.88a34,34,0,0,1-33.93,33.88h-57l-1.44-1.4v-23l1.44-1.41H172a8,8,0,0,0,8-8h0V186.58a33.93,33.93,0,1,1,67.85,0V325.46a8,8,0,0,0,16.06,0h0V232.39a33.93,33.93,0,0,1,67.86,0v38.07a8,8,0,0,0,8,8h56.69v.64l1.48.72Z"/>\n </symbol>\n <symbol id="pinterest" class="icon" width="1em" height="1em" viewBox="0 0 496 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M496 256c0 137-111 248-248 248-25.6 0-50.2-3.9-73.4-11.1 10.1-16.5 25.2-43.5 30.8-65 3-11.6 15.4-59 15.4-59 8.1 15.4 31.7 28.5 56.8 28.5 74.8 0 128.7-68.8 128.7-154.3 0-81.9-66.9-143.2-152.9-143.2-107 0-163.9 71.8-163.9 150.1 0 36.4 19.4 81.7 50.3 96.1 4.7 2.2 7.2 1.2 8.3-3.3.8-3.4 5-20.3 6.9-28.1.6-2.5.3-4.7-1.7-7.1-10.1-12.5-18.3-35.3-18.3-56.6 0-54.7 41.4-107.6 112-107.6 60.9 0 103.6 41.5 103.6 100.9 0 67.1-33.9 113.6-78 113.6-24.3 0-42.6-20.1-36.7-44.8 7-29.5 20.5-61.3 20.5-82.6 0-19-10.2-34.9-31.4-34.9-24.9 0-44.9 25.7-44.9 60.2 0 22 7.4 36.8 7.4 36.8s-24.5 103.8-29 123.2c-5 21.4-3 51.6-.9 71.2C65.4 450.9 0 361.1 0 256 0 119 111 8 248 8s248 111 248 248z"/>\n </symbol>\n <symbol id="snapchat" class="icon" width="1em" height="1em" viewBox="0 0 512 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M496.926,366.6c-3.373-9.176-9.8-14.086-17.112-18.153-1.376-.806-2.641-1.451-3.72-1.947-2.182-1.128-4.414-2.22-6.634-3.373-22.8-12.09-40.609-27.341-52.959-45.42a102.889,102.889,0,0,1-9.089-16.12c-1.054-3.013-1-4.724-.248-6.287a10.221,10.221,0,0,1,2.914-3.038c3.918-2.591,7.96-5.22,10.7-6.993,4.885-3.162,8.754-5.667,11.246-7.44,9.362-6.547,15.909-13.5,20-21.278a42.371,42.371,0,0,0,2.1-35.191c-6.2-16.318-21.613-26.449-40.287-26.449a55.543,55.543,0,0,0-11.718,1.24c-1.029.224-2.059.459-3.063.72.174-11.16-.074-22.94-1.066-34.534-3.522-40.758-17.794-62.123-32.674-79.16A130.167,130.167,0,0,0,332.1,36.443C309.515,23.547,283.91,17,256,17S202.6,23.547,180,36.443a129.735,129.735,0,0,0-33.281,26.783c-14.88,17.038-29.152,38.44-32.673,79.161-.992,11.594-1.24,23.435-1.079,34.533-1-.26-2.021-.5-3.051-.719a55.461,55.461,0,0,0-11.717-1.24c-18.687,0-34.125,10.131-40.3,26.449a42.423,42.423,0,0,0,2.046,35.228c4.105,7.774,10.652,14.731,20.014,21.278,2.48,1.736,6.361,4.24,11.246,7.44,2.641,1.711,6.5,4.216,10.28,6.72a11.054,11.054,0,0,1,3.3,3.311c.794,1.624.818,3.373-.36,6.6a102.02,102.02,0,0,1-8.94,15.785c-12.077,17.669-29.363,32.648-51.434,44.639C32.355,348.608,20.2,352.75,15.069,366.7c-3.868,10.528-1.339,22.506,8.494,32.6a49.137,49.137,0,0,0,12.4,9.387,134.337,134.337,0,0,0,30.342,12.139,20.024,20.024,0,0,1,6.126,2.741c3.583,3.137,3.075,7.861,7.849,14.78a34.468,34.468,0,0,0,8.977,9.127c10.019,6.919,21.278,7.353,33.207,7.811,10.776.41,22.989.881,36.939,5.481,5.778,1.91,11.78,5.605,18.736,9.92C194.842,480.951,217.707,495,255.973,495s61.292-14.123,78.118-24.428c6.907-4.24,12.872-7.9,18.489-9.758,13.949-4.613,26.163-5.072,36.939-5.481,11.928-.459,23.187-.893,33.206-7.812a34.584,34.584,0,0,0,10.218-11.16c3.434-5.84,3.348-9.919,6.572-12.771a18.971,18.971,0,0,1,5.753-2.629A134.893,134.893,0,0,0,476.02,408.71a48.344,48.344,0,0,0,13.019-10.193l.124-.149C498.389,388.5,500.708,376.867,496.926,366.6Zm-34.013,18.277c-20.745,11.458-34.533,10.23-45.259,17.137-9.114,5.865-3.72,18.513-10.342,23.076-8.134,5.617-32.177-.4-63.239,9.858-25.618,8.469-41.961,32.822-88.038,32.822s-62.036-24.3-88.076-32.884c-31-10.255-55.092-4.241-63.239-9.858-6.609-4.563-1.24-17.211-10.341-23.076-10.739-6.907-24.527-5.679-45.26-17.075-13.206-7.291-5.716-11.8-1.314-13.937,75.143-36.381,87.133-92.552,87.666-96.719.645-5.046,1.364-9.014-4.191-14.148-5.369-4.96-29.189-19.7-35.8-24.316-10.937-7.638-15.748-15.264-12.2-24.638,2.48-6.485,8.531-8.928,14.879-8.928a27.643,27.643,0,0,1,5.965.67c12,2.6,23.659,8.617,30.392,10.242a10.749,10.749,0,0,0,2.48.335c3.6,0,4.86-1.811,4.612-5.927-.768-13.132-2.628-38.725-.558-62.644,2.84-32.909,13.442-49.215,26.04-63.636,6.051-6.932,34.484-36.976,88.857-36.976s82.88,29.92,88.931,36.827c12.611,14.421,23.225,30.727,26.04,63.636,2.071,23.919.285,49.525-.558,62.644-.285,4.327,1.017,5.927,4.613,5.927a10.648,10.648,0,0,0,2.48-.335c6.745-1.624,18.4-7.638,30.4-10.242a27.641,27.641,0,0,1,5.964-.67c6.386,0,12.4,2.48,14.88,8.928,3.546,9.374-1.24,17-12.189,24.639-6.609,4.612-30.429,19.343-35.8,24.315-5.568,5.134-4.836,9.1-4.191,14.149.533,4.228,12.511,60.4,87.666,96.718C468.629,373.011,476.119,377.524,462.913,384.877Z"/>\n </symbol>\n <symbol id="soundcloud" class="icon" width="1em" height="1em" viewBox="0 0 640 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M111.4 256.3l5.8 65-5.8 68.3c-.3 2.5-2.2 4.4-4.4 4.4s-4.2-1.9-4.2-4.4l-5.6-68.3 5.6-65c0-2.2 1.9-4.2 4.2-4.2 2.2 0 4.1 2 4.4 4.2zm21.4-45.6c-2.8 0-4.7 2.2-5 5l-5 105.6 5 68.3c.3 2.8 2.2 5 5 5 2.5 0 4.7-2.2 4.7-5l5.8-68.3-5.8-105.6c0-2.8-2.2-5-4.7-5zm25.5-24.1c-3.1 0-5.3 2.2-5.6 5.3l-4.4 130 4.4 67.8c.3 3.1 2.5 5.3 5.6 5.3 2.8 0 5.3-2.2 5.3-5.3l5.3-67.8-5.3-130c0-3.1-2.5-5.3-5.3-5.3zM7.2 283.2c-1.4 0-2.2 1.1-2.5 2.5L0 321.3l4.7 35c.3 1.4 1.1 2.5 2.5 2.5s2.2-1.1 2.5-2.5l5.6-35-5.6-35.6c-.3-1.4-1.1-2.5-2.5-2.5zm23.6-21.9c-1.4 0-2.5 1.1-2.5 2.5l-6.4 57.5 6.4 56.1c0 1.7 1.1 2.8 2.5 2.8s2.5-1.1 2.8-2.5l7.2-56.4-7.2-57.5c-.3-1.4-1.4-2.5-2.8-2.5zm25.3-11.4c-1.7 0-3.1 1.4-3.3 3.3L47 321.3l5.8 65.8c.3 1.7 1.7 3.1 3.3 3.1 1.7 0 3.1-1.4 3.1-3.1l6.9-65.8-6.9-68.1c0-1.9-1.4-3.3-3.1-3.3zm25.3-2.2c-1.9 0-3.6 1.4-3.6 3.6l-5.8 70 5.8 67.8c0 2.2 1.7 3.6 3.6 3.6s3.6-1.4 3.9-3.6l6.4-67.8-6.4-70c-.3-2.2-2-3.6-3.9-3.6zm241.4-110.9c-1.1-.8-2.8-1.4-4.2-1.4-2.2 0-4.2.8-5.6 1.9-1.9 1.7-3.1 4.2-3.3 6.7v.8l-3.3 176.7 1.7 32.5 1.7 31.7c.3 4.7 4.2 8.6 8.9 8.6s8.6-3.9 8.6-8.6l3.9-64.2-3.9-177.5c-.4-3-2-5.8-4.5-7.2zm-26.7 15.3c-1.4-.8-2.8-1.4-4.4-1.4s-3.1.6-4.4 1.4c-2.2 1.4-3.6 3.9-3.6 6.7l-.3 1.7-2.8 160.8s0 .3 3.1 65.6v.3c0 1.7.6 3.3 1.7 4.7 1.7 1.9 3.9 3.1 6.4 3.1 2.2 0 4.2-1.1 5.6-2.5 1.7-1.4 2.5-3.3 2.5-5.6l.3-6.7 3.1-58.6-3.3-162.8c-.3-2.8-1.7-5.3-3.9-6.7zm-111.4 22.5c-3.1 0-5.8 2.8-5.8 6.1l-4.4 140.6 4.4 67.2c.3 3.3 2.8 5.8 5.8 5.8 3.3 0 5.8-2.5 6.1-5.8l5-67.2-5-140.6c-.2-3.3-2.7-6.1-6.1-6.1zm376.7 62.8c-10.8 0-21.1 2.2-30.6 6.1-6.4-70.8-65.8-126.4-138.3-126.4-17.8 0-35 3.3-50.3 9.4-6.1 2.2-7.8 4.4-7.8 9.2v249.7c0 5 3.9 8.6 8.6 9.2h218.3c43.3 0 78.6-35 78.6-78.3.1-43.6-35.2-78.9-78.5-78.9zm-296.7-60.3c-4.2 0-7.5 3.3-7.8 7.8l-3.3 136.7 3.3 65.6c.3 4.2 3.6 7.5 7.8 7.5 4.2 0 7.5-3.3 7.5-7.5l3.9-65.6-3.9-136.7c-.3-4.5-3.3-7.8-7.5-7.8zm-53.6-7.8c-3.3 0-6.4 3.1-6.4 6.7l-3.9 145.3 3.9 66.9c.3 3.6 3.1 6.4 6.4 6.4 3.6 0 6.4-2.8 6.7-6.4l4.4-66.9-4.4-145.3c-.3-3.6-3.1-6.7-6.7-6.7zm26.7 3.4c-3.9 0-6.9 3.1-6.9 6.9L227 321.3l3.9 66.4c.3 3.9 3.1 6.9 6.9 6.9s6.9-3.1 6.9-6.9l4.2-66.4-4.2-141.7c0-3.9-3-6.9-6.9-6.9z"/>\n </symbol>\n <symbol id="spotify" class="icon" width="1em" height="1em" viewBox="0 0 512 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M248 8C111.1 8 0 119.1 0 256s111.1 248 248 248 248-111.1 248-248S384.9 8 248 8zm100.7 364.9c-4.2 0-6.8-1.3-10.7-3.6-62.4-37.6-135-39.2-206.7-24.5-3.9 1-9 2.6-11.9 2.6-9.7 0-15.8-7.7-15.8-15.8 0-10.3 6.1-15.2 13.6-16.8 81.9-18.1 165.6-16.5 237 26.2 6.1 3.9 9.7 7.4 9.7 16.5s-7.1 15.4-15.2 15.4zm26.9-65.6c-5.2 0-8.7-2.3-12.3-4.2-62.5-37-155.7-51.9-238.6-29.4-4.8 1.3-7.4 2.6-11.9 2.6-10.7 0-19.4-8.7-19.4-19.4s5.2-17.8 15.5-20.7c27.8-7.8 56.2-13.6 97.8-13.6 64.9 0 127.6 16.1 177 45.5 8.1 4.8 11.3 11 11.3 19.7-.1 10.8-8.5 19.5-19.4 19.5zm31-76.2c-5.2 0-8.4-1.3-12.9-3.9-71.2-42.5-198.5-52.7-280.9-29.7-3.6 1-8.1 2.6-12.9 2.6-13.2 0-23.3-10.3-23.3-23.6 0-13.6 8.4-21.3 17.4-23.9 35.2-10.3 74.6-15.2 117.5-15.2 73 0 149.5 15.2 205.4 47.8 7.8 4.5 12.9 10.7 12.9 22.6 0 13.6-11 23.3-23.2 23.3z"/>\n </symbol>\n <symbol id="tiktok" class="icon" width="1em" height="1em" viewBox="0 0 448 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M448,209.91a210.06,210.06,0,0,1-122.77-39.25V349.38A162.55,162.55,0,1,1,185,188.31V278.2a74.62,74.62,0,1,0,52.23,71.18V0l88,0a121.18,121.18,0,0,0,1.86,22.17h0A122.18,122.18,0,0,0,381,102.39a121.43,121.43,0,0,0,67,20.14Z"/>\n </symbol>\n <symbol id="twitch" class="icon" width="1em" height="1em" viewBox="0 0 512 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">
3776\n <path d="M391.2 103.5H352.5v109.7h38.6zM285 103H246.4V212.8H285zM120.8 0 24.3 91.4V420.6H140.1V512l96.5-91.4h77.3L487.7 256V0zM449.1 237.8l-77.2 73.1H294.6l-67.6 64v-64H140.1V36.6H449.1z"/>\n </symbol>\n <symbol id="youtube" class="icon" width="1em" height="1em" viewBox="0 0 576 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M549.655 124.083c-6.281-23.65-24.787-42.276-48.284-48.597C458.781 64 288 64 288 64S117.22 64 74.629 75.486c-23.497 6.322-42.003 24.947-48.284 48.597-11.412 42.867-11.412 132.305-11.412 132.305s0 89.438 11.412 132.305c6.281 23.65 24.787 41.5 48.284 47.821C117.22 448 288 448 288 448s170.78 0 213.371-11.486c23.497-6.321 42.003-24.171 48.284-47.821 11.412-42.867 11.412-132.305 11.412-132.305s0-89.438-11.412-132.305zm-317.51 213.508V175.185l142.739 81.205-142.739 81.201z"/>\n </symbol>\n <symbol id="youtube-music" class="icon" width="1em" height="1em" viewBox="0 0 512 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M256,0C397.38,0,512,114.62,512,256S397.38,512,256,512,0,397.38,0,256,114.62,0,256,0Zm0,133.82c67.2,0,122.18,54.69,122.18,122.18a122.18,122.18,0,0,1-244.36,0c0-67.49,55-122.18,122.18-122.18m0-11.64A133.82,133.82,0,1,0,389.82,256,133.84,133.84,0,0,0,256,122.18ZM209.45,322.91l113.46-69.82-113.46-64Z"/>\n </symbol>\n <symbol id="vimeo" class="icon" width="1em" height="1em" viewBox="0 0 448 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M403.2 32H44.8C20.1 32 0 52.1 0 76.8v358.4C0 459.9 20.1 480 44.8 480h358.4c24.7 0 44.8-20.1 44.8-44.8V76.8c0-24.7-20.1-44.8-44.8-44.8zM377 180.8c-1.4 31.5-23.4 74.7-66 129.4-44 57.2-81.3 85.8-111.7 85.8-18.9 0-34.8-17.4-47.9-52.3-25.5-93.3-36.4-148-57.4-148-2.4 0-10.9 5.1-25.4 15.2l-15.2-19.6c37.3-32.8 72.9-69.2 95.2-71.2 25.2-2.4 40.7 14.8 46.5 51.7 20.7 131.2 29.9 151 67.6 91.6 13.5-21.4 20.8-37.7 21.8-48.9 3.5-33.2-25.9-30.9-45.8-22.4 15.9-52.1 46.3-77.4 91.2-76 33.3.9 49 22.5 47.1 64.7z"/>\n </symbol>\n <symbol id="tidal" class="icon" width="1em" height="1em" viewBox="0 0 640 428" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M320.32,0,213.55,107,106.77,0,0,107,106.77,214,213.55,107,320.32,214,213.55,321,320.32,428,427.09,321,320.32,214,427.09,107ZM427.79,107,533.89.67,640,107,533.89,213.33Z"/>\n </symbol>\n <symbol id="threads" class="icon" width="1em" height="1em" viewBox="0 0 448 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M331.5 235.7c2.2 .9 4.2 1.9 6.3 2.8c29.2 14.1 50.6 35.2 61.8 61.4c15.7 36.5 17.2 95.8-30.3 143.2c-36.2 36.2-80.3 52.5-142.6 53h-.3c-70.2-.5-124.1-24.1-160.4-70.2c-32.3-41-48.9-98.1-49.5-169.6V256v-.2C17 184.3 33.6 127.2 65.9 86.2C102.2 40.1 156.2 16.5 226.4 16h.3c70.3 .5 124.9 24 162.3 69.9c18.4 22.7 32 50 40.6 81.7l-40.4 10.8c-7.1-25.8-17.8-47.8-32.2-65.4c-29.2-35.8-73-54.2-130.5-54.6c-57 .5-100.1 18.8-128.2 54.4C72.1 146.1 58.5 194.3 58 256c.5 61.7 14.1 109.9 40.3 143.3c28 35.6 71.2 53.9 128.2 54.4c51.4-.4 85.4-12.6 113.7-40.9c32.3-32.2 31.7-71.8 21.4-95.9c-6.1-14.2-17.1-26-31.9-34.9c-3.7 26.9-11.8 48.3-24.7 64.8c-17.1 21.8-41.4 33.6-72.7 35.3c-23.6 1.3-46.3-4.4-63.9-16c-20.8-13.8-33-34.8-34.3-59.3c-2.5-48.3 35.7-83 95.2-86.4c21.1-1.2 40.9-.3 59.2 2.8c-2.4-14.8-7.3-26.6-14.6-35.2c-10-11.7-25.6-17.7-46.2-17.8H227c-16.6 0-39 4.6-53.3 26.3l-34.4-23.6c19.2-29.1 50.3-45.1 87.8-45.1h.8c62.6 .4 99.9 39.5 103.7 107.7l-.2 .2zm-156 68.8c1.3 25.1 28.4 36.8 54.6 35.3c25.6-1.4 54.6-11.4 59.5-73.2c-13.2-2.9-27.8-4.4-43.4-4.4c-4.8 0-9.6 .1-14.4 .4c-42.9 2.4-57.2 23.2-56.2 41.8l-.1 .1z"/>\n </symbol>\n <symbol id="tumblr" class="icon" width="1em" height="1em" viewBox="0 0 320 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M309.8 480.3c-13.6 14.5-50 31.7-97.4 31.7-120.8 0-147-88.8-147-140.6v-144H17.9c-5.5 0-10-4.5-10-10v-68c0-7.2 4.5-13.6 11.3-16 62-21.8 81.5-76 84.3-117.1.8-11 6.5-16.3 16.1-16.3h70.9c5.5 0 10 4.5 10 10v115.2h83c5.5 0 10 4.4 10 9.9v81.7c0 5.5-4.5 10-10 10h-83.4V360c0 34.2 23.7 53.6 68 35.8 4.8-1.9 9-3.2 12.7-2.2 3.5.9 5.8 3.4 7.4 7.9l22 64.3c1.8 5 3.3 10.6-.4 14.5z"/>\n </symbol>\n <symbol id="vevo" class="icon" width="1em" height="1em" viewBox="0 0 640 161" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M559.38,0A80.5,80.5,0,1,0,640,80.5h0A80.56,80.56,0,0,0,559.38,0Zm0,118.07c-20.16,0-34.94-16.1-34.94-37.57s14.79-37.57,34.94-37.57S594.31,59,594.31,80.5,579.53,118.07,559.38,118.07ZM322.88,80.5C322.88,36,288,0,244.94,0S167,36,167,80.5,201.94,161,246.29,161c35.42,0,63.2-21.38,72.44-51H271.82c-6.51,9.61-16.08,12.07-25.53,12.07-18.13,0-29.69-12.46-33.31-29.51H322a82.8,82.8,0,0,0,.88-12.08ZM244.94,37.57c15.55,0,27.61,10.69,31.3,26.83H213.58C217.77,47.63,228.9,37.57,244.94,37.57ZM89.07,159.66,0,4.7H52.44L89.07,75.13,125.7,4.7h52.44Zm311.75,0L311.74,4.7h52.45l36.63,70.43L437.45,4.7h52.44Z"/>\n </symbol>\n <symbol id="vk" class="icon" width="1em" height="1em" viewBox="0 0 448 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M31.4907 63.4907C0 94.9813 0 145.671 0 247.04V264.96C0 366.329 0 417.019 31.4907 448.509C62.9813 480 113.671 480 215.04 480H232.96C334.329 480 385.019 480 416.509 448.509C448 417.019 448 366.329 448 264.96V247.04C448 145.671 448 94.9813 416.509 63.4907C385.019 32 334.329 32 232.96 32H215.04C113.671 32 62.9813 32 31.4907 63.4907ZM75.6 168.267H126.747C128.427 253.76 166.133 289.973 196 297.44V168.267H244.16V242C273.653 238.827 304.64 205.227 315.093 168.267H363.253C359.313 187.435 351.46 205.583 340.186 221.579C328.913 237.574 314.461 251.071 297.733 261.227C316.41 270.499 332.907 283.63 346.132 299.751C359.357 315.873 369.01 334.618 374.453 354.747H321.44C316.555 337.262 306.614 321.61 292.865 309.754C279.117 297.899 262.173 290.368 244.16 288.107V354.747H238.373C136.267 354.747 78.0267 284.747 75.6 168.267Z"/>\n </symbol>\n <symbol id="weibo" class="icon" width="1em" height="1em" viewBox="0 0 512 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M407 177.6c7.6-24-13.4-46.8-37.4-41.7-22 4.8-28.8-28.1-7.1-32.8 50.1-10.9 92.3 37.1 76.5 84.8-6.8 21.2-38.8 10.8-32-10.3zM214.8 446.7C108.5 446.7 0 395.3 0 310.4c0-44.3 28-95.4 76.3-143.7C176 67 279.5 65.8 249.9 161c-4 13.1 12.3 5.7 12.3 6 79.5-33.6 140.5-16.8 114 51.4-3.7 9.4 1.1 10.9 8.3 13.1 135.7 42.3 34.8 215.2-169.7 215.2zm143.7-146.3c-5.4-55.7-78.5-94-163.4-85.7-84.8 8.6-148.8 60.3-143.4 116s78.5 94 163.4 85.7c84.8-8.6 148.8-60.3 143.4-116zM347.9 35.1c-25.9 5.6-16.8 43.7 8.3 38.3 72.3-15.2
3776134.8 52.8 111.7 124-7.4 24.2 29.1 37 37.4 12 31.9-99.8-55.1-195.9-157.4-174.3zm-78.5 311c-17.1 38.8-66.8 60-109.1 46.3-40.8-13.1-58-53.4-40.3-89.7 17.7-35.4 63.1-55.4 103.4-45.1 42 10.8 63.1 50.2 46 88.5zm-86.3-30c-12.9-5.4-30 .3-38 12.9-8.3 12.9-4.3 28 8.6 34 13.1 6 30.8.3 39.1-12.9 8-13.1 3.7-28.3-9.7-34zm32.6-13.4c-5.1-1.7-11.4.6-14.3 5.4-2.9 5.1-1.4 10.6 3.7 12.9 5.1 2 11.7-.3 14.6-5.4 2.8-5.2 1.1-10.9-4-12.9z"/>\n </symbol>\n <symbol id="x-twitter" class="icon" width="1em" height="1em" viewBox="0 0 512 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor">\n <path d="M389.2 48h70.6L305.6 224.2 487 464H345L233.7 318.6 106.5 464H35.8L200.7 275.5 26.8 48H172.4L272.9 180.9 389.2 48zM364.4 421.8h39.1L151.1 88h-42L364.4 421.8z"/>\n </symbol>\n</svg>\n')}dataURItoBlobUrl(t){const e=new Blob([t],{type:"image/svg+xml"});return URL.createObjectURL(e)}svgStyles(){let t={};return this.size&&(t={...t,"--umg-font-size":(0,c.R)(this.size)}),t}iconClasses(){const t={};return"spinner"===this.icon&&(t.spinner=!0),t}icontemplate(){return r.JW` 3777 <svg part="icon-svg icon-image" height="1em" width="1em"> 3778 <use href="${this._blobUrl}#${this.icon}"></use> 3779 </svg> 3780 `}render(){return r.qy` 3781 <span part="icon-container" class="icon${(0,l.H)(this.iconClasses())}" style="${(0,n.W)(this.svgStyles())}"> 3782 ${this.icontemplate()} 3783 </span> 3784 `}};p.styles=(0,m.Z)([d.S,r.AH` 3785 .icon { 3786 display: flex; 3787 align-items: center; 3788 justify-content: center; 3789 font-size: var(--umg-font-size); 3790 height: fit-content; 3791 width: fit-content; 3792 color: var(--umg-color-icon-text, var(--umg-color-base-text, rgb(0,0,0))); 3793 } 3794 @supports (color: rgb(from white r g b)) { 3795 .icon { 3796 color: rgb(from var(--umg-color-icon-text, var(--umg-color-base-text, rgb(0,0,0))) r g b / alpha); 3797 } 3798 3799 } 3800 .icon { 3801 color: rgb(var(--umg-color-icon-text, var(--umg-color-base-text, 0,0,0))); 3802 } 3803 .spinner svg { 3804 animation-name: spin; 3805 animation-duration: 500ms; 3806 animation-timing-function: cubic-bezier(0, 0, 1, 1); 3807 animation-iteration-count: infinite; 3808 animation-direction: both; 3809 } 3810 @keyframes spin {to{transform: rotate(1turn)}}; 3811 `]),(0,o.C)([(0,a.MZ)()],p.prototype,"icon",void 0),(0,o.C)([(0,a.MZ)()],p.prototype,"size",void 0),(0,o.C)([(0,a.MZ)({state:!0})],p.prototype,"_blobUrl",void 0),p=(0,o.C)([(0,s.E)(`${h}-icon`)],p)},9846(t,e,i){var o=i(8472),r=i(2618),s=i(6505),a=i(9563),n=i(31),l=i(3720),d=i(9924),c=i(4379),u=i(8698),m=i(2609);const{prefix:h}=u.W;let p=class extends r.WF{constructor(){super(...arguments),this.imgAlt="",this.width=100,this.height=100,this.fit="contain",this.load="lazy"}dispatchEvents(){const t=this.width/this.height,e=new CustomEvent("media-details",{detail:{mediaAspectRatio:t,mobileMediaAspectRatio:t},bubbles:!0,composed:!0});this.dispatchEvent(e)}containerClasses(){const t={};return t["image-fit--"+this.fit]=!("none"===this.fit||!this.fit),t}imageClasses(){const t={};return t["image-fit"]=!("none"===this.fit||!this.fit),t["image-fit--"+this.fit]=!("none"===this.fit||!this.fit),t}image(){return this.src?r.qy` 3812 <img 3813 part="image" 3814 class="image ${(0,l.H)(this.imageClasses())}" 3815 width="${this.width}" 3816 height="${this.height}" 3817 src="${(0,n.J)(this.src)}" 3818 srcset="${(0,n.J)(this.srcSet)}" 3819 sizes="${(0,n.J)(this.sizes)}" 3820 alt="${this.imgAlt}" 3821 loading="${this.load}" 3822 fetchPriority=${(0,n.J)(this.prefetch)} 3823 > 3824 `:r.qy` 3825 <div 3826 class="placeholder image image--desktop${(0,l.H)(this.imageClasses())}" 3827 style="aspect-ratio: ${this.width/this.height}" 3828 > 3829 <div part="placeholder-inner" class="placeholder-inner"> 3830 <svg class="icon" xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 448 512" fill="currentcolor"> 3831 <path d="M0 96C0 60.7 28.7 32 64 32H384c35.3 0 64 28.7 64 64V416c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V96z"/> 3832 </svg> 3833 </div> 3834 </div> 3835 `}render(){return this.dispatchEvents(),r.qy` 3836 <div 3837 class="image-container${(0,l.H)(this.imageClasses())}" 3838 part="image-container" 3839 > 3840 ${this.image()} 3841 </div> 3842 `}};p.styles=(0,m.Z)([d.S,c.o,r.AH` 3843 :host { 3844 display: block; 3845 height: 100%; 3846 } 3847 .image-container { 3848 display: flex; 3849 justify-content: center; 3850 align-items: center; 3851 height: 100%; 3852 } 3853 .image-container.image-fit--cover, 3854 .image-container.image-fit--contain { 3855 width: 100%; 3856 } 3857 .image { 3858 display: block; 3859 height: auto; 3860 max-width: 100%; 3861 } 3862 .placeholder { 3863 overflow: hidden; 3864 height: 100%; 3865 width: 100%; 3866 min-width: var(--umg-size-image-placeholder, 7rem); 3867 } 3868 3869 /* Image fit */ 3870 .image.image-fit { 3871 height: 100%; 3872 width: 100%; 3873 max-width: initial; 3874 } 3875 .image.image-fit--cover { 3876 object-fit: cover; 3877 } 3878 .image.image-fit--contain { 3879 object-fit: contain; 3880 } 3881 `]),(0,o.C)([(0,a.M)()],p.prototype,"imgAlt",void 0),(0,o.C)([(0,a.M)()],p.prototype,"src",void 0),(0,o.C)([(0,a.M)()],p.prototype,"srcSet",void 0),(0,o.C)([(0,a.M)()],p.prototype,"sizes",void 0),(0,o.C)([(0,a.M)({type:Number})],p.prototype,"width",void 0),(0,o.C)([(0,a.M)({type:Number})],p.prototype,"height",void 0),(0,o.C)([(0,a.M)()],p.prototype,"fit",void 0),(0,o.C)([(0,a.M)({type:String})],p.prototype,"load",void 0),(0,o.C)([(0,a.M)()],p.prototype,"prefetch",void 0),p=(0,o.C)([(0,s.E)(`${h}-image`)],p)},4792(t,e,i){var o=i(8472),r=i(2618),s=i(6505),a=i(9563),n=i(3720),l=i(9924),d=i(328),c=i(8698),u=i(2609);const{prefix:m}=c.W;let h=class extends r.WF{constructor(){super(...arguments),this.spacing="normal",this.justify="start",this.noWrap=!1,this.stack=!1,this.mobileStack=!1}groupClasses(){const t={};return t["group-spacing--"+this.spacing]=!0,t["group--no-wrap"]=this.noWrap,t["group--stack"]=this.stack,t["group--mobile-stack"]=this.mobileStack,this.stack?t["group-align--"+this.justify]=!0:t["group-justify--"+this.justify]=!0,this.mobileStack?t["group-mobile-align--"+this.mobileJustify]=!0:this.mobileJustify?t["group-mobile-justify--"+this.mobileJustify]=!0:t["group-mobile-justify--"+this.justify]=!0,t}render(){return r.qy` 3882 <div 3883 part="link-group" 3884 class="link-group${(0,n.H)(this.groupClasses())}" 3885 > 3886 <slot></slot> 3887 </div> 3888 `}};h.styles=(0,u.Z)([l.S,d.Xv,d.Oh,d.rw,d.yw,d.jt,r.AH` 3889 3890 :host([noWrap]) { 3891 display: block; 3892 width: 100%; 3893 } 3894 .link-group { 3895 display: flex; 3896 flex-wrap: wrap; 3897 width: 100%; 3898 } 3899 3900 /** Prevent link wrapping */ 3901 .group--no-wrap { 3902 flex-wrap: nowrap; 3903 overflow-y: auto; 3904 max-width: 100%; 3905 scrollbar-color: rgb(var(--umg-color-base-text, 0,0,0), 0.1) rgb(var(--umg-color-base-text, 0,0,0), 0.05);; 3906 scrollbar-width: thin; 3907 padding: var(--umg-space-8) 0; 3908 } 3909 3910 /** Force vertical stacking */ 3911 @media screen and (max-width: 48rem) { 3912 .group--mobile-stack:not(.group--no-wrap) { 3913 flex-direction: column; 3914 } 3915 } 3916 @media screen and (min-width: 48.06rem) { 3917 .group--stack:not(.group--no-wrap) { 3918 flex-direction: column; 3919 } 3920 } 3921 `]),(0,o.C)([(0,a.M)()],h.prototype,"spacing",void 0),(0,o.C)([(0,a.M)()],h.prototype,"justify",void 0),(0,o.C)([(0,a.M)()],h.prototype,"mobileJustify",void 0),(0,o.C)([(0,a.M)({type:Boolean})],h.prototype,"noWrap",void 0),(0,o.C)([(0,a.M)({type:Boolean})],h.prototype,"stack",void 0),(0,o.C)([(0,a.M)({type:Boolean})],h.prototype,"mobileStack",void 0),h=(0,o.C)([(0,s.E)(`${m}-link-group`)],h)},2648(t,e,i){var o=i(8472),r=i(2618),s=i(6505),a=i(9563),n=i(31),l=i(3720),d=i(9924),c=i(8698),u=i(2609);const{prefix:m}=c.W;let h=class extends r.WF{constructor(){super(...arguments),this.url=void 0,this.target="_self",this.underline=!1}linkClasses(){return{"link--underline":this.underline}}render(){return r.qy` 3922 <a part="link" 3923 href="${(0,n.J)(this.url)}" 3924 class="link${(0,l.H)(this.linkClasses())}" 3925 target="${this.target}" 3926 > 3927 <slot part="label"></slot> 3928 <slot name="label" part="label"></slot> 3929 </a> 3930 `}};h.shadowRootOptions={...r.WF.shadowRootOptions,delegatesFocus:!0},h.styles=(0,u.Z)([d.S,r.AH` 3931 :host { 3932 display: inline-block; 3933 } 3934 .link { 3935 color: inherit; 3936 text-underline-offset: 0.3rem; 3937 display: inline-flex; 3938 align-items: center; 3939 gap: 0.5rem; 3940 flex-wrap: nowrap; 3941 white-space: nowrap; 3942 } 3943 .link ::slotted(umg-icon) { 3944 padding-top: 2px; 3945 } 3946 .link:not(.link--underline) { 3947 text-decoration: none; 3948 } 3949 .link:not(.link--underline):hover { 3950 text-decoration: underline; 3951 } 3952 /* Underline */ 3953 .link--underline { 3954 text-decoration: underline; 3955 } 3956 .link--underline:hover { 3957 text-decoration: none; 3958 } 3959 `]),(0,o.C)([(0,a.M)()],h.prototype,"url",void 0),(0,o.C)([(0,a.M)()],h.prototype,"target",void 0),(0,o.C)([(0,a.M)({type:Boolean})],h.prototype,"underline",void 0),h=(0,o.C)([(0,s.E)(`${m}-link`)],h)},2010(t,e,i){var o=i(8472),r=i(2618),s=i(6505),a=i(9563),n=i(31),l=i(3720),d=i(1145),c=i(9924),u=i(8698),m=i(2609);i(9846);const{prefix:h}=u.W;let p=class extends r.WF{constructor(){super(...arguments),this.url="/",this.height=80,this.title="Logo Title",this.alt="",this.showTitle=!1,this.imgWidth=80,this.imgHeight=80}logoStyles(){let t={};return t={...t,"--umg-size-logo-height":this.height/16+"rem"},t}logoClasses(){return{"logo--show-title":this.showTitle}}titleClasses(){return{"visually-hidden":!this.showTitle}}image(){return this.imgSrc?r.qy` 3960 <umg-image 3961 part="logo-image" 3962 exportparts="image" 3963 class="logo__image" 3964 imgAlt=${this.alt} 3965 src="${(0,n.J)(this.imgSrc)}" 3966 width=${this.imgWidth} 3967 height=${this.imgHeight} 3968 srcSet="${(0,n.J)(this.imgSrcSet)}" 3969 sizes="${(0,n.J)(this.imgSizes)}" 3970 lazy="lazy" 3971 > 3972 </umg-image> 3973 `:r.qy` 3974 <svg class="logo__image placeholder" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" role="presentation" aria-hidden="true" focusable="false" fill="currentColor"> 3975 <path d="M469.33,512H42.67A42.79,42.79,0,0,1,0,469.33V42.67A42.79,42.79,0,0,1,42.67,0H469.33A42.79,42.79,0,0,1,512,42.67V469.33A42.79,42.79,0,0,1,469.33,512Z"/> 3976 </svg> 3977 `}render(){return r.qy` 3978 <h1 3979 part="logo" 3980 class="logo${(0,l.H)(this.logoClasses())}" 3981 style=${(0,d.W)(this.logoStyles())} 3982 > 3983 <a href="${this.url}"> 3984 ${this.image()}
3985 <span part="logo-title" class="logo-title ${(0,l.H)(this.titleClasses())}"> 3986 ${this.title} 3987 </span> 3988 </a> 3989 </h1> 3990 `}};p.styles=(0,m.Z)([c.S,r.AH` 3991 :host { 3992 display: block; 3993 } 3994 .placeholder { 3995 display: block; 3996 height: 100%; 3997 width: 100%; 3998 color: var(--umg-color-skeleton-background, 230, 230, 230); 3999 4000 } 4001 @supports (color: rgb(from white r g b)) { 4002 .placeholder { 4003 color: rgb(from var(--umg-color-skeleton-background, rgb(230, 230, 230)) r g b / alpha); 4004 } 4005 } 4006 .logo { 4007 display: flex; 4008 align-items: center; 4009 color: inherit; 4010 margin: 0; 4011 height: var(--umg-size-logo-height); 4012 line-height: 1; 4013 } 4014 .logo a { 4015 display: block; 4016 color: inherit; 4017 text-decoration: none; 4018 height: 100%; 4019 } 4020 .logo-title:not(.visually-hidden) { 4021 display: inline-block; 4022 font-family: var(--umg-font-logo-family, var(--umg-font-heading-family, 'Roboto Serif', Times, 'Times New Roman', Georgia, serif)); 4023 font-size: var(--umg-font-logo-size, 1.75rem); 4024 } 4025 4026 @media only screen and (max-width: 48rem) { 4027 .logo { 4028 height: var(--umg-size-mobile-logo-height, calc(var(--umg-size-logo-height, 5rem) / 1.25)); 4029 } 4030 } 4031 4032 /* Hide image for title */ 4033 .logo--show-title { 4034 line-height: inherit; 4035 } 4036 .logo--show-title .logo__image { 4037 display: none; 4038 } 4039 .logo--show-title a { 4040 height: auto; 4041 } 4042 `]),(0,o.C)([(0,a.M)()],p.prototype,"url",void 0),(0,o.C)([(0,a.M)({type:Number})],p.prototype,"height",void 0),(0,o.C)([(0,a.M)()],p.prototype,"title",void 0),(0,o.C)([(0,a.M)()],p.prototype,"alt",void 0),(0,o.C)([(0,a.M)({type:Boolean})],p.prototype,"showTitle",void 0),(0,o.C)([(0,a.M)({type:String})],p.prototype,"imgSrc",void 0),(0,o.C)([(0,a.M)({type:String})],p.prototype,"imgSrcSet",void 0),(0,o.C)([(0,a.M)({type:String})],p.prototype,"imgSizes",void 0),(0,o.C)([(0,a.M)({type:Number})],p.prototype,"imgWidth",void 0),(0,o.C)([(0,a.M)({type:Number})],p.prototype,"imgHeight",void 0),p=(0,o.C)([(0,s.E)(`${h}-logo`)],p)},5448(t,e,i){var o=i(8472),r=i(2618),s=i(6505),a=i(9563),n=i(31),l=i(3720),d=(i(3919),i(1682),i(9924));const c=r.AH` 4043 4044 @media screen and (min-width: 48.06rem ) { 4045 .media-text__grid { 4046 display: grid; 4047 grid-template-columns: repeat(12, [start] 1fr); 4048 } 4049 4050 /* Media size by height */ 4051 .media-text__grid.media-height { 4052 display: flex; 4053 } 4054 .media-text__grid.media-height .media-text__media { 4055 flex: 1 1 40%; 4056 } 4057 .media-text__grid.media-height .media-text__content { 4058 flex: 1 1 60%; 4059 } 4060 .media-text__grid.media-height--xsmall { 4061 height: 15rem; 4062 } 4063 .media-text__grid.media-height--small { 4064 height: 20rem; 4065 } 4066 .media-text__grid.media-height--medium { 4067 height: 25rem; 4068 } 4069 .media-text__grid.media-height--large { 4070 height: 30rem; 4071 } 4072 .media-text__grid.media-height--xlarge { 4073 height: 37rem; 4074 } 4075 4076 /* Media width sizing */ 4077 .media-text__grid--2xlarge .media-text__media { 4078 grid-column: start / span 8; 4079 } 4080 .media-text__grid--xlarge .media-text__media { 4081 grid-column: start / span 7; 4082 } 4083 .media-text__grid--large .media-text__media { 4084 grid-column: start / span 6; 4085 } 4086 .media-text__grid--medium .media-text__media { 4087 grid-column: start / span 5; 4088 } 4089 .media-text__grid--small .media-text__media { 4090 grid-column: start / span 4; 4091 } 4092 .media-text__grid--xsmall .media-text__media { 4093 grid-column: start / span 3; 4094 } 4095 .media-text__grid--2xlarge.media-right .media-text__media { 4096 grid-column: span 7; 4097 } 4098 .media-text__grid--xlarge.media-right .media-text__media { 4099 grid-column: span 7; 4100 } 4101 .media-text__grid--large.media-right .media-text__media { 4102 grid-column: span 6; 4103 } 4104 .media-text__grid--medium.media-right .media-text__media { 4105 grid-column: span 5; 4106 } 4107 .media-text__grid--small.media-right .media-text__media { 4108 grid-column: span 4; 4109 } 4110 .media-text__grid--xsmall.media-right .media-text__media { 4111 grid-column: span 3; 4112 } 4113 4114 /* Text content width sizing */ 4115 .media-text__grid--2xlarge .media-text__content { 4116 grid-column: span 4; 4117 } 4118 .media-text__grid--xlarge .media-text__content { 4119 grid-column: span 5; 4120 } 4121 .media-text__grid--large .media-text__content { 4122 grid-column: span 6; 4123 } 4124 .media-text__grid--medium .media-text__content { 4125 grid-column: span 7; 4126 } 4127 .media-text__grid--small .media-text__content { 4128 grid-column: span 8; 4129 } 4130 .media-text__grid--xsmall .media-text__content { 4131 grid-column: span 9; 4132 } 4133 .media-text__grid--2xlarge.media-right .media-text__content { 4134 grid-column: start / span 4; 4135 } 4136 .media-text__grid--xlarge.media-right .media-text__content { 4137 grid-column: start / span 5; 4138 } 4139 .media-text__grid--large.media-right .media-text__content { 4140 grid-column: start / span 6; 4141 } 4142 .media-text__grid--medium.media-right .media-text__content { 4143 grid-column: start / span 7; 4144 } 4145 .media-text__grid--small.media-right .media-text__content { 4146 grid-column: start / span 8; 4147 } 4148 .media-text__grid--xsmall.media-right .media-text__content { 4149 grid-column: start / span 9; 4150 } 4151 } 4152 4153`;var u=i(8698),m=i(2609);const{prefix:h}=u.W;let p=class extends r.WF{constructor(){super(...arguments),this.setSizeBy="width",this.mediaHeight="adapt",this.mediaWidth="medium",this.mediaOnRight=!1,this.blendMedia=!1,this.alignContent="center",this.mobileAlignContent="center",this.justifyContent="center",this.mobileJustifyContent="center",this.spacing="8",this.adaptivePadding=!1}gridClasses(){const t={};return t["media-text__grid--"+this.mediaWidth]="width"===this.setSizeBy,t["media-height--"+this.mediaHeight]="height"===this.setSizeBy,t["media-height"]="height"===this.setSizeBy,t["media-right"]=this.mediaOnRight,t["media-blend"]=this.blendMedia,t}contentStackClasses(){const t={};return t["align--"+this.alignContent]=!0,t["justify--"+this.justifyContent]=!0,t["mobile-justify--"+this.mobileJustifyContent]=!0,t["mobile-align--"+this.mobileAlignContent]=!0,t}mobileGap(){if(this.spacing)return.75*Number(this.spacing)}render(){return r.qy` 4154 <div 4155 part="media-text" 4156 class="media-text" 4157 > 4158 <div 4159 part="media-text-grid" 4160 class="media-text__grid${(0,l.H)(this.gridClasses())}" 4161 > 4162 <div 4163 part="media-content" 4164 class="media-text__media" 4165 > 4166 <slot name="media"></slot> 4167 </div> 4168 <div 4169 part="text-content" 4170 class="media-text__content" 4171 > 4172 <umg-box 4173 part="media-text-inner" 4174 exportparts="box,box-content" 4175 class="media-text__content-inner" 4176 padding="${(0,n.J)(this.padding)}" 4177 mobilePadding="${(0,n.J)(this.mobilePadding)}" 4178 paddingTop="${(0,n.J)(this.paddingTop)}" 4179 paddingLeft="${(0,n.J)(this.paddingLeft)}" 4180 paddingRight="${(0,n.J)(this.paddingRight)}" 4181 paddingBottom="${(0,n.J)(this.paddingBottom)}" 4182 ?adaptivePadding=${this.adaptivePadding} 4183 width="fill" 4184 > 4185 <umg-vertical-stack 4186 part="media-text-stack" 4187 exportparts="vertical-stack" 4188 class="media-text__content-stack${(0,l.H)(this.contentStackClasses())}" 4189 spacing=${this.spacing} 4190 mobileSpacing=${(0,n.J)(this.mobileGap())} 4191 justify="${this.alignContent}" 4192 align="${this.justifyContent}" 4193 mobileJustify="${this.mobileAlignContent}" 4194 mobileAlign="${this.mobileJustifyContent}" 4195 > 4196 <slot name="content"></slot> 4197 </umg-vertical-stack> 4198 </umg-box> 4199 </div> 4200 </div> 4201 </div> 4202 `}};p.styles=(0,m.Z)([d.S,c,r.AH` 4203 :host { 4204 display: block; 4205 width: 100%; 4206 } 4207 4208 /* Height set by value */ 4209 .media-text__grid.media-height { 4210 overflow: hidden; 4211 } 4212 4213 /** Prevent extended clicks outside the container */ 4214 .media-text, 4215 .media-text__media { 4216 position: relative 4217 } 4218 4219 /* Content position */ 4220 .media-text__grid.media-right div:first-child { 4221 order: 1; 4222 } 4223 .media-text__grid.media-right div:last-child { 4224 order: 2; 4225 } 4226 4227 @media screen and (min-width: 48.06rem) { 4228 .media-text__grid.media-right div:first-child { 4229 order: 2; 4230 } 4231 .media-text__grid.media-right div:last-child { 4232 order: 1; 4233 } 4234 } 4235
4236 /* Background colour */ 4237 .media-text__media { 4238 background-color: var(--umg-color-media-text-background); 4239 } 4240 @supports (color: rgb(from white r g b)) { 4241 .media-text__media { 4242 background-color: rgb(from var(--umg-color-media-text-background) r g b / alpha); 4243 } 4244 } 4245 .media-text__content { 4246 --umg-color-base-background: var(--umg-color-media-text-background); 4247 } 4248 @supports (color: rgb(from white r g b)) { 4249 .media-text__content { 4250 --umg-color-base-background: rgb(from var(--umg-color-media-text-background) r g b / alpha); 4251 } 4252 } 4253 4254 /* Blend content color with media */ 4255 .media-text__grid.media-blend .media-text__media { 4256 background-color: var(--umg-color-media-text-background, var(--umg-color-base-background)); 4257 } 4258 @supports (color: rgb(from white r g b)) { 4259 .media-text__grid.media-blend .media-text__media { 4260 background-color: rgb(from var(--umg-color-media-text-background, var(--umg-color-base-background)) r g b / alpha); 4261 } 4262 } 4263 4264 @media only screen and (min-width: 48.06rem) { 4265 .media-text__grid.media-blend .media-text__media ::slotted(*) { 4266 mask-image: linear-gradient(to right, rgb(0,0,0) 0 70%, transparent 100%); 4267 } 4268 .media-text__grid.media-blend.media-right .media-text__media ::slotted(*) { 4269 mask-image: linear-gradient(to left, rgb(0,0,0) 0 70%, transparent 100%); 4270 } 4271 } 4272 @media only screen and (max-width: 48rem) { 4273 .media-text__grid.media-blend .media-text__media ::slotted(*) { 4274 mask-image: linear-gradient(to bottom, rgb(0,0,0) 0 70%, transparent 100%); 4275 } 4276 } 4277 4278 /* Content */ 4279 .media-text__content { 4280 display: flex; 4281 width: auto; 4282 } 4283 4284 /* Text content alignment */ 4285 @media screen and (min-width: 48.06rem) { 4286 .justify--start { 4287 text-align: left; 4288 } 4289 .justify--center { 4290 text-align: center; 4291 } 4292 .justify--end { 4293 text-align: right; 4294 } 4295 } 4296 @media screen and (max-width: 48rem) { 4297 .mobile-align--start { 4298 text-align: left; 4299 } 4300 .mobile-align--center { 4301 text-align: center; 4302 } 4303 .mobile-align--end { 4304 text-align: right; 4305 } 4306 } 4307 4308 /* Normalise heights in grid layouts */ 4309 @media screen and (max-width: 48.06rem) { 4310 .media-text, 4311 .media-text__grid { 4312 height: 100%; 4313 } 4314 .media-text__grid { 4315 display: flex; 4316 flex-direction: column; 4317 justify-content: stretch; 4318 } 4319 .media-text__grid > div:last-child { 4320 display: flex;flex: 1 0 auto; 4321 } 4322 } 4323 4324 /* Desktop */ 4325 @media screen and (min-width: 48.06rem) { 4326 /* Media left/right position */ 4327 .media-right .media-text__container { 4328 flex-direction: row-reverse; 4329 } 4330 } 4331 `]),(0,o.C)([(0,a.M)()],p.prototype,"setSizeBy",void 0),(0,o.C)([(0,a.M)()],p.prototype,"mediaHeight",void 0),(0,o.C)([(0,a.M)()],p.prototype,"mediaWidth",void 0),(0,o.C)([(0,a.M)({type:Boolean})],p.prototype,"mediaOnRight",void 0),(0,o.C)([(0,a.M)({type:Boolean})],p.prototype,"blendMedia",void 0),(0,o.C)([(0,a.M)()],p.prototype,"alignContent",void 0),(0,o.C)([(0,a.M)()],p.prototype,"mobileAlignContent",void 0),(0,o.C)([(0,a.M)()],p.prototype,"justifyContent",void 0),(0,o.C)([(0,a.M)()],p.prototype,"mobileJustifyContent",void 0),(0,o.C)([(0,a.M)()],p.prototype,"spacing",void 0),(0,o.C)([(0,a.M)({type:Boolean})],p.prototype,"adaptivePadding",void 0),(0,o.C)([(0,a.M)()],p.prototype,"padding",void 0),(0,o.C)([(0,a.M)()],p.prototype,"mobilePadding",void 0),(0,o.C)([(0,a.M)()],p.prototype,"paddingTop",void 0),(0,o.C)([(0,a.M)()],p.prototype,"paddingRight",void 0),(0,o.C)([(0,a.M)()],p.prototype,"paddingBottom",void 0),(0,o.C)([(0,a.M)()],p.prototype,"paddingLeft",void 0),p=(0,o.C)([(0,s.E)(`${h}-media-text`)],p)},4322(t,e,i){var o=i(8472),r=i(2618),s=i(6505),a=i(9563),n=i(3720),l=i(31),d=(i(3919),i(4792),i(9924)),c=i(8698),u=i(2609);const{prefix:m}=c.W;let h=class extends r.WF{constructor(){super(...arguments),this.sticky=!1,this.spacing="normal",this.justify="start",this.mobileJustify="start"}menuClasses(){const t={};return t.sticky=this.sticky,t}render(){return r.qy` 4332 <nav part="menu-bar" class="menu-bar${(0,n.H)(this.menuClasses())}"> 4333 <umg-box 4334 part="menu-bar-container" 4335 exportparts="box,box-content" 4336 class="menu-bar__inner" 4337 padding="${(0,l.J)(this.padding)}" 4338 > 4339 <umg-link-group 4340 part="menu-bar-list" 4341 exportparts="link-group" 4342 spacing="${this.spacing}" 4343 justify="${this.justify}" 4344 mobileJustify="${this.mobileJustify}" 4345 noWrap 4346 > 4347 <slot name="link"></slot> 4348 </umg-link-group> 4349 </umg-box> 4350 </nav> 4351 `}};h.styles=(0,u.Z)([d.S,r.AH` 4352 :host([sticky]) { 4353 position: sticky; 4354 top: 0; 4355 z-index: 499; 4356 } 4357 :host([border]) { 4358 border-bottom-width: 0.0625rem; 4359 border-bottom-style: solid; 4360 border-bottom-color: rgb(var(--umg-color-base-text, rgb(255,255,255))); 4361 } 4362 @supports (color: rgb(from white r g b)) { 4363 :host { 4364 border-bottom-color: rgb(from var(--umg-color-base-text, rgb(255,255,255) r g b)) 4365 } 4366 } 4367 :host { 4368 display: block; 4369 margin: auto; 4370 width: 100%; 4371 color: var(--umg-color-box-text); 4372 background-color: var(--umg-color-box-background); 4373 } 4374 @supports (color: rgb(from white r g b)) { 4375 :host { 4376 color: rgb(from var(--umg-color-box-text) r g b); 4377 background-color: rgb(from var(--umg-color-box-background) r g b / alpha); 4378 } 4379 } 4380 4381 .menu-bar { 4382 display: flex; 4383 justify-content: center; 4384 position: sticky; 4385 top:0; 4386 margin: 0 auto; 4387 max-width: var(--umg-size-screen-max-width, 75rem); 4388 width: 100%; 4389 } 4390 4391 .menu-bar__inner { 4392 max-width: var(--umg-size-content-max-width); 4393 } 4394 4395 ::slotted(*) { 4396 letter-spacing: 0.07rem; 4397 } 4398 4399 ::slotted(umg-link:last-child) { 4400 margin-right: var(--umg-space-8, 0.5rem); 4401 } 4402 `]),(0,o.C)([(0,a.M)({type:Boolean})],h.prototype,"sticky",void 0),(0,o.C)([(0,a.M)()],h.prototype,"spacing",void 0),(0,o.C)([(0,a.M)()],h.prototype,"justify",void 0),(0,o.C)([(0,a.M)()],h.prototype,"mobileJustify",void 0),(0,o.C)([(0,a.M)()],h.prototype,"padding",void 0),h=(0,o.C)([(0,s.E)(`${m}-menu-bar`)],h)},8218(t,e,i){var o=i(8472),r=i(2618),s=i(6505),a=i(9563),n=i(7621),l=i(1145),d=i(3720),c=i(9924),u=i(8698),m=i(2609);i(5840);const{prefix:h}=u.W;let p=class extends r.WF{constructor(){super(),this.src="",this.layout="extended",this.vertical=!1,this.hideMenuTitle=!1,this.submenuWidth="page-width",this._handleOverlayEvents=()=>{this.groupId&&this._updateOverlayState()},this._outsideClick=t=>{t.composedPath().includes(this)||this._closeDisclosures()},this.addEventListener("umg-disclosure:opened",this._handleMenuEvents),this.addEventListener("umg-disclosure:closed",this._handleMenuEvents)}disconnectedCallback(){this.groupId||window.removeEventListener("click",this._outsideClick),this._menus&&this._menus.length&&this._menus.forEac
4402h(t=>{t.removeEventListener("umg-disclosure:opened",this._handleOverlayEvents),t.removeEventListener("umg-disclosure:closed",this._handleOverlayEvents)}),super.disconnectedCallback()}async firstUpdated(){void 0===this.data&&this.src&&await this.fetchData()}updated(t){super.updated(t),(t.has("groupId")||t.has("data"))&&(this._menus&&this._menus.length&&this._menus.forEach(t=>{t.removeEventListener("umg-disclosure:opened",this._handleOverlayEvents),t.removeEventListener("umg-disclosure:closed",this._handleOverlayEvents)}),this.groupId&&this._menus&&this._menus.length&&(this._menus.forEach(t=>{t.addEventListener("umg-disclosure:opened",this._handleOverlayEvents),t.addEventListener("umg-disclosure:closed",this._handleOverlayEvents)}),this._updateOverlayState()))}async fetchData(){this.data=await fetch(this.src).then(t=>t.json()),this.requestUpdate()}_handleMenuEvents(t){if(this.groupId)return;const e=t.detail.target;"umg-disclosure:opened"===t.type&&this._menus&&this._menus.length&&this._menus.forEach(t=>{t!==e&&t.disclosureClose()}),"umg-disclosure:opened"!==t.type&&"umg-disclosure:closed"!==t.type||this._updateOverlayState()}_updateOverlayState(){let t=!1;this._menus&&this._menus.length&&this._menus.forEach(e=>{e.getDisclosureOpenState()&&(t=!0)}),t?(this.dispatchEvent(new CustomEvent("umg-overlay:opened",{bubbles:!0,composed:!0})),this.groupId||window.addEventListener("click",this._outsideClick)):(this.dispatchEvent(new CustomEvent("umg-overlay:closed",{bubbles:!0,composed:!0})),this.groupId||window.removeEventListener("click",this._outsideClick))}_closeDisclosures(){this._menus&&this._menus.length&&this._menus.forEach(t=>{t.disclosureClose()}),this.dispatchEvent(new CustomEvent("umg-overlay:closed",{bubbles:!0,composed:!0})),window.removeEventListener("click",this._outsideClick)}menuStyles(){let t={};return"full-width"===this.submenuWidth&&(t={...t,"--umg-size-content-max-width":"100%"}),t}menuClasses(){const t={};return"compact"===this.layout&&(t["menu--compact"]=!0),t}menuListClasses(){const t={};return this.vertical&&"compact"!==this.layout&&(t["menu-list--vertical"]=!0),"extended"===this.layout&&(t["menu-list--extended"]=!0),"compact"===this.layout&&(t["menu-list--compact"]=!0),t}menuTitle(t){return"extended"!==this.layout||this.hideMenuTitle?r.s6:r.qy` 4403 <li part="menu-title" class="menu__title"> 4404 <span part="menu-title-text"> 4405 ${t} 4406 </span> 4407 </li> 4408 `}menuItemClasses(t){if(Array.isArray(t)&&t.length)return t.join(" ")}menuList(){if(this.data)return r.qy` 4409 <nav> 4410 <ul 4411 part="menu" 4412 class="menu${(0,d.H)(this.menuClasses())}" 4413 style="${(0,l.W)(this.menuStyles())}" 4414 > 4415 ${this.data.map(t=>r.qy`<li part="main-menu-item">${t.subItems?r.qy` 4416 <umg-disclosure 4417 part="menu-disclosure" 4418 class="menu-disclosure" 4419 detailsWidth=${"extended"===this.layout?"fill":"fit-content"} 4420 overlay 4421 groupId=${this.groupId||r.s6} 4422 > 4423 <span part="main-menu-item-title ${this.activeUrl===t.linkUrl?"menu-active":""}" class="summary menu__main-title ${this.activeUrl===t.linkUrl?"active":""}" slot="summary"> 4424 ${t.linkText} 4425 </span> 4426 <span part="main-menu-item-icon" class="summary-icon" slot="icon"> 4427 <umg-icon 4428 part="icon" 4429 exportparts="icon-svg" 4430 icon="chevron-down" 4431 size="xsmall" 4432 > 4433 </umg-icon> 4434 </span> 4435 <div 4436 part="menu-panel" 4437 class="menu__container${(0,d.H)(this.menuListClasses())}" 4438 slot="content" 4439 > 4440 <ul part="menu-list" class="menu__list"> 4441 ${this.menuTitle(t.linkText)} 4442 ${t.subItems.map(t=>r.qy`<li part="menu-item"slot="items">${t.subItems?r.qy` 4443 <div part="submenu" class="submenu">
4444 <span part="submenu-title" class="submenu__title"> 4445 ${t.linkText} 4446 </span> 4447 <ul part="submenu-list" class="submenu__list"> 4448 ${t.subItems.map(t=>r.qy`<li part="submenu-item"slot="items"><a part="submenu-link"class="submenu__link"href="${t.linkUrl}">${t.linkText}</a></li>`)} 4449 </ul> 4450 </div> 4451 `:r.qy` 4452 <a part="submenu-link" class="menu__link" href="${t.linkUrl}"> 4453 ${t.linkText} 4454 </a> 4455 `}</li>`)} 4456 </ul> 4457 </div> 4458 </umg-disclosure> 4459 `:r.qy` 4460 <a part="menu-link ${this.activeUrl===t.linkUrl?"menu-active":""}" class="menu__link ${this.activeUrl===t.linkUrl?"active":""} ${this.menuItemClasses(t.linkClasses)}" href="${t.linkUrl}"> 4461 ${t.linkText} 4462 </a> 4463 `}</li>`)} 4464 </ul> 4465 </nav> 4466 `}render(){return r.qy` 4467 ${this.menuList()} 4468 `}};p.styles=(0,m.Z)([c.S,r.AH` 4469 .menu { 4470 display: flex; 4471 gap: var(--umg-space-8, 0.5rem); 4472 align-items: center; 4473 font-family: var(--umg-font-menu-family, inherit); 4474 font-size: var(--umg-font-menu-size, inherit); 4475 letter-spacing: 0.05rem; 4476 list-style: none; 4477 margin: 0; 4478 padding: 0; 4479 color: var(--umg-color-base-text, rgb(0,0,0)); 4480 --umg-space-summary-padding: 0; 4481 --umg-space-details-padding: 0; 4482 } 4483 @supports (color: rgb(from white r g b)) { 4484 .menu { 4485 color: rgb(from var(--umg-color-base-text, rgb(0,0,0)) r g b); 4486 } 4487 } 4488 4489 .menu__main-title { 4490 font-size: var(--umg-font-body-size-sm, 0.75rem); 4491 } 4492 4493 .menu__title { 4494 font-weight: var(--umg-font-menu-weight, 700); 4495 text-transform: uppercase; 4496 width: 100%; 4497 border-bottom-width: 0.0625rem; 4498 border-bottom-style: solid; 4499 border-bottom-color: var(--umg-color-details-text, var(--umg-color-base-text, rgb(0,0,0,0.8))); 4500 padding-bottom: var(--umg-space-12, 0.75rem); 4501 } 4502 @supports (color: rgb(from white r g b)) { 4503 .menu__title { 4504 border-bottom-color: rgb(from var(--umg-color-details-text, var(--umg-color-base-text, rgb(0,0,0,0.8))) r g b / calc(alpha * var(--umg-opacity-border, 0.8))); 4505 } 4506 } 4507 4508 .menu > li > * { 4509 display: inline-block; 4510 padding: var(--umg-space-8, 0.5rem) var(--umg-space-12, 0.75rem); 4511 } 4512 .menu__link { 4513 color: inherit; 4514 text-decoration: none; 4515 transition: all var(--umg-animation-duration-04, 0.4s) ease; 4516 font-size: var(--umg-font-body-size-sm, 0.75rem); 4517 } 4518 .menu__link:hover, 4519 .menu__link.active, 4520 .summary.active { 4521 text-decoration: underline; 4522 text-underline-offset: 0.3rem; 4523 } 4524 .menu__link.active, 4525 .summary.active 4526 { 4527 text-decoration-thickness: 0.125rem; 4528 } 4529 4530 /* Menu disclosure */ 4531 .menu-disclosure { 4532 position: initial; 4533 --umg-color-base-border: transparent; 4534 } 4535 4536 .menu-disclosure::part(disclosure-drawer) { 4537 top: var(--umg-size-header-inner-height, 0); 4538 } 4539 4540 /* Menus */ 4541 .menu__container.menu-list--vertical .submenu__list { 4542 flex-direction: column; 4543 gap: var(--umg-space-4, 0.25rem); 4544 } 4545 .menu__list { 4546 font-family: var(--umg-font-menu-family, inherit); 4547 font-size: var(--umg-font-menu-size, inherit); 4548 list-style: none; 4549 padding: var(--umg-space-32, 2rem) var(--umg-space-48, 3rem); 4550 } 4551 4552 /* Extended */ 4553 .menu-list--extended .menu__list { 4554 display: flex; 4555 flex-wrap: wrap; 4556 column-gap: var(--umg-space-32, 2rem); 4557 row-gap: var(--umg-space-20, 1.25rem); 4558 margin: 0 auto; 4559 max-width: var(--umg-size-content-max-width, 75rem); 4560 width: 100%; 4561 } 4562 4563 /* Compact */ 4564 .menu.menu--compact .menu-disclosure::part(disclosure-drawer) { 4565 top: 4.5rem; 4566 left: unset; 4567 right: unset; 4568 border-radius: var(--umg-border-radius-20); 4569 } 4570 .menu.menu--compact .menu-disclosure::part(disclosure-content) { 4571 border-width: 0.0625rem; 4572 border-style: solid; 4573 border-color: var(--umg-color-details-text, var(--umg-color-base-text, rgb(0,0,0,0.8))); 4574 border-radius: var(--umg-border-radius-20); 4575 } 4576 @supports (color: rgb(from white r g b)) { 4577 .menu.menu--compact .menu-disclosure::part(disclosure-content) { 4578 border-color: rgb(from var(--umg-color-details-text, var(--umg-color-base-text, rgb(0,0,0,0.8))) r g b / calc(alpha * var(--umg-opacity-border, 0.8))); 4579 } 4580 } 4581 4582 .menu-list--compact .menu__list { 4583 padding: var(--umg-space-24, 1.5rem); 4584 } 4585 .menu-list--compact .menu__list > *:not(:last-child) { 4586 margin-bottom: var(--umg-space-24, 1.5rem); 4587 } 4588 .menu-list--compact .submenu__list { 4589 flex-direction: column; 4590 gap: var(--umg-space-4, 0.25rem); 4591 } 4592 .menu-list--compact .submenu__link { 4593 padding: var(--umg-space-4, 0.25rem) 0; 4594 } 4595 4596 /* Submenus */ 4597 .submenu { 4598 display: flex; 4599 flex-direction: column; 4600 gap: var(--umg-space-12, 0.75rem); 4601 font-family: var(--umg-font-submenu-family, inherit); 4602 font-size: var(--umg-font-body-size-sm, 0.75rem); 4603 } 4604 .submenu__title { 4605 font-size: var(--umg-font-body-size-xs, 0.75rem); 4606 font-weight: var(--umg-font-base-weight-light, 300); 4607 padding-right: var(--umg-space-8, 0.5rem); 4608 text-transform: uppercase; 4609 } 4610 .submenu__list { 4611 display: flex; 4612 gap: var(--umg-space-12, 0.75rem); 4613 list-style: none; 4614 padding: 0; 4615 } 4616 .submenu__link { 4617 display: block; 4618 color: inherit; 4619 padding: var(--umg-space-4, 0.25rem) var(--umg-space-8, 0.5rem); 4620 padding-left: 0; 4621 text-decoration: none; 4622 transition: all var(--umg-animation-duration-04, 0.4s) ease; 4623 } 4624 .submenu__link:hover { 4625 text-decoration: underline; 4626 text-underline-offset: 0.3rem; 4627 } 4628 `]),(0,o.C)([(0,a.M)()],p.prototype,"src",void 0),(0,o.C)([(0,a.M)({type:Object})],p.prototype,"data",void 0),(0,o.C)([(0,a.M)()],p.prototype,"activeUrl",void 0),(0,o.C)([(0,a.M)()],p.prototype,"layout",void 0),(0,o.C)([(0,a.M)({type:Boolean})],p.prototype,"vertical",void 0),(0,o.C)([(0,a.M)({type:Boolean})],p.prototype,"hideMenuTitle",void 0),(0,o.C)([(0,a.M)()],p.prototype,"submenuWidth",void 0),(0,o.C)([(0,a.M)()],p.prototype,"groupId",void 0),(0,o.C)([(0,n.YG)("umg-disclosure")],p.prototype,"_menus",void 0),p=(0,o.C)([(0,s.E)(`${h}-menu`)],p)},1312(t,e,i){var o=i(8472),r=i(2618),s=i(6505),a=i(9563),n=i(3720),l=i(1895),d=i(31),c=i(6093),u=i(9924),m=i(8698),h=i(2609);i(8766);const{prefix:p}=m.W;let g=class extends r.WF{constructor(){super(...arguments),this.hideLabel=!1,this.spinnerType="arrows",this.placeholder=void 0,this.disabled=!1,this.required=!1,this.id="",this.error=!1,this.name="",this.value=1,this.step=1}updated(t){super.updated(t),t.has("value")&&this._input&&this._input.value!==this.value.toString()&&(this._input.value=this.value.toString())}changeEvent(){this.dispatchEvent(new CustomEvent("change",{detail:{name:this.name,id:this.id,fieldId:this.id,fieldName:this.name,value:this.value},bubbles:!0,composed:!0}))}stepValue(t){this._input&&("plus"===t?(this._input.stepUp(),this.value=parseInt(this._input.value),this.disabled=!1):"minus"===t&&"0"!==this._input.value?(this._input.stepDown(),this.value=parseInt(this._input.value),this.disabled=!1):(this.value=parseInt(this._input.value),this.disabled=!1))}setSpinnerValue(t){this.disabled=!0;const e=this.value;if(this._input&&(Number.isInteger(parseInt(this._input.value))&&this.min&&this.max&&parseInt(this._input.value)>=this.min&&parseInt(this._input.value)<=this.max||""===this._input.value||"0"===this._input.value?this.stepValue(t):Number.isInteger(parseInt(this._input.value))&&this.min&&!this.max?(this.value<this.min&&(this.value=this.min),this.stepValue(t)):Number.isInteger(parseInt(this._input.value))&&this.max&&!this.min&&parseInt(this._input.value)<=this.max?this.stepValue(t):!Number.isInteger(parseInt(this._input.value))||this.min||this.max?(this.disabled=!1,this.max&&(this._input.value=this.max.toString())):this.stepValue(t)),e!==this.value){(0,c.s)(()=>{this.changeEvent()},500)()}}validateOnFocusOut(){this._input&&(""===this._input.value&&this.min?(this._input.value=this.min.toString(),this.value=this.min):""===this._input.value||parseInt(this._input.value)<0?this.value=0:Number.isInteger(parseInt(this._input.value))||(this.min?this.value=this.min:this.value=0))}isMaxValue(){return Number(this.value)===this.max}isMinValue(){return!!(this.min&&this.value<=this.min)}containerClasses(){return{border:"symbols"===this.spinnerType}}fieldClasses(){return{"label-hidden":this.hideLabel,"field--required":this.required,"field--symbols":"symbols"===this.spinnerType,"field--arrows":"arrows"===this.spinnerType,"field--min":this.min&&this.value===this.min,"field--max":this.max&&this.value>=this.max}}inputClasses(){return{"input--error":this.error,border:"arrows"===this.spinnerType}}labelClasses(){return{"visually-hidden":this.hideLabel}}renderLabel(){return r.qy` 4629 <label class="field__label${(0,n.H)(this.labelClasses())}" for="${this.id}"> 4630 <slot name="label"> 4631 <umg-text as="span" variant="bodySm">Label:</umg-text> 4632 </slot> 4633 </label> 4634 `}renderButtons(){return"symbols"===this.spinnerType?r.qy` 4635 <umg-button-icon 4636 part="increase" 4637 exportparts="button-icon,icon-container,icon-svg,icon-image" 4638 class="spinner increase" 4639 icon="plus" 4640 size="small" 4641 @click="${()=>this.setSpinnerValue("plus")}" 4642 ?disabled=${this.isMaxValue()} 4643 > 4644 </umg-button-icon> 4645 <umg-button-icon 4646 part="decrease" 4647 exportparts="button-icon,icon-container,icon-svg,icon-image" 4648 class="spinner decrease" 4649 icon="minus" 4650 size="small" 4651 @click="${()=>this.setSpinnerValue("minus")}" 4652 ?disabled=${this.isMinValue()} 4653 > 4654 </umg-button-icon> 4655 `:r.qy` 4656 <umg-button-icon 4657 part="increase" 4658 exportparts="button-icon,icon-container,icon-svg,icon-image" 4659 class="spinner increase" 4660 icon="chevron-up" 4661 size="xsmall" 4662 @click="${()=>this.setSpinnerValue("plus")}" 4663 ?disabled=${this.isMaxValue()} 4664 > 4665 </umg-button-icon> 4666 <umg-button-icon 4667 part="decrease" 4668 exportparts="button-icon,icon-container,icon-svg,icon-image" 4669 class="spinner decrease" 4670 icon="chevron-down" 4671 size="xsmall" 4672 @click="${()=>this.setSpinnerValue("minus")}" 4673 ?disabled=${this.isMinValue()} 4674 > 4675 </umg-button-icon> 4676 `}renderNumber(){return r.qy` 4677 <div class="input-container ${(0,n.H)(this.containerClasses())}"> 4678 ${this.renderButtons()} 4679 <input 4680 part="text-field" 4681 class="input${(0,n.H)(this.inputClasses())}" 4682 id="${this.id}" 4683 name="${this.name}" 4684 step="${this.step}" 4685 min="${(0,d.J)(this.min)}" 4686 max="${(0,d.J)(this.max)}" 4687 type="number" 4688 value="${this.value}" 4689 ?disabled="${this.disabled}" 4690 ?required="${this.required}" 4691 placeholder="${(0,d.J)(this.placeholder)}" 4692 @keyup="${()=>this.setSpinnerValue("value")}" 4693 @focusout="${()=>this.validateOnFocusOut()}" 4694 > 4695 </div> 4696 `}renderErrorMessage(){if(this.error)return r.qy`
4697 <span class="error-text"> 4698 <slot name="error-message"></slot> 4699 </span> 4700 `}render(){return r.qy` 4701 <div class="field${(0,n.H)(this.fieldClasses())}"> 4702 <div class="field__inner"> 4703 ${this.renderLabel()} 4704 ${this.renderNumber()} 4705 ${this.renderErrorMessage()} 4706 </div> 4707 </div> 4708 `}};g.styles=(0,h.Z)([u.S,r.AH` 4709 :host([disabled]) { 4710 opacity: 0.4; 4711 pointer-events: none; 4712 } 4713 4714 :host([disabled]) .spinner:hover { 4715 background-color: transparent; 4716 } 4717 4718 /** Field container */ 4719 .field { 4720 display: flex; 4721 flex-direction: column; 4722 position: relative; 4723 font-size: var(--umg-font-body-size-sm, 0.875rem); 4724 } 4725 4726 .field:not(.label-hidden) .field__inner { 4727 display: flex; 4728 flex-direction: column; 4729 align-items: flex-start; 4730 } 4731 4732 /** Property styles */ 4733 .field--inline .field__inner { 4734 flex-direction: row; 4735 } 4736 .field--required .input-container::before { 4737 content: ''; 4738 position: absolute; 4739 top: 0; 4740 left: 0; 4741 bottom: 0; 4742 display: block; 4743 width: 0; 4744 height: 100%; 4745 z-index: 1; 4746 border-right: 0.25rem solid var(--umg-color-base-text-warning, rgb(200,0,0,0.7)); 4747 } 4748 @supports (color: rgb(from white r g b)) { 4749 .field--required .input-container::before { 4750 border-right-color: rgb(from var(--umg-color-base-text-warning, rgb(200,0,0,0.7)) r g b / 0.7); 4751 } 4752 } 4753 4754 /* Field label */ 4755 .field__label { 4756 color: inherit; 4757 font-size: inherit; 4758 margin-bottom: var(--umg-space-4, 0.25rem); 4759 } 4760 4761 /* Input container */ 4762 .input-container { 4763 position: relative; 4764 -moz-appearance: textfield; 4765 } 4766 4767 /* Base input */ 4768 input { 4769 border: none; 4770 background-color: inherit; 4771 color: inherit; 4772 font-family: var(--umg-font-body-family, Roboto, Arial, Helvetica, sans-serif); 4773 font-size: inherit; 4774 padding: 0; 4775 height: var(--umg-space-40); 4776 width: fit-content; 4777 -moz-appearance: textfield; 4778 } 4779 4780 /* Border */ 4781 .border { 4782 padding: 0.25rem; 4783 border-radius: var(--umg-border-input-corner-radius, 0); 4784 border: solid var(--umg-border-input-width, 0.0625rem) var(--umg-color-input-border, var(--umg-color-base-text, rgb(0,0,0,0.2))); 4785 } 4786 @supports (color: rgb(from white r g b)) { 4787 .border { 4788 border-color: rgb(from var(--umg-color-input-border, var(--umg-color-base-text, rgb(0,0,0,0.2))) r g b / alpha); 4789 } 4790 } 4791 4792 input::-webkit-outer-spin-button { 4793 appearance: none; 4794 } 4795 input::-webkit-inner-spin-button { 4796 appearance: none; 4797 } 4798 4799 /** Input states */ 4800 .input--error { 4801 border: 0.0625rem solid var(--umg-color-base-text-warning, rgb(245,0,0)); 4802 } 4803 @supports (color: rgb(from white r g b)) { 4804 .input--error { 4805 border-color: rgb(from var(--umg-color-base-text-warning, rgb(245,0,0)) r g b); 4806 } 4807 } 4808 4809 /** Spinner buttons */ 4810 :host(:not([disabled])) .field--min .spinner.decrease::part(button-icon) { 4811 cursor: default; 4812 pointer-events: none; 4813 } 4814 :host(:not([disabled])) .field--max .spinner.increase::part(button-icon) { 4815 pointer-events: none; 4816 cursor: default; 4817 } 4818 .spinner { 4819 position: absolute; 4820 height: 1.25rem; 4821 --umg-space-icon-padding: 0; 4822 4823 } 4824 .spinner::part(button-icon) { 4825 padding: 0.125rem; 4826 } 4827 4828 /** Arrows input buttons */ 4829 .field--arrows .spinner.increase { 4830 --umg-border-icon-corner-radius: 0 var(--umg-border-input-corner-radius, 0) 0 0; 4831 top: 0.0625rem; 4832 right: 0.25rem; 4833 } 4834 .field--arrows .spinner.decrease { 4835 --umg-border-icon-corner-radius: 0 0 var(--umg-border-input-corner-radius, 0) 0; 4836 bottom: 0.0625rem; 4837 right: 0.25rem; 4838 } 4839 .field--arrows input { 4840 padding-left: var(--umg-space-12, 0.75rem); 4841 padding-right: var(--umg-space-24, 1.5rem); 4842 } 4843 4844 /** Symbol input buttons */ 4845 .field--symbols .input-container { 4846 display: flex; 4847 align-items: stretch; 4848 } 4849 .field--symbols input { 4850 order: 2; 4851 text-align: center; 4852 height: 1.75rem; 4853 width: 2rem; 4854 } 4855 .field--symbols .spinner { 4856 border: none; 4857 position: relative; 4858 height: 1.75rem; 4859 } 4860 .field--symbols .spinner::part(button-icon) { 4861 padding: 0.45rem; 4862 } 4863 .field--symbols .spinner.increase { 4864 border-left: none; 4865 order: 3; 4866 } 4867 .field--symbols .spinner.decrease {
4868 border-right: none; 4869 order: 1; 4870 } 4871 4872 /** Error text */ 4873 .error-text { 4874 color: var(--umg-color-base-text-warning, rgb(245,0,0)); 4875 font-size: calc(var(--umg-font-body-scale, 1) * var(--umg-font-body-size-sm, 0.875rem)); 4876 padding-top: var(--umg-space-4, 0.25rem); 4877 } 4878 @supports (color: rgb(from white r g b)) { 4879 .error-text { 4880 color: rgb(from var(--umg-color-base-text-warning, rgb(245,0,0)) r g b); 4881 } 4882 } 4883 `]),(0,o.C)([(0,a.M)({type:Boolean})],g.prototype,"hideLabel",void 0),(0,o.C)([(0,a.M)()],g.prototype,"spinnerType",void 0),(0,o.C)([(0,a.M)()],g.prototype,"placeholder",void 0),(0,o.C)([(0,a.M)({type:Boolean,reflect:!0})],g.prototype,"disabled",void 0),(0,o.C)([(0,a.M)({type:Boolean})],g.prototype,"required",void 0),(0,o.C)([(0,a.M)()],g.prototype,"id",void 0),(0,o.C)([(0,a.M)({type:Boolean})],g.prototype,"error",void 0),(0,o.C)([(0,a.M)()],g.prototype,"name",void 0),(0,o.C)([(0,a.M)({type:Number,reflect:!0})],g.prototype,"value",void 0),(0,o.C)([(0,a.M)({type:Number})],g.prototype,"step",void 0),(0,o.C)([(0,a.M)({type:Number})],g.prototype,"min",void 0),(0,o.C)([(0,a.M)({type:Number})],g.prototype,"max",void 0),(0,o.C)([(0,l.P)("input")],g.prototype,"_input",void 0),g=(0,o.C)([(0,s.E)(`${p}-number-field`)],g)},7538(t,e,i){var o=i(8472),r=i(2618),s=i(6505),a=i(9563),n=i(3720),l=i(1145),d=i(9924),c=i(8698),u=i(2609);const{prefix:m}=c.W;let h=class extends r.WF{constructor(){super(...arguments),this.divider=!1}pageClasses(){return{"page--divider":this.divider}}pageStyles(){let t={};return this.spacing&&(t={...t,"--umg-space-section-bottom-margin":this.spacing/16+"rem"}),t}render(){return r.qy` 4884 <main 4885 part="page" 4886 id="page" 4887 class="page${(0,n.H)(this.pageClasses())}" 4888 style="${(0,l.W)(this.pageStyles())}" 4889 > 4890 <div part="page-inner" class="page__inner"> 4891 <slot></slot> 4892 </div> 4893 </main> 4894 `}};h.styles=(0,u.Z)([d.S,r.AH` 4895 :host { 4896 display: block; 4897 position: relative; 4898 width: 100%; 4899 } 4900 4901 .page { 4902 color: var(--umg-color-base-text); 4903 background-color: var(--umg-color-base-background); 4904 } 4905 @supports (color: rgb(from white r g b)) { 4906 .page { 4907 color: rgb(from var(--umg-color-base-text) r g b / alpha); 4908 background-color: rgb(from var(--umg-color-base-background) r g b / alpha); 4909 } 4910 } 4911 4912 /* Divider */ 4913 .page--divider { 4914 border-bottom: 0.065rem solid rgba(var(--umg-color-base-border),1); 4915 border-top: 0.065rem solid rgba(var(--umg-color-base-border),1); 4916 } 4917 `]),(0,o.C)([(0,a.M)({type:Number})],h.prototype,"spacing",void 0),(0,o.C)([(0,a.M)({type:Boolean})],h.prototype,"divider",void 0),h=(0,o.C)([(0,s.E)(`${m}-page`)],h)},2610(t,e,i){var o=i(8472),r=i(2618),s=i(6505),a=i(3720),n=i(9563),l=i(7509),d=i(9924),c=i(8698),u=i(2609);i(8766);const{prefix:m}=c.W;let h=class extends r.WF{constructor(){super(),this.icon="ellipsis-vertical",this.openDirection="down",this.disabled=!1,this._open=!1,this.addEventListener("focusout",this._focusOut)}_focusOut(t){t.relatedTarget&&this.contains(t.relatedTarget)||(this._open=!1)}_togglePopover(){this._open=!this._open}popoverClasses(){return{"popover--open":this._open}}popoverContentClasses(){const t={};return t["popover-open-direction--"+this.openDirection]=!0,t}popovertemplate(){return this._open?r.qy`
4918 <div part="popover-content" class="popover__content${(0,a.H)(this.popoverContentClasses())}"> 4919 <umg-button-icon 4920 part="popover-close-button" 4921 exportparts="button-icon,icon-container,icon-svg,icon-image" 4922 class="popover__close-button" 4923 icon="close" 4924 size="large" 4925 @click=${this._togglePopover} 4926 > 4927 </umg-button-icon> 4928 <div part="popover-content-inner" class="popover__content-inner"> 4929 <slot></slot> 4930 </div> 4931 </div> 4932 `:r.s6}render(){return r.qy` 4933 <div part="popover" class="popover${(0,a.H)(this.popoverClasses())}"> 4934 <umg-button-icon 4935 part="popover-open-button" 4936 exportparts="button-icon,icon-container,icon-svg,icon-image" 4937 class="popover__open-button" 4938 icon="${this.icon}" 4939 size="large" 4940 @click=${this._togglePopover} 4941 ?disabled="${this.disabled}" 4942 > 4943 </umg-button-icon> 4944 ${this.popovertemplate()} 4945 </div> 4946 `}};h.styles=(0,u.Z)([d.S,r.AH` 4947 .popover { 4948 position: relative; 4949 } 4950 .popover__content { 4951 position: fixed; 4952 bottom: 0; 4953 left: 0; 4954 right: 0; 4955 bottom: 0; 4956 width: 100%; 4957 z-index: 499; // under overlay z-index 4958 color: var(--umg-color-popover-text, var(--umg-color-base-text, rgb(255,255,255))); 4959 background-color: var(--umg-color-popover-background, var(--umg-color-base-background, rgb(255,255,255))); 4960 padding: 3rem 1.5rem; 4961 } 4962 @supports (color: rgb(from white r g b)) { 4963 .popover__content { 4964 color: rgb(from var(--umg-color-popover-text, var(--umg-color-base-text, rgb(255,255,255))) r g b); 4965 background-color: rgb(from var(--umg-color-popover-background, var(--umg-color-base-background, rgb(255,255,255))) r g b / alpha); 4966 } 4967 } 4968 4969 .popover__content-inner { 4970 display: flex; 4971 flex-direction: column; 4972 justify-content: start; 4973 align-items: center; 4974 text-align: center; 4975 gap: var(--umg-space-20, var(--umg-space-vertical-gap, 1.25rem)); 4976 } 4977 4978 @media screen and (min-width: 48.06rem) { 4979 .popover__content { 4980 position: absolute; 4981 left: initial; 4982 bottom: initial; 4983 top: -0.25rem; 4984 right: -0.25rem; 4985 border-radius: var(--umg-border-base-corner-radius, 0.5rem); 4986 box-shadow: -0.1875rem 0.1875rem 0.5rem 0 rgb(0,0,0,0.3); 4987 padding: 2.5rem 1rem 1.5rem; 4988 width: max-content; 4989 4990 --umg-font-body-scale: 0.8; 4991 } 4992 4993 .popover__content.popover-open-direction--down { 4994 bottom: initial; 4995 top: -0.25rem; 4996 } 4997 4998 .popover__content.popover-open-direction--up { 4999 bottom: 0; 5000 top: initial; 5001 } 5002 5003 .popover__content-inner { 5004 gap: var(--umg-space-16, var(--umg-space-vertical-gap, 1rem)); 5005 width: fit-content; 5006 } 5007 } 5008 5009 .popover__close-button { 5010 position: absolute; 5011 top: 0.5rem; 5012 right: 0.5rem; 5013 --umg-color-base-text: var(--umg-color-popover-text); 5014 --umg-color-base-background: transparent; 5015 } 5016 @media screen and (min-width: 48.06rem) { 5017 .popover__close-button { 5018 top: 0; 5019 right: 0; 5020 } 5021 } 5022 5023 /* Mobile overlay */ 5024 @media screen and (max-width: 48rem) { 5025 .popover--open::after { 5026 content: ''; 5027 position: fixed; 5028 inset: 0; 5029 background-color: rgb(0,0,0,0.5); 5030 backdrop-filter: blur(2px); 5031 z-index: 498; 5032 } 5033 } 5034 `]),(0,o.C)([(0,n.M)()],h.prototype,"icon",void 0),(0,o.C)([(0,n.M)()],h.prototype,"openDirection",void 0),(0,o.C)([(0,n.M)({type:Boolean})],h.prototype,"disabled",void 0),(0,o.C)([(0,l.w)()],h.prototype,"_open",void 0),h=(0,o.C)([(0,s.E)(`${m}-popover`)],h)},4565(t,e,i){var o=i(8472),r=i(2618),s=i(6505),a=i(9563),n=i(3720),l=i(1145),d=i(9924);const c=r.AH` 5035 5036 /* Colour */ 5037 .section-block { 5038 color: var(--umg-color-section-text, var(--umg-color-base-text)); 5039 background-color: var(--umg-color-section-background, var(--umg-color-base-background)); 5040 } 5041 @supports (color: rgb(from white r g b)) { 5042 .section-block { 5043 color: rgb(from var(--umg-color-section-text, var(--umg-color-base-text)) r g b / alpha); 5044 background-color: rgb(from var(--umg-color-section-background, var(--umg-color-base-background)) r g b / alpha); 5045 } 5046 } 5047`,u=r.AH` 5048 5049 .section-content { 5050 margin-top: 0; 5051 margin-right: auto; 5052 margin-bottom: 0; 5053 margin-left: auto; 5054 max-width: var(--umg-size-content-max-width, 75rem); 5055 } 5056 5057 /* Content width */ 5058 .section-content--page-width { 5059 max-width: var(--umg-size-content-max-width, 75rem); 5060 } 5061 .section-content--full-width, 5062 .section-content--side-bleed:not(.section-content--page-width), 5063 .section-content--full-bleed:not(.section-content--page-width) { 5064 max-width: var(--umg-size-screen-max-width, 100%); 5065 } 5066 5067 /* Content spacing */ 5068 .section-content { 5069 display: flex; 5070 flex-direction: column; 5071 gap: var(--umg-space-grid-vertical-desktop); 5072 } 5073 @media screen and (max-width: 48rem) { 5074 .section-content { 5075 gap: var(--umg-space-grid-vertical-mobile); 5076 } 5077 } 5078 5079 @media only screen and (min-width: 48.06rem) { 5080 .section-content--padded { 5081 padding-top: var(--umg-space-block-top-padding, 0); 5082 padding-bottom: var(--umg-space-block-bottom-padding, 2rem); 5083 padding-left: var(--umg-space-base-side-padding, 1.5rem); 5084 padding-right: var(--umg-space-base-side-padding, 1.5rem); 5085 } 5086 .section-content--side-bleed { 5087 padding-top: var(--umg-space-block-top-padding, 0); 5088 padding-bottom: var(--umg-space-block-bottom-padding, 2rem); 5089 padding-left: 0; 5090 padding-right: 0; 5091 } 5092 .section-content.section-content--full-bleed { 5093 padding: 0; 5094 } 5095 5096 .section-content--center { 5097 display: flex; 5098 justify-content: center; 5099 text-align: center; 5100 } 5101 } 5102 5103 @media only screen and (max-width: 48rem) { 5104 .section-content--mobile-padded { 5105 padding-top: var(--umg-space-block-top-padding-mobile, 0); 5106 padding-bottom: var(--umg-space-block-bottom-padding-mobile, 1.5rem); 5107 padding-left: var(--umg-space-base-side-padding-mobile, 1.5rem); 5108 padding-right: var(--umg-space-base-side-padding-mobile, 1.5rem); 5109 } 5110 .section-content--mobile-side-bleed { 5111 padding-top: var(--umg-space-block-top-padding-mobile, 0); 5112 padding-bottom: var(--umg-space-block-bottom-padding-mobile, 1.5rem); 5113 padding-left: 0; 5114 padding-right: 0; 5115 } 5116 .section-content.section-content--mobile-full-bleed { 5117 padding: 0; 5118 } 5119 5120 .section-content--mobile-center { 5121 display: flex; 5122 justify-content: center; 5123 text-align: center; 5124 } 5125 } 5126`;var m=i(8698);const{prefix:h}=m.W;let p=class extends r.WF{constructor(){super(...arguments),this.width="page-width",this.centerContent=!1,this.mobileCenterContent=!1,this.paddingType="padded",this.mobilePaddingType="padded",this.isNumeric=t=>("number"==typeof t||"string"==typeof t&&""!==t.trim())&&!isNaN(t)}sectionBlockStyles(){let t={};return this.paddingTop&&(t={...t,"--umg-space-block-top-padding":Number(this.paddingTop)/16+"rem"}),this.paddingBottom&&(t={...t,"--umg-space-block-bottom-padding":Number(this.paddingBottom)/16+"rem"}),this.mobilePaddingTop?t={...t,"--umg-space-block-top-padding-mobile":Number(this.mobilePaddingTop)/16+"rem"}:this.paddingTop&&(t={...t,"--umg-space-block-top-padding-mobile":Number(this.paddingTop)/16+"rem"}),this.mobilePaddingBottom?t={...t,"--umg-space-block-bottom-padding-mobile":Number(this.mobilePaddingBottom)/16+"rem"}:this.paddingBottom&&(t={...t,"--umg-space-block-bottom-padding-mobile":Number(this.paddingBottom)/16+"rem"}),this.spacing&&(t={...t,"--umg-space-grid-vertical-desktop":Number(this.spacing)/16+"rem"}),this.mobileSpacing?t={...t,"--umg-space-grid-vertical-mobile":Number(this.mobileSpacing)/16+"rem"}:this.spacing&&(t={...t,"--umg-space-grid-vertical-mobile":Number(this.spacing)/16+"rem"}),t}sectionContentClasses(){const t={};return t["section-content--"+this.paddingType]=!0,t["section-content--mobile-"+this.mobilePaddingType]=!0,this.width&&!this.isNumeric(this.width)&&(t["section-content--"+this.width]=!0),this.centerContent&&(t["section-content--center"]=!0),this.mobileCenterContent&&(t["section-content--mobile-center"]=!0),t}sectionContentStyles(){let t={};return this.width&&this.isNumeric(this.width)&&(t={...t,"--umg-size-content-max-width":Number(this.width)/16+"rem"}),t}render(){return r.qy` 5127 <div 5128 part="section-block" 5129 class="section-block" 5130 style="${(0,l.W)(this.sectionBlockStyles())}" 5131 > 5132 <div 5133 part="section-content" 5134 class="section-content${(0,n.H)(this.sectionContentClasses())}" 5135 style="${(0,l.W)(this.sectionContentStyles())}" 5136 > 5137 <slot></slot> 5138 <slot name="content"></slot> 5139 </div> 5140 </div> 5141 `}};p.styles=[d.S,c,u,r.AH``],(0,o.C)([(0,a.M)()],p.prototype,"width",void 0),(0,o.C)([(0,a.M)({type:Boolean})],p.prototype,"centerContent",void 0),(0,o.C)([(0,a.M)({type:Boolean})],p.prototype,"mobileCenterContent",void 0),(0,o.C)([(0,a.M)()],p.prototype,"paddingType",void 0),(0,o.C)([(0,a.M)()],p.prototype,"mobilePaddingType",void 0),(0,o.C)([(0,a.M)()],p.prototype,"paddingTop",void 0),(0,o.C)([(0,a.M)()],p.prototype,"paddingBottom",void 0),(0,o.C)([(0,a.M)()],p.prototype,"mobilePaddingTop",void 0),(0,o.C)([(0,a.M)()],p.prototype,"mobilePaddingBottom",void 0),(0,o.C)([(0,a.M)()],p.prototype,"spacing",void 0),(0,o.C)([(0,a.M)()],p.prototype,"mobileSpacing",void 0),p=(0,o.C)([(0,s.E)(`${h}-section-block`)],p)},5421(t,e,i){var o=i(8472),r=i(2618),s=i(6505),a=i(9563),n=i(1145),l=i(9924);const d=r.AH` 5142 .section { 5143 padding-top: var(--umg-space-section-top-padding, 0); 5144 padding-bottom: var(--umg-space-section-bottom-padding, 0); 5145 margin-top: var(--umg-space-section-top-margin, 0); 5146 margin-bottom: var(--umg-space-section-bottom-margin, 0); 5147 } 5148 5149 @media only screen and (max-width: 48rem) { 5150 .section { 5151 padding-top: var(--umg-space-section-top-padding-mobile, 0); 5152 padding-bottom: var(--umg-space-section-bottom-padding-mobile, 0); 5153 margin-top: var(--umg-space-section-top-margin-mobile, 0); 5154 margin-bottom: var(--umg-space-section-bottom-margin-mobile, 0); 5155 } 5156 } 5157`;i(4565);var c=i(8698),u=i(2609);const{prefix:m}=c.W;let h=class extends r.WF{constructor(){super(...arguments),this.as="section"}sectionStyles(){let t={};return this.spacing&&(t={...t,"--umg-space-grid-vertical-desktop":this.spacing}),this.mobileSpacing&&(t={...t,"--umg-space-grid-vertical-mobile":this.mobileSpacing}),t}sectionAs(){return"section"===this.as?r.qy` 5158 <section 5159 part="section" 5160 class="section" 5161 style="${(0,n.W)(this.sectionStyles())}" 5162 > 5163 <slot></slot> 5164 <slot name="content"></slot> 5165 </section> 5166 `:"header"===this.as?r.qy` 5167 <header 5168 part="header" 5169 class="section" 5170 style="${(0,n.W)(this.sectionStyles())}" 5171 > 5172 <slot></slot> 5173 <slot name="content"></slot> 5174 </header> 5175 `:"footer"===this.as?r.qy` 5176 <footer 5177 part="footer" 5178 class="section" 5179 style="${(0,n.W)(this.sectionStyles())}" 5180 > 5181 <slot></slot> 5182 <slot name="content"></slot> 5183 </footer> 5184 `:r.qy` 5185 <div 5186 part="section" 5187 class="section" 5188 style="${(0,n.W)(this.sectionStyles())}" 5189 > 5190 <slot></slot> 5191 <slot name="content"></slot> 5192 </div> 5193 `}render(){return r.qy` 5194 ${this.sectionAs()} 5195 `}};h.styles=(0,u.Z)([l.S,d,r.AH` 5196 :host { 5197 display: block; 5198 width: 100%; 5199 } 5200 `]),(0,o.C)([(0,a.M)()],h.prototype,"as",void 0),(0,o.C)([(0,a.M)()],h.prototype,"spacing",void 0),(0,o.C)([(0,a.M)()],h.prototype,"mobileSpacing",void 0),h=(0,o.C)([(0,s.E)(`${m}-section`)],h)},5916(t,e,i){var o=i(8472),r=i(2618),s=i(6505),a=i(9563),n=i(7621),l=i(3720),d=i(1145),c=i(1088),u=i(9924),m=i(8698),h=i(2609);i(5840),i(4630);const{prefix:p}=m.W;let g=class extends r.WF{constructor(){super(...arguments),this.type="custom",this.id="",this.options=[],this.label="Select box",this.labelSize="xs",this.name="",this.value="",this.selectedItem=0,this.defaultLabel=!1,this.justify="start",this.mobileJustify="start",this.direction="down",this.border=!1,this.disabled=!1,this.align="left",this._caratPosition="",this._currentLabel="",this._isKeyboardEvent=!1,this.resizeObserver=new ResizeObserver(()=>this.nativeCaratPosition()),this.windowEventManager=new c.E(window),this.eventManager=new c.E(this),this.getOptionValue=()=>this.value,this.setOptionValue=t=>{t&&(this.selectedItem=t)},this._handleCustomKeyboardChange=t=>{t.stopPropagation(),"Enter"===t.key&&(this._optionChange(t),this._closeCustomSelect())},this._handleCustomOutsideClick=t=>{"click"!==t.type||t.composedPath().includes(this)||this._closeCustomSelect()}}connectedCallback(){super.connectedCallback(),this.windowEventManager.addEventListener("click",this._handleCustomOutsideClick)}disconnectedCallback(){this.windowEventManager.removeEventListener("click",this._handleCustomOutsideClick),this._select&&this.resizeObserver.unobserve(this._select),super.disconnectedCallback()}firstUpdated(){this.options&&this.options.length>this.selectedItem&&(this.value=this.options[this.selectedItem].value),"native"===this.type&&this._select&&this.resizeObserver.observe(this)}updated(t){if(t.has("defaultLabel"))if(this.defaultLabel){if(this.options&&this.options.length>this.selectedItem){const t=this.options[this.selectedItem];this._currentLabel=t?t.label:""}}
5200else this._currentLabel=""}_eventsDispatcher(t){const e={bubbles:!0,composed:!0};if("custom"===this.type){const i={fieldName:this.name,fieldId:this.id,name:this.name,id:this.id,value:t.target.value};this.eventManager.dispatchCustomEvent("change",i,e)}else{const t=new Event("change",e);this.dispatchEvent(t)}}_handleCustomKeyboardEvent(){this._isKeyboardEvent=!0,setTimeout(()=>{this._isKeyboardEvent=!1},0)}_handleCustomOptionChange(t){this._isKeyboardEvent||(this._optionChange(t),this._closeCustomSelect())}_optionChange(t){const e=t.target.value;if("custom"===this.type){const e=t.target.dataset.label;e&&(this._currentLabel=e)}e&&(this.value=e,this._eventsDispatcher(t))}_closeCustomSelect(){this._disclosure&&this._disclosure.disclosureClose()}nativeSelectStyles(){let t={};return"native"===this.type&&this._caratPosition&&(t={...t,"--umg-position-carat":this._caratPosition,"--umg-font-label-size":"var(--umg-font-body-size-"+this.labelSize+")"}),t}selectStyles(){let t={};return t={...t,"--umg-font-label-size":"var(--umg-font-body-size-"+this.labelSize+")"},"native"===this.type&&this._caratPosition&&(t={...t,"--umg-position-carat":this._caratPosition}),t}selectClasses(){return{"select--disabled":this.disabled,"select--border":this.border,"select--native":"native"===this.type}}nativeCaratPosition(){if(this._select){const t=getComputedStyle(this._select);this._caratPosition=parseInt(t.getPropertyValue("padding-left"),10)/16+"rem"}}nativeOptions(){if(Array.isArray(this.options)&&this.options.length)return this.options.map((t,e)=>r.qy` 5201 <option 5202 value="${t.value}" 5203 ?selected="${this.selectedItem===e||this.value===t.value}" 5204 > 5205 ${t.label} 5206 </option> 5207 `)}customOptions(){if(Array.isArray(this.options)&&this.options.length)return r.qy` 5208 <fieldset> 5209 <legend class="visually-hidden">${this.label}</legend> 5210 <ul 5211 class="select-list" 5212 role="listbox" 5213 @click="${this._handleCustomKeyboardChange}" 5214 @keydown="${this._handleCustomKeyboardChange}" 5215 > 5216 ${this.options.map((t,e)=>r.qy`<li role="option"><input 5217class="visually-hidden" 5218type="radio" 5219id="${t.id}" 5220name="${t.name}" 5221value="${t.value}" 5222data-label="${t.label}"?checked="${this.selectedItem===e||t.value===this.value}"@click=${this._handleCustomOptionChange}@keydown=${this._handleCustomKeyboardEvent}/><label for="${t.id}"><umg-icon icon="check"size="xsmall"></umg-icon>${t.label}</label></li>`)} 5223 </ul> 5224 </fieldset> 5225 `}currentCustomSelectedLabel(){if(this._currentLabel)return r.qy` 5226 <span class="select__current"> 5227 ${this._currentLabel} 5228 </span> 5229 `}selectType(){return"native"===this.type?r.qy` 5230 <label class="label" for="${this.name}-select">${this.label}</label> 5231 <div class="wrapper"> 5232 <select 5233 id="${this.name}-select" 5234 part="select" 5235 class="select" 5236 name="${this.name}" 5237 @change="${this._optionChange}" 5238 > 5239 ${this.nativeOptions()} 5240 </select> 5241 <umg-icon 5242 slot="icon" 5243 part="carat" 5244 class="carat" 5245 icon="chevron-down" 5246 size="xsmall" 5247 > 5248 </umg-icon> 5249 </div> 5250 `:r.qy` 5251 <umg-disclosure 5252 overlay 5253 direction="${this.direction}" 5254 mobileDirectionInverse 5255 justify="${this.justify}" 5256 mobileJustify="${this.mobileJustify}" 5257 align="${this.align}" 5258 > 5259 <div 5260 class="select__label" 5261 part="select-box" 5262 slot="summary" 5263 > 5264 <span class="label"> 5265 ${this.label} 5266 </span> 5267 ${this.currentCustomSelectedLabel()} 5268 </div> 5269 <umg-icon 5270 slot="icon" 5271 part="carat" 5272 class="carat" 5273 icon="chevron-down" 5274 size="xsmall" 5275 > 5276 </umg-icon>
5277 <div slot="content" class="select__close-button" @click=${this._closeCustomSelect}> 5278 <umg-icon icon="close" size="xlarge"></umg-icon> 5279 </div> 5280 <div slot="content" class="select__content"> 5281 ${this.customOptions()} 5282 </div> 5283 </umg-disclosure> 5284 `}render(){return r.qy` 5285 <div 5286 part="select" 5287 class="select ${(0,l.H)(this.selectClasses())}" 5288 style="${(0,d.W)(this.selectStyles())}" 5289 > 5290 ${this.selectType()} 5291 </div> 5292 `}};g.styles=(0,h.Z)([u.S,r.AH` 5293 :host { 5294 display: block; 5295 width: fit-content; 5296 --umg-color-icon-text: var(--umg-color-summary-text); 5297 --umg-border-base-corner-radius: var(--umg-border-input-corner-radius); 5298 } 5299 5300 /* Native select */ 5301 .select--native { 5302 display: flex; 5303 align-items: center; 5304 gap: var(--umg-space-12); 5305 } 5306 .select--native .wrapper { 5307 position: relative; 5308 } 5309 .select--native select { 5310 display: block; 5311 appearance: none; 5312 height: auto; 5313 padding: var(--umg-space-summary-padding, 0.5rem); 5314 padding-right: max(2rem, calc(var(--umg-position-carat) * 2)); 5315 border: 0.0625rem solid var(--umg-color-summary-border, rgb(0,0,0,0)); 5316 border-radius: var(--umg-border-base-corner-radius, 0); 5317 color: var(--umg-color-summary-text, var(--umg-color-base-text, rgb(0,0,0))); 5318 background-color: var(--umg-color-summary-background, rgb(255, 255, 255)); 5319 font-size: var(--umg-font-label-size, 0.875rem); 5320 } 5321 @supports (color: rgb(from white r g b)) { 5322 .select--native select { 5323 border-color: rgb(from var(--umg-color-summary-border, rgb(0,0,0,0)) r g b / alpha); 5324 color: rgb(from var(--umg-color-summary-text, var(--umg-color-base-text, rgb(0,0,0))) r g b); 5325 background-color: rgb(from var(--umg-color-summary-background, var(--umg-color-base-background, rgb(255, 255, 255))) r g b); 5326 } 5327 } 5328 .select--native select:focus-visible { 5329 outline: 0.125rem solid var(--umg-color-base-background, rgb(0,0,0)), 0.5; 5330 outline-offset: 0.1875rem; 5331 box-shadow: 5332 0 0 0 0.1875rem var(--umg-color-base-text, rgb(255,255,255)), 5333 0 0 0 0.3125rem 0.25rem var(--umg-color-base-background, rgb(0,0,0)), 0.3; 5334 } 5335 @supports (color: rgb(from white r g b)) { 5336 .select--native select:focus-visible { 5337 outline: 0.125rem solid rgb(from var(--umg-color-base-text, rgb(0,0,0)) r g b / 0.5); 5338 outline-offset: 0.1875rem; 5339 box-shadow: 5340 0 0 0 0.1875rem rgb(from var(--umg-color-base-background, rgb(255,255,255)) r g b / 1), 5341 0 0 0 0.3125rem 0.25rem rgb(from var(--umg-color-base-text, rgb(0,0,0)) r g b / 0.3); 5342 } 5343 } 5344 .select--native .label { 5345 font-size: var(--umg-font-label-size, 0.875rem); 5346 } 5347 .select--native .carat { 5348 position: absolute; 5349 transform: translateY(-50%); 5350 right: calc((var(--umg-position-carat) / 2) + 6px); /* 50% of padding + 50% icon width */ 5351 top: 50%; 5352 z-index: 5; 5353 pointer-events: none; 5354 } 5355 5356 /* Custom select */ 5357 .select { 5358 width: fit-content; 5359 position: relative; 5360 } 5361 .select.select--disabled { 5362 opacity: 0.4; 5363 pointer-events: none; 5364 cursor: default; 5365 } 5366 .select__content { 5367 max-height: 13rem; 5368 } 5369 .select__label { 5370 font-size: var(--umg-font-label-size, 0.875rem); 5371 } 5372 .select__close-button { 5373 display: none; 5374 } 5375 .select__current { 5376 font-size: var(--umg-font-label-size, 0.875rem); 5377 padding-left: var(--umg-space-4, 0.25rem); 5378 opacity: 0.7; 5379 } 5380 5381 /* Option inputs */ 5382 fieldset { 5383 border: none; 5384 padding: 0; 5385 margin: 0; 5386 } 5387 5388 /* Select box list/group */ 5389 .select-list { 5390 list-style: none; 5391 margin: 0; 5392 padding: 0; 5393 min-width: 10rem; 5394 overflow-y: auto; 5395 } 5396 5397 umg-disclosure::part(disclosure-content) { 5398 padding: var(--umg-space-details-padding, 1rem 0); 5399 } 5400 5401 /* Select box scrollbar */ 5402 .select-list::-webkit-scrollbar {
5403 width: 0.25rem; 5404 } 5405 .select-list::-webkit-scrollbar-track { 5406 background: var(--umg-color-base-text, rgb(0,0,0,0.05)); 5407 border-radius: var(--umg-border-radius-30); 5408 } 5409 .select-list::-webkit-scrollbar-thumb { 5410 background: var(--umg-color-base-text, rgb(0,0,0,0.1)); 5411 border-radius: var(--umg-border-radius-30); 5412 } 5413 @supports (color: rgb(from white r g b)) { 5414 .select-list::-webkit-scrollbar-track { 5415 background: rgb(from var(--umg-color-base-text, rgb(0,0,0,0.05)) r g b / 0.05); 5416 } 5417 .select-list::-webkit-scrollbar-thumb { 5418 background: rgb(from var(--umg-color-base-text, rgb(0,0,0,0.1)) r g b / 0.1); 5419 } 5420 } 5421 5422 /* Inputs */ 5423 .select-list input[type=radio] ~ label umg-icon { 5424 visibility: hidden; 5425 } 5426 .select-list input[type=radio]:checked ~ label umg-icon { 5427 visibility: visible; 5428 } 5429 .select-list input[type=radio]:focus-visible ~ label { 5430 text-decoration: underline; 5431 text-decoration-thickness: 0.125rem; 5432 text-underline-offset: 0.3rem; 5433 } 5434 5435 /* Input labels */ 5436 .select-list li, 5437 .select-list label { 5438 cursor: pointer; 5439 } 5440 .select-list label { 5441 display: flex; 5442 align-items: center; 5443 font-size: var(--umg-font-body-size-sm, 0.875rem); 5444 gap: var(--umg-space-8, 0.5rem); 5445 padding: 0.375rem var(--umg-space-20, 1.25rem) 0.375rem var(--umg-space-16, 1rem); 5446 width: 100%; 5447 } 5448 .select-list li:first-child label { 5449 margin-top: var(--umg-space-16, 1rem); 5450 } 5451 .select-list li:last-child label { 5452 margin-bottom: var(--umg-space-16, 1rem); 5453 } 5454 .select-list label:hover { 5455 background-color: var(--umg-color-base-text, rgb(0,0,0,0.05)); 5456 } 5457 @supports (color: rgb(from white r g b)) { 5458 .select-list label:hover { 5459 background-color: rgb(from var(--umg-color-base-text, rgb(0,0,0,0.05)) r g b / 0.05); 5460 } 5461 } 5462 5463 /** Mobile styles */ 5464 @media screen and (max-width: 48rem) { 5465 :host { 5466 --umg-border-base-corner-radius: 0; 5467 --umg-color-base-border: transparent; 5468 } 5469 .select { 5470 padding: 0; 5471 } 5472 .select-list { 5473 max-width: 86vw; 5474 } 5475 .select-list label { 5476 font-size: var(--umg-font-label-size); 5477 gap: var(--umg-space-16, 1rem); 5478 padding: var(--umg-space-12, 0.75rem) var(--umg-space-24, 1.5rem); 5479 } 5480 .select__close-button { 5481 position: absolute; 5482 top: var(--umg-space-20, 1.25rem); 5483 right: var(--umg-space-16, 1rem); 5484 left: 0; 5485 display: flex; 5486 justify-content: flex-end; 5487 } 5488 umg-disclosure::part(disclosure-drawer) { 5489 position: fixed; 5490 inset: 0; 5491 display: flex; 5492 flex-direction: column; 5493 justify-content: flex-end; 5494 visibility: visible; 5495 backdrop-filter: blur(2px); 5496 width: 100%; 5497 background-color: rgb(0,0,0,0.5); 5498 } 5499 } 5500 `]),(0,o.C)([(0,a.M)()],g.prototype,"type",void 0),(0,o.C)([(0,a.M)()],g.prototype,"id",void 0),(0,o.C)([(0,a.M)({type:Array})],g.prototype,"options",void 0),(0,o.C)([(0,a.M)()],g.prototype,"label",void 0),(0,o.C)([(0,a.M)()],g.prototype,"labelSize",void 0),(0,o.C)([(0,a.M)()],g.prototype,"name",void 0),(0,o.C)([(0,a.M)()],g.prototype,"value",void 0),(0,o.C)([(0,a.M)({type:Number})],g.prototype,"selectedItem",void 0),(0,o.C)([(0,a.M)({type:Boolean})],g.prototype,"defaultLabel",void 0),(0,o.C)([(0,a.M)()],g.prototype,"justify",void 0),(0,o.C)([(0,a.M)()],g.prototype,"mobileJustify",void 0),(0,o.C)([(0,a.M)()],g.prototype,"direction",void 0),(0,o.C)([(0,a.M)({type:Boolean})],g.prototype,"border",void 0),(0,o.C)([(0,a.M)({type:Boolean,reflect:!0})],g.prototype,"disabled",void 0),(0,o.C)([(0,a.M)({type:String,reflect:!0})],g.prototype,"align",void 0),(0,o.C)([(0,n.wk)()],g.prototype,"_caratPosition",void 0),(0,o.C)([(0,n.wk)()],g.prototype,"_currentLabel",void 0),(0,o.C)([(0,n.wk)()],g.prototype,"_isKeyboardEvent",void 0),(0,o.C)([(0,n.P)("umg-disclosure")],g.prototype,"_disclosure",void 0),(0,o.C)([(0,n.P)("select")],g.prototype,"_select",void 0),g=(0,o.C)([(0,s.E)(`${p}-select`)],g)},7838(t,e,i){i.d(e,{q:()=>m});var o=i(8472),r=i(2618),s=i(9563),a=i(6505),n=i(7621),l=i(9924),d=i(8698),c=i(2609);const{prefix:u}=d.W;let m=class extends r.WF{constructor(){super(...arguments),this.contentType="slider",this.active=!1,this.get
5500SlideContent=()=>this._slideContents}content(){return"slider"===this.contentType?r.qy` 5501 <li 5502 part="slide" 5503 class="slide grid__item slide grid__item--fill-height"> 5504 <slot></slot> 5505 <slot name="content"></slot> 5506 </li> 5507 `:r.qy` 5508 <div 5509 part="slide" 5510 class="slide grid__item" 5511 role="group" 5512 aria-roledescription="slide" 5513 aria-hidden="false" 5514 > 5515 <slot></slot> 5516 <slot name="content"></slot> 5517 </div> 5518 `}render(){return r.qy` 5519 ${this.content()} 5520 `}};m.styles=(0,c.Z)([l.S,r.AH` 5521 :host { 5522 display: block; 5523 } 5524 .slide { 5525 height: 100%; 5526 } 5527 .grid__item--fill-height ::slotted(*) { 5528 height: 100%; 5529 } 5530 `]),(0,o.C)([(0,s.M)()],m.prototype,"contentType",void 0),(0,o.C)([(0,s.M)({type:Boolean})],m.prototype,"active",void 0),(0,o.C)([(0,n.KN)({slot:"content"})],m.prototype,"_slideContents",void 0),m=(0,o.C)([(0,a.E)(`${u}-slide`)],m)},2115(t,e,i){i.d(e,{A:()=>M});var o=i(8472),r=i(2618),s=i(6505),a=i(9563),n=i(7621),l=i(3720),d=i(1145),c=i(1895),u=i(1124);if(!("onscrollend"in window)){const S=new Event("scrollend"),A=new Set;document.addEventListener("touchstart",t=>{for(let e of t.changedTouches)A.add(e.identifier)},{passive:!0}),document.addEventListener("touchend",t=>{for(let e of t.changedTouches)A.delete(e.identifier)},{passive:!0});let z=new WeakMap;function H(t,e,i){let o=t[e];t[e]=function(){let t=Array.prototype.slice.apply(arguments,[0]);o.apply(this,t),t.unshift(o),i.apply(this,t)}}function E(t,e){if("scroll"!=e&&"scrollend"!=e)return;let i=this,o=z.get(i);if(void 0===o){let e=0;o={scrollListener:t=>{clearTimeout(e),e=setTimeout(()=>{A.size?setTimeout(o.scrollListener,100):(i.dispatchEvent(S),e=0)},100)},listeners:0},t.apply(i,["scroll",o.scrollListener]),z.set(i,o)}o.listeners++}function P(t,e,i){if("scroll"!=e&&"scrollend"!=e)return;let o=this,r=z.get(o);void 0!==r&&(r[e]--,--r.listeners>0||(t.apply(o,["scroll",r.scrollListener]),z.delete(o)))}H(Element.prototype,"addEventListener",E),H(window,"addEventListener",E),H(document,"addEventListener",E),H(Element.prototype,"removeEventListener",P),H(window,"removeEventListener",P),H(document,"removeEventListener",P)}var m=i(6093),h=i(9924);const p=r.AH` 5531 5532 /* Slider component */ 5533 5534 /* Flex columns for slider controls*/ 5535 .slider-component { 5536 display: flex; 5537 flex-direction: column; 5538 position: relative; 5539 margin: 0 auto; 5540 } 5541 5542 /* Slider dynamic height */ 5543 .slider { 5544 transition: height 0.3s; 5545 } 5546 5547 /* Slider scroll container */ 5548 .slider { 5549 scrollbar-color: var(--umg-color-base-text, rgb(0,0,0,0.04)); 5550 -ms-overflow-style: none; 5551 scrollbar-width: none; 5552 5553 @media (prefers-reduced-motion) { 5554 scroll-behavior: auto; 5555 } 5556 } 5557 @supports (color: rgb(from white r g b)) { 5558 .slider { 5559 scrollbar-color: rgb(from var(--umg-color-base-text, rgb(0,0,0,0.04)) r g b / 0.04); 5560 } 5561 } 5562 5563 .slider--selectable ::slotted(*) { 5564 cursor: pointer; 5565 } 5566 5567 .slider::-webkit-scrollbar {
5568 height: var(--space-4); 5569 width: var(--space-4); 5570 display: none; 5571 } 5572 5573 .slider::-webkit-scrollbar-thumb { 5574 background: var(--umg-color-base-text, rgb(0,0,0,0.05)); 5575 border-radius: var(--space-4); 5576 border: 0; 5577 } 5578 5579 .slider::-webkit-scrollbar-track { 5580 background: var(--umg-color-base-text, rgb(0,0,0,0.1)); 5581 border-radius: var(--space-4); 5582 } 5583 5584 @supports (color: rgb(from white r g b)) { 5585 .slider::-webkit-scrollbar-thumb { 5586 background: rgb(from var(--umg-color-base-text, 0,0,0,0.05) r g b / 0.05); 5587 } 5588 5589 .slider::-webkit-scrollbar-track { 5590 background: rgb(from var(--umg-color-base-text, 0,0,0,0.1) r g b / 0.1); 5591 } 5592 } 5593 5594 /* Mobie slider enabled */ 5595 @media screen and (max-width: 48rem) { 5596 .slider.slider--tablet { 5597 position: relative; 5598 flex-wrap: inherit; 5599 overflow-x: auto; 5600 overflow-y: hidden; 5601 scroll-snap-type: x mandatory; 5602 scroll-behavior: smooth; 5603 } 5604 } 5605 5606 /* Desktop slider enabled */ 5607 @media screen and (min-width: 48.06rem) { 5608 .slider.slider--desktop { 5609 position: relative; 5610 flex-wrap: inherit; 5611 overflow-x: auto; 5612 scroll-snap-type: x mandatory; 5613 scroll-behavior: smooth; 5614 } 5615 } 5616 5617 /* Slides layout */ 5618 .slider.grid.grid--gapless { 5619 gap: 0; 5620 } 5621 5622 /* Mobile classes */ 5623 @media screen and (max-width: 30rem) { 5624 /* Peek */ 5625 .slider.grid--peek.grid--1-col-tablet-down ::slotted(*) { 5626 width: calc(100% - var(--umg-space-grid-horizontal-mobile, 1rem) - 2rem) 5627 } 5628 .slider.grid--peek.grid--2-col-tablet-down ::slotted(*) { 5629 width: calc(50% - var(--umg-space-grid-horizontal-mobile, 1rem) - 1rem) 5630 } 5631 /* Gapless */ 5632 .slider.grid--gapless.grid--1-col-tablet-down ::slotted(*) { 5633 width: 100%; 5634 } 5635 .slider.grid--gapless.grid--2-col-tablet-down ::slotted(*) { 5636 width: 50%; 5637 } 5638 /* Gapless + Peek */ 5639 .slider.grid--peek.grid--gapless.grid--1-col-tablet-down ::slotted(*) { 5640 width: calc(100% - (var(--umg-space-grid-horizontal-mobile, 1rem) * 5 )) 5641 } 5642 .slider.grid--peek.grid--gapless.grid--2-col-tablet-down ::slotted(*) { 5643 width: calc(50% - (var(--umg-space-grid-horizontal-mobile, 1rem) * 3 )) 5644 } 5645 } 5646 5647 /* Tablet portrait classes */ 5648 @media screen and (min-width: 30.06rem) and (max-width: 48rem) { 5649 /* Peek */ 5650 .slider.grid--peek.grid--2-col-tablet ::slotted(*) { 5651 width: calc(50% - var(--umg-space-grid-horizontal-mobile, 1rem) - 2rem) 5652 } 5653 .slider.grid--peek.grid--3-col-tablet ::slotted(*) { 5654 width: calc(33.33% - var(--umg-space-grid-horizontal-mobile, 1rem) - 1rem) 5655 } 5656 /* Gapless */ 5657 .slider.grid.grid--gapless.grid--2-col-tablet ::slotted(*) { 5658 width: 50%; 5659 } 5660 .slider.grid.grid--gapless.grid--3-col-tablet ::slotted(*) { 5661 width: 33.33%; 5662 } 5663 /* Gapless + Peek */ 5664 .slider.grid.grid--gapless.grid--peek.grid--2-col-tablet ::slotted(*) { 5665 width: calc(50% - (var(--umg-space-grid-horizontal-mobile, 1rem) * 5 )) 5666 } 5667 .slider.grid.grid--gapless.grid--peek.grid--3-col-tablet ::slotted(*) { 5668 width: calc(33.33% - (var(--umg-space-grid-horizontal-mobile, 1rem) * 3 )) 5669 } 5670 } 5671 5672 /* Tablet landscape classes */ 5673 @media screen and (min-width: 48.06rem) and (max-width: 64rem) { 5674 /* Peek */ 5675 .slider.grid--peek.grid--2-col-tablet ::slotted(*) { 5676 width: calc(50% - var(--umg-space-grid-horizontal-desktop, 1rem) - 2rem) 5677 } 5678 .slider.grid--peek.grid--3-col-tablet ::slotted(*) { 5679 width: calc(33.33% - var(--umg-space-grid-horizontal-desktop, 1rem) - 1rem 5680 ) 5681 } 5682 /* Gapless */ 5683 .slider.grid.grid--gapless.grid--2-col-tablet ::slotted(*) { 5684 width: 50%; 5685 } 5686 .slider.grid.grid--gapless.grid--3-col-tablet ::slotted(*) { 5687 width: 33.33%; 5688 } 5689 /* Gapless + Peek */ 5690 .slider.grid.grid--gapless.grid--peek.grid--2-col-tablet ::slotted(*) { 5691 width: calc(50% - (var(--umg-space-grid-horizontal-desktop, 1rem) * 4 )) 5692 } 5693 .slider.grid.grid--gapless.grid--peek.grid--3-col-tablet ::slotted(*) { 5694 width: calc(33.33% - (var(--umg-space-grid-horizontal-desktop, 1rem) * 2 )) 5695 } 5696 } 5697 5698 /* Desktop variable */ 5699 @media screen and (min-width: 64.06rem) { 5700 .slider.grid--peek ::slotted(*) { 5701 width: calc(100% / var(--umg-grid-desktop-columns, 4) - var(--umg-space-grid-horizontal-desktop, 1rem) * var(--umg-grid-desktop-peek, 3)) 5702 } 5703 /* Gapless */ 5704 .slider.grid.grid--gapless ::slotted(*) { 5705 width: var(--umg-grid-desktop-columns-width, 25%); 5706 } 5707 /* Gapless + Peek */ 5708 .slider.grid.grid--gapless.grid--peek.grid--1-col-desktop ::slotted(*) { 5709 width: calc((100% / var(--umg-grid-desktop-columns, 4)) - 9rem); 5710 } 5711 .slider.grid.grid--gapless.grid--peek.grid--2-col-desktop ::slotted(*) { 5712 width: calc((100% / var(--umg-grid-desktop-columns, 4)) - 5rem); 5713 } 5714 .slider.grid.grid--gapless.grid--peek.grid--3-col-desktop ::slotted(*) { 5715 width: calc((100% / var(--umg-grid-desktop-columns, 4)) - 3rem); 5716 } 5717 .slider.grid.grid--gapless.grid--peek.grid--4-col-desktop ::slotted(*) { 5718 width: calc((100% / var(--umg-grid-desktop-columns, 4)) - 2rem); 5719 } 5720 .slider.grid.grid--gapless.grid--peek.grid--5-col-desktop ::slotted(*) { 5721 width: calc((100% / var(--umg-grid-desktop-columns, 4)) - 1rem); 5722 } 5723 .slider.grid.grid--gapless.grid--peek.grid--6-col-desktop ::slotted(*) { 5724 width: calc((100% / var(--umg-grid-desktop-columns, 4)) - 0.5rem); 5725 } 5726 } 5727 5728 /* Slides */ 5729 ::slotted(*) { 5730 scroll-snap-align: start; 5731 margin-bottom: 0; 5732 } 5733 5734 /* Slider controls */
5735 umg-slider-controls { 5736 display: none; 5737 } 5738 5739 @media screen and (min-width: 48.06rem) { 5740 .slider-component--desktop umg-slider-controls { 5741 display: block 5742 } 5743 } 5744 @media screen and (max-width: 48rem) { 5745 .slider-component--tablet umg-slider-controls { 5746 display: block 5747 } 5748 } 5749 5750 .slider-controls--top umg-slider-controls { 5751 order: 2; 5752 } 5753 5754`;var g=i(3023),b=i(8698),v=i(2609);i(7838);function*y(t,e){if(void 0!==t){let i=0;for(const o of t)yield e(o,i++)}}function*f(t,e,i=1){const o=void 0===e?0:t;e??=t;for(let t=o;i>0?t<e:e<t;t+=i)yield t}const _=r.AH` 5755 .slider-controls { 5756 display: flex; 5757 justify-content: center; 5758 align-items: center; 5759 padding: var(--umg-space-8, 0.5rem) 0; 5760 font-family: var(--umg-font-body-family, Roboto, Arial, Helvetica, sans-serif); 5761 } 5762 @media screen and (min-width: 48.06rem) { 5763 .slider-controls { 5764 margin-top: var(--umg-space-16); 5765 gap: 1rem 5766 } 5767 } 5768 .slider-counter { 5769 display: flex; 5770 align-items: center; 5771 justify-content: center; 5772 font-size: var(--umg-font-body-size-xs, 0.75rem); 5773 font-weight: var(--umg-font-base-weight-light, 300); 5774 } 5775 .slider-counter__link { 5776 font-weight: var(--umg-font-base-weight-light, 300); 5777 padding: var(--umg-space-12, 0.75rem) var(--umg-space-8, 0.5rem); 5778 } 5779 @media screen and (min-width: 48.06rem) { 5780 .slider-counter__link { 5781 font-weight: var(--umg-font-base-weight-light, 300); 5782 padding: var(--umg-space-12, 0.75rem); 5783 } 5784 } 5785 .slider-counter__link .dot { 5786 display: block; 5787 background-color: transparent; 5788 border-radius: 50%; 5789 padding: 0; 5790 width: var(--umg-space-8, 0.5rem); 5791 height: var(--umg-space-8, 0.5rem); 5792 border: 0.06rem solid rgb(from var(--umg-color-base-text, rgb(0,0,0,0.5)) r g b / alpha); 5793 } 5794 .slider-counter__link--active .dot { 5795 background-color: rgb(from var(--umg-color-base-text, rgb(0,0,0)) r g b / alpha); 5796 } 5797 5798 @supports (color: rgb(from white r g b)) { 5799 .slider-counter__link .dot { 5800 border: 0.06rem solid rgb(from var(--umg-color-base-text, rgb(0,0,0,0.5)) r g b / 0.5); 5801 } 5802 .slider-counter__link--active .dot { 5803 background-color: rgb(from var(--umg-color-base-text, rgb(0,0,0)) r g b / alpha); 5804 } 5805 } 5806 5807 /* Position */ 5808 .slider-controls--inside .slider-counter, 5809 .slider-controls--outside .slider-counter, 5810 .slider-controls--inside .autoplay-button, 5811 .slider-controls--outside .autoplay-button { 5812 display: none; 5813 } 5814 5815 .slider-controls--inside .previous-button, 5816 .slider-controls--inside .next-button, 5817 .slider-controls--outside .previous-button, 5818 .slider-controls--outside .next-button { 5819 position: absolute; 5820 z-index: 499; /* under overlay z-index */ 5821 } 5822 @media screen and (min-width: 30.06rem) { 5823 .slider-controls--inside .previous-button, 5824 .slider-controls--inside .next-button, 5825 .slider-controls--outside .previous-button, 5826 .slider-controls--outside .next-button { 5827 transform: translateY(-50%); 5828 } 5829 } 5830 5831 .slider-controls--inside .previous-button, 5832 .slider-controls--inside .next-button, 5833 .slider-controls--outside .previous-button, 5834 .slider-controls--outside .next-button { 5835 top: 50%; 5836 } 5837 .slider-controls--inside .previous-button { 5838 left: 0.5rem 5839 } 5840 .slider-controls--inside .next-button { 5841 right: 0.5rem 5842 } 5843 5844 .slider-controls--outside .previous-button { 5845 left: -5rem 5846 } 5847 .slider-controls--outside .next-button { 5848 right: -5rem 5849 } 5850 5851 /* Position styles */ 5852 .slider-controls--inside, 5853 .slider-controls--outside { 5854 height: 0.1px; /* required by outside button intersection observer */ 5855 margin: 0; 5856 padding: 0; 5857 } 5858 .slider-controls--under .previous-button, 5859 .slider-controls--under .next-button { 5860 --umg-color-icon-background: transparent; 5861 } 5862 5863 @media screen and (max-width: 30rem) {
5864 .slider-controls--inside .previous-button, 5865 .slider-controls--inside .next-button, 5866 .slider-controls--outside .previous-button, 5867 .slider-controls--outside .next-button { 5868 top: 0.0625rem; 5869 --umg-color-icon-background: transparent; 5870 --umg-border-base-width: 0; 5871 } 5872 .slider-controls--outside .previous-button, 5873 .slider-controls--inside .previous-button { 5874 left: 0.0625rem 5875 } 5876 .slider-controls--outside .next-button, 5877 .slider-controls--inside .next-button { 5878 right: 0.0625rem 5879 } 5880 .slider-controls--outside .previous-button[disabled]::part(button-icon), 5881 .slider-controls--inside .previous-button[disabled]::part(button-icon) { 5882 opacity: 0; 5883 } 5884 .slider-controls--outside .next-button[disabled]::part(button-icon), 5885 .slider-controls--inside .next-button[disabled]::part(button-icon) { 5886 opacity: 0; 5887 } 5888 } 5889`,w=r.AH` 5890 .link { 5891 cursor: pointer; 5892 display: inline-block; 5893 border: none; 5894 box-shadow: none; 5895 color: rgb(from var(--umg-color-link-text, var(--umg-color-base-text, 62,62,62)) r g b / 1); 5896 background-color: transparent; 5897 font-size: var(--umg-font-body-size-sm, 0.875rem); 5898 font-family: inherit; 5899 text-underline-offset: 0.25rem; 5900 } 5901 .link:hover { 5902 text-decoration: underline; 5903 } 5904 .link--plain { 5905 text-decoration: none; 5906 } 5907 .link--active { 5908 font-weight: var(--umg-font-base-weight-medium, 500); 5909 text-decoration: underline; 5910 } 5911`,{prefix:x}=b.W;let C=class extends r.WF{constructor(){super(...arguments),this.sliderId="",this.controlType="counter",this.controlPosition="under",this.numberOfSlides=1,this.slidesPerPage=1,this.currentPage=1,this.autoPlay=!1,this.loopSlides=!1,this.playing=!0,this._pauseHold=!1,this._positionInside=!1,this._positionControls=t=>{t.forEach(t=>{if(this===t.target){const e=!t.isIntersecting;this._positionInside=!!e}})}}updated(t){if(super.updated(t),"outside"===this.controlPosition){const t={root:document.querySelector("document"),rootMargin:"0px -112px 0px -112px",threshold:1};!this._overflowObserver&&this&&(this._overflowObserver=new IntersectionObserver(this._positionControls,t),this._overflowObserver.observe(this))}}_dispatchControlAction(t,e){const i=t.currentTarget;if(!(i&&i.getAttribute("disabled")||("onscrollend"in window==!1&&(i.style.setProperty("pointer-events","none"),setTimeout(()=>{i.style.setProperty("pointer-events","auto")},1100/this.slidesPerPage)),"pause-slider"!==e&&"play-slider"!==e||this.dispatchEvent(new CustomEvent(e,{bubbles:!0,composed:!0})),"previous-slide"!==e&&"next-slide"!==e||this.dispatchEvent(new CustomEvent(e,{bubbles:!0,composed:!0})),"pause-over"===e&&(this.dispatchEvent(new CustomEvent(e,{bubbles:!0,composed:!0})),this.playing?this._pauseHold=!0:this._pauseHold=!1),"pause-out"===e&&this.playing&&(this.dispatchEvent(new CustomEvent(e,{bubbles:!0,composed:!0})),this._pauseHold=!1),"slide-link"!==e))){const i=t.currentTarget,o=i?i.dataset.slide:null;this.dispatchEvent(new CustomEvent(e,{detail:{slideNumber:o},bubbles:!0,composed:!0}))}}controlClasses(){const t={};return"outside"!==this.controlPosition||this._positionInside?"outside"===this.controlPosition&&this._positionInside||"inside"===this.controlPosition?t["slider-controls--inside"]=!0:t["slider-controls--under"]=!0:t["slider-controls--outside"]=!0,t}counterClasses(){const t={};return t["slider-counter--"+this.controlType]=!0,t.caption="counter"===this.controlType||"numbers"===this.controlType,t}numberButtons(){return r.qy` 5912 ${y(f(1,this.numberOfSlides+1,1),t=>t===this.currentPage?r.qy`<button 5913part="slider-counter-link slider-link-active" 5914class="slider-counter__link slider-counter__link--numbers link--active link"@click="${t=>this._dispatchControlAction(t,"slide-link")}" 5915data-slide=${t}>${t}</button>`:r.qy`<button 5916part="slider-counter-link" 5917class="slider-counter__link slider-counter__link--numbers link"@click="${t=>
5917this._dispatchControlAction(t,"slide-link")}" 5918data-slide=${t}>${t}</button>`)} 5919 `}dotButtons(){return r.qy` 5920 ${y(f(1,this.numberOfSlides+1,1),t=>t===this.currentPage?r.qy`<button 5921part="slider-counter-link slider-link-active" 5922class="slider-counter__link slider-counter__link--dots slider-counter__link--active link"@click="${t=>this._dispatchControlAction(t,"slide-link")}" 5923data-slide="${t}"><span part="slider-counter-dot slider-link-dot-active"class="dot"></span></button>`:r.qy`<button 5924part="slider-counter-link" 5925class="slider-counter__link slider-counter__link--dots link"@click="${t=>this._dispatchControlAction(t,"slide-link")}" 5926data-slide="${t}"><span part="slider-counter-dot"class="dot"></span></button>`)} 5927 `}controlVisualType(){return"counter"===this.controlType?r.qy` 5928 <span 5929 part="slider-counter-current" 5930 class="slider-counter-current" 5931 > 5932 ${this.currentPage} 5933 </span> 5934 <span 5935 part="slider-counter-seperator" 5936 class="slider-counter-seperator" 5937 aria-hidden="true" 5938 > 5939 / 5940 </span> 5941 <span part="slider-counter-pre" class="slider-counter-pre visually-hidden"> 5942 of 5943 </span> 5944 <span 5945 part="slider-counter-total" 5946 class="slider-counter-total" 5947 > 5948 ${this.numberOfSlides} 5949 </span> 5950 `:"numbers"===this.controlType?r.qy` 5951 ${this.numberButtons()} 5952 `:r.qy` 5953 ${this.dotButtons()} 5954 `}autoPlayButtons(){return this.autoPlay&&this.playing?r.qy` 5955 <umg-button-icon 5956 part="autoplay-button" 5957 exportparts="button-icon,icon-container,icon-svg,icon-image" 5958 class="autoplay-button" 5959 for=${this.sliderId} 5960 label="Pause slides" 5961 icon=${!0===this._pauseHold?"play-pause":"pause"} 5962 size="small" 5963 @click="${t=>this._dispatchControlAction(t,"pause-slider")}" 5964 @mouseover="${t=>this._dispatchControlAction(t,"pause-over")}" 5965 @mouseout="${t=>this._dispatchControlAction(t,"pause-out")}" 5966 @focusin="${t=>this._dispatchControlAction(t,"pause-over")}" 5967 @focusout="${t=>this._dispatchControlAction(t,"pause-out")}" 5968 > 5969 </umg-button-icon> 5970 `:this.autoPlay&&!this.playing?r.qy` 5971 <umg-button-icon 5972 part="autoplay-button" 5973 exportparts="button-icon,icon-container,icon-svg,icon-image" 5974 class="autoplay-button" 5975 for=${this.sliderId} 5976 label="Autoplay slides" 5977 icon="play" 5978 size="small" 5979 @click="${t=>this._dispatchControlAction(t,"play-slider")}" 5980 > 5981 </umg-button-icon> 5982 `:r.s6}navigationButton(t){const e="next"===t?this.currentPage===this.numberOfSlides:1===this.currentPage,i="next"===t?"next-slide":"previous-slide";return"under"===this.controlPosition?r.qy` 5983 <umg-button-icon 5984 part="${t}-button" 5985 exportparts="button-icon,icon-container,icon-svg,icon-image" 5986 class="${t}-button" 5987 for=${this.sliderId} 5988 label="Next" 5989 icon="chevron-${"next"===t?"right":"left"}" 5990 size="small" 5991 ?disabled=${e} 5992 @click="${t=>this._dispatchControlAction(t,i)}" 5993 > 5994 </umg-button-icon> 5995 `:r.qy` 5996 <umg-button-icon 5997 part="${t}-button" 5998 exportparts="button-icon,icon-container,icon-svg,icon-image" 5999 id="OuterButton" 6000 class="${t}-button" 6001 for=${this.sliderId} 6002 label="Next" 6003 icon="chevron-${"next"===t?"right":"left"}" 6004 size="large" 6005 padding="12" 6006 ?disabled=${e} 6007 border 6008 @click="${t=>
6008this._dispatchControlAction(t,i)}" 6009 > 6010 </umg-button-icon> 6011 `}render(){if(this.numberOfSlides>1)return r.qy` 6012 <div part="slider-controls" class="slider-controls${(0,l.H)(this.controlClasses())}"> 6013 ${this.navigationButton("previous")} 6014 <div part="slider-counter" class="slider-counter${(0,l.H)(this.counterClasses())}"> 6015 ${this.controlVisualType()} 6016 </div> 6017 ${this.navigationButton("next")} 6018 ${this.autoPlayButtons()} 6019 </div> 6020 `}};C.styles=(0,v.Z)([h.S,_,w]),(0,o.C)([(0,a.M)()],C.prototype,"sliderId",void 0),(0,o.C)([(0,a.M)()],C.prototype,"controlType",void 0),(0,o.C)([(0,a.M)()],C.prototype,"controlPosition",void 0),(0,o.C)([(0,a.M)({type:Number})],C.prototype,"numberOfSlides",void 0),(0,o.C)([(0,a.M)({type:Number})],C.prototype,"slidesPerPage",void 0),(0,o.C)([(0,a.M)({type:Number})],C.prototype,"currentPage",void 0),(0,o.C)([(0,a.M)({type:Boolean})],C.prototype,"autoPlay",void 0),(0,o.C)([(0,a.M)({type:Boolean})],C.prototype,"loopSlides",void 0),(0,o.C)([(0,a.M)({type:Boolean})],C.prototype,"playing",void 0),(0,o.C)([(0,a.M)({state:!0,type:Boolean})],C.prototype,"_pauseHold",void 0),(0,o.C)([(0,n.wk)()],C.prototype,"_positionInside",void 0),(0,o.C)([(0,n.wk)()],C.prototype,"_overflowObserver",void 0),C=(0,o.C)([(0,s.E)(`${x}-slider-controls`)],C);var k;i(8766);const{prefix:$}=b.W;let M=k=class extends r.WF{constructor(){super(),this.accessibleName="Slider accessible name",this.accessibleDescription="",this.contentType="slider",this.controlType="counter",this.controlPosition="under",this.desktopSlider=!1,this.mobileSlider=!1,this.peek=!1,this.adapt=!1,this.autoPlay=!1,this.autoPlaySpeed=5,this.desktopColumns=4,this.mobileColumns="2",this.gaplessColumns=!1,this.fill=!1,this._totalPages=1,this._currentPage=1,this._playing=!1,this._sliderItemsToShow=[],this._firstSlide=null,this._secondSlide=null,this._sliderItemOffset=0,this._slidesPerPage=1,this._loopSlides=!1,this._scrolling=!1,this._isSlideVisible=t=>{t.forEach(t=>{if(t.isIntersecting){if(t.target.shadowRoot?.querySelector("div")?.setAttribute("aria-hidden","false"),t.target.querySelectorAll("a, button").forEach(t=>{t.removeAttribute("tabindex")}),this.adapt){const e=t.target.getSlideContent();let i=0;Array.from(e).forEach(t=>{const e=t.offsetHeight;e&&e>0&&(i=e+i)}),i&&(this._slider.style.height=`${i}px`)}}else t.target.shadowRoot?.querySelector("div")?.setAttribute("aria-hidden","true"),t.target.querySelectorAll("a, button").forEach(t=>{t.setAttribute("tabindex","-1")})})},this._sliderId=Math.floor(1e8*Math.random()).toString(),k.eventTypes.forEach(t=>{this.addEventListener(t,this._customEventsHandler)})}connectedCallback(){super.connectedCallback(),this.initialise()}disconnectedCallback(){super.disconnectedCallback(),void 0!==this._resizeObserver&&this._resizeObserver.disconnect(),void 0!==this._slideVisibleObserver&&this._slideVisibleObserver.disconnect(),this._resetAutoplay()}slidesChanged(){this.initialise()}updated(t){t.has("_sliderItemsToShow")&&this._sliderSetup()}async initialise(){try{await this.updateComplete}catch(t){console.log("Initialise error",t)}this._sliderItems.length>0&&(this._sliderItemsToShow=Array.from(this._sliderItems).filter(t=>t.clientWidth>0))}_sliderSetup(){if(!(this._sliderItemsToShow.length<2)&&(this._firstSlide=this._sliderItemsToShow[0],this._secondSlide=this._sliderItemsToShow[1],this._playing=!1,this._sliderItemOffset=this._secondSlide.offsetLeft-this._firstSlide.offsetLeft,this._slidesPerPage=this._sliderItemOffset>0?Math.round(this._slider.clientWidth/this._sliderItemOffset):0,this._totalPages=this._slidesPerPage>0?this._sliderItemsToShow.length-this._slidesPerPage+1:1,"slideshow"===this.contentType&&this._slideshowSetup(),void 0===this._resizeObserver)){const t=(0,m.s)(()=>this.initialise(),100);this._resizeObserver=new ResizeObserver(t),this._resizeObserver.observe(this)}}_slideshowSetup(){this.desktopSlider=!0,this.mobileSlider=!0,this.autoPlay&&(this._resetAutoplay(),this.play()),this._slideVisibleObserver=new IntersectionObserver(this._isSlideVisible,{root:this,rootMargin:"0px",threshold:1}
6020),this._sliderItems.forEach((t,e)=>{this._slideVisibleObserver?.observe(t);const i=t.shadowRoot?.querySelector("div");i?.setAttribute("aria-label",`${e+1} of ${this._sliderItems.length}`)})}_customEventsHandler(t){t.preventDefault(),"previous-slide"===t.type&&(this._nthSlideavigation(t.type),this.pause()),"next-slide"===t.type&&(this._nextButtonClick(),this.pause()),"slide-link"===t.type&&this._slideLink(parseInt(t.detail.slideNumber)),"play-slider"===t.type&&this.play(),"pause-slider"===t.type&&this.pause(),"pause-over"===t.type&&this.pausePlay(),"pause-out"===t.type&&this.play()}_updateCurrentPage(){this._currentPage=Math.round(this._slider.scrollLeft/this._sliderItemOffset)+1}_scrollEnd(){this._scrolling=!1,this._updateCurrentPage()}_resetAutoplay(){clearInterval(this._autoRotate)}_nthSlideavigation(t){this._resetAutoplay(),this._playing=!1,this._scrolling&&"onscrollend"in window||(this._scrolling=!0,"previous-slide"===t?this._previousButtonClick():this._nextButtonClick(),this._updateCurrentPage())}_previousButtonClick(){if(!this._secondSlide||!this._firstSlide)return;const t=this._secondSlide.offsetLeft-this._firstSlide.offsetLeft;if(this._loopSlides&&1===this._currentPage)return this._slider.scrollTo({left:t*this._sliderItemsToShow.length}),void(this._currentPage=this._totalPages);this._slider.scrollTo({left:this._slider.scrollLeft-t})}_nextButtonClick(){if(this._secondSlide&&this._firstSlide)return this._loopSlides&&this._currentPage===this._totalPages?(this._slider.scrollTo({left:0}),void(this._currentPage=1)):void this._slider.scrollTo({left:this._slider.scrollLeft+(this._secondSlide.offsetLeft-this._firstSlide.offsetLeft)})}_slideLink(t){if(!this._secondSlide||!this._firstSlide)return;this._resetAutoplay(),this._playing=!1;const e=t,i=(this._secondSlide.offsetLeft-this._firstSlide.offsetLeft)*(e-1);this._slider.scrollTo({left:i})}_autoRotateSlides(){if(!this._sliderItemsToShow.length||!this._firstSlide)return;const t=this._currentPage===this._totalPages?0:this._slider.scrollLeft+this._sliderItemsToShow[1].offsetLeft-this._firstSlide.offsetLeft;this._slider.scrollTo({left:t})}initSlider(){this.initialise()}moveToSlide(t){this._slideLink(t)}play(){this._resetAutoplay(),this.autoPlay&&(this._playing=!0,this._slider.setAttribute("aria-live","off"),this._autoRotate=setInterval(()=>this._autoRotateSlides(),1e3*this.autoPlaySpeed))}pause(){this._resetAutoplay(),this.autoPlay&&(this._slider.setAttribute("aria-live","polite"),this._playing=!1)}pausePlay(){this._resetAutoplay(),this._slider.setAttribute("aria-live","polite")}resumePlay(){this.autoPlay&&this._playing&&this.play()}sliderComponentClasses(){const t={};return t["slider-component--desktop"]=this.desktopSlider,t["slider-component--tablet"]=this.mobileSlider,t["slider-controls--top"]="slideshow"===this.contentType,t}gridClasses(){const t={};return t.slider=this.mobileSlider||this.desktopSlider,t["slider--slideshow"]="slideshow"===this.contentType,t["slider--desktop"]=this.desktopSlider,t["slider--tablet"]=this.mobileSlider,t["grid--gapless"]=this.gaplessColumns,t["grid--fill"]=this.fill,t["grid--peek"]=this.peek&&this._totalPages>1,t["grid--"+this.desktopColumns+"-col-tablet"]=this.desktopColumns<3,t["grid--3-col-tablet"]=this.desktopColumns>=3,t["grid--"+this.desktopColumns+"-col-desktop"]=!0,t["grid--"+this.mobileColumns+"-col-tablet-down"]=!0,t}gridStyles(){let t={};return 6===this.desktopColumns&&(t={...t,"--umg-grid-desktop-columns-width":"16.66%","--umg-grid-desktop-columns":"6","--umg-grid-desktop-gaps":"5","--umg-grid-desktop-peek":"1.5"}),5===this.desktopColumns&&(t={...t,"--umg-grid-desktop-columns-width":"20%","--umg-grid-desktop-columns":"5","--umg-grid-desktop-gaps":"4","--umg-grid-desktop-peek":"2"}),4===this.desktopColumns&&(t={...t,"--umg-grid-desktop-columns-width":"25%","--umg-grid-desktop-columns":"4","--umg-grid-desktop-gaps":"3","--umg-grid-desktop-peek":"2.5"}),3===this.desktopColumns&&(t={...t,"--umg-grid-desktop-columns-width":"33.33%","--umg-grid-desktop-columns":"3","--umg-grid-desktop-gaps":"2","--umg-grid-desktop-peek":"3"}),2===this.desktopColumns&&(t={...t,"--umg-grid-desktop-columns-width":"50%","--umg-grid-desktop-columns":"2","--umg-grid-desktop-gaps":"1","--umg-grid-desktop-peek":"4"}),1===this.desktopColumns&&(t={...t,"--umg-grid-desktop-columns-width":"100%","--umg-grid-desktop-columns":"1","--umg-grid-desktop-gaps":"0","--umg-grid-desktop-peek":"9"}),t}sliderContent(){return"slider"===this.contentType?r.qy` 6021 <ul 6022 part="slider-container" 6023 id=${"Slider-"+this._sliderId} 6024 class="slider-container grid${(0,l.H)(this.gridClasses())}" 6025 role="list" 6026 aria-label="${this.accessibleName}" 6027 @scrollend="${this._scrollEnd}" 6028 > 6029 <slot @slotchange=${this.slidesChanged}></slot> 6030 </ul> 6031 `:r.qy` 6032 <div 6033 part="slider-container" 6034 id=${"Slider-"+this._sliderId} 6035 class="slider-container grid${(0,l.H)(this.gridClasses())}" 6036 role="region"
6037 aria-live="polite" 6038 aria-atomic="true" 6039 aria-label="${this.accessibleName}" 6040 aria-description="${this.accessibleDescription}" 6041 @scrollend="${this._scrollEnd}" 6042 @mouseover="${this.pausePlay}" 6043 @mouseout="${this.resumePlay}" 6044 @focusin="${this.pausePlay}" 6045 @focusout="${this.resumePlay}" 6046 > 6047 <slot @slotchange=${this.slidesChanged}></slot> 6048 </div> 6049 `}sliderControls(){return this.desktopSlider||this.mobileSlider?r.qy` 6050 <umg-slider-controls 6051 export="slider-controls-container" 6052 exportparts=" 6053 slider-controls, 6054 slider-counter, 6055 slider-counter-link, 6056 slider-counter-dot, 6057 slider-counter-current, 6058 slider-counter-seperator, 6059 slider-counter-total, 6060 slider-link-active, 6061 slider-link-dot-active, 6062 autoplay-button, 6063 next-button, 6064 previous-button, 6065 button-icon, 6066 icon, 6067 icon-container, 6068 icon-svg, 6069 icon-image 6070 " 6071 sliderId=${"Slider-"+this._sliderId} 6072 controlType=${this.controlType} 6073 controlPosition=${this.controlPosition} 6074 slidesPerPage=${this._slidesPerPage} 6075 numberOfSlides=${this._totalPages} 6076 currentPage=${this._currentPage} 6077 ?playing=${this._playing} 6078 ?autoPlay=${this.autoPlay} 6079 ?loopSlides=${this._loopSlides} 6080 > 6081 </umg-slider-controls> 6082 `:r.s6}render(){return r.qy` 6083 <div 6084 part="slider" 6085 class="slider-component slider-mobile-gutter${(0,l.H)(this.sliderComponentClasses())}" 6086 style="${(0,d.W)(this.gridStyles())}" 6087 > 6088 ${this.sliderContent()} 6089 ${this.sliderControls()} 6090 </div> 6091 `}};M.eventTypes=["previous-slide","next-slide","slide-link","pause-slider","play-slider","pause-over","pause-out"],M.styles=(0,v.Z)([h.S,r.AH` 6092 :host { 6093 display: block; 6094 width: 100%; 6095 } 6096 `,g.V,p]),(0,o.C)([(0,a.M)()],M.prototype,"accessibleName",void 0),(0,o.C)([(0,a.M)()],M.prototype,"accessibleDescription",void 0),(0,o.C)([(0,a.M)()],M.prototype,"contentType",void 0),(0,o.C)([(0,a.M)()],M.prototype,"controlType",void 0),(0,o.C)([(0,a.M)()],M.prototype,"controlPosition",void 0),(0,o.C)([(0,a.M)({type:Boolean})],M.prototype,"desktopSlider",void 0),(0,o.C)([(0,a.M)({type:Boolean})],M.prototype,"mobileSlider",void 0),(0,o.C)([(0,a.M)({type:Boolean})],M.prototype,"peek",void 0),(0,o.C)([(0,a.M)({type:Boolean})],M.prototype,"adapt",void 0),(0,o.C)([(0,a.M)({type:Boolean})],M.prototype,"autoPlay",void 0),(0,o.C)([(0,a.M)({type:Number})],M.prototype,"autoPlaySpeed",void 0),(0,o.C)([(0,a.M)({type:Number})],M.prototype,"desktopColumns",void 0),(0,o.C)([(0,a.M)()],M.prototype,"mobileColumns",void 0),(0,o.C)([(0,a.M)({type:Boolean})],M.prototype,"gaplessColumns",void 0),(0,o.C)([(0,a.M)({type:Boolean})],M.prototype,"fill",void 0),(0,o.C)([(0,n.wk)()],M.prototype,"_sliderId",void 0),(0,o.C)([(0,a.M)({type:Number})],M.prototype,"_totalPages",void 0),(0,o.C)([(0,u.K)()],M.prototype,"_sliderItems",void 0),(0,o.C)([(0,c.P)('[id^="Slider-"]')],M.prototype,"_slider",void 0),(0,o.C)([(0,n.wk)()],M.prototype,"_currentPage",void 0),(0,o.C)([(0,n.wk)()],M.prototype,"_playing",void 0),(0,o.C)([(0,n.wk)()],M.prototype,"_sliderItemsToShow",void 0),(0,o.C)([(0,n.wk)()],M.prototype,"_firstSlide",void 0),(0,o.C)([(0,n.wk)()],M.prototype,"_secondSlide",void 0),(0,o.C)([(0,n.wk)()],M.prototype,"_sliderItemOffset",void 0),(0,o.C)([(0,n.wk)()],M.prototype,"_slidesPerPage",void 0),(0,o.C)([(0,n.wk)()],M.prototype,"_loopSlides",void 0),(0,o.C)([(0,n.wk)()],M.prototype,"_scrolling",void 0),(0,o.C)([(0,n.wk)()],M.prototype,"_autoRotate",void 0),(0,o.C)([(0,n.wk)()],M.prototype,"_slideVisibleObserver",void 0),(0,o.C)([(0,n.wk)()],M.prototype,"_resizeObserver",void 0),M=k=(0,o.C)([(0,s.E)(`${$}-slider`)],M)},478(t,e,i){var o=i(8472),r=i(2618),s=i(6505),a=i(9563),n=i(31),l=i(9924),d=i(8698),c=i(2609);i(4792),i(8766);const{prefix:u}=d.W;let m=class extends r.WF{constructor(){super(...arguments),this.target="_self",this.size="large",this.spacing="normal",this.justify="start",this.mobileJustify="center",this.border=!1,this.padding="0"}socialLinks(){return this.data?this.data.map(t=>t.url?r.qy` 6097 <umg-button-icon 6098 part="social-icon" 6099 exportparts="button-icon,icon-container,icon-svg,icon-image" 6100 as="link" 6101 url="${(0,n.J)(t.url)}" 6102 target="${this.target}" 6103 icon="${t.icon}" 6104 size="${this.size}" 6105 label="${t.name}" 6106 padding=${this.padding} 6107 ?border="${this.border}" 6108 > 6109 </umg-button-icon> 6110 `:r.s6):r.s6}render(){return r.qy` 6111 <umg-link-group 6112 part="social-links" 6113 exportparts="link-group" 6114 spacing="${this.spacing}" 6115 justify="${this.justify}" 6116 mobileJustify="${this.mobileJustify}" 6117 > 6118 ${this.socialLinks()} 6119 </umg-link-group> 6120 `}};m.styles=(0,c.Z)([l.S]),(0,o.C)([(0,a.M)()],m.prototype,"target",void 0),(0,o.C)([(0,a.M)()],m.prototype,"size",void 0),(0,o.C)([(0,a.M)()],m.prototype,"spacing",void 0),(0,o.C)([(0,a.M)()],m.prototype,"justify",void 0),(0,o.C)([(0,a.M)()],m.prototype,"mobileJustify",void 0),(0,o.C)([(0,a.M)({type:Boolean})],m.prototype,"border",void 0),(0,o.C)([(0,a.M)()],m.prototype,"padding",void 0),(0,o.C)([(0,a.M)({type:Object})],m.prototype,"data",void 0),m=(0,o.C)([(0,s.E)(`${u}-socials`)],m)},7326(t,e,i){var o=i(8472),r=i(2618),s=i(6505),a=i(9563),n=i(3720),l=i(9924),d=i(8698),c=i(2609);i(9343);const{prefix:u}=d.W;let m=class extends r.WF{constructor(){super(...arguments),this.columnLabels=[],this.rowData=[],this.title="",this.hideTitle=!1}descriptionClasses(){const t={};return t["visually-hidden"]=this.hideTitle,t}tableHeader(){return Array.isArray(this.columnLabels)?r.qy` 6121 <div 6122 part="table-header" 6123 class="table-header row" 6124 role="rowgroup" 6125 > 6126 ${this.columnLabels.map(t=>r.qy`<div 6127part="table-header-cell" 6128class="table-cell" 6129role="columnheader"><umg-text 6130part="table-header-text" 6131as="span" 6132alignment="start" 6133fontWeight="bold">${t}</umg-text></div>`)} 6134 </div> 6135 `:r.s6}tableRows(){return this.rowData&&Array.isArray(this.rowData)?r.qy` ${this.rowData.map(t=>{if(Array.isArray(t))return r.qy`<div 6136part="table-row" 6137class="table-row row" 6138role="rowgroup">${t.map(t=>r.qy` 6139 <div 6140 part="table-cell" 6141 class="table-cell" 6142 role="cell" 6143 > 6144 <umg-text 6145 part="table-cell-text" 6146 exportparts="heading,paragrapoh,span" 6147 as="span" 6148 variant="bodySm" 6149 alignment="start" 6150 > 6151 ${t} 6152 </umg-text> 6153 </div> 6154 `)}</div>`})}`:r.s6}render(){return r.qy` 6155 <div 6156 part = "table" 6157 class="table" 6158 role = "table" 6159 aria-label="${this.title}" 6160 aria-describedby="TableDescription" 6161 > 6162 <div 6163 part = "table-description" 6164 id="TableDescription" 6165 class="table-description ${(0,n.H)(this.descriptionClasses())}" 6166 > 6167 <umg-text 6168 part="table-description-text" 6169 exportparts="heading,paragrapoh,span" 6170 slot="description" 6171 as="h2" 6172 variant="headingLg" 6173 fontWeight="bold" 6174 > 6175 ${this.title} 6176 </umg-text> 6177 </div> 6178 <div part="table-body" class="table-body"> 6179 ${this.tableHeader()} 6180 ${this.tableRows()} 6181 </div> 6182 </div> 6183 `}};m.styles=(0,c.Z)([l.S,r.AH` 6184 :host { 6185 display: block; 6186 } 6187 6188 .row { 6189 display: flex; 6190 justify-content: start; 6191 gap: var(--umg-space-16); 6192 padding: var(--umg-space-4, 0.25rem) 0; 6193 } 6194 .row > * { 6195 width: 10%; 6196 } 6197 .row > *:first-child { 6198 flex-grow: 1; 6199 width: 50%; 6200 } 6201 `]),(0,o.C)([(0,a.M)({type:Array})],m.prototype,"columnLabels",void 0),(0,o.C)([(0,a.M)({type:Array})],m.prototype,"rowData",void 0),(0,o.C)([(0,a.M)()],m.prototype,"title",void 0),(0,o.C)([(0,a.M)({type:Boolean})],m.prototype,"hideTitle",void 0),m=(0,o.C)([(0,s.E)(`${u}-table`)],m)},9343(t,e,i){var o=i(8472),r=i(2618),s=i(3720),a=i(1145),n=i(6505),l=i(9563),d=i(9924);const c=r.AH` 6202 .txt--headingXs, 6203 .txt--headingSm, 6204 .txt--headingMd, 6205 .txt--headingLg, 6206 .txt--headingXl, 6207 .txt--heading2xl, 6208 .txt--heading3xl, 6209 .txt--heading4xl, 6210 .txt--heading5xl, 6211 .txt--heading { 6212 font-family: var(--umg-font-heading-family, var(--umg-font-heading-family-default, inherit)); 6213 } 6214 .txt--bodyXs, 6215 .txt--bodySm, 6216 .txt--bodyMd, 6217 .txt--bodyLg, 6218 .txt--bodyXl, 6219 .txt--body2xl, 6220 .txt--body3xl, 6221 .txt--body4xl, 6222 .txt--body5xl, 6223 .txt--body { 6224 font-family: var(--umg-font-body-family, var(--umg-font-body-family-default, inherit)); 6225 } 6226`,u=r.AH` 6227 .txt--heading-custom { 6228 font-size: calc(var(--umg-font-heading-scale, 1) * var(--umg-font-base-size, 1.5)); 6229 line-height: calc(1 + 0.15 / max(1, var(--umg-font-heading-scale, 1))); 6230 } 6231 .txt--heading { 6232 font-size: calc(var(--umg-font-heading-scale, 1) * var(--umg-font-heading-size, 1.5)); 6233 line-height: calc(1 + 0.15 / max(1, var(--umg-font-heading-scale, 1))); 6234 } 6235 .txt--headingXs { 6236 font-size: var(--umg-font-heading-size-xs, 0.75rem); 6237 line-height: calc(1 + 0.2 / max(1, var(--umg-font-heading-scale, 1))); 6238 } 6239 .txt--headingSm { 6240 font-size: var(--umg-font-heading-size-sm, 0.875rem); 6241 line-height: calc(1 + 0.2 / max(1, var(--umg-font-heading-scale, 1))); 6242 } 6243 .txt--headingMd { 6244 font-size: var(--umg-font-heading-size-md, 1rem); 6245 line-height: calc(1 + 0.15 / max(1, var(--umg-font-heading-scale, 1))); 6246 } 6247 .txt--headingLg { 6248 font-size: calc(var(--umg-font-heading-scale, 1) * var(--umg-font-heading-size-lg, 1.25rem)); 6249 line-height: calc(1 + 0.15 / max(1, var(--umg-font-heading-scale, 1))); 6250 } 6251 .txt--headingXl { 6252 font-size: calc(var(--umg-font-heading-scale, 1) * var(--umg-font-heading-size-xl, 1.5rem)); 6253 line-height: calc(1 + 0.15 / max(1, var(--umg-font-heading-scale, 1))); 6254 } 6255 .txt--heading2xl { 6256 font-size: calc(var(--umg-font-heading-scale, 1) * var(--umg-font-heading-size-2xl, 1.75rem)); 6257 line-height: calc(1 + 0.15 / max(1, var(--umg-font-heading-scale, 1))); 6258 } 6259 .txt--heading3xl { 6260 font-size: calc(var(--umg-font-heading-scale, 1) * var(--umg-font-heading-size-3xl, 2rem)); 6261 line-height: calc(1 + 0.15 / max(1, var(--umg-font-heading-scale, 1))); 6262 } 6263 .txt--heading4xl { 6264 font-size: calc(var(--umg-font-heading-scale, 1) * var(--umg-font-heading-size-4xl, 3rem)); 6265 line-height: calc(1 + 0 / max(1, var(--umg-font-heading-scale, 1))); 6266 } 6267 .txt--heading5xl { 6268 font-size: calc(var(--umg-font-heading-scale, 1) * var(--umg-font-heading-size-5xl, 4rem)); 6269 line-height: calc(1 + 0 / max(1, var(--umg-font-heading-scale, 1))); 6270 } 6271 .txt--body-custom { 6272 font-size: calc(var(--umg-font-body-scale, 1) * var(--umg-font-base-size, 1)); 6273 line-height: calc(1 + 0.3 / max(1, var(--umg-font-body-scale, 1))); 6274 } 6275 .txt--body { 6276 font-size: calc(var(--umg-font-body-scale, 1) * var(--umg-font-body-size, 1)); 6277 line-height: calc(1 + 0.3 / max(1, var(--umg-font-body-scale, 1))); 6278 } 6279 .txt--bodyXs { 6280 font-size: var(--umg-font-body-size-xs, 0.75rem); 6281 line-height: calc(1 + 0.2 / max(1, var(--umg-font-body-scale, 1))); 6282 } 6283 .txt--bodySm { 6284 font-size: var(--umg-font-body-size-sm, 0.875rem); 6285 line-height: calc(1 + 0.2 / max(1, var(--umg-font-body-scale, 1))); 6286 } 6287 .txt--bodyMd { 6288 font-size: calc(var(--umg-font-body-scale, 1) * var(--umg-font-body-size-md, 1rem)); 6289 line-height: calc(1 + 0.3 / max(1, var(--umg-font-body-scale, 1))); 6290 } 6291 .txt--bodyLg { 6292 font-size: calc(var(--umg-font-body-scale, 1) * var(--umg-font-body-size-lg, 1.25rem)); 6293 line-height: calc(1 + 0.25 / max(1, var(--umg-font-body-scale, 1))); 6294 } 6295 .txt--bodyXl { 6296 font-size: calc(var(--umg-font-body-scale, 1) * var(--umg-font-body-size-xl, 1.5rem)); 6297 line-height: calc(1 + 0.25 / max(1, var(--umg-font-body-scale, 1))); 6298 } 6299 .txt--body2xl { 6300 font-size: calc(var(--umg-font-body-scale, 1) * var(--umg-font-body-size-2xl, 1.75rem)); 6301 line-height: calc(1 + 0.15 / max(1, var(--umg-font-body-scale, 1))); 6302 } 6303 .txt--body3xl { 6304 font-size: calc(var(--umg-font-body-scale, 1) * var(--umg-font-body-size-3xl, 2rem)); 6305 line-height: calc(1 + 0.15 / max(1, var(--umg-font-body-scale, 1))); 6306 } 6307 .txt--body4xl { 6308 font-size: calc(var(--umg-font-body-scale, 1) * var(--umg-font-body-size-4xl, 3rem)); 6309 line-height: calc(1 + 0 / max(1, var(--umg-font-body-scale, 1))); 6310 } 6311 .txt--body5xl { 6312 font-size: calc(var(--umg-font-body-scale, 1) * var(--umg-font-body-size-5xl, 4rem)); 6313 line-height: calc(1 + 0 / max(1, var(--umg-font-body-scale, 1))); 6314 } 6315`,m=r.AH` 6316 .txt--color-default { 6317 color: rgb(var(--umg-color-base-text)); 6318 } 6319 .txt--color-subdued { 6320 color: rgb(var(--umg-color-base-text-subdued)); 6321 } 6322 .txt--color-warning { 6323 color: rgb(var(--umg-color-base-text-warning)); 6324 } 6325 .txt--color-inverse { 6326 color: rgb(var(--umg-color-base-text-inverse)); 6327 } 6328 @supports (color: rgb(from white r g b)) { 6329 .txt--color-default { 6330 color: rgb(from var(--umg-color-base-text) r g b); 6331 } 6332 .txt--color-subdued { 6333 color: rgb(from var(--umg-color-base-text-subdued) r g b); 6334 } 6335 .txt--color-warning { 6336 color: rgb(from var(--umg-color-base-text-warning) r g b); 6337 } 6338 .txt--color-inverse { 6339 color: rgb(from var(--umg-color-base-text-inverse) r g b); 6340 } 6341 } 6342`,h=r.AH` 6343 .txt--inherit { 6344 font-weight: var(--umg-font-base-weight, 400); 6345 } 6346 .txt--light { 6347 font-weight: var(--umg-font-base-weight-light, 300); 6348 } 6349 .txt--regular { 6350 font-weight: var(--umg-font-base-weight-regular, 400); 6351 } 6352 .txt--medium { 6353 font-weight: var(--umg-font-base-weight-medium, 500); 6354 } 6355 .txt--semibold { 6356 font-weight: var(--umg-font-base-weight-semibold, 600); 6357 } 6358 .txt--bold { 6359 font-weight: var(--umg-font-base-weight-bold, 700); 6360 } 6361 .txt--extrabold { 6362 font-weight: var(--umg-font-base-weight-extrab
6362old, 800); 6363 } 6364 .txt--black { 6365 font-weight: var(--umg-font-base-weight-black, 900); 6366 } 6367`,p=r.AH` 6368 .txt--headingXs { 6369 margin-bottom: var(--umg-space-4, 0.25rem); 6370 } 6371 .txt--headingSm { 6372 margin-bottom: var(--umg-space-8, 0.5rem); 6373 } 6374 .txt--headingMd { 6375 margin-bottom: var(--umg-space-12, 0.75rem); 6376 } 6377 .txt--headingLg { 6378 margin-bottom: var(--umg-space-12, 0.75rem); 6379 } 6380 .txt--headingXl { 6381 margin-bottom: var(--umg-space-16, 1rem); 6382 } 6383 .txt--heading2xl { 6384 margin-bottom: var(--umg-space-16, 1rem); 6385 } 6386 .txt--heading3xl { 6387 margin-bottom: var(--umg-space-16, 1rem); 6388 } 6389 .txt--heading4xl { 6390 margin-bottom: var(--umg-space-20, 1.25rem); 6391 } 6392 .txt--heading5xl { 6393 margin-bottom: var(--umg-space-24, 1.5rem); 6394 } 6395 .txt--bodyXs { 6396 margin-bottom: var(--umg-space-4, 0.25rem); 6397 } 6398 .txt--bodySm { 6399 margin-bottom: var(--umg-space-8, 0.5rem); 6400 } 6401 .txt--bodyMd, 6402 .txt--bodyLg, 6403 .txt--bodyXl, 6404 .txt--body2xl, 6405 .txt--body3xl, 6406 .txt--body4xl, 6407 .txt--body5xl { 6408 margin-bottom: var(--umg-space-12, 0.75rem); 6409 } 6410`,g=r.AH` 6411 .txt--italic { 6412 font-style: italic; 6413 } 6414 .txt--oblique { 6415 font-style: oblique; 6416 } 6417 .txt--normal { 6418 font-style: normal; 6419 } 6420`;var b=i(8698),v=i(2609);const{prefix:y}=b.W;let f=class extends r.WF{constructor(){super(...arguments),this.as="p",this.variant="bodyMd",this.color="default",this.fontWeight="inherit",this.fontStyle="normal",this.withoutMargin=!1,this.transform="none",this.truncate=!1,this.breakWord=!1,this.hidden=!1}textClasses(){const t={text:!0,"txt--truncate":this.truncate,"txt--breakword":this.breakWord,"txt--hidden":this.hidden};return this.color&&(t["txt--color-"+this.color]=!0),this.variant&&(t["txt--"+this.variant]=!0),this.lineHeight&&(t["txt--line-height-"+this.lineHeight]=!0),this.spacing&&(t["txt--spacing-"+this.spacing]=!0),this.fontWeight&&(t["txt--"+this.fontWeight]=!0),this.fontStyle&&(t["txt--"+this.fontStyle]=!0),this.alignment&&(t["txt--align-"+this.alignment]=this.alignment),this.mobileAlignment?t["txt--mobile-align-"+this.mobileAlignment]=!0:t["txt--mobile-align-"+this.alignment]=this.alignment,this.withoutMargin&&"span"!==this.as&&(t["text--without-margin"]=!0),"none"!==this.transform&&(t["txt-transform--"+this.transform]=!0),t}textStyles(){let t={};return!this.fontSize||"body-custom"!==this.variant&&"heading-custom"!==this.variant||(t={...t,"--umg-font-base-size":this.fontSize/16+"rem"}),t}textAs(t){switch(this.as){case"p":return r.qy`<p part="p-text paragraph" class="paragraph${(0,s.H)(t)}" style="${(0,a.W)(this.textStyles())}"><slot></slot></p>`;case"h1":return r.qy`<h1 part="h1-text heading" class="heading${(0,s.H)(t)}" style="${(0,a.W)(this.textStyles())}"><slot></slot></h1>`;case"h2":return r.qy`<h2 part="h2-text heading" class="heading${(0,s.H)(t)}" style="${(0,a.W)(this.textStyles())}"><slot></slot></h2>`;case"h3":return r.qy`<h3 part="h3-text heading" class="heading${(0,s.H)(t)}" style="${(0,a.W)(this.textStyles())}"><slot></slot></h3>`;case"h4":return r.qy`<h4 part="h4-text heading" class="heading${(0,s.H)(t)}" style="${(0,a.W)(this.textStyles())}"><slot></slot></h4>`;case"h5":return r.qy`<h5 part="h5-text heading" class="heading${(0,s.H)(t)}" style="${(0,a.W)(this.textStyles())}"><slot></slot></h5>`;case"skeleton":return r.qy`<div class="skeleton${(0,s.H)(t)}"></div>`;default:return r.qy` 6421 <span part="span-text span" class="span${(0,s.H)(t)}"><slot></slot></span>`}}render(){return r.qy`${this.textAs(this.textClasses())}`}};f.styles=(0,v.Z)([d.S,c,u,m,h,g,p,r.AH` 6422 .skeleton { 6423 display: flex; 6424 background-color: var(--umg-color-skeleton-background, rgb(0,0,0,0.2)); 6425 height: 0.5rem; 6426 border-radius: 0.5rem; 6427 min-width: 5rem; 6428 } 6429 @supports (color: rgb(from white r g b)) { 6430 .skeleton { 6431 background-color: rgb(from var(--umg-color-base-text) r g b / 0.2); 6432 } 6433 } 6434 6435 span.span.text { 6436 margin-bottom: 0; 6437 } 6438 .heading, 6439 .paragraph { 6440 margin-top: 0; 6441 text-align: inherit; 6442 } 6443 6444 .heading.text--without-margin, 6445 .paragraph.text--without-margin, 6446 .skeleton.text--without-margin { 6447 margin-bottom: 0; 6448 } 6449 6450 .txt-transform--uppercase { 6451 text-transform: uppercase; 6452 } 6453 .txt-transform--capitalize { 6454 text-transform: capitalize 6455 } 6456 .txt-transform--lowercase { 6457 text-transform: lowercase; 6458 } 6459 .txt--truncate { 6460 overflow: hidden; 6461 white-space: nowrap; 6462 text-overflow: ellipsis; 6463 } 6464 .txt--breakword {
6465 overflow-wrap: anywhere; 6466 word-break: normal; 6467 } 6468 .txt--hidden { 6469 position: absolute !important; 6470 overflow: hidden; 6471 width: 1px; 6472 height: 1px; 6473 margin: -1px; 6474 padding: 0; 6475 border: 0; 6476 clip: rect(0 0 0 0); 6477 word-wrap: normal !important; 6478 } 6479 6480 /* Text line-height */ 6481 .txt--line-height-extra-loose.heading, 6482 .txt--line-height-extra-loose.paragraph { 6483 line-height: calc(1 + 1 / max(1, var( --umg-font-body-scale, 1))); 6484 } 6485 .txt--line-height-loose.heading, 6486 .txt--line-height-loose.paragraph { 6487 line-height: calc(1 + 0.8 / max(1, var( --umg-font-body-scale, 1))); 6488 } 6489 .txt--line-height-normal.heading, 6490 .txt--line-height-normal.paragraph { 6491 line-height: calc(1 + 0.5 / max(1, var( --umg-font-body-scale, 1))); 6492 } 6493 .txt--line-height-compact.heading, 6494 .txt--line-height-compact.paragraph { 6495 line-height: calc(1 + 0.3 / max(1, var( --umg-font-body-scale, 1))); 6496 } 6497 6498 /* Text kerning */ 6499 .txt--spacing-extra-loose.heading, 6500 .txt--spacing-extra-loose.paragraph, 6501 .txt--spacing-extra-loose.span { 6502 letter-spacing: 0.1rem; 6503 } 6504 .txt--spacing-loose.heading, 6505 .txt--spacing-loose.paragraph, 6506 .txt--spacing-loose.span { 6507 letter-spacing: 0.05rem; 6508 } 6509 .txt--spacing-normal.heading, 6510 .txt--spacing-normal.paragraph, 6511 .txt--spacing-normal.span { 6512 letter-spacing: inherit; 6513 } 6514 6515 /* Text justification */ 6516 @media screen and (max-width: 48rem) { 6517 .txt--mobile-align-start { 6518 text-align: left; 6519 } 6520 .txt--mobile-align-center { 6521 text-align: center; 6522 } 6523 .txt--mobile-align-end { 6524 text-align: right; 6525 } 6526 .txt--mobile-align-justify { 6527 text-align: justify; 6528 } 6529 } 6530 @media screen and (min-width: 48.06rem) { 6531 .txt--margin { 6532 margin-bottom: var(--umg-space-16, 1rem); 6533 } 6534 .txt--align-start { 6535 text-align: left; 6536 } 6537 .txt--align-center { 6538 text-align: center; 6539 } 6540 .txt--align-end { 6541 text-align: right; 6542 } 6543 .txt--align-justify { 6544 text-align: justify; 6545 } 6546 } 6547 `]),(0,o.C)([(0,l.M)({type:String})],f.prototype,"as",void 0),(0,o.C)([(0,l.M)({type:String})],f.prototype,"variant",void 0),(0,o.C)([(0,l.M)({type:String})],f.prototype,"color",void 0),(0,o.C)([(0,l.M)({type:Number})],f.prototype,"fontSize",void 0),(0,o.C)([(0,l.M)({type:String})],f.prototype,"fontWeight",void 0),(0,o.C)([(0,l.M)({type:String})],f.prototype,"fontStyle",void 0),(0,o.C)([(0,l.M)({type:String})],f.prototype,"lineHeight",void 0),(0,o.C)([(0,l.M)({type:String})],f.prototype,"spacing",void 0),(0,o.C)([(0,l.M)({type:String})],f.prototype,"alignment",void 0),(0,o.C)([(0,l.M)({type:String})],f.prototype,"mobileAlignment",void 0),(0,o.C)([(0,l.M)({type:Boolean})],f.prototype,"withoutMargin",void 0),(0,o.C)([(0,l.M)()],f.prototype,"transform",void 0),(0,o.C)([(0,l.M)({type:Boolean})],f.prototype,"truncate",void 0),(0,o.C)([(0,l.M)({type:Boolean})],f.prototype,"breakWord",void 0),(0,o.C)([(0,l.M)({type:Boolean})],f.prototype,"hidden",void 0),f=(0,o.C)([(0,n.E)(`${y}-text`)],f)},7018(t,e,i){var o=i(8472),r=i(6505),s=i(9563),a=i(2115),n=i(2618),l=i(7838),d=i(8698);const{prefix:c}=d.W;let u=class extends l.q{constructor(){super(...arguments),this.mediaId=""}};u.styles=[l.q.styles,n.AH` 6548 :host { 6549 padding: var(--umg-space-4, 0.25rem); 6550 } 6551 :host([active]) { 6552 padding: 0; 6553 position: relative; 6554 } 6555 :host([active])::after { 6556 content: ''; 6557 display: block; 6558 position: absolute; 6559 inset: 0; 6560 background-color: rgb(255,255,255,0.2); 6561 cursor: default; 6562 } 6563 li { 6564 border: 0.0625rem solid rgb(0,0,0,0.1); 6565 } 6566 `],(0,o.C)([(0,s.M)()],u.prototype,"mediaId",void 0),u=(0,o.C)([(0,r.E)(`${c}
6566-thumbnail-slide`)],u);var m=i(1088);const{prefix:h}=d.W;let p=class extends a.A{constructor(){super(),this.currentMediaId="",this.contentType="slider",this.desktopSlider=!0,this.mobileSlider=!0,this.slideEventManager=new m.E(this);const t=[...this.constructor.eventTypes];t.push("active-slide"),t.forEach(t=>{this.addEventListener(t,this._customEventsHandler)}),this._initialiseSlides()}async _initialiseSlides(){await this.updateComplete,this._updateActiveSlide(this.currentMediaId),this._sliderItems.forEach(t=>{t.addEventListener("click",()=>{const e={mediaId:t.getAttribute("mediaId")};this._eventsDispatcher("active-slide",e)})})}slidesChanged(){super.slidesChanged(),this._initialiseSlides()}_updateActiveSlide(t){t&&this._sliderItems.forEach((e,i)=>{e.hasAttribute("active")&&e.removeAttribute("active");const o=e.getAttribute("mediaId");if(t===o){e.setAttribute("active",""),this._updateActiveMedia(o);const t={slideNumber:i+1};this._eventsDispatcher("slide-link",t)}})}_updateActiveMedia(t){this.slideEventManager.dispatchCustomEvent("active-media",{mediaId:t},{bubbles:!0,composed:!0})}_eventsDispatcher(t,e){if(!t)throw new Error("Missing custom event type");const i={bubbles:!0,composed:!0};"active-slide"==t&&this.slideEventManager.dispatchCustomEvent(t,e,i),"slide-link"==t&&this.slideEventManager.dispatchCustomEvent(t,e,i)}_customEventsHandler(t){super._customEventsHandler(t),"active-slide"===t.type&&this._updateActiveSlide(t.detail.mediaId)}updated(t){super.updated(t),t.has("currentMediaId")&&t.get("currentMediaId")&&this._updateActiveSlide(this.currentMediaId)}gridClasses(){const t=super.gridClasses();return t["slider--selectable"]=!0,t}};(0,o.C)([(0,s.M)({reflect:!0})],p.prototype,"currentMediaId",void 0),(0,o.C)([(0,s.M)({state:!0})],p.prototype,"contentType",void 0),(0,o.C)([(0,s.M)({state:!0,type:Boolean})],p.prototype,"desktopSlider",void 0),(0,o.C)([(0,s.M)({state:!0,type:Boolean})],p.prototype,"mobileSlider",void 0),p=(0,o.C)([(0,r.E)(`${h}-thumbnail-slider`)],p)},1682(t,e,i){var o=i(8472),r=i(2618),s=i(1145),a=i(3720),n=i(6505),l=i(9563),d=i(8698),c=i(9924),u=i(328),m=i(2609);const{prefix:h}=d.W;let p=class extends r.WF{constructor(){super(...arguments),this.align="stretch",this.justify="start"}stackStyles(){let t={};return void 0!==this.spacing&&(t={...t,"--umg-space-grid-vertical-desktop":Number(this.spacing)/16+"rem"}),void 0!==this.mobileSpacing?t={...t,"--umg-space-grid-vertical-mobile":Number(this.mobileSpacing)/16+"rem"}:void 0!==this.spacing&&(t={...t,"--umg-space-grid-vertical-mobile":Number(this.spacing)/16+"rem"}),t}stackClasses(){const t={};return t["group-justify--"+this.justify]=!0,t["group-align--"+this.align]=!0,this.mobileJustify?t["group-mobile-justify--"+this.mobileJustify]=!0:t["group-mobile-justify--"+this.justify]=!0,this.mobileAlign?t["group-mobile-align--"+this.mobileAlign]=!0:t["group-mobile-align--"+this.align]=!0,t}render(){return r.qy` 6567 <div 6568 part="vertical-stack" 6569 class="vertical-stack${(0,a.H)(this.stackClasses())}" 6570 style="${(0,s.W)(this.stackStyles())}" 6571 > 6572 <slot></slot> 6573 </div> 6574 `}};p.styles=(0,m.Z)([c.S,r.AH` 6575 :host, 6576 :host([height=fill]) { 6577 display: block; 6578 height: 100%; 6579 } 6580 :host([height=fit-content]) { 6581 height: fit-content; 6582 } 6583 :host([height=auto]) { 6584 height: auto; 6585 } 6586 :host { 6587 width: 100%; 6588 } 6589 ::slotted(*) { 6590 flex-shrink: 1; 6591 height: auto; 6592 } 6593 6594 .vertical-stack { 6595 display: flex; 6596 flex-direction: column; 6597 height: 100%; 6598 } 6599 @media screen and (min-width: 48.06rem) { 6600 .vertical-stack { 6601 gap: var(--umg-space-grid-vertical-desktop, 1rem); 6602 } 6603 } 6604 @media screen and (max-width: 48rem) { 6605 .vertical-stack { 6606 gap: var(--umg-space-grid-vertical-mobile, 1rem); 6607 } 6608 } 6609 6610 .vertical-stack.group-justify--stretch ::slotted(*) { 6611 flex-grow: 1; 6612 flex-shrink: 0; 6613 } 6614 6615 .vertical-stack.group-align--stretch ::slotted(*) { 6616 display: block; 6617 width: 100%; 6618 } 6619 `,u.rw,u.Oh,u.jt,u.yw]),(0,o.C)([(0,l.M)()],p.prototype,"spacing",void 0),(0,o.C)([(0,l.M)()],p.prototype,"mobileSpacing",void 0),(0,o.C)([(0,l.M)()],p.prototype,"align",void 0),(0,o.C)([(0,l.M)()],p.prototype,"justify",void 0),(0,o.C)([(0,l.M)()],p.prototype,"mobileAlign",void 0),(0,o.C)([(0,l.M)()],p.prototype,"mobileJustify",void 0),p=(0,o.C)([(0,n.E)(`${h}-vertical-stack`)],p)},306(t,e,i){var o=i(8472),r=i(2618),s=i(6505),a=i(9563),n=i(7621),l=i(3720),d=i(31),c=i(9924),u=i(4379),m=i(8698),h=i(2609);const{prefix:p}=m.W;let g=class extends r.WF{constructor(){super(),this.sources=[],this.posterSource=void 0,this.width=100,this.height=100,this.fit="adapt",this.inBackgroun
6619d=!1,this.autoplay=!0,this.muted=!0,this.loop=!1,this.controls=!1,this._hasPlayed=!1,this.initialise()}containerClasses(){const t={};return t["image-fit--"+this.fit]=!0,t}async initialise(){await this.updateComplete,this._hasPlayed||(this._videoElement?.play(),this._hasPlayed=!0)}handleFirstPlay(){this._hasPlayed||(this._hasPlayed=!0)}videoType(){return this.inBackground?r.qy` 6620 <video 6621 width="${this.width}" 6622 height="${this.height}" 6623 playsinline 6624 autoplay 6625 loop 6626 muted 6627 @play=${this.handleFirstPlay} 6628 > 6629 ${this.sources.map(t=>r.qy`<source.src="${t.src}".type="video/${t.type}" 6630width="${this.width}" 6631height="${this.height}"></source>`)} 6632 </video> 6633 `:r.qy` 6634 <video 6635 part="video" 6636 width="${this.width}" 6637 height="${this.height}" 6638 poster="${(0,d.J)(this.posterSource)}" 6639 ?controls="${this.controls}" 6640 ?autoplay="${this.autoplay}" 6641 ?loop="${this.loop}" 6642 ?muted="${this.muted}" 6643 @play=${this.handleFirstPlay} 6644 > 6645 ${this.sources.map(t=>r.qy`<source.src="${t.src}".type="video/${t.type}" 6646width="${this.width}" 6647height="${this.height}"></source>`)} 6648 </video> 6649 `}video(){return Array.isArray(this.sources)&&this.sources.length?r.qy` 6650 ${this.videoType()} 6651 `:r.qy` 6652 <div class="placeholder image image--desktop${(0,l.H)(this.containerClasses())}" style="aspect-ratio: ${this.width/this.height}"> 6653 <div class="placeholder-inner"> 6654 <svg class="icon" xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 576 512" fill="currentcolor"> 6655 <path d="M70.5 138.1C31 172.2 16 219.1 16 272c0 52 18.4 91.6 46.9 118.3C91.6 417.2 131.5 432 176 432h8.4c18.2 0 34.8-10.3 42.9-26.5l23.2-46.3C257.6 345 272.1 336 288 336s30.4 9 37.5 23.2l23.2 46.3c8.1 16.3 24.8 26.5 42.9 26.5H400c44.5 0 84.4-14.8 113.1-41.7C541.6 363.6 560 324 560 272c0-52.9-15-99.8-54.5-133.9C465.6 103.6 398.1 80 288 80s-177.6 23.6-217.5 58.1zM0 272C0 160 64 64 288 64s288 96 288 208s-80 176-176 176h-8.4c-24.2 0-46.4-13.7-57.2-35.4l-23.2-46.3c-4.4-8.8-13.3-14.3-23.2-14.3s-18.8 5.5-23.2 14.3l-23.2 46.3c-10.8 21.7-33 35.4-57.2 35.4H176C80 448 0 384 0 272zm160 32a48 48 0 1 0 0-96 48 48 0 1 0 0 96zm0-112a64 64 0 1 1 0 128 64 64 0 1 1 0-128zm304 64a48 48 0 1 0 -96 0 48 48 0 1 0 96 0zm-112 0a64 64 0 1 1 128 0 64 64 0 1 1 -128 0z"/> 6656 </svg> 6657 </div> 6658 </div> 6659 `}render(){return r.qy` 6660 <div 6661 part="video-container" 6662 class="video-container${(0,l.H)(this.containerClasses())}" 6663 > 6664 ${this.video()} 6665 </div> 6666 `}};g.styles=(0,h.Z)([c.S,u.o,r.AH` 6667 :host { 6668 display: block; 6669 } 6670 :host([fit=cover]), 6671 :host([fit=contain]) { 6672 height: 100%; 6673 } 6674 6675 .video-container.image-fit--cover, 6676 .video-container.image-fit--contain { 6677 height: 100%; 6678 position: relative; 6679 } 6680 6681 .image-fit--cover video, 6682 .image-fit--contain video { 6683 position: absolute; 6684 height: 100%; 6685 width: 100%; 6686 } 6687 6688 video, .image { 6689 display: block; 6690 height: auto; 6691 width: 100%; 6692 } 6693 6694 /* Image fit */ 6695 .image-fit--cover video { 6696 object-fit: cover; 6697 } 6698 .image-fit--contain video { 6699 object-fit: contain; 6700 } 6701 `]),(0,o.C)([(0,a.M)({type:Array})],g.prototype,"sources",void 0),(0,o.C)([(0,a.M)()],g.prototype,"posterSource",void 0),(0,o.C)([(0,a.M)({type:Number})],g.prototype,"width",void 0),(0,o.C)([(0,a.M)({type:Number})],g.prototype,"height",void 0),(0,o.C)([(0,a.M)({type:String})],g.prototype,"fit",void 0),(0,o.C)([(0,a.M)({type:Boolean}
6701)],g.prototype,"inBackground",void 0),(0,o.C)([(0,a.M)({type:Boolean})],g.prototype,"autoplay",void 0),(0,o.C)([(0,a.M)({type:Boolean})],g.prototype,"muted",void 0),(0,o.C)([(0,a.M)({type:Boolean})],g.prototype,"loop",void 0),(0,o.C)([(0,a.M)({type:Boolean})],g.prototype,"controls",void 0),(0,o.C)([(0,n.wk)()],g.prototype,"_hasPlayed",void 0),(0,o.C)([(0,n.P)("video")],g.prototype,"_videoElement",void 0),g=(0,o.C)([(0,s.E)(`${p}-video`)],g)},8472(t,e,i){function o(t,e,i,o){var r,s=arguments.length,a=s<3?e:null===o?o=Object.getOwnPropertyDescriptor(e,i):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(t,e,i,o);else for(var n=t.length-1;n>=0;n--)(r=t[n])&&(a=(s<3?r(a):s>3?r(e,i,a):r(e,i))||a);return s>3&&a&&Object.defineProperty(e,i,a),a}i.d(e,{C:()=>o}),"function"==typeof SuppressedError&&SuppressedError},2609(t,e,i){i.d(e,{Z:()=>r});var o=i(8698);function r(t){const e=function(){const t=o.W.globalConstructedStyleSheet;if(void 0!==window.constructibleStyleSheets&&void 0!==window.constructibleStyleSheets[t])return window.constructibleStyleSheets[t]}(),i=Array.isArray(t)?t:[t];return e&&i.push(e),i}},8698(t,e,i){i.d(e,["W",0,{prefix:"umg",globalConstructedStyleSheet:"umgtheme"}])},6093(t,e,i){function o(t,e){let i=0;return function(...o){clearTimeout(i),i=setTimeout(()=>t.apply(this,o),e)}}i.d(e,{s:()=>o})},9061(t,e,i){function o(t,e){return!!t.target&&(Array.isArray(e)&&e.length>1?e.some(e=>t.target.getAttribute("name")===e):!!e&&t.target.getAttribute("name")===e)}i.d(e,{Y:()=>o})},9924(t,e,i){const o=i(2618).AH` 6702 6703 /* Box sizing */ 6704 *, *:before, *:after { 6705 box-sizing: border-box; 6706 } 6707 6708 /* Font family type groups */ 6709 h1,h2,h3,h4,h5,h6 { 6710 font-family: var(--umg-font-heading-family, 'Roboto Serif', Times, 'Times New Roman', Georgia, serif); 6711 } 6712 6713 p { 6714 font-family: var(--umg-font-body-family, Roboto, Arial, Helvetica, sans-serif); 6715 } 6716 6717 /* Hidden elements */ 6718 *[hidden="true" i] { display: none } 6719 6720 .visually-hidden { 6721 position: absolute !important; 6722 overflow: hidden; 6723 width: 1px; 6724 height: 1px; 6725 margin: -1px; 6726 padding: 0; 6727 border: 0; 6728 clip: rect(0 0 0 0); 6729 word-wrap: normal !important; 6730 } 6731 6732 /* Browser native features */ 6733 summary { 6734 -webkit-tap-highlight-color: transparent; 6735 } 6736 6737 /* Accessibilty states */ 6738 *:focus-visible:not(umg-button-icon), .focus-visible { 6739 outline: 0.125rem solid rgb(from var(--umg-color-base-text, rgb(0,0,0)) r g b / 0.5); 6740 outline-offset: 0.1875rem; 6741 box-shadow: 6742 0 0 0 0.1875rem rgb(from var(--umg-color-base-background, rgb(255,255,255)) r g b / 1), 6743 0 0 0 0.3125rem 0.25rem rgb(from var(--umg-color-base-text, rgb(0,0,0)) r g b / 0.3); 6744 } 6745`;i.d(e,["S",0,o])},3023(t,e,i){const o=i(2618).AH` 6746 6747 /* Grid layout */ 6748 .grid { 6749 display: flex; 6750 flex-wrap: wrap; 6751 row-gap: var(--umg-space-grid-vertical-mobile, 1rem); 6752 column-gap: var(--umg-space-grid-horizontal-mobile, 1rem); 6753 list-style: none; 6754 margin: 0; 6755 padding: 0; 6756 } 6757 @media screen and (min-width: 48.06rem) { 6758 .grid { 6759 row-gap: var(--umg-space-grid-vertical-desktop, 1.5rem); 6760 column-gap: var(--umg-space-grid-horizontal-desktop, 1.5rem); 6761 } 6762 } 6763 6764 /* Grid */ 6765 /* Default */ 6766 /* grid..grid--columns class for grids with non-slotted grid items */ 6767 .grid:not(.grid--columns) ::slotted(*), 6768 .grid > * { 6769 width: calc(25% - var(--umg-space-grid-horizontal-mobile, 1rem) * 3 / 4); 6770 flex-grow: 0; 6771 flex-shrink: 0; 6772 } 6773 6774 .grid.grid--gapless { 6775 gap: 0; 6776 } 6777
6778 .grid:not(.grid--columns).grid--fill ::slotted(*), 6779 .grid.grid--fill > * { 6780 flex-grow: 1; 6781 } 6782 6783 /* Mobile by class */ 6784 @media screen and (max-width: 30rem) { 6785 .grid--1-col-tablet-down:not(.grid--columns) ::slotted(*), 6786 .grid--1-col-tablet-down > * { 6787 width: 100%; 6788 } 6789 .grid--2-col-tablet-down:not(.grid--columns) ::slotted(*), 6790 .grid--2-col-tablet-down > * { 6791 width: calc( 50% - var(--umg-space-grid-horizontal-mobile, 1rem) / 2 ); 6792 } 6793 } 6794 6795 /* Tablet portrait by class */ 6796 @media screen and (min-width: 30.06rem) and (max-width: 48rem) { 6797 .grid--4-col-tablet:not(.grid--columns) ::slotted(*), 6798 .grid--4-col-tablet > * { 6799 width: calc(25% - var(--umg-space-grid-horizontal-mobile, 1rem) * 3 / 4); 6800 } 6801 .grid--3-col-tablet:not(.grid--columns) ::slotted(*), 6802 .grid--3-col-tablet > * { 6803 width: calc(33.33% - var(--umg-space-grid-horizontal-mobile, 1rem) * 2 / 3); 6804 } 6805 .grid--2-col-tablet:not(.grid--columns) ::slotted(*), 6806 .grid--2-col-tablet > * { 6807 width: calc(50% - var(--umg-space-grid-horizontal-mobile, 1rem) / 2); 6808 } 6809 .grid--1-col-tablet:not(.grid--columns) ::slotted(*), 6810 .grid--1-col-tablet > * { 6811 width: 100%; 6812 } 6813 } 6814 6815 /* Tablet landscape by class */ 6816 @media screen and (min-width: 48.06rem) and (max-width: 64rem) { 6817 .grid--4-col-tablet:not(.grid--columns) ::slotted(*), 6818 .grid--4-col-tablet > * { 6819 width: calc(25% - var(--umg-space-grid-horizontal-desktop, 1.5rem) * 3 / 4); 6820 } 6821 .grid--3-col-tablet:not(.grid--columns) ::slotted(*), 6822 .grid--3-col-tablet > * { 6823 width: calc(33.33% - var(--umg-space-grid-horizontal-desktop, 1.5rem) * 2 / 3); 6824 } 6825 .grid--2-col-tablet:not(.grid--columns) ::slotted(*), 6826 .grid--2-col-tablet > * { 6827 width: calc(50% - var(--umg-space-grid-horizontal-desktop, 1.5rem) / 2); 6828 } 6829 .grid--1-col-tablet:not(.grid--columns) ::slotted(*), 6830 .grid--1-col-tablet > * { 6831 width: 100%; 6832 } 6833 } 6834 6835 /* Desktop by variables or class */ 6836 @media screen and (min-width: 64.06rem) {
6837 .grid:not(.grid--columns) ::slotted(*), 6838 .grid > * { 6839 width: calc( 6840 var(--umg-grid-desktop-columns-width, 25%) 6841 - var(--umg-space-grid-horizontal-desktop, 1.5rem) 6842 * var(--umg-grid-desktop-gaps, 3) 6843 / var(--umg-grid-desktop-columns, 4) 6844 ); 6845 } 6846 .grid--2-col-desktop:not(.grid--columns) ::slotted(*), 6847 .grid--2-col-desktop > * { 6848 width: calc(50% - var(--umg-space-grid-horizontal-desktop, 1.5rem) / 2); 6849 } 6850 } 6851`;i.d(e,["V",0,o])},328(t,e,i){var o=i(2618);const r=o.AH` 6852 .group-spacing--none { 6853 gap: var(--umg-space-group, var(--umg-space-gap-none, var(--umg-space-0, 0rem))); 6854 } 6855 .group-spacing--compact { 6856 gap: var(--umg-space-group, var(--umg-space-gap-compact, var(--umg-space-8, 0.5rem))); 6857 } 6858 .group-spacing--normal { 6859 gap: var(--umg-space-group, var(--umg-space-gap-normal, var(--umg-space-16, 1rem))); 6860 } 6861 .group-spacing--loose { 6862 gap: var(--umg-space-group, var(--umg-space-gap-loose, var(--umg-space-24, 1.5rem))); 6863 } 6864 .group-spacing--spread { 6865 justify-content: space-between; 6866 } 6867 .group-spacing--wrap { 6868 flex-direction: column; 6869 } 6870 6871 @media only screen and (max-width: 48rem) { 6872 .group--wrap-mobile-only { 6873 flex-direction: column; 6874 } 6875 } 6876`,s=o.AH` 6877 @media screen and (min-width: 48.06rem) { 6878 .group-justify--start { 6879 justify-content: start; 6880 } 6881 .group-justify--center { 6882 justify-content: center; 6883 } 6884 .group-justify--end { 6885 justify-content: end; 6886 } 6887 .group-justify--space-evenly { 6888 justify-content: space-evenly; 6889 } 6890 .group-justify--space-between { 6891 justify-content: space-between; 6892 } 6893 .group-justify--space-around { 6894 justify-content: space-around; 6895 } 6896 .group-justify--stretch { 6897 justify-content: stretch; 6898 } 6899 } 6900`,a=o.AH` 6901 @media screen and (max-width: 48rem) { 6902 .group-mobile-justify--start { 6903 justify-content: start; 6904 } 6905 .group-mobile-justify--center { 6906 justify-content: center; 6907 } 6908 .group-mobile-justify--end { 6909 justify-content: end; 6910 } 6911 .group-mobile-justify--space-evenly { 6912 justify-content: space-evenly; 6913 } 6914 .group-mobile-justify--space-between { 6915 justify-content: space-between; 6916 } 6917 .group-mobile-justify--space-around { 6918 justify-content: space-around; 6919 } 6920 .group-mobile-justify--stretch { 6921 justify-content: stretch; 6922 } 6923 } 6924`,n=o.AH` 6925 @media screen and (min-width: 48.06rem) { 6926 .group-align--start { 6927 align-items: start; 6928 } 6929 .group-align--center { 6930 align-items: center; 6931 } 6932 .group-align--end { 6933 align-items: end; 6934 } 6935 .group-align--baseline { 6936 align-items: baseline; 6937 } 6938 .group-align--stretch { 6939 align-items: stretch; 6940 } 6941 } 6942`,l=o.AH` 6943 @media screen and (max-width: 48rem) { 6944 .group-mobile-align--start { 6945 align-items: start; 6946 } 6947 .group-mobile-align--center { 6948 align-items: center; 6949 } 6950 .group-mobile-align--end { 6951 align-items: end; 6952 } 6953 .group-mobile-align--baseline { 6954 align-items: baseline; 6955 } 6956 .group-mobile-align--stretch { 6957 align-items: stretch; 6958 } 6959 } 6960`;i.d(e,["Oh",0,a,"Xv",0,r,"jt",0,n,"rw",0,l,"yw",0,s])},5846(t,e,i){function o(t){return"xsmall"===t?"var(--umg-font-body-size-xs, 0.5rem)":"small"===t?"var(--umg-font-body-size-sm, 0.875rem)":"medium"===t?"var(--umg-font-body-size-md, 1rem)":"large"===t?"var(--umg-font-body-size-lg, 1.25rem)":"xlarge"===t?"var(--umg-font-body-size-xl, 1.5rem)":"2xlarge"===t?"var(--umg-font-body-size-2xl, 1.75rem)":"3xlarge"===t?"var(--umg-font-body-size-3xl, 2rem)":"4xlarge"===t?"var(--umg-font-body-size-4xl, 3rem)":"5xlarge"===t?"var(--umg-font-body-size-5xl, 4rem)":void 0}i.d(e,{R:()=>o})},4379(t,e,i){const o=i(2618).AH` 6961 .placeholder { 6962 height: 100%; 6963 width: 100%; 6964 } 6965 .placeholder-inner { 6966 display: flex; 6967 justify-content: center; 6968 align-items: center; 6969 background-color: var(--umg-color-skeleton-background, rgb(230, 230, 230)); 6970 height: 100%; 6971 width: 100%; 6972 } 6973 .placeholder .icon { 6974 display: block; 6975 height: 40%; 6976 width: 40%; 6977 color: var(--umg-color-skeleton-text, var(--umg-color-base-text, rgb(180,180,180,))); 6978 } 6979 6980 @supports (color: rgb(from white r g b)) { 6981 .placeholder-inner { 6982 background-color: rgb(from var(--umg-color-skeleton-background, rgb(230, 230, 230)) r g b / alpha); 6983 } 6984 .placeholder .icon { 6985 color: rgb(from var(--umg-color-skeleton-text, var(--umg-color-base-text, rgb(180,180,180))) r g b / alpha); 6986 } 6987 } 6988`;i.d(e,["o",0,o])},7804(t,e,i){i.d(e,{WL:()=>o});class o{constructor(t){}get _$AU(){return this._$AM._$AU}_$AT(t,e,i){this._$Ct=t,this._$AM=e,this._$Ci=i}_$AS(t,e){return this.update(t,e)}update(t,e){return this.render(...e)}}i.d(e,["OA",0,{ATTRIBUTE:1,CHILD:2,PROPERTY:3,BOOLEAN_ATTRIBUTE:4,EVENT:5,ELEMENT:6},"u$",0,t=>(...e)=>({_$litDirective$:t,values:e})])},6752(t,e,i){const o=globalThis,r=t=>t,s=o.trustedTypes,a=s?s.createPolicy("lit-html",{createHTML:t=>t}):void 0,n="$lit$",l=`lit$${Math.random().toFixed(9).slice(2)}$`,d="?"+l,c=`<${d}>`,u=document,m=()=>u.createComment(""),h=t=>null===t||"object"!=typeof t&&"function"!=typeof t,p=Array.isArray,g=t=>p(t)||"function"==typeof t?.[Symbol.iterator],b="[ \t\n\f\r]",v=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,y=/--!?>/g,f=/>/g,_=RegExp(`>|${b}(?:([^\\s"'>=/]+)(${b}*=${b}*(?:[^ \t\n\f\r"'\`<>=]|("|')|))|$)`,"g"),w=/'/g,x=/"/g,C=/^(?:script|style|textarea|title)$/i,k=t=>(e,...i)=>({_$litType$:t,strings:e,values:i}
vendor: 7,263 bytes, line 6988
6988),$=k(1),M=k(2),S=(k(3),Symbol.for("lit-noChange")),A=Symbol.for("lit-nothing"),z=new WeakMap,H=u.createTreeWalker(u,129);function E(t,e){if(!p(t)||!t.hasOwnProperty("raw"))throw Error("invalid template strings array");return void 0!==a?a.createHTML(e):e}const P=(t,e)=>{const i=t.length-1,o=[];let r,s=2===e?"<svg>":3===e?"<math>":"",a=v;for(let e=0;e<i;e++){const i=t[e];let d,u,m=-1,h=0;for(;h<i.length&&(a.lastIndex=h,u=a.exec(i),null!==u);)h=a.lastIndex,a===v?"!--"===u[1]?a=y:void 0!==u[1]?a=f:void 0!==u[2]?(C.test(u[2])&&(r=RegExp("</"+u[2],"g")),a=_):void 0!==u[3]&&(a=_):a===_?">"===u[0]?(a=r??v,m=-1):void 0===u[1]?m=-2:(m=a.lastIndex-u[2].length,d=u[1],a=void 0===u[3]?_:'"'===u[3]?x:w):a===x||a===w?a=_:a===y||a===f?a=v:(a=_,r=void 0);const p=a===_&&t[e+1].startsWith("/>")?" ":"";s+=a===v?i+c:m>=0?(o.push(d),i.slice(0,m)+n+i.slice(m)+l+p):i+l+(-2===m?e:p)}return[E(t,s+(t[i]||"<?>")+(2===e?"</svg>":3===e?"</math>":"")),o]};class L{constructor({strings:t,_$litType$:e},i){let o;this.parts=[];let r=0,a=0;const c=t.length-1,u=this.parts,[h,p]=P(t,e);if(this.el=L.createElement(h,i),H.currentNode=this.el.content,2===e||3===e){const t=this.el.content.firstChild;t.replaceWith(...t.childNodes)}for(;null!==(o=H.nextNode())&&u.length<c;){if(1===o.nodeType){if(o.hasAttributes())for(const t of o.getAttributeNames())if(t.endsWith(n)){const e=p[a++],i=o.getAttribute(t).split(l),s=/([.?@])?(.*)/.exec(e);u.push({type:1,index:r,name:s[2],strings:i,ctor:"."===s[1]?W:"?"===s[1]?O:"@"===s[1]?j:T}),o.removeAttribute(t)}else t.startsWith(l)&&(u.push({type:6,index:r}),o.removeAttribute(t));if(C.test(o.tagName)){const t=o.textContent.split(l),e=t.length-1;if(e>0){o.textContent=s?s.emptyScript:"";for(let i=0;i<e;i++)o.append(t[i],m()),H.nextNode(),u.push({type:2,index:++r});o.append(t[e],m())}}}else if(8===o.nodeType)if(o.data===d)u.push({type:2,index:r});else{let t=-1;for(;-1!==(t=o.data.indexOf(l,t+1));)u.push({type:7,index:r}),t+=l.length-1}r++}}static createElement(t,e){const i=u.createElement("template");return i.innerHTML=t,i}}function B(t,e,i=t,o){if(e===S)return e;let r=void 0!==o?i._$Co?.[o]:i._$Cl;const s=h(e)?void 0:e._$litDirective$;return r?.constructor!==s&&(r?._$AO?.(!1),void 0===s?r=void 0:(r=new s(t),r._$AT(t,i,o)),void 0!==o?(i._$Co??=[])[o]=r:i._$Cl=r),void 0!==r&&(e=B(t,r._$AS(t,e.values),r,o)),e}class I{constructor(t,e){this._$AV=[],this._$AN=void 0,this._$AD=t,this._$AM=e}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}u(t){const{el:{content:e},parts:i}=this._$AD,o=(t?.creationScope??u).importNode(e,!0);H.currentNode=o;let r=H.nextNode(),s=0,a=0,n=i[0];for(;void 0!==n;){if(s===n.index){let e;2===n.type?e=new q(r,r.nextSibling,this,t):1===n.type?e=new n.ctor(r,n.name,n.strings,this,t):6===n.type&&(e=new V(r,this,t)),this._$AV.push(e),n=i[++a]}s!==n?.index&&(r=H.nextNode(),s++)}return H.currentNode=u,o}p(t){let e=0;for(const i of this._$AV)void 0!==i&&(void 0!==i.strings?(i._$AI(t,i,e),e+=i.strings.length-2):i._$AI(t[e])),e++}}class q{get _$AU(){return this._$AM?._$AU??this._$Cv}constructor(t,e,i,o){this.type=2,this._$AH=A,this._$AN=void 0,this._$AA=t,this._$AB=e,this._$AM=i,this.options=o,this._$Cv=o?.isConnected??!0}get parentNode(){let t=this._$AA.parentNode;const e=this._$AM;return void 0!==e&&11===t?.nodeType&&(t=e.parentNode),t}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(t,e=this){t=B(this,t,e),h(t)?t===A||null==t||""===t?(this._$AH!==A&&this._$AR(),this._$AH=A):t!==this._$AH&&t!==S&&this._(t):void 0!==t._$litType$?this.$(t):void 0!==t.nodeType?this.T(t):g(t)?this.k(t):this._(t)}O(t){return this._$AA.parentNode.insertBefore(t,this._$AB)}T(t){this._$AH!==t&&(this._$AR(),this._$AH=this.O(t))}_(t){this._$AH!==A&&h(this._$AH)?this._$AA.nextSibling.data=t:this.T(u.createTextNode(t)),this._$AH=t}$(t){const{values:e,_$litType$:i}=t,o="number"==typeof i?this._$AC(t):(void 0===i.el&&(i.el=L.createElement(E(i.h,i.h[0]),this.options)),i);if(this._$AH?._$AD===o)this._$AH.p(e);else{const t=new I(o,this),i=t.u(this.options);t.p(e),this.T(i),this._$AH=t}}_$AC(t){let e=z.get(t.strings);return void 0===e&&z.set(t.strings,e=new L(t)),e}k(t){p(this._$AH)||(this._$AH=[],this._$AR());const e=this._$AH;let i,o=0;for(const r of t)o===e.length?e.push(i=new q(this.O(m()),this.O(m()),this,this.options)):i=e[o],i._$AI(r),o++;o<e.length&&(this._$AR(i&&i._$AB.nextSibling,o),e.length=o)}_$AR(t=this._$AA.nextSibling,e){for(this._$AP?.(!1,!0,e);t!==this._$AB;){const e=r(t).nextSibling;r(t).remove(),t=e}}setConnected(t){void 0===this._$AM&&(this._$Cv=t,this._$AP?.(t))}}class T{get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}constructor(t,e,i,o,r){this.type=1,this._$AH=A,this._$AN=void 0,this.element=t,this.name=e,this._$AM=o,this.options=r,i.length>2||""!==i[0]||""!==i[1]?(this._$AH=Array(i.length-1).fill(new String),this.strings=i):this._$AH=A}_$AI(t,e=this,i,o){const r=this.strings;let s=!1;if(void 0===r)t=B(this,t,e,0),s=!h(t)||t!==this._$AH&&t!==S,s&&(this._$AH=t);else{const o=t;let a,n;for(t=r[0],a=0;a<r.length-1;a++)n=B(this,o[i+a],e,a),n===S&&(n=this._$AH[a]),s||=!h(n)||n!==this._$AH[a],n===A?t=A:t!==A&&(t+=(n??"")+r[a+1]),this._$AH[a]=n}s&&!o&&this.j(t)}j(t){t===A?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,t??"")}}class W extends T{constructor(){super(...arguments),this.type=3}j(t){this.element[this.name]=t===A?void 0:t}}class O extends T{constructor(){super(...arguments),this.type=4}j(t){this.element.toggleAttribute(this.name,!!t&&t!==A)}}class j extends T{constructor(t,e,i,o,r){super(t,e,i,o,r),this.type=5}_$AI(t,e=this){if((t=B(this,t,e,0)??A)===S)return;const i=this._$AH,o=t===A&&i!==A||t.capture!==i.capture||t.once!==i.once||t.passive!==i.passive,r=t!==A&&(i===A||o);o&&this.element.removeEventListener(this.name,this,i),r&&this.element.addEventListener(this.name,this,t),this._$AH=t}handleEvent(t){"function"==typeof this._$AH?this._$AH.call(this.options?.host??this.element,t):this._$AH.handleEvent(t)}}class V{constructor(t,e,i){this.element=t,this.type=6,this._$AN=void 0,this._$AM=e,this.options=i}get _$AU(){return this._$AM._$AU}_$AI(t){B(this,t)}}const N={M:n,P:l,A:d,C:1,L:P,R:I,D:g,V:B,I:q,H:T,N:O,U:j,B:W,F:V},D=o.litHtmlPolyfillSupport;D?.(L,q),(o.litHtmlVersions??=[]).push("3.3.3");i.d(e,["JW",0,M,"XX",0,(t,e,i)=>{const o=i?.renderBefore??e;let r=o._$litPart$;if(void 0===r){const t=i?.renderBefore??null;o._$litPart$=r=new q(e.insertBefore(m(),t),t,void 0,i??{})}return r._$AI(t),r},"c0",0,S,"ge",0,N,"qy",0,$,"s6",0,A])},7621(t,e,i){i.d(e,{MZ:()=>o.M,P:()=>s.P,YG:()=>l,KN:()=>d.K,wk:()=>r.w});var o=i(5694),r=i(4290),s=i(1895),a=i(1762);let n;function l(t){return(e,i)=>(0,a.i)(e,i,{get(){return(this.renderRoot??(n??=document.createDocumentFragment())).querySelectorAll(t)}})}var d=i(1124)},9563(t,e,i){i.d(e,{M:()=>o.M});var o=i(5694)},7509(t,e,i){i.d(e,{w:()=>o.w});var o=i(4290)},3720(t,e,i){i.d(e,{H:()=>s});var o=i(6752),r=i(7804);const s=(0,r.u$)(class extends r.WL{constructor(t){if(super(t),t.type!==r.OA.ATTRIBUTE||"class"!==t.name||t.strings?.length>2)throw Error("`classMap()` can only be used in the `class` attribute and must be the only part in the attribute.")}render(t){return" "+Object.keys(t).filter(e=>t[e]).join(" ")+" "}
6988update(t,[e]){if(void 0===this.st){this.st=new Set,void 0!==t.strings&&(this.nt=new Set(t.strings.join(" ").split(/\s/).filter(t=>""!==t)));for(const t in e)e[t]&&!this.nt?.has(t)&&this.st.add(t);return this.render(e)}const i=t.element.classList;for(const t of this.st)t in e||(i.remove(t),this.st.delete(t));for(const t in e){const o=!!e[t];o===this.st.has(t)||this.nt?.has(t)||(o?(i.add(t),this.st.add(t)):(i.remove(t),this.st.delete(t)))}return o.c0}})},31(t,e,i){i.d(e,{J:()=>r});var o=i(6752);const r=t=>t??o.s6},1145(t,e,i){i.d(e,{W:()=>n});var o=i(6752),r=i(7804);const s="important",a=" !"+s,n=(0,r.u$)(class extends r.WL{constructor(t){if(super(t),t.type!==r.OA.ATTRIBUTE||"style"!==t.name||t.strings?.length>2)throw Error("The `styleMap` directive must be used in the `style` attribute and must be the only part in the attribute.")}render(t){return Object.keys(t).reduce((e,i)=>{const o=t[i];return null==o?e:e+`${i=i.includes("-")?i:i.replace(/(?:^(webkit|moz|ms|o)|)(?=[A-Z])/g,"-$&").toLowerCase()}:${o};`},"")}update(t,[e]){const{style:i}=t.element;if(void 0===this.ft)return this.ft=new Set(Object.keys(e)),this.render(e);for(const t of this.ft)null==e[t]&&(this.ft.delete(t),t.includes("-")?i.removeProperty(t):i[t]=null);for(const t in e){const o=e[t];if(null!=o){this.ft.add(t);const e="string"==typeof o&&o.endsWith(a);t.includes("-")||e?i.setProperty(t,e?o.slice(0,-11):o,e?s:""):i[t]=o}}return o.c0}})},2618(t,e,i){i.d(e,{WF:()=>a,AH:()=>o.AH,qy:()=>r.qy,s6:()=>r.s6,JW:()=>r.JW});var o=i(842),r=i(6752);const s=globalThis;class a extends o.mN{constructor(){super(...arguments),this.renderOptions={host:this},this._$Do=void 0}createRenderRoot(){const t=super.createRenderRoot();return this.renderOptions.renderBefore??=t.firstChild,t}update(t){const e=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(t),this._$Do=(0,r.XX)(e,this.renderRoot,this.renderOptions)}connectedCallback(){super.connectedCallback(),this._$Do?.setConnected(!0)}disconnectedCallback(){super.disconnectedCallback(),this._$Do?.setConnected(!1)}render(){return r.c0}}a._$litElement$=!0,a.finalized=!0,s.litElementHydrateSupport?.({LitElement:a});const n=s.litElementPolyfillSupport;n?.({LitElement:a});(s.litElementVersions??=[]).push("4.2.2")}}]);
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.