.layout{display:flex}.layout .container{flex:5;max-height:100vh;overflow-y:auto}.sidebar-menu-item-head,.sidebar-menu-item{height:40px}.home .widgets,.home .charts{display:flex;padding:20px;gap:20px}.home .charts{padding:5px 20px}.home .listContainer{-webkit-box-shadow:2px 4px 10px 1px rgba(0,0,0,.47);box-shadow:2px 4px 10px 1px #c9c9c978;padding:20px;margin:20px}.home .listContainer .listTitle{font-weight:500;color:gray;margin-bottom:15px}.widget{display:flex;flex:1;padding:10px;justify-content:space-between;-webkit-box-shadow:2px 4px 10px 1px rgba(0,0,0,.47);box-shadow:2px 4px 10px 1px #c9c9c978;border-radius:10px;height:100px}.widget .left{display:flex;flex-direction:column;justify-content:space-between}.widget .left .title{font-weight:700;font-size:14px;color:#789}.widget .left .counter{font-size:28px;font-weight:300}.widget .left .link{width:max-content;font-size:14px}.widget .left .percentage{display:flex;align-items:center;font-size:14px}.widget .left .percentage.positive{color:green}.widget .left .percentage.negative{color:red}.widget .left .icon{font-size:18px;padding:5px;border-radius:5px;align-self:flex-end}.widget .right{display:flex;flex-direction:column;justify-content:space-between;align-items:flex-end;border-radius:20%}.featured{flex:2;-webkit-box-shadow:2px 4px 10px 1px rgba(0,0,0,.47);box-shadow:2px 4px 10px 1px #c9c9c978;padding:10px}.featured .top{display:flex;align-items:center;justify-content:space-between;color:gray}.featured .top .title{font-size:16px;font-weight:600}.featured .top .icon{font-size:medium;cursor:pointer}.featured .bottom{padding:20px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:15px}.featured .bottom .featuredChart{width:150px;height:150px}.featured .bottom .title{font-weight:500;color:gray}.featured .bottom .amout{font-size:30px}.featured .bottom .description{font-weight:300;font-size:12px;text-align:center}.featured .bottom .summary{width:100%;display:flex;align-items:center;justify-content:space-between}.featured .bottom .summary .item{display:flex;flex-direction:column;align-items:center}.featured .bottom .summary .item .itemTitle{font-size:14px;color:gray}.featured .bottom .summary .item .resultAmount{display:flex;align-items:center;margin-top:10px;font-size:14px}.featured .bottom .summary .item .resultAmount.positive{color:green}.featured .bottom .summary .item .resultAmount.negative{color:red}.featured .bottom .summary .item .resultAmount .icon{font-size:medium}.CircularProgressbar{width:100%;vertical-align:middle}.CircularProgressbar .CircularProgressbar-path{stroke:#3e98c7;stroke-linecap:round;-webkit-transition:stroke-dashoffset .5s ease 0s;transition:stroke-dashoffset .5s ease 0s}.CircularProgressbar .CircularProgressbar-trail{stroke:#d6d6d6;stroke-linecap:round}.CircularProgressbar .CircularProgressbar-text{fill:#3e98c7;font-size:20px;dominant-baseline:middle;text-anchor:middle}.CircularProgressbar .CircularProgressbar-background{fill:#d6d6d6}.CircularProgressbar.CircularProgressbar-inverted .CircularProgressbar-background{fill:#3e98c7}.CircularProgressbar.CircularProgressbar-inverted .CircularProgressbar-text{fill:#fff}.CircularProgressbar.CircularProgressbar-inverted .CircularProgressbar-path{stroke:#fff}.CircularProgressbar.CircularProgressbar-inverted .CircularProgressbar-trail{stroke:transparent}.chart{flex:5;-webkit-box-shadow:2px 4px 10px 1px rgba(0,0,0,.47);box-shadow:2px 4px 10px 1px #c9c9c978;padding:10px;font-size:12px}.chart .title{font-size:16px;color:gray;margin-bottom:20px}.users .table{margin:20px;-webkit-box-shadow:2px 4px 10px 1px rgba(0,0,0,.47);box-shadow:2px 4px 10px 1px #c9c9c978}.users .table .tableHeader{padding:10px;display:flex;justify-content:space-between;align-items:center}.users .table .tableHeader .tableFiler{display:flex;align-items:center;gap:10px;z-index:10}.admin{display:flex;align-items:center}.admin .info{display:flex;flex-direction:column;align-items:flex-end;margin-right:10px;font-size:medium}.admin .info .name{font-weight:700}.admin .logout{margin-left:20px}.categories .title{margin:20px}.categories .createBtn{display:flex;justify-content:flex-end;margin:20px 20px 0 0}.categories .cards-list{margin:20px;display:flex;flex-wrap:wrap;gap:20px}.categories .cards-list *{flex:1 1 250px}.qrcodes{margin:20px}.qrcodes .title{font-size:24px;font-weight:700;margin-bottom:10px;text-align:center}.qrcodes .formElement{margin:20px 0}.qrcodes .formElement .numberInput{width:100%;outline:none;border:1px solid #ccc;border-radius:5px;padding:5px 10px;font-size:16px}.userBank .header{margin:20px;padding:20px;border-radius:10px}.userBank .header .content{display:flex;justify-content:space-between;align-items:center;padding:10px;flex-wrap:wrap}.userBank .header .content .item .label{font-size:14px;color:#999}.userBank .header .content .item .value{font-size:18px;color:#111;font-weight:700}.userBank .header .content .divider{height:50px;width:1px;background-color:#111}.userBank .body{margin:20px;display:flex;gap:20px;flex-wrap:wrap}.userBank .body .title{font-weight:700;margin-bottom:10px;text-align:center}.userBank .body .green{color:green}.userBank .body .red{color:red}.userBank .body .yellow{color:#ff6d00}.userBank .body .tableContainer{flex:1}.earnings{margin:20px}.earnings .tableHeader{padding:20px;position:relative;z-index:10;display:flex;flex-direction:row;gap:20px;flex-wrap:wrap;align-items:center;justify-content:space-between}.earnings .tableHeader .tableFilter{display:flex;flex-direction:row;gap:20px;flex-wrap:wrap;align-items:center}.earnings .tableHeader .dateFilter{display:flex;flex-direction:row;gap:10px;flex-wrap:wrap;align-items:center}.qrcodes{margin:20px;display:flex;flex-direction:row;flex-wrap:wrap;gap:20px}.qrcodes .tableContainer{flex:1}.qrcodes .tableContainer h3{text-align:center;margin-bottom:10px}.tableHeader{padding:20px;display:flex;flex-wrap:wrap;gap:10px;justify-content:space-between}.tableHeader .tableFilter{display:flex;flex-wrap:wrap;gap:10px;z-index:10}.ecoPacketBoxes{padding:20px}.ecoPacketBoxes .content{display:flex;flex-direction:row;flex-wrap:wrap;gap:20px}.ecoPacketBoxes .content .card{flex:1;max-width:300px;min-width:max-content;-webkit-box-shadow:2px 4px 10px 1px rgba(0,0,0,.47);box-shadow:2px 4px 10px 1px #c9c9c978}.boxDetail .header{margin:20px;padding:20px;border-radius:10px}.boxDetail .header .content{display:flex;justify-content:space-between;align-items:center;padding:10px;flex-wrap:wrap}.boxDetail .header .content .item .label{font-size:14px;color:#999}.boxDetail .header .content .item .value{font-size:18px;color:#111;font-weight:700}.boxDetail .header .content .divider{height:50px;width:1px;background-color:#111}.boxDetail .table{margin:20px}.boxDetail .table .title{font-size:24px;color:#111;font-weight:700;text-align:center}.createEcoBox .title{font-size:24px;font-weight:700;margin-bottom:10px;text-align:center}.createEcoBox .formElement{display:flex;flex-direction:column;gap:2px}.createEcoBox .formElement.formElementNew{display:flex;align-items:center;gap:2px}.createEcoBox .formElement .numberInput{width:100%;outline:none;border:1px solid #ccc;border-radius:5px;padding:5px 10px;font-size:16px}.createEcoBox .submitBtn{margin-top:40px}.formGrid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px 10px}.formGrid label{color:#444;margin-bottom:2px}