@khipu/design-system 0.3.5-alpha.2 → 0.3.5-alpha.21

package/dist/beercss/khipu-beercss.min.js

@@ -1 +1 @@
-const _emptyNodeList=[],_weakElements=new WeakSet,isChrome=navigator.userAgent.includes("Chrome");navigator.userAgent.includes("Firefox"),navigator.userAgent.includes("Safari"),navigator.userAgent.includes("Windows");const isMac=navigator.userAgent.includes("Macintosh");navigator.userAgent.includes("Linux"),navigator.userAgent.includes("Android");const isIOS=/iPad|iPhone|iPod/.test(navigator.userAgent);function isDark(){return null==window?void 0:window.matchMedia("(prefers-color-scheme: dark)").matches}async function wait(e){await new Promise(t=>setTimeout(t,e))}function guid(){return"fxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g,e=>{const t=16*Math.random()|0;return("x"===e?t:3&t|8).toString(16)})}function query(e,t){try{return"string"==typeof e?(t??document).querySelector(e):e}catch{return null}}function queryAll(e,t){try{return"string"==typeof e?(t??document).querySelectorAll(e):e??_emptyNodeList}catch{return _emptyNodeList}}function hasClass(e,t){return(null==e?void 0:e.classList.contains(t))??!1}function hasTag(e,t){var n;return(null==(n=null==e?void 0:e.tagName)?void 0:n.toLowerCase())===t}function hasType(e,t){var n;return(null==(n=null==e?void 0:e.type)?void 0:n.toLowerCase())===t}function addClass(e,t){if(e instanceof NodeList)for(let n=0;n<e.length;n++)e[n].classList.add(t);else null==e||e.classList.add(t)}function removeClass(e,t){if(e instanceof NodeList)for(let n=0;n<e.length;n++)e[n].classList.remove(t);else null==e||e.classList.remove(t)}function on(e,t,n,a=!0){(null==e?void 0:e.addEventListener)&&e.addEventListener(t,n,a)}function onWeak(e,t,n,a=!0){addWeakElement(e),on(e,t,n,a)}function off(e,t,n,a=!0){(null==e?void 0:e.removeEventListener)&&e.removeEventListener(t,n,a)}function insertBefore(e,t){var n;null==(n=null==t?void 0:t.parentNode)||n.insertBefore(e,t)}function prev(e){return null==e?void 0:e.previousElementSibling}function next(e){return null==e?void 0:e.nextElementSibling}function parent(e){return null==e?void 0:e.parentElement}function create(e){const t=document.createElement("div");for(let n=0,a=Object.keys(e),o=a.length;n<o;n++){const o=a[n],i=e[o];t.setAttribute(o,i)}return t}function blurActiveElement(){var e;null==(e=document.activeElement)||e.blur()}function queryAllDataUi(e){return queryAll('[data-ui="#'+e+'"]')}function queryDataUi(e){return query('[data-ui="#'+e+'"]')}function updateAllClickable(e){e.id&&hasClass(e,"page")&&(e=queryDataUi(e.id)??e);const t=parent(e);if(!hasClass(t,"tabs")&&!hasClass(t,"tabbed")&&!hasTag(t,"nav"))return;const n=queryAll("a",t);for(let e=0;e<n.length;e++)removeClass(n[e],"active");hasTag(e,"button")||hasClass(e,"button")||hasClass(e,"chip")||addClass(e,"active")}function addWeakElement(e){_weakElements.has(e)||_weakElements.add(e)}function rootSizeInPixels(){const e=getComputedStyle(document.documentElement).getPropertyValue("--size")||"16px";return e.includes("%")?16*parseInt(e)/100:e.includes("em")?16*parseInt(e):parseInt(e)}function updatePlaceholder(e){e.placeholder||(e.placeholder=" ")}function onClickLabel(e){const t=query("input:not([type=file], [type=checkbox], [type=radio]), select, textarea",parent(e.currentTarget));t&&t.focus()}function onFocusInput(e){updateInput(e.currentTarget)}function onBlurInput(e){updateInput(e.currentTarget)}function onChangeFile(e){updateFile(e.currentTarget)}function onChangeColor(e){updateColor(e.currentTarget)}function onKeydownFile(e){updateFile(e.currentTarget,e)}function onKeydownColor(e){updateColor(e.currentTarget,e)}function onPasswordIconClick(e){var t;const n=e.currentTarget,a=query("input",parent(n));a&&(null==(t=n.textContent)?void 0:t.includes("visibility"))&&("password"===a.type?(a.type="text",n.textContent="visibility_off"):(a.type="password",n.textContent="visibility"))}function onInputTextarea(e){updateTextarea(e.currentTarget)}function updateAllLabels(){const e=queryAll(".field > label");for(let t=0;t<e.length;t++)onWeak(e[t],"click",onClickLabel)}function updateAllInputs(){const e=queryAll(".field > input:not([type=file], [type=color], [type=range])");for(let t=0;t<e.length;t++)onWeak(e[t],"focus",onFocusInput),onWeak(e[t],"blur",onBlurInput),updateInput(e[t])}function updateAllSelects(){const e=queryAll(".field > select");for(let t=0;t<e.length;t++)onWeak(e[t],"focus",onFocusInput),onWeak(e[t],"blur",onBlurInput)}function updateAllFiles(){const e=queryAll(".field > input[type=file]");for(let t=0;t<e.length;t++)onWeak(e[t],"change",onChangeFile),updateFile(e[t])}function updateAllColors(){const e=queryAll(".field > input[type=color]");for(let t=0;t<e.length;t++)onWeak(e[t],"change",onChangeColor),updateColor(e[t])}function updateAllTextareas(){const e=queryAll(".field > textarea");for(let t=0;t<e.length;t++)onWeak(e[t],"focus",onFocusInput),onWeak(e[t],"blur",onBlurInput),updatePlaceholder(e[t]),(!isChrome||isMac||isIOS)&&(onWeak(e[t],"input",onInputTextarea),updateTextarea(e[t]))}function updateAllPasswordIcons(){const e=queryAll(".field:has(> input[type=password]) > i, a");for(let t=0;t<e.length;t++)onWeak(e[t],"click",onPasswordIconClick)}function updateInput(e){hasType(e,"number")&&!e.value&&(e.value=""),updatePlaceholder(e)}function updateFile(e,t){if("Enter"===(null==t?void 0:t.key)){const t=prev(e);if(!hasType(t,"file"))return;return void t.click()}const n=next(e);hasType(n,"text")&&(n.value=e.files?Array.from(e.files).map(e=>e.name).join(", "):"",n.readOnly=!0,onWeak(n,"keydown",onKeydownFile,!1),updateInput(n))}function updateColor(e,t){if("Enter"===(null==t?void 0:t.key)){const t=prev(e);if(!hasType(t,"color"))return;return void t.click()}const n=next(e);hasType(n,"text")&&(n.readOnly=!0,n.value=e.value,onWeak(n,"keydown",onKeydownColor,!1),updateInput(n))}function updateTextarea(e){if(updatePlaceholder(e),e.hasAttribute("rows"))return;const t=rootSizeInPixels();e.style.blockSize="auto",e.style.blockSize=e.scrollHeight-t+"px"}function updateAllFields(){updateAllLabels(),updateAllInputs(),updateAllSelects(),updateAllFiles(),updateAllColors(),updateAllTextareas(),updateAllPasswordIcons()}function onInputDocument$1(e){const t=e.target;(hasTag(t,"input")||hasTag(t,"select"))&&("range"===t.type?(t.focus(),updateRange(t)):updateAllRanges())}function onChangeInput(e){if(!window.matchMedia("(pointer: coarse)").matches)return;e.target.blur()}function updateAllRanges(){const e=document.body,t=queryAll(".slider > input[type=range]");t.length?on(e,"input",onInputDocument$1,!1):off(e,"input",onInputDocument$1,!1);for(let e=0;e<t.length;e++)updateRange(t[e])}function updateRange(e){onWeak(e,"change",onChangeInput);const t=parent(e),n=query("span",t),a=queryAll("input",t);if(!a.length||!n)return;const o=rootSizeInPixels(),i=hasClass(t,"max")?0:.25*o*100/a[0].offsetWidth,r=[],s=[];for(let e=0,t=a.length;e<t;e++){const t=parseFloat(a[e].min)||0,n=parseFloat(a[e].max)||100,o=parseFloat(a[e].value)||0,l=100*(o-t)/(n-t),c=i/2-i*l/100;r.push(l+c),s.push(o)}let l=r[0],c=0,u=100-c-l,d=s[0],p=s[1]||0;a.length>1&&(l=Math.abs(r[1]-r[0]),c=r[1]>r[0]?r[0]:r[1],u=100-c-l,p>d&&(d=s[1]||0,p=s[0])),requestAnimationFrame(()=>t.style.cssText=`--_start: ${c}%; --_end: ${u}%; --_value1: '${d}'; --_value2: '${p}';`)}function updateAllSliders(){updateAllRanges()}const _lastTheme={light:"",dark:""};function getMode(){var e;return(null==(e=null==document?void 0:document.body)?void 0:e.classList.contains("dark"))?"dark":"light"}function lastTheme(){if(_lastTheme.light&&_lastTheme.dark)return _lastTheme;const e=document.body,t=document.createElement("body");t.className="light",e.appendChild(t);const n=document.createElement("body");n.className="dark",e.appendChild(n);const a=getComputedStyle(t),o=getComputedStyle(n),i=["--primary","--on-primary","--primary-container","--on-primary-container","--secondary","--on-secondary","--secondary-container","--on-secondary-container","--tertiary","--on-tertiary","--tertiary-container","--on-tertiary-container","--error","--on-error","--error-container","--on-error-container","--background","--on-background","--surface","--on-surface","--surface-variant","--on-surface-variant","--outline","--outline-variant","--shadow","--scrim","--inverse-surface","--inverse-on-surface","--inverse-primary","--surface-dim","--surface-bright","--surface-container-lowest","--surface-container-low","--surface-container","--surface-container-high","--surface-container-highest"];for(let e=0,t=i.length;e<t;e++)_lastTheme.light+=i[e]+":"+a.getPropertyValue(i[e])+";",_lastTheme.dark+=i[e]+":"+o.getPropertyValue(i[e])+";";return e.removeChild(t),e.removeChild(n),_lastTheme}async function updateTheme(e){const t=globalThis,n=document.body;return e&&t.materialDynamicColors?e.light&&e.dark?(_lastTheme.light=e.light,_lastTheme.dark=e.dark,n.setAttribute("style",e[getMode()]),e):t.materialDynamicColors(e).then(e=>{const t=e=>{let t="";for(let n=0,a=Object.keys(e),o=a.length;n<o;n++){const o=a[n],i=e[o];t+="--"+o.replace(/([a-z0-9]|(?=[A-Z]))([A-Z])/g,"$1-$2").toLowerCase()+":"+i+";"}return t};return _lastTheme.light=t(e.light),_lastTheme.dark=t(e.dark),n.setAttribute("style",_lastTheme[getMode()]),_lastTheme}):lastTheme()}function updateMode(e){const t=globalThis,n=document.body;if(!n)return e;if(!e)return getMode();"auto"===e&&(e=isDark()?"dark":"light"),n.classList.remove("light","dark"),n.classList.add(e);const a="light"===e?_lastTheme.light:_lastTheme.dark;return t.materialDynamicColors&&n.setAttribute("style",a),getMode()}const _dialogs=[];function onKeydownDialog(e){if("Escape"===e.key){const t=e.currentTarget;updateDialog(t,t)}}function focusOnDialogOrElement(e){(query("[autofocus]",e)??e).focus()}function closeDialog(e,t){removeClass(queryAllDataUi(e.id),"active"),removeClass(e,"active"),removeClass(t,"active"),e.close(),_dialogs.pop();const n=_dialogs[_dialogs.length-1];n&&n.focus()}async function openDialog(e,t,n,a){hasTag(a,"button")||hasClass(a,"button")||hasClass(a,"chip")||addClass(a,"active"),addClass(t,"active"),addClass(e,"active"),n?e.showModal():e.show(),await wait(90),n||on(e,"keydown",onKeydownDialog,!1),_dialogs.push(e),focusOnDialogOrElement(e)}function onClickOverlay(e){const t=e.currentTarget,n=next(t);hasTag(n,"dialog")&&closeDialog(n,t)}async function updateDialog(e,t){blurActiveElement();let n=prev(t);const a=hasClass(t,"active")||t.open,o=hasClass(t,"modal");o||off(t,"keydown",onKeydownDialog,!1),hasClass(n,"overlay")||(n=create({class:"overlay"}),insertBefore(n,t),await wait(90)),o||onWeak(n,"click",onClickOverlay,!1),a?closeDialog(t,n):openDialog(t,n,o,e)}let _timeoutMenu,_timeoutSnackbar;function onClickDocument(e){off(document.body,"click",onClickDocument);const t=e.target,n=queryAll("menu.active");for(let a=0;a<n.length;a++)updateMenu(t,n[a],e)}function focusOnMenuOrInput(e){setTimeout(()=>{const t=query(".field > input",e);t?t.focus():e.focus()},90)}function updateMenu(e,t,n){_timeoutMenu&&clearTimeout(_timeoutMenu),_timeoutMenu=setTimeout(()=>{on(document.body,"click",onClickDocument),hasTag(document.activeElement,"input")||blurActiveElement();const a=hasClass(t,"active"),o=(null==n?void 0:n.target)===e,i=!!e.closest("menu");!a&&i||a&&o?removeClass(t,"active"):(removeClass(queryAll("menu.active"),"active"),addClass(t,"active"),focusOnMenuOrInput(t))},90)}function onClickSnackbar(e){removeClass(e.currentTarget,"active"),_timeoutSnackbar&&clearTimeout(_timeoutSnackbar)}function updateSnackbar(e,t){blurActiveElement();const n=queryAll(".snackbar.active");for(let e=0;e<n.length;e++)removeClass(n[e],"active");addClass(e,"active"),onWeak(e,"click",onClickSnackbar),_timeoutSnackbar&&clearTimeout(_timeoutSnackbar),-1!==t&&(_timeoutSnackbar=setTimeout(()=>{removeClass(e,"active")},t??6e3))}function updatePage(e){const t=parent(e);t&&removeClass(queryAll(":scope > .page",t),"active"),addClass(e,"active")}function onMousedownRipple(e){updateRipple(e)}function onKeydownRipple(e){" "===(null==e?void 0:e.key)&&updateRipple(e)}function updateRipple(e){const t=e instanceof MouseEvent,n=e.currentTarget,a=n.getBoundingClientRect(),o=Math.max(a.width,a.height),i=o/2,r=t?e.clientX-a.left-i:a.width/2-i,s=t?e.clientY-a.top-i:a.height/2-i,l=document.createElement("div");l.className="ripple-js";const c=document.createElement("div");c.style.inlineSize=c.style.blockSize=`${o}px`,c.style.left=`${r}px`,c.style.top=`${s}px`,onWeak(c,"animationend",()=>{l.remove()}),l.appendChild(c),n.appendChild(l)}function updateAllRipples(){const e=queryAll(".slow-ripple, .ripple, .fast-ripple");for(let t=0;t<e.length;t++)onWeak(e[t],"mousedown",onMousedownRipple),onWeak(e[t],"keydown",onKeydownRipple)}function onInputDocument(e){const t=e.target;hasTag(t,"progress")?updateProgress(t):updateAllProgress()}function updateProgress(e){requestAnimationFrame(()=>{if(e.hasAttribute("value")||e.hasAttribute("max"))e.style.setProperty("--_value",String(e.value));else{const t=hasClass(e,"circle")?"50":"100";e.style.setProperty("--_value",t),e.setAttribute("value",t),e.setAttribute("max","100"),e.classList.add("indeterminate")}})}function updateAllProgress(){if(isChrome&&!isMac&&!isIOS)return;const e=document.body,t=queryAll("progress");t.length?on(e,"input",onInputDocument,!1):off(e,"input",onInputDocument,!1);for(let e=0;e<t.length;e++)updateProgress(t[e])}const _context=globalThis;let _timeoutMutation,_mutation;function onMutation(){_timeoutMutation&&clearTimeout(_timeoutMutation),_timeoutMutation=setTimeout(async()=>await _ui(),180)}async function run(e,t,n,a){if(t||(t=query(e.getAttribute("data-ui"))))if(updateAllClickable(e),hasTag(t,"dialog"))requestAnimationFrame(()=>updateDialog(e,t));else if(hasTag(t,"menu"))requestAnimationFrame(()=>updateMenu(e,t,a));else if(hasClass(t,"snackbar"))requestAnimationFrame(()=>updateSnackbar(t,n));else{if(!hasClass(t,"page"))return hasClass(t,"active")?(removeClass(e,"active"),void removeClass(t,"active")):void addClass(t,"active");requestAnimationFrame(()=>updatePage(t))}else e.classList.toggle("active")}function onClickElement(e){run(e.currentTarget,null,null,e)}function onKeydownElement(e){"Enter"===e.key&&run(e.currentTarget,null,null,e)}function setup(){_context.ui||_mutation||!_context.MutationObserver||(_mutation=new MutationObserver(onMutation),_mutation.observe(document.body,{childList:!0,subtree:!0}),onMutation())}function updateAllDataUis(){const e=queryAll("[data-ui]");for(let t=0,n=e.length;t<n;t++)onWeak(e[t],"click",onClickElement),hasTag(e[t],"a")&&!e[t].getAttribute("href")&&onWeak(e[t],"keydown",onKeydownElement)}function _ui(e,t){if(e){if("setup"===e)return void setup();if("guid"===e)return guid();if("mode"===e)return updateMode(t);if("theme"===e)return updateTheme(t);const n=query(e);if(!n)return;run(n,n,t)}updateAllDataUis(),updateAllFields(),updateAllRipples(),updateAllSliders(),updateAllProgress()}function start(){var e;if(_context.ui)return;const t=null==(e=_context.document)?void 0:e.body;!t||t.classList.contains("dark")||t.classList.contains("light")||updateMode("auto"),setup(),_context.ui=_ui}start();const ui=_context.ui;!function(e){"use strict";const t={init:function(e={}){const t={sidebarSelector:e.sidebarSelector||".kds-sidebar"},n=document.querySelector(t.sidebarSelector);n?(!function(e){if(!e)return;const t=e.querySelector(".kds-sidebar-header"),n=e.querySelector(".kds-sidebar-header-dropdown");if(!t||!n)return;t.addEventListener("click",function(e){e.stopPropagation(),n.classList.toggle("kds-dropdown-open");const a=t.querySelector(".kds-sidebar-dropdown-icon");a&&(a.style.transform=n.classList.contains("kds-dropdown-open")?"rotate(180deg)":"rotate(0deg)")}),document.addEventListener("click",function(a){if(!e.contains(a.target)){n.classList.remove("kds-dropdown-open");const e=t.querySelector(".kds-sidebar-dropdown-icon");e&&(e.style.transform="rotate(0deg)")}}),n.querySelectorAll("a").forEach(e=>{e.addEventListener("click",function(){n.classList.remove("kds-dropdown-open");const e=t.querySelector(".kds-sidebar-dropdown-icon");e&&(e.style.transform="rotate(0deg)")})})}(n),function(e){if(!e)return;const t=e.querySelectorAll(".kds-sidebar-nav-item");t.forEach(n=>{n.addEventListener("click",function(n){"#"===this.getAttribute("href")&&n.preventDefault(),t.forEach(e=>{e.classList.remove("active")}),this.classList.add("active");const a=new CustomEvent("kds-sidebar-nav-change",{detail:{item:this,text:this.querySelector("span")?.textContent||""},bubbles:!0});e.dispatchEvent(a)})})}(n),function(){const e=document.querySelector(".kds-hamburger-btn"),t=document.querySelector(".kds-sidebar-close-btn"),n=document.querySelector(".kds-sidebar");e&&n&&(e.addEventListener("click",function(){n.classList.toggle("kds-sidebar-open")}),t&&t.addEventListener("click",function(){n.classList.remove("kds-sidebar-open")}),document.addEventListener("keydown",function(e){"Escape"===e.key&&n.classList.contains("kds-sidebar-open")&&n.classList.remove("kds-sidebar-open")}))}(),console.log("[Khipu Sidebar] Initialized successfully")):console.warn("[Khipu Sidebar] Sidebar not found with selector:",t.sidebarSelector)}};"function"==typeof define&&define.amd?define(function(){return t}):"object"==typeof module&&module.exports?module.exports=t:e.KhipuSidebar=t}("undefined"!=typeof window?window:this),function(){"use strict";function e(){console.log("Initializing Khipu Material Design components..."),void 0!==window.KhipuSidebar&&window.KhipuSidebar.init(),function(){const e=document.getElementById("menu-toggle"),t=document.getElementById("material-sidenav");e&&t&&(e.addEventListener("click",function(){t.classList.toggle("active")}),document.addEventListener("click",function(n){if(t.classList.contains("active")){t.contains(n.target)||e.contains(n.target)||t.classList.remove("active")}}))}(),document.querySelectorAll('.snackbar[data-auto-dismiss="true"]').forEach(function(e){var t=e.querySelector("span");t&&t.classList.add("max");var a=document.createElement("button");a.className="kds-snackbar-close",a.setAttribute("aria-label","Cerrar"),a.innerHTML='<i class="material-symbols-outlined">close</i>',a.onclick=function(){n(e)},e.appendChild(a),setTimeout(function(){n(e)},5e3)}),window.closeModal=function(e){const t=document.getElementById(e);t&&t.classList.remove("active")},a(),o(),i(),r(),p(),f(),m(),s(),l(),u(),d(),c(),function(e){e=e||document;var t=.72,n=16,a=128,o=.02;function i(e,t){if(e){var i=new Image;i.crossOrigin="anonymous",i.onload=function(){try{var e=document.createElement("canvas");e.width=n,e.height=n;var r=e.getContext("2d");if(!r)return void t(null);r.drawImage(i,0,0,n,n);for(var s=r.getImageData(0,0,n,n).data,l=0,c=0,u=0;u<s.length;u+=4)s[u+3]<a||(l+=(.2126*s[u]+.7152*s[u+1]+.0722*s[u+2])/255,c++);if(c<n*n*o)return void t(null);t(l/c)}catch(e){t(null)}},i.onerror=function(){t(null)},i.src=e}else t(null)}e.querySelectorAll(".kds-invoice-merchant").forEach(function(e){var n=e.querySelector("img");if(n){var a=e.style.background;e.style.background="",e.classList.add("kds-invoice-merchant-neutral"),n.addEventListener("error",function(){e.classList.remove("kds-invoice-merchant-neutral","dark"),e.style.background=a}),i(n.getAttribute("src"),function(n){null!=n&&n>t&&e.classList.contains("kds-invoice-merchant-neutral")&&e.classList.add("dark")})}})}(),t(),console.log("Material Design initialization complete!")}function t(e){e=e||document;if(!("undefined"==typeof ResizeObserver||"function"!=typeof Element.prototype.animate||window.matchMedia&&window.matchMedia("(prefers-reduced-motion: reduce)").matches)){var t=e.querySelectorAll(".kds-screen > .kds-card-elevated");Array.prototype.forEach.call(t,function(e){if("on"!==e.getAttribute("data-kds-height-transition")){e.setAttribute("data-kds-height-transition","on");var t=e.offsetHeight,n=!1,a=new ResizeObserver(function(){if(!n){var a=e.offsetHeight;if(Math.abs(a-t)<8)t=a;else{n=!0;var o=e.animate([{height:t+"px"},{height:a+"px"}],{duration:280,easing:"ease-out"});t=a,o.finished.then(function(){n=!1,t=e.offsetHeight}).catch(function(){n=!1})}}});a.observe(e)}})}}function n(e){e.classList.remove("active"),setTimeout(function(){e.remove()},300)}function a(e){(e=e||document).querySelectorAll(".kds-invoice-sticky").forEach(function(e){if(!e.querySelector(".kds-brand-inner")){var t=e.closest(".kds-screen")||e.parentElement,n=t?t.querySelector(".kds-brand-row"):null,a=n?n.querySelector("svg, img"):null;if(a){var o=e.querySelector(".kds-invoice-header"),i=o?o.firstElementChild:null;if(i){var r=document.createElement("div");r.className="kds-brand-inner",r.appendChild(a.cloneNode(!0)),i.insertBefore(r,i.firstChild)}}}})}function o(e){(e=e||document).querySelectorAll(".kds-screen").forEach(function(e){var t=e.querySelector(".kds-secure-footer");if(t){var n=e.querySelectorAll(".kds-card-elevated:not(.kds-invoice-sticky)");if(n.length){var a=n[n.length-1];t.classList.add("inside"),a.appendChild(t)}}})}function i(e){(e=e||document).addEventListener("click",function(e){var t=e.target.closest("[data-expand-toggle]");if(t){var n="true"===t.getAttribute("aria-expanded");t.setAttribute("aria-expanded",String(!n));var a=t.getAttribute("aria-controls"),o=a?document.getElementById(a):t.parentElement.querySelector("[data-expand-panel]");o&&(n?(o.classList.remove("open"),o.style.maxHeight=""):(o.classList.add("open"),o.style.maxHeight=o.scrollHeight+"px"))}})}function r(e){(e=e||document).addEventListener("click",function(e){var t=e.target.closest(".kds-copy-row[data-copy]");if(t)navigator.clipboard.writeText(t.dataset.copy).then(function(){t.classList.add("copied"),setTimeout(function(){t.classList.remove("copied")},1200)});else{var n=e.target.closest(".kds-copy-all[data-copy-all]");if(n){var a=n.dataset.copyAll,o=a?document.querySelector(a):n.closest(".kds-copy-header").nextElementSibling;if(!o)return;var i=o.querySelectorAll("[data-copy]"),r=[];i.forEach(function(e){r.push(e.dataset.copy)}),navigator.clipboard.writeText(r.join("\n")).then(function(){i.forEach(function(e){e.classList.add("copied"),setTimeout(function(){e.classList.remove("copied")},1200)})})}}})}function s(e){(e=e||document).querySelectorAll(".kds-countdown[data-deadline]").forEach(function(e){var t=new Date(e.dataset.deadline).getTime(),n=e.dataset.serverNow?new Date(e.dataset.serverNow).getTime():Date.now(),a=Date.now()-n,o=e.querySelector("[data-h]"),i=e.querySelector("[data-m]"),r=e.querySelector("[data-s]");function s(e){return e<10?"0"+e:String(e)}function l(){var n=Date.now()-a,l=Math.max(0,t-n),u=Math.floor(l/1e3),d=Math.floor(u/3600),p=Math.floor(u%3600/60),f=u%60;o&&(o.textContent=s(d)),i&&(i.textContent=s(p)),r&&(r.textContent=s(f)),l<3e5&&e.classList.add("urgent"),l<=0&&(clearInterval(c),e.dispatchEvent(new CustomEvent("kds:countdown:expired",{bubbles:!0})))}l();var c=setInterval(l,1e3)})}function l(e){(e=e||document).querySelectorAll(".kds-segmented-tabs").forEach(function(e){var t=e.querySelectorAll("button");e.style.setProperty("--_tab-count",t.length);var n=0;t.forEach(function(e,t){(e.classList.contains("active")||"true"===e.getAttribute("aria-selected"))&&(n=t)}),e.style.setProperty("--_active-idx",n);var a=e.parentElement;a&&a.querySelectorAll("[data-kds-tab-panel]").forEach(function(e,t){e.hidden=t!==n})}),e.addEventListener("click",function(e){var t=e.target.closest(".kds-segmented-tabs button");if(t){var n=t.closest(".kds-segmented-tabs"),a=n.querySelectorAll("button");a.forEach(function(e){e.classList.remove("active"),e.setAttribute("aria-selected","false")}),t.classList.add("active"),t.setAttribute("aria-selected","true");var o=Array.prototype.indexOf.call(a,t);n.style.setProperty("--_active-idx",o);var i=n.parentElement;i&&i.querySelectorAll("[data-kds-tab-panel]").forEach(function(e,t){e.hidden=t!==o}),n.dispatchEvent(new CustomEvent("kds:tab:change",{bubbles:!0,detail:{index:o,button:t}}))}})}function c(e){var t=(e=e||document).querySelector("#bankModal"),n=e.querySelector("#bankSearch"),a=e.querySelector("#bankModalList"),o=e.querySelector("#bankNoResults");function i(e){if(a){var t=e.toLowerCase().trim(),n=a.querySelectorAll(".kds-bank-row"),i=0;n.forEach(function(e){var n=e.querySelector(".kds-bank-row-name");if(n){var a=n.textContent.toLowerCase(),o=!t||-1!==a.indexOf(t);e.style.display=o?"":"none",o&&i++}}),o&&o.classList.toggle("visible",0===i)}}t&&(e.addEventListener("click",function(e){e.target.closest("[data-open-bank-modal]")&&(t.classList.add("open"),n&&(n.value="",n.focus()),i(""))}),e.addEventListener("click",function(e){e.target.closest("[data-close-bank-modal]")&&t.classList.remove("open")}),a&&a.addEventListener("click",function(e){var n=e.target.closest(".kds-bank-row");if(n){var a=n.dataset.bankId||n.dataset.bank||"",o=n.querySelector(".kds-bank-row-name");t.dispatchEvent(new CustomEvent("kds:bank:selected",{bubbles:!0,detail:{id:a,name:o?o.textContent:"",element:n}})),t.classList.remove("open")}}),n&&n.addEventListener("input",function(e){i(e.target.value)}),window.Khipu||(window.Khipu={}),window.Khipu.filterBanks=i)}function u(e){e=e||document;var t=!1;function n(){return window.innerWidth<768}function a(){var a=e.querySelector(".kds-screen.active");if(a&&a.querySelector(".kds-invoice-sticky"))return n()?void(t||(t=!0,requestAnimationFrame(function(){t=!1;var n=e.querySelector(".kds-screen.active");if(n){var a=n.querySelector(".kds-invoice-sticky");if(a){var o=window.scrollY||window.pageYOffset,i=Math.min(Math.max((o-0)/20,0),1);if(!n.style.getPropertyValue("--collapse-collapsible-h")){var r=a.querySelector(".kds-invoice-collapsible");r&&n.style.setProperty("--collapse-collapsible-h",r.offsetHeight+"px")}n.style.setProperty("--collapse-progress",i),a.classList.toggle("is-collapsed",i>=1),i>0&&a.querySelectorAll('[data-expand-toggle][aria-expanded="true"]').forEach(function(e){e.setAttribute("aria-expanded","false");var t=e.getAttribute("aria-controls"),n=t?document.getElementById(t):null;n&&n.classList.remove("open")})}}}))):(a.style.removeProperty("--collapse-progress"),void a.style.removeProperty("--collapse-collapsible-h"))}window.addEventListener("resize",function(){n()||(e.querySelectorAll(".kds-screen").forEach(function(e){e.style.removeProperty("--collapse-progress"),e.style.removeProperty("--collapse-collapsible-h")}),e.querySelectorAll(".kds-invoice-sticky.is-collapsed").forEach(function(e){e.classList.remove("is-collapsed")}))}),window.addEventListener("scroll",a,{passive:!0}),a()}function d(e){var t=(e=e||document).querySelectorAll("[data-hide-on-scroll]");if(t.length){var n=0,a=!1,o=new Map;window.addEventListener("scroll",r,{passive:!0}),window.addEventListener("resize",r),window.addEventListener("message",function(e){e.data&&"VIEWPORT_OFFSET"===e.data.type&&(n=Math.max(0,e.data.offsetTop||0),r())}),i()}function i(){a=!1;var e=Math.max(window.scrollY||window.pageYOffset||0,n);t.forEach(function(t){var n=parseInt(t.getAttribute("data-hide-threshold"),10)||8,a=parseInt(t.getAttribute("data-hide-top-offset"),10)||0,i=t.getAttribute("data-hide-class")||"kds-fab--hidden",r=o.has(t)?o.get(t):e;if(e<=a)return t.classList.remove(i),void o.set(t,e);var s=e-r;Math.abs(s)<n||(t.classList.toggle(i,s>0),o.set(t,e))})}function r(){a||(a=!0,requestAnimationFrame(i))}}function p(e){(e=e||document).addEventListener("click",function(e){var t=e.target.closest(".kds-copyable-table-row[data-copy]");t&&navigator.clipboard.writeText(t.dataset.copy).then(function(){t.classList.add("copied"),setTimeout(function(){t.classList.remove("copied")},1200)})})}function f(e){(e=e||document).addEventListener("click",function(e){var t=e.target.closest(".kds-copy-all-btn[data-copy-all]");if(t){var n=t.dataset.copyAll,a=n?document.querySelector(n):t.previousElementSibling;if(a){var o=a.querySelectorAll(".kds-copyable-table-row[data-copy]"),i=[];o.forEach(function(e){var t=e.querySelector(".kds-key"),n=e.dataset.copy;t?i.push(t.textContent.trim()+": "+n):i.push(n)}),navigator.clipboard.writeText(i.join("\n")).then(function(){t.classList.add("copied");var e=t.querySelector("span:not(.kds-icon)"),n=e?e.textContent:"";e&&(e.textContent="Copiado"),o.forEach(function(e){e.classList.add("copied")}),setTimeout(function(){t.classList.remove("copied"),e&&(e.textContent=n),o.forEach(function(e){e.classList.remove("copied")})},1400)})}}})}function m(e){(e=e||document).querySelectorAll(".kds-info-tip[data-tip]").forEach(function(e){if(!e.querySelector(".kds-tip-bubble")){var t=document.createElement("span");t.className="kds-tip-bubble",t.setAttribute("role","tooltip"),t.textContent=e.dataset.tip,e.appendChild(t)}}),e.addEventListener("click",function(e){var t=e.target.closest(".kds-info-tip");if(t){e.preventDefault(),e.stopPropagation();var n="true"===t.getAttribute("aria-expanded");return document.querySelectorAll('.kds-info-tip[aria-expanded="true"]').forEach(function(e){e.setAttribute("aria-expanded","false")}),void t.setAttribute("aria-expanded",String(!n))}document.querySelectorAll('.kds-info-tip[aria-expanded="true"]').forEach(function(e){e.setAttribute("aria-expanded","false")})})}function v(e,t,a){t=t||"info",a=a||5e3;var o=document.createElement("div");o.className="snackbar active "+t,o.setAttribute("data-auto-dismiss","true"),o.style.setProperty("--kds-snackbar-duration",a+"ms");var i=document.createElement("i");i.className="material-symbols-outlined",i.textContent="success"===t?"check_circle":"error"===t?"error":"info";var r=document.createElement("span");r.className="max",r.textContent=e;var s=document.createElement("button");s.className="kds-snackbar-close",s.setAttribute("aria-label","Cerrar"),s.innerHTML='<i class="material-symbols-outlined">close</i>',s.onclick=function(){n(o)},o.appendChild(i),o.appendChild(r),o.appendChild(s),document.body.appendChild(o),setTimeout(function(){n(o)},a)}"loading"===document.readyState?document.addEventListener("DOMContentLoaded",e):e(),window.Khipu||(window.Khipu={}),window.Khipu.showSnackbar=v,window.Khipu.closeModal=window.closeModal,window.Khipu.initBrandInner=a,window.Khipu.initSecureFooterInside=o,window.Khipu.initExpandToggle=i,window.Khipu.initCopyRow=r,window.Khipu.initCountdown=s,window.Khipu.initSegmentedTabs=l,window.Khipu.initCopyableTable=p,window.Khipu.initCopyAllBtn=f,window.Khipu.initInfoTip=m,window.Khipu.initBankModal=c,window.Khipu.initStickyInvoice=u,window.Khipu.initHideOnScroll=d,window.Khipu.initCardHeightTransition=t,window.showSnackbar=v}();
+const _emptyNodeList=[],_weakElements=new WeakSet,isChrome=navigator.userAgent.includes("Chrome");navigator.userAgent.includes("Firefox"),navigator.userAgent.includes("Safari"),navigator.userAgent.includes("Windows");const isMac=navigator.userAgent.includes("Macintosh");navigator.userAgent.includes("Linux"),navigator.userAgent.includes("Android");const isIOS=/iPad|iPhone|iPod/.test(navigator.userAgent);function isDark(){return null==window?void 0:window.matchMedia("(prefers-color-scheme: dark)").matches}async function wait(e){await new Promise(t=>setTimeout(t,e))}function guid(){return"fxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g,e=>{const t=16*Math.random()|0;return("x"===e?t:3&t|8).toString(16)})}function query(e,t){try{return"string"==typeof e?(t??document).querySelector(e):e}catch{return null}}function queryAll(e,t){try{return"string"==typeof e?(t??document).querySelectorAll(e):e??_emptyNodeList}catch{return _emptyNodeList}}function hasClass(e,t){return(null==e?void 0:e.classList.contains(t))??!1}function hasTag(e,t){var n;return(null==(n=null==e?void 0:e.tagName)?void 0:n.toLowerCase())===t}function hasType(e,t){var n;return(null==(n=null==e?void 0:e.type)?void 0:n.toLowerCase())===t}function addClass(e,t){if(e instanceof NodeList)for(let n=0;n<e.length;n++)e[n].classList.add(t);else null==e||e.classList.add(t)}function removeClass(e,t){if(e instanceof NodeList)for(let n=0;n<e.length;n++)e[n].classList.remove(t);else null==e||e.classList.remove(t)}function on(e,t,n,a=!0){(null==e?void 0:e.addEventListener)&&e.addEventListener(t,n,a)}function onWeak(e,t,n,a=!0){addWeakElement(e),on(e,t,n,a)}function off(e,t,n,a=!0){(null==e?void 0:e.removeEventListener)&&e.removeEventListener(t,n,a)}function insertBefore(e,t){var n;null==(n=null==t?void 0:t.parentNode)||n.insertBefore(e,t)}function prev(e){return null==e?void 0:e.previousElementSibling}function next(e){return null==e?void 0:e.nextElementSibling}function parent(e){return null==e?void 0:e.parentElement}function create(e){const t=document.createElement("div");for(let n=0,a=Object.keys(e),o=a.length;n<o;n++){const o=a[n],i=e[o];t.setAttribute(o,i)}return t}function blurActiveElement(){var e;null==(e=document.activeElement)||e.blur()}function queryAllDataUi(e){return queryAll('[data-ui="#'+e+'"]')}function queryDataUi(e){return query('[data-ui="#'+e+'"]')}function updateAllClickable(e){e.id&&hasClass(e,"page")&&(e=queryDataUi(e.id)??e);const t=parent(e);if(!hasClass(t,"tabs")&&!hasClass(t,"tabbed")&&!hasTag(t,"nav"))return;const n=queryAll("a",t);for(let e=0;e<n.length;e++)removeClass(n[e],"active");hasTag(e,"button")||hasClass(e,"button")||hasClass(e,"chip")||addClass(e,"active")}function addWeakElement(e){_weakElements.has(e)||_weakElements.add(e)}function rootSizeInPixels(){const e=getComputedStyle(document.documentElement).getPropertyValue("--size")||"16px";return e.includes("%")?16*parseInt(e)/100:e.includes("em")?16*parseInt(e):parseInt(e)}function updatePlaceholder(e){e.placeholder||(e.placeholder=" ")}function onClickLabel(e){const t=query("input:not([type=file], [type=checkbox], [type=radio]), select, textarea",parent(e.currentTarget));t&&t.focus()}function onFocusInput(e){updateInput(e.currentTarget)}function onBlurInput(e){updateInput(e.currentTarget)}function onChangeFile(e){updateFile(e.currentTarget)}function onChangeColor(e){updateColor(e.currentTarget)}function onKeydownFile(e){updateFile(e.currentTarget,e)}function onKeydownColor(e){updateColor(e.currentTarget,e)}function onPasswordIconClick(e){var t;const n=e.currentTarget,a=query("input",parent(n));a&&(null==(t=n.textContent)?void 0:t.includes("visibility"))&&("password"===a.type?(a.type="text",n.textContent="visibility_off"):(a.type="password",n.textContent="visibility"))}function onInputTextarea(e){updateTextarea(e.currentTarget)}function updateAllLabels(){const e=queryAll(".field > label");for(let t=0;t<e.length;t++)onWeak(e[t],"click",onClickLabel)}function updateAllInputs(){const e=queryAll(".field > input:not([type=file], [type=color], [type=range])");for(let t=0;t<e.length;t++)onWeak(e[t],"focus",onFocusInput),onWeak(e[t],"blur",onBlurInput),updateInput(e[t])}function updateAllSelects(){const e=queryAll(".field > select");for(let t=0;t<e.length;t++)onWeak(e[t],"focus",onFocusInput),onWeak(e[t],"blur",onBlurInput)}function updateAllFiles(){const e=queryAll(".field > input[type=file]");for(let t=0;t<e.length;t++)onWeak(e[t],"change",onChangeFile),updateFile(e[t])}function updateAllColors(){const e=queryAll(".field > input[type=color]");for(let t=0;t<e.length;t++)onWeak(e[t],"change",onChangeColor),updateColor(e[t])}function updateAllTextareas(){const e=queryAll(".field > textarea");for(let t=0;t<e.length;t++)onWeak(e[t],"focus",onFocusInput),onWeak(e[t],"blur",onBlurInput),updatePlaceholder(e[t]),(!isChrome||isMac||isIOS)&&(onWeak(e[t],"input",onInputTextarea),updateTextarea(e[t]))}function updateAllPasswordIcons(){const e=queryAll(".field:has(> input[type=password]) > i, a");for(let t=0;t<e.length;t++)onWeak(e[t],"click",onPasswordIconClick)}function updateInput(e){hasType(e,"number")&&!e.value&&(e.value=""),updatePlaceholder(e)}function updateFile(e,t){if("Enter"===(null==t?void 0:t.key)){const t=prev(e);if(!hasType(t,"file"))return;return void t.click()}const n=next(e);hasType(n,"text")&&(n.value=e.files?Array.from(e.files).map(e=>e.name).join(", "):"",n.readOnly=!0,onWeak(n,"keydown",onKeydownFile,!1),updateInput(n))}function updateColor(e,t){if("Enter"===(null==t?void 0:t.key)){const t=prev(e);if(!hasType(t,"color"))return;return void t.click()}const n=next(e);hasType(n,"text")&&(n.readOnly=!0,n.value=e.value,onWeak(n,"keydown",onKeydownColor,!1),updateInput(n))}function updateTextarea(e){if(updatePlaceholder(e),e.hasAttribute("rows"))return;const t=rootSizeInPixels();e.style.blockSize="auto",e.style.blockSize=e.scrollHeight-t+"px"}function updateAllFields(){updateAllLabels(),updateAllInputs(),updateAllSelects(),updateAllFiles(),updateAllColors(),updateAllTextareas(),updateAllPasswordIcons()}function onInputDocument$1(e){const t=e.target;(hasTag(t,"input")||hasTag(t,"select"))&&("range"===t.type?(t.focus(),updateRange(t)):updateAllRanges())}function onChangeInput(e){if(!window.matchMedia("(pointer: coarse)").matches)return;e.target.blur()}function updateAllRanges(){const e=document.body,t=queryAll(".slider > input[type=range]");t.length?on(e,"input",onInputDocument$1,!1):off(e,"input",onInputDocument$1,!1);for(let e=0;e<t.length;e++)updateRange(t[e])}function updateRange(e){onWeak(e,"change",onChangeInput);const t=parent(e),n=query("span",t),a=queryAll("input",t);if(!a.length||!n)return;const o=rootSizeInPixels(),i=hasClass(t,"max")?0:.25*o*100/a[0].offsetWidth,r=[],s=[];for(let e=0,t=a.length;e<t;e++){const t=parseFloat(a[e].min)||0,n=parseFloat(a[e].max)||100,o=parseFloat(a[e].value)||0,l=100*(o-t)/(n-t),c=i/2-i*l/100;r.push(l+c),s.push(o)}let l=r[0],c=0,u=100-c-l,d=s[0],p=s[1]||0;a.length>1&&(l=Math.abs(r[1]-r[0]),c=r[1]>r[0]?r[0]:r[1],u=100-c-l,p>d&&(d=s[1]||0,p=s[0])),requestAnimationFrame(()=>t.style.cssText=`--_start: ${c}%; --_end: ${u}%; --_value1: '${d}'; --_value2: '${p}';`)}function updateAllSliders(){updateAllRanges()}const _lastTheme={light:"",dark:""};function getMode(){var e;return(null==(e=null==document?void 0:document.body)?void 0:e.classList.contains("dark"))?"dark":"light"}function lastTheme(){if(_lastTheme.light&&_lastTheme.dark)return _lastTheme;const e=document.body,t=document.createElement("body");t.className="light",e.appendChild(t);const n=document.createElement("body");n.className="dark",e.appendChild(n);const a=getComputedStyle(t),o=getComputedStyle(n),i=["--primary","--on-primary","--primary-container","--on-primary-container","--secondary","--on-secondary","--secondary-container","--on-secondary-container","--tertiary","--on-tertiary","--tertiary-container","--on-tertiary-container","--error","--on-error","--error-container","--on-error-container","--background","--on-background","--surface","--on-surface","--surface-variant","--on-surface-variant","--outline","--outline-variant","--shadow","--scrim","--inverse-surface","--inverse-on-surface","--inverse-primary","--surface-dim","--surface-bright","--surface-container-lowest","--surface-container-low","--surface-container","--surface-container-high","--surface-container-highest"];for(let e=0,t=i.length;e<t;e++)_lastTheme.light+=i[e]+":"+a.getPropertyValue(i[e])+";",_lastTheme.dark+=i[e]+":"+o.getPropertyValue(i[e])+";";return e.removeChild(t),e.removeChild(n),_lastTheme}async function updateTheme(e){const t=globalThis,n=document.body;return e&&t.materialDynamicColors?e.light&&e.dark?(_lastTheme.light=e.light,_lastTheme.dark=e.dark,n.setAttribute("style",e[getMode()]),e):t.materialDynamicColors(e).then(e=>{const t=e=>{let t="";for(let n=0,a=Object.keys(e),o=a.length;n<o;n++){const o=a[n],i=e[o];t+="--"+o.replace(/([a-z0-9]|(?=[A-Z]))([A-Z])/g,"$1-$2").toLowerCase()+":"+i+";"}return t};return _lastTheme.light=t(e.light),_lastTheme.dark=t(e.dark),n.setAttribute("style",_lastTheme[getMode()]),_lastTheme}):lastTheme()}function updateMode(e){const t=globalThis,n=document.body;if(!n)return e;if(!e)return getMode();"auto"===e&&(e=isDark()?"dark":"light"),n.classList.remove("light","dark"),n.classList.add(e);const a="light"===e?_lastTheme.light:_lastTheme.dark;return t.materialDynamicColors&&n.setAttribute("style",a),getMode()}const _dialogs=[];function onKeydownDialog(e){if("Escape"===e.key){const t=e.currentTarget;updateDialog(t,t)}}function focusOnDialogOrElement(e){(query("[autofocus]",e)??e).focus()}function closeDialog(e,t){removeClass(queryAllDataUi(e.id),"active"),removeClass(e,"active"),removeClass(t,"active"),e.close(),_dialogs.pop();const n=_dialogs[_dialogs.length-1];n&&n.focus()}async function openDialog(e,t,n,a){hasTag(a,"button")||hasClass(a,"button")||hasClass(a,"chip")||addClass(a,"active"),addClass(t,"active"),addClass(e,"active"),n?e.showModal():e.show(),await wait(90),n||on(e,"keydown",onKeydownDialog,!1),_dialogs.push(e),focusOnDialogOrElement(e)}function onClickOverlay(e){const t=e.currentTarget,n=next(t);hasTag(n,"dialog")&&closeDialog(n,t)}async function updateDialog(e,t){blurActiveElement();let n=prev(t);const a=hasClass(t,"active")||t.open,o=hasClass(t,"modal");o||off(t,"keydown",onKeydownDialog,!1),hasClass(n,"overlay")||(n=create({class:"overlay"}),insertBefore(n,t),await wait(90)),o||onWeak(n,"click",onClickOverlay,!1),a?closeDialog(t,n):openDialog(t,n,o,e)}let _timeoutMenu,_timeoutSnackbar;function onClickDocument(e){off(document.body,"click",onClickDocument);const t=e.target,n=queryAll("menu.active");for(let a=0;a<n.length;a++)updateMenu(t,n[a],e)}function focusOnMenuOrInput(e){setTimeout(()=>{const t=query(".field > input",e);t?t.focus():e.focus()},90)}function updateMenu(e,t,n){_timeoutMenu&&clearTimeout(_timeoutMenu),_timeoutMenu=setTimeout(()=>{on(document.body,"click",onClickDocument),hasTag(document.activeElement,"input")||blurActiveElement();const a=hasClass(t,"active"),o=(null==n?void 0:n.target)===e,i=!!e.closest("menu");!a&&i||a&&o?removeClass(t,"active"):(removeClass(queryAll("menu.active"),"active"),addClass(t,"active"),focusOnMenuOrInput(t))},90)}function onClickSnackbar(e){removeClass(e.currentTarget,"active"),_timeoutSnackbar&&clearTimeout(_timeoutSnackbar)}function updateSnackbar(e,t){blurActiveElement();const n=queryAll(".snackbar.active");for(let e=0;e<n.length;e++)removeClass(n[e],"active");addClass(e,"active"),onWeak(e,"click",onClickSnackbar),_timeoutSnackbar&&clearTimeout(_timeoutSnackbar),-1!==t&&(_timeoutSnackbar=setTimeout(()=>{removeClass(e,"active")},t??6e3))}function updatePage(e){const t=parent(e);t&&removeClass(queryAll(":scope > .page",t),"active"),addClass(e,"active")}function onMousedownRipple(e){updateRipple(e)}function onKeydownRipple(e){" "===(null==e?void 0:e.key)&&updateRipple(e)}function updateRipple(e){const t=e instanceof MouseEvent,n=e.currentTarget,a=n.getBoundingClientRect(),o=Math.max(a.width,a.height),i=o/2,r=t?e.clientX-a.left-i:a.width/2-i,s=t?e.clientY-a.top-i:a.height/2-i,l=document.createElement("div");l.className="ripple-js";const c=document.createElement("div");c.style.inlineSize=c.style.blockSize=`${o}px`,c.style.left=`${r}px`,c.style.top=`${s}px`,onWeak(c,"animationend",()=>{l.remove()}),l.appendChild(c),n.appendChild(l)}function updateAllRipples(){const e=queryAll(".slow-ripple, .ripple, .fast-ripple");for(let t=0;t<e.length;t++)onWeak(e[t],"mousedown",onMousedownRipple),onWeak(e[t],"keydown",onKeydownRipple)}function onInputDocument(e){const t=e.target;hasTag(t,"progress")?updateProgress(t):updateAllProgress()}function updateProgress(e){requestAnimationFrame(()=>{if(e.hasAttribute("value")||e.hasAttribute("max"))e.style.setProperty("--_value",String(e.value));else{const t=hasClass(e,"circle")?"50":"100";e.style.setProperty("--_value",t),e.setAttribute("value",t),e.setAttribute("max","100"),e.classList.add("indeterminate")}})}function updateAllProgress(){if(isChrome&&!isMac&&!isIOS)return;const e=document.body,t=queryAll("progress");t.length?on(e,"input",onInputDocument,!1):off(e,"input",onInputDocument,!1);for(let e=0;e<t.length;e++)updateProgress(t[e])}const _context=globalThis;let _timeoutMutation,_mutation;function onMutation(){_timeoutMutation&&clearTimeout(_timeoutMutation),_timeoutMutation=setTimeout(async()=>await _ui(),180)}async function run(e,t,n,a){if(t||(t=query(e.getAttribute("data-ui"))))if(updateAllClickable(e),hasTag(t,"dialog"))requestAnimationFrame(()=>updateDialog(e,t));else if(hasTag(t,"menu"))requestAnimationFrame(()=>updateMenu(e,t,a));else if(hasClass(t,"snackbar"))requestAnimationFrame(()=>updateSnackbar(t,n));else{if(!hasClass(t,"page"))return hasClass(t,"active")?(removeClass(e,"active"),void removeClass(t,"active")):void addClass(t,"active");requestAnimationFrame(()=>updatePage(t))}else e.classList.toggle("active")}function onClickElement(e){run(e.currentTarget,null,null,e)}function onKeydownElement(e){"Enter"===e.key&&run(e.currentTarget,null,null,e)}function setup(){_context.ui||_mutation||!_context.MutationObserver||(_mutation=new MutationObserver(onMutation),_mutation.observe(document.body,{childList:!0,subtree:!0}),onMutation())}function updateAllDataUis(){const e=queryAll("[data-ui]");for(let t=0,n=e.length;t<n;t++)onWeak(e[t],"click",onClickElement),hasTag(e[t],"a")&&!e[t].getAttribute("href")&&onWeak(e[t],"keydown",onKeydownElement)}function _ui(e,t){if(e){if("setup"===e)return void setup();if("guid"===e)return guid();if("mode"===e)return updateMode(t);if("theme"===e)return updateTheme(t);const n=query(e);if(!n)return;run(n,n,t)}updateAllDataUis(),updateAllFields(),updateAllRipples(),updateAllSliders(),updateAllProgress()}function start(){var e;if(_context.ui)return;const t=null==(e=_context.document)?void 0:e.body;!t||t.classList.contains("dark")||t.classList.contains("light")||updateMode("auto"),setup(),_context.ui=_ui}start();const ui=_context.ui;!function(e){"use strict";const t={init:function(e={}){const t={sidebarSelector:e.sidebarSelector||".kds-sidebar"},n=document.querySelector(t.sidebarSelector);n?(!function(e){if(!e)return;const t=e.querySelector(".kds-sidebar-header"),n=e.querySelector(".kds-sidebar-header-dropdown");if(!t||!n)return;t.addEventListener("click",function(e){e.stopPropagation(),n.classList.toggle("kds-dropdown-open");const a=t.querySelector(".kds-sidebar-dropdown-icon");a&&(a.style.transform=n.classList.contains("kds-dropdown-open")?"rotate(180deg)":"rotate(0deg)")}),document.addEventListener("click",function(a){if(!e.contains(a.target)){n.classList.remove("kds-dropdown-open");const e=t.querySelector(".kds-sidebar-dropdown-icon");e&&(e.style.transform="rotate(0deg)")}}),n.querySelectorAll("a").forEach(e=>{e.addEventListener("click",function(){n.classList.remove("kds-dropdown-open");const e=t.querySelector(".kds-sidebar-dropdown-icon");e&&(e.style.transform="rotate(0deg)")})})}(n),function(e){if(!e)return;const t=e.querySelectorAll(".kds-sidebar-nav-item");t.forEach(n=>{n.addEventListener("click",function(n){"#"===this.getAttribute("href")&&n.preventDefault(),t.forEach(e=>{e.classList.remove("active")}),this.classList.add("active");const a=new CustomEvent("kds-sidebar-nav-change",{detail:{item:this,text:this.querySelector("span")?.textContent||""},bubbles:!0});e.dispatchEvent(a)})})}(n),function(){const e=document.querySelector(".kds-hamburger-btn"),t=document.querySelector(".kds-sidebar-close-btn"),n=document.querySelector(".kds-sidebar");e&&n&&(e.addEventListener("click",function(){n.classList.toggle("kds-sidebar-open")}),t&&t.addEventListener("click",function(){n.classList.remove("kds-sidebar-open")}),document.addEventListener("keydown",function(e){"Escape"===e.key&&n.classList.contains("kds-sidebar-open")&&n.classList.remove("kds-sidebar-open")}))}(),console.log("[Khipu Sidebar] Initialized successfully")):console.warn("[Khipu Sidebar] Sidebar not found with selector:",t.sidebarSelector)}};"function"==typeof define&&define.amd?define(function(){return t}):"object"==typeof module&&module.exports?module.exports=t:e.KhipuSidebar=t}("undefined"!=typeof window?window:this),function(){"use strict";function e(){console.log("Initializing Khipu Material Design components..."),void 0!==window.KhipuSidebar&&window.KhipuSidebar.init(),function(){const e=document.getElementById("menu-toggle"),t=document.getElementById("material-sidenav");e&&t&&(e.addEventListener("click",function(){t.classList.toggle("active")}),document.addEventListener("click",function(n){if(t.classList.contains("active")){t.contains(n.target)||e.contains(n.target)||t.classList.remove("active")}}))}(),document.querySelectorAll('.snackbar[data-auto-dismiss="true"]').forEach(function(e){var n=e.querySelector("span");n&&n.classList.add("max");var a=document.createElement("button");a.className="kds-snackbar-close",a.setAttribute("aria-label","Cerrar"),a.innerHTML='<i class="material-symbols-outlined">close</i>',a.onclick=function(){t(e)},e.appendChild(a),setTimeout(function(){t(e)},5e3)}),window.closeModal=function(e){const t=document.getElementById(e);t&&t.classList.remove("active")},n(),a(),o(),i(),d(),p(),f(),r(),s(),c(),u(),l(),function(e){e=e||document;var t=.72,n=16,a=128,o=.02;function i(e,t){if(e){var i=new Image;i.crossOrigin="anonymous",i.onload=function(){try{var e=document.createElement("canvas");e.width=n,e.height=n;var r=e.getContext("2d");if(!r)return void t(null);r.drawImage(i,0,0,n,n);for(var s=r.getImageData(0,0,n,n).data,l=0,c=0,u=0;u<s.length;u+=4)s[u+3]<a||(l+=(.2126*s[u]+.7152*s[u+1]+.0722*s[u+2])/255,c++);if(c<n*n*o)return void t(null);t(l/c)}catch(e){t(null)}},i.onerror=function(){t(null)},i.src=e}else t(null)}e.querySelectorAll(".kds-invoice-merchant").forEach(function(e){var n=e.querySelector("img");if(n){var a=e.style.background;e.style.background="",e.classList.add("kds-invoice-merchant-neutral"),n.addEventListener("error",function(){e.classList.remove("kds-invoice-merchant-neutral","dark"),e.style.background=a}),i(n.getAttribute("src"),function(n){null!=n&&n>t&&e.classList.contains("kds-invoice-merchant-neutral")&&e.classList.add("dark")})}})}(),console.log("Material Design initialization complete!")}function t(e){e.classList.remove("active"),setTimeout(function(){e.remove()},300)}function n(e){(e=e||document).querySelectorAll(".kds-invoice-sticky").forEach(function(e){if(!e.querySelector(".kds-brand-inner")){var t=e.closest(".kds-screen")||e.parentElement,n=t?t.querySelector(".kds-brand-row"):null,a=n?n.querySelector("svg, img"):null;if(a){var o=e.querySelector(".kds-invoice-header"),i=o?o.firstElementChild:null;if(i){var r=document.createElement("div");r.className="kds-brand-inner",r.appendChild(a.cloneNode(!0)),i.insertBefore(r,i.firstChild)}}}})}function a(e){(e=e||document).querySelectorAll(".kds-screen").forEach(function(e){var t=e.querySelector(".kds-secure-footer");if(t){var n=e.querySelectorAll(".kds-card-elevated:not(.kds-invoice-sticky)");if(n.length){var a=n[n.length-1];t.classList.add("inside"),a.appendChild(t)}}})}function o(e){(e=e||document).addEventListener("click",function(e){var t=e.target.closest("[data-expand-toggle]");if(t){var n="true"===t.getAttribute("aria-expanded");t.setAttribute("aria-expanded",String(!n));var a=t.getAttribute("aria-controls"),o=a?document.getElementById(a):t.parentElement.querySelector("[data-expand-panel]");o&&(n?(o.classList.remove("open"),o.style.maxHeight=""):(o.classList.add("open"),o.style.maxHeight=o.scrollHeight+"px"))}})}function i(e){(e=e||document).addEventListener("click",function(e){var t=e.target.closest(".kds-copy-row[data-copy]");if(t)navigator.clipboard.writeText(t.dataset.copy).then(function(){t.classList.add("copied"),setTimeout(function(){t.classList.remove("copied")},1200)});else{var n=e.target.closest(".kds-copy-all[data-copy-all]");if(n){var a=n.dataset.copyAll,o=a?document.querySelector(a):n.closest(".kds-copy-header").nextElementSibling;if(!o)return;var i=o.querySelectorAll("[data-copy]"),r=[];i.forEach(function(e){r.push(e.dataset.copy)}),navigator.clipboard.writeText(r.join("\n")).then(function(){i.forEach(function(e){e.classList.add("copied"),setTimeout(function(){e.classList.remove("copied")},1200)})})}}})}function r(e){(e=e||document).querySelectorAll(".kds-countdown[data-deadline]").forEach(function(e){var t=new Date(e.dataset.deadline).getTime(),n=e.dataset.serverNow?new Date(e.dataset.serverNow).getTime():Date.now(),a=Date.now()-n,o=e.querySelector("[data-h]"),i=e.querySelector("[data-m]"),r=e.querySelector("[data-s]");function s(e){return e<10?"0"+e:String(e)}function l(){var n=Date.now()-a,l=Math.max(0,t-n),u=Math.floor(l/1e3),d=Math.floor(u/3600),p=Math.floor(u%3600/60),f=u%60;o&&(o.textContent=s(d)),i&&(i.textContent=s(p)),r&&(r.textContent=s(f)),l<3e5&&e.classList.add("urgent"),l<=0&&(clearInterval(c),e.dispatchEvent(new CustomEvent("kds:countdown:expired",{bubbles:!0})))}l();var c=setInterval(l,1e3)})}function s(e){(e=e||document).querySelectorAll(".kds-segmented-tabs").forEach(function(e){var t=e.querySelectorAll("button");e.style.setProperty("--_tab-count",t.length);var n=0;t.forEach(function(e,t){(e.classList.contains("active")||"true"===e.getAttribute("aria-selected"))&&(n=t)}),e.style.setProperty("--_active-idx",n);var a=e.parentElement;a&&a.querySelectorAll("[data-kds-tab-panel]").forEach(function(e,t){e.hidden=t!==n})}),e.addEventListener("click",function(e){var t=e.target.closest(".kds-segmented-tabs button");if(t){var n=t.closest(".kds-segmented-tabs"),a=n.querySelectorAll("button");a.forEach(function(e){e.classList.remove("active"),e.setAttribute("aria-selected","false")}),t.classList.add("active"),t.setAttribute("aria-selected","true");var o=Array.prototype.indexOf.call(a,t);n.style.setProperty("--_active-idx",o);var i=n.parentElement;i&&i.querySelectorAll("[data-kds-tab-panel]").forEach(function(e,t){e.hidden=t!==o}),n.dispatchEvent(new CustomEvent("kds:tab:change",{bubbles:!0,detail:{index:o,button:t}}))}})}function l(e){var t=(e=e||document).querySelector("#bankModal"),n=e.querySelector("#bankSearch"),a=e.querySelector("#bankModalList"),o=e.querySelector("#bankNoResults");function i(e){if(a){var t=e.toLowerCase().trim(),n=a.querySelectorAll(".kds-bank-row"),i=0;n.forEach(function(e){var n=e.querySelector(".kds-bank-row-name");if(n){var a=n.textContent.toLowerCase(),o=!t||-1!==a.indexOf(t);e.style.display=o?"":"none",o&&i++}}),o&&o.classList.toggle("visible",0===i)}}t&&(e.addEventListener("click",function(e){e.target.closest("[data-open-bank-modal]")&&(t.classList.add("open"),n&&(n.value="",n.focus()),i(""))}),e.addEventListener("click",function(e){e.target.closest("[data-close-bank-modal]")&&t.classList.remove("open")}),a&&a.addEventListener("click",function(e){var n=e.target.closest(".kds-bank-row");if(n){var a=n.dataset.bankId||n.dataset.bank||"",o=n.querySelector(".kds-bank-row-name");t.dispatchEvent(new CustomEvent("kds:bank:selected",{bubbles:!0,detail:{id:a,name:o?o.textContent:"",element:n}})),t.classList.remove("open")}}),n&&n.addEventListener("input",function(e){i(e.target.value)}),window.Khipu||(window.Khipu={}),window.Khipu.filterBanks=i)}function c(e){e=e||document;var t=!1;function n(){return window.innerWidth<768}function a(){var a=e.querySelector(".kds-screen.active");if(a&&a.querySelector(".kds-invoice-sticky"))return n()?void(t||(t=!0,requestAnimationFrame(function(){t=!1;var n=e.querySelector(".kds-screen.active");if(n){var a=n.querySelector(".kds-invoice-sticky");if(a){var o=window.scrollY||window.pageYOffset,i=Math.min(Math.max((o-0)/20,0),1);if(!n.style.getPropertyValue("--collapse-collapsible-h")){var r=a.querySelector(".kds-invoice-collapsible");r&&n.style.setProperty("--collapse-collapsible-h",r.offsetHeight+"px")}n.style.setProperty("--collapse-progress",i),a.classList.toggle("is-collapsed",i>=1),i>0&&a.querySelectorAll('[data-expand-toggle][aria-expanded="true"]').forEach(function(e){e.setAttribute("aria-expanded","false");var t=e.getAttribute("aria-controls"),n=t?document.getElementById(t):null;n&&n.classList.remove("open")})}}}))):(a.style.removeProperty("--collapse-progress"),void a.style.removeProperty("--collapse-collapsible-h"))}window.addEventListener("resize",function(){n()||(e.querySelectorAll(".kds-screen").forEach(function(e){e.style.removeProperty("--collapse-progress"),e.style.removeProperty("--collapse-collapsible-h")}),e.querySelectorAll(".kds-invoice-sticky.is-collapsed").forEach(function(e){e.classList.remove("is-collapsed")}))}),window.addEventListener("scroll",a,{passive:!0}),a()}function u(e){var t=(e=e||document).querySelectorAll("[data-hide-on-scroll]");if(t.length){var n=0,a=!1,o=new Map;window.addEventListener("scroll",r,{passive:!0}),window.addEventListener("resize",r),window.addEventListener("message",function(e){e.data&&"VIEWPORT_OFFSET"===e.data.type&&(n=Math.max(0,e.data.offsetTop||0),r())}),i()}function i(){a=!1;var e=Math.max(window.scrollY||window.pageYOffset||0,n);t.forEach(function(t){var n=parseInt(t.getAttribute("data-hide-threshold"),10)||8,a=parseInt(t.getAttribute("data-hide-top-offset"),10)||0,i=t.getAttribute("data-hide-class")||"kds-fab--hidden",r=o.has(t)?o.get(t):e;if(e<=a)return t.classList.remove(i),void o.set(t,e);var s=e-r;Math.abs(s)<n||(t.classList.toggle(i,s>0),o.set(t,e))})}function r(){a||(a=!0,requestAnimationFrame(i))}}function d(e){(e=e||document).addEventListener("click",function(e){var t=e.target.closest(".kds-copyable-table-row[data-copy]");t&&navigator.clipboard.writeText(t.dataset.copy).then(function(){t.classList.add("copied"),setTimeout(function(){t.classList.remove("copied")},1200)})})}function p(e){(e=e||document).addEventListener("click",function(e){var t=e.target.closest(".kds-copy-all-btn[data-copy-all]");if(t){var n=t.dataset.copyAll,a=n?document.querySelector(n):t.previousElementSibling;if(a){var o=a.querySelectorAll(".kds-copyable-table-row[data-copy]"),i=[];o.forEach(function(e){var t=e.querySelector(".kds-key"),n=e.dataset.copy;t?i.push(t.textContent.trim()+": "+n):i.push(n)}),navigator.clipboard.writeText(i.join("\n")).then(function(){t.classList.add("copied");var e=t.querySelector("span:not(.kds-icon)"),n=e?e.textContent:"";e&&(e.textContent="Copiado"),o.forEach(function(e){e.classList.add("copied")}),setTimeout(function(){t.classList.remove("copied"),e&&(e.textContent=n),o.forEach(function(e){e.classList.remove("copied")})},1400)})}}})}function f(e){(e=e||document).querySelectorAll(".kds-info-tip[data-tip]").forEach(function(e){if(!e.querySelector(".kds-tip-bubble")){var t=document.createElement("span");t.className="kds-tip-bubble",t.setAttribute("role","tooltip"),t.textContent=e.dataset.tip,e.appendChild(t)}}),e.addEventListener("click",function(e){var t=e.target.closest(".kds-info-tip");if(t){e.preventDefault(),e.stopPropagation();var n="true"===t.getAttribute("aria-expanded");return document.querySelectorAll('.kds-info-tip[aria-expanded="true"]').forEach(function(e){e.setAttribute("aria-expanded","false")}),void t.setAttribute("aria-expanded",String(!n))}document.querySelectorAll('.kds-info-tip[aria-expanded="true"]').forEach(function(e){e.setAttribute("aria-expanded","false")})})}function m(e,n,a){n=n||"info",a=a||5e3;var o=document.createElement("div");o.className="snackbar active "+n,o.setAttribute("data-auto-dismiss","true"),o.style.setProperty("--kds-snackbar-duration",a+"ms");var i=document.createElement("i");i.className="material-symbols-outlined",i.textContent="success"===n?"check_circle":"error"===n?"error":"info";var r=document.createElement("span");r.className="max",r.textContent=e;var s=document.createElement("button");s.className="kds-snackbar-close",s.setAttribute("aria-label","Cerrar"),s.innerHTML='<i class="material-symbols-outlined">close</i>',s.onclick=function(){t(o)},o.appendChild(i),o.appendChild(r),o.appendChild(s),document.body.appendChild(o),setTimeout(function(){t(o)},a)}"loading"===document.readyState?document.addEventListener("DOMContentLoaded",e):e(),window.Khipu||(window.Khipu={}),window.Khipu.showSnackbar=m,window.Khipu.closeModal=window.closeModal,window.Khipu.initBrandInner=n,window.Khipu.initSecureFooterInside=a,window.Khipu.initExpandToggle=o,window.Khipu.initCopyRow=i,window.Khipu.initCountdown=r,window.Khipu.initSegmentedTabs=s,window.Khipu.initCopyableTable=d,window.Khipu.initCopyAllBtn=p,window.Khipu.initInfoTip=f,window.Khipu.initBankModal=l,window.Khipu.initStickyInvoice=c,window.Khipu.initHideOnScroll=u,window.showSnackbar=m}();

package/dist/beercss/khipu-beercss.scoped.css

@@ -15,7 +15,7 @@
  *
  * AUTO-GENERATED FILE - DO NOT EDIT MANUALLY
  * Source: design-system/src/tokens/tokens.json
- * Generated: 2026-08-13T15:55:41.056Z
+ * Generated: 2026-09-04T20:24:13.733Z
  *
  * To regenerate:
  *   cd design-system && npm run tokens:generate
@@ -399,13 +399,13 @@
 /* ============================================================================
    DARK MODE COLOR TOKENS
    Override only color variables; everything else inherits from :root.
-   Activated via [data-theme="dark"] on <html>, <body>, or a wrapper —
-   or via the BeerCSS-style body.dark class. Both selectors are emitted so
-   a body.dark app gets the FULL dark theme (core + extended tokens); a
-   single source flipping only partially is how mixed light/dark bugs arise.
+   Activated ONLY via [data-theme="dark"] on <html>, <body>, or a wrapper.
+   body.dark is deliberately NOT a trigger: BeerCSS adds that class on its
+   own when the OS reports a dark preference, so honouring it turns dark on
+   for consumers that never opted in. Dark stays opt-in until an app sets
+   data-theme explicitly.
    ============================================================================ */
 
-.kds-theme-root.dark,
 .kds-theme-root [data-theme="dark"] {
 
   /* Primary palette - Khipu brand */
@@ -881,11 +881,10 @@
    values so selected states / rows / hovers adapt. Additive: the light
    :root / body.light values above are unchanged. Tokens already defined as
    var() refs (warning-soft, danger-soft) adapt on their own and are omitted.
-   body.dark is included on purpose: the light group above also matches
-   body.dark (specificity 0,1,1), so a bare [data-theme] override (0,1,0)
-   would lose on a body that carries the transitional dark class.
+   body.dark is deliberately NOT a trigger: BeerCSS adds that class on its own
+   when the OS reports a dark preference, so honouring it turns dark on for
+   consumers that never opted in. Dark stays opt-in via data-theme.
    ======================================== */
-.kds-theme-root.dark,
 .kds-theme-root [data-theme="dark"] {
     --kds-color-primary-faint: #1E1030;                     /* dark brand-tinted subtle surface (selected rows/cards) */
     --kds-color-info-soft: var(--kds-alert-info-bg);        /* dark translucent blue */
@@ -919,7 +918,7 @@
    opt-out for Chrome/WebView "Auto Dark Theme" on Android: without it, an
    OS-dark device heuristically darkens SOME elements of a light page (mixed
    light/dark rendering in production apps). Dark is reached only by an
-   explicit [data-theme="dark"] / body.dark opt-in. */
+   explicit [data-theme="dark"] opt-in. */
 .kds-theme-root,
 .kds-theme-root,
 .kds-theme-root {
@@ -938,8 +937,7 @@
 }
 
 /* Explicit dark theme: let native UI (form controls, scrollbars) render dark. */
-.kds-theme-root [data-theme="dark"],
-.kds-theme-root.dark {
+.kds-theme-root [data-theme="dark"] {
     color-scheme: dark;
 }
 
@@ -1001,6 +999,20 @@
     background-color: transparent !important;
 }
 
+/* Familia base del arbol del DS.
+   BeerCSS la pone en `body { font-family: var(--font) }`, y `--font` es un alias
+   declarado en :root. Una custom property se sustituye en el elemento que la declara,
+   asi que ese alias se congela con la familia de :root: una marca que define
+   --kds-font-family-primary mas abajo en el arbol no lo mueve, y el texto que solo
+   hereda de body se queda con la familia por defecto.
+
+   Resolviendo el token aca, en la raiz del arbol del DS, hereda todo lo de adentro con
+   la familia vigente en ese punto. Sin marca definida el valor es el mismo de siempre,
+   asi que no cambia nada para quien no la configura. */
+.kds-theme-root .kds-theme-root {
+    font-family: var(--kds-font-family-primary);
+}
+
 /* ========================================
    TEXT UTILITIES OVERRIDE
    Fix BeerCSS classes that use wrong color tokens
@@ -1212,6 +1224,29 @@
     opacity: 0.9;
 }
 
+/* Outlined success — compone con .kds-btn-outlined, igual que .kds-btn-outlined-white:
+   solo cambia superficie y color, la caja la aporta la variante base. */
+.kds-theme-root button.kds-btn-outlined-success,
+.kds-theme-root a.kds-btn-outlined-success {
+    background: transparent;
+    color: var(--kds-color-success-main);
+    border-color: var(--kds-color-success-main);
+}
+
+.kds-theme-root button.kds-btn-outlined-success:hover:not(:disabled),
+.kds-theme-root a.kds-btn-outlined-success:hover:not(:disabled) {
+    background: var(--kds-color-success-soft);
+    border-color: var(--kds-color-success-dark);
+    color: var(--kds-color-success-dark);
+}
+
+.kds-theme-root button.kds-btn-outlined-success:disabled,
+.kds-theme-root a.kds-btn-outlined-success:disabled {
+    background: transparent;
+    color: var(--kds-color-action-disabled);
+    border-color: var(--kds-color-action-disabled);
+}
+
 /* Text button — mismo tamaño que el resto de variantes (hereda min-height/padding
    del base): solo cambia la superficie, no la caja. */
 .kds-theme-root button.kds-btn-text,
@@ -2458,12 +2493,21 @@
     /* Llena y centra dentro de contenedores flex (pantalla de carga); en flujo
        normal (contenedor no-flex) se reduce a su contenido. */
     flex: 1 1 auto;
-    /* Alto propio: el loader es contenido minimo por definicion, asi que sin esto la
-       card queda del alto del spinner y se lee como un recorte. Ocupa el body completo
-       de un telefono para que la pantalla de carga se lea como una pantalla y no como
-       una franja. Va aca y no en la card para que el minimo aplique solo a la carga:
-       el resto de las pantallas crece con su contenido. */
-    min-height: 36rem;
+    /* Alto propio: el loader es contenido minimo por definicion, asi que sin esto la card
+       queda del alto del spinner y se lee como un recorte. Va aca y no en la card para que
+       el minimo aplique solo a la carga: el resto de las pantallas crece con su contenido.
+       El valor de escritorio es moderado a proposito: el minimo de telefono (36rem) dejaba
+       la card de la carga mucho mas alta que cualquier otra pantalla, y al entrar y salir
+       del loader el widget crecia y volvia a encoger. */
+    min-height: 18rem;
+}
+
+/* En telefono la carga si ocupa el alto util de la pantalla: ahi la card va a ancho
+   completo y un loader corto se lee como una franja perdida en el medio. */
+@media (max-width: 767px) {
+    .kds-theme-root .kds-secure-loader {
+        min-height: 36rem;
+    }
 }
 
 .kds-theme-root .kds-secure-loader-text {
@@ -3273,12 +3317,32 @@
     cursor: pointer;
 }
 
-/* Checked state */
+/* Checked state.
+   accent-color aplica al input nativo, que BeerCSS deja con opacity 0: no se ve.
+   Se mantiene igual por si algun consumidor no usa el markup de BeerCSS. */
 .kds-theme-root label.checkbox input[type="checkbox"]:checked,
 .kds-theme-root label.radio input[type="radio"]:checked {
     accent-color: var(--kds-color-accent, var(--primary));
 }
 
+/* El control que SI se ve lo dibuja BeerCSS como una ligadura de Material Symbols en
+   `> span::before`, coloreada con var(--primary). Estas dos reglas reproducen sus
+   selectores para que ese pseudo-elemento siga al rol accent.
+
+   Misma especificidad que el original y sin !important: este archivo va ultimo en el
+   bundle, asi que gana por orden. El fallback deja el valor anterior intacto cuando la
+   marca no define accent, que es el caso de todo consumidor actual.
+
+   No se toca `.switch`: es un control de encendido/apagado, no de seleccion, y el
+   contrato de marca no lo incluye. */
+.kds-theme-root :is(.checkbox, .radio) > span::before {
+    color: var(--kds-color-accent, var(--primary));
+}
+
+.kds-theme-root :is(.checkbox, .radio) > input:checked + span::before, .kds-theme-root :is(.checkbox, .radio).icon > input:checked + span > i {
+    color: var(--kds-color-accent, var(--primary));
+}
+
 /* Disabled state */
 .kds-theme-root label.checkbox input[type="checkbox"]:disabled,
 .kds-theme-root label.radio input[type="radio"]:disabled {
@@ -4332,14 +4396,16 @@
 
 /* Code block for displaying code snippets */
 .kds-theme-root .kds-code-block {
-    background: var(--kds-color-background-elevated);
-    padding: var(--kds-spacing-4);
+    background: var(--kds-color-background-muted);
+    border: 1px solid var(--kds-color-divider);
+    padding: var(--kds-spacing-2);
     border-radius: var(--kds-radius-md);
     overflow-x: auto;
-    font-family: 'Courier New', monospace;
+    font-family: var(--kds-font-family-mono);
     font-size: var(--kds-font-size-sm);
     line-height: var(--kds-line-height-relaxed);
     color: var(--kds-color-text-primary);
+    tab-size: 4;
 }
 
 /* ============================================
@@ -6280,13 +6346,39 @@
    alto que el mark de Khipu. Sirve para <img> o un elemento con .kds-psp-mark. */
 .kds-theme-root .kds-secure-footer img,
 .kds-theme-root .kds-secure-footer .kds-psp-mark {
-    height: 11px;
     width: auto;
     flex: 0 0 auto;
     display: block;
     object-fit: contain;
 }
 
+/* Logo del PSP: dos perillas, las dos calibradas contra el asset real que sube un PSP
+   hoy (klap.png, 60x30, con 2px de aire transparente arriba y abajo).
+
+   Se nivela por LINEA DE BASE, no por caja ni por borde inferior de la tinta: los dos
+   wordmarks tienen descendente -la "p" de Khipu baja un 20% de su caja- asi que igualar
+   los bordes de abajo deja al logo del PSP flotando sobre la linea de Khipu.
+
+   - --kds-psp-mark-height: el alto de la caja. El ojo lee la tinta, no la caja, y el
+     aire del PNG se come parte del alto: a 11px la tinta de klap medía 9.5px contra los
+     11px de Khipu y se veia mas chico. A 15px la tinta llega a 13px y se leen iguales.
+   - --kds-psp-mark-top: cuanto baja para que su linea de base calce con la de Khipu.
+     Va como valor y no como formula a proposito: depende del aire y de la anatomia del
+     asset de cada PSP, y se termina de ajustar mirando la pantalla. */
+.kds-theme-root .kds-secure-footer {
+    --kds-psp-mark-height: 15px;
+    --kds-psp-mark-top: 1px;
+}
+
+.kds-theme-root .kds-secure-footer img,
+.kds-theme-root .kds-secure-footer .kds-psp-mark {
+    height: var(--kds-psp-mark-height);
+    position: relative;
+    top: var(--kds-psp-mark-top);
+}
+
+
+
 .kds-theme-root .kds-secure-footer-code {
     color: var(--kds-color-text-hint);
 }
@@ -6542,14 +6634,37 @@
     color: var(--kds-color-success-main);
 }
 
-/* Variant: pending (animated blue spinner, sin icono interno) */
+/* Variant: pending (animated spinner, sin icono interno).
+   El acento sale de --kds-status-pending-accent, con el azul de info como
+   fallback: el valor por defecto no cambia, y una pantalla puede pedir otro
+   acento sin redefinir la regla ni recurrir a estilos inline. */
 .kds-theme-root .kds-status-block[data-status="pending"] .kds-status-block-icon {
     background: transparent;
     border: 3px solid var(--kds-color-divider);
-    border-top-color: var(--kds-color-info-main);
+    border-top-color: var(--kds-status-pending-accent, var(--kds-color-info-main));
     animation: kds-spin 1s linear infinite;
 }
 
+/* Spinner neutro, para esperas que acompañan al contenido sin reclamar
+   atención: el azul de info lee como un aviso y compite con la información
+   de la pantalla. */
+.kds-theme-root .kds-status-block.kds-accent-neutral {
+    --kds-status-pending-accent: var(--kds-color-text-primary);
+}
+
+/* Spinner fino, para bandas de una línea donde el trazo de 3px pesa demasiado.
+   El tamaño se pide por token y no por regla sobre el icono: así no compite en
+   especificidad con `.kds-status-block.inline .kds-status-block-icon`, que
+   marca igual y viene después. */
+.kds-theme-root .kds-status-block.kds-spinner-sm {
+    --kds-status-icon-size: var(--kds-spacing-3);
+    --kds-status-icon-size-sm: var(--kds-spacing-3);
+}
+
+.kds-theme-root .kds-status-block.kds-spinner-sm .kds-status-block-icon {
+    border-width: 2px;
+}
+
 /* Variant: warn */
 .kds-theme-root .kds-status-block[data-status="warn"] .kds-status-block-icon {
     background: var(--kds-color-warning-soft);
@@ -6593,6 +6708,31 @@
     font-size: var(--kds-font-size-xl);
 }
 
+/* Banda: el bloque de estado sobre una superficie sutil, para cuando acompaña
+   al contenido en lugar de encabezar la pantalla. Va después de `.inline`
+   porque marca igual en especificidad y necesita ganarle el padding. */
+.kds-theme-root .kds-status-block.kds-banded {
+    /* 0.75rem = 12px, el valor que --kds-font-size-xs toma desde tablet. Va plano y no
+       sigue la escala responsiva a proposito: a 11px el mensaje de espera se parte en dos
+       lineas y el diseno lo quiere en una. Como custom property de la variante, siguiendo
+       el patron de kds-spinner-sm con --kds-status-icon-size. */
+    --kds-status-band-font-size: 0.75rem;
+    background: var(--kds-color-background-muted);
+    border-radius: var(--kds-radius-md);
+    padding: var(--kds-spacing-1-5) var(--kds-spacing-2);
+}
+
+/* La banda de espera lleva su propia tipografia, por spec de Figma: 11px en bold.
+   Va scopeada a la variante y no a .kds-status-block-description, que la comparten
+   los bloques de resultado, donde 11px seria ilegible. El color se deja en el token
+   heredado: un #000 fijo se volveria invisible bajo modo oscuro, donde text-primary
+   pasa a blanco. */
+.kds-theme-root .kds-status-block.kds-banded .kds-status-block-description {
+    font-size: var(--kds-status-band-font-size);
+    font-weight: var(--kds-font-weight-bold);
+    line-height: normal;
+}
+
 @keyframes kds-spin {
     to { transform: rotate(360deg); }
 }
@@ -7990,6 +8130,36 @@
     }
 }
 
+/* Widget embebido: dentro de un iframe los media queries de ancho evalúan el viewport
+   DEL IFRAME (~420px), no la pantalla, así que el flujo se ve siempre como mobile
+   aunque el usuario esté en desktop — y el tope plano, pensado para cuando la card se
+   pega al borde del teléfono, queda cortando una card que en realidad flota centrada.
+   `hover`/`pointer` describen el dispositivo de entrada y no el viewport, así que
+   sobreviven al iframe: con mouse las cards conservan las esquinas superiores. */
+@media (hover: hover) and (pointer: fine) {
+    .kds-theme-root .kds-card-elevated.kds-invoice-sticky {
+        border-radius: var(--kds-radius-card);
+        /* El clip-path del colapso recorta con `round 0 0 R R` y eso PISA al
+           border-radius: aunque la card declare las cuatro esquinas, el recorte las
+           deja rectas arriba. Hay que redondearlas también acá o el fix no se ve. */
+        clip-path: inset(
+            0 0
+            calc(
+                var(--collapse-collapsible-h) * var(--collapse-progress)
+                + var(--kds-spacing-1) * var(--collapse-progress)
+            )
+            0
+            round var(--kds-radius-card)
+        );
+    }
+
+    .kds-theme-root .kds-screen > .kds-card-elevated.kds-card-elevated--flush-top,
+    .kds-theme-root .kds-card-elevated.kds-card-elevated--flush-top {
+        border-top-left-radius: var(--kds-radius-card);
+        border-top-right-radius: var(--kds-radius-card);
+    }
+}
+
 /* Brand logo row (external, outside cards) */
 .kds-theme-root .kds-brand-row {
     padding: 0 var(--kds-spacing-0-5);