.cityListWrapper {
  display: grid;
  gap: var(--Spacing-x3);
}

.header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--Spacing-x2);
}

.cityList {
  display: flex;
  flex-direction: column;
  gap: var(--Spacing-x3);
  list-style: none;
}

@media screen and (max-width: 949px) {
  .cityList {
    flex-direction: row;
    align-items: end;
    overflow-x: scroll;
  }

  .header {
    display: none;
  }
}
