/**
 * @license
 * Copyright 2019 Google LLC
 * SPDX-License-Identifier: BSD-3-Clause
 */
const t=window.ShadowRoot&&(void 0===window.ShadyCSS||window.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,i=Symbol(),e=new WeakMap;class o{constructor(t,e,o){if(this._$cssResult$=!0,o!==i)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=t,this.t=e}get styleSheet(){let i=this.o;const o=this.t;if(t&&void 0===i){const t=void 0!==o&&1===o.length;t&&(i=e.get(o)),void 0===i&&((this.o=i=new CSSStyleSheet).replaceSync(this.cssText),t&&e.set(o,i))}return i}toString(){return this.cssText}}const s=t?t=>t:t=>t instanceof CSSStyleSheet?(t=>{let e="";for(const i of t.cssRules)e+=i.cssText;return(t=>new o("string"==typeof t?t:t+"",void 0,i))(e)})(t):t
/**
 * @license
 * Copyright 2017 Google LLC
 * SPDX-License-Identifier: BSD-3-Clause
 */;var n;const r=window.trustedTypes,l=r?r.emptyScript:"",a=window.reactiveElementPolyfillSupport,h={toAttribute(t,i){switch(i){case Boolean:t=t?l:null;break;case Object:case Array:t=null==t?t:JSON.stringify(t)}return t},fromAttribute(t,i){let e=t;switch(i){case Boolean:e=null!==t;break;case Number:e=null===t?null:Number(t);break;case Object:case Array:try{e=JSON.parse(t)}catch(t){e=null}}return e}},c=(t,i)=>i!==t&&(i==i||t==t),d={attribute:!0,type:String,converter:h,reflect:!1,hasChanged:c};class u extends HTMLElement{constructor(){super(),this._$Ei=new Map,this.isUpdatePending=!1,this.hasUpdated=!1,this._$El=null,this.u()}static addInitializer(t){var i;null!==(i=this.h)&&void 0!==i||(this.h=[]),this.h.push(t)}static get observedAttributes(){this.finalize();const t=[];return this.elementProperties.forEach(((i,e)=>{const o=this._$Ep(e,i);void 0!==o&&(this._$Ev.set(o,e),t.push(o))})),t}static createProperty(t,i=d){if(i.state&&(i.attribute=!1),this.finalize(),this.elementProperties.set(t,i),!i.noAccessor&&!this.prototype.hasOwnProperty(t)){const e="symbol"==typeof t?Symbol():"__"+t,o=this.getPropertyDescriptor(t,e,i);void 0!==o&&Object.defineProperty(this.prototype,t,o)}}static getPropertyDescriptor(t,i,e){return{get(){return this[i]},set(o){const s=this[t];this[i]=o,this.requestUpdate(t,s,e)},configurable:!0,enumerable:!0}}static getPropertyOptions(t){return this.elementProperties.get(t)||d}static finalize(){if(this.hasOwnProperty("finalized"))return!1;this.finalized=!0;const t=Object.getPrototypeOf(this);if(t.finalize(),this.elementProperties=new Map(t.elementProperties),this._$Ev=new Map,this.hasOwnProperty("properties")){const t=this.properties,i=[...Object.getOwnPropertyNames(t),...Object.getOwnPropertySymbols(t)];for(const e of i)this.createProperty(e,t[e])}return this.elementStyles=this.finalizeStyles(this.styles),!0}static finalizeStyles(t){const i=[];if(Array.isArray(t)){const e=new Set(t.flat(1/0).reverse());for(const t of e)i.unshift(s(t))}else void 0!==t&&i.push(s(t));return i}static _$Ep(t,i){const e=i.attribute;return!1===e?void 0:"string"==typeof e?e:"string"==typeof t?t.toLowerCase():void 0}u(){var t;this._$E_=new Promise((t=>this.enableUpdating=t)),this._$AL=new Map,this._$Eg(),this.requestUpdate(),null===(t=this.constructor.h)||void 0===t||t.forEach((t=>t(this)))}addController(t){var i,e;(null!==(i=this._$ES)&&void 0!==i?i:this._$ES=[]).push(t),void 0!==this.renderRoot&&this.isConnected&&(null===(e=t.hostConnected)||void 0===e||e.call(t))}removeController(t){var i;null===(i=this._$ES)||void 0===i||i.splice(this._$ES.indexOf(t)>>>0,1)}_$Eg(){this.constructor.elementProperties.forEach(((t,i)=>{this.hasOwnProperty(i)&&(this._$Ei.set(i,this[i]),delete this[i])}))}createRenderRoot(){var i;const e=null!==(i=this.shadowRoot)&&void 0!==i?i:this.attachShadow(this.constructor.shadowRootOptions);return((i,e)=>{t?i.adoptedStyleSheets=e.map((t=>t instanceof CSSStyleSheet?t:t.styleSheet)):e.forEach((t=>{const e=document.createElement("style"),o=window.litNonce;void 0!==o&&e.setAttribute("nonce",o),e.textContent=t.cssText,i.appendChild(e)}))})(e,this.constructor.elementStyles),e}connectedCallback(){var t;void 0===this.renderRoot&&(this.renderRoot=this.createRenderRoot()),this.enableUpdating(!0),null===(t=this._$ES)||void 0===t||t.forEach((t=>{var i;return null===(i=t.hostConnected)||void 0===i?void 0:i.call(t)}))}enableUpdating(t){}disconnectedCallback(){var t;null===(t=this._$ES)||void 0===t||t.forEach((t=>{var i;return null===(i=t.hostDisconnected)||void 0===i?void 0:i.call(t)}))}attributeChangedCallback(t,i,e){this._$AK(t,e)}_$EO(t,i,e=d){var o,s;const n=this.constructor._$Ep(t,e);if(void 0!==n&&!0===e.reflect){const r=(null!==(s=null===(o=e.converter)||void 0===o?void 0:o.toAttribute)&&void 0!==s?s:h.toAttribute)(i,e.type);this._$El=t,null==r?this.removeAttribute(n):this.setAttribute(n,r),this._$El=null}}_$AK(t,i){var e,o;const s=this.constructor,n=s._$Ev.get(t);if(void 0!==n&&this._$El!==n){const t=s.getPropertyOptions(n),r=t.converter,l=null!==(o=null!==(e=null==r?void 0:r.fromAttribute)&&void 0!==e?e:"function"==typeof r?r:null)&&void 0!==o?o:h.fromAttribute;this._$El=n,this[n]=l(i,t.type),this._$El=null}}requestUpdate(t,i,e){let o=!0;void 0!==t&&(((e=e||this.constructor.getPropertyOptions(t)).hasChanged||c)(this[t],i)?(this._$AL.has(t)||this._$AL.set(t,i),!0===e.reflect&&this._$El!==t&&(void 0===this._$EC&&(this._$EC=new Map),this._$EC.set(t,e))):o=!1),!this.isUpdatePending&&o&&(this._$E_=this._$Ej())}async _$Ej(){this.isUpdatePending=!0;try{await this._$E_}catch(t){Promise.reject(t)}const t=this.scheduleUpdate();return null!=t&&await t,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){var t;if(!this.isUpdatePending)return;this.hasUpdated,this._$Ei&&(this._$Ei.forEach(((t,i)=>this[i]=t)),this._$Ei=void 0);let i=!1;const e=this._$AL;try{i=this.shouldUpdate(e),i?(this.willUpdate(e),null===(t=this._$ES)||void 0===t||t.forEach((t=>{var i;return null===(i=t.hostUpdate)||void 0===i?void 0:i.call(t)})),this.update(e)):this._$Ek()}catch(t){throw i=!1,this._$Ek(),t}i&&this._$AE(e)}willUpdate(t){}_$AE(t){var i;null===(i=this._$ES)||void 0===i||i.forEach((t=>{var i;return null===(i=t.hostUpdated)||void 0===i?void 0:i.call(t)})),this.hasUpdated||(this.hasUpdated=!0,this.firstUpdated(t)),this.updated(t)}_$Ek(){this._$AL=new Map,this.isUpdatePending=!1}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this._$E_}shouldUpdate(t){return!0}update(t){void 0!==this._$EC&&(this._$EC.forEach(((t,i)=>this._$EO(i,this[i],t))),this._$EC=void 0),this._$Ek()}updated(t){}firstUpdated(t){}}
