/* SDO Theme - Brand Styles
–––––––––––––––––––––––––––––––––––––––––––––––––– */

/* Rounded avatars */
.rounded-avatar {
  border-radius: 50%;
}

/* Social Icons (standalone) */
.social-icon {
  font-size: 32px;
  padding: 10px;
  color: #58a82e;
  fill: currentColor;
  transition: color 0.15s ease-in-out;
  display: inline-block;
}
.social-icon:hover {
  color: #FFFFFF;
}
.social-icon-div {
  padding-bottom: 30px;
}

/* Buttons - Base Style
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.button,
button {
  display: inline-block;
  text-decoration: none;
  height: 48px;
  text-align: center;
  vertical-align: middle;
  font-size: 18px;
  font-family: 'poppins', sans-serif;
  width: 300px;
  font-weight: 500;
  line-height: 48px;
  letter-spacing: 0.1px;
  white-space: nowrap;
  border-radius: 8px;
  cursor: pointer;
  transition: background-color 0.15s ease-in-out, color 0.15s ease-in-out, border-color 0.15s ease-in-out;
  border: 2px solid #58a82e;
  color: #58a82e;
  background-color: transparent;
}

button:hover,
.button:hover,
.button:focus {
  background-color: #58a82e;
  color: #FFFFFF;
  border-color: #58a82e;
  outline: 0;
}

.button.button-primary {
  color: #58a82e;
  background-color: transparent;
  border: 2px solid #58a82e;
}
.button.button-primary:hover,
.button.button-primary:focus {
  color: #FFFFFF;
  background-color: #58a82e;
  border-color: #58a82e;
}

/* Brand Icons (inside buttons)
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.icon {
  padding: 0px 8px 3.5px 0px;
  vertical-align: middle;
  width: 20px;
  height: 20px;
  color: #58a82e !important;
  fill: #58a82e !important;
  transition: color 0.15s ease-in-out, fill 0.15s ease-in-out;
}

/* Font Awesome icons (i elements) */
.button i,
.button [class*="fa-"],
.button [class*="fab"],
.button [class*="fas"],
.button [class*="far"] {
  color: #58a82e !important;
  transition: color 0.15s ease-in-out;
}

/* SVG icons */
.icon svg,
.button svg,
.social-icon svg {
  fill: #58a82e !important;
  transition: fill 0.15s ease-in-out;
}
.icon svg *,
.button svg *,
.social-icon svg * {
  fill: inherit !important;
  stroke: #58a82e !important;
  transition: fill 0.15s ease-in-out, stroke 0.15s ease-in-out;
}

/* IMG icons (filter for color) */
.icon img,
.button img.icon {
  filter: brightness(0) saturate(100%) invert(52%) sepia(67%) saturate(456%) hue-rotate(66deg) brightness(97%) contrast(87%);
  transition: filter 0.15s ease-in-out;
}

/* Hover states - ALL icon types */
.button:hover .icon,
.button:focus .icon,
button:hover .icon,
button:focus .icon,
.button:hover i,
.button:focus i,
.button:hover [class*="fa-"],
.button:focus [class*="fa-"],
.button:hover [class*="fab"],
.button:focus [class*="fab"],
.button:hover [class*="fas"],
.button:focus [class*="fas"],
.button:hover [class*="far"],
.button:focus [class*="far"] {
  color: #FFFFFF !important;
}

.button:hover svg,
.button:focus svg,
.button:hover .icon svg,
.button:focus .icon svg {
  fill: #FFFFFF !important;
}
.button:hover svg *,
.button:focus svg *,
.button:hover .icon svg *,
.button:focus .icon svg * {
  fill: #FFFFFF !important;
  stroke: #FFFFFF !important;
}

.button:hover img.icon,
.button:focus img.icon,
.button:hover .icon img,
.button:focus .icon img {
  filter: brightness(0) invert(1);
}

