aside{background-color:var(--primary);color:#fff;font-weight:700}aside .top{height:20svh;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:20px;box-sizing:border-box;background-color:var(--logo)}aside .top img{height:10svh;margin-bottom:10px;box-sizing:border-box}aside .top #addProject{text-align:center;cursor:pointer;font-size:1.5rem;background-color:var(--primary-hover);border:none;border-radius:10px;color:#fff;padding:10px;transition:background-color .2s,transform .2s,box-shadow .2s}aside .top #addProject:hover{background-color:#7a7aa5;transform:scale(1.05);box-shadow:0 4px 15px rgba(0,0,0,.2)}aside #projectList{max-height:80svh;overflow-y:auto}aside #projectList .item{display:grid;gap:20px;grid-template-columns:8fr 1fr 1fr;justify-content:center;align-items:center;padding:20px}aside #projectList .item:nth-child(even){background-color:var(--secondary)}aside #projectList .project{padding:0 5px;display:flex;justify-content:center;cursor:pointer;background-color:rgba(0,0,0,0);border:none;color:#fff;caret-color:rgba(0,0,0,0);border-radius:5px;transition:background-color .2s}aside #projectList .project:hover{background-color:var(--primary-hover) !important}aside #projectList .project:focus{outline:none}aside #projectList button{width:30px;height:30px;margin-left:auto;border:none;border-radius:10px;cursor:pointer}aside #projectList button svg{width:100%;height:100%}@media screen and (max-width: 760px){aside .top{height:auto}aside .top #addProject{font-size:1rem}aside #projectList{max-height:50svh;overflow:auto}}