/**
 * @license
 * Copyright 2017 Google LLC
 * SPDX-License-Identifier: BSD-3-Clause
 */
var p;u.finalized=!0,u.elementProperties=new Map,u.elementStyles=[],u.shadowRootOptions={mode:"open"},null==a||a({ReactiveElement:u}),(null!==(n=globalThis.reactiveElementVersions)&&void 0!==n?n:globalThis.reactiveElementVersions=[]).push("1.3.3");const v=globalThis.trustedTypes,g=v?v.createPolicy("lit-html",{createHTML:t=>t}):void 0,b=`lit$${(Math.random()+"").slice(9)}$`,f="?"+b,y=`<${f}>`,w=document,m=(t="")=>w.createComment(t),x=t=>null===t||"object"!=typeof t&&"function"!=typeof t,k=Array.isArray,C=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,L=/-->/g,S=/>/g,$=/>|[ 	\n\r](?:([^\s"'>=/]+)([ 	\n\r]*=[ 	\n\r]*(?:[^ 	\n\r"'`<>=]|("|')|))|$)/g,_=/'/g,A=/"/g,T=/^(?:script|style|textarea|title)$/i,j=(t=>(i,...e)=>({_$litType$:t,strings:i,values:e}))(1),M=Symbol.for("lit-noChange"),U=Symbol.for("lit-nothing"),E=new WeakMap,O=w.createTreeWalker(w,129,null,!1),z=(t,i)=>{const e=t.length-1,o=[];let s,n=2===i?"<svg>":"",r=C;for(let i=0;i<e;i++){const e=t[i];let l,a,h=-1,c=0;for(;c<e.length&&(r.lastIndex=c,a=r.exec(e),null!==a);)c=r.lastIndex,r===C?"!--"===a[1]?r=L:void 0!==a[1]?r=S:void 0!==a[2]?(T.test(a[2])&&(s=RegExp("</"+a[2],"g")),r=$):void 0!==a[3]&&(r=$):r===$?">"===a[0]?(r=null!=s?s:C,h=-1):void 0===a[1]?h=-2:(h=r.lastIndex-a[2].length,l=a[1],r=void 0===a[3]?$:'"'===a[3]?A:_):r===A||r===_?r=$:r===L||r===S?r=C:(r=$,s=void 0);const d=r===$&&t[i+1].startsWith("/>")?" ":"";n+=r===C?e+y:h>=0?(o.push(l),e.slice(0,h)+"$lit$"+e.slice(h)+b+d):e+b+(-2===h?(o.push(void 0),i):d)}const l=n+(t[e]||"<?>")+(2===i?"</svg>":"");if(!Array.isArray(t)||!t.hasOwnProperty("raw"))throw Error("invalid template strings array");return[void 0!==g?g.createHTML(l):l,o]};class D{constructor({strings:t,_$litType$:i},e){let o;this.parts=[];let s=0,n=0;const r=t.length-1,l=this.parts,[a,h]=z(t,i);if(this.el=D.createElement(a,e),O.currentNode=this.el.content,2===i){const t=this.el.content,i=t.firstChild;i.remove(),t.append(...i.childNodes)}for(;null!==(o=O.nextNode())&&l.length<r;){if(1===o.nodeType){if(o.hasAttributes()){const t=[];for(const i of o.getAttributeNames())if(i.endsWith("$lit$")||i.startsWith(b)){const e=h[n++];if(t.push(i),void 0!==e){const t=o.getAttribute(e.toLowerCase()+"$lit$").split(b),i=/([.?@])?(.*)/.exec(e);l.push({type:1,index:s,name:i[2],strings:t,ctor:"."===i[1]?I:"?"===i[1]?P:"@"===i[1]?Z:H})}else l.push({type:6,index:s})}for(const i of t)o.removeAttribute(i)}if(T.test(o.tagName)){const t=o.textContent.split(b),i=t.length-1;if(i>0){o.textContent=v?v.emptyScript:"";for(let e=0;e<i;e++)o.append(t[e],m()),O.nextNode(),l.push({type:2,index:++s});o.append(t[i],m())}}}else if(8===o.nodeType)if(o.data===f)l.push({type:2,index:s});else{let t=-1;for(;-1!==(t=o.data.indexOf(b,t+1));)l.push({type:7,index:s}),t+=b.length-1}s++}}static createElement(t,i){const e=w.createElement("template");return e.innerHTML=t,e}}function N(t,i,e=t,o){var s,n,r,l;if(i===M)return i;let a=void 0!==o?null===(s=e._$Cl)||void 0===s?void 0:s[o]:e._$Cu;const h=x(i)?void 0:i._$litDirective$;return(null==a?void 0:a.constructor)!==h&&(null===(n=null==a?void 0:a._$AO)||void 0===n||n.call(a,!1),void 0===h?a=void 0:(a=new h(t),a._$AT(t,e,o)),void 0!==o?(null!==(r=(l=e)._$Cl)&&void 0!==r?r:l._$Cl=[])[o]=a:e._$Cu=a),void 0!==a&&(i=N(t,a._$AS(t,i.values),a,o)),i}class R{constructor(t,i){this.v=[],this._$AN=void 0,this._$AD=t,this._$AM=i}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}p(t){var i;const{el:{content:e},parts:o}=this._$AD,s=(null!==(i=null==t?void 0:t.creationScope)&&void 0!==i?i:w).importNode(e,!0);O.currentNode=s;let n=O.nextNode(),r=0,l=0,a=o[0];for(;void 0!==a;){if(r===a.index){let i;2===a.type?i=new B(n,n.nextSibling,this,t):1===a.type?i=new a.ctor(n,a.name,a.strings,this,t):6===a.type&&(i=new q(n,this,t)),this.v.push(i),a=o[++l]}r!==(null==a?void 0:a.index)&&(n=O.nextNode(),r++)}return s}m(t){let i=0;for(const e of this.v)void 0!==e&&(void 0!==e.strings?(e._$AI(t,e,i),i+=e.strings.length-2):e._$AI(t[i])),i++}}class B{constructor(t,i,e,o){var s;this.type=2,this._$AH=U,this._$AN=void 0,this._$AA=t,this._$AB=i,this._$AM=e,this.options=o,this._$Cg=null===(s=null==o?void 0:o.isConnected)||void 0===s||s}get _$AU(){var t,i;return null!==(i=null===(t=this._$AM)||void 0===t?void 0:t._$AU)&&void 0!==i?i:this._$Cg}get parentNode(){let t=this._$AA.parentNode;const i=this._$AM;return void 0!==i&&11===t.nodeType&&(t=i.parentNode),t}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(t,i=this){t=N(this,t,i),x(t)?t===U||null==t||""===t?(this._$AH!==U&&this._$AR(),this._$AH=U):t!==this._$AH&&t!==M&&this.$(t):void 0!==t._$litType$?this.T(t):void 0!==t.nodeType?this.k(t):(t=>{var i;return k(t)||"function"==typeof(null===(i=t)||void 0===i?void 0:i[Symbol.iterator])})(t)?this.S(t):this.$(t)}M(t,i=this._$AB){return this._$AA.parentNode.insertBefore(t,i)}k(t){this._$AH!==t&&(this._$AR(),this._$AH=this.M(t))}$(t){this._$AH!==U&&x(this._$AH)?this._$AA.nextSibling.data=t:this.k(w.createTextNode(t)),this._$AH=t}T(t){var i;const{values:e,_$litType$:o}=t,s="number"==typeof o?this._$AC(t):(void 0===o.el&&(o.el=D.createElement(o.h,this.options)),o);if((null===(i=this._$AH)||void 0===i?void 0:i._$AD)===s)this._$AH.m(e);else{const t=new R(s,this),i=t.p(this.options);t.m(e),this.k(i),this._$AH=t}}_$AC(t){let i=E.get(t.strings);return void 0===i&&E.set(t.strings,i=new D(t)),i}S(t){k(this._$AH)||(this._$AH=[],this._$AR());const i=this._$AH;let e,o=0;for(const s of t)o===i.length?i.push(e=new B(this.M(m()),this.M(m()),this,this.options)):e=i[o],e._$AI(s),o++;o<i.length&&(this._$AR(e&&e._$AB.nextSibling,o),i.length=o)}_$AR(t=this._$AA.nextSibling,i){var e;for(null===(e=this._$AP)||void 0===e||e.call(this,!1,!0,i);t&&t!==this._$AB;){const i=t.nextSibling;t.remove(),t=i}}setConnected(t){var i;void 0===this._$AM&&(this._$Cg=t,null===(i=this._$AP)||void 0===i||i.call(this,t))}}class H{constructor(t,i,e,o,s){this.type=1,this._$AH=U,this._$AN=void 0,this.element=t,this.name=i,this._$AM=o,this.options=s,e.length>2||""!==e[0]||""!==e[1]?(this._$AH=Array(e.length-1).fill(new String),this.strings=e):this._$AH=U}get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}_$AI(t,i=this,e,o){const s=this.strings;let n=!1;if(void 0===s)t=N(this,t,i,0),n=!x(t)||t!==this._$AH&&t!==M,n&&(this._$AH=t);else{const o=t;let r,l;for(t=s[0],r=0;r<s.length-1;r++)l=N(this,o[e+r],i,r),l===M&&(l=this._$AH[r]),n||(n=!x(l)||l!==this._$AH[r]),l===U?t=U:t!==U&&(t+=(null!=l?l:"")+s[r+1]),this._$AH[r]=l}n&&!o&&this.C(t)}C(t){t===U?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,null!=t?t:"")}}class I extends H{constructor(){super(...arguments),this.type=3}C(t){this.element[this.name]=t===U?void 0:t}}const J=v?v.emptyScript:"";class P extends H{constructor(){super(...arguments),this.type=4}C(t){t&&t!==U?this.element.setAttribute(this.name,J):this.element.removeAttribute(this.name)}}class Z extends H{constructor(t,i,e,o,s){super(t,i,e,o,s),this.type=5}_$AI(t,i=this){var e;if((t=null!==(e=N(this,t,i,0))&&void 0!==e?e:U)===M)return;const o=this._$AH,s=t===U&&o!==U||t.capture!==o.capture||t.once!==o.once||t.passive!==o.passive,n=t!==U&&(o===U||s);s&&this.element.removeEventListener(this.name,this,o),n&&this.element.addEventListener(this.name,this,t),this._$AH=t}handleEvent(t){var i,e;"function"==typeof this._$AH?this._$AH.call(null!==(e=null===(i=this.options)||void 0===i?void 0:i.host)&&void 0!==e?e:this.element,t):this._$AH.handleEvent(t)}}class q{constructor(t,i,e){this.element=t,this.type=6,this._$AN=void 0,this._$AM=i,this.options=e}get _$AU(){return this._$AM._$AU}_$AI(t){N(this,t)}}const K=window.litHtmlPolyfillSupport;
/**
 * @license
 * Copyright 2017 Google LLC
 * SPDX-License-Identifier: BSD-3-Clause
 */
