/*!
 * Built by ShiftSoftware
 * Copyright (c)
 */
'use strict';

var index = require('./index-CmK48vN3.js');
var cn = require('./cn-BHnqYtun.js');

const ArrowIcon = props => (index.h("svg", Object.assign({ viewBox: "0 0 20 20", width: "16", height: "16" }, props, { "aria-hidden": "true" }),
    index.h("path", { fill: "currentColor", d: "M5.23 7.21a.75.75 0 0 1 1.06.02L10 10.94l3.71-3.71a.75.75 0 1 1 1.06 1.06l-4.24 4.24a.75.75 0 0 1-1.06 0L5.21 8.29a.75.75 0 0 1 .02-1.08z" })));

const informationTableCss = "*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scroll-snap-strictness:proximity;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;border:0 solid #e5e7eb;box-sizing:border-box}::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scroll-snap-strictness:proximity;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;}/*! tailwindcss v3.4.17 | MIT License | https://tailwindcss.com*/:after,:before{--tw-content:\"\"}:host,html{-webkit-text-size-adjust:100%;font-feature-settings:normal;-webkit-tap-highlight-color:transparent;font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-variation-settings:normal;line-height:1.5;-moz-tab-size:4;tab-size:4}body{line-height:inherit;margin:0}hr{border-top-width:1px;color:inherit;height:0}abbr:where([title]){text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-feature-settings:normal;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em;font-variation-settings:normal}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{border-collapse:collapse;border-color:inherit;text-indent:0}button,input,optgroup,select,textarea{font-feature-settings:inherit;color:inherit;font-family:inherit;font-size:100%;font-variation-settings:inherit;font-weight:inherit;letter-spacing:inherit;line-height:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,fieldset,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::placeholder,textarea::placeholder{color:#9ca3af;opacity:1}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{height:auto;max-width:100%}[hidden]:where(:not([hidden=until-found])){display:none}.\\!pointer-events-none{pointer-events:none!important}.collapse{visibility:collapse}.absolute{position:absolute}.\\!relative{position:relative!important}.left-0{left:0}.top-0{top:0}.z-10{z-index:10}.table{display:table}.shrink{flex-shrink:1}.border-collapse{border-collapse:collapse}.origin-left{transform-origin:left}.\\!overflow-hidden{overflow:hidden!important}.rounded-\\[4px\\]{border-radius:4px}.opacity-0{opacity:0}.opacity-100{opacity:1}.transition{transition-duration:.15s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1)}.transition-all{transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-500{transition-duration:.5s}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@media (min-width:1536px){.container{max-width:1536px}}.shift-skeleton{border-radius:4px;position:relative!important}.loading .shift-skeleton,.loading.shift-skeleton{border-style:none!important;overflow:hidden!important;pointer-events:none!important;position:relative!important}.shift-skeleton:after{background:linear-gradient(-45deg,#d4d8de,#e2e5e9,#d4d8de);background-size:300% 300%;border-radius:inherit!important;content:\"\";height:100%;left:0;opacity:0;pointer-events:none;position:absolute;top:0;transform-origin:left;transition-duration:.5s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);width:100%;z-index:10}.loading .shift-skeleton:after,.loading.shift-skeleton:after{--tw-scale-x:1;animation:shimmer 2s ease-in-out infinite;opacity:1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}@keyframes shimmer{0%{background-position:100% 0}50%{background-position:0 100%}to{background-position:100% 0}}.info-table-table-wrapper{width:100%}.info-table-table{border-collapse:collapse;table-layout:auto;transition:width .5s ease;width:100%}.info-table-th{background-color:inherit;border-bottom:1px solid #e2e8f0;vertical-align:middle}.info-table-td{overflow-wrap:anywhere;vertical-align:middle}.info-table-tr{transition:background-color .3s}.info-table-data-tr{border-bottom:1px solid #e2e8f0}.info-table-data-tr:last-child{border-bottom:0}.info-table-tr-stripe{background-color:#f1f5f9}.info-table-tr-clickable{cursor:pointer}.info-table-data-tr:hover{background-color:rgba(224,242,254,.5)}.info-table-subrow-td{padding:0}.static{position:static}.flex{display:flex}.h-\\[200px\\]{height:200px}.w-full{width:100%}.items-center{align-items:center}.justify-center{justify-content:center}.text-\\[26px\\]{font-size:26px}.text-red-600{--tw-text-opacity:1;color:rgb(220 38 38/var(--tw-text-opacity,1))}.shadow{--tw-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color),0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.flex-col{flex-direction:column}.gap-\\[16px\\]{gap:16px}.p-\\[16px\\]{padding:16px}.pb-\\[16px\\]{padding-bottom:16px}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.mx-auto{margin-left:auto;margin-right:auto}.me-2{margin-inline-end:.5rem}.ml-1{margin-left:.25rem}.mt-2{margin-top:.5rem}.mt-\\[32px\\]{margin-top:32px}.inline-flex{display:inline-flex}.h-\\[50px\\]{height:50px}.w-fit{width:fit-content}.max-w-full{max-width:100%}.flex-wrap{flex-wrap:wrap}.items-stretch{align-items:stretch}.gap-\\[8px\\]{gap:8px}.overflow-auto{overflow:auto}.overflow-x-auto{overflow-x:auto}.rounded-lg{border-radius:.5rem}.border{border-width:1px}.border-red-300{--tw-border-opacity:1;border-color:rgb(252 165 165/var(--tw-border-opacity,1))}.bg-\\[\\#f6f6f6\\]{--tw-bg-opacity:1;background-color:rgb(246 246 246/var(--tw-bg-opacity,1))}.bg-red-50{--tw-bg-opacity:1;background-color:rgb(254 242 242/var(--tw-bg-opacity,1))}.p-\\[2px\\]{padding:2px}.px-3{padding-left:.75rem;padding-right:.75rem}.px-\\[16px\\]{padding-left:16px;padding-right:16px}.py-1{padding-bottom:.25rem;padding-top:.25rem}.text-\\[16px\\]{font-size:16px}.text-\\[18px\\]{font-size:18px}.font-bold{font-weight:700}.font-medium{font-weight:500}.font-semibold{font-weight:600}.text-\\[green\\]{--tw-text-opacity:1;color:rgb(0 128 0/var(--tw-text-opacity,1))}.text-\\[orange\\]{--tw-text-opacity:1;color:rgb(255 165 0/var(--tw-text-opacity,1))}.text-\\[red\\]{--tw-text-opacity:1;color:rgb(255 0 0/var(--tw-text-opacity,1))}.text-red-800{--tw-text-opacity:1;color:rgb(153 27 27/var(--tw-text-opacity,1))}@media (min-width:768px){.md\\:justify-between{justify-content:space-between}}.\\[\\&\\>div\\]\\:grow>div{flex-grow:1}.me-1{margin-inline-end:.25rem}.relative{position:relative}.mb-\\[12px\\]{margin-bottom:12px}.w-\\[500px\\]{width:500px}.max-w-\\[250px\\]{max-width:250px}.max-w-\\[96vw\\]{max-width:96vw}.flex-1{flex:1 1 0%}.shrink-0{flex-shrink:0}.gap-2{gap:.5rem}.gap-\\[32px\\]{gap:32px}.rounded-md{border-radius:.375rem}.border-b{border-bottom-width:1px}.border-l{border-left-width:1px}.border-r{border-right-width:1px}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1))}.py-\\[10px\\]{padding-bottom:10px;padding-top:10px}.py-\\[12px\\]{padding-bottom:12px}.pt-\\[12px\\],.py-\\[12px\\]{padding-top:12px}.pt-\\[32px\\]{padding-top:32px}.pt-\\[8px\\]{padding-top:8px}.text-center{text-align:center}.text-\\[20px\\]{font-size:20px}.text-xl{font-size:1.25rem;line-height:1.75rem}.even\\:bg-slate-100:nth-child(2n){--tw-bg-opacity:1;background-color:rgb(241 245 249/var(--tw-bg-opacity,1))}.hover\\:bg-sky-100\\/50:hover{background-color:rgba(224,242,254,.5)}.\\!h-auto{height:auto!important}.min-w-full{min-width:100%}.resize{resize:both}.overflow-hidden{overflow:hidden}.\\!transition-none{transition-property:none!important}.\\!duration-0{transition-duration:0s!important}.\\!duration-500{transition-duration:.5s!important}.\\!w-full{width:100%!important}.translate-x-\\[-200\\%\\]{--tw-translate-x:-200%}.translate-x-\\[-200\\%\\],.translate-y-\\[200\\%\\]{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-y-\\[200\\%\\]{--tw-translate-y:200%}.\\[\\&_\\*\\]\\:\\!pointer-events-none *{pointer-events:none!important}.my-auto{margin-bottom:auto;margin-top:auto}.block{display:block}.grid{display:grid}.size-\\[20px\\]{height:20px;width:20px}.size-\\[32px\\]{height:32px;width:32px}.size-full{height:100%;width:100%}.rotate-180{--tw-rotate:180deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.cursor-pointer{cursor:pointer}.place-items-center{place-items:center}.whitespace-nowrap{white-space:nowrap}.rounded{border-radius:.25rem}.bg-sky-100{--tw-bg-opacity:1;background-color:rgb(224 242 254/var(--tw-bg-opacity,1))}.bg-sky-200{--tw-bg-opacity:1;background-color:rgb(186 230 253/var(--tw-bg-opacity,1))}.bg-slate-100{--tw-bg-opacity:1;background-color:rgb(241 245 249/var(--tw-bg-opacity,1))}.bg-slate-200\\/70{background-color:rgba(226,232,240,.7)}.px-\\[12px\\]{padding-left:12px;padding-right:12px}.px-\\[6px\\]{padding-left:6px;padding-right:6px}.px-\\[8px\\]{padding-left:8px;padding-right:8px}.py-\\[16px\\]{padding-bottom:16px;padding-top:16px}.py-\\[6px\\]{padding-bottom:6px;padding-top:6px}.py-\\[8px\\]{padding-bottom:8px;padding-top:8px}.text-\\[13px\\]{font-size:13px}.text-slate-700{--tw-text-opacity:1;color:rgb(51 65 85/var(--tw-text-opacity,1))}.transition-transform{transition-duration:.15s;transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-300{transition-duration:.3s}.last\\:border-b-0:last-child{border-bottom-width:0}.hover\\:cursor-pointer:hover{cursor:pointer}.hover\\:bg-sky-200:hover{--tw-bg-opacity:1;background-color:rgb(186 230 253/var(--tw-bg-opacity,1))}.hover\\:bg-slate-200\\/70:hover{background-color:rgba(226,232,240,.7)}.hidden{display:none}.pointer-events-none{pointer-events:none}.size-\\[100px\\]{height:100px;width:100px}.h-auto{height:auto}.max-h-\\[100px\\]{max-height:100px}.w-auto{width:auto}.max-w-\\[100px\\]{max-width:100px}.gap-\\[4px\\]{gap:4px}.bg-black\\/40{background-color:rgba(0,0,0,.4)}.text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.shadow,.shadow-sm{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 2px 0 rgba(0,0,0,.05);--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color)}.outline-none{outline:2px solid transparent;outline-offset:2px}.ring-0{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.hover\\:opacity-100:hover{opacity:1}.\\[\\&_div\\]\\:hover\\:\\!opacity-100:hover div{opacity:1!important}.\\[\\&_img\\]\\:hover\\:shadow-lg:hover img{--tw-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color),0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.pointer-events-auto{pointer-events:auto}.bottom-\\[40px\\]{bottom:40px}.left-1\\/2{left:50%}.left-\\[30px\\]{left:30px}.ml-\\[-125px\\]{margin-left:-125px}.box-content{box-sizing:content-box}.size-\\[30px\\]{height:30px;width:30px}.size-\\[90px\\]{height:90px;width:90px}.h-10{height:2.5rem}.h-\\[320px\\]{height:320px}.h-full{height:100%}.w-1\\/2{width:50%}.w-\\[150\\%\\]{width:150%}.w-\\[90\\%\\]{width:90%}.w-\\[calc\\(100\\%-0px\\)\\]{width:100%}.w-\\[calc\\(100\\%-60px\\)\\]{width:calc(100% - 60px)}.-translate-x-1\\/2{--tw-translate-x:-50%}.-translate-x-1\\/2,.translate-y-0{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-y-0{--tw-translate-y:0px}.translate-y-\\[-50\\%\\]{--tw-translate-y:-50%}.translate-y-\\[-50\\%\\],.translate-y-\\[-5px\\]{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-y-\\[-5px\\]{--tw-translate-y:-5px}.scale-100{--tw-scale-x:1;--tw-scale-y:1}.scale-100,.scale-\\[70\\%\\]{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.scale-\\[70\\%\\]{--tw-scale-x:70%;--tw-scale-y:70%}.justify-between{justify-content:space-between}.gap-\\[250px\\]{gap:250px}.overflow-x-hidden{overflow-x:hidden}.overflow-y-hidden{overflow-y:hidden}.overflow-x-scroll{overflow-x:scroll}.rounded-\\[6px\\]{border-radius:6px}.border-\\[\\#faebcc\\]{--tw-border-opacity:1;border-color:rgb(250 235 204/var(--tw-border-opacity,1))}.bg-\\[\\#1a1a1a\\]{--tw-bg-opacity:1;background-color:rgb(26 26 26/var(--tw-bg-opacity,1))}.bg-\\[\\#fcf8e3\\]{--tw-bg-opacity:1;background-color:rgb(252 248 227/var(--tw-bg-opacity,1))}.bg-\\[linear-gradient\\(to_bottom\\2c _\\#428bca_0\\%\\2c _\\#3071a9_100\\%\\)\\]{background-image:linear-gradient(180deg,#428bca,#3071a9)}.p-\\[25px\\]{padding:25px}.px-\\[30px\\]{padding-left:30px;padding-right:30px}.pt-\\[16px\\]{padding-top:16px}.text-\\[22px\\]{font-size:22px}.text-\\[\\#8a6d3b\\]{--tw-text-opacity:1;color:rgb(138 109 59/var(--tw-text-opacity,1))}.duration-200{transition-duration:.2s}.\\[\\&_\\*\\]\\:shrink-0 *{flex-shrink:0}.size-\\[18px\\]{height:18px;width:18px}.h-\\[150px\\]{height:150px}.w-\\[84px\\]{width:84px}.gap-\\[6px\\]{gap:6px}.border-slate-200{--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1))}.bg-slate-50{--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity,1))}.p-\\[12px\\]{padding:12px}.p-\\[6px\\]{padding:6px}.px-\\[24px\\]{padding-left:24px;padding-right:24px}.py-\\[15px\\]{padding-bottom:15px;padding-top:15px}.mt-\\[4px\\]{margin-top:4px}.max-w-\\[460px\\]{max-width:460px}.max-w-\\[520px\\]{max-width:520px}.translate-y-\\[-4px\\]{--tw-translate-y:-4px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.select-none{user-select:none}.items-start{align-items:flex-start}.justify-start{justify-content:flex-start}.gap-\\[12px\\]{gap:12px}.gap-\\[2px\\]{gap:2px}.\\!rounded-\\[12px\\]{border-radius:12px!important}.rounded-\\[14px\\]{border-radius:14px}.px-\\[14px\\]{padding-left:14px;padding-right:14px}.\\!pb-0{padding-bottom:0!important}.text-\\[13\\.5px\\]{font-size:13.5px}.leading-\\[1\\.35\\]{line-height:1.35}.text-amber-900\\/90{color:rgba(120,53,15,.9)}.transition-opacity{transition-duration:.15s;transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1)}.my-2{margin-bottom:.5rem;margin-top:.5rem}.grow{flex-grow:1}.fixed{position:fixed}.h-\\[25px\\]{height:25px}.h-\\[8px\\]{height:8px}.pt-\\[40px\\]{padding-top:40px}.success-card{background-color:#d0e7de;border-color:#a2d0bb;color:#0b3521}.reject-card{background-color:#f7d7d8;border-color:#f2aeb5;color:#58151c}.sr-only{clip:rect(0,0,0,0);border-width:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.-left-full{left:-100%}.end-\\[16px\\]{inset-inline-end:16px}.left-full{left:100%}.right-\\[50px\\]{right:50px}.z-20{z-index:20}.z-\\[999\\]{z-index:999}.mb-\\[16px\\]{margin-bottom:16px}.mt-\\[16px\\]{margin-top:16px}.mt-\\[20px\\]{margin-top:20px}.mt-\\[50px\\]{margin-top:50px}.box-border{box-sizing:border-box}.size-\\[24px\\]{height:24px;width:24px}.size-\\[25px\\]{height:25px;width:25px}.size-\\[35px\\]{height:35px;width:35px}.h-\\[100dvh\\]{height:100dvh}.h-\\[140px\\]{height:140px}.h-\\[16px\\]{height:16px}.h-\\[30px\\]{height:30px}.h-\\[32px\\]{height:32px}.h-\\[36px\\]{height:36px}.h-\\[40px\\]{height:40px}.h-fit{height:fit-content}.max-h-\\[200px\\]{max-height:200px}.w-\\[200px\\]{width:200px}.w-\\[300px\\]{width:300px}.min-w-\\[100dvw\\]{min-width:100dvw}.max-w-\\[200px\\]{max-width:200px}.max-w-\\[400px\\]{max-width:400px}.-translate-y-\\[32px\\]{--tw-translate-y:-32px}.-translate-y-\\[32px\\],.translate-y-0{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-y-\\[32px\\]{--tw-translate-y:32px}.rotate-\\[45deg\\],.translate-y-\\[32px\\]{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.rotate-\\[45deg\\]{--tw-rotate:45deg}.scale-100,.scale-\\[110\\%\\]{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.scale-\\[110\\%\\]{--tw-scale-x:110%;--tw-scale-y:110%}.cursor-default{cursor:default}.gap-\\[10px\\]{gap:10px}.gap-\\[20px\\]{gap:20px}.gap-\\[75px\\]{gap:75px}.truncate{overflow:hidden;white-space:nowrap}.text-ellipsis,.truncate{text-overflow:ellipsis}.rounded-\\[5px\\]{border-radius:5px}.rounded-\\[8px\\]{border-radius:8px}.rounded-full{border-radius:9999px}.border-\\[2px\\]{border-width:2px}.border-\\[\\#27ae60\\]{--tw-border-opacity:1;border-color:rgb(39 174 96/var(--tw-border-opacity,1))}.border-\\[\\#3071a9\\]{--tw-border-opacity:1;border-color:rgb(48 113 169/var(--tw-border-opacity,1))}.border-\\[\\#dcdcdc\\]{--tw-border-opacity:1;border-color:rgb(220 220 220/var(--tw-border-opacity,1))}.border-\\[\\#ddd\\]{--tw-border-opacity:1;border-color:rgb(221 221 221/var(--tw-border-opacity,1))}.border-\\[\\#f4f4f4\\]{--tw-border-opacity:1;border-color:rgb(244 244 244/var(--tw-border-opacity,1))}.border-\\[\\#ff9100\\]{--tw-border-opacity:1;border-color:rgb(255 145 0/var(--tw-border-opacity,1))}.border-\\[\\#ffb74d\\]{--tw-border-opacity:1;border-color:rgb(255 183 77/var(--tw-border-opacity,1))}.border-\\[\\#ffd28f\\]{--tw-border-opacity:1;border-color:rgb(255 210 143/var(--tw-border-opacity,1))}.bg-\\[\\#275e8f\\]{--tw-bg-opacity:1;background-color:rgb(39 94 143/var(--tw-bg-opacity,1))}.bg-\\[\\#32b267\\]{--tw-bg-opacity:1;background-color:rgb(50 178 103/var(--tw-bg-opacity,1))}.bg-\\[\\#d5d5d5\\]{--tw-bg-opacity:1;background-color:rgb(213 213 213/var(--tw-bg-opacity,1))}.bg-\\[\\#f4f4f4\\]{--tw-bg-opacity:1;background-color:rgb(244 244 244/var(--tw-bg-opacity,1))}.bg-\\[\\#ff91001a\\]{background-color:#ff91001a}.bg-slate-400{--tw-bg-opacity:1;background-color:rgb(148 163 184/var(--tw-bg-opacity,1))}.bg-transparent{background-color:transparent}.fill-\\[\\#3071a9\\]{fill:#3071a9}.stroke-white{stroke:#fff}.stroke-\\[1\\.5px\\]{stroke-width:1.5px}.p-\\[22px\\]{padding:22px}.p-\\[50px\\]{padding:50px}.p-\\[7px\\]{padding:7px}.px-\\[22px\\]{padding-left:22px;padding-right:22px}.ps-\\[16px\\]{padding-inline-start:16px}.ps-\\[4px\\]{padding-inline-start:4px}.ps-\\[8px\\]{padding-inline-start:8px}.text-\\[14px\\]{font-size:14px}.text-\\[\\#3071a9\\]{--tw-text-opacity:1;color:rgb(48 113 169/var(--tw-text-opacity,1))}.text-\\[\\#424242\\]{--tw-text-opacity:1;color:rgb(66 66 66/var(--tw-text-opacity,1))}.text-\\[\\#663c00\\]{--tw-text-opacity:1;color:rgb(102 60 0/var(--tw-text-opacity,1))}.text-\\[\\#ff9100\\]{--tw-text-opacity:1;color:rgb(255 145 0/var(--tw-text-opacity,1))}.text-black{--tw-text-opacity:1;color:rgb(0 0 0/var(--tw-text-opacity,1))}.text-red-300{--tw-text-opacity:1;color:rgb(252 165 165/var(--tw-text-opacity,1))}.text-red-500{--tw-text-opacity:1;color:rgb(239 68 68/var(--tw-text-opacity,1))}.text-red-700{--tw-text-opacity:1;color:rgb(185 28 28/var(--tw-text-opacity,1))}.text-transparent{color:transparent}.opacity-50{opacity:.5}.shadow,.shadow-lg{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-lg{--tw-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color),0 4px 6px -4px var(--tw-shadow-color)}.transition-\\[width\\]{transition-duration:.15s;transition-property:width;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-700{transition-duration:.7s}.ease-out{transition-timing-function:cubic-bezier(0,0,.2,1)}.hover\\:bg-\\[\\#3071a9\\]:hover{--tw-bg-opacity:1;background-color:rgb(48 113 169/var(--tw-bg-opacity,1))}.hover\\:bg-\\[\\#fff8e1\\]:hover{--tw-bg-opacity:1;background-color:rgb(255 248 225/var(--tw-bg-opacity,1))}.hover\\:bg-red-600:hover{--tw-bg-opacity:1;background-color:rgb(220 38 38/var(--tw-bg-opacity,1))}.focus\\:-translate-y-\\[8px\\]:focus{--tw-translate-y:-8px}.focus\\:-translate-y-\\[8px\\]:focus,.focus\\:scale-110:focus{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.focus\\:scale-110:focus{--tw-scale-x:1.1;--tw-scale-y:1.1}.focus\\:border-\\[\\#3071a9\\]:focus{--tw-border-opacity:1;border-color:rgb(48 113 169/var(--tw-border-opacity,1))}.active\\:bg-\\[\\#223f57\\]:active{--tw-bg-opacity:1;background-color:rgb(34 63 87/var(--tw-bg-opacity,1))}.enabled\\:shadow:enabled{--tw-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color),0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.enabled\\:hover\\:rotate-\\[135deg\\]:hover:enabled{--tw-rotate:135deg}.enabled\\:hover\\:rotate-\\[135deg\\]:hover:enabled,.enabled\\:hover\\:scale-110:hover:enabled{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.enabled\\:hover\\:scale-110:hover:enabled{--tw-scale-x:1.1;--tw-scale-y:1.1}.enabled\\:hover\\:scale-\\[150\\%\\]:hover:enabled{--tw-scale-x:150%;--tw-scale-y:150%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.enabled\\:hover\\:border-\\[\\#27ae5fc1\\]:hover:enabled{border-color:#27ae5fc1}.enabled\\:hover\\:bg-\\[\\#32b267c7\\]:hover:enabled{background-color:#32b267c7}.enabled\\:hover\\:bg-red-200:hover:enabled{--tw-bg-opacity:1;background-color:rgb(254 202 202/var(--tw-bg-opacity,1))}.enabled\\:hover\\:text-red-400:hover:enabled{--tw-text-opacity:1;color:rgb(248 113 113/var(--tw-text-opacity,1))}.disabled\\:opacity-50:disabled{opacity:.5}.peer:checked~.peer-checked\\:border-\\[\\#ff9100\\]{--tw-border-opacity:1;border-color:rgb(255 145 0/var(--tw-border-opacity,1))}.peer:checked~.peer-checked\\:bg-\\[\\#ff9100\\]{--tw-bg-opacity:1;background-color:rgb(255 145 0/var(--tw-bg-opacity,1))}.peer:checked~.peer-checked\\:text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}@media (min-width:768px){.md\\:flex-row{flex-direction:row}}.\\[\\&_circle\\]\\:fill-white circle{fill:#fff}.\\[\\&_div\\]\\:min-w-\\[200px\\] div{min-width:200px}.\\!rounded-\\[4px\\]{border-radius:4px!important}";

