.cardsContainer{display:none;flex-direction:column;gap:20px;margin:20px}.cardsContainer .card{display:flex;flex-direction:column;gap:10px;padding:20px}.cardsContainer .card div{display:flex;justify-content:space-between;padding-bottom:4px;border-bottom:1px solid rgba(201,201,201,.7);align-items:center}.cardsContainer .card div>:first-child{font-weight:700;padding-bottom:5px}.cardsContainer .card div>:last-child{opacity:.8;padding-bottom:5px}.cardsContainer .card div figure{display:flex;align-items:center;gap:5px}.cardsContainer .card div .cellAction{display:flex;align-items:center;gap:15px}.cardsContainer .card div .cellAction .viewButton{padding:2px 5px;border-radius:5px;color:#00008b;border:1px dotted rgba(0,0,139,.596);cursor:pointer}.cardsContainer .card div .cellAction .deleteButton{padding:2px 5px;border-radius:5px;color:#dc143c;border:1px dotted rgba(220,20,60,.6);cursor:pointer}.cardsContainer .card img{width:30px;height:30px;border-radius:50%}.cardsContainer .card .cellWithStatus{padding:5px;border-radius:5px}.cardsContainer .card .cellWithStatus.Approved{color:green;background-color:#00800027}.cardsContainer .card .cellWithStatus.Pending{color:#daa520;background-color:#bdbd031a}.cardsContainer .card .cellWithStatus.active{background-color:#0080000d;color:green}.cardsContainer .card .cellWithStatus.pending{background-color:#ffd9000d;color:#daa520}.cardsContainer .card .cellWithStatus.passive{background-color:#ff00000d;color:#dc143c}@media (max-width: 998px){.cardsContainer{display:flex}}.chart{flex:4;padding:10px;color:gray;display:flex;flex-direction:column;align-items:center}.chart .title{margin-bottom:20px}.chart .chartGrid{stroke:#e4e1e1}.chart .chart-style{width:730px;height:300px}@media (max-width: 1200px){.chart{flex:3;justify-content:center}.chart .chart-style{width:450px}}@media (max-width: 998px){.chart .chart-style{width:600px}}@media (max-width: 798px){.chart .chart-style{width:400px;height:250px}}@media (max-width: 500px){.chart .chart-style{width:250px;height:150px}}.featured{flex:2;padding:10px}.featured .top{display:flex;align-items:center;justify-content:space-between;color:gray}.featured .top h3{font-size:16px}.featured .bottom{padding:20px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:15px}.featured .bottom .featuredChart{width:100px;height:100px}.featured .bottom h4{font-weight:500;color:gray}.featured .bottom .amount{font-size:30px}.featured .bottom .desc{font-weight:300;font-size:12px;color:gray;text-align:center}.featured .bottom .summary{width:100%;display:flex;align-items:center;justify-content:space-between}.featured .bottom .summary .item{text-align:center}.featured .bottom .summary .item h5{font-size:14px;color:gray}.featured .bottom .summary .item .itemResult{display:flex;align-items:center;margin-top:10px;font-size:14px}.featured .bottom .summary .item .itemResult.positive{color:green}.featured .bottom .summary .item .itemResult.negative{color:red}.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}.table{border:1px solid rgba(201,201,201,.7)}.table .cellWrapper{display:flex;align-items:center}.table .cellWrapper .image{width:32px;height:32px;border-radius:50%;margin-right:10px;object-fit:cover}.table .status{padding:5px;border-radius:5px}.table .status.Approved{color:green;background-color:#00800027}.table .status.Pending{color:#daa520;background-color:#bdbd031a}@media (max-width: 998px){.table{display:none}}.widget{display:flex;flex-direction:column;justify-content:space-between;flex:1;padding:10px;border-radius:10px;font-weight:700}.widget .up{display:flex;justify-content:space-between}.widget .up h2{font-weight:700;font-size:13px}.widget .up .percentage{display:flex;align-items:center;font-size:14px}.widget .up .percentage.positive{color:green}.widget .up .percentage.negative{color:red}.widget .counter{font-size:20px;font-weight:400}.widget .down{display:flex;justify-content:space-between;align-items:center;color:#a0a0a0}.widget .down .link{width:max-content;font-size:12px}.widget .down .icon{font-size:18px;padding:5px;border-radius:5px}@media (max-width: 798px){.widget .up h2{font-size:13px}.widget .up .percentage{font-size:12px}.widget .counter{font-size:16px}.widget .down .link{font-size:11px}.widget .down .icon{font-size:15px}}.home{flex:6}.home .charts{display:flex;padding:20px;gap:20px}.home .widgets{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;padding:20px}.home .charts{padding:5px 20px}.home .listContainer{padding:20px;margin:20px}.home .listContainer h3{color:gray;margin-bottom:15px}@media (max-width: 998px){.home .charts{flex-direction:column}.home .listContainer h3{color:#000;font-weight:700;text-align:center;margin:0}}@media (max-width: 798px){.home .widgets{grid-template-columns:repeat(2,auto);gap:10px}}.datatable{height:600px;padding:20px;flex:6;color:red}.datatable .cellWithImg{display:flex;align-items:center}.datatable .cellWithImg .cellImg{width:32px;height:32px;border-radius:50%;object-fit:cover;margin-right:20px}.datatable .cellWithStatus{padding:5px;border-radius:5px}.datatable .cellWithStatus.active{background-color:#0080000d;color:green}.datatable .cellWithStatus.pending{background-color:#ffd9000d;color:#daa520}.datatable .cellWithStatus.passive{background-color:#ff00000d;color:#dc143c}.datatable .cellAction{display:flex;align-items:center;gap:15px}.datatable .cellAction .viewButton{padding:2px 5px;border-radius:5px;color:#00008b;border:1px dotted rgba(0,0,139,.596);cursor:pointer}.datatable .cellAction .deleteButton{padding:2px 5px;border-radius:5px;color:#dc143c;border:1px dotted rgba(220,20,60,.6);cursor:pointer}@media (max-width: 998px){.datatable{display:none}}.datatableTitle{font-size:24px;color:gray;margin-bottom:10px;display:flex;align-items:center;justify-content:space-between;padding:20px 20px 0}.datatableTitle .link{text-decoration:none;color:green;font-size:16px;font-weight:700;border:1px solid green;padding:5px;border-radius:5px;cursor:pointer}.new{flex:6}.new h2{padding:20px;margin:20px;text-align:center}.new .main-section{padding:10px;margin:20px;display:flex;gap:20px;flex-direction:column;align-items:center}.new .main-section .top{width:100%;text-align:center;display:flex;align-items:center;padding-left:23px}.new .main-section .top .uploadInput .fileLabel{display:flex;align-items:center;gap:5px;cursor:pointer}.new .main-section .top img{width:80px;height:80px;border-radius:50%;object-fit:cover;margin-right:20px}.new .main-section .bottom{width:100%;display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,300px));gap:30px}.new .main-section .bottom .formInput{margin:0 20px}.new .main-section .bottom .formInput label{display:flex;align-items:center;gap:10px}.new .main-section .bottom .formInput label .icon{cursor:pointer}.new .main-section .bottom .formInput input{width:100%;padding:5px;border:none;border-bottom:1px solid gray}.new .main-section .bottom button{width:calc(100% - 30px);padding:10px;border:none;background-color:teal;color:#fff;font-weight:700;cursor:pointer;margin:0 20px 20px}.single{display:flex;width:100%;flex-direction:column;flex:6}.single .top{padding:20px;display:flex;gap:20px}.single .top .left{flex:1;padding:20px;position:relative}.single .top .left .editButton{position:absolute;top:0;right:0;padding:5px;font-size:12px;color:#7451f8;background-color:#7551f818;cursor:pointer;border-radius:0 0 0 5px}.single .top .left .item{display:flex;gap:20px}.single .top .left .item .itemImg{width:100px;height:100px;border-radius:50%;object-fit:cover}.single .top .left .item .details .itemTitle{margin-bottom:10px;color:#555}.single .top .left .item .details .detailItem{margin-bottom:10px;font-size:14px}.single .top .left .item .details .detailItem .itemKey{font-weight:700;color:gray;margin-right:5px}.single .top .left .item .details .detailItem .itemValue{font-weight:300}.single .top .right{flex:2}.single .bottom{margin:20px;padding:20px}.single .bottom .title{color:#000;font-weight:700;text-align:center;margin:0 0 15px;font-size:20px}.single .title{font-size:16px;margin-bottom:20px}@media (max-width: 998px){.single .top{flex-direction:column;padding:10px}.single .top .left{padding:10px}.single .top .left .item{gap:10px}.single .bottom{margin:0;padding:0;border:none;box-shadow:none}.single .bottom .title{margin:20px 10px;padding:20px;-webkit-box-shadow:2px 4px 10px 1px rgba(0,0,0,.47);box-shadow:2px 4px 10px 1px #c9c9c978;border:1px solid rgba(201,201,201,.7)}}.app{display:flex;position:relative}.app main{flex:6;display:flex;flex-direction:column}.app input{outline:none}.app .shadow{-webkit-box-shadow:2px 4px 10px 1px rgba(0,0,0,.47);box-shadow:2px 4px 10px 1px #c9c9c978;border:1px solid rgba(201,201,201,.7)}.app .css-1e2bxag-MuiDataGrid-root .MuiDataGrid-iconSeparator{display:none}.app.dark{background-color:#111;color:#9c9c9c}.app.dark .shadow{-webkit-box-shadow:2px 4px 10px 1px rgba(110,110,110,.47);box-shadow:2px 4px 10px 1px #6e6e6e78 1px solid #535252b3;border:1px solid rgba(201,201,201,.3)}.app.dark .chartGrid{stroke:#e4e4e438}.app.dark .table{background-color:#111}.app.dark .table .tableCell{color:gray}.app.dark nav{color:#999;border-color:#333}.app.dark nav .search{border-color:gray}.app.dark aside{background-color:#111;border-color:#333}.app.dark aside .top .logo{color:#999}.app.dark aside hr{border-color:#333}.app.dark aside ul li:hover{background-color:#333}.app.dark aside ul li .icon{color:#999}.app.dark .datatable{border:1px solid rgb(111,111,111)}.app.dark .datatable .datagrid{color:gray;border:none}.app.dark .datatable .datagrid .cellWithStatus.active,.app.dark .datatable .datagrid .cellWithStatus.passive,.app.dark .datatable .datagrid .cellWithStatus.pending{background-color:#1e1d1d}.app.dark .datatable .datagrid .viewButton{color:#00f!important;background-color:#1e1d1d;padding:2px}.app.dark .datatable .datagrid .deleteButton{color:#dc143c;background-color:#1e1d1d;padding:2px}.app.dark input{background-color:transparent;color:#fff}.app.dark .menu p{background-color:#9c9c9c}.app.dark .cardsContainer .card div{border-bottom:1px solid rgba(201,201,201,.4)}.app.dark .cardsContainer .card div>:first-child{opacity:.8}.app.dark .cardsContainer .cellWithStatus.active,.app.dark .cardsContainer .cellWithStatus.passive,.app.dark .cardsContainer .cellWithStatus.pending{background-color:#1e1d1d}.app.dark .cardsContainer .viewButton{color:#00f!important;background-color:#1e1d1d;padding:2px!important}.app.dark .cardsContainer .deleteButton{background-color:#1e1d1d;padding:2px!important}.app.dark .table{border:1px solid rgba(201,201,201,.4)}.app.dark .css-1pe4mpk-MuiButtonBase-root-MuiIconButton-root,.app.dark .css-rtrcn9-MuiTablePagination-root{color:gray!important}.app.dark .css-1e2bxag-MuiDataGrid-root .MuiDataGrid-cell,.app.dark .css-f3jnds-MuiDataGrid-columnHeaders{border-bottom:1px solid rgba(201,201,201,.3)}.app.dark .css-i4bv87-MuiSvgIcon-root{color:gray}.app.dark .css-1ygcj2i-MuiTableCell-root,.app.dark .css-1ex1afd-MuiTableCell-root{border-bottom:1px solid rgba(201,201,201,.3)}nav{height:50px;border-bottom:.5px solid rgb(230,227,227);display:flex;align-items:center;font-size:14px;color:#555}nav .wrapper{width:100%;padding:20px;display:flex;align-items:center;justify-content:space-between}nav .wrapper .search{display:flex;align-items:center;border:.5px solid lightgray;padding:3px;border-radius:5px}nav .wrapper input{border:none;outline:none;background-color:transparent}nav .wrapper input::placeholder{font-size:12px}nav .items{display:flex;align-items:center}nav .items .item{display:flex;align-items:center;margin-right:20px;position:relative}nav .items .item:first-child{gap:5px}nav .items .item .icon{font-size:20px;cursor:pointer}nav .items .item .avatar{width:30px;height:30px;border-radius:50%}nav .items .item .counter{width:15px;height:15px;background-color:red;border-radius:50%;color:#fff;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;position:absolute;top:-4px;right:-4px}@media (max-width: 798px){nav{height:auto;justify-content:center}nav .wrapper{flex-direction:column;gap:10px;width:100%;padding:10px 0}nav .items .item .icon{font-size:18px}nav .items .item .avatar{width:27px;height:27px}}aside{flex:1;border-right:.5px solid rgb(230,227,227);min-height:100vh;background-color:#fff;z-index:2;border:1px solid rgba(201,201,201,.7);transition:.5s}aside .top{height:50px;display:flex;align-items:center;justify-content:center}aside .top .logo{font-size:20px;font-weight:700;color:#6439ff}aside hr{height:0;border:.5px solid rgb(230,227,227)}aside .center{padding-left:10px}aside .center ul{list-style:none;margin:0;padding:0}aside .center ul h2{font-size:12px;margin-top:15px;margin-bottom:5px}aside .center ul li{display:flex;align-items:center;padding:5px;cursor:pointer}aside .center ul li:hover{background-color:#ece8ff}aside .center ul li .icon{font-size:18px;color:#7451f8}aside .center ul li span{font-size:13px;font-weight:600;color:#888;margin-left:10px}aside .bottom{display:flex;align-items:center;margin:10px}aside .bottom .colorOption{width:20px;height:20px;border-radius:5px;border:1px solid #7451f8;cursor:pointer;margin:5px}aside .bottom .colorOption:nth-child(1){background-color:#f5f5f5}aside .bottom .colorOption:nth-child(2){background-color:#333}aside a{text-decoration:none}.menu{position:fixed;flex-direction:column;gap:4px;top:14px;left:10px;display:none}.menu p{width:23px;height:4px;background-color:#000}@media (max-width: 798px){.menu{display:flex;cursor:pointer}aside{position:absolute;top:40px;-webkit-box-shadow:2px 4px 10px 1px rgba(0,0,0,.47);box-shadow:2px 4px 10px 1px #c9c9c978;width:200px;transform:translate(-105%)}aside.active{transform:translate(0);position:fixed}}