/** 
  * Due to css import issues with parallell routes we are forced to 
  * use a regular css file and import it in the page.tsx
  */
.profile-page {
  display: grid;
  gap: 3rem;
}

.profile-btns {
  align-items: center;
  display: flex;
  gap: 1rem;
  justify-content: flex-end;
  position: absolute;
  right: 0;
  /* Creates the 16px gap from design */
  top: -1.6rem;
  /* Moves itself to top of container to avoid calc */
  transform: translateY(-100%);
}

.profile-cards {
  display: grid;
  gap: 0.4rem;
  grid-template-columns: 1fr 1fr;
}