var W,X;null==K||K(D,B),(null!==(p=globalThis.litHtmlVersions)&&void 0!==p?p:globalThis.litHtmlVersions=[]).push("2.2.6");class G extends u{constructor(){super(...arguments),this.renderOptions={host:this},this._$Do=void 0}createRenderRoot(){var t,i;const e=super.createRenderRoot();return null!==(t=(i=this.renderOptions).renderBefore)&&void 0!==t||(i.renderBefore=e.firstChild),e}update(t){const i=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(t),this._$Do=((t,i,e)=>{var o,s;const n=null!==(o=null==e?void 0:e.renderBefore)&&void 0!==o?o:i;let r=n._$litPart$;if(void 0===r){const t=null!==(s=null==e?void 0:e.renderBefore)&&void 0!==s?s:null;n._$litPart$=r=new B(i.insertBefore(m(),t),t,void 0,null!=e?e:{})}return r._$AI(t),r})(i,this.renderRoot,this.renderOptions)}connectedCallback(){var t;super.connectedCallback(),null===(t=this._$Do)||void 0===t||t.setConnected(!0)}disconnectedCallback(){var t;super.disconnectedCallback(),null===(t=this._$Do)||void 0===t||t.setConnected(!1)}render(){return M}}G.finalized=!0,G._$litElement$=!0,null===(W=globalThis.litElementHydrateSupport)||void 0===W||W.call(globalThis,{LitElement:G});const Y=globalThis.litElementPolyfillSupport;null==Y||Y({LitElement:G}),(null!==(X=globalThis.litElementVersions)&&void 0!==X?X:globalThis.litElementVersions=[]).push("3.2.1");
/**
 * @license
 * Copyright 2017 Google LLC
 * SPDX-License-Identifier: BSD-3-Clause
 */