const InformationTable = class {
    constructor(hostRef) {
        index.registerInstance(this, hostRef);
        this.rows = [];
        this.templateRow = {};
        this.isLoading = false;
        this.showHeader = true;
        this.isRaw = false;
        this.stripCells = true;
        this.customSkeleton = false;
        this.size = 'default';
        this.allowAutoWidth = false;
        this.expandColumnWidth = 48;
        this.expandUsingEntireRow = false;
        this.allowMultipleExpanded = false;
        this.scrollExpandedIntoView = false;
        this.tableRowHeight = 'auto';
        this.expandedRowIndexes = [];
        this.getTableWidth = () => {
            var _a;
            if (this.allowAutoWidth)
                return 0;
            const headersWidth = ((_a = this.headers) === null || _a === void 0 ? void 0 : _a.reduce((sum, h) => sum + (typeof (h === null || h === void 0 ? void 0 : h.width) === 'number' ? h.width : 0), 0)) || 0;
            return headersWidth + (this.subRowRenderer ? this.expandColumnWidth : 0);
        };
        this.isExpanded = (rowIndex) => this.expandedRowIndexes.includes(rowIndex);
        this.toggleExpanded = (rowIndex) => {
            const currentlyExpanded = this.isExpanded(rowIndex);
            if (currentlyExpanded) {
                this.expandedRowIndexes = this.expandedRowIndexes.filter(i => i !== rowIndex);
                return;
            }
            this.expandedRowIndexes = this.allowMultipleExpanded ? [...this.expandedRowIndexes, rowIndex] : [rowIndex];
            if (this.scrollExpandedIntoView) {
                requestAnimationFrame(() => {
                    const rows = this.el.querySelectorAll('.info-table-data-tr, .information-table-row');
                    const row = rows[rowIndex];
                    if (row && typeof row.scrollIntoView === 'function') {
                        row.scrollIntoView({ behavior: 'smooth', block: 'start' });
                    }
                });
            }
        };
        this.renderCellContent = (value) => {
            if (value === null || value === undefined)
                return index.h("div", null, "\u00A0");
            if (typeof value === 'string' || typeof value === 'number')
                return value;
            if (typeof value === 'function')
                return value();
            return value;
        };
        this.renderTableExpandCell = (rowIndex) => {
            const expandable = !!this.subRowRenderer && rowIndex >= 0;
            const expanded = expandable ? this.isExpanded(rowIndex) : false;
            const expandCellPaddingClass = this.size === 'small' ? 'px-[6px] py-[6px]' : 'px-[8px] py-[16px]';
            const expandPlaceholderSizeClass = this.size === 'small' ? 'size-[20px]' : 'size-[32px]';
            if (expandable) {
                return (index.h("td", { style: { width: `${this.expandColumnWidth}px` }, class: cn.cn('info-table-td', expandCellPaddingClass) }, index.h("div", { class: "grid place-items-center size-full" }, index.h("button", { type: "button", disabled: this.expandUsingEntireRow, "aria-expanded": expanded ? 'true' : 'false', onClick: e => {
                        e.stopPropagation();
                        this.toggleExpanded(rowIndex);
                    }, class: cn.cn('size-full grid place-items-center shift-skeleton rounded transition duration-500', {
                        'hover:bg-slate-200/70': !expanded,
                        'bg-sky-100 hover:bg-sky-200': expanded,
                        '!pointer-events-none': this.expandUsingEntireRow,
                    }) }, index.h(ArrowIcon, { class: cn.cn('text-slate-700 transition-transform duration-500', { 'rotate-180': expanded }) })))));
            }
            return (index.h("td", { style: { width: `${this.expandColumnWidth}px` }, class: cn.cn('info-table-td', expandCellPaddingClass) }, index.h("div", { class: "grid place-items-center size-full" }, !this.customSkeleton && index.h("div", { class: cn.cn('shift-skeleton', expandPlaceholderSizeClass) }))));
        };
        this.renderTableDataRow = (data, rowIndex) => {
            const isStripe = rowIndex >= 0 && rowIndex % 2 === 1 && this.stripCells;
            const cellPaddingClass = this.size === 'small' ? 'px-[12px] py-[6px]' : 'px-[16px] py-[16px]';
            const cellTextClass = this.size === 'small' ? 'text-[13px]' : '';
            return (index.h("tr", { onClick: this.expandUsingEntireRow && rowIndex >= 0 ? () => this.toggleExpanded(rowIndex) : undefined, class: cn.cn('info-table-tr info-table-data-tr information-table-row', {
                    'info-table-tr-stripe': isStripe,
                    'info-table-tr-clickable': this.expandUsingEntireRow && rowIndex >= 0,
                }) }, this.subRowRenderer && this.renderTableExpandCell(rowIndex), this.headers.map(({ key, label, centeredHorizontally = true, nowrap, maxWidth, styles = {} }, idx) => {
                const tdStyle = Object.assign(Object.assign({}, (typeof maxWidth === 'number' && maxWidth > 0 ? { maxWidth: `${maxWidth}px` } : {})), styles);
                return (index.h("td", { key: key + label + idx, style: tdStyle, class: cn.cn('info-table-td table-body-cell', cellPaddingClass, cellTextClass, {
                        'text-center': centeredHorizontally,
                        'whitespace-nowrap': nowrap,
                    }) }, index.h("div", { class: cn.cn({ 'shift-skeleton': !this.customSkeleton }) }, this.renderCellContent(data[key]))));
            })));
        };
        this.renderTableSubRow = (row, idx) => {
            var _a;
            const expanded = this.isExpanded(idx);
            const colSpan = (((_a = this.headers) === null || _a === void 0 ? void 0 : _a.length) || 0) + (this.subRowRenderer ? 1 : 0);
            return (index.h("tr", { key: `sub-${idx}`, class: "info-table-tr info-table-subrow-tr" }, index.h("td", { class: "info-table-subrow-td", colSpan: colSpan }, index.h("flexible-container", { isOpened: expanded }, this.subRowRenderer(row)))));
        };
        this.renderRow = (data = {}, rowIndex = -1) => {
            const expandable = !!this.subRowRenderer && rowIndex >= 0;
            const expanded = expandable ? this.isExpanded(rowIndex) : false;
            const rowBg = rowIndex >= 0 && rowIndex % 2 === 1 && this.stripCells ? 'bg-slate-100' : '';
            const expandCellPaddingClass = this.size === 'small' ? 'px-[6px] py-[6px]' : 'px-[8px] py-[16px]';
            const expandPlaceholderSizeClass = this.size === 'small' ? 'size-[20px]' : 'size-[32px]';
            const expandCell = !this.subRowRenderer ? (false) : expandable ? (index.h("div", { style: { width: `${this.expandColumnWidth}px` }, class: cn.cn('grid place-items-center', expandCellPaddingClass) }, index.h("button", { type: "button", disabled: this.expandUsingEntireRow, "aria-expanded": expanded ? 'true' : 'false', onClick: () => this.toggleExpanded(rowIndex), class: cn.cn('size-full grid place-items-center shift-skeleton rounded transition duration-500', {
                    'hover:bg-slate-200/70': !expanded,
                    'bg-sky-100 hover:bg-sky-200': expanded,
                    '!pointer-events-none': this.expandUsingEntireRow,
                }) }, index.h(ArrowIcon, { class: cn.cn('text-slate-700 transition-transform duration-500', { 'rotate-180': expanded }) })))) : (index.h("div", { style: { width: `${this.expandColumnWidth}px` }, class: cn.cn('grid place-items-center', expandCellPaddingClass) }, !this.customSkeleton && index.h("div", { class: cn.cn('shift-skeleton', expandPlaceholderSizeClass) })));
            const cellPaddingClass = this.size === 'small' ? 'px-[12px] py-[6px]' : 'px-[16px] py-[16px]';
            const cellTextClass = this.size === 'small' ? 'text-[13px]' : '';
            return (index.h("div", { onClick: this.expandUsingEntireRow && (() => this.toggleExpanded(rowIndex)), class: cn.cn('information-table-row flex hover:bg-sky-100/50 transition duration-300', rowBg, { 'hover:cursor-pointer': this.expandUsingEntireRow }) }, expandCell, this.headers.map(({ key, label, width, centeredHorizontally = true, centeredVertically = true, styles = {} }, idx) => {
                const hasWidth = typeof width === 'number' && width > 0;
                const cellStyle = Object.assign(Object.assign({}, (hasWidth ? { width: `${width}px` } : {})), styles);
                return (index.h("div", { key: key + label + idx, style: cellStyle, class: cn.cn('table-body-cell', cellPaddingClass, cellTextClass, {
                        'text-center': centeredHorizontally,
                        'my-auto': centeredVertically,
                    }) }, index.h("div", { class: cn.cn({ 'shift-skeleton': !this.customSkeleton }) }, this.renderCellContent(data[key]))));
            })));
        };
        this.renderExpandableRow = (row, idx) => {
            const expanded = this.isExpanded(idx);
            const tableWidth = this.getTableWidth();
            return (index.h("div", { key: String(idx), style: { width: tableWidth ? `${tableWidth}px` : undefined }, class: cn.cn('border-b last:border-b-0') }, this.renderRow(row, idx), index.h("flexible-container", { isOpened: expanded }, this.subRowRenderer(row))));
        };
    }
    async onIsLoadingChange() {
        var _a;
        const staticTableRowHeight = (_a = this.el.getElementsByClassName('information-table-row')[0]) === null || _a === void 0 ? void 0 : _a.clientHeight;
        if (staticTableRowHeight)
            this.tableRowHeight = staticTableRowHeight;
        if (this.isLoading) {
            this.expandedRowIndexes = [];
        }
        else
            this.tableRowHeight = 'auto';
    }
    render() {
        var _a, _b, _c, _d, _e, _f, _g;
        const isGrid = this.allowAutoWidth;
        const rowCount = ((_a = this.rows) === null || _a === void 0 ? void 0 : _a.length) || 0;
        const hasRows = rowCount > 0;
        if (isGrid) {
            const cellPaddingHeader = this.size === 'small' ? 'py-[8px] px-[12px] text-[13px]' : 'py-[16px] px-[16px]';
            const expandHeaderPadding = this.size === 'small' ? 'py-[10px] px-[6px]' : 'py-[16px] px-[8px]';
            return (index.h("div", { class: cn.cn('information-table-wrapper info-table-table-wrapper', { loading: this.isLoading }) }, index.h("table", { class: "info-table-table" }, this.showHeader && (index.h("thead", null, index.h("tr", { class: "info-table-tr info-table-header-tr" }, !!this.subRowRenderer && index.h("th", { style: { width: `${this.expandColumnWidth}px` }, class: cn.cn('info-table-th', expandHeaderPadding) }), this.headers.map(({ label, width, maxWidth, centeredHorizontally = true, nowrap, styles = {} }, idx) => {
                const hasWidth = typeof width === 'number' && width > 0;
                const hasMaxWidth = typeof maxWidth === 'number' && maxWidth > 0;
                const thStyle = Object.assign(Object.assign(Object.assign({}, (hasWidth ? { width: `${width}px` } : {})), (hasMaxWidth ? { maxWidth: `${maxWidth}px` } : {})), styles);
                return (index.h("th", { key: label + idx, style: thStyle, class: cn.cn('info-table-th font-semibold table-header-cell', cellPaddingHeader, {
                        'text-center': centeredHorizontally,
                        'whitespace-nowrap': nowrap,
                    }) }, label));
            })))), index.h("tbody", null, !hasRows && this.renderTableDataRow(this.templateRow, -1), hasRows &&
                this.rows.map((row, idx) => [
                    this.renderTableDataRow(row, idx),
                    !!this.subRowRenderer && this.renderTableSubRow(row, idx),
                ])))));
        }
        const headerRow = this.showHeader && (index.h("div", { class: "flex" }, !!this.subRowRenderer && (index.h("div", { style: { width: `${this.expandColumnWidth}px` }, class: cn.cn('border-b', this.size === 'small' ? 'py-[10px] px-[6px]' : 'py-[16px] px-[8px]') })), this.headers.map(({ label, width, centeredHorizontally = true, styles = {} }, idx) => {
            const hasWidth = typeof width === 'number' && width > 0;
            const headerStyle = Object.assign(Object.assign({}, (hasWidth ? { width: `${width}px` } : {})), styles);
            return (index.h("div", { key: label + idx, style: headerStyle, class: cn.cn('font-semibold table-header-cell border-b', this.size === 'small' ? 'py-[8px] px-[12px] text-[13px]' : 'py-[16px] px-[16px]', {
                    'text-center': centeredHorizontally,
                }) }, label));
        })));
        return (index.h("div", { class: cn.cn('information-table-wrapper mx-auto w-fit', { loading: this.isLoading }) }, headerRow, this.isRaw ? (index.h("div", { style: { height: `${this.tableRowHeight}px` } }, !((_b = this.rows) === null || _b === void 0 ? void 0 : _b.length) && index.h("div", { class: cn.cn('border-b last:border-b-0') }, this.renderRow(this.templateRow)), !!((_c = this.rows) === null || _c === void 0 ? void 0 : _c.length) &&
            !this.subRowRenderer &&
            this.rows.map((row, idx) => (index.h("div", { key: String(idx), class: cn.cn('border-b last:border-b-0') }, this.renderRow(row, idx)))), !!((_d = this.rows) === null || _d === void 0 ? void 0 : _d.length) && !!this.subRowRenderer && this.rows.map((row, idx) => this.renderExpandableRow(row, idx)))) : (index.h("flexible-container", { height: this.tableRowHeight }, !((_e = this.rows) === null || _e === void 0 ? void 0 : _e.length) && index.h("div", { class: cn.cn('border-b last:border-b-0') }, this.renderRow(this.templateRow)), !!((_f = this.rows) === null || _f === void 0 ? void 0 : _f.length) &&
            !this.subRowRenderer &&
            this.rows.map((row, idx) => (index.h("div", { key: String(idx), class: cn.cn('border-b last:border-b-0') }, this.renderRow(row, idx)))), !!((_g = this.rows) === null || _g === void 0 ? void 0 : _g.length) && !!this.subRowRenderer && this.rows.map((row, idx) => this.renderExpandableRow(row, idx))))));
    }
    get el() { return index.getElement(this); }
    static get watchers() { return {
        "isLoading": ["onIsLoadingChange"]
    }; }
};
InformationTable.style = informationTableCss;

exports.information_table = InformationTable;