/* Brand Button Styles
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.button.button-custom,
.button.button-default,
.button.button-discord,
.button.button-facebook,
.button.button-messenger,
.button.button-figma,
.button.button-github,
.button.button-goodreads,
.button.button-instagram,
.button.button-kit,
.button.button-linkedin,
.button.button-medium,
.button.button-pinterest,
.button.button-producthunt,
.button.button-reddit,
.button.button-skoob,
.button.button-snapchat,
.button.button-soundcloud,
.button.button-spotify,
.button.button-steam,
.button.button-telegram,
.button.button-tiktok,
.button.button-tumblr,
.button.button-twitch,
.button.button-twitter,
.button.button-bluesky,
.button.button-vimeo,
.button.button-youtube,
.button.button-wordpress,
.button.button-bandcamp,
.button.button-patreon,
.button.button-signal,
.button.button-venmo,
.button.button-cashapp,
.button.button-gitlab,
.button.button-mastodon,
.button.button-paypal,
.button.button-whatsapp,
.button.button-xing,
.button.button-coffee,
.button.button-trello,
.button.button-website,
.button.button-custom_website,
.button.button-web {
  color: #58a82e;
  background-color: transparent;
  border: 2px solid #58a82e;
  background-image: none;
}

.button.button-custom:hover,
.button.button-custom:focus,
.button.button-default:hover,
.button.button-default:focus,
.button.button-discord:hover,
.button.button-discord:focus,
.button.button-facebook:hover,
.button.button-facebook:focus,
.button.button-messenger:hover,
.button.button-messenger:focus,
.button.button-figma:hover,
.button.button-figma:focus,
.button.button-github:hover,
.button.button-github:focus,
.button.button-goodreads:hover,
.button.button-goodreads:focus,
.button.button-instagram:hover,
.button.button-instagram:focus,
.button.button-kit:hover,
.button.button-kit:focus,
.button.button-linkedin:hover,
.button.button-linkedin:focus,
.button.button-medium:hover,
.button.button-medium:focus,
.button.button-pinterest:hover,
.button.button-pinterest:focus,
.button.button-producthunt:hover,
.button.button-producthunt:focus,
.button.button-reddit:hover,
.button.button-reddit:focus,
.button.button-skoob:hover,
.button.button-skoob:focus,
.button.button-snapchat:hover,
.button.button-snapchat:focus,
.button.button-soundcloud:hover,
.button.button-soundcloud:focus,
.button.button-spotify:hover,
.button.button-spotify:focus,
.button.button-steam:hover,
.button.button-steam:focus,
.button.button-telegram:hover,
.button.button-telegram:focus,
.button.button-tiktok:hover,
.button.button-tiktok:focus,
.button.button-tumblr:hover,
.button.button-tumblr:focus,
.button.button-twitch:hover,
.button.button-twitch:focus,
.button.button-twitter:hover,
.button.button-twitter:focus,
.button.button-bluesky:hover,
.button.button-bluesky:focus,
.button.button-vimeo:hover,
.button.button-vimeo:focus,
.button.button-youtube:hover,
.button.button-youtube:focus,
.button.button-wordpress:hover,
.button.button-wordpress:focus,
.button.button-bandcamp:hover,
.button.button-bandcamp:focus,
.button.button-patreon:hover,
.button.button-patreon:focus,
.button.button-signal:hover,
.button.button-signal:focus,
.button.button-venmo:hover,
.button.button-venmo:focus,
.button.button-cashapp:hover,
.button.button-cashapp:focus,
.button.button-gitlab:hover,
.button.button-gitlab:focus,
.button.button-mastodon:hover,
.button.button-mastodon:focus,
.button.button-paypal:hover,
.button.button-paypal:focus,
.button.button-whatsapp:hover,
.button.button-whatsapp:focus,
.button.button-xing:hover,
.button.button-xing:focus,
.button.button-coffee:hover,
.button.button-coffee:focus,
.button.button-trello:hover,
.button.button-trello:focus,
.button.button-website:hover,
.button.button-website:focus,
.button.button-custom_website:hover,
.button.button-custom_website:focus,
.button.button-web:hover,
.button.button-web:focus {
  background-color: #58a82e;
  color: #FFFFFF;
  border-color: #58a82e;
}