const F=(t,i)=>"method"===i.kind&&i.descriptor&&!("value"in i.descriptor)?{...i,finisher(e){e.createProperty(i.key,t)}}:{kind:"field",key:Symbol(),placement:"own",descriptor:{},originalKey:i.key,initializer(){"function"==typeof i.initializer&&(this[i.key]=i.initializer.call(this))},finisher(e){e.createProperty(i.key,t)}};
/**
 * @license
 * Copyright 2017 Google LLC
 * SPDX-License-Identifier: BSD-3-Clause
 */function V(t){return(i,e)=>void 0!==e?((t,i,e)=>{i.constructor.createProperty(e,t)})(t,i,e):F(t,i)
/**
 * @license
 * Copyright 2017 Google LLC
 * SPDX-License-Identifier: BSD-3-Clause
 */}
/**
 * @license
 * Copyright 2017 Google LLC
 * SPDX-License-Identifier: BSD-3-Clause
 */
function Q(t,i){return(({finisher:t,descriptor:i})=>(e,o)=>{var s;if(void 0===o){const o=null!==(s=e.originalKey)&&void 0!==s?s:e.key,n=null!=i?{kind:"method",placement:"prototype",key:o,descriptor:i(e.key)}:{...e,key:o};return null!=t&&(n.finisher=function(i){t(i,o)}),n}{const s=e.constructor;void 0!==i&&Object.defineProperty(e,o,i(o)),null==t||t(s,o)}})({descriptor:e=>{const o={get(){var i,e;return null!==(e=null===(i=this.renderRoot)||void 0===i?void 0:i.querySelector(t))&&void 0!==e?e:null},enumerable:!0,configurable:!0};if(i){const i="symbol"==typeof e?Symbol():"__"+e;o.get=function(){var e,o;return void 0===this[i]&&(this[i]=null!==(o=null===(e=this.renderRoot)||void 0===e?void 0:e.querySelector(t))&&void 0!==o?o:null),this[i]}}return o}})}
/**
 * @license
 * Copyright 2021 Google LLC
 * SPDX-License-Identifier: BSD-3-Clause
 */var tt;null===(tt=window.HTMLSlotElement)||void 0===tt||tt.prototype.assignedElements;const it=((t,...e)=>{const s=1===t.length?t[0]:e.reduce(((i,e,o)=>i+(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.")})(e)+t[o+1]),t[0]);return new o(s,t,i)})`

  :host {

    --primary-color: #a73b24;
    --text-color: #475569;
    --text-on-primary: white;
    --background-color: white;
    --banner-shadow: 0 4px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
    --dialog-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
    --button-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
    --radius: 8px;
    --banner-radius: var(--radius);
    --dialog-radius: var(--radius);
    --button-radius: 32px;
    --slider-radius: 50%;
    --slider-rail-radius: 34px;
    

    font-family: Sarabun, 'Helvetica Neue', Arial, sans-serif;
    display: flex;
    box-sizing: border-box;
    width: 100vw;
    min-height: 100vh;
    min-height: -webkit-fill-available;
    position: fixed;
    top: 0;
    justify-content: center;
    align-items: center;
    z-index: 99999;
    color: var(--text-color);
    pointer-events: none;
  }

  :host-context(.dark) {
    --primary-color: #a64732;
    --text-color: #f8fafc;
    --background-color: #202124;
    --text-on-primary: var(--background-color);
  }

  :host * {
    pointer-events: auto;
  }

  p.widget-content {
    margin: 0;
    color: var(--text-color);
    width: 60vw;
  }

  a {
    color: var(--primary-color);
  }

  hr {
    height: 1px;
    border-width: 0;
    width: 100%;
    margin-block: 1rem;
    background-color: rgba(128, 128, 128, 0.2);
  }

  .btn {
    border: none;
    transition: all 150ms ease-in-out;
  }

  .btn:hover {
    cursor: pointer;
  }

  .btn.setting {
    padding: 4px;
    background-color: transparent;
    color: lightgray;
  }

  .icon-button {
    display: flex;
    width: 40px;
    height: 40px;
    padding: 4px;
    border-radius: 50%;
    align-items: center;
    justify-content: center;
    background-color: transparent;
    color: inherit;
  }

  .icon-button:hover {
    background-color: rgba(128, 128, 128, 0.1);
  }

  .btn.setting:hover {
    color: gray;
  }

  .btn.primary {
    border-radius: var(--button-radius);
    padding: 12px 24px;
    background-color: var(--primary-color);
    color: var(--text-on-primary);
    font-weight: bold;
    text-transform: uppercase;
  }

  .btn.primary.outlined {
    background-color: transparent;
    color: var(--primary-color);
    border: 1.75px solid var(--primary-color);
  }

  .btn.primary:hover {
    filter: brightness(1.1);
    box-shadow: var(--button-shadow);
  }

  /**************
  BANNER WIDGET
  **************/

  .widget-container {
    box-sizing: border-box;
    position: absolute;
    bottom: 1rem;
    line-height: 1.5;
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 24px;
    background-color: var(--background-color);
    border-radius: var(--banner-radius);
    box-shadow: var(--banner-shadow);
    z-index: 1;
  }

  .banner-button-container {
    display: flex;
    align-items: center;
    gap: 1rem;
  }
  
  .btn-continue {
    flex-grow: 1;
  }

  /*-------------
  DIALOG
  -------------*/

  .backdrop {
    display: none;
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background-color: rgba(128, 128, 128, 0.5);
    z-index: 9998;
  }

  .backdrop.show {
    display: block;
  }
  
  #cookieSettingDialog:not([open]) {
    display: none;
  }


  dialog[open], #cookieSettingDialog[open] {
    box-sizing: border-box;
    width: 100%;
    max-width: 480px;
    max-height: calc(100vh - 2rem);
    margin: 1rem auto;
    display: flex;
    flex-direction: column;
    padding: 2rem;
    border: none;
    border-radius: var(--dialog-radius);
    box-shadow: var(--dialog-shadow);
    background-color: var(--background-color);
    z-index: 99999;
    color: inherit;
  }

  .dialog-header {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin-block-end: 0.5rem;
  }

  .dialog-title {
    margin: 0;
  }

  .diaglog-desc {

  }

  .category-container {
    max-height: 320px;
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
    overflow-y: scroll;
  }

  .category-item {
    display: flex;
    justify-content: space-between;
  }

  .category-detail {
    flex-shrink: 1;
  }

  .category-title {
    cursor: pointer;
  }

  .category-desc {
    font-size: 0.875em;
    overflow-wrap: anywhere;
    opacity: 0.875;
  }

  .dialog-footer {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding-block-start: 1rem;
  }

  .dialog-button {
    flex-grow: 1;
    border-radius: var(--button-radius);
    padding: 12px 60px;
    font-weight: bold;
    text-transform: uppercase;
  }

  /* The switch - the box around the slider */

  .switch {
    position: relative;
    display: inline-block;
    width: 60px;
    height: 34px;
    flex-shrink: 0;
  }

  /* Hide default HTML checkbox */

  .switch input {
    opacity: 0;
    width: 0;
    height: 0;
  }

  /* The slider */

  .slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(128, 128, 128, 0.5);
    -webkit-transition: .4s;
    transition: .4s;
  }

  .slider:before {
    position: absolute;
    content: "";
    height: 26px;
    width: 26px;
    left: 4px;
    bottom: 4px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
  }

  input:checked + .slider {
    background-color: var(--primary-color);
  }

  input:focus + .slider {
    box-shadow: 0 0 1px var(--primary-color);
  }

  input:checked + .slider:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
  }

  /* Rounded sliders */

  .slider.round {
    border-radius: var(--slider-rail-radius);
  }

  .slider.round:before {
    border-radius: var(--slider-radius);
  }

  .btn.width-btn {
    //padding: 12px 60px;
    width: 240px;
  }

  .hidden {
    display: none;
  }
  
  @media screen and (max-width: 599.98px) {
    :host {
      justify-content: stretch;
    }
    
    .widget-container {
      width: 100%;
      border-radius: 0;
      bottom: 0;
      flex-direction: column;
      align-items: stretch;
    }
    
    p.widget-content {
      width: auto;
    }

    .banner-button-container {
      flex-direction: row-reverse;
    }
  }
`,et={required:{th:"จำเป็น",en:"required"},title_widget:{th:"มหาวิทยาลัยขอนแก่นใช้คุกกี้เพื่อพัฒนาประสิทธิภาพ และประสบการณ์ที่ดีในการใช้เว็บไซต์ของคุณ คุณสามารถศึกษารายละเอียดได้ที่",en:"Khon Kaen University use cookie for increasing the efficiency and for good experience when you use a website. For more details, search:"},link_privacy:{th:"นโยบายคุ้มครองข้อมูลส่วนบุคคล",en:"Personal data protection policy"},and:{th:" และ ",en:" and the use of "},link_cookie:{th:"Cookie",en:"Cookie"},button_continue:{th:"รับทราบ",en:"continue"},cookie_setting_header:{th:"การปรับแต่งคุกกี้",en:"Cookie Settings"},cookie_setting_title:{th:"ท่านสามารถปรับแต่งการใช้งานคุกกี้ได้ตามรายละเอียดต่อไปนี้",en:"You can customize the use of cookies as follows."},cookie_setting_detail:{th:"คุณสามารถเลือกการตั้งค่าคุกกี้โดยเปิด/ปิด คุกกี้ในแต่ละประเภทได้ตามความต้องการ ยกเว้น คุกกี้ที่จำเป็น",en:"You can choose cookie settings by on/off. Cookies of each type are available on request, except for strictly necessary cookies."},accept_all:{th:"ยอมรับทั้งหมด",en:"Accept all"},save_data:{th:"บันทึกข้อมูล",en:"Save"}};
/**
 * @license
 * Copyright 2019 Google LLC
 * SPDX-License-Identifier: BSD-3-Clause
 */
var ot=function(t,i,e,o){for(var s,n=arguments.length,r=n<3?i:null===o?o=Object.getOwnPropertyDescriptor(i,e):o,l=t.length-1;l>=0;l--)(s=t[l])&&(r=(n<3?s(r):n>3?s(i,e,r):s(i,e))||r);return n>3&&r&&Object.defineProperty(i,e,r),r};let st=class extends G{constructor(){super(),this.policyUrl="https://pdp.kku.ac.th/policy/680656708694016000",this.projectId="",this.language="th",this.devMode=!1,this.showDialogRef=!1,this._categories=[],this._cookies=[],this._descriptionData="",this.template=[],this.widgetTextDetail=et}saveConsent(){const t=[],i=this.renderRoot.querySelectorAll(".category-checkbox");for(const e of i){const i=e;t.push({category_name:i.value,state:i.checked})}localStorage.setItem("cookie_config",JSON.stringify(t)),this.closeDialog()}acceptAllConsent(){const t=[],i=this.renderRoot.querySelectorAll(".category-checkbox");for(const e of i){const i=e;i.checked=!0,t.push({category_name:i.value,state:i.checked})}localStorage.setItem("cookie_config",JSON.stringify(t)),this.closeDialog()}getSettingButtonTemplate(){return this.projectId?j`
                <button class="btn setting" @click=${this.showDialog}>
                    <svg width="26" height="25" viewBox="0 0 26 25" fill="none" xmlns="http://www.w3.org/2000/svg">
                        <path
                                d="M20.9087 13.5208C20.9504 13.1875 20.9816 12.8542 20.9816 12.5C20.9816 12.1458 20.9504 11.8125 20.9087 11.4792L23.1066 9.76043C23.3046 9.60418 23.3566 9.32293 23.2316 9.09376L21.1483 5.48959C21.0546 5.32293 20.8775 5.22918 20.69 5.22918C20.6275 5.22918 20.565 5.23959 20.5129 5.26043L17.9191 6.30209C17.3775 5.88543 16.7941 5.54168 16.1587 5.28126L15.7629 2.52084C15.7316 2.27084 15.5129 2.08334 15.2525 2.08334H11.0858C10.8254 2.08334 10.6066 2.27084 10.5754 2.52084L10.1796 5.28126C9.54414 5.54168 8.96081 5.89584 8.41914 6.30209L5.82539 5.26043C5.76289 5.23959 5.70039 5.22918 5.63789 5.22918C5.46081 5.22918 5.28373 5.32293 5.18998 5.48959L3.10664 9.09376C2.97123 9.32293 3.03373 9.60418 3.23164 9.76043L5.42956 11.4792C5.38789 11.8125 5.35664 12.1563 5.35664 12.5C5.35664 12.8438 5.38789 13.1875 5.42956 13.5208L3.23164 15.2396C3.03373 15.3958 2.98164 15.6771 3.10664 15.9063L5.18998 19.5104C5.28373 19.6771 5.46081 19.7708 5.64831 19.7708C5.71081 19.7708 5.77331 19.7604 5.82539 19.7396L8.41914 18.6979C8.96081 19.1146 9.54414 19.4583 10.1796 19.7188L10.5754 22.4792C10.6066 22.7292 10.8254 22.9167 11.0858 22.9167H15.2525C15.5129 22.9167 15.7316 22.7292 15.7629 22.4792L16.1587 19.7188C16.7941 19.4583 17.3775 19.1042 17.9191 18.6979L20.5129 19.7396C20.5754 19.7604 20.6379 19.7708 20.7004 19.7708C20.8775 19.7708 21.0546 19.6771 21.1483 19.5104L23.2316 15.9063C23.3566 15.6771 23.3046 15.3958 23.1066 15.2396L20.9087 13.5208ZM18.8462 11.7396C18.8879 12.0625 18.8983 12.2813 18.8983 12.5C18.8983 12.7188 18.8775 12.9479 18.8462 13.2604L18.7004 14.4375L19.6275 15.1667L20.7525 16.0417L20.0233 17.3021L18.7004 16.7708L17.6171 16.3333L16.6796 17.0417C16.2316 17.375 15.8046 17.625 15.3775 17.8021L14.2733 18.25L14.1066 19.4271L13.8983 20.8333H12.44L12.0754 18.25L10.9712 17.8021C10.5233 17.6146 10.1066 17.375 9.68998 17.0625L8.74206 16.3333L7.63789 16.7813L6.31498 17.3125L5.58581 16.0521L6.71081 15.1771L7.63789 14.4479L7.49206 13.2708C7.46081 12.9479 7.43998 12.7083 7.43998 12.5C7.43998 12.2917 7.46081 12.0521 7.49206 11.7396L7.63789 10.5625L6.71081 9.83334L5.58581 8.95834L6.31498 7.69793L7.63789 8.22918L8.72123 8.66668L9.65873 7.95834C10.1066 7.62501 10.5337 7.37501 10.9608 7.19793L12.065 6.75001L12.2316 5.57293L12.44 4.16668H13.8879L14.2525 6.75001L15.3566 7.19793C15.8046 7.38543 16.2212 7.62501 16.6379 7.93751L17.5858 8.66668L18.69 8.21876L20.0129 7.68751L20.7421 8.94793L19.6275 9.83334L18.7004 10.5625L18.8462 11.7396ZM13.1691 8.33334C10.8671 8.33334 9.00248 10.1979 9.00248 12.5C9.00248 14.8021 10.8671 16.6667 13.1691 16.6667C15.4712 16.6667 17.3358 14.8021 17.3358 12.5C17.3358 10.1979 15.4712 8.33334 13.1691 8.33334ZM13.1691 14.5833C12.0233 14.5833 11.0858 13.6458 11.0858 12.5C11.0858 11.3542 12.0233 10.4167 13.1691 10.4167C14.315 10.4167 15.2525 11.3542 15.2525 12.5C15.2525 13.6458 14.315 14.5833 13.1691 14.5833Z"
                                fill="currentColor"/>
                    </svg>
                </button>`:""}getCategoryTemplate(){const t=JSON.parse(localStorage.getItem("cookie_config"));let i;return this._categories.length&&(this.template=this._categories.map((e=>{const o=e.category_name,s=e.description;let n;t&&(i=t.find((t=>t.category_name===o.en)));const r=document.createElement("input");return r.type="checkbox",r.checked=!i||i.state,r.required=e.required,r.value=o.en,r.classList.add("category-checkbox"),n=e.required?j`<label class="switch hidden">
                        ${r}
                        <span class="slider round"></span>
                    </label>`:j`<label class="switch">
                                            ${r}
                                            <span class="slider round"></span>
                                        </label>`,j`
                    <div class="category-item">
                        <details class="category-detail">
                            <summary class="category-title">
                                ${this.getTextLanguage(o)}
                                ${e.required?"("+this.getTextLanguage(this.widgetTextDetail.required)+")":""}
                            </summary>
                            <p class="category-desc">${this.getTextLanguage(s)}</p>
                        </details>
                        
                        ${n}
                    </div>
                `}))),j`
            <div class="category-container">
                ${this.template}
            </div>
        `}addScriptToPage(t,i){t&&t.state?i.cookies.map((t=>{t.head_scripts&&document.head.appendChild(document.createRange().createContextualFragment(t.head_scripts)),t.body_scripts&&document.body.appendChild(document.createRange().createContextualFragment(t.body_scripts))})):i.cookies.map((t=>{document.cookie=`${t.cookie_name}=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;`}))}processCookies(t=!1,i=!1){const e=JSON.parse(localStorage.getItem("cookie_config"));let o;this._categories.length&&this._categories.map((s=>{const n=s.category_name;e?(o=e.find((t=>t.category_name===n.en)),t&&(s.required||i)||this.addScriptToPage(o,s)):s.required&&!t&&s.cookies.map((t=>{t.head_scripts&&document.head.appendChild(document.createRange().createContextualFragment(t.head_scripts)),t.body_scripts&&document.body.appendChild(document.createRange().createContextualFragment(t.body_scripts))}))}))}acceptConsent(){const t=new Date;this.saveConsent(),this.processCookies(!0),localStorage.setItem("acceptConsent",String(!0)),localStorage.setItem("lastUpdate",t.toLocaleString()),this.widget.classList.add("hidden")}connectedCallback(){super.connectedCallback(),this.getData(this.projectId)}render(){return j`
            <section class="widget-container hidden" lang=${this.language}>

                <p class="widget-content">
                    ${this.getTextLanguage(this.widgetTextDetail.title_widget)}
                    <a href="${this.policyUrl+"?lang="+this.language}" target="_blank">
                        ${this.getTextLanguage(this.widgetTextDetail.link_privacy)}
                    </a>
                </p>
                <div class="banner-button-container">
                    ${this.getSettingButtonTemplate()}
                    <button class="btn primary btn-continue" @click="${this.acceptConsent}">
                        ${this.getTextLanguage(this.widgetTextDetail.button_continue)}
                    </button>
                </div>
            </section>

            <div class="backdrop" id="backdrop" @click=${this.closeDialog}></div>

            <dialog id="cookieSettingDialog">
                <header class="dialog-header">
                    <h3 class="dialog-title">${this.getTextLanguage(this.widgetTextDetail.cookie_setting_header)}</h3>
                    <button class="btn icon-button" @click=${this.closeDialog}>
                        <svg width="18" height="18" viewBox="0 0 18 18" fill="none"
                             xmlns="http://www.w3.org/2000/svg">
                            <path d="M17.75 2.0125L15.9875 0.25L9 7.2375L2.0125 0.25L0.25 2.0125L7.2375 9L0.25 15.9875L2.0125 17.75L9 10.7625L15.9875 17.75L17.75 15.9875L10.7625 9L17.75 2.0125Z"
                                  fill="currentColor"/>
                        </svg>
                    </button>
                </header>
                <section class="dialog-content">
                    <p class="dialog-desc">
                        ${this.getTextLanguage(this.widgetTextDetail.cookie_setting_title)}
                    </p>
                    <hr>
                    ${this.getCategoryTemplate()}
                    <hr>

                </section>
                <footer class="dialog-footer">
                    <button class="btn dialog-button primary outlined" @click=${this.acceptAllConsent} id="acceptAll">
                        ${this.getTextLanguage(this.widgetTextDetail.accept_all)}
                    </button>
                    <button class="btn dialog-button primary" @click=${this.saveConsent}>
                        ${this.getTextLanguage(this.widgetTextDetail.save_data)}
                    </button>
                </footer>
            </dialog>
        `}firstUpdated(t){super.firstUpdated(t);"true"!=localStorage.getItem("acceptConsent")&&this.widget.classList.remove("hidden")}updated(t){super.updated(t),t.has("showDialogRef")?this.showDialogRef?this.showDialog():this.processCookies(!0,!0):this.processCookies();const i=new Date(localStorage.getItem("lastUpdate"));let e=!1;this._categories.map((t=>{t.cookies.map((t=>{const o=new Date(t.updated_at);console.log(o,i),i<o&&(e=!0)}))})),e&&this.widget.classList.remove("hidden")}getTextLanguage(t){switch(this.language){case"th":default:return t.th;case"en":return t.en}}showDialog(){this.projectId&&(this.dialog.show(),this.backdrop.classList.add("show"))}closeDialog(){this.dialog.close(),this.showDialogRef=!1,this.backdrop.classList.remove("show")}getData(t){let i="https://pdp.kku.ac.th/api/v1/cookies?project_id="+t+"&group_by=category";this.devMode&&(i="https://kku-pdp.zercle.info/api/v1/cookies?project_id="+t+"&group_by=category"),this.projectId&&fetch(i).then((t=>t.json())).then((t=>{t.result&&t.result.categories&&t.result.categories.length&&(this._categories=t.result.categories.filter((t=>t.cookies)))}))}};st.styles=it,ot([V({type:String})],st.prototype,"policyUrl",void 0),ot([V({type:String})],st.prototype,"projectId",void 0),ot([V({type:String})],st.prototype,"language",void 0),ot([V({type:Boolean})],st.prototype,"devMode",void 0),ot([V({type:Boolean})],st.prototype,"showDialogRef",void 0),ot([V()],st.prototype,"_categories",void 0),ot([V()],st.prototype,"_cookies",void 0),ot([V()],st.prototype,"_descriptionData",void 0),ot([Q("#cookieSettingDialog")],st.prototype,"dialog",void 0),ot([Q("#backdrop")],st.prototype,"backdrop",void 0),ot([Q("#detail")],st.prototype,"detail",void 0),ot([Q(".category-checkbox")],st.prototype,"checkedBoxState",void 0),ot([Q(".widget-container")],st.prototype,"widget",void 0),st=ot([(t=>i=>"function"==typeof i?((t,i)=>(window.customElements.define(t,i),i))(t,i):((t,i)=>{const{kind:e,elements:o}=i;return{kind:e,elements:o,finisher(i){window.customElements.define(t,i)}}})(t,i))("kku-cookie-widget")],st);export{st as KKUCookieWidget};
