:root{--primary-color: #356fb7;--success-color: #209f85;--error-color: #e34167;--warning-color: #ffbb00;--sub-color: #3a4559;--primary-color-1: #356fb705;--primary-color-2: #356fb720;--primary-color-3: #356fb730;--primary-color-4: #356fb740;--primary-color-5: #356fb750;--primary-color-6: #356fb760;--primary-color-7: #356fb770;--primary-color-8: #356fb780;--primary-color-9: #356fb790;--success-color-1: #209f8510;--success-color-2: #209f8520;--success-color-3: #209f8530;--success-color-4: #209f8540;--success-color-5: #209f8550;--success-color-6: #209f8560;--success-color-7: #209f8570;--success-color-8: #209f8580;--success-color-9: #209f8590;--error-color-1: #e3416710;--error-color-2: #e3416720;--error-color-3: #e3416730;--error-color-4: #e3416740;--error-color-5: #e3416750;--error-color-6: #e3416760;--error-color-7: #e3416770;--error-color-8: #e3416780;--error-color-9: #e3416790;--sub-color-1: #3a455910;--sub-color-2: #3a455920;--sub-color-3: #3a455930;--sub-color-4: #3a455940;--sub-color-5: #3a455950;--sub-color-6: #3a455960;--sub-color-7: #3a455970;--sub-color-8: #3a455980;--sub-color-9: #3a455990;--white: #fff;--dark: #333;--border-width: 2px;--border-radius-base: 5px;--circle: 999px;--padding-small: .35rem .5rem;--padding: .5rem .75rem;--padding-large: .85rem 1.15rem;--alpha-dark: .75;--alpha-light: .25;--alpha: .5;--font-size-small: .75rem;--font-size-normal: .9rem;--font-size-medium: 1rem;--font-size-large: 1.25rem;--font-size-extra-large: 1.5rem}*,*:before,*:after{box-sizing:border-box}*{margin:0;padding:0;border:0;box-sizing:border-box;font-family:Lato,sans-serif}html,body,#root{height:100%;width:100%}ul,ol{list-style:none}a{text-decoration:none;color:inherit}button{border:none;background:none;cursor:pointer}input,textarea,select,button{font-family:inherit;font-size:inherit;color:inherit;&:focus{outline:none}}img{height:100%;width:auto;object-fit:cover}table{border-collapse:collapse;border-spacing:0}h1,h2,h3,h4,h5,h6,p,ul,ol,li,figure,figcaption,blockquote,dl,dd,label,input,button{color:var(--sub-color);line-height:1.5}.page__content::-webkit-scrollbar{width:0px}.page{height:100%;max-width:100%;overflow:hidden;background-color:var(--primary-color-1)}.page__sider{position:relative;height:100%;width:clamp(250px,25%,350px);background-color:var(--primary-color-4);padding:1rem;.qb-btn{width:100%}.avatar{height:70px;width:70px;background-color:var(--primary-color);border-radius:var(--circle);color:var(--white)}}.page__sider__logout{width:100%;position:absolute;bottom:0;border-radius:0}.page__content{height:100%;overflow-y:scroll;width:clamp(100% - 250px,75%,100% - 350px);padding:var(--padding);position:relative;animation-name:fadeToRight;animation-duration:.33s}.container{max-width:1280px;margin:0 auto;padding:1rem}.ui-input{margin-bottom:.5rem;&.large{padding:var(--padding-large);font-size:var(--font-size-medium)}&.small{padding:var(--padding-small);font-size:var(--font-size-small)}}.copyright{position:absolute;bottom:0;font-size:.9rem;color:var(--sub-color)}.qb-nodata{width:100%;color:var(--sub-color);img{height:150px}}.form-item{label{text-transform:capitalize}}.qb-loading{position:absolute;height:100%;width:100%;background-color:var(--primary-color-2);z-index:24;color:var(--sub-color);letter-spacing:1px}.fa-spinner{font-size:24px;animation:spin 1s infinite linear}.notifications{position:fixed;top:1rem;left:50%;transform:translate(-50%);z-index:1999;.notification{padding:var(--padding);margin-bottom:.5rem;width:clamp(350px,20vw,500px);border-radius:var(--border-radius-base);.notification__icon{font-size:var(--font-size-extra-large);padding:.25rem;color:var(--white)}p{font-size:16px}h3,p{color:var(--white)}&.--success{background-color:var(--success-color)}&.--info{background-color:var(--primary-color)}&.--error{background-color:var(--error-color)}}}.flex--center--center{display:flex;justify-content:center;align-items:center}.flex--center--start{display:flex;justify-content:center;align-items:flex-start}.flex--center--end{display:flex;justify-content:center;align-items:flex-end}.flex--center--stretch{display:flex;justify-content:center;align-items:stretch}.flex--start--start{display:flex;justify-content:flex-start;align-content:flex-start}.flex--start--center{display:flex;justify-content:flex-start;align-items:center}.flex--start--end{display:flex;justify-content:flex-start;align-items:flex-end}.flex--start--stretch{display:flex;justify-content:flex-start;align-items:stretch}.flex--between--start{display:flex;justify-content:space-between;align-items:flex-start}.flex--between--center{display:flex;justify-content:space-between;align-items:center}.flex--between--end{display:flex;justify-content:space-between;align-items:flex-end}.flex--between--stretch{display:flex;justify-content:space-between;align-items:stretch}.flex--around--center{display:flex;justify-content:space-around;align-items:center}.flex--evenly--center{display:flex;justify-content:space-evenly;align-items:center}.flex--around--start{display:flex;justify-content:space-around;align-items:flex-start}.flex--around--end{display:flex;justify-content:space-around;align-items:flex-end}.flex--around--stretch{display:flex;justify-content:space-around;align-items:stretch}.flex--end--center{display:flex;justify-content:flex-end;align-items:center}.flex--end--start{display:flex;justify-content:flex-end;align-items:flex-start}.flex--end--end{display:flex;justify-content:flex-end;align-items:flex-end}.flex--end--stretch{display:flex;justify-content:flex-end;align-items:stretch}.flex--column{flex-direction:column}.flex--column--center{flex-direction:column;align-items:center;display:flex}.flex--wrap{flex-wrap:wrap}.flex--wrap--reverse{flex-wrap:reverse}.flex--inline{display:inline-flex}.flex--gap{gap:1rem}.flex--gap--sm{gap:.5rem}.flexbox{display:flex}.flexbox.--justify-center{justify-content:center}.flexbox.--justify-start{justify-content:flex-start}.flexbox.--justify-end{justify-content:flex-end}.flexbox.--justify-between{justify-content:space-between}.flexbox.--justify-around{justify-content:space-around}.flexbox.--align-center{align-items:center}.flexbox.--align-start{align-items:flex-start}.flexbox.--align-end{align-items:flex-end}.flexbox.--align-stretch{align-items:stretch}.flexbox.--align-baseline{align-items:baseline}.flexbox.--wrap{flex-wrap:wrap}.flexbox.--row{flex-direction:row}.flexbox.--row-reverse{flex-direction:row-reverse}.flexbox.--column{flex-direction:column}.flexbox.--column-reverse{flex-direction:column-reverse}.flexbox.--gap-small{gap:.5rem}.flexbox.--gap-normal{gap:1rem}.flexbox.--gap-large{gap:1.5rem}button:disabled{opacity:.7;cursor:no-drop;&:hover{box-shadow:none}}.qb-btn{background-color:var(--white);border:0;padding:var(--padding);font-weight:600;letter-spacing:.5px;white-space:nowrap;color:var(--sub-color);&.--small{padding:var(--padding-small)}&.--large{padding:var(--padding-large);font-size:var(--font-size-medium)}&.btn--full{width:100%}&:hover{box-shadow:var(--primary-color) 0 0 12px}&.active{background-color:var(--primary-color);color:var(--white)}&.--primary,&.--active{background-image:linear-gradient(135deg,var(--primary-color),#a629d9);background-color:var(--primary-color);color:var(--white)}&.--danger{background-color:var(--error-color);color:var(--white)}&.--success{background-color:var(--success-color);color:var(--white)}&.--link{background-color:transparent;&:hover,&.active{box-shadow:none;background-color:var(--primary-color);color:var(--white)}}}.qb-title{width:100%;&.--primary{color:var(--primary-color)}&.--danger{color:var(--error-color)}&.--center{text-align:center}}.qb-table{min-width:clamp(100%,100%,200%);thead tr:first-child{th{border-bottom:2px solid var(--white)}}tr th{padding:.75rem 1rem;background-color:var(--primary-color);color:var(--white);text-transform:capitalize;&:not(:last-child){border-right:2px solid var(--white)}}tr td{padding:.75rem 1rem;img{height:clamp(50px,100px,200px)}&.--invalid{background-color:var(--error-color-6)}}tbody tr{transition:all .33s ease;cursor:pointer;&:hover{background-color:var(--primary-color-4);box-shadow:var(--primary-color) 0 0 6px}td:not(:first-child){text-align:center}}tr:nth-child(odd){background-color:var(--primary-color-1)}tr:nth-child(2n){background-color:var(--primary-color-2)}}.table-container{margin-top:.25rem;position:relative;display:block;max-height:94vh;width:100%;overflow:scroll;thead{position:sticky;top:0}}.qb-modal{position:fixed;height:100%;width:100%;top:0;left:0;background-color:var(--sub-color-7);z-index:1024}.qb-modal__title{padding-bottom:.4rem;border-bottom:2px solid var(--sub-color-9)}.qb-modal__body{padding:1rem 0}.qb-modal__content{min-width:350px;background-color:var(--white);padding:var(--padding);border-radius:10px;box-shadow:var(--sub-color-9) 0 0 6px}input,button,select{border-style:solid;border-radius:5px;transition:all .33s ease}input,select{border-width:var(--border-width);border-color:var(--primary-color-3);padding:var(--padding);font-size:var(--font-size-normal);&:hover{box-shadow:var(--primary-color) 0 0 12px}&:focus{border-color:var(--primary-color);box-shadow:var(--primary-color) 0 0 12px}&:not(:disabled){background:var(--white)}&:disabled{cursor:no-drop}&:disabled:hover{box-shadow:none}}input[type=checkbox]{margin-bottom:0;width:25px;height:25px;cursor:pointer;outline:1px solid var(--primary-color-3)}.qb-upload-file{position:relative;height:150px;width:100%;border:2px dashed var(--primary-color-6);background-color:var(--primary-color-2);border-radius:5px;transition:all .3s ease;&.--uploaded{height:42px}.drop-area{position:absolute;height:100%;width:100%;top:0;left:0;z-index:1}.file-upload{position:relative;height:100%;width:100%;background-color:transparent;border:0;outline:0;z-index:1;cursor:pointer}.qb-title{position:absolute;height:100%;width:100%;z-index:0;font-weight:600}}@keyframes fadeInTop{0%{top:1.5rem}50%{top:0}}@keyframes fadeInBottom{0%{bottom:1.5rem}50%{bottom:0}}@keyframes fadeToLeft{0%{right:1.5rem}50%{right:0}}@keyframes fadeToRight{0%{left:1.5rem}50%{left:0}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.slide-fade-enter-active,.slide-fade-exit-active{transition:opacity .3s,transform .3s}.slide-fade-enter,.slide-fade-exit-to{transform:translate(10px);opacity:0}.slide-fade-enter{transform:translate(-10px)}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem 2rem;.ui-input{width:100%}&.--col-2{grid-template-columns:repeat(2,1fr)}&.--col-3{grid-template-columns:repeat(3,1fr)}&.--col-4{grid-template-columns:repeat(4,1fr)}&.--col-5{grid-template-columns:repeat(5,1fr)}.--gc-2{grid-column:span 2}.--gc-3{grid-column:span 3}.--gc-4{grid-column:span 4}}.login{img{height:175px}.login__form{width:clamp(350px,20vw,500px)}input{width:100%;margin-bottom:1rem}.login__form__submit{width:100%;margin:.5rem 0}}.dashboard__content__filter{padding-bottom:1rem;border-bottom:2px solid var(--primary-color-8);.btn-search{width:150px}}.dashboard__content__filter__options{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem 2rem;.ui-input,select{width:100%}}.qb-item-data{img{height:clamp(50px,150px,300px)}}