@import"https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600;700;800;900&display=swap";:root{--clr-white: #ffffff;--clr-black: #000000;--clr-gs50: #dfdfdf;--clr-gs55: #c0c0c0;--clr-gs60: #a2a2a2;--clr-gs65: #858585;--clr-gs70: #696969;--clr-gs75: #4e4e4e;--clr-gs80: #353535;--clr-gs85: #1e1e1e;--clr-a10: #e1d6e9;--clr-a20: #c3aed4;--clr-a30: #a587bf;--clr-a40: #8762a9;--clr-a50: #683d94;--clr-a60: #533275;--clr-a70: #3f2757;--clr-a80: #2c1d3b;--clr-a90: #1a1220;--gap: 1.25rem}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:Poppins,system-ui,sans-serif;font-size:1rem;min-height:100dvh;min-width:min(20rem,100%)}a{color:inherit;cursor:pointer;text-decoration:none}img{max-width:100%;height:auto;object-fit:cover;display:block}p{margin-bottom:.75rem}h1{font-size:2rem}h2{font-size:1.75rem;margin-top:1.2rem}h3{font-size:1.5rem}h1,h2{margin-bottom:1.25rem}.page-wrap{background:linear-gradient(#f1f3ff,#cbd4ff);display:grid;grid-template-columns:min(20rem,100%) 1fr;grid-template-rows:auto 1fr auto;grid-template-areas:"sidebar navbar" "sidebar main" "sidebar footer"}.sidebar{position:fixed;top:0;left:0;z-index:10;width:min(20rem,100%);height:100dvh;background:var(--clr-a80);transition:all .4s ease}.sidebar.collapsed{width:85px}.sidebar .sidebar-header{display:flex;position:relative;padding:25px 20px;align-items:center;justify-content:space-between}.sidebar-header .header-logo img{width:46px;height:46px;display:block;object-fit:contain;border-radius:50%}.sidebar-header .sidebar-toggler,.sidebar-menu-button{position:absolute;right:20px;height:35px;width:35px;color:#151a2d;border:none;cursor:pointer;display:flex;background:#eef2ff;align-items:center;justify-content:center;border-radius:8px;transition:.4s ease}.sidebar.collapsed .sidebar-header .sidebar-toggler{transform:translate(-4px,65px)}.sidebar-header .sidebar-toggler span,.sidebar-menu-button span{font-size:1.75rem;transition:.4s ease}.sidebar.collapsed .sidebar-header .sidebar-toggler span{transform:rotate(180deg)}.sidebar-header .sidebar-toggler:hover{background:#d9e1fd}.sidebar-nav .nav-list{list-style:none;display:flex;gap:4px;padding:0 15px;flex-direction:column;transform:translateY(15px);transition:.4s ease}.sidebar .sidebar-nav .primary-nav{overflow-y:auto;scrollbar-width:thin;padding-bottom:20px;height:calc(100vh - 227px);scrollbar-color:transparent transparent}.sidebar .sidebar-nav .primary-nav:hover{scrollbar-color:#eef2ff transparent}.sidebar.collapsed .sidebar-nav .primary-nav{overflow:unset;transform:translateY(65px)}.sidebar-nav .nav-item .nav-link{color:#fff;display:flex;gap:12px;white-space:nowrap;border-radius:8px;padding:11px 15px;align-items:center;text-decoration:none;transition:.4s ease}.sidebar-nav .nav-item:is(:hover,.open)>.nav-link:not(.dropdown-title){color:#151a2d;background:#eef2ff}.sidebar .nav-link .nav-label{transition:opacity .3s ease}.sidebar.collapsed .nav-link :where(.nav-label,.dropdown-icon){opacity:0;pointer-events:none}.sidebar.collapsed .nav-link .dropdown-icon{transition:opacity .3s 0s ease}.sidebar-nav .secondary-nav{position:absolute;bottom:35px;width:100%;background:var(--clr-a80)}.sidebar-nav .nav-item{position:relative}.sidebar-nav .dropdown-container .dropdown-icon{margin:0 -4px 0 auto;transition:transform .4s ease,opacity .3s .2s ease}.sidebar-nav .dropdown-container.open .dropdown-icon{transform:rotate(180deg)}.sidebar-nav .dropdown-menu{height:0;overflow-y:hidden;list-style:none;padding-left:15px;transition:height .4s ease}.sidebar.collapsed .dropdown-menu{position:absolute;top:-10px;left:100%;opacity:0;height:auto!important;padding-right:10px;overflow-y:unset;pointer-events:none;border-radius:0 10px 10px 0;background:#151a2d;transition:0s}.sidebar.collapsed .dropdown-menu:has(.dropdown-link){padding:7px 10px 7px 24px}.sidebar.sidebar.collapsed .nav-item:hover>.dropdown-menu{opacity:1;pointer-events:auto;transform:translateY(12px);transition:all .4s ease}.sidebar.sidebar.collapsed .nav-item:hover>.dropdown-menu:has(.dropdown-link){transform:translateY(10px)}.dropdown-menu .nav-item .nav-link{color:#f1f4ff;padding:9px 15px}.sidebar.collapsed .dropdown-menu .nav-link{padding:7px 15px}.dropdown-menu .nav-item .nav-link.dropdown-title{display:none;color:#fff;padding:9px 15px}.dropdown-menu:has(.dropdown-link) .nav-item .dropdown-title{font-weight:500;padding:7px 15px}.sidebar.collapsed .dropdown-menu .nav-item .dropdown-title{display:block}.sidebar-menu-button{display:none}@media (max-width: 768px){.sidebar-menu-button{position:fixed;left:20px;top:20px;height:40px;width:42px;display:flex;color:#f1f4ff;background:#151a2d}.sidebar.collapsed{width:270px;left:-270px}.sidebar.collapsed .sidebar-header .sidebar-toggler{transform:none}.sidebar.collapsed .sidebar-nav .primary-nav{transform:translateY(15px)}}.logo{display:flex;align-items:center;gap:1rem;padding:1rem}.logo__img img{max-width:2.5rem}.logo__text{font-weight:700;font-size:1.25rem}.menu--sidebar{align-items:flex-start;flex-direction:column;row-gap:0}.menu__link{padding:1.25rem;display:flex;align-items:center;gap:1rem;width:100%}.menu__link:hover{background-color:var(--clr-a50)}.menu__link--border-bottom{border-bottom:1px solid var(--clr-gs80)}.header{grid-area:navbar;background-color:var(--clr-a70);color:var(--clr-white);border-bottom:1px solid var(--clr-gs50);display:flex;align-items:center;justify-content:space-between;padding:1rem;position:sticky;top:0}.header__greeting{display:flex;align-items:center;gap:1rem}.header__greeting--text{display:flex;flex-direction:column}.header__greeting--text small{display:flex;align-items:center;gap:.5rem}.header__greeting--text i{color:#9b853c;font-size:1rem}.nav__link--topbar:hover{color:var(--clr-a20)}.main{grid-area:main;display:grid;place-content:center;padding:2.5rem 1.25rem}.main-overview{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem}.main-overview h3{color:#1e1e1e4d;font-weight:100;text-align:center}.footer{grid-area:footer;background-color:var(--clr-a70);color:var(--clr-white);display:flex;align-items:center;justify-content:space-between;position:sticky;bottom:0}.footer a:hover{color:var(--clr-a20);text-decoration:underline;text-underline-offset:2px}.footer>*{padding:.75rem 1.25rem}.copyright{font-weight:500}