.social-media-links,
.social-media-links__link {
  display: var(--display-flex);
  flex-wrap: var(--flex-wrap-wrap);
}

.social-media-links {
  list-style-type: var(--list-none);
  padding: var(--spacing-20px) var(--spacing-0px) var(--spacing-0px)
    var(--spacing-0px);
  flex-direction: var(--flex-col);
  gap: var(--gap-4);
}

#footer-top-container .social-media-links__link {
  color: var(--e-global-color-de38585);
  /* NOTE:  single blog post social media icon color code will go here too */
}

#footer-top-container .social-media-links__link,
.social-media-links__link {
  font-size: 14px;
}

.social-media-links__link,
.social-media-links__link:hover {
  border-width: var(--border-width-3);
  border-style: var(--border-style-solid);
}

.social-media-links__link {
  align-items: var(--items-center);
  background-color: var(--e-global-color-13eea02);
  border-color: var(--e-global-color-e99e4a3);
  border-radius: var(--rounded-xl);
  font-weight: var(--font-medium);
  gap: var(--gap-2);
  line-height: 1;
  padding: var(--spacing-7-5px) var(--spacing-16px);
}

.social-media-links__link:hover {
  background-color: var(--e-global-color-e99e4a3);
  border-color: var(--e-global-color-primary);
}

@media (prefers-color-scheme: dark) {
  .social-media-links__link:hover {
    border-color: var(--e-global-color-39af11c);
  }
}