@import"https://fonts.googleapis.com/css2?family=Bai+Jamjuree:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;1,200;1,300;1,400;1,500;1,600;1,700&display=swap";*{padding:0;margin:0;box-sizing:border-box}:root{--clr-primary: #29221d;--clr-primar-light: #473b33;--clr-secondary: #1e1611;--clr-white: #fff;--clr-black: #000;--clr-pumpkin: #fe6c00;--clr-silver: #a8a5a6;--clr-silver-v1: #bdbabb;--clr-scarlet: #fe1e00;--clr-scarlet-v1: rgb(254, 30, 0, .79);--clr-green: #00fe93;--clr-yellow: #fec80a;--clr-jet: #302924;--clr-peach: #ffc397;--font-family-bai: "Bai Jamjuree", sans-serif;--transition-default: all .3s ease-in-out}body{font-family:var(--font-family-bai)}ul{list-style-type:none}a{color:unset;text-decoration:none;color:var(--clr-white)}button{background-color:transparent;border:none;cursor:pointer}.img-fit-cover img{width:100%;height:100%;object-fit:cover}.text-white{color:var(--clr-white)}.text-silver-v1{color:var(--clr-silver-v1)}.text-scarlet{color:var(--clr-scarlet)}.text-green{color:var(--clr-green)}.bg-jet{background:var(--clr-jet)}.text-sm{font-size:14px}.app{display:flex;min-height:100vh}.lg-value{font-size:24px;font-weight:600}.grid-common{background-color:var(--clr-primary);border-radius:12px;box-shadow:#0000000d 0 8px 24px;color:var(--clr-white);padding:24px}.grid-c-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.grid-c-title-text{font-weight:400;color:var(--clr-silver)}.grid-c-title-icon img{width:24px}@media screen and (max-width: 1400px){.grid-common{padding:16px}body{font-size:14px!important}}@media screen and (max-width: 768px){.app{flex-direction:column}.grid-common{padding:12px}.grid-c-title{margin-bottom:12px}.grid-c-title-text{font-size:18px}.lg-value{font-size:20px}}@media screen and (max-width: 480px){.grid-common{padding:8px}.grid-c-title-text{font-size:16px}.lg-value{font-size:18px}}.sidebar{background-color:var(--clr-primary);width:260px;padding:36px 20px;transition:var(--transition-default)}.user-info{display:flex;justify-content:flex-start;align-items:center;column-gap:16px}.info-name{font-weight:500}.info-img{width:48px;height:48px;overflow:hidden;border-radius:100%;box-shadow:#00000059 0 5px 15px}.info-name{font-size:20px;color:var(--clr-white);text-transform:uppercase}.navigation{margin-top:28px;height:600px;overflow-y:scroll}.navigation::-webkit-scrollbar{width:4px}.navigation::-webkit-scrollbar-track{box-shadow:inset 0 0 6px #0000004d;border-radius:18px}.navigation::-webkit-scrollbar-thumb{background-color:var(--clr-pumpkin);border-radius:18px}.sidebar-change{margin-left:-260px}.nav-item{margin-bottom:10px;margin-right:4px}.nav-link{display:block;height:44px;border-radius:8px;display:flex;align-items:center;justify-content:flex;padding:6px 14px;column-gap:12px;letter-spacing:.03em;border:1px solid transparent;transition:var(--transition-default)}.nav-link:hover{border:1px solid var(--clr-primar-light)}.nav-link.active{background-color:var(--clr-pumpkin);box-shadow:#0000001a 0 20px 25px -5px,#0000000a 0 10px 10px -5px}.nav-link-icon{width:22px}.nav-link-text{text-transform:capitalize}@media screen and (max-width: 1400px){.sidebar{padding:24px 16px}}@media screen and (max-width: 1200px){.sidebar{width:72px;padding-left:12px;padding-right:12px}.sidebar-change{margin-left:-72px}.info-name{display:none}.nav-item{display:flex;justify-content:center;margin-bottom:18px}.nav-link{padding:0;display:flex;align-items:center;justify-content:center;width:32px;height:32px}.nav-link.active,.nav-link:hover{border-radius:100%}.nav-link-text{display:none}}@media screen and (max-width: 420px){.sidebar{position:fixed;top:0;left:0;height:100vh;z-index:1000;margin-left:-72px}.sidebar-change{margin-left:0}}.main-content{background-color:var(--clr-secondary);flex:1;padding:32px}@media screen and (max-width: 1400px){.main-content{padding-left:20px;padding-right:20px}}@media screen and (max-width: 1200px){.main-content{padding-right:16px;padding-left:16px}}@media screen and (max-width: 768px){.main-content{padding:16px}}@media screen and (max-width: 480px){.main-content{padding:12px}}.main-content-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:32px}.sidebar-toggler{display:flex;align-items:center;margin-right:12px}.sidebar-toggler img{width:20px}.content-top-title{color:var(--clr-white);font-size:20px;font-weight:600}.content-top-btn{margin-left:18px}.content-top-btn img{width:24px}.content-top-btn img:hover{filter:brightness(0) invert(1)}.content-top-left{display:flex;align-items:center}@media screen and (max-width: 768px){.main-content-top{margin-bottom:20px}.content-top-title{font-size:18px}.content-top-btn{margin-left:12px}}@media screen and (max-width: 480px){.main-content-top{flex-direction:column;align-items:flex-start;gap:12px}.content-top-title{font-size:16px}.sidebar-toggler{margin-right:8px}}.main-content-holder{padding:20px}.content-grid-one{display:grid;grid-template-columns:1fr;gap:20px}.grid-c2 .grid-item{display:flex}.grid-c2 .grid-item{display:flex;justify-content:space-between;align-items:center;margin-bottom:28px}.grid-c2 .grid-item:last-child{margin-bottom:0}.grid-c2 .grid-item p{color:var(--clr-silver-v1)}.grid-c2 .grid-item-l .avatar{width:40px;height:40px;border-radius:100%;overflow:hidden}.grid-c2 .grid-item-l{display:flex;align-items:center;column-gap:10px}.grid-c2 .grid-item-l .text{font-weight:600}.grid-c2 .grid-item-l span{display:block;font-weight:400;margin-top:4px;font-size:15px;color:#8a8587}.grid-c2 .grid-item-r span{font-weight:500}@media screen and (max-width: 768px){.grid-c2 .grid-item{flex-direction:column;align-items:flex-start;gap:12px}.grid-c2 .grid-item-l{width:100%}.grid-c2 .grid-item-r{width:100%;display:flex;justify-content:space-between;align-items:center}}@media screen and (max-width: 480px){.grid-c2 .grid-item-l .text{font-size:14px}.grid-c2 .grid-item-l span{font-size:13px}}@media screen and (max-width: 768px){.balance-update-form,.create-user-form{padding:15px!important}.balance-update-form h4,.create-user-form h4{font-size:16px!important;margin-bottom:12px!important}}@media screen and (max-width: 480px){.balance-update-form,.create-user-form{padding:12px!important}.balance-update-form h4,.create-user-form h4{font-size:14px!important;margin-bottom:10px!important}}