UNPKG

npm-allakando-publish

Version:

Allakando's web component library

10 lines 57 kB
/** @preserve @license @cc_on * ---------------------------------------------------------- * npm-allakando-publish version 0.0.35 * Allakando's web component library * Copyright (c) 2023 Allakando * All Rights Reserved. MIT License * https://mit-license.org/ * ---------------------------------------------------------- */ !function(e){"function"==typeof define&&define.amd?define(e):e()}((function(){"use strict";if("undefined"!=typeof document&&"undefined"!=typeof window){const e=document.createElement("template");e.innerHTML='<style>:host([size=large]) button{font-family:var(--ako-font-family-body, --ako-font-family-heading, trade-gothic-next-soft-round, sans-serif);font-style:normal;font-stretch:normal;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:var(--ako-neutral-color-900, #686868);font-weight:700;font-size:1.5rem;line-height:1.75rem}@media screen and (max-width: 768px){:host([size=large]) button{font-size:1.5rem;line-height:1.75rem}}button{font-family:var(--ako-font-family-body, --ako-font-family-heading, trade-gothic-next-soft-round, sans-serif);font-style:normal;font-stretch:normal;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:var(--ako-neutral-color-900, #686868);font-weight:700;font-size:1.25rem;line-height:1.5rem}@media screen and (max-width: 768px){button{font-size:1.25rem;line-height:1.5rem}}:host([size=small]) button{font-family:var(--ako-font-family-body, --ako-font-family-heading, trade-gothic-next-soft-round, sans-serif);font-style:normal;font-stretch:normal;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:var(--ako-neutral-color-900, #686868);font-weight:700;font-size:1rem;line-height:1.25rem}@media screen and (max-width: 768px){:host([size=small]) button{font-size:1rem;line-height:1.25rem}}:host{display:inline-block;width:100%}button{--color-dark: var(--ako-primary-color-1000, #7aa329);--color-standard: var(--ako-primary-color-900, #96c933);--color-light: var(--ako-primary-color-800, #a0ce47);--with-color: #ffffff;color:var(--with-color);background:var(--color-standard);box-shadow:0 1em 1em -1em var(--color-dark);padding:.75em;cursor:pointer;white-space:nowrap;text-align:center;width:100%;border:none;outline:none;transition:all ease var(--ako-standard-animation-duration, 200ms);border-radius:var(--ako-component-border-radius, 0.2rem)}button:active{box-shadow:none !important;transform:translateY(0.1875rem)}button:hover,button:active{background-color:var(--color-light)}.disabled{cursor:not-allowed;opacity:75% !important;box-shadow:none !important}.disabled:hover,.disabled:active{background:var(--color-standard) !important;transform:none !important}#container{display:flex;align-items:center;justify-content:center;gap:.5em}#icon{height:1.5em;width:1.5em;min-height:1.5em;min-width:1.5em;object-fit:contain;pointer-events:none}:host([size=large]) button{color:#fff}:host([size=small]) button{color:#fff}:host([hollow]) button{color:var(--color-standard);background:rgba(0,0,0,0);box-shadow:none;border:2px solid var(--color-standard);padding:calc(.7em - 2px)}:host([hollow]) button:hover,:host([hollow]) button:active{color:var(--with-color);background:var(--color-standard)}button[type=primary]{--color-dark: var(--ako-primary-color-500, #c0df85);--color-standard: var(--ako-primary-color-900, #96c933);--color-light: var(--ako-primary-color-800, #a0ce47)}button[type=neutral]{--color-dark: var(--ako-neutral-color-900, #686868);--color-standard: var(--ako-neutral-color-800, #777777);--color-light: var(--ako-neutral-color-700, #868686)}button[type=warning]{--color-dark: var(--ako-warning-color-1000, #EAB300);--color-standard: var(--ako-warning-color-900, #f5bb00);--color-light: var(--ako-warning-color-800, #f6c21a)}button[type=error]{--color-dark: var(--ako-error-color-1000, #E62900);--color-standard: var(--ako-error-color-900, #f52c00);--color-light: var(--ako-error-color-800, #f6411a)}</style><button>\r\n <div id="container">\r\n <img alt="Icon" id="icon" />\r\n <slot></slot>\r\n </div>\r\n</button>';class t extends HTMLElement{static get observedAttributes(){return["disabled","akostyle","icon","icon-placement","size","type","direction"]}constructor(){super(),this.attachShadow({mode:"open"}).appendChild(e.content.cloneNode(!0)),this._mainContainer=this.shadowRoot.querySelector("#container"),this._iconElement=this.shadowRoot.querySelector("#icon"),this._slotElement=this.shadowRoot.querySelector("slot"),this._buttonElement=this.shadowRoot.querySelector("button"),this._buttonElement.addEventListener("click",(()=>{this._buttonElement.style.transform="translateY(0.1875rem)",setTimeout((()=>{this._buttonElement.style.removeProperty("transform")}),50)})),this._render()}attributeChangedCallback(){this._render()}click(){this._buttonElement.click()}_render(){this._mainContainer.style.removeProperty("flex-direction"),this.hasAttribute("direction")&&"column"===this.getAttribute("direction").toLowerCase()&&(this._mainContainer.style.flexDirection="column"),this._iconElement.style.removeProperty("display"),this.hasAttribute("icon")?this._iconElement.setAttribute("src",this.getAttribute("icon")):this._iconElement.style.display="none",this.hasAttribute("icon-placement")&&"after"===this.getAttribute("icon-placement").toLowerCase()?(this._mainContainer.appendChild(this._slotElement),this._mainContainer.appendChild(this._iconElement)):(this._mainContainer.appendChild(this._iconElement),this._mainContainer.appendChild(this._slotElement)),this._buttonElement.classList.remove("disabled"),this._buttonElement.removeAttribute("disabled"),this.hasAttribute("disabled")&&(this._buttonElement.classList.add("disabled"),this._buttonElement.setAttribute("disabled",!0)),this._buttonElement.removeAttribute("style"),this.hasAttribute("akostyle")&&(this._buttonElement.style=this.getAttribute("akostyle")),this._buttonElement.removeAttribute("type"),this.hasAttribute("type")?this._buttonElement.setAttribute("type",this.getAttribute("type").toLowerCase()):this._buttonElement.setAttribute("type","primary")}}window.customElements.define("ako-button",t)}if("undefined"!=typeof document&&"undefined"!=typeof window){const e=document.createElement("template");e.innerHTML='<style>.spinner{width:100%;height:100%;display:block}.spinner g:first-child{transform:rotate(0deg);transform-origin:50px 50px}.spinner g:nth-child(2){transform:rotate(30deg);transform-origin:50px 50px}.spinner g:nth-child(3){transform:rotate(60deg);transform-origin:50px 50px}.spinner g:nth-child(4){transform:rotate(90deg);transform-origin:50px 50px}.spinner g:nth-child(5){transform:rotate(120deg);transform-origin:50px 50px}.spinner g:nth-child(6){transform:rotate(150deg);transform-origin:50px 50px}.spinner g:nth-child(7){transform:rotate(180deg);transform-origin:50px 50px}.spinner g:nth-child(8){transform:rotate(210deg);transform-origin:50px 50px}.spinner g:nth-child(9){transform:rotate(240deg);transform-origin:50px 50px}.spinner g:nth-child(10){transform:rotate(270deg);transform-origin:50px 50px}.spinner g:nth-child(11){transform:rotate(300deg);transform-origin:50px 50px}.spinner g:nth-child(12){transform:rotate(330deg);transform-origin:50px 50px}.spinner-blade{width:.5rem;height:1.5rem;fill:var(--ako-neutral-color-900, #686868)}</style><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 100 100"\r\n preserveAspectRatio="xMaxYMax" class="spinner">\r\n <g>\r\n <rect x="46" y="2" rx="6" ry="3" class="spinner-blade">\r\n <animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="-0.9166666666666666s"\r\n repeatCount="indefinite"></animate>\r\n </rect>\r\n </g>\r\n <g>\r\n <rect x="46" y="2" y="2" rx="6" ry="3" class="spinner-blade">\r\n <animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="-0.8333333333333334s"\r\n repeatCount="indefinite"></animate>\r\n </rect>\r\n </g>\r\n <g>\r\n <rect x="46" y="2" y="2" rx="6" ry="3" class="spinner-blade">\r\n <animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="-0.75s" repeatCount="indefinite">\r\n </animate>\r\n </rect>\r\n </g>\r\n <g>\r\n <rect x="46" y="2" y="2" rx="6" ry="3" class="spinner-blade">\r\n <animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="-0.6666666666666666s"\r\n repeatCount="indefinite"></animate>\r\n </rect>\r\n </g>\r\n <g>\r\n <rect x="46" y="2" y="2" rx="6" ry="3" class="spinner-blade">\r\n <animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="-0.5833333333333334s"\r\n repeatCount="indefinite"></animate>\r\n </rect>\r\n </g>\r\n <g>\r\n <rect x="46" y="2" y="2" rx="6" ry="3" class="spinner-blade">\r\n <animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="-0.5s" repeatCount="indefinite">\r\n </animate>\r\n </rect>\r\n </g>\r\n <g>\r\n <rect x="46" y="2" y="2" rx="6" ry="3" class="spinner-blade">\r\n <animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="-0.4166666666666667s"\r\n repeatCount="indefinite"></animate>\r\n </rect>\r\n </g>\r\n <g>\r\n <rect x="46" y="2" y="2" rx="6" ry="3" class="spinner-blade">\r\n <animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="-0.3333333333333333s"\r\n repeatCount="indefinite"></animate>\r\n </rect>\r\n </g>\r\n <g>\r\n <rect x="46" y="2" y="2" rx="6" ry="3" class="spinner-blade">\r\n <animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="-0.25s" repeatCount="indefinite">\r\n </animate>\r\n </rect>\r\n </g>\r\n <g>\r\n <rect x="46" y="2" y="2" rx="6" ry="3" class="spinner-blade">\r\n <animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="-0.16666666666666666s"\r\n repeatCount="indefinite"></animate>\r\n </rect>\r\n </g>\r\n <g>\r\n <rect x="46" y="2" y="2" rx="6" ry="3" class="spinner-blade">\r\n <animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="-0.08333333333333333s"\r\n repeatCount="indefinite"></animate>\r\n </rect>\r\n </g>\r\n <g>\r\n <rect x="46" y="2" y="2" rx="6" ry="3" class="spinner-blade">\r\n <animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="0s" repeatCount="indefinite">\r\n </animate>\r\n </rect>\r\n </g>\r\n</svg>';class t extends HTMLElement{static get observedAttributes(){return["size"]}constructor(){super(),this.attachShadow({mode:"open"}).appendChild(e.content.cloneNode(!0)),this._spinner=this.shadowRoot.querySelector("svg")}attributeChangedCallback(e,t,o){"size"===e&&(null===o?this._spinner.removeAttribute("style"):(this._spinner.style.height=o,this._spinner.style.minHeight=o,this._spinner.style.maxHeight=o,this._spinner.style.width=o,this._spinner.style.minWidth=o,this._spinner.style.maxWidth=o))}}window.customElements.define("ako-spinner",t)}const e="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMiIgaGVpZ2h0PSIyMiIgdmlld0JveD0iMCAwIDIyIDIyIj4KICAgIDxnIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICAgICAgPGc+CiAgICAgICAgICAgIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMDMzLjAwMDAwMCwgLTc2OS4wMDAwMDApIHRyYW5zbGF0ZSgyMDM0LjAwMDAwMCwgNzcwLjAwMDAwMCkiPgogICAgICAgICAgICAgICAgPGNpcmNsZSBjeD0iMTAiIGN5PSIxMCIgcj0iMTAiIGZpbGwtcnVsZT0ibm9uemVybyIgc3Ryb2tlPSIjRkZGRiIgc3Ryb2tlLXdpZHRoPSIyIi8+CiAgICAgICAgICAgIDwvZz4KICAgICAgICA8L2c+CiAgICA8L2c+Cjwvc3ZnPgo=";if("undefined"!=typeof document&&"undefined"!=typeof window){const e=document.createElement("template");e.innerHTML='<style>#header #header-title{font-family:var(--ako-font-family-body, --ako-font-family-heading, trade-gothic-next-soft-round, sans-serif);font-style:normal;font-stretch:normal;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:var(--ako-neutral-color-900, #686868);font-weight:700;font-size:2.5rem;line-height:2.875rem}@media screen and (max-width: 768px){#header #header-title{font-size:1.875rem;line-height:2.125rem}}#header #header-subtitle{font-family:var(--ako-font-family-body, --ako-font-family-heading, trade-gothic-next-soft-round, sans-serif);font-style:normal;font-stretch:normal;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:var(--ako-neutral-color-900, #686868);font-weight:700;font-size:1.375rem;line-height:1.875rem}@media screen and (max-width: 768px){#header #header-subtitle{font-size:1.375rem;line-height:1.5rem}}#body,#footer{font-family:var(--ako-font-family-body, --ako-font-family-heading, trade-gothic-next-soft-round, sans-serif);font-style:normal;font-stretch:normal;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:var(--ako-neutral-color-900, #686868);font-weight:400;font-size:1.25rem;line-height:1.75rem}@media screen and (max-width: 768px){#body,#footer{font-size:1.25rem;line-height:1.75rem}}#main{display:block;position:fixed;top:0;left:0;z-index:9001;width:100%;height:100%;overflow-x:hidden;overflow-y:auto;outline:0}#backdrop{position:fixed;inset:0;background-color:#000;opacity:.5;pointer-events:none;z-index:9000}#window{position:relative;display:flex;flex-direction:column;width:750px;box-shadow:0 2px 5px 0 rgba(0,0,0,.2);border-radius:var(--ako-component-border-radius, 0.2rem);animation-duration:var(--ako-standard-animation-duration, 200ms);animation-timing-function:ease-in-out;transition:all var(--ako-standard-animation-duration, 200ms);margin-left:auto;margin-right:auto;margin-top:5rem;margin-bottom:5rem}@media(max-width: 846px){#body{padding:var(--ako-dialog-content-padding, 2rem 4rem 4rem 4rem) !important}#header{padding-left:4rem !important;padding-right:4rem !important}#window{width:calc(100% - 6rem)}}@media(max-width: 569px){#body{padding:var(--ako-dialog-content-padding, 2rem) !important}#header{padding-left:2rem !important;padding-right:2rem !important}#window{width:calc(100% - 1rem)}}@keyframes main-animation{from{transform:scale(0.8);opacity:0}to{transform:scale(1);opacity:1}}#header,:host([noheader]) #body{border-top-left-radius:var(--ako-component-border-radius, 0.2rem);border-top-right-radius:var(--ako-component-border-radius, 0.2rem)}#footer,:host([nofooter]) #body{border-bottom-left-radius:var(--ako-component-border-radius, 0.2rem);border-bottom-right-radius:var(--ako-component-border-radius, 0.2rem)}#header{background:#fff;border-bottom:none;display:flex;flex-direction:column;gap:.5rem;user-select:none;background-image:linear-gradient(to bottom, var(--ako-primary-color-600, #b6d970), var(--ako-primary-color-900, #96c933));padding-bottom:2rem !important;padding-top:6.25rem !important;padding-left:6.25rem;padding-right:6.25rem}#header #header-title,#header #header-subtitle{display:none;flex:auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#header #header-title{color:#fff}#header #header-subtitle{color:#fff}#close-icon{font-size:1.25rem;position:absolute;top:0;right:0;padding:1.75rem;cursor:pointer;filter:invert(1);opacity:.75;transition:opacity var(--ako-standard-animation-duration, 200ms)}#close-icon:hover{opacity:1}#body{height:100%;overflow:auto;background:#fff;padding:var(--ako-dialog-content-padding, 2rem 6.25rem 4rem 6.25rem)}#footer{background:#fff;border-top:none;display:flex;flex-direction:row;align-items:center;white-space:nowrap;overflow:hidden}#header,#footer{min-height:3rem}.icon{display:block;min-height:1em;min-width:1em;height:1em;width:1em;position:relative}.icon[src=""]{visibility:hidden}.icon:not([src]){display:none}:host([noheader]) #header{display:none}:host([noheader]) #close-icon{filter:none;background-color:#fff;border-radius:50%;margin:1rem;padding:.75rem}:host([nofooter]) #footer{display:none}:host([noclose]) #close-icon{display:none}:host([subtitle]) #header{padding-top:4rem !important}:host([scrollable]) #window{max-height:calc(100% - 10rem)}:host([scrollable]) #header{min-height:auto}:host([center]) #main{inset:0;height:100vh;width:100vw}:host([center]) #window{max-height:90vh;position:fixed;inset:0;height:max-content;margin:auto}:host([fluid]) #window{max-width:max-content}</style><div id="backdrop"></div>\n<div id="main">\n <div id="window">\n <img class="icon" id="close-icon"></img>\n <div id="header">\n <span id="header-title"></span>\n <span id="header-subtitle"></span>\n <slot name="header"></slot>\n </div>\n <div id="body">\n <slot></slot>\n </div>\n <div id="footer">\n <slot name="footer"></slot>\n </div>\n </div>\n</div>\n';class t extends HTMLElement{static get observedAttributes(){return["noheader","nofooter","noclose","modality","title","subtitle"]}constructor(){super(),this.attachShadow({mode:"open"}).appendChild(e.content.cloneNode(!0)),this._mainElement=this.shadowRoot.querySelector("#main"),this._windowElement=this.shadowRoot.querySelector("#window"),this._headerElement=this.shadowRoot.querySelector("#header"),this._headerTextElement=this.shadowRoot.querySelector("#header-title"),this._headerSubtitleElement=this.shadowRoot.querySelector("#header-subtitle"),this._headerButtonsContainerElement=this.shadowRoot.querySelector("#header-buttons"),this._closeIconElement=this.shadowRoot.querySelector("#close-icon"),this._bodyElement=this.shadowRoot.querySelector("#body"),this._footerElement=this.shadowRoot.querySelector("#footer"),this._closeIconElement.setAttribute("src","data:image/svg+xml;utf-8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 17 17'><path fill-rule='nonzero' d='M8.412 6.883L14.588.707a1 1 0 0 1 1.414 0l.116.115a1 1 0 0 1 0 1.415L9.942 8.412l6.176 6.176a1 1 0 0 1 0 1.414l-.116.116a1 1 0 0 1-1.414 0L8.412 9.942l-6.175 6.176a1 1 0 0 1-1.415 0l-.115-.116a1 1 0 0 1 0-1.414l6.176-6.176L.707 2.237a1 1 0 0 1 0-1.415L.822.707a1 1 0 0 1 1.415 0l6.175 6.176z'/></svg>"),this._closeIconElement.addEventListener("click",this.close.bind(this)),this._hasMounted=!1,this._mainElement.addEventListener("click",(e=>{"disabled"!==this.getAttribute("modality")&&e.composedPath()[0]===this._mainElement&&this.close()}))}connectedCallback(){this._hasMounted||(this._hasMounted=!0,requestAnimationFrame((()=>{this._animate(!1)}))),document.body.style.overflow="hidden"}disconnectedCallback(){0===document.querySelectorAll("ako-dialog").length&&(document.body.style.overflow=null)}attributeChangedCallback(e,t,o){"title"===e&&this._updateHeaderText(o,!0),"subtitle"===e&&this._updateHeaderText(o,!1)}_updateHeaderText(e,t){const o=t?this._headerTextElement:this._headerSubtitleElement;o.innerHTML="",o.style.removeProperty("display"),e&&(o.appendChild(document.createTextNode(e)),o.style.display="initial")}_animate(e){let t;const o=new Promise((e=>t=e));e&&(this._windowElement.style.animationDirection="reverse"),this._windowElement.style.animationName="main-animation";const n=()=>{this._windowElement.style.removeProperty("animation-name"),this._windowElement.style.removeProperty("animation-direction"),this._windowElement.removeEventListener("animationend",n),t()};return this._windowElement.addEventListener("animationend",n),o}close(e){e&&e.preventDefault(),this._animate(!0).then((()=>this.remove())),this.dispatchEvent(new CustomEvent("close"))}}window.customElements.define("ako-dialog",t)}if("undefined"!=typeof document&&"undefined"!=typeof window){const e=document.createElement("template");e.innerHTML='<style>#accordion-wrapper #accordion-header #accordion-title.opened{font-family:var(--ako-font-family-body, --ako-font-family-heading, trade-gothic-next-soft-round, sans-serif);font-style:normal;font-stretch:normal;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:var(--ako-neutral-color-900, #686868);font-weight:700;font-size:2.5rem;line-height:2.875rem}@media screen and (max-width: 768px){#accordion-wrapper #accordion-header #accordion-title.opened{font-size:1.875rem;line-height:2.125rem}}#accordion-wrapper #accordion-header #accordion-title{font-family:var(--ako-font-family-body, --ako-font-family-heading, trade-gothic-next-soft-round, sans-serif);font-style:normal;font-stretch:normal;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:var(--ako-neutral-color-900, #686868);font-weight:400;font-size:1.5rem;line-height:2rem}@media screen and (max-width: 768px){#accordion-wrapper #accordion-header #accordion-title{font-size:1.5rem;line-height:1.875rem}}#accordion-wrapper #accordion-header #toggle-accordion,#accordion-wrapper #accordion-header{font-family:var(--ako-font-family-body, --ako-font-family-heading, trade-gothic-next-soft-round, sans-serif);font-style:normal;font-stretch:normal;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:var(--ako-neutral-color-900, #686868);font-weight:400;font-size:1.25rem;line-height:1.75rem}@media screen and (max-width: 768px){#accordion-wrapper #accordion-header #toggle-accordion,#accordion-wrapper #accordion-header{font-size:1.25rem;line-height:1.75rem}}:host(:not(:first-of-type)) #accordion-wrapper{border-top:0}#accordion-wrapper{padding-top:1.75rem;padding-bottom:1.75rem;transition:all .2s;border-top:var(--ako-accordion-border-top, 2px solid #f0f0f0);border-bottom:var(--ako-accordion-border-bottom, 2px solid #f0f0f0)}#accordion-wrapper #accordion-header{display:flex;align-items:center;justify-content:space-between;padding-left:1.5rem;padding-right:1.5rem}@media(min-width: 576px){#accordion-wrapper #accordion-header{padding:0}}#accordion-wrapper #accordion-header #image-title-wrap{display:flex;justify-content:center;align-items:center;overflow:hidden}#accordion-wrapper #accordion-header #accordion-title{line-height:initial !important;transition:all .2s;white-space:nowrap;overflow:hidden;flex:auto;text-overflow:ellipsis}#accordion-wrapper #accordion-header #accordion-image{display:none;width:2.75rem;height:2.75rem;min-width:2.75rem;min-height:2.75rem;margin-right:1.75rem}#accordion-wrapper #accordion-header #accordion-image.is-image{background-size:contain;background-repeat:no-repeat;background-position:center center}#accordion-wrapper #accordion-header #accordion-image.is-letters{background:var(--ako-primary-color-900, #96c933);color:#fff;text-transform:uppercase;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.125rem;line-height:1;font-weight:700}#accordion-wrapper #accordion-header #toggle-accordion{cursor:pointer;white-space:nowrap;margin-left:1.75rem}#accordion-wrapper #accordion-header #toggle-accordion:after{display:inline-block;content:"";width:.875rem;height:.75rem;margin-left:.5rem;background-size:.85rem .5rem;background-repeat:no-repeat;background-position:50%;transition:transform 200ms;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns=\'http://www.w3.org/2000/svg\' viewBox=\'0 0 14 8\'%3E%3Cpath d=\'M13.3.7a1 1 0 010 1.3L7.7 7.3a1 1 0 01-1.4 0L.7 2A1 1 0 01.7.7a1 1 0 011.4 0L7 5.3 11.9.7a1 1 0 011.4 0z\' fill=\'%23686868\' fill-rule=\'evenodd\'/%3E%3C/svg%3E")}#accordion-wrapper #accordion-header #toggle-accordion.opened:after{transform:rotate(-180deg)}#accordion-wrapper #accordion-content{display:block;margin-top:1.25rem}#accordion-wrapper #accordion-content.closed{display:none !important}@media(max-width: 768px){#accordion-wrapper{padding-top:1rem;padding-bottom:1.25rem}}</style><div id="accordion-wrapper">\n\t<div id="accordion-header">\n\t\t<div id="image-title-wrap">\n\t\t\t<div id="accordion-image"></div>\n\t\t\t<div id="accordion-title"></div>\n\t\t</div>\n\t\t<span id="toggle-accordion"></span>\n\t</div>\n\t<div id="accordion-content" class="closed">\n\t\t<slot></slot>\n\t</div>\n</div>\n';class t extends HTMLElement{static get observedAttributes(){return["title","icon","open-text","close-text"]}constructor(){super(),this.attachShadow({mode:"open"}).appendChild(e.content.cloneNode(!0)),this._titleTextElement=this.shadowRoot.querySelector("#accordion-title"),this._toggleAccordionElement=this.shadowRoot.querySelector("#toggle-accordion"),this._contentElement=this.shadowRoot.querySelector("#accordion-content"),this._mainElement=this.shadowRoot.querySelector("#accordion-wrapper"),this._slotElement=this.shadowRoot.querySelector("slot"),this._imageElement=this.shadowRoot.querySelector("#accordion-image"),this._accordionOpened=!1,this._openAccordionText="Visa",this._closeAccordionText="Dölj",this._toggleAccordionElement.addEventListener("click",this.toggle.bind(this)),this._render()}attributeChangedCallback(e,t,o){"title"===e&&this._updateHeaderText(o),this._render()}_updateHeaderText(e){const t=this._titleTextElement;t.innerHTML="",t.style.removeProperty("display"),e&&(t.appendChild(document.createTextNode(e)),t.style.display="initial")}isValidUrl(e){try{return Boolean(new URL(e))}catch(e){return!1}}toggle(e){e&&e.preventDefault(),this._accordionOpened?(this._contentElement.classList.add("closed"),this._titleTextElement.classList.remove("opened"),this._toggleAccordionElement.classList.remove("opened"),this._toggleAccordionElement.textContent=this._openAccordionText,this._accordionOpened=!1):(this._contentElement.classList.remove("closed"),this._titleTextElement.classList.add("opened"),this._toggleAccordionElement.classList.add("opened"),this._toggleAccordionElement.textContent=this._closeAccordionText,this._accordionOpened=!0)}_render(){this.hasAttribute("open-text")&&(this._openAccordionText=this.getAttribute("open-text")),this.hasAttribute("close-text")&&(this._closeAccordionText=this.getAttribute("close-text")),this._toggleAccordionElement.innerHTML="",this._toggleAccordionElement.appendChild(document.createTextNode(this._openAccordionText)),this.hasAttribute("icon")&&(this._imageElement.style.display="flex",this.isValidUrl(this.getAttribute("icon"))?(this._imageElement.style.backgroundImage=`url(${this.getAttribute("icon")})`,this._imageElement.classList.add("is-image")):(this._imageElement.innerHTML=this.getAttribute("icon").substring(0,2),this._imageElement.classList.add("is-letters")))}}window.customElements.define("ako-accordion",t)}if("undefined"!=typeof document&&"undefined"!=typeof window){const e=document.createElement("template");e.innerHTML='<style>.toggle{box-sizing:border-box;display:flex;justify-content:center;align-items:center;width:max-content;height:max-content;cursor:pointer;transition:all 300ms;background:rgba(0,0,0,0);border-radius:.5em;padding:.5em;box-shadow:none}#open-svg{width:1.5rem;height:1.25rem}#close-svg{width:1.25rem;height:1.25rem}svg path{stroke:var(--ako-neutral-color-600, #959595);fill:var(--ako-neutral-color-600, #959595);stroke-width:4px;stroke-linecap:round;transition:all 300ms}.toggle:hover svg path{opacity:.7}#close-toggle{position:absolute;right:.75rem;top:.5rem}#menu-panel{display:block;position:fixed;top:0;height:100vh;width:18.75rem;max-width:100vw;right:-18.75rem;z-index:99;transition:inset 300ms,box-shadow 300ms;box-shadow:none;background-color:#fff}:host([open]) #menu-panel{right:0;pointer-events:unset;box-shadow:-1.25rem 0 1.875rem 0 rgba(0,0,0,.1)}#backdrop{pointer-events:none;background:rgba(0,0,0,0);position:fixed;inset:0;z-index:98}:host([open]) #backdrop{pointer-events:all;display:block}</style><div id="menu-panel">\r\n <div class="toggle" id="close-toggle">\r\n <svg id="close-svg" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32">\r\n <path d="M3 3l26 26M29 3l-26 26"></path>\r\n </svg>\r\n </div>\r\n <slot></slot>\r\n</div>\r\n<div id="backdrop"></div>\r\n<div class="toggle">\r\n <svg id="open-svg" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 38 32">\r\n <path d="M2 2h32M2 16h32M2 30h32"></path>\r\n </svg>\r\n</div>';class t extends HTMLElement{static get observedAttributes(){return["open"]}constructor(){super(),this.attachShadow({mode:"open"}).appendChild(e.content.cloneNode(!0)),this.shadowRoot.querySelectorAll(".toggle").forEach((e=>e.addEventListener("click",(()=>this.toggleAttribute("open"))))),this.shadowRoot.querySelector("#backdrop").addEventListener("click",(()=>this.toggleAttribute("open")))}attributeChangedCallback(){this._render()}_render(){this.hasAttribute("open")?document.body.style.overflow="hidden":document.body.style.removeProperty("overflow")}}window.customElements.define("ako-drawer",t)}if("undefined"!=typeof document&&"undefined"!=typeof window){const e=document.createElement("template");e.innerHTML='<style>#badge{font-family:var(--ako-font-family-body, --ako-font-family-heading, trade-gothic-next-soft-round, sans-serif);font-style:normal;font-stretch:normal;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:var(--ako-neutral-color-900, #686868);font-weight:700;font-size:1rem;line-height:1.5rem}@media screen and (max-width: 768px){#badge{font-size:1rem;line-height:1.5rem}}#badge{display:flex;position:absolute;box-sizing:border-box;align-items:center;justify-content:center;bottom:100%;left:100%}#badge-value{display:flex;justify-content:center;align-items:center;position:absolute;width:max-content;min-width:1em;min-height:1.5em;border-radius:4em;padding:0 .25em;color:#fff;background-color:var(--ako-error-color-800, #f6411a);z-index:1}:host([inline]) #badge{left:auto;bottom:auto;display:inline-block;position:static}:host([inline]) #badge-value{position:initial}:host([shape=square]) #badge-value{border-radius:.125em}:host([type=primary]) #badge-value{background-color:var(--ako-primary-color-800, #a0ce47)}:host([type=neutral]) #badge-value{background-color:var(--ako-neutral-color-800, #777777)}:host([type=warning]) #badge-value{background-color:var(--ako-warning-color-800, #f6c21a)}:host([type=error]) #badge-value{background-color:var(--ako-error-color-1000, #E62900)}</style><div id="badge">\r\n <div id="badge-value">\r\n <slot></slot>\r\n </div>\r\n</div>';class t extends HTMLElement{static get observedAttributes(){return["shape","type","inline"]}constructor(){super(),this.attachShadow({mode:"open"}).appendChild(e.content.cloneNode(!0))}}window.customElements.define("ako-badge",t)}if("undefined"!=typeof document&&"undefined"!=typeof window){const e=document.createElement("template");e.innerHTML='<style>#card-image-placeholder{font-family:var(--ako-font-family-body, --ako-font-family-heading, trade-gothic-next-soft-round, sans-serif);font-style:normal;font-stretch:normal;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:var(--ako-neutral-color-900, #686868);font-weight:700;font-size:1.75rem;line-height:2.125rem}@media screen and (max-width: 768px){#card-image-placeholder{font-size:1.5rem;line-height:1.75rem}}#notification-title{font-family:var(--ako-font-family-body, --ako-font-family-heading, trade-gothic-next-soft-round, sans-serif);font-style:normal;font-stretch:normal;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:var(--ako-neutral-color-900, #686868);font-weight:700;font-size:1.375rem;line-height:1.875rem}@media screen and (max-width: 768px){#notification-title{font-size:1.375rem;line-height:1.5rem}}#notification-message{font-family:var(--ako-font-family-body, --ako-font-family-heading, trade-gothic-next-soft-round, sans-serif);font-style:normal;font-stretch:normal;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:var(--ako-neutral-color-900, #686868);font-weight:400;font-size:1rem;line-height:1.5rem}@media screen and (max-width: 768px){#notification-message{font-size:1rem;line-height:1.5rem}}#notification{display:flex;flex-direction:row;text-align:left;justify-content:left}#notification-image{display:none;min-width:6.75rem;min-height:6.75rem;width:6.75rem;height:6.75rem;align-self:start;border-radius:50%;color:#fff}#card-image-placeholder{display:flex;color:#fff;background:var(--ako-primary-color-900, #96c933);align-items:center;justify-content:center;min-width:6.75rem;min-height:6.75rem;width:6.75rem;height:6.75rem;border-radius:50%}:host(:not([noclose])) #close-icon{display:flex;justify-content:center;align-items:center;width:2rem;height:2rem;box-sizing:border-box;position:absolute;border:2px solid var(--ako-neutral-color-900, #686868);background:#fff;border-radius:50%;cursor:pointer;z-index:1}:host(:not([noclose])) #close-icon svg{fill:var(--ako-neutral-color-900, #686868);stroke:var(--ako-neutral-color-900, #686868);width:.75rem;height:auto;stroke-width:1.4}#content{width:100%;display:flex;align-self:center;flex-direction:column;margin-left:1.75rem;overflow:hidden}#notification-title{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}#notification-message{margin-top:.5rem}</style><div id="notification">\r\n <div id="close-icon">\r\n <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 17 17">\r\n <path d="M8.412 6.883L14.588.707a1 1 0 0 1 1.414 0l.116.115a1 1 0 0 1 0 1.415L9.942 8.412l6.176 6.176a1 1 0 0 1 0 1.414l-.116.116a1 1 0 0 1-1.414 0L8.412 9.942l-6.175 6.176a1 1 0 0 1-1.415 0l-.115-.116a1 1 0 0 1 0-1.414l6.176-6.176L.707 2.237a1 1 0 0 1 0-1.415L.822.707a1 1 0 0 1 1.415 0l6.175 6.176z"/>\r\n </svg>\r\n </div>\r\n <div id="card-image-placeholder"></div>\r\n <img id="notification-image" alt="Image"></img>\r\n <div id="content">\r\n <div id="notification-title"></div>\r\n <div id="notification-message"></div>\r\n </div>\r\n</div>';class t extends HTMLElement{static get observedAttributes(){return["image","title","message","noclose"]}constructor(){super(),this.attachShadow({mode:"open"}).appendChild(e.content.cloneNode(!0)),this._notificationElement=this.shadowRoot.querySelector("#notification"),this._closeIconElement=this.shadowRoot.querySelector("#close-icon"),this._imageElement=this.shadowRoot.querySelector("#notification-image"),this._imagePlaceholderElement=this.shadowRoot.querySelector("#card-image-placeholder"),this._notificationTitleElement=this.shadowRoot.querySelector("#notification-title"),this._notificationMessageElement=this.shadowRoot.querySelector("#notification-message"),this._closeIconElement.addEventListener("click",this._closeClickHandler.bind(this))}attributeChangedCallback(e,t,o){"image"===e&&this._updateImage(o),"title"===e&&this._updateTitleText(o),"message"===e&&this._updateMesageText(o)}_updateTitleText(e){const t=this._notificationTitleElement;t.innerHTML="",e&&t.appendChild(document.createTextNode(e))}_updateMesageText(e){const t=this._notificationMessageElement;t.innerHTML="",e&&t.appendChild(document.createTextNode(e))}_isValidUrl(e){try{return Boolean(new URL(e))}catch(e){return!1}}_closeClickHandler(){this._notificationElement&&this._notificationElement.remove()}_updateImage(e){this._imageElement.style.removeProperty("display"),this._imagePlaceholderElement.style.display="none",this._imagePlaceholderElement.innerHTML="",e?this._isValidUrl(e)?(this._imageElement.setAttribute("src",e),this._imageElement.style.display="block"):(this._imagePlaceholderElement.appendChild(document.createTextNode(e.substring(0,2).toUpperCase())),this._imagePlaceholderElement.style.removeProperty("display")):this._imagePlaceholderElement.style.removeProperty("display")}}window.customElements.define("ako-notification",t)}if("undefined"!=typeof document&&"undefined"!=typeof window){const e=document.createElement("template");e.innerHTML='<style>#tab-title{font-family:var(--ako-font-family-body, --ako-font-family-heading, trade-gothic-next-soft-round, sans-serif);font-style:normal;font-stretch:normal;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:var(--ako-neutral-color-900, #686868);font-weight:700;font-size:2.5rem;line-height:2.5rem;text-transform:uppercase}button{font-family:var(--ako-font-family-body, --ako-font-family-heading, trade-gothic-next-soft-round, sans-serif);font-style:normal;font-stretch:normal;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:var(--ako-neutral-color-900, #686868);font-weight:700;font-size:1rem;line-height:1.25rem}@media screen and (max-width: 768px){button{font-size:1rem;line-height:1.25rem}}:host(:not([title])) #tab-title{display:none}:host(:not([icon])) #icon{display:none}button{--color-dark: var(--ako-neutral-color-1000, #535353);--color-standard: var(--ako-neutral-color-900, #686868);--color-light: var(--ako-neutral-color-100, #e1e1e1);--with-color: #ffffff;color:var(--color-standard);background:var(--color-light);box-shadow:none;cursor:pointer;width:100%;height:6.75rem;min-height:6.75rem;border:none;outline:none}#tab{display:block;align-items:center;justify-content:center;flex-direction:column}#tab-title{display:block;margin-bottom:.5rem;color:var(--ako-neutral-color-900, #686868);justify-content:center;height:60%;align-items:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#icon{height:2.375rem;min-height:2.375rem;margin-bottom:.25rem;filter:brightness(0.75)}#subtitle{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host([active]) button{--color-dark: var(--ako-primary-color-1000, #7aa329);--color-standard: var(--ako-primary-color-900, #96c933);--color-light: var(--ako-primary-color-600, #b6d970);--with-color: #ffffff;color:var(--with-color);background:linear-gradient(to bottom, var(--color-light), var(--color-standard));box-shadow:0 1.25rem 1.25rem -1.125rem var(--color-dark);border-radius:var(--ako-component-border-radius, 0.2rem)}:host([active]) button:hover,:host([active]) button:active{background-color:var(--color-light)}:host([active]) button #icon{filter:brightness(1.9)}:host([active]) button #tab-title{color:var(--with-color)}</style><button>\r\n <div id="tab">\r\n <img alt="Icon" id="icon"></img>\r\n <div id="tab-title"></div>\r\n <div id="subtitle">\r\n <slot></slot>\r\n </div>\r\n </div>\r\n</button>';class t extends HTMLElement{static get observedAttributes(){return["icon","title","active"]}constructor(){super(),this.attachShadow({mode:"open"}).appendChild(e.content.cloneNode(!0)),this._tabElement=this.shadowRoot.querySelector("#tab"),this._iconElement=this.shadowRoot.querySelector("#icon"),this._tabTitleElement=this.shadowRoot.querySelector("#tab-title"),this._buttonElement=this.shadowRoot.querySelector("button")}attributeChangedCallback(e,t,o){"title"===e&&this._updateTabTitleText(o),"icon"===e&&this._updateIcon(o)}_updateTabTitleText(e){this._tabTitleElement.style.removeProperty("display"),this._tabTitleElement.style.removeProperty("hidden"),this._tabTitleElement.innerHTML="",e&&!this.hasAttribute("icon")?(this._iconElement.style.display="none",this._iconElement.setAttribute("hidden","hidden"),this._tabTitleElement.appendChild(document.createTextNode(e)),this._tabTitleElement.style.display="block"):(this._tabTitleElement.style.display="none",this._tabTitleElement.setAttribute("hidden","hidden"))}_updateIcon(e){this._iconElement.style.removeProperty("display"),this._iconElement.style.removeProperty("hidden"),e&&!this.hasAttribute("title")?(this._tabTitleElement.style.display="none",this._tabTitleElement.setAttribute("hidden","hidden"),this._iconElement.setAttribute("src",e)):(this._iconElement.style.display="none",this._iconElement.setAttribute("hidden","hidden"))}}window.customElements.define("ako-tabbutton",t)}if("undefined"!=typeof document&&"undefined"!=typeof window){const e=document.createElement("template");e.innerHTML='<style>#card-image-placeholder{font-family:var(--ako-font-family-body, --ako-font-family-heading, trade-gothic-next-soft-round, sans-serif);font-style:normal;font-stretch:normal;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:var(--ako-neutral-color-900, #686868);font-weight:700;font-size:1.75rem;line-height:2.125rem}@media screen and (max-width: 768px){#card-image-placeholder{font-size:1.5rem;line-height:1.75rem}}#card-title{font-family:var(--ako-font-family-body, --ako-font-family-heading, trade-gothic-next-soft-round, sans-serif);font-style:normal;font-stretch:normal;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:var(--ako-neutral-color-900, #686868);font-weight:700;font-size:1.375rem;line-height:1.875rem}@media screen and (max-width: 768px){#card-title{font-size:1.375rem;line-height:1.5rem}}#card-subtitle{font-family:var(--ako-font-family-body, --ako-font-family-heading, trade-gothic-next-soft-round, sans-serif);font-style:normal;font-stretch:normal;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:var(--ako-neutral-color-900, #686868);font-weight:400;font-size:1rem;line-height:1.5rem}@media screen and (max-width: 768px){#card-subtitle{font-size:1rem;line-height:1.5rem}}#card{display:flex;align-items:center;flex-direction:column;text-align:center}#card-image{display:none;min-width:6.75rem;min-height:6.75rem;width:6.75rem;height:6.75rem;margin-bottom:1rem;border-radius:50%}#card-image-placeholder{display:flex;color:#fff;background:var(--ako-primary-color-900, #96c933);align-items:center;justify-content:center;min-width:6.75rem;min-height:6.75rem;width:6.75rem;height:6.75rem;margin-bottom:1rem;border-radius:50%}#content{width:100%;display:flex;flex-direction:column;overflow:hidden}#card-title{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}#card-subtitle{margin-bottom:1rem;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host([direction=horizontal]) #content{margin-left:1.75rem;margin-top:1rem}:host([direction=horizontal]) #card{justify-content:left;flex-direction:row;align-items:start;text-align:left}:host([direction=horizontal]) #card-image{margin-bottom:0}</style><div id="card">\n <div id="card-image-placeholder"></div>\n <img id="card-image" alt=""></img>\n <div id="content">\n <div id="card-title"></div>\n <div id="card-subtitle"></div>\n <slot></slot>\n </div>\n</div>';class t extends HTMLElement{static get observedAttributes(){return["image","title","subtitle","direction"]}constructor(){super(),this.attachShadow({mode:"open"}).appendChild(e.content.cloneNode(!0)),this._imageElement=this.shadowRoot.querySelector("#card-image"),this._imagePlaceholderElement=this.shadowRoot.querySelector("#card-image-placeholder"),this._cardTitleElement=this.shadowRoot.querySelector("#card-title"),this._cardSubtitleElement=this.shadowRoot.querySelector("#card-subtitle")}attributeChangedCallback(e,t,o){"title"===e&&this._updateTitleText(o),"subtitle"===e&&this._updateSubtitleText(o),"image"===e&&this._updateImage(o)}_updateTitleText(e){const t=this._cardTitleElement;t.innerHTML="",e&&t.appendChild(document.createTextNode(e))}_updateSubtitleText(e){const t=this._cardSubtitleElement;t.innerHTML="",e&&t.appendChild(document.createTextNode(e))}_isValidUrl(e){try{return Boolean(new URL(e))}catch(e){return!1}}_updateImage(e){this._imageElement.style.removeProperty("display"),this._imagePlaceholderElement.style.display="none",this._imagePlaceholderElement.innerHTML="",e?this._isValidUrl(e)?(this._imageElement.setAttribute("src",e),this._imageElement.style.display="block"):(this._imagePlaceholderElement.appendChild(document.createTextNode(e.substring(0,2).toUpperCase())),this._imagePlaceholderElement.style.removeProperty("display")):this._imagePlaceholderElement.style.removeProperty("display")}}window.customElements.define("ako-card",t)}if("undefined"!=typeof document&&"undefined"!=typeof window){const e=document.createElement("template");e.innerHTML='<style>#list-item{font-family:var(--ako-font-family-body, --ako-font-family-heading, trade-gothic-next-soft-round, sans-serif);font-style:normal;font-stretch:normal;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:var(--ako-neutral-color-900, #686868);font-weight:400;font-size:1.25rem;line-height:1.75rem}@media screen and (max-width: 768px){#list-item{font-size:1.25rem;line-height:1.75rem}}#list-item{display:flex;align-items:center}#icon-1{object-fit:contain;pointer-events:none;margin-right:.5rem}#icon-1 #svg-checked{display:none}#icon-1 #svg-unchecked{display:block}:host([checked]) #icon-1 #svg-checked{display:block}:host([checked]) #icon-1 #svg-unchecked{display:none}#list-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#icon-2{min-width:1rem;min-height:1rem;width:1rem;transform:rotate(90deg);fill:var(--ako-neutral-color-900, #686868)}svg :is(path,rect){stroke:var(--ako-neutral-color-900, #686868)}</style><div id="list-item">\r\n <div id="icon-1">\r\n <svg id="svg-unchecked" width="18" height="18" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">\r\n <rect x="0.75" y="0.75" width="14.5" height="14.5" rx="1.25" stroke="#777777" stroke-width="1.5"/>\r\n </svg>\r\n <svg id="svg-checked" width="18" height="18" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">\r\n <path d="M4.20618 8.24741L6.49999 10.5L11.4639 5.36081" stroke="#777777" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>\r\n <rect x="0.75" y="0.75" width="14.5" height="14.5" rx="1.25" stroke="#777777" stroke-width="1.5"/>\r\n </svg>\r\n </div>\r\n <div id="list-text">\r\n <slot></slot>\r\n </div> \r\n <div id="icon-2">\r\n <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 14 8">\r\n <path fill-rule="evenodd" d="M.7 7.333A.92.92 0 0 1 .7 6L6.31.657a1 1 0 0 1 1.38 0L13.3 6a.92.92 0 0 1 0 1.333 1.019 1.019 0 0 1-1.403.003L7 2.708 2.103 7.336A1.019 1.019 0 0 1 .7 7.333z"/>\r\n </svg> \r\n </div>\r\n</div>';class t extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"}).appendChild(e.content.cloneNode(!0))}}window.customElements.define("ako-checklist-item",t)}if("undefined"!=typeof document&&"undefined"!=typeof window){const t=document.createElement("template");t.innerHTML='<style>#main{font-family:var(--ako-font-family-body, --ako-font-family-heading, trade-gothic-next-soft-round, sans-serif);font-style:normal;font-stretch:normal;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:var(--ako-neutral-color-900, #686868);font-weight:700;font-size:1.25rem;line-height:1.5rem}@media screen and (max-width: 768px){#main{font-size:1.25rem;line-height:1.5rem}}#list-item{display:flex;align-items:center;justify-content:left}#icon{min-width:1.625rem;min-height:1.625rem;width:1.625rem;height:1.625rem;object-fit:contain;pointer-events:none;margin-right:.6875rem}#list-text{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}#list-connector{content:"";width:.125rem;height:.375rem;margin:.125rem auto .125rem .75rem;background:var(--ako-neutral-color-900, #686868);left:1.3rem;top:2.3rem}:host(:is(:last-of-type)) #list-connector{display:none}:host([type=neutral]) #icon{filter:brightness(0.4)}:host([type=error]) #list-item{color:var(--ako-error-color-900, #f52c00)}:host([type=error]) #list-connector{background:var(--ako-error-color-900, #f52c00)}:host([type=success]) #list-item{color:var(--ako-primary-color-900, #96c933)}:host([type=success]) #list-connector{background:var(--ako-primary-color-900, #96c933)}:host([type=warning]) #icon{filter:brightness(0.4)}:host([type=warning]) #list-item{color:var(--ako-warning-color-900, #f5bb00)}:host([type=warning]) #list-connector{background:var(--ako-neutral-color-900, #686868)}:host([type=pending]) #icon{filter:brightness(0.8)}:host([type=pending]) #list-item{color:var(--ako-neutral-color-200, #d2d2d2)}:host([type=pending]) #list-connector{background:var(--ako-neutral-color-200, #d2d2d2)}</style><div id="main">\r\n <div id="list-item">\r\n <img id="icon" alt="Icon"></img>\r\n <div id="list-text">\r\n <slot></slot>\r\n </div> \r\n </div>\r\n <div id="list-connector"></div> \r\n</div>';class o extends HTMLElement{static get observedAttributes(){return["type"]}constructor(){super(),this.attachShadow({mode:"open"}).appendChild(t.content.cloneNode(!0)),this._listItemElement=this.shadowRoot.querySelector("#list-item"),this._iconItemElement=this.shadowRoot.querySelector("#icon")}attributeChangedCallback(){this._render()}_render(){switch(this.hasAttribute("type")?this.getAttribute("type").toLowerCase():""){case"neutral":case"pending":case"warning":default:this._iconItemElement.setAttribute("src",e);break;case"success":this._iconItemElement.setAttribute("src","data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMiIgaGVpZ2h0PSIyMiIgdmlld0JveD0iMCAwIDIyIDIyIj4KICAgIDxnIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICAgICAgPGc+CiAgICAgICAgICAgIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMDMzLjAwMDAwMCwgLTY5OS4wMDAwMDApIHRyYW5zbGF0ZSgyMDM0LjAwMDAwMCwgNzAwLjAwMDAwMCkiPgogICAgICAgICAgICAgICAgPGNpcmNsZSBjeD0iMTAiIGN5PSIxMCIgcj0iMTAiIGZpbGwtcnVsZT0ibm9uemVybyIgc3Ryb2tlPSIjOTZDOTMzIiBzdHJva2Utd2lkdGg9IjIiLz4KICAgICAgICAgICAgICAgIDxwYXRoIGZpbGw9IiM5NkM5MzMiIGQ9Ik01Ljk4IDkuNDM5Yy0uMTc3LjE3NS0uMjY2LjM4OS0uMjY2LjY0cy4wODkuNDY1LjI2NS42NGwyLjY2NyAyLjU4OWMuMTc3LjE3Ni4zOTYuMjYzLjY1OC4yNjMuMjU0IDAgLjQ3LS4wODcuNjQ3LS4yNjNsNS40ODgtNS4zNDVjLjE4My0uMTc2LjI3NS0uMzg5LjI3NS0uNjM4IDAtLjI1LS4wOTItLjQ2LS4yNzUtLjYzMy0uMTg0LS4xNzYtLjQwMy0uMjYzLS42NTUtLjI2My0uMjUzIDAtLjQ3MS4wODctLjY1NS4yNjNMOS4zMDQgMTEuNCA3LjI4OSA5LjQzOWMtLjE4NC0uMTc2LS40MDItLjI2NC0uNjU1LS4yNjRzLS40Ny4wODgtLjY1NS4yNjR6Ii8+CiAgICAgICAgICAgIDwvZz4KICAgICAgICA8L2c+CiAgICA8L2c+Cjwvc3ZnPgo=");break;case"error":this._iconItemElement.setAttribute("src","data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMiIgaGVpZ2h0PSIyMiIgdmlld0JveD0iMCAwIDIyIDIyIj4KICAgIDxnIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICAgICAgPGc+CiAgICAgICAgICAgIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMDMzLjAwMDAwMCwgLTc2OS4wMDAwMDApIHRyYW5zbGF0ZSgyMDM0LjAwMDAwMCwgNzcwLjAwMDAwMCkiPgogI