.setting-container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  box-sizing: border-box;
  padding: .75rem;
  max-width: 100%;
  min-width: 50%;
  border-radius: 1.5rem;
  border: .1rem dashed #5bb48d;
}
.setting-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .5rem;
}
.option-title {
  width: fit-content;
  font-size: 1.5rem;
  font-family: 'Outfit', sans-serif;
  font-weight: 700;
  color: white;
  transition: transform 0.2s ease;
} 
.suboption-title {
  width: fit-content;
  font-size: 1.25rem;
  font-family: 'Outfit', sans-serif;
  font-weight: 700;
  color: white;
  transition: transform 0.2s ease;
}

/* setting specific things */
.setting-stats-playtime-p {
  margin-top: -.25rem;
  font-size: 3rem;
  font-weight: 700;
  line-height: 1;
}
.setting-stats-playtime-ruby {
  ruby-position: under;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  line-height: 1;
}
.setting-stats-playtime-rt {
  width: fit-content;
  ruby-position: under;
  font-size: .8rem;
  font-weight: 400;
}
.setting-scrollablelist {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  width: 100%;
  min-width: 10rem;
  height: 8rem;
  overflow-y: auto;
  padding: .25rem;
  background-color: #274032;
  border-radius: .75rem;
  border: .1rem dashed #5bb48d;
  gap: .5rem;
}
.setting-stats-gameitem {
  width: fit-content;
  display: flex;
  flex-direction: row;
  gap: 0.25rem;
  align-items: center;
}
.setting-stats-gameicon {
  height: 2rem;
  width: 2rem;
  border-radius: .5rem;
}
.setting-stats-gametitle {
  font-size: 1.5rem;
}

/* mobile navigation */
@media (max-width: 50rem) {
  .setting-container {
    width: 100%;
  }
}