gdx-ui 2.0.1 → 2.0.3

package/base.css

@@ -1 +1 @@
-.checkmark:after,.clearfix:after,.clearfix:before,.form-inline:after,.form-inline:before,.input-inside:after,.input-inside:before,.slider:before,.toolbar-group:after,.toolbar-group:before{content:""}.clearfix:after,.form-inline:after,.input-inside:after,.toolbar-group:after{clear:both}.input-inside,body,button,input,select,textarea{font-family:'Open Sans',sans-serif}.app-layout,.dialog{flex-direction:column}.box,.dialog{transition:transform .25s ease,box-shadow .25s ease}.app-layout,body,html{box-sizing:border-box}.btn,a,button.anchor{text-decoration:none}.clearfix:after,.clearfix:before{display:table;line-height:0}.widget-hover{box-shadow:0 6px 10px rgba(0,0,0,.2)}body{background:var(--body-bg);color:var(--color);font-size:14px;font-weight:500;line-height:1.5em}.code-editor,code,pre{font-family:monospace}body,html{height:100%;margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-weight:400;line-height:1.5em;margin:0 0 15px;padding:0}.btn-link,h3,h4,h5,h6{font-weight:700}h1{font-size:25px}h2{font-size:20px}h3{font-size:15px}h4,h5,h6{font-size:14px}a,button.anchor{color:#1D9EFC;background:0 0;border:none;cursor:pointer;padding:0}a:hover,button.anchor:hover{color:#0390f7}p{margin:0 0 15px}code,pre{color:#7b7b7b}pre{background:var(--body-bg);border-radius:15px;border:1px solid var(--border-color);line-height:1.5em;overflow:auto;padding:15px;text-wrap:wrap}.btn,hr{border:none}hr{border-bottom:solid 1px var(--border-color);margin:15px 0}.app-layout{min-height:100%;display:flex}.btn,.editable,.input-inside,input,select,textarea{display:inline-block;vertical-align:middle;box-sizing:border-box}.app-body{flex-grow:1}.app-footer,.app-header{flex-grow:0;flex-shrink:0}.wrapper .span-side{width:250px}.wrapper .span-double{width:835px}.wrapper .adds-4 .span-add{width:263.75px}.wrapper .adds-3 .span-add{width:356.67px}.wrapper .span-half{width:542.5px}:root{--base-margin:15px}.theme-light,:root{--color:#272729;--btn-bg:#ECEDEF;--btn-bg-darker:#dee0e3;--el-bg:#FFFFFF;--el-bg-highlight:#f2f5f7;--body-bg:#f1f5f8;--border-color:#DDD;--overlay-color:rgba(0, 0, 0, 0.2);--input-bg:#FFFFFF}@font-face{font-family:'Open Sans';font-style:italic;font-weight:300;font-stretch:normal;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v44/memQYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWq8tWZ0Pw86hd0Rk5hkaVc.ttf) format('truetype')}@font-face{font-family:'Open Sans';font-style:italic;font-weight:400;font-stretch:normal;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v44/memQYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWq8tWZ0Pw86hd0Rk8ZkaVc.ttf) format('truetype')}@font-face{font-family:'Open Sans';font-style:italic;font-weight:500;font-stretch:normal;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v44/memQYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWq8tWZ0Pw86hd0Rk_RkaVc.ttf) format('truetype')}@font-face{font-family:'Open Sans';font-style:italic;font-weight:600;font-stretch:normal;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v44/memQYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWq8tWZ0Pw86hd0RkxhjaVc.ttf) format('truetype')}@font-face{font-family:'Open Sans';font-style:italic;font-weight:700;font-stretch:normal;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v44/memQYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWq8tWZ0Pw86hd0RkyFjaVc.ttf) format('truetype')}@font-face{font-family:'Open Sans';font-style:italic;font-weight:800;font-stretch:normal;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v44/memQYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWq8tWZ0Pw86hd0Rk0ZjaVc.ttf) format('truetype')}@font-face{font-family:'Open Sans';font-style:normal;font-weight:300;font-stretch:normal;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v44/memSYaGs126MiZpBA-UvWbX2vVnXBbObj2OVZyOOSr4dVJWUgsiH0C4n.ttf) format('truetype')}@font-face{font-family:'Open Sans';font-style:normal;font-weight:400;font-stretch:normal;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v44/memSYaGs126MiZpBA-UvWbX2vVnXBbObj2OVZyOOSr4dVJWUgsjZ0C4n.ttf) format('truetype')}@font-face{font-family:'Open Sans';font-style:normal;font-weight:500;font-stretch:normal;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v44/memSYaGs126MiZpBA-UvWbX2vVnXBbObj2OVZyOOSr4dVJWUgsjr0C4n.ttf) format('truetype')}@font-face{font-family:'Open Sans';font-style:normal;font-weight:600;font-stretch:normal;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v44/memSYaGs126MiZpBA-UvWbX2vVnXBbObj2OVZyOOSr4dVJWUgsgH1y4n.ttf) format('truetype')}@font-face{font-family:'Open Sans';font-style:normal;font-weight:700;font-stretch:normal;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v44/memSYaGs126MiZpBA-UvWbX2vVnXBbObj2OVZyOOSr4dVJWUgsg-1y4n.ttf) format('truetype')}@font-face{font-family:'Open Sans';font-style:normal;font-weight:800;font-stretch:normal;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v44/memSYaGs126MiZpBA-UvWbX2vVnXBbObj2OVZyOOSr4dVJWUgshZ1y4n.ttf) format('truetype')}.blink-soft{animation:blinker 2s linear infinite}@keyframes blinker{50%{opacity:.4}}.box{-webkit-box-shadow:0 4px 18px rgba(0,0,0,.1);-moz-box-shadow:0 4px 18px rgba(0,0,0,.1);box-shadow:0 4px 18px rgba(0,0,0,.1);box-shadow:2px 4px 12px rgba(0,0,0,.1);background:#FFF;border-radius:15px;transform:translateY(0);transition-delay:0s;position:relative;margin-bottom:15px}.box .box-footer .row,.box .box-toolbar .form-element,.box .box-toolbar .row,.dialog-actions .btn,.dialog-actions .flex,.dialog-actions .row{margin-bottom:0}.box-hover:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(0,0,0,.2)}.box-header{color:#888;background:#FFF;border-radius:15px 15px 0 0}.box-header-collapsed{border-radius:15px}.box .box-top-btn{position:absolute;right:10px;top:10px}.carousel,.carousel-img-wrapper,.input-wrapper{position:relative}.carousel-btn,.input-reset-btn{top:50%;transform:translateY(-50%)}.box .box{-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;border:1px solid var(--border-color)}button:focus-visible{outline:#1D9EFC auto 1px}.btn-circle:active,.btn:active{outline:rgba(29,158,252,.7) solid 3px!important}.btn-circle:focus-visible,.btn:focus-visible{outline:#038df2 solid 2px;outline-offset:2px}.btn{border-radius:15px;font-size:14px;margin:0;text-align:center;cursor:pointer;padding:10px 20px;transition:background .2s cubic-bezier(.4,0,.2,1)}.btn.disabled,.btn[disabled]{opacity:50%;pointer-events:none}.btn-normal{border:none}.btn-outline{background:0 0;color:var(--color)}.btn-link{border:1px solid transparent;background:0 0;color:#1D9EFC}.btn-normal-default{background:var(--btn-bg);border:1px solid var(--btn-bg);color:var(--color)}.btn-outline-default{border:1px solid #a2a2a2;color:var(--color)}.btn-link-default{color:var(--color)}.btn-link-default:hover{background:#ECEDEF}.btn-normal-default:hover,.btn-outline-default:hover{background:var(--btn-bg-darker);border-color:var(--btn-bg-darker)}.btn-normal-primary{background:#1D9EFC;border:1px solid #1D9EFC;color:#FFF}.btn-outline-primary{border:1px solid #1D9EFC;color:#1D9EFC}.btn-link-primary{color:#1D9EFC}.btn-link-primary:hover{background:#e2f1fb}.btn-normal-primary:hover,.btn-outline-primary:hover{color:#FFF;background:#038aed}.btn-normal-alert{background:#ea0835;border:1px solid #ea0835;color:#FFF}.btn-outline-alert{border:1px solid #ea0835;color:#ea0835}.btn-link-alert{color:#ea0835}.btn-link-alert:hover{background:#FCC5C5}.btn-normal-alert:hover,.btn-outline-alert:hover{color:#FFF;background:#c3072c}.btn-normal-success{background:#1bd741;border:1px solid #1bd741;color:#FFF}.btn-outline-success{border:1px solid #1bd741;color:#1bd741}.btn-link-success{color:#1bd741}.btn-link-success:hover{background:#DDFFD4}.btn-normal-success:hover,.btn-outline-success:hover{color:#FFF;background:#16b336}.btn-normal-warning{background:#ffd500;border:1px solid #ffd500}.btn-outline-warning{border:1px solid #ffd500;color:#ca0}.btn-link-warning{color:#ca0}.btn-link-warning:hover{background:#fe9}.btn-normal-warning:hover,.btn-outline-warning:hover{color:#fff;background:#f0c800}.btn-size-large{font-size:20px;padding:15px 30px}.btn-size-small{font-size:12px;font-weight:unset;padding:4px 8px}.btn-circle{border-radius:50%;border:none;height:30px;width:30px;margin:0;padding-top:2px}.btn-circle.disabled,.btn-circle[disabled]{opacity:30%;pointer-events:none;cursor:not-allowed}.btn-circle:active{outline:rgba(29,158,252,.7) solid 3px!important}.btn-circle-bg-clear{background:rgba(0,0,0,.1)}.btn-circle-bg-solid{background:var(--btn-bg)}.btn-circle:hover{background:#1D9EFC}.btn-circle:hover svg{color:#fff!important}.btn-circle-size-default{font-size:1em}.btn-circle-size-small{width:18px;height:18px;padding-top:0;font-size:10px}.btn-circle-size-small svg{margin-left:-2px;margin-top:3px}.btn-circle-size-large{width:48px;height:48px;padding-top:0;font-size:15px}.btn-circle-size-large svg{margin-left:0;margin-top:0}.btn-alert:active{outline:rgba(234,8,53,.7) solid 3px!important}.btn-alert:focus-visible{outline:#c7072d solid 2px;outline-offset:2px}.btn-success:active{outline:rgba(27,215,65,.7) solid 3px!important}.btn-success:focus-visible{outline:#17b737 solid 2px;outline-offset:2px}.btn-warning:active{outline:rgba(255,213,0,.7) solid 3px!important}.btn-warning:focus-visible{outline:#dbb700 solid 2px;outline-offset:2px}.carousel{width:100%;overflow:hidden;background:var(--el-bg);border-radius:15px;user-select:none}.carousel-slide{display:flex;height:100%;will-change:transform}.carousel-img-wrapper{min-width:100%;height:100%;overflow:hidden}.carousel-img{width:100%;height:100%;object-fit:cover;display:block}.checkmark,.slider:before{height:15px;border-radius:50%}.carousel-title{position:absolute;left:0;right:0;bottom:0;background:rgba(0,0,0,.45);color:#fff;padding:15px;font-size:20px;border-radius:0 0 15px 15px}.carousel-btn{position:absolute;z-index:9}.dialog,.dropdown{background:#FFF;transform:translateY(0);position:absolute}.carousel-btn-left{left:15px}.carousel-btn-right{right:15px}.carousel-dots{position:absolute;left:0;right:0;bottom:15px;display:flex;justify-content:center;gap:15px;z-index:9}.carousel-dot-btn{width:15px;height:15px;border-radius:50%;border:none;cursor:pointer;outline:0;transition:backgrund .2s}.dialog-title,.table .underlined td,.table .underlined th,.table thead td,.table thead th,.tabs{border-bottom:solid 1px var(--border-color)}.dialog{-webkit-box-shadow:0 4px 18px rgba(0,0,0,.1);-moz-box-shadow:0 4px 18px rgba(0,0,0,.1);box-shadow:0 4px 18px rgba(0,0,0,.1);box-shadow:2px 4px 12px rgba(0,0,0,.1);border-radius:15px;transition-delay:0s;left:50%;transform:translateX(-50%);min-width:320px;max-width:90vw;width:auto;margin:0;z-index:999;display:flex}.dialog-hover:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(0,0,0,.2)}.dialog h1,.dialog h2,.dialog h3{margin:0}.dialog-title{padding:15px;border-radius:15px 15px 0 0}.dialog-content{padding:15px}.dialog-actions{border-top:solid 1px var(--border-color);padding:15px}.dialog-close{position:absolute;top:10px;right:15px}.dialog-close button:focus,.dialog-close button:focus-visible{outline:#038df2 solid 2px;outline-offset:2px}.dialog .box{-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;border:1px solid var(--border-color)!important}.dropdown,.navbar-menu .navbar-menu-item>.navbar-submenu{-webkit-box-shadow:0 4px 18px rgba(0,0,0,.1);transition:transform .25s ease,box-shadow .25s ease}.dialog:focus{outline:0}.dropdown{-moz-box-shadow:0 4px 18px rgba(0,0,0,.1);box-shadow:0 4px 18px rgba(0,0,0,.1);box-shadow:2px 4px 12px rgba(0,0,0,.1);border-radius:15px;transition-delay:0s;border:1px solid var(--border-color);padding:5px 0;z-index:99;min-width:400px;max-width:600px;left:0;cursor:pointer;margin:0}.dropdown-hover:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(0,0,0,.2)}.dropdown li{list-style:none;margin:0}.dropdown-item{padding:8px 12px}.dropdown-item:hover{background-color:var(--el-bg-highlight)}.dropdown-active{background-color:#1D9EFC!important;color:#fff}.navbar-menu-item .dropdown a{margin:0!important;padding:0!important;color:var(--color)!important}.flex{display:flex;gap:15px;margin-bottom:15px}.flex-justify-start{justify-content:flex-start}.flex-justify-end{justify-content:flex-end}.flex-justify-center,.loader-squares{justify-content:center}.flex-justify-between{justify-content:space-between}.flex-align-start{align-items:flex-start}.flex-align-end{align-items:flex-end}.flex-align-center{align-items:center}.flex-align-stretch{align-items:stretch}.flex-align-baseline{align-items:baseline}.flex[data-cols]{container-type:inline-size;flex-wrap:wrap;align-items:stretch}.flex[data-cols]>.flex-item{flex:0 0 calc((100% - (var(--flex-cols,1) - 1) * var(--flex-gap,15px))/ var(--flex-cols,1));max-width:calc((100% - (var(--flex-cols,1) - 1) * var(--flex-gap,15px))/ var(--flex-cols,1));box-sizing:border-box}@container (max-width:500px){.flex-item{flex:0 0 calc((100% - (var(--flex-phone-cols,1) - 1) * var(--flex-gap,15px))/ var(--flex-phone-cols,1))!important;max-width:calc((100% - (var(--flex-phone-cols,1) - 1) * var(--flex-gap,15px))/ var(--flex-phone-cols,1))!important}}@container (min-width:501px) and (max-width:900px){.flex-item{flex:0 0 calc((100% - (var(--flex-tablet-cols,2) - 1) * var(--flex-gap,15px))/ var(--flex-tablet-cols,2))!important;max-width:calc((100% - (var(--flex-tablet-cols,2) - 1) * var(--flex-gap,15px))/ var(--flex-tablet-cols,2))!important}}input:focus,select:focus,textarea:focus{outline:rgba(29,158,252,.7) solid 3px;border-color:#4fb4fd}.input-inside,button,input,select,textarea{background:var(--input-bg);color:var(--color)}.input-inside,input,select,textarea{padding:10px;font-size:14px;line-height:1.5em;border-radius:15px;border:1px solid var(--border-color);-webkit-transition:border linear .2s,box-shadow linear .2s;transition:border linear .2s,box-shadow linear .2s;margin-bottom:0!important}.form-element,fieldset,fieldset label{margin-bottom:15px}.input-inside.large,input.large,select.large,textarea.large{font-size:25px;padding:6px}.input-inside:hover,input:hover,select:hover,textarea:hover{-webkit-transition:border linear .2s,box-shadow linear .2s;transition:border linear .2s,box-shadow linear .2s;border-color:#4fb4fd}.editable{width:100%;min-height:1.4em;padding:2px 0;font-size:14px;line-height:1.5em;border-radius:15px;border:1px solid transparent;background:0 0;color:var(--color);white-space:pre-wrap;word-break:break-word;outline:0;margin-bottom:0!important}.editable:focus{background:var(--input-bg);outline:rgba(29,158,252,.7) solid 3px;border-color:#1D9EFC}.editable[data-empty=true]::before{content:attr(data-placeholder);color:#888;pointer-events:none}.editable:focus::before{content:''}.inline-elements .form-element,.toolbar .form-element{margin-bottom:0}input[type=color]{border:none;padding:0}.input-alert{-webkit-transition:none!important;transition:none!important;border-color:#ea0835!important}.input-alert:focus{outline:rgba(234,8,53,.7) solid 3px!important}.code-editor:focus,.input-inside input:focus,.input-inside select:focus{outline:0!important}.input-reset-btn{position:absolute;right:8px;z-index:2}.input-inside{padding:0 4px 0 0;position:relative}.input-btns,.slider,.slider:before{position:absolute}.input-inside select{border:none;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;margin:0;padding:0 0 0 4px;color:#888;border-right:solid 1px var(--border-color);background:var(--input-bg);border-radius:0;height:40px}.badge .btn-circle,.label .btn-circle,.swith-label{margin-left:5px}.input-focus,.input-inside:focus{border-color:#1D9EFC;outline:rgba(29,158,252,.7) solid 3px}.input-inside select:focus{background:#e2f1fb}.input-inside :first-child{border-radius:15px 0 0 15px}.input-inside :last-child{border-radius:0 15px 15px 0}.input-inside .btn-circle{height:24px;width:24px}.input-btns{right:5px;top:5px}.label-inline{padding:0!important}.label-inline label{color:#888;padding:4px 8px}.label-inline select{border-right:none!important;border-left:solid 1px var(--border-color);color:var(--color)}.input-inside{height:auto}.input-inside:after,.input-inside:before{display:table;line-height:0}.input-inside button,.input-inside i,.input-inside input,.input-inside span{display:inline-block;margin-top:0;margin-bottom:0;vertical-align:middle}.input-inside input,.input-inside textarea{border:0!important;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}.input-inside:focus-within{outline:rgba(29,158,252,.7) solid 3px;border-color:#1D9EFC}.input-inside input:focus,.input-inside select:focus{border-color:transparent}input.disabled,input[disabled]{background-color:var(--el-bg-color);border:none;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;padding:4px 0!important}input:-moz-read-only,input:read-only{color:brown;border:none!important}input[type=checkbox],input[type=radio]{-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075);-moz-box-shadow:inset 0 1px 1px rgba(0,0,0,.075);box-shadow:inset 0 1px 1px rgba(0,0,0,.075)}select{margin-top:0;color:var(--color)}textarea{resize:none;height:auto}label{display:block}label input,label select,label textarea,td label{margin-bottom:0}fieldset{border:1px solid var(--border-color);border-radius:15px}legend{color:var(--dark-gray);padding:0 5px}.form-inline:after,.form-inline:before{display:table;line-height:0}.form-inline button,.form-inline input,.form-inline label,.form-inline select,.form-inline textarea{display:inline-block;margin-top:0;margin-bottom:0;vertical-align:middle}.toolbar-group:after,.toolbar-group:before{display:table;line-height:0}.toolbar-group button,.toolbar-group input,.toolbar-group label,.toolbar-group select,.toolbar-group textarea{display:inline-block;margin-top:0;margin-bottom:0;vertical-align:middle;margin-right:-5px;border-right:solid 1px #FFF;border-radius:0}.toolbar-group button:first-child,.toolbar-group input:first-child,.toolbar-group label:first-child,.toolbar-group select:first-child,.toolbar-group textarea:first-child{border-radius:15px 0 0 15px}.toolbar-group button:last-child,.toolbar-group input:last-child,.toolbar-group label:last-child,.toolbar-group select:last-child,.toolbar-group textarea:last-child{border-radius:0 15px 15px 0;border-right:solid 1px var(--border-color)}::placeholder{color:#888;opacity:1}:-ms-input-placeholder{color:var(--border-color)}::-ms-input-placeholder{color:var(--border-color)}label.switch{margin-top:-5px}.switch{position:relative;display:inline-block;width:32px;height:19px}.switch input{opacity:0;width:0;height:0;outline:0}.form-switch{display:inline-block}.slider{-webkit-box-shadow:inset 0 1px 3px rgb(0 0 0 / 10%)!important;-moz-box-shadow:inset 0 1px 3px rgb(0 0 0 / 10%)!important;box-shadow:inset 0 1px 3px rgb(0 0 0 / 10%)!important;border-radius:15px;-webkit-transition:background-color .1s;background-color:#ccc;bottom:-1px;cursor:pointer;left:0;right:1px;top:1px;transition:background-color .1s}.slider:before{left:2px;width:15px;-webkit-transition:.1s;background-color:#fff;bottom:2px;transition:.1s}input:checked+.slider{background-color:#1bd741}input:focus+.slider{box-shadow:0 0 1px #1bd741}input:checked+.slider:before{transform:translateX(12px)}.switch input[type=checkbox]:focus+.slider{outline:0}.switch input[type=checkbox]:focus-visible+.slider{outline:rgba(29,158,252,.7) solid 3px;border-color:#1D9EFC;outline-offset:2px}.cust-radio input[type=radio]:focus+.checkmark{outline:0}.cust-radio input[type=radio]:focus-visible+.checkmark{outline:rgba(29,158,252,.7) solid 3px;border-color:#1D9EFC;outline-offset:2px}.input-label,.input-label-alert{display:block;font-size:12px;margin-bottom:2px}.input-label{color:#888}.input-label-alert{color:#ea0835}.cust-radio{display:block;position:relative;padding-left:18px;padding-right:10px;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.cust-radio input{position:absolute;opacity:0;cursor:pointer;height:0;width:0}.checkmark{position:absolute;top:4px;left:0;width:15px;background-color:var(--border-color);-webkit-box-shadow:inset 0 1px 3px rgb(0 0 0 / 20%)!important;-moz-box-shadow:inset 0 1px 3px rgb(0 0 0 / 20%)!important;box-shadow:inset 0 1px 3px rgb(0 0 0 / 20%)!important}.cust-radio input:checked~.checkmark{background-color:#1D9EFC}.checkmark:after{position:absolute;display:none}.cust-radio input:checked~.checkmark:after{display:block}.cust-radio .checkmark:after{top:5px;left:5px;width:5px;height:5px;border-radius:50%;background:#fff}.hidden-arrows::-webkit-inner-spin-button,.hidden-arrows::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.information,.row{margin-bottom:15px}.code-editor{color:#7b7b7b;font-size:12px;border:0;padding:0;width:100%}.information,.label{border-radius:15px}.information{padding:15px;position:relative}.information-icon{position:absolute;top:15px;left:15px;font-size:1.2em;opacity:.75}.information-content-icon{padding-left:30px}.information-large{font-size:25px;padding:30px}.information-default{background:var(--el-bg-highlight)}.information-primary{background:#e2f1fb;color:#1D9EFC}.information-primary hr{border-bottom:solid 1px #1D9EFC}.information-warning{background:#ffd500;color:var(--color)}.information-success{background:#DDFFD4;color:#18bc39}.information-success hr{border-bottom:solid 1px #1bd741}.information-alert{background:#FCC5C5;color:#ea0835}.information-alert hr{border-bottom:solid 1px #ea0835}.badge,.label{cursor:default;display:inline-block;line-height:1.5em;color:#fff;vertical-align:baseline;white-space:nowrap;position:relative}.badge:empty,.label:empty{display:none}.badge-default,.label-default{background-color:var(--btn-bg);color:#7b7b7b}.badge.badge-primary,.badge.label-primary,.label.badge-primary,.label.label-primary{background-color:#1D9EFC}.badge.badge-warning,.badge.label-warning,.label.badge-warning,.label.label-warning{color:var(--color);background-color:#ffd500}.badge.badge-success,.badge.label-success,.label.badge-success,.label.label-success{background-color:#1bd741}.badge.badge-alert,.badge.label-alert,.label.badge-alert,.label.label-alert{background-color:#ea0835}.badge{border-radius:20px;padding:2px 10px}.badge-small{padding:0 10px;font-size:12px}.badge-closable{padding-right:0}.clear-list ul,ul.clear-list{margin:0 0 15px;padding:0}.clear-list ul li,ul.clear-list li{margin:0;padding:0;list-style:none;line-height:1.5em}.inline-list ul,ul.inline-list{display:flex;gap:15px;margin:0 0 15px;padding:0}.inline-list ul li,ul.inline-list li{padding:0;margin:0;list-style:none}.loader-squares{display:flex;gap:8px;align-items:center;height:40px}.loader-square{width:16px;height:16px;border-radius:15px;animation:loader-grow .7s cubic-bezier(.4,0,.2,1) infinite;transform-origin:center;background-color:#1895ff}.loader-square:nth-child(1){animation-delay:0s}.loader-square:nth-child(2){animation-delay:.15s}.loader-square:nth-child(3){animation-delay:.3s}.loader-square:nth-child(4){animation-delay:.45s}.loader-square:nth-child(5){animation-delay:.6s}@keyframes loader-grow{0%,100%{transform:scale(1);background-color:#1895ff}30%{transform:scale(1.5);background-color:#24d3fc}60%{transform:scale(1);background-color:#1fb5fe}}.loader-lock{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.1);z-index:9990}.loader-wrapper{position:relative;z-index:9999}.loader-full{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}header{background:#212121;border-bottom:solid 3px #1D9EFC}.navbar-responsive{-webkit-backdrop-filter:blur(5px);align-items:center;backdrop-filter:blur(5px);color:#fff;display:flex;min-height:60px;padding:0 15px;position:relative;z-index:100}.navbar-logo img{height:40px}.navbar-main{flex:1}.navbar-menu{display:flex;list-style:none;margin:0;padding:0}.navbar-menu .navbar-menu-item{position:relative;cursor:pointer;display:inline-block;z-index:888}.navbar-menu .navbar-menu-item a{color:#fff;display:block;padding:19px 30px}.navbar-menu .navbar-menu-item>.navbar-submenu{display:none;position:absolute;left:0;top:100%;min-width:160px;z-index:999;color:var(--color)!important;padding:15px 0;-moz-box-shadow:0 4px 18px rgba(0,0,0,.1);box-shadow:0 4px 18px rgba(0,0,0,.1);box-shadow:2px 4px 12px rgba(0,0,0,.1);background:#FFF;border-radius:15px;transform:translateY(0);transition-delay:0s;border:1px solid var(--border-color)}.navbar-menu .navbar-menu-item>.navbar-submenu a{color:var(--color);padding:10px 15px}.navbar-menu .navbar-menu-item>.navbar-submenu-hover:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(0,0,0,.2)}.navbar-menu .navbar-menu-item>.navbar-submenu li:hover{background-color:#1D9EFC;color:#fff}.navbar-menu .navbar-menu-item>.navbar-submenu li:hover>a{color:#fff}.navbar-icon-area,.navbar-menu,.navbar-menu-item.has-submenu>.navbar-submenu{color:#fff;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.navbar-menu-item.open>.navbar-submenu,.navbar-menu-item:hover>.navbar-submenu{display:block}.navbar-icon-btn:hover,.navbar-menu-item:hover,.navbar-submenu-item:hover{background:rgba(255,255,255,.08)}.navbar-submenu{list-style:none;margin:0;padding:0}.navbar-icons{display:flex;gap:.5rem}.navbar-icons .navbar-icon-btn{color:#fff;background:0 0;border:none;cursor:pointer;font-size:1.2em;height:40px;width:40px;display:flex;align-items:center;justify-content:center;opacity:.8}.navbar-icons .navbar-icon-btn:hover{opacity:1}.navbar-hamburger{display:none;background:0 0;border:none;font-size:1.5em;margin-left:1rem;cursor:pointer;color:#fff}.tab-content,.tabs .tab.active{background:#FFF;position:relative}.navbar-icon-area{-webkit-box-shadow:0 4px 18px rgba(0,0,0,.1);-moz-box-shadow:0 4px 18px rgba(0,0,0,.1);box-shadow:0 4px 18px rgba(0,0,0,.1);box-shadow:2px 4px 12px rgba(0,0,0,.1);background:#FFF;border-radius:15px;transform:translateY(0);transition:transform .25s ease,box-shadow .25s ease;transition-delay:0s;display:none;position:absolute;right:1rem;top:100%;z-index:20}.navbar-icon-area-hover:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(0,0,0,.2)}.navbar-icon-area.open{display:block}.pagination{padding-bottom:15px}.pagination-bar{width:100%;display:flex;justify-content:center;align-items:center;padding:15px 0}.pagination-bar-inner{display:flex;align-items:center;gap:15px;min-width:150px;max-width:220px}.pagination-input{width:48px;text-align:center;border-radius:15px;border:1px solid #ccc;padding:4px 0;font-size:1em}.row{display:flex;flex-wrap:wrap;width:100%;gap:15px}.row-item{box-sizing:border-box}.list-scroller-wrapper{width:100%;position:relative}.list-scroller{display:flex;overflow-x:auto;scroll-behavior:smooth;gap:15px;width:100%;scrollbar-width:none;-ms-overflow-style:none;margin:0;padding:5px}.clipped,.image-zoom,.skeleton,.thumb{overflow:hidden}.list-scroller::-webkit-scrollbar{display:none}.list-scroller li{margin:0;padding:0;list-style:none}.list-scroller-btn{position:absolute;z-index:9;background:#CCC;top:50%;transform:translateY(-50%)}.skeleton,.snackbar{border-radius:15px;position:relative}.image-zoom-caption,.snackbar-stack,.tooltip{transform:translateX(-50%)}.list-scroller-btn-left{left:-15px}.list-scroller-btn-right{right:-15px}.skeleton{background:linear-gradient(90deg,var(--btn-bg) 25%,#bbb 50%,var(--btn-bg) 75%);background-size:200% 100%;animation:skeleton-shimmer 2s infinite linear;padding:15px;margin-bottom:15px}@keyframes skeleton-shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}.snackbar{padding:15px 60px 15px 15px;color:#FFF;margin:auto auto 15px;box-sizing:border-box;min-width:500px;-webkit-box-shadow:0 3px 10px rgba(0,0,0,.3);-moz-box-shadow:0 3px 10px rgba(0,0,0,.3);box-shadow:0 3px 10px rgba(0,0,0,.3)}.snackbar .snackbar-close{position:absolute;top:10px;right:10px}.snackbar-stack{position:fixed;bottom:15px;left:50%;z-index:9999;display:flex;flex-direction:column;align-items:center}table{max-width:100%;border-collapse:collapse;border-spacing:0}.table{cursor:default;border-bottom:solid 1px transparent;margin-bottom:15px;border-collapse:separate;background:var(--el-bg)}.table thead td,.table thead th{background-color:var(--el-bg);color:#888;font-weight:400;position:sticky;top:0;z-index:5}.table thead td a,.table thead td button.anchor,.table thead th a,.table thead th button.anchor{color:#888!important}.table thead td a:hover,.table thead td button.anchor:hover,.table thead th a:hover,.table thead th button.anchor:hover{text-decoration:underline;color:#6f6f6f}.table thead td:first-child,.table thead th:first-child{border-radius:15px 0 0}.table thead td:last-child,.table thead th:last-child{border-radius:0 15px 0 0}.table td,.table th{padding:8px 6px;line-height:1.5em}.content,.tab-content,.tabs .tab{padding:15px}.table td .form-element,.table th .form-element{margin-bottom:0!important}.table .input-wrapper,.table .uneditable-input,.table input,.table select,.table td .btn,.table td .row,.table textarea,.table th .btn,.table th .row{margin-bottom:0}.table tbody td,.table tbody th{border-top:solid 1px transparent}.border-top,.table .overlined td,.table .overlined th{border-top:solid 1px var(--border-color)}.table tr.valign-middle td{vertical-align:middle}.table tr.valign-top td{vertical-align:top}.table tr.valign-bottom td{vertical-align:bottom}.table-striped tbody tr:nth-child(odd){background-color:var(--el-bg-highlight)}.table-hover tbody tr:hover>td{background-color:#cce6f8}.table-hover tbody tr:hover>td.highlight-primary{background-color:#b5dbf5}.table-hover tbody tr:hover>td.highlight-success{background-color:#b5ffa1}.table-hover tbody tr:hover>td.highlight-alert{background-color:#f99595}.table-hover tbody tr:hover>td.highlight-warning{background-color:#ffe666}.table td.highlight-primary,.table th.highlight-primary,.table tr.highlight-primary td,.table tr.highlight-primary th{background-color:#e2f1fb}.table td.highlight-alert,.table th.highlight-alert,.table tr.highlight-alert td,.table tr.highlight-alert th{background-color:#FCC5C5}.table td.highlight-success,.table th.highlight-success,.table tr.highlight-success td,.table tr.highlight-success th{background-color:#DDFFD4}.table td.highlight-warning,.table th.highlight-warning,.table tr.highlight-warning td,.table tr.highlight-warning th{background-color:#fe9}.tabs{display:flex}.tabs .tab{margin:0;cursor:pointer;border:1px solid transparent;border-radius:15px 15px 0 0}.tabs .tab.active{border:1px solid var(--border-color);border-bottom:solid 1px #FFF;color:#1D9EFC;z-index:9;bottom:-1px}.tabs .tab.disabled,.tabs .tab[disabled]{color:#a2a2a2;pointer-events:none}.tab-content{border:1px solid var(--border-color);border-top:solid 1px transparent;border-radius:0 0 15px 15px;z-index:1}.thumb,.thumb img{border-radius:15px}.image{display:flex}.image-left{justify-content:flex-start}.image-right{justify-content:flex-end}.image-center{justify-content:center}.thumb{background-color:#FFF!important;background-position:center center!important;background-repeat:no-repeat!important;background-size:100%!important;box-sizing:border-box;height:80px;position:relative;width:100%}.thumb.thumb-bordered{border:1px solid var(--border-color)}.image-zoom-caption,.rounded,.tooltip{border-radius:15px}.thumb-small{width:56px;height:56px}.thumb-smallest{width:32px;height:32px}.thumb-medium{width:80px;height:80px}.thumb-large{width:160px;height:160px}.thumb-largest{width:240px;height:240px}.thumb .center-by-width{height:auto;position:absolute;top:50%;transform:translate(0,-50%);width:100%}.thumb .center-by-height{display:block;margin-left:auto;margin-right:auto;width:auto;height:100%}ul.tree li:after,ul.tree li:before{height:1.6em;content:""}.thumb .thumb-corner{position:absolute;top:-13px;right:-13px}.image-zoom{position:relative;touch-action:none;background:#fff}.image-zoom img{position:absolute;user-select:none}.image-zoom-caption{position:absolute;bottom:15px;background:rgba(0,0,0,.25);color:#fff;padding:5px 15px;font-size:12px;z-index:9;left:50%;display:block}.tooltip-wrapper{position:relative;display:inline-block}.tooltip{position:absolute;bottom:120%;left:50%;background:rgba(0,0,0,.7);color:#fff;padding:6px 12px;white-space:nowrap;z-index:100;font-size:.9em;box-shadow:0 2px 8px rgba(0,0,0,.15)}ul.tree{list-style:none;padding:0;margin:0 0 15px}ul.tree ul.tree{margin-left:-16px;margin-top:4px;margin-bottom:0}ul.tree li{margin:0;padding:0 7px;line-height:2rem;border-left:1px solid #646464;cursor:default;position:relative}ul.tree li .tree-content{display:inline-block;margin:3px 0 0 15px}ul.tree li .tree-content-button{display:inline-block;margin:3px 0 0 40px}ul.tree li .tree-last-content{display:inline-block;margin:3px 0 0 15px}ul.tree li .tree-button{position:absolute;top:3px;left:15px;z-index:5}ul.tree li:last-child{border-left:none;line-height:15px!important}ul.tree li:last-child:before{border-left:1px solid #646464}ul.tree li:before{position:absolute;top:-3px;width:15px;color:#fff;border-bottom:1px solid #646464;display:inline-block;left:0}ul.tree li:after{position:relative;top:-.3em;width:15px;color:#fff;display:inline-block;left:-7px}small{font-size:12px}.strong{font-weight:700}.text-content{line-height:1.5}.text-size-normal{font-size:14px}.text-size-large{font-size:25px}.note,.text-size-small{font-size:12px}.margin-top{margin-top:15px}.margin-bottom{margin-bottom:15px}.collapesed-bottom{margin-bottom:0}.default-color{color:var(--color)!important}.primary-color{color:#1D9EFC!important}.success-color{color:#1bd741!important}.alert-color{color:#ea0835!important}.active-color{color:#64FA00!important}.gray{color:#888}.light-gray{color:#a2a2a2}.apply-color.gray a{color:#888}.apply-color.gray a:hover{text-decoration:underline}.bg-primary{background-color:#1D9EFC;color:#fff}.bg-success{background-color:#1bd741;color:#fff}.bg-alert{background-color:#ea0835;color:#fff}.bg-warning{background-color:#ffd500;color:#272729}.bg-white{background-color:#FFF;color:#272729}.bg-default{background-color:#7b7b7b;color:#fff}.bg-alert .btn-circle-bg-clear svg,.bg-default .btn-circle-bg-clear svg,.bg-primary .btn-circle-bg-clear svg,.bg-success .btn-circle-bg-clear svg{color:#fff!important}.inline{display:inline-block;vertical-align:middle}.note{color:#888}.clipped{text-wrap:nowrap;display:inline-block}.clipped-dots{position:absolute;margin-left:1px}.relative,.wrapper{position:relative}.absolute,.corner-btn{position:absolute}.corner-btn{right:15px;top:15px}.component-locker,.overlay{background:var(--overlay-color);height:100%;left:0;top:0;transition:.2s;width:100%}.border-bottom{border-bottom:solid 1px var(--border-color)}.center{text-align:center}.right{text-align:right}.left{text-align:left}.visible{visibility:visible}.invisible{visibility:hidden}.hidden{display:none}.expanded{width:100%;margin-bottom:15px}.clickable{cursor:pointer}.clickable:hover{outline:#1D9EFC solid 2px}.bordered{border:1px solid var(--border-color);border-radius:15px}.bordered-primary{border-color:#1D9EFC}.bordered-top{border-top:solid 1px var(--border-color)}.bordered-bottom{border-bottom:solid 1px var(--border-color)}.overlay{position:fixed;z-index:99}.component-locker{border-radius:15px;position:absolute;z-index:9}.outline-primary{outline:#1D9EFC dashed 1px}.outline-success{outline:#1bd741 dashed 1px}.widget{box-shadow:2px 4px 12px rgba(0,0,0,.1);background:#FFF;border-radius:15px;transform:translateY(0);transition:transform .25s ease,box-shadow .25s ease;transition-delay:0s}.widget-hover:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(0,0,0,.2)}.wrapper{margin:auto}.wrapper-large{width:1100px}.wrapper-large .role-mainside{width:835px}.wrapper-large .role-sidebar{width:250px}.wrapper-large .role-half{width:550px}.wrapper-large .box .role-mainside,.wrapper-large .box .role-sidebar{width:820px}.wrapper-small{width:366.67px}.wrapper-medium{width:550px}@-ms-viewport{width:device-width}@media (max-width:500px){body{font-size:14px}h1,h2,h3{font-size:1.1em}.wrapper-default,.wrapper-large{width:96%;margin:auto}.row-item{flex:0 0 100%!important;max-width:100%!important}.btn,.expanded-phone,.snackbar{width:100%}.dialog{width:95%!important}}@media (min-width:501px) and (max-width:900px){body{font-size:14px}h1{font-size:1.3em}h2,h3{font-size:1.1em}.wrapper-default,.wrapper-large{width:96%;margin:auto}.row-item{flex:0 0 calc(50% - (15px / 2))!important;max-width:calc(50% - (15px / 2))!important}.snackbar{width:100%}}@media (max-width:900px){.navbar-menu{flex-direction:column;display:none;background:#fff;position:absolute;left:0;top:56px;width:100%;box-shadow:0 4px 16px rgba(0,0,0,.08)}.navbar-main.open .navbar-menu{display:flex}.navbar-hamburger{display:block}.navbar-menu-item{width:100%}.navbar-icons{margin-left:auto}}
+.checkmark:after,.clearfix:after,.clearfix:before,.form-inline:after,.form-inline:before,.input-inside:after,.input-inside:before,.slider:before,.toolbar-group:after,.toolbar-group:before{content:""}.clearfix:after,.form-inline:after,.input-inside:after,.toolbar-group:after{clear:both}.input-inside,body,button,input,select,textarea{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display",system-ui,sans-serif}.app-layout,.dialog{flex-direction:column}.app-layout,body,html{box-sizing:border-box}.btn,a,button.anchor{text-decoration:none;cursor:pointer}.clearfix:after,.clearfix:before{display:table;line-height:0}.badge,.clear-list ul li,.editable,.input-inside,.label,.table td,.table th,body,h1,h2,h3,h4,h5,h6,input,pre,select,textarea{line-height:1.5em}.widget-hover{box-shadow:0 6px 10px rgba(0,0,0,.2)}.box,.dialog{-moz-box-shadow:0 4px 18px rgba(0,0,0,.1);transition:transform .25s ease,box-shadow .25s ease}body{background:var(--body-bg);color:var(--color);font-size:14px;font-weight:300}.code-editor,code,pre{font-family:monospace}body,html{height:100%;margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-weight:300;margin:0 0 15px;padding:0}b,h4,h5,h6,strong{font-weight:500}h1{font-size:25px}h2{font-size:20px}h3{font-size:16px}h4,h5,h6{font-size:14px}small{font-size:12px}.btn,code,pre{font-size:14px}a,button.anchor{color:#1D9EFC;background:0 0;border:none;padding:0}a:hover,button.anchor:hover{color:#0390f7}p{margin:0 0 15px}code,pre{color:#7b7b7b}pre{background:var(--body-bg);border-radius:15px;border:1px solid var(--border-color);overflow:auto;padding:15px;text-wrap:wrap}.btn,hr{border:none}hr{border-bottom:solid 1px var(--border-color);margin:15px 0}.app-layout{min-height:100%;display:flex}.btn,.editable,.input-inside,input,select,textarea{display:inline-block;vertical-align:middle;box-sizing:border-box}.app-body{flex-grow:1}.app-footer,.app-header{flex-grow:0;flex-shrink:0}.wrapper .span-side{width:250px}.wrapper .span-double{width:835px}.wrapper .adds-4 .span-add{width:263.75px}.wrapper .adds-3 .span-add{width:356.67px}.wrapper .span-half{width:542.5px}:root{--base-margin:15px}.theme-light,:root{--color:#272729;--btn-bg:#ECEDEF;--btn-bg-darker:#dee0e3;--el-bg:#FFFFFF;--el-bg-highlight:#f2f5f7;--body-bg:#f1f5f8;--border-color:#DDD;--overlay-color:rgba(0, 0, 0, 0.2);--input-bg:#FFFFFF}.blink-soft{animation:blinker 2s linear infinite}@keyframes blinker{50%{opacity:.4}}.box{-webkit-box-shadow:0 4px 18px rgba(0,0,0,.1);box-shadow:0 4px 18px rgba(0,0,0,.1);box-shadow:2px 4px 12px rgba(0,0,0,.1);background:#FFF;border-radius:15px;transform:translateY(0);transition-delay:0s;position:relative;margin-bottom:15px}.box .box-footer .row,.box .box-toolbar .form-element,.box .box-toolbar .row,.dialog-actions .btn,.dialog-actions .flex,.dialog-actions .row{margin-bottom:0}.box-hover:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(0,0,0,.2)}.box-header{color:#888;background:#FFF;border-radius:15px 15px 0 0}.box-header-collapsed{border-radius:15px}.box .box-top-btn{position:absolute;right:10px;top:10px}.box .box{-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;border:1px solid var(--border-color)}button:focus-visible{outline:#1D9EFC auto 1px}.btn-circle:active,.btn:active{outline:rgba(29,158,252,.7) solid 3px!important}.btn-circle:focus-visible,.btn:focus-visible{outline:#038df2 solid 2px;outline-offset:2px}.btn{border-radius:15px;margin:0;text-align:center;padding:10px 20px;transition:background .2s cubic-bezier(.4,0,.2,1)}.btn.disabled,.btn[disabled]{opacity:50%;pointer-events:none}.btn-normal{border:none}.btn-outline{background:0 0;color:var(--color)}.btn-link{border:1px solid transparent;background:0 0;color:#1D9EFC;font-weight:700}.btn-normal-default{background:var(--btn-bg);border:1px solid var(--btn-bg);color:var(--color)}.btn-outline-default{border:1px solid #a2a2a2;color:var(--color)}.btn-link-default{color:var(--color)}.btn-link-default:hover{background:#ECEDEF}.btn-normal-default:hover,.btn-outline-default:hover{background:var(--btn-bg-darker);border-color:var(--btn-bg-darker)}.btn-normal-primary{background:#1D9EFC;border:1px solid #1D9EFC;color:#FFF}.btn-outline-primary{border:1px solid #1D9EFC;color:#1D9EFC}.btn-link-primary{color:#1D9EFC}.btn-link-primary:hover{background:#e2f1fb}.btn-normal-primary:hover,.btn-outline-primary:hover{color:#FFF;background:#038aed}.btn-normal-alert{background:#ea0835;border:1px solid #ea0835;color:#FFF}.btn-outline-alert{border:1px solid #ea0835;color:#ea0835}.btn-link-alert{color:#ea0835}.btn-link-alert:hover{background:#FCC5C5}.btn-normal-alert:hover,.btn-outline-alert:hover{color:#FFF;background:#c3072c}.btn-normal-success{background:#38c153;border:1px solid #38c153;color:#FFF}.btn-outline-success{border:1px solid #38c153;color:#38c153}.btn-link-success{color:#38c153}.btn-link-success:hover{background:#DDFFD4}.btn-normal-success:hover,.btn-outline-success:hover{color:#FFF;background:#2fa145}.btn-normal-warning{background:#ffd500;border:1px solid #ffd500}.btn-outline-warning{border:1px solid #ffd500;color:#ca0}.btn-link-warning{color:#ca0}.btn-link-warning:hover{background:#fe9}.btn-normal-warning:hover,.btn-outline-warning:hover{color:#fff;background:#f0c800}.btn-size-large{font-size:20px;padding:15px 30px}.btn-size-small{font-size:12px;font-weight:unset;padding:4px 8px}.btn-circle{border-radius:50%;border:none;height:30px;width:30px;margin:0;padding-top:2px}.btn-circle.disabled,.btn-circle[disabled]{opacity:30%;pointer-events:none;cursor:not-allowed}.btn-circle:active{outline:rgba(29,158,252,.7) solid 3px!important}.btn-circle-bg-clear{background:rgba(0,0,0,.1)}.btn-circle-bg-solid{background:var(--btn-bg)}.btn-circle:hover{background:#1D9EFC}.carousel,.table{background:var(--el-bg)}.btn-circle:hover svg{color:#fff!important}.btn-circle-size-default{font-size:1em}.btn-circle-size-small{width:18px;height:18px;padding-top:0;font-size:10px}.btn-circle-size-small svg{margin-left:-2px;margin-top:3px}.btn-circle-size-large{width:48px;height:48px;padding-top:0;font-size:15px}.btn-circle-size-large svg{margin-left:0;margin-top:0}.btn-alert:active{outline:rgba(234,8,53,.7) solid 3px!important}.btn-alert:focus-visible{outline:#c7072d solid 2px;outline-offset:2px}.btn-success:active{outline:rgba(56,193,83,.7) solid 3px!important}.btn-success:focus-visible{outline:#30a547 solid 2px;outline-offset:2px}.btn-warning:active{outline:rgba(255,213,0,.7) solid 3px!important}.btn-warning:focus-visible{outline:#dbb700 solid 2px;outline-offset:2px}.carousel{width:100%;position:relative;overflow:hidden;border-radius:15px;user-select:none}.carousel-slide{display:flex;height:100%;will-change:transform}.carousel-img-wrapper{min-width:100%;height:100%;position:relative;overflow:hidden}.carousel-btn,.carousel-dots,.carousel-title,.dialog,.dialog-close,.dropdown{position:absolute}.carousel-img{width:100%;height:100%;object-fit:cover;display:block}.carousel-title{left:0;right:0;bottom:0;background:rgba(0,0,0,.45);color:#fff;padding:15px;font-size:20px;border-radius:0 0 15px 15px}.carousel-btn{top:50%;transform:translateY(-50%);z-index:9}.carousel-btn-left{left:15px}.carousel-btn-right{right:15px}.carousel-dots{left:0;right:0;bottom:15px;display:flex;justify-content:center;gap:15px;z-index:9}.carousel-dot-btn{width:15px;height:15px;border-radius:50%;border:none;cursor:pointer;outline:0;transition:backgrund .2s}.dialog-title,.table .underlined td,.table .underlined th,.table thead td,.table thead th,.tabs{border-bottom:solid 1px var(--border-color)}.dialog{-webkit-box-shadow:0 4px 18px rgba(0,0,0,.1);box-shadow:0 4px 18px rgba(0,0,0,.1);box-shadow:2px 4px 12px rgba(0,0,0,.1);background:#FFF;border-radius:15px;transform:translateY(0);transition-delay:0s;left:50%;transform:translateX(-50%);min-width:320px;max-width:90vw;width:auto;margin:0;z-index:999;display:flex}.dropdown,.navbar-icon-area{transition:transform .25s ease,box-shadow .25s ease}.dropdown,.slider{left:0;cursor:pointer}.dialog-hover:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(0,0,0,.2)}.dialog h1,.dialog h2,.dialog h3{margin:0}.dialog-title{padding:15px;border-radius:15px 15px 0 0}.dialog-content{padding:15px}.dialog-actions{border-top:solid 1px var(--border-color);padding:15px}.dialog-close{top:10px;right:15px}.dialog-close button:focus,.dialog-close button:focus-visible{outline:#038df2 solid 2px;outline-offset:2px}.dialog .box{-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;border:1px solid var(--border-color)!important}.dialog:focus{outline:0}.dropdown{-webkit-box-shadow:0 4px 18px rgba(0,0,0,.1);-moz-box-shadow:0 4px 18px rgba(0,0,0,.1);box-shadow:0 4px 18px rgba(0,0,0,.1);box-shadow:2px 4px 12px rgba(0,0,0,.1);background:#FFF;border-radius:15px;transform:translateY(0);transition-delay:0s;border:1px solid var(--border-color);padding:5px 0;z-index:99;min-width:400px;max-width:600px;margin:0}.dropdown-hover:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(0,0,0,.2)}.dropdown li{list-style:none;margin:0}.dropdown-item{padding:8px 12px}.dropdown-item:hover{background-color:var(--el-bg-highlight)}.dropdown-active{background-color:#1D9EFC!important;color:#fff}.navbar-menu-item .dropdown a{margin:0!important;padding:0!important;color:var(--color)!important}.flex{display:flex;gap:15px;margin-bottom:15px}.flex-justify-start{justify-content:flex-start}.flex-justify-end{justify-content:flex-end}.flex-justify-center,.loader-squares{justify-content:center}.flex-justify-between{justify-content:space-between}.flex-align-start{align-items:flex-start}.flex-align-end{align-items:flex-end}.flex-align-center{align-items:center}.flex-align-stretch{align-items:stretch}.flex-align-baseline{align-items:baseline}.flex[data-cols]{container-type:inline-size;flex-wrap:wrap;align-items:stretch}.flex[data-cols]>.flex-item{flex:0 0 calc((100% - (var(--flex-cols,1) - 1) * var(--flex-gap,15px))/ var(--flex-cols,1));max-width:calc((100% - (var(--flex-cols,1) - 1) * var(--flex-gap,15px))/ var(--flex-cols,1));box-sizing:border-box}@container (max-width:500px){.flex-item{flex:0 0 calc((100% - (var(--flex-phone-cols,1) - 1) * var(--flex-gap,15px))/ var(--flex-phone-cols,1))!important;max-width:calc((100% - (var(--flex-phone-cols,1) - 1) * var(--flex-gap,15px))/ var(--flex-phone-cols,1))!important}}@container (min-width:501px) and (max-width:900px){.flex-item{flex:0 0 calc((100% - (var(--flex-tablet-cols,2) - 1) * var(--flex-gap,15px))/ var(--flex-tablet-cols,2))!important;max-width:calc((100% - (var(--flex-tablet-cols,2) - 1) * var(--flex-gap,15px))/ var(--flex-tablet-cols,2))!important}}input:focus,select:focus,textarea:focus{outline:rgba(29,158,252,.7) solid 3px;border-color:#4fb4fd}.input-inside,button,input,select,textarea{background:var(--input-bg);color:var(--color)}.input-inside,input,select,textarea{padding:10px;font-size:14px;border-radius:15px;border:1px solid var(--border-color);-webkit-transition:border linear .2s,box-shadow linear .2s;transition:border linear .2s,box-shadow linear .2s;margin-bottom:0!important}.editable,.slider{border-radius:15px}.form-element,fieldset,fieldset label{margin-bottom:15px}.input-inside.large,input.large,select.large,textarea.large{font-size:25px;padding:6px}.input-inside:hover,input:hover,select:hover,textarea:hover{-webkit-transition:border linear .2s,box-shadow linear .2s;transition:border linear .2s,box-shadow linear .2s;border-color:#4fb4fd}.editable{width:100%;min-height:1.4em;padding:2px 0;font-size:14px;border:1px solid transparent;background:0 0;color:var(--color);white-space:pre-wrap;word-break:break-word;outline:0;margin-bottom:0!important}.editable:focus{background:var(--input-bg);outline:rgba(29,158,252,.7) solid 3px;border-color:#1D9EFC}.editable[data-empty=true]::before{content:attr(data-placeholder);color:#888;pointer-events:none}.editable:focus::before{content:''}.inline-elements .form-element,.toolbar .form-element{margin-bottom:0}input[type=color]{border:none;padding:0}.input-alert{-webkit-transition:none!important;transition:none!important;border-color:#ea0835!important}.input-alert:focus{outline:rgba(234,8,53,.7) solid 3px!important}.code-editor:focus,.input-inside input:focus,.input-inside select:focus{outline:0!important}.input-wrapper{position:relative}.input-reset-btn{position:absolute;right:8px;top:50%;transform:translateY(-50%);z-index:2}.input-inside{padding:0 4px 0 0;position:relative}.input-inside select{border:none;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;margin:0;padding:0 0 0 4px;color:#888;border-right:solid 1px var(--border-color);background:var(--input-bg);border-radius:0;height:40px}.input-focus,.input-inside:focus{border-color:#1D9EFC;outline:rgba(29,158,252,.7) solid 3px}.input-inside select:focus{background:#e2f1fb}.input-inside :first-child{border-radius:15px 0 0 15px}.input-inside :last-child{border-radius:0 15px 15px 0}.input-inside .btn-circle{height:24px;width:24px}.input-btns{position:absolute;right:5px;top:5px}.label-inline{padding:0!important}.label-inline label{color:#888;padding:4px 8px}.label-inline select{border-right:none!important;border-left:solid 1px var(--border-color);color:var(--color)}.input-inside{height:auto}.input-inside:after,.input-inside:before{display:table;line-height:0}.input-inside button,.input-inside i,.input-inside input,.input-inside span{display:inline-block;margin-top:0;margin-bottom:0;vertical-align:middle}.input-inside input,.input-inside textarea{border:0!important;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}.input-inside:focus-within{outline:rgba(29,158,252,.7) solid 3px;border-color:#1D9EFC}.input-inside input:focus,.input-inside select:focus{border-color:transparent}input.disabled,input[disabled]{background-color:var(--el-bg-color);border:none;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;padding:4px 0!important}input:-moz-read-only,input:read-only{color:brown;border:none!important}input[type=checkbox],input[type=radio]{-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075);-moz-box-shadow:inset 0 1px 1px rgba(0,0,0,.075);box-shadow:inset 0 1px 1px rgba(0,0,0,.075)}select{margin-top:0;color:var(--color)}textarea{resize:none;height:auto}label{display:block}label input,label select,label textarea,td label{margin-bottom:0}fieldset{border:1px solid var(--border-color);border-radius:15px}legend{color:var(--dark-gray);padding:0 5px}.form-inline:after,.form-inline:before{display:table;line-height:0}.form-inline button,.form-inline input,.form-inline label,.form-inline select,.form-inline textarea{display:inline-block;margin-top:0;margin-bottom:0;vertical-align:middle}.toolbar-group:after,.toolbar-group:before{display:table;line-height:0}.toolbar-group button,.toolbar-group input,.toolbar-group label,.toolbar-group select,.toolbar-group textarea{display:inline-block;margin-top:0;margin-bottom:0;vertical-align:middle;margin-right:-5px;border-right:solid 1px #FFF;border-radius:0}.toolbar-group button:first-child,.toolbar-group input:first-child,.toolbar-group label:first-child,.toolbar-group select:first-child,.toolbar-group textarea:first-child{border-radius:15px 0 0 15px}.toolbar-group button:last-child,.toolbar-group input:last-child,.toolbar-group label:last-child,.toolbar-group select:last-child,.toolbar-group textarea:last-child{border-radius:0 15px 15px 0;border-right:solid 1px var(--border-color)}::placeholder{color:#888;opacity:1}:-ms-input-placeholder{color:var(--border-color)}::-ms-input-placeholder{color:var(--border-color)}label.switch{margin-top:-5px}.switch{position:relative;display:inline-block;width:32px;height:19px}.switch input{opacity:0;width:0;height:0;outline:0}.form-switch{display:inline-block}.swith-label{margin-left:5px}.slider{-webkit-box-shadow:inset 0 1px 3px rgb(0 0 0 / 10%)!important;-moz-box-shadow:inset 0 1px 3px rgb(0 0 0 / 10%)!important;box-shadow:inset 0 1px 3px rgb(0 0 0 / 10%)!important;-webkit-transition:background-color .1s;background-color:#ccc;bottom:-1px;position:absolute;right:1px;top:1px;transition:background-color .1s}.slider:before{border-radius:50%;left:2px;width:15px;-webkit-transition:.1s;background-color:#fff;bottom:2px;height:15px;position:absolute;transition:.1s}input:checked+.slider{background-color:#38c153}input:focus+.slider{box-shadow:0 0 1px #38c153}input:checked+.slider:before{transform:translateX(12px)}.switch input[type=checkbox]:focus+.slider{outline:0}.switch input[type=checkbox]:focus-visible+.slider{outline:rgba(29,158,252,.7) solid 3px;border-color:#1D9EFC;outline-offset:2px}.cust-radio input[type=radio]:focus+.checkmark{outline:0}.cust-radio input[type=radio]:focus-visible+.checkmark{outline:rgba(29,158,252,.7) solid 3px;border-color:#1D9EFC;outline-offset:2px}.input-label,.input-label-alert{display:block;font-size:12px;margin-bottom:2px}.input-label{color:#888}.input-label-alert{color:#ea0835}.cust-radio{display:block;position:relative;padding-left:18px;padding-right:10px;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.cust-radio input{position:absolute;opacity:0;cursor:pointer;height:0;width:0}.checkmark{position:absolute;top:4px;left:0;height:15px;width:15px;background-color:var(--border-color);-webkit-box-shadow:inset 0 1px 3px rgb(0 0 0 / 20%)!important;-moz-box-shadow:inset 0 1px 3px rgb(0 0 0 / 20%)!important;box-shadow:inset 0 1px 3px rgb(0 0 0 / 20%)!important;border-radius:50%}.cust-radio input:checked~.checkmark{background-color:#1D9EFC}.checkmark:after{position:absolute;display:none}.cust-radio input:checked~.checkmark:after{display:block}.cust-radio .checkmark:after{top:5px;left:5px;width:5px;height:5px;border-radius:50%;background:#fff}.hidden-arrows::-webkit-inner-spin-button,.hidden-arrows::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.information,.row{margin-bottom:15px}.code-editor{color:#7b7b7b;font-size:12px;border:0;padding:0;width:100%}.information,.label{border-radius:15px}.information{padding:15px;position:relative}.information-icon{position:absolute;top:15px;left:15px;font-size:1.2em;opacity:.75}.information-content-icon{padding-left:30px}.information-large{font-size:25px;padding:30px}.information-default{background:var(--el-bg-highlight)}.information-primary{background:#e2f1fb;color:#1D9EFC}.information-primary hr{border-bottom:solid 1px #1D9EFC}.information-warning{background:#ffd500;color:var(--color)}.information-success{background:#DDFFD4;color:#31a949}.information-success hr{border-bottom:solid 1px #38c153}.information-alert{background:#FCC5C5;color:#ea0835}.information-alert hr{border-bottom:solid 1px #ea0835}.badge,.label{cursor:default;display:inline-block;color:#fff;vertical-align:baseline;white-space:nowrap;position:relative}.badge:empty,.label:empty{display:none}.badge .btn-circle,.label .btn-circle{margin-left:5px}.badge-default,.label-default{background-color:var(--btn-bg);color:#7b7b7b}.badge.badge-primary,.badge.label-primary,.label.badge-primary,.label.label-primary{background-color:#1D9EFC}.badge.badge-warning,.badge.label-warning,.label.badge-warning,.label.label-warning{color:var(--color);background-color:#ffd500}.badge.badge-success,.badge.label-success,.label.badge-success,.label.label-success{background-color:#38c153}.badge.badge-alert,.badge.label-alert,.label.badge-alert,.label.label-alert{background-color:#ea0835}.badge{border-radius:20px;padding:2px 10px}.badge-small{padding:0 10px;font-size:12px}.badge-closable{padding-right:0}.clear-list ul{margin:0 0 15px;padding:0}.clear-list ul li{padding:0;list-style:none}.clear-list.none li{margin:0}.clear-list.compact li{margin:0 0 7.5px}.clear-list.default li{margin:0 0 15px}.clear-list.plenty li{margin:0 0 22.5px}.inline-list ul,ul.inline-list{display:flex;gap:15px;margin:0 0 15px;padding:0}.inline-list ul li,ul.inline-list li{padding:0;list-style:none}.loader-squares{display:flex;gap:8px;align-items:center;height:40px}.loader-square{width:16px;height:16px;border-radius:15px;animation:loader-grow .7s cubic-bezier(.4,0,.2,1) infinite;transform-origin:center;background-color:#1895ff}.loader-square:nth-child(1){animation-delay:0s}.loader-square:nth-child(2){animation-delay:.15s}.loader-square:nth-child(3){animation-delay:.3s}.loader-square:nth-child(4){animation-delay:.45s}.loader-square:nth-child(5){animation-delay:.6s}@keyframes loader-grow{0%,100%{transform:scale(1);background-color:#1895ff}30%{transform:scale(1.5);background-color:#24d3fc}60%{transform:scale(1);background-color:#1fb5fe}}.loader-lock{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.1);z-index:9990}.loader-wrapper{position:relative;z-index:9999}.loader-full{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}.navbar-header{background:#000;border-bottom:solid 3px #1D9EFC;box-shadow:0 4px 12px rgba(0,0,0,.1)}.navbar-responsive{-webkit-backdrop-filter:blur(5px);align-items:center;backdrop-filter:blur(5px);color:#fff;display:flex;min-height:60px;padding:0 15px;position:relative;z-index:100}.navbar-logo img{height:40px}.navbar-main{flex:1}.navbar-menu{display:flex;list-style:none;margin:0;padding:0}.navbar-menu .navbar-menu-item{position:relative;cursor:pointer;display:inline-block;z-index:888}.navbar-menu .navbar-menu-item a{color:#fff;display:block;padding:19px 30px}.navbar-menu .navbar-menu-item>.navbar-submenu{display:none;position:absolute;left:0;top:100%;min-width:160px;z-index:999;color:#fff!important;padding:7.5px 0 15px;background:rgba(0,0,0,.8);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-radius:0 0 15px 15px;box-shadow:0 4px 12px rgba(0,0,0,.1)}.navbar-menu .navbar-menu-item>.navbar-submenu a{color:#fff;padding:10px 15px}.navbar-menu .navbar-menu-item>.navbar-submenu li:hover{background-color:rgba(255,255,255,.12);color:#fff}.navbar-menu .navbar-menu-item>.navbar-submenu li:hover>a{color:#fff}.navbar-icon-area,.navbar-menu,.navbar-menu-item.has-submenu>.navbar-submenu{color:#fff;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.navbar-menu-item.open>.navbar-submenu,.navbar-menu-item:hover>.navbar-submenu{display:block}.navbar-menu-item.active,.navbar-submenu-item.active{background:rgba(255,255,255,.1)}.navbar-icon-btn:hover,.navbar-menu-item:hover,.navbar-submenu-item:hover{background:rgba(255,255,255,.08)}.navbar-submenu{list-style:none;margin:0;padding:0}.navbar-icons{display:flex;gap:.5rem}.list-scroller,.pagination-bar-inner,.row{gap:15px;display:flex}.navbar-icons .navbar-icon-btn{color:#fff;background:0 0;border:none;cursor:pointer;font-size:1.2em;height:40px;width:40px;display:flex;align-items:center;justify-content:center;opacity:.8}.navbar-icons .navbar-icon-btn:hover{opacity:1}.navbar-hamburger{display:none;background:0 0;border:none;font-size:1.5em;margin-left:1rem;cursor:pointer;color:#fff}.tab-content,.tabs .tab.active{background:#FFF;position:relative}.navbar-icon-area{-webkit-box-shadow:0 4px 18px rgba(0,0,0,.1);-moz-box-shadow:0 4px 18px rgba(0,0,0,.1);box-shadow:0 4px 18px rgba(0,0,0,.1);box-shadow:2px 4px 12px rgba(0,0,0,.1);background:#FFF;border-radius:15px;transform:translateY(0);transition-delay:0s;display:none;position:absolute;right:1rem;top:100%;z-index:20}.navbar-icon-area-hover:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(0,0,0,.2)}.navbar-icon-area.open{display:block}.pagination{padding-bottom:15px}.pagination-bar{width:100%;display:flex;justify-content:center;align-items:center;padding:15px 0}.pagination-bar-inner{align-items:center;min-width:150px;max-width:220px}.pagination-input{width:48px;text-align:center;border-radius:15px;border:1px solid #ccc;padding:4px 0;font-size:1em}.row{flex-wrap:wrap;width:100%}.row-item{box-sizing:border-box}.list-scroller-wrapper{width:100%;position:relative}.list-scroller{overflow-x:auto;scroll-behavior:smooth;width:100%;scrollbar-width:none;-ms-overflow-style:none;margin:0;padding:5px}.image-zoom,.skeleton,.thumb{overflow:hidden}.list-scroller::-webkit-scrollbar{display:none}.image,.snackbar-stack,.tabs{display:flex}.list-scroller li{margin:0;padding:0;list-style:none}.list-scroller-btn{position:absolute;z-index:9;background:#CCC;top:50%;transform:translateY(-50%)}.skeleton,.snackbar{border-radius:15px;position:relative}.list-scroller-btn-left{left:-15px}.image-zoom-caption,.snackbar-stack,.tooltip{left:50%;transform:translateX(-50%)}.list-scroller-btn-right{right:-15px}.skeleton{background:linear-gradient(90deg,var(--btn-bg) 25%,#bbb 50%,var(--btn-bg) 75%);background-size:200% 100%;animation:skeleton-shimmer 2s infinite linear;padding:15px;margin-bottom:15px}@keyframes skeleton-shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}.snackbar{padding:15px 60px 15px 15px;color:#FFF;margin:auto auto 15px;box-sizing:border-box;min-width:500px;-webkit-box-shadow:0 3px 10px rgba(0,0,0,.3);-moz-box-shadow:0 3px 10px rgba(0,0,0,.3);box-shadow:0 3px 10px rgba(0,0,0,.3)}.snackbar .snackbar-close{position:absolute;top:10px;right:10px}.snackbar-stack{position:fixed;bottom:15px;z-index:9999;flex-direction:column;align-items:center}table{max-width:100%;border-collapse:collapse;border-spacing:0}.table{cursor:default;border-bottom:solid 1px transparent;margin-bottom:15px;border-collapse:separate}.table thead td,.table thead th{background-color:var(--el-bg);color:#888;font-weight:400;position:sticky;top:0;z-index:5}.table thead td a,.table thead td button.anchor,.table thead th a,.table thead th button.anchor{color:#888!important}.table thead td a:hover,.table thead td button.anchor:hover,.table thead th a:hover,.table thead th button.anchor:hover{text-decoration:underline;color:#6f6f6f}.table thead td:first-child,.table thead th:first-child{border-radius:15px 0 0}.table thead td:last-child,.table thead th:last-child{border-radius:0 15px 0 0}.table td,.table th{padding:8px 6px}.content,.tab-content,.tabs .tab{padding:15px}.table td .form-element,.table th .form-element{margin-bottom:0!important}.table .input-wrapper,.table .uneditable-input,.table input,.table select,.table td .btn,.table td .row,.table textarea,.table th .btn,.table th .row{margin-bottom:0}.table tbody td,.table tbody th{border-top:solid 1px transparent}.table .overlined td,.table .overlined th{border-top:solid 1px var(--border-color)}.table tr.valign-middle td{vertical-align:middle}.table tr.valign-top td{vertical-align:top}.table tr.valign-bottom td{vertical-align:bottom}.table-striped tbody tr:nth-child(odd){background-color:var(--el-bg-highlight)}.table-hover tbody tr:hover>td{background-color:#cce6f8}.table-hover tbody tr:hover>td.highlight-primary{background-color:#b5dbf5}.table-hover tbody tr:hover>td.highlight-success{background-color:#b5ffa1}.table-hover tbody tr:hover>td.highlight-alert{background-color:#f99595}.table-hover tbody tr:hover>td.highlight-warning{background-color:#ffe666}.table td.highlight-primary,.table th.highlight-primary,.table tr.highlight-primary td,.table tr.highlight-primary th{background-color:#e2f1fb}.table td.highlight-alert,.table th.highlight-alert,.table tr.highlight-alert td,.table tr.highlight-alert th{background-color:#FCC5C5}.table td.highlight-success,.table th.highlight-success,.table tr.highlight-success td,.table tr.highlight-success th{background-color:#DDFFD4}.table td.highlight-warning,.table th.highlight-warning,.table tr.highlight-warning td,.table tr.highlight-warning th{background-color:#fe9}.tabs .tab{margin:0;cursor:pointer;border:1px solid transparent;border-radius:15px 15px 0 0}.tabs .tab.active{border:1px solid var(--border-color);border-bottom:solid 1px #FFF;color:#1D9EFC;z-index:9;bottom:-1px}.tabs .tab.disabled,.tabs .tab[disabled]{color:#a2a2a2;pointer-events:none}.tab-content{border:1px solid var(--border-color);border-top:solid 1px transparent;border-radius:0 0 15px 15px;z-index:1}.image-zoom-caption,.rounded,.thumb,.thumb img,.tooltip{border-radius:15px}.image-left{justify-content:flex-start}.image-right{justify-content:flex-end}.image-center{justify-content:center}.thumb{background-color:#FFF!important;background-position:center center!important;background-repeat:no-repeat!important;background-size:100%!important;box-sizing:border-box;height:80px;position:relative;width:100%}.thumb.thumb-bordered{border:1px solid var(--border-color)}.thumb-small{width:56px;height:56px}.thumb-smallest{width:32px;height:32px}.thumb-medium{width:80px;height:80px}.thumb-large{width:160px;height:160px}.thumb-largest{width:240px;height:240px}.thumb .center-by-width{height:auto;position:absolute;top:50%;transform:translate(0,-50%);width:100%}.thumb .center-by-height{display:block;margin-left:auto;margin-right:auto;width:auto;height:100%}ul.tree li:after,ul.tree li:before{height:1.6em;color:#fff;content:""}.thumb .thumb-corner{position:absolute;top:-13px;right:-13px}.image-zoom{position:relative;touch-action:none;background:#fff}.image-zoom img{position:absolute;user-select:none}.image-zoom-caption{position:absolute;bottom:15px;background:rgba(0,0,0,.25);color:#fff;padding:5px 15px;font-size:12px;z-index:9;display:block}.tooltip-wrapper{position:relative;display:inline-block}.tooltip{position:absolute;bottom:120%;background:rgba(0,0,0,.7);color:#fff;padding:6px 12px;white-space:nowrap;z-index:100;font-size:.9em;box-shadow:0 2px 8px rgba(0,0,0,.15)}ul.tree{list-style:none;padding:0;margin:0 0 15px}ul.tree ul.tree{margin-left:-16px;margin-top:4px;margin-bottom:0}ul.tree li{margin:0;padding:0 7px;line-height:2rem;border-left:1px solid #646464;cursor:default;position:relative}ul.tree li .tree-content{display:inline-block;margin:3px 0 0 15px}ul.tree li .tree-content-button{display:inline-block;margin:3px 0 0 40px}ul.tree li .tree-last-content{display:inline-block;margin:3px 0 0 15px}ul.tree li .tree-button{position:absolute;top:3px;left:15px;z-index:5}ul.tree li:last-child{border-left:none;line-height:15px!important}ul.tree li:last-child:before{border-left:1px solid #646464}ul.tree li:before{position:absolute;top:-3px;width:15px;border-bottom:1px solid #646464;display:inline-block;left:0}.relative,.wrapper,ul.tree li:after{position:relative}ul.tree li:after{top:-.3em;width:15px;display:inline-block;left:-7px}.text-content{line-height:1.5}.text-size-small{font-size:12px}.text-size-normal{font-size:14px}.text-size-large{font-size:25px}.margin-top{margin-top:15px}.margin-bottom{margin-bottom:15px}.collapesed{margin:0}.separated{margin:15px 0}.color-default{color:var(--color)!important}.color-primary{color:#1D9EFC!important}.color-success{color:#38c153!important}.color-alert{color:#ea0835!important}.color-warning{color:#ffd500!important}.color-active{color:#64FA00!important}.color-gray{color:#888!important}.color-dark-gray{color:#7b7b7b!important}.bg-primary{background-color:#1D9EFC;color:#fff}.bg-success{background-color:#38c153;color:#fff}.bg-alert{background-color:#ea0835;color:#fff}.bg-warning{background-color:#ffd500;color:#272729}.bg-dark-gray,.bg-default{background-color:#7b7b7b;color:#fff}.bg-gray{background-color:#888;color:#fff}.bg-active{background-color:#64FA00}.bg-alert .btn-circle-bg-clear svg,.bg-default .btn-circle-bg-clear svg,.bg-primary .btn-circle-bg-clear svg,.bg-success .btn-circle-bg-clear svg{color:#fff!important}.note,.note a{color:#7b7b7b}.inline{display:inline-block;vertical-align:middle}.note{font-size:12px}.note a{text-decoration:underline}.note a:hover{color:#1D9EFC}.absolute,.corner-btn{position:absolute}.corner-btn{right:15px;top:15px}.component-locker,.overlay{background:var(--overlay-color);height:100%;left:0;top:0;transition:.2s;width:100%}.center{text-align:center}.right{text-align:right}.left{text-align:left}.visible{visibility:visible}.invisible{visibility:hidden}.hidden{display:none}.expanded{width:100%;margin-bottom:15px}.bordered{border:1px solid var(--border-color);border-radius:15px}.bordered-primary{border-color:#1D9EFC}.border-top{border-top:solid 1px var(--border-color)}.border-bottom{border-bottom:solid 1px var(--border-color)}.overlay{position:fixed;z-index:99}.component-locker{border-radius:15px;position:absolute;z-index:9}.outline-primary{outline:#1D9EFC dashed 1px}.outline-success{outline:#38c153 dashed 1px}.spacing-none{margin-bottom:0}.spacing-compact{margin-bottom:7.5px}.spacing-default{margin-bottom:15px}.spacing-plenty{margin-bottom:22.5px}.widget{box-shadow:2px 4px 12px rgba(0,0,0,.1);background:#FFF;border-radius:15px;transform:translateY(0);transition:transform .25s ease,box-shadow .25s ease;transition-delay:0s}.widget-hover:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(0,0,0,.2)}.wrapper{margin:auto}.wrapper-large{width:1100px}.wrapper-large .role-mainside{width:835px}.wrapper-large .role-sidebar{width:250px}.wrapper-large .role-half{width:550px}.wrapper-large .box .role-mainside,.wrapper-large .box .role-sidebar{width:820px}.wrapper-small{width:366.67px}.wrapper-medium{width:550px}@-ms-viewport{width:device-width}@media (max-width:500px){body{font-size:14px}h1,h2,h3{font-size:1.1em}.wrapper-default,.wrapper-large{width:96%;margin:auto}.row-item{flex:0 0 100%!important;max-width:100%!important}.btn,.expanded-phone,.snackbar{width:100%}.dialog{width:95%!important}}@media (min-width:501px) and (max-width:900px){body{font-size:14px}h1{font-size:1.3em}h2,h3{font-size:1.1em}.wrapper-default,.wrapper-large{width:96%;margin:auto}.row-item{flex:0 0 calc(50% - (15px / 2))!important;max-width:calc(50% - (15px / 2))!important}.snackbar{width:100%}}@media (max-width:900px){.navbar-menu{flex-direction:column;display:none;background:rgba(0,0,0,.88);position:absolute;left:0;top:56px;width:100%;box-shadow:0 4px 16px rgba(0,0,0,.24);color:#fff}.navbar-main.open .navbar-menu{display:flex}.navbar-hamburger{display:block}.navbar-menu-item{width:100%}.navbar-menu-item>a{color:#fff;padding:16px 20px}.navbar-menu-item:hover>.navbar-submenu{display:none}.navbar-menu-item.open>.navbar-submenu{display:block}.navbar-submenu{position:static!important;min-width:100%!important;border:none!important;border-radius:0!important}.navbar-submenu a{color:#fff!important;padding:12px 20px 12px 38px!important}.navbar-submenu-item{color:#fff}.navbar-submenu-item:hover{background:rgba(255,255,255,.08)}.navbar-icons{margin-left:auto}}

package/components/navbar/NavbarResponsive.js

@@ -8,7 +8,6 @@ exports.NavbarResponsive = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _reactFontawesome = require("@fortawesome/react-fontawesome");
 var _freeSolidSvgIcons = require("@fortawesome/free-solid-svg-icons");
-var _utils = require("gdx-libs/utils");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
 function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -16,6 +15,9 @@ function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r)
 function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
 function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
 function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
+// import { generateId } from 'gdx-libs/utils';
+
+var MOBILE_BREAKPOINT = 900;
 var NavbarResponsive = exports.NavbarResponsive = function NavbarResponsive(_ref) {
   var logo = _ref.logo,
     menu = _ref.menu,
@@ -35,7 +37,7 @@ var NavbarResponsive = exports.NavbarResponsive = function NavbarResponsive(_ref
   var iconAreaRef = (0, _react.useRef)(null);
   var menuRef = (0, _react.useRef)(null);
 
-  // Cierra el área de icono al hacer click fuera
+  // Close the icon area when clicking outside
   (0, _react.useEffect)(function () {
     if (!iconArea) return;
     var handleClick = function handleClick(e) {
@@ -49,12 +51,13 @@ var NavbarResponsive = exports.NavbarResponsive = function NavbarResponsive(_ref
     };
   }, [iconArea]);
 
-  // Cierra el menú hamburguesa al hacer click fuera
+  // Close the hamburger menu when clicking outside
   (0, _react.useEffect)(function () {
     if (!menuOpen) return;
     var handleClick = function handleClick(e) {
       if (menuRef.current && !menuRef.current.contains(e.target)) {
         setMenuOpen(false);
+        setSubmenuOpen(null);
       }
     };
     document.addEventListener('mousedown', handleClick);
@@ -65,6 +68,25 @@ var NavbarResponsive = exports.NavbarResponsive = function NavbarResponsive(_ref
   var handleMenuClick = function handleMenuClick() {
     return setMenuOpen(false);
   };
+  var isMobile = function isMobile() {
+    return window.innerWidth <= MOBILE_BREAKPOINT;
+  };
+  var handleTopLevelClick = function handleTopLevelClick(e, item, idx) {
+    var _item$submenu;
+    if (!isMobile()) {
+      return;
+    }
+    if ((_item$submenu = item.submenu) !== null && _item$submenu !== void 0 && _item$submenu.length) {
+      e.preventDefault();
+      e.stopPropagation();
+      setSubmenuOpen(function (prev) {
+        return prev === idx ? null : idx;
+      });
+      return;
+    }
+    setSubmenuOpen(null);
+    setMenuOpen(false);
+  };
   return /*#__PURE__*/_react["default"].createElement("nav", {
     className: "navbar-responsive"
   }, /*#__PURE__*/_react["default"].createElement("div", {
@@ -76,31 +98,35 @@ var NavbarResponsive = exports.NavbarResponsive = function NavbarResponsive(_ref
     ref: menuRef
   }, /*#__PURE__*/_react["default"].createElement("ul", {
     className: "navbar-menu"
-  }, menu.map(function (item, idx) {
+  }, menu === null || menu === void 0 ? void 0 : menu.map(function (item, idx) {
     return /*#__PURE__*/_react["default"].createElement("li", {
-      key: item.id || (0, _utils.generateId)('menu'),
-      className: "navbar-menu-item".concat(item.submenu ? ' has-submenu' : '').concat(submenuOpen === idx ? ' open' : ''),
+      key: item.id || idx,
+      className: "navbar-menu-item".concat(item.submenu ? ' has-submenu' : '').concat(submenuOpen === idx ? ' open' : '').concat(item.active ? ' active' : ''),
       onMouseEnter: function onMouseEnter() {
-        return setSubmenuOpen(idx);
+        if (!isMobile()) setSubmenuOpen(idx);
       },
       onMouseLeave: function onMouseLeave() {
-        return setSubmenuOpen(null);
+        if (!isMobile()) setSubmenuOpen(null);
       },
-      onClick: function onClick() {
-        if (window.innerWidth <= 990) setSubmenuOpen(submenuOpen === idx ? null : idx);
+      onClick: function onClick(e) {
+        return handleTopLevelClick(e, item, idx);
       }
     }, item.element, item.submenu && /*#__PURE__*/_react["default"].createElement("ul", {
       className: "navbar-submenu"
-    }, item.submenu.map(function (sub) {
+    }, item.submenu.map(function (sub, subIdx) {
       return /*#__PURE__*/_react["default"].createElement("li", {
-        key: sub.id || (0, _utils.generateId)('submenu'),
-        className: "navbar-submenu-item",
-        onClick: handleMenuClick
+        key: sub.id || subIdx,
+        className: "navbar-submenu-item".concat(sub.active ? ' active' : ''),
+        onClick: function onClick(e) {
+          e.stopPropagation();
+          setSubmenuOpen(null);
+          handleMenuClick();
+        }
       }, sub.element);
     })));
   }))), /*#__PURE__*/_react["default"].createElement("div", {
     className: "navbar-icons"
-  }, icons.map(function (icon) {
+  }, icons === null || icons === void 0 ? void 0 : icons.map(function (icon) {
     return /*#__PURE__*/_react["default"].createElement("button", {
       key: icon.id,
       className: "navbar-icon-btn",
@@ -114,12 +140,17 @@ var NavbarResponsive = exports.NavbarResponsive = function NavbarResponsive(_ref
   }), /*#__PURE__*/_react["default"].createElement("button", {
     className: "navbar-hamburger",
     onClick: function onClick() {
-      return setMenuOpen(!menuOpen);
+      setMenuOpen(function (prev) {
+        var next = !prev;
+        if (!next) setSubmenuOpen(null);
+        return next;
+      });
     },
-    "aria-label": "Abrir men\xFA"
+    "aria-label": "Abrir men\xFA",
+    "aria-expanded": menuOpen
   }, /*#__PURE__*/_react["default"].createElement(_reactFontawesome.FontAwesomeIcon, {
     icon: _freeSolidSvgIcons.faBars
-  }))), icons.map(function (icon) {
+  }))), icons === null || icons === void 0 ? void 0 : icons.map(function (icon) {
     return /*#__PURE__*/_react["default"].createElement("div", {
       key: icon.id,
       ref: iconArea === icon.id ? iconAreaRef : null,

package/components/navbar/index.js

@@ -3,17 +3,6 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-var _Navbar = require("./Navbar");
-Object.keys(_Navbar).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _Navbar[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function get() {
-      return _Navbar[key];
-    }
-  });
-});
 var _NavbarResponsive = require("./NavbarResponsive");
 Object.keys(_NavbarResponsive).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;

package/components/util/List.js

@@ -17,10 +17,10 @@ var List = exports.List = function List(_ref) {
     bullets = _ref$bullets === void 0 ? false : _ref$bullets,
     _ref$inline = _ref.inline,
     inline = _ref$inline === void 0 ? false : _ref$inline,
-    _ref$className = _ref.className,
-    className = _ref$className === void 0 ? '' : _ref$className;
+    spacing = _ref.spacing,
+    className = _ref.className;
   return /*#__PURE__*/_react["default"].createElement("div", {
-    className: "".concat(bullets ? '' : 'clear-list', " ").concat(inline ? 'inline-list' : '', " ").concat(className)
+    className: "\n      ".concat(bullets ? '' : 'clear-list', " \n      ").concat(inline ? 'inline-list' : '', " \n      ").concat(spacing || 'default', " \n      ").concat(className || '', "\n    ")
   }, /*#__PURE__*/_react["default"].createElement("ul", null, children));
 };
 var ListItem = exports.ListItem = function ListItem(_ref2) {
@@ -34,7 +34,8 @@ List.propTypes = {
   children: _propTypes["default"].any.isRequired,
   className: _propTypes["default"].string,
   inline: _propTypes["default"].bool,
-  bullets: _propTypes["default"].bool
+  bullets: _propTypes["default"].bool,
+  spacing: _propTypes["default"].oneOf(['none', 'compact', 'default', 'plenty'])
 };
 ListItem.propTypes = {
   children: _propTypes["default"].any.isRequired

package/components/util/Skeleton.js

@@ -6,19 +6,22 @@ Object.defineProperty(exports, "__esModule", {
 exports.Skeleton = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
+var _excluded = ["width", "height"];
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
+function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
 var Skeleton = exports.Skeleton = function Skeleton(_ref) {
-  var _ref$width = _ref.width,
-    width = _ref$width === void 0 ? 'unset' : _ref$width,
-    _ref$height = _ref.height,
-    height = _ref$height === void 0 ? 'unset' : _ref$height;
-  return /*#__PURE__*/_react["default"].createElement("div", {
+  var width = _ref.width,
+    height = _ref.height,
+    props = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/_react["default"].createElement("div", _extends({
     className: "skeleton blink-soft",
     style: {
       width: width,
       height: height
     }
-  });
+  }, props));
 };
 Skeleton.propTypes = {
   width: _propTypes["default"].oneOfType([_propTypes["default"].number, _propTypes["default"].string]),

package/components/util/Text.js

@@ -7,7 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.Text = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
-var _excluded = ["children", "html", "className", "size", "as", "inline", "bold", "textWrap", "style"];
+var _excluded = ["children", "html", "className", "size", "as", "inline", "bold", "textWrap", "spacing", "style"];
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
@@ -31,22 +31,24 @@ var Text = exports.Text = function Text(_ref) {
     bold = _ref$bold === void 0 ? false : _ref$bold,
     _ref$textWrap = _ref.textWrap,
     textWrap = _ref$textWrap === void 0 ? false : _ref$textWrap,
+    _ref$spacing = _ref.spacing,
+    spacing = _ref$spacing === void 0 ? 'default' : _ref$spacing,
     style = _ref.style,
     props = _objectWithoutProperties(_ref, _excluded);
   var Tag = as || (inline ? 'span' : 'div');
-  var isInlineTag = Tag === 'span';
+  // const isInlineTag = Tag === 'span';
   var isHeadingTag = /^h[1-6]$/.test(Tag);
-  var addBottomMargin = !isInlineTag && Tag !== 'p' && !isHeadingTag;
+  // const addBottomMargin = !isInlineTag && Tag !== 'p' && !isHeadingTag;
   var mergedStyle = _objectSpread({
     whiteSpace: textWrap ? 'nowrap' : 'normal',
     overflow: textWrap ? 'hidden' : undefined,
     textOverflow: textWrap ? 'ellipsis' : undefined,
-    width: textWrap && !isInlineTag ? '100%' : undefined,
-    display: textWrap && isInlineTag ? 'inline-block' : undefined
+    width: textWrap && !inline ? '100%' : undefined,
+    display: textWrap && inline ? 'inline-block' : undefined
   }, style);
   if (html !== undefined && html !== null) {
     return /*#__PURE__*/_react["default"].createElement(Tag, _extends({
-      className: "\n        text-size-".concat(size, " \n        ").concat(addBottomMargin ? 'margin-bottom' : '', " \n        ").concat(bold ? 'strong' : '', "\n        ").concat(className),
+      className: "\n        ".concat(isHeadingTag ? '' : "text-size-".concat(size), "\n        spacing-").concat(inline ? 'inline' : spacing, "\n        ").concat(bold ? 'strong' : '', "\n        ").concat(className),
       style: mergedStyle
     }, props, {
       dangerouslySetInnerHTML: {
@@ -55,7 +57,7 @@ var Text = exports.Text = function Text(_ref) {
     }));
   }
   return /*#__PURE__*/_react["default"].createElement(Tag, _extends({
-    className: "\n      text-content\n      text-size-".concat(size, " \n      ").concat(addBottomMargin ? 'margin-bottom' : '', " \n      ").concat(bold ? 'strong' : '', "\n      ").concat(className),
+    className: "\n      text-content\n      ".concat(isHeadingTag ? '' : "text-size-".concat(size), "\n      spacing-").concat(spacing, "\n      ").concat(bold ? 'strong' : '', "\n      ").concat(className),
     style: mergedStyle
   }, props), children);
 };
@@ -68,5 +70,6 @@ Text.propTypes = {
   children: _propTypes["default"].any,
   html: _propTypes["default"].string,
   textWrap: _propTypes["default"].bool,
-  style: _propTypes["default"].object
+  style: _propTypes["default"].object,
+  spacing: _propTypes["default"].oneOf(['none', 'compact', 'default', 'plenty'])
 };

package/components/util/Title.js

@@ -8,7 +8,7 @@ exports.Title = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _Text = require("./Text");
-var _excluded = ["children", "className", "as", "fullWidth", "textWrap", "style"];
+var _excluded = ["children", "className", "as", "fullWidth", "textWrap", "spacing", "style"];
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
@@ -28,6 +28,8 @@ var Title = exports.Title = function Title(_ref) {
     fullWidth = _ref$fullWidth === void 0 ? true : _ref$fullWidth,
     _ref$textWrap = _ref.textWrap,
     textWrap = _ref$textWrap === void 0 ? false : _ref$textWrap,
+    _ref$spacing = _ref.spacing,
+    spacing = _ref$spacing === void 0 ? 'default' : _ref$spacing,
     style = _ref.style,
     props = _objectWithoutProperties(_ref, _excluded);
   var mergedStyle = _objectSpread({
@@ -35,6 +37,7 @@ var Title = exports.Title = function Title(_ref) {
   }, style);
   return /*#__PURE__*/_react["default"].createElement(_Text.Text, _extends({
     as: as,
+    spacing: spacing,
     className: className,
     textWrap: textWrap,
     style: mergedStyle
@@ -46,5 +49,6 @@ Title.propTypes = {
   as: _propTypes["default"].oneOf(['h1', 'h2', 'h3', 'h4', 'h5', 'h6']),
   fullWidth: _propTypes["default"].bool,
   textWrap: _propTypes["default"].bool,
-  style: _propTypes["default"].object
+  style: _propTypes["default"].object,
+  spacing: _propTypes["default"].oneOf(['none', 'compact', 'default', 'plenty'])
 };

package/index.js

@@ -35,4 +35,15 @@ Object.keys(_layout).forEach(function (key) {
       return _layout[key];
     }
   });
+});
+var _tokens = require("./tokens");
+Object.keys(_tokens).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _tokens[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _tokens[key];
+    }
+  });
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "gdx-ui",
-  "version": "2.0.1",
+  "version": "2.0.3",
   "description": "UI gdx",
   "main": "index.js",
   "module": "index.js",

package/stories/layout/Navbar.stories.js

@@ -0,0 +1,137 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.Default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _components = require("../../components");
+var _logo = _interopRequireDefault(require("../../assets/logo.svg"));
+var _freeSolidSvgIcons = require("@fortawesome/free-solid-svg-icons");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
+var _default = exports["default"] = {
+  title: 'Layout/Navbar',
+  component: _components.NavbarResponsive,
+  tags: ['autodocs']
+};
+var Link = function Link(_ref) {
+  var children = _ref.children;
+  return /*#__PURE__*/_react["default"].createElement("a", {
+    href: "#",
+    style: {
+      color: 'inherit'
+    }
+  }, children);
+};
+var menu = [{
+  id: 'menu-items',
+  element: /*#__PURE__*/_react["default"].createElement(Link, {
+    to: '/items'
+  }, "Productos"),
+  submenu: [{
+    id: 'submenu-items-list',
+    element: /*#__PURE__*/_react["default"].createElement(Link, {
+      to: '/items'
+    }, "Listado")
+  }, {
+    id: 'submenu-items-movements',
+    element: /*#__PURE__*/_react["default"].createElement(Link, {
+      to: '/movements'
+    }, "Transferencias")
+  }, {
+    id: 'submenu-items-locations',
+    element: /*#__PURE__*/_react["default"].createElement(Link, {
+      to: '/locations'
+    }, "Ubicaciones")
+  }]
+}, {
+  id: 'menu-sales',
+  element: /*#__PURE__*/_react["default"].createElement(Link, {
+    to: '/sales'
+  }, "Ventas"),
+  active: true,
+  submenu: [{
+    id: 'submenu-sales-list',
+    element: /*#__PURE__*/_react["default"].createElement(Link, {
+      to: '/sales'
+    }, "Listado")
+  }, {
+    id: 'submenu-sales-customers',
+    element: /*#__PURE__*/_react["default"].createElement(Link, {
+      to: '/customers'
+    }, "Clientes")
+  }]
+}, {
+  id: 'menu-purchases',
+  element: /*#__PURE__*/_react["default"].createElement(Link, {
+    to: '/purchases'
+  }, "Compras"),
+  submenu: [{
+    id: 'submenu-purchases-list',
+    element: /*#__PURE__*/_react["default"].createElement(Link, {
+      to: '/purchases'
+    }, "Listado")
+  }, {
+    id: 'submenu-purchases-suppliers',
+    element: /*#__PURE__*/_react["default"].createElement(Link, {
+      to: '/suppliers'
+    }, "Proveedores")
+  }]
+}, {
+  id: 'menu-apps',
+  element: /*#__PURE__*/_react["default"].createElement(Link, {
+    to: '/apps/print-zpl'
+  }, "Apps"),
+  submenu: [{
+    id: 'submenu-apps-zpl',
+    element: /*#__PURE__*/_react["default"].createElement(Link, {
+      to: '/apps/print-zpl'
+    }, "Imprimir ZPL")
+  }]
+}, {
+  id: 'menu-users',
+  element: /*#__PURE__*/_react["default"].createElement(Link, {
+    to: '/users'
+  }, "Usuarios"),
+  submenu: [{
+    id: 'submenu-users-list',
+    element: /*#__PURE__*/_react["default"].createElement(Link, {
+      to: '/users'
+    }, "Listado de Usuarios")
+  }, {
+    id: 'submenu-users-stores',
+    element: /*#__PURE__*/_react["default"].createElement(Link, {
+      to: '/stores'
+    }, "Sucursales")
+  }]
+}];
+var icons = [{
+  id: 'exit',
+  label: 'Logout',
+  icon: _freeSolidSvgIcons.faRightFromBracket,
+  onClick: function onClick() {
+    return console.log('click');
+  }
+}];
+
+// Simple flex (no grid) — original behavior
+var Default = exports.Default = {
+  args: {},
+  render: function render() {
+    return /*#__PURE__*/_react["default"].createElement("div", {
+      style: {
+        background: '#000'
+      }
+    }, /*#__PURE__*/_react["default"].createElement(_components.NavbarResponsive, {
+      logo: /*#__PURE__*/_react["default"].createElement("img", {
+        src: _logo["default"],
+        alt: "Logo",
+        style: {
+          height: 40
+        }
+      }),
+      menu: menu,
+      icons: icons
+    }));
+  }
+};

package/stories/layout/Skeleton.stories.js

@@ -0,0 +1,30 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.Default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _components = require("../../components");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
+var _default = exports["default"] = {
+  title: 'Layout/Skeleton',
+  component: _components.Skeleton,
+  tags: ['autodocs']
+}; // Simple flex (no grid) — original behavior
+var Default = exports.Default = {
+  args: {
+    width: 500,
+    height: 50
+  },
+  render: function render(_ref) {
+    var width = _ref.width,
+      height = _ref.height;
+    return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_components.Text, null, "Default Skeleton:"), /*#__PURE__*/_react["default"].createElement(_components.Skeleton, null), /*#__PURE__*/_react["default"].createElement(_components.Skeleton, {
+      width: "50%"
+    }), /*#__PURE__*/_react["default"].createElement(_components.Text, null, "Skeleton with specified width and height:"), /*#__PURE__*/_react["default"].createElement(_components.Skeleton, {
+      width: width,
+      height: height
+    }));
+  }
+};

package/stories/list/List.stories.js

@@ -3,14 +3,16 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = exports.Default = void 0;
+exports["default"] = exports.FooterList = exports.Default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _List = require("../../components/util/List");
+var _components = require("../../components");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 var data = Array.from({
   length: 5
 }, function (_, i) {
-  return "List Item ".concat(i + 1, " Content");
+  return "List Item ".concat(i + 1);
 });
 var _default = exports["default"] = {
   title: 'Lists/List',
@@ -20,7 +22,8 @@ var _default = exports["default"] = {
 var Default = exports.Default = {
   args: {
     inline: false,
-    bullets: false
+    bullets: false,
+    spacing: 'default'
   },
   render: function render(args) {
     return /*#__PURE__*/_react["default"].createElement(_List.List, args, data.map(function (item, index) {
@@ -29,4 +32,29 @@ var Default = exports.Default = {
       }, item);
     }));
   }
+};
+var FooterList = exports.FooterList = {
+  args: {
+    spacing: 'compact'
+  },
+  render: function render(args) {
+    return /*#__PURE__*/_react["default"].createElement(_components.Flex, {
+      columns: 3
+    }, [1, 2, 3].map(function (n) {
+      return /*#__PURE__*/_react["default"].createElement(_components.FlexItem, null, /*#__PURE__*/_react["default"].createElement(_components.Title, {
+        as: "h4",
+        spacing: args.spacing
+      }, "The List Title ", n), /*#__PURE__*/_react["default"].createElement(_List.List, _extends({}, args, {
+        className: "note"
+      }), data.map(function (item, index) {
+        return /*#__PURE__*/_react["default"].createElement(_List.ListItem, {
+          key: index
+        }, "Link to ", /*#__PURE__*/_react["default"].createElement("a", {
+          href: "#",
+          target: "_blank",
+          rel: "noopener noreferrer"
+        }, item));
+      })));
+    }));
+  }
 };

package/stories/utils/Note.stories.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = exports.Truncated = exports.Default = void 0;
+exports["default"] = exports.Truncated = exports.NotewithLinks = exports.Default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _Table = require("../../components/table/Table");
 var _Expandable = require("../../components/expandable/Expandable");
@@ -23,6 +23,15 @@ var Default = exports.Default = {
     return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_components.Note, args, "Note is a component used to display important information in small size and gray color."));
   }
 };
+var NotewithLinks = exports.NotewithLinks = {
+  render: function render(args) {
+    return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_components.Note, args, "Note is a component used to display important information in small size and gray color. This is a link to ", /*#__PURE__*/_react["default"].createElement("a", {
+      href: "https://www.gadxe.com",
+      target: "_blank",
+      rel: "noopener noreferrer"
+    }, "Gadxe's website"), " for more information."));
+  }
+};
 var Truncated = exports.Truncated = {
   args: {
     inline: false,

package/stories/utils/Text.stories.js

@@ -19,10 +19,11 @@ var Default = exports.Default = {
   args: {
     inline: false,
     bold: true,
-    size: 'medium'
+    size: 'medium',
+    spacing: 'default'
   },
   render: function render(args) {
-    return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_components.Text, args, "Text is a component used to display important information in various sizes and styles. It can be used for headings, paragraphs, labels, and more. The Text component provides flexibility in terms of typography and can be customized to fit the design needs of the application."));
+    return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_components.Text, args, "Text is a component used to display important information in various sizes and styles. It can be used for headings, paragraphs, labels, and more. The Text component provides flexibility in terms of typography and can be customized to fit the design needs of the application."), /*#__PURE__*/_react["default"].createElement(_components.Text, args, "Another example of Text component with the same props to show how it can be used for multiple lines of text."));
   }
 };
 var Truncated = exports.Truncated = {

package/stories/utils/Title.stories.js

@@ -0,0 +1,26 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.Default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _Table = require("../../components/table/Table");
+var _Expandable = require("../../components/expandable/Expandable");
+var _Separator = require("../../components/util/Separator");
+var _components = require("../../components");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
+var _default = exports["default"] = {
+  title: 'Utils/Title',
+  component: _components.Title,
+  tags: ['autodocs']
+};
+var Default = exports.Default = {
+  args: {
+    as: 'h1',
+    spacing: 'default'
+  },
+  render: function render(args) {
+    return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_components.Title, args, "This title is using h1"), /*#__PURE__*/_react["default"].createElement(_components.Text, null, "This is a paragraph of text that provides additional information about the title above. It can be used to give context, explain the title, or provide any other relevant details that complement the title."));
+  }
+};

package/stories/utils/TokensBorders.stories.js

@@ -0,0 +1,41 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.Borders = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _Table = require("../../components/table/Table");
+var _Expandable = require("../../components/expandable/Expandable");
+var _Separator = require("../../components/util/Separator");
+var _components = require("../../components");
+var _reactFontawesome = require("@fortawesome/react-fontawesome");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
+var _default = exports["default"] = {
+  title: 'Tokens/Borders',
+  // component: Tokens,
+  tags: ['autodocs']
+};
+var Borders = exports.Borders = {
+  argTypes: {
+    border: {
+      control: {
+        type: 'select'
+      },
+      options: ['border-top', 'border-bottom', 'bordered']
+    }
+  },
+  args: {
+    border: 'bordered'
+  },
+  render: function render(_ref) {
+    var border = _ref.border;
+    return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement("div", {
+      className: "".concat(border, " margin-bottom"),
+      style: {
+        padding: '15px',
+        backgroundColor: '#ccffc1'
+      }
+    }, "Some content here"), /*#__PURE__*/_react["default"].createElement("div", null, "Use the class ", /*#__PURE__*/_react["default"].createElement("code", null, ".", border), " to apply this border."));
+  }
+};

package/stories/utils/TokensColors.stories.js

@@ -0,0 +1,45 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.Colors = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _Table = require("../../components/table/Table");
+var _Expandable = require("../../components/expandable/Expandable");
+var _Separator = require("../../components/util/Separator");
+var _components = require("../../components");
+var _reactFontawesome = require("@fortawesome/react-fontawesome");
+var _freeSolidSvgIcons = require("@fortawesome/free-solid-svg-icons");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
+var _default = exports["default"] = {
+  title: 'Tokens/Colors',
+  // component: Tokens,
+  tags: ['autodocs']
+};
+var Colors = exports.Colors = {
+  argTypes: {
+    color: {
+      control: {
+        type: 'select'
+      },
+      options: ['primary', 'success', 'alert', 'warning', 'default', 'gray', 'dark-gray', 'active']
+    }
+  },
+  args: {
+    color: 'primary'
+  },
+  render: function render(args) {
+    return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_components.List, null, /*#__PURE__*/_react["default"].createElement(_components.ListItem, null, /*#__PURE__*/_react["default"].createElement(_reactFontawesome.FontAwesomeIcon, {
+      icon: _freeSolidSvgIcons.faCircle,
+      className: "color-".concat(args.color)
+    }), " ", args.color), /*#__PURE__*/_react["default"].createElement(_components.ListItem, null, /*#__PURE__*/_react["default"].createElement("div", null, "Use the class ", /*#__PURE__*/_react["default"].createElement("code", null, ".color-", args.color), " to apply the color to any element.")), /*#__PURE__*/_react["default"].createElement(_components.ListItem, null, /*#__PURE__*/_react["default"].createElement("div", {
+      className: "color-".concat(args.color)
+    }, "Used on text.")), /*#__PURE__*/_react["default"].createElement(_components.ListItem, null, "Use the class ", /*#__PURE__*/_react["default"].createElement("code", null, ".bg-", args.color), " to apply the color to any element."), /*#__PURE__*/_react["default"].createElement(_components.ListItem, null, /*#__PURE__*/_react["default"].createElement("div", {
+      className: "bg-".concat(args.color, " rounded"),
+      style: {
+        padding: '15px'
+      }
+    }, "Used on background."))));
+  }
+};

package/stories/utils/TokensFontSizes.stories.js

@@ -0,0 +1,39 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.FontSizes = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _Table = require("../../components/table/Table");
+var _Expandable = require("../../components/expandable/Expandable");
+var _Separator = require("../../components/util/Separator");
+var _components = require("../../components");
+var _reactFontawesome = require("@fortawesome/react-fontawesome");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
+var _default = exports["default"] = {
+  title: 'Tokens/FontSize',
+  // component: Tokens,
+  tags: ['autodocs']
+};
+var FontSizes = exports.FontSizes = {
+  argTypes: {
+    size: {
+      control: {
+        type: 'select'
+      },
+      options: ['small', 'normal', 'large']
+    }
+  },
+  args: {
+    size: 'normal'
+  },
+  render: function render(_ref) {
+    var size = _ref.size;
+    return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement("div", {
+      className: "margin-bottom"
+    }, /*#__PURE__*/_react["default"].createElement(_components.Text, {
+      size: size
+    }, "This is ", size, " text.")), /*#__PURE__*/_react["default"].createElement("div", null, "Use the class ", /*#__PURE__*/_react["default"].createElement("code", null, ".text-size-", size), " to apply this size."));
+  }
+};

package/stories/utils/TokensMargins.stories.js

@@ -0,0 +1,51 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.Margins = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _Table = require("../../components/table/Table");
+var _Expandable = require("../../components/expandable/Expandable");
+var _Separator = require("../../components/util/Separator");
+var _components = require("../../components");
+var _reactFontawesome = require("@fortawesome/react-fontawesome");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
+var _default = exports["default"] = {
+  title: 'Tokens/Margins',
+  // component: Tokens,
+  tags: ['autodocs']
+};
+var Margins = exports.Margins = {
+  argTypes: {
+    margin: {
+      control: {
+        type: 'select'
+      },
+      options: ['margin-top', 'margin-bottom', 'collapsed', 'separated']
+    }
+  },
+  args: {
+    margin: 'margin-bottom'
+  },
+  render: function render(_ref) {
+    var margin = _ref.margin;
+    return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement("div", {
+      style: {
+        padding: '15px',
+        backgroundColor: '#F5F5F5'
+      }
+    }, "Some content here"), /*#__PURE__*/_react["default"].createElement("div", {
+      className: "".concat(margin),
+      style: {
+        padding: '15px',
+        backgroundColor: '#ccffc1'
+      }
+    }, "This element will change its margin based on the selected option."), /*#__PURE__*/_react["default"].createElement("div", {
+      style: {
+        padding: '15px',
+        backgroundColor: '#F5F5F5'
+      }
+    }, "Some content here"), /*#__PURE__*/_react["default"].createElement("div", null, "Use the class ", /*#__PURE__*/_react["default"].createElement("code", null, ".", margin), " to apply this margin."));
+  }
+};

package/tokens.js

@@ -0,0 +1,44 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.colorWarning = exports.colorSuccess = exports.colorPrimary = exports.colorAlert = exports.color = exports.borderRadius = exports.borderColor = exports.baseMargin = void 0;
+// Design tokens — use these in React style props instead of hardcoded values.
+// They map to CSS custom properties defined in theme.less / variables.less.
+//
+// Usage (named import):
+//   import { baseMargin, colorPrimary } from 'gdx-ui';
+//   <div style={{ margin: baseMargin, color: colorPrimary }} />
+//
+// Usage (object):
+//   import { tokens } from 'gdx-ui';
+//   <div style={{ margin: tokens.baseMargin }} />
+
+// Spacing
+var baseMargin = exports.baseMargin = 'var(--base-margin)';
+
+// Border
+var borderRadius = exports.borderRadius = 'var(--border-radius)';
+
+// Colors — semantic
+var colorPrimary = exports.colorPrimary = 'var(--primary-color)';
+var colorSuccess = exports.colorSuccess = 'var(--success-color)';
+var colorAlert = exports.colorAlert = 'var(--alert-color)';
+var colorWarning = exports.colorWarning = 'var(--warning-color)';
+var color = exports.color = 'var(--color)';
+
+// Colors — theme-aware (light/dark)
+var borderColor = exports.borderColor = 'var(--border-color)';
+
+// Object shorthand (all tokens grouped)
+// export const tokens = {
+//   baseMargin,
+//   borderRadius,
+//   colorPrimary,
+//   colorSuccess,
+//   colorAlert,
+//   colorWarning,
+//   color,
+//   borderColor,
+// };

package/components/navbar/Navbar.js

@@ -1,125 +0,0 @@
-"use strict";
-
-function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.Navbar = exports.NavLogo = exports.NavList = exports.NavExpandableIcon = exports.NavExpandableAreas = exports.NavContentArea = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _reactFontawesome = require("@fortawesome/react-fontawesome");
-var _useOutsideClick2 = require("../../hooks/useOutsideClick");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
-function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
-function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
-function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
-function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
-var NavbarContext = /*#__PURE__*/(0, _react.createContext)(null);
-var Navbar = exports.Navbar = function Navbar(_ref) {
-  var children = _ref.children;
-  var _useState = (0, _react.useState)({
-      active: null,
-      open: false
-    }),
-    _useState2 = _slicedToArray(_useState, 2),
-    settings = _useState2[0],
-    setSettings = _useState2[1];
-  return /*#__PURE__*/_react["default"].createElement(NavbarContext.Provider, {
-    value: {
-      settings: settings,
-      setSettings: setSettings
-    }
-  }, /*#__PURE__*/_react["default"].createElement("nav", {
-    className: "navbar"
-  }, children));
-};
-var NavList = exports.NavList = function NavList(_ref2) {
-  var children = _ref2.children;
-  return /*#__PURE__*/_react["default"].createElement("ul", {
-    className: "navbar-list"
-  }, children);
-};
-var NavLogo = exports.NavLogo = function NavLogo(_ref3) {
-  var src = _ref3.src,
-    alt = _ref3.alt;
-  return /*#__PURE__*/_react["default"].createElement("li", {
-    className: "navbar-logo"
-  }, /*#__PURE__*/_react["default"].createElement("img", {
-    src: src,
-    alt: alt
-  }));
-};
-var NavExpandableIcon = exports.NavExpandableIcon = function NavExpandableIcon(_ref4) {
-  var icon = _ref4.icon,
-    control = _ref4.control;
-  var _useContext = (0, _react.useContext)(NavbarContext),
-    settings = _useContext.settings,
-    setSettings = _useContext.setSettings;
-  var active = settings.active,
-    open = settings.open;
-  var onClickBtn = function onClickBtn() {
-    setSettings({
-      active: control,
-      open: !open
-    });
-  };
-  return /*#__PURE__*/_react["default"].createElement("li", {
-    className: "navbar-item"
-  }, /*#__PURE__*/_react["default"].createElement("button", {
-    className: "navbar-link ".concat(active == control ? 'active' : ''),
-    onClick: onClickBtn
-  }, /*#__PURE__*/_react["default"].createElement(_reactFontawesome.FontAwesomeIcon, {
-    icon: icon,
-    className: "nav-main-icon"
-  })));
-};
-var NavExpandableAreas = exports.NavExpandableAreas = function NavExpandableAreas(_ref5) {
-  var children = _ref5.children;
-  var _useContext2 = (0, _react.useContext)(NavbarContext),
-    setSettings = _useContext2.setSettings;
-  var onClickOutside = function onClickOutside() {
-    setSettings({
-      active: null,
-      open: false
-    });
-  };
-  var _useOutsideClick = (0, _useOutsideClick2.useOutsideClick)({
-      onClickOutside: onClickOutside
-    }),
-    wrapperRef = _useOutsideClick.wrapperRef;
-  return /*#__PURE__*/_react["default"].createElement("div", {
-    ref: wrapperRef
-  }, children);
-};
-var NavContentArea = exports.NavContentArea = function NavContentArea(_ref6) {
-  var children = _ref6.children,
-    id = _ref6.id;
-  var _useContext3 = (0, _react.useContext)(NavbarContext),
-    settings = _useContext3.settings;
-  var active = settings.active,
-    open = settings.open;
-  return /*#__PURE__*/_react["default"].createElement("div", {
-    id: id,
-    className: "nav-expandible-area ".concat(active === id && open ? '' : 'hidden')
-  }, children);
-};
-Navbar.propTypes = {
-  children: _propTypes["default"].any
-};
-NavList.propTypes = {
-  children: _propTypes["default"].any
-};
-NavExpandableIcon.propTypes = {
-  icon: _propTypes["default"].any,
-  control: _propTypes["default"].string
-};
-NavExpandableAreas.propTypes = {
-  children: _propTypes["default"].any
-};
-NavContentArea.propTypes = {
-  children: _propTypes["default"].any,
-  id: _propTypes["default"].string
-};