/*
 * @author @toniroger360
 * File: /Volumes/Proyectos Coding/prestashop9/themes/roger_theme/modules/ps_sharebuttons/views/css/ps_sharebuttons.css
 */

#social_shares {
  font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  margin-top: 15px;
}

#social_shares .social-share-title {
  font-size: 1.1rem;
  font-weight: 300;
  color: #999999 !important;
}

#social_shares .social-share-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  margin: 0 4px;
  text-decoration: none !important;
  transition: transform 0.2s ease, opacity 0.2s ease;
  vertical-align: middle;
}

#social_shares .social-share-btn:hover {
  transform: scale(1.1);
  opacity: 0.9;
}

#social_shares .social-share-btn i {
  line-height: 1;
}

/* Facebook: Solid filled blue circle */
#social_shares .share-facebook {
  background: #10a6fd;
  background: -webkit-linear-gradient(to bottom, #10a6fd 0%, #005e92 100%);
  background: -moz-linear-gradient(to bottom, #10a6fd 0%, #005e92 100%);
  background: linear-gradient(to bottom, #10a6fd 0%, #005e92 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* Twitter: Light blue bird logo, no background */
#social_shares .share-twitter {
  background: #71c7ff;
  background: -webkit-linear-gradient(to bottom, #71c7ff 0%, #4d94c2 100%);
  background: -moz-linear-gradient(to bottom, #71c7ff 0%, #4d94c2 100%);
  background: linear-gradient(to bottom, #71c7ff 0%, #4d94c2 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

#social_shares .share-facebook:hover,
#social_shares .share-twitter:hover {
  background: #d5ecf9;
  -webkit-background-clip: text;
  -webkit-text-fill-color: #fff;
  text-shadow: 0 0 10px #32A2F9;
}

/* Pinterest: Solid filled red circle */
#social_shares .share-pinterest {
  background: #fe6a6a;
  background: -webkit-linear-gradient(to bottom, #fe6a6a 0%, #a80000 100%);
  background: -moz-linear-gradient(to bottom, #fe6a6a 0%, #a80000 100%);
  background: linear-gradient(to bottom, #fe6a6a 0%, #a80000 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

#social_shares .share-pinterest:hover {
  background: #efadad;
  -webkit-background-clip: text;
  -webkit-text-fill-color: #fff;
  text-shadow: 0 0 10px #f56a6a;
}

/* WhatsApp: Green outline/icon, no background */
#social_shares .share-whatsapp {
  background: #75e200;
  background: -webkit-linear-gradient(to bottom, #75e200 0%, #478a00 100%);
  background: -moz-linear-gradient(to bottom, #75e200 0%, #478a00 100%);
  background: linear-gradient(to bottom, #75e200 0%, #478a00 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

#social_shares .share-whatsapp:hover {
  background: #ade4ad;
  -webkit-background-clip: text;
  -webkit-text-fill-color: #fff;
  text-shadow: 0 0 10px #008b00;
}

#social_shares .share-facebook i,
#social_shares .share-twitter i,
#social_shares .share-pinterest i,
#social_shares .share-whatsapp i {
  font-size: 24px;
}