@import"https://fonts.googleapis.com/css2?family=Hind+Madurai:wght@400;500;600;700&display=swap";.header{width:100%;display:flex;align-items:center;justify-content:space-between}.user-section{display:flex;gap:1rem}.notifications{width:50px;height:50px;border-radius:50%;transition:all .5s ease}.notifications>*{text-align:center;font-size:1.5rem;color:var(--color-text-extra)}.notifications:hover{background-color:var(--color-hover-btn);transition:all .5s ease}.notifications._active,.notifications._active i{color:var(--color-accent)}.user{width:50px;height:50px;border-radius:50%;background-color:transparent}.user img{width:100%;border-radius:50%}.profile{display:flex;gap:1rem;align-items:center;background-color:transparent}@media screen and (max-width: 550px){.profile__sidebar{display:none}}.profile-info{display:flex;flex-direction:column;font-size:var(--text-size-default)}.profile-name{font-weight:600;letter-spacing:.05rem}.profile-position{letter-spacing:.05rem}.profile-img{width:50px;border-radius:50%}.home-page{width:100%;height:100%}.home-page-wrap{display:grid;gap:1rem;grid-template-columns:repeat(3,1fr);grid-template-rows:auto}@media screen and (max-width: 767px){.home-page-wrap{display:flex;flex-direction:column}}.home-page-wrap>:nth-child(1){grid-column:span 2}.home-page-wrap>:nth-child(2){grid-column:span 1}.home-page-wrap>:nth-child(3){grid-column:span 3}.home-page-wrap>:nth-child(4){grid-column:span 1}.home-page-wrap>:nth-child(5){grid-column:span 1}.home-page-wrap>:nth-child(6){grid-column:span 1}.home-page-loading,.home-page-error{font-size:var(--text-size-title);text-align:center;font-weight:600;letter-spacing:.1rem}.box{background-color:var(--color-block);padding:1.5rem;border-radius:1rem;width:auto}.box h4{text-align:start;font-weight:600;letter-spacing:.05rem;margin-bottom:.5rem}.nav{padding:2rem 0;flex:1 auto;width:100%;display:flex;flex-direction:column;gap:.5rem}@media screen and (max-width: 1079px){.nav{flex-direction:row;width:auto;align-items:center;justify-content:center;padding:0}}.nav-item{color:var(--color-text-extra);background-color:transparent;font-size:var(--text-size-default);letter-spacing:.025rem;display:flex;gap:.5rem;align-items:center;padding:1rem 2rem;border-radius:3rem;transition:all .5s ease}@media screen and (max-width: 1079px){.nav-item{padding:.5rem}}@media screen and (max-width: 870px){.nav-item span{display:none}}.nav-item:hover{color:var(--color-accent);background-color:var(--color-hover-btn);transition:all .5s ease}.nav-item i{width:24px;text-align:center}.nav-item._active{color:var(--color-accent);background-color:var(--color-hover-btn)}.sidebar{display:flex;flex-direction:column;align-items:start;text-align:start;min-height:100vh;background-color:var(--color-block);width:fit-content;padding:2rem;border-radius:1rem;align-items:center}@media screen and (max-width: 1079px){.sidebar{flex-direction:row;min-height:auto;width:100%;gap:1rem;padding:1rem 1.5rem}}.settings{background-color:transparent;font-size:var(--text-size-default);letter-spacing:.025rem;font-weight:500;display:flex;gap:.5rem;align-items:center;transition:all .5s ease}.settings:hover{color:var(--color-accent);transition:all .5s ease}.settings:hover i{transform:rotate(-180deg);transition:transform .5s ease}@media screen and (max-width: 700px){.settings span{display:none}}:root{--color-background: #d8d5d4;--color-accent: #ff9100;--color-block: #ffffff;--color-hover-btn: #ff910052;--color-text-default: #000000;--color-text-extra: #707070;--text-size-default: 1rem;--text-size-title: 2rem;--text-size-small: .75rem}body{font-family:Hind Madurai,sans-serif;background-color:var(--color-background);color:var(--color-text-default);margin:0;min-width:320px;min-height:100vh}#app{max-width:1280px;margin:0 auto;padding:2rem;text-align:center;display:grid;grid-template-columns:auto 1fr;gap:2rem}@media screen and (max-width: 1079px){#app{display:flex;flex-direction:column;gap:2rem}}#app>:nth-child(1){grid-column-start:1;grid-column-end:3}#app>:nth-child(2){grid-column-start:1;grid-column-end:2}#app>:nth-child(3){grid-column-start:2;grid-column-end:3}*{padding:0;margin:0;border:0}*,*:before,*:after{-webkit-box-sizing:border-box;box-sizing:border-box}:focus,:active{outline:none}a:focus,a:active{outline:none}nav,footer,header,aside{display:block}input,button,textarea{font-family:inherit}input::-ms-clear{display:none}button{cursor:pointer}button::-moz-focus-inner{padding:0;border:0}a,a:visited,a:hover{text-decoration:none}ul li{list-style-type:none}img{vertical-align:top}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:400}
