@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}}.screen-not-available{display:flex;justify-content:center;align-items:center;height:100vh;background-color:#f0f0f0}.screen-not-available p{font-size:24px;text-align:center;color:#555;padding:20px;background-color:#fff;border-radius:8px;box-shadow:0 0 10px #0000001a;max-width:80%}@media screen and (min-width: 950px){.screen-not-available{display:none}}.sidebar{background-color:var(--clr-primary);width:260px;position:sticky;top:0;height:100vh;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{margin-left:-72px}.sidebar-change{margin-left:0}}.below-content{display:flex;flex-direction:column;align-items:center;padding:20px}.email-composer{display:flex;flex-direction:column;width:100%;max-width:1200px}.input-form{display:flex;flex-direction:column;gap:10px;padding:20px;background-color:var(--clr-primary);border-radius:5px;box-shadow:0 4px 8px #0000001a}.input-row{display:flex;gap:10px}.input-form input,.input-form textarea{width:100%;padding:10px;border:1px solid var(--clr-silver);border-radius:5px;font-family:var(--font-family-bai);background-color:var(--clr-white);color:var(--clr-black)}.email-preview{margin-top:20px;padding:20px;border:1px solid var(--clr-silver);border-radius:5px;background-color:var(--clr-white);box-shadow:0 4px 8px #0000001a}.preview-content{width:100%;height:100%;border:none}.preview{margin:20px 0 10px}@media screen and (min-width: 600px){.input-form{flex-direction:row;flex-wrap:wrap}.input-row{flex:1;flex-direction:column}.input-form input,.input-form textarea{width:calc(50% - 5px)}}.button-orange{background-color:#fe6c00;color:#fff;padding:10px 20px;border:none;border-radius:5px;cursor:pointer;font-size:16px;font-weight:700;display:block;width:200px;margin:20px auto 0}.button-orange:hover{background-color:#d45a00}.error-message{color:red;text-align:center;margin-top:20px}.success-message{color:green;text-align:center;margin-top:20px}.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}:root{--background: #1e1611;--color: #ffffff;--primary-color: #fe6c00}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;box-sizing:border-box;font-family:poppins;background:var(--background);color:var(--color);letter-spacing:1px;transition:background .2s ease;-webkit-transition:background .2s ease;-moz-transition:background .2s ease;-ms-transition:background .2s ease;-o-transition:background .2s ease}a{text-decoration:none;color:var(--color)}h1{font-size:2.5rem}.container{display:flex;justify-content:center;align-items:center;height:100vh}.login-container{position:relative;width:22.2rem}.form-container{border:1px solid hsla(0,0%,65%,.158);box-shadow:0 0 36px 1px #0003;border-radius:10px;backdrop-filter:blur(20px);z-index:99;padding:2rem;-webkit-border-radius:10px;-moz-border-radius:10px;-ms-border-radius:10px;-o-border-radius:10px}.login-container form input{display:block;padding:14.5px;width:100%;margin:2rem 0;color:var(--color);outline:none;background-color:#9191911f;border:none;border-radius:5px;font-weight:500;letter-spacing:.8px;font-size:15px;backdrop-filter:blur(15px);-webkit-border-radius:5px;-moz-border-radius:5px;-ms-border-radius:5px;-o-border-radius:5px}.login-container form input:focus{box-shadow:0 0 16px 1px #0003;animation:wobble .3s ease-in;-webkit-animation:wobble .3s ease-in}.login-container form button{background-color:var(--primary-color);color:var(--color);display:block;padding:13px;border-radius:5px;outline:none;font-size:18px;letter-spacing:1.5px;font-weight:700;width:100%;cursor:pointer;margin-bottom:2rem;transition:all .1s ease-in-out;border:none;-webkit-border-radius:5px;-moz-border-radius:5px;-ms-border-radius:5px;-o-border-radius:5px;-webkit-transition:all .1s ease-in-out;-moz-transition:all .1s ease-in-out;-ms-transition:all .1s ease-in-out;-o-transition:all .1s ease-in-out}.login-container form button:hover{box-shadow:0 0 10px 1px #00000026;transform:scale(1.02);-webkit-transform:scale(1.02);-moz-transform:scale(1.02);-ms-transform:scale(1.02);-o-transform:scale(1.02)}.circle{width:8rem;height:8rem;background:var(--primary-color);border-radius:50%;-webkit-border-radius:50%;-moz-border-radius:50%;-ms-border-radius:50%;-o-border-radius:50%;position:absolute}.illustration{position:absolute;top:-14%;right:-2px;width:90%}.circle-one{top:0;left:0;z-index:-1;transform:translate(-45%,-45%);-webkit-transform:translate(-45%,-45%);-moz-transform:translate(-45%,-45%);-ms-transform:translate(-45%,-45%);-o-transform:translate(-45%,-45%)}.circle-two{bottom:0;right:0;z-index:-1;transform:translate(45%,45%);-webkit-transform:translate(45%,45%);-moz-transform:translate(45%,45%);-ms-transform:translate(45%,45%);-o-transform:translate(45%,45%)}.register-forget{margin:1rem 0;display:flex;justify-content:space-between}.opacity{opacity:.6}.theme-btn-container{position:absolute;left:0;bottom:2rem}.theme-btn{cursor:pointer;transition:all .3s ease-in}.theme-btn:hover{width:40px!important}@keyframes wobble{0%{transform:scale(1.025);-webkit-transform:scale(1.025);-moz-transform:scale(1.025);-ms-transform:scale(1.025);-o-transform:scale(1.025)}25%{transform:scale(1);-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1)}75%{transform:scale(1.025);-webkit-transform:scale(1.025);-moz-transform:scale(1.025);-ms-transform:scale(1.025);-o-transform:scale(1.025)}to{transform:scale(1);-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1)}}.errorM{text-align:center;color:var(--primary-color);font-size:1rem;margin-bottom:21px}.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}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.iconspin{display:block;animation:spin 2s linear infinite;font-size:100px;margin:0 auto}.refresh{display:block;margin-left:auto;cursor:pointer;font-size:larger}