/**
 * Eprodes Social Links — Front office
 */

.epd-social {
  --epd-social-icon-bg: #000;
  --epd-social-icon-color: #fff;
  --epd-social-text-color: #000;
  --epd-social-icon-size: 40px;
  --epd-social-icon-gap: 10px;
  --epd-social-heading-mt: 0;
  --epd-social-heading-mr: 0;
  --epd-social-heading-mb: 0;
  --epd-social-heading-ml: 0;
  --epd-social-border-radius: 50%;
  --epd-social-border-width: 0;
  --epd-social-border-color: #000;
  --epd-social-bar-bg: transparent;
  --epd-social-bar-py: 12px;
  --epd-social-bar-px: 0;
  --epd-social-font-size: 18px;
  --epd-social-font-weight: 700;
  --epd-social-hover-opacity: 0.85;
  --epd-social-hover-bg: transparent;
  --epd-social-hover-color: inherit;
  --epd-social-alignment: left;
  --epd-social-inner-justify: flex-start;
  --epd-social-inner-align-items: flex-start;
  --epd-social-heading-text-align: left;
  --epd-social-list-justify: flex-start;

  background: var(--epd-social-bar-bg);
  padding: var(--epd-social-bar-py) var(--epd-social-bar-px);
  width: auto;
  max-width: 100%;
  box-sizing: border-box;
  flex: 0 1 auto;
}

.epd-social--align-left {
  margin-left: 0;
  margin-right: auto;
}

.epd-social--align-center {
  margin-left: auto;
  margin-right: auto;
}

.epd-social--align-right {
  margin-left: auto;
  margin-right: 0;
}

.epd-social__inner {
  display: flex;
  flex-wrap: wrap;
  align-items: var(--epd-social-inner-align-items, flex-start);
  gap: 0;
  width: 100%;
  container-type: inline-size;
  container-name: epd-social-inner;
}

.epd-social--heading-inline-left .epd-social__inner,
.epd-social--heading-inline-right .epd-social__inner {
  flex-wrap: wrap;
  align-items: var(--epd-social-inner-align-items, center);
  justify-content: var(--epd-social-inner-justify, flex-start);
}

.epd-social--heading-top-left .epd-social__inner,
.epd-social--heading-top-center .epd-social__inner,
.epd-social--heading-top-right .epd-social__inner {
  flex-direction: column;
}

.epd-social--heading-bottom-left .epd-social__inner,
.epd-social--heading-bottom-center .epd-social__inner,
.epd-social--heading-bottom-right .epd-social__inner {
  flex-direction: column-reverse;
}

.epd-social--heading-inline-left .epd-social__inner {
  flex-direction: row;
}

.epd-social--heading-inline-right .epd-social__inner {
  flex-direction: row-reverse;
}

.epd-social__heading {
  margin: var(--epd-social-heading-mt) var(--epd-social-heading-mr) var(--epd-social-heading-mb) var(--epd-social-heading-ml);
  color: var(--epd-social-text-color);
  font-size: var(--epd-social-font-size);
  font-weight: var(--epd-social-font-weight);
  line-height: 1.2;
  letter-spacing: -0.01em;
  text-align: var(--epd-social-heading-text-align, left);
  box-sizing: border-box;
  flex: 0 0 auto;
}

.epd-social--heading-inline-left .epd-social__heading,
.epd-social--heading-inline-right .epd-social__heading {
  width: auto;
  max-width: 100%;
}

.epd-social--heading-top-left .epd-social__heading,
.epd-social--heading-top-center .epd-social__heading,
.epd-social--heading-top-right .epd-social__heading,
.epd-social--heading-bottom-left .epd-social__heading,
.epd-social--heading-bottom-center .epd-social__heading,
.epd-social--heading-bottom-right .epd-social__heading {
  width: 100%;
}

.epd-social__nav {
  display: block;
  flex: 0 0 auto;
  max-width: 100%;
}

.epd-social--heading-inline-left .epd-social__nav,
.epd-social--heading-inline-right .epd-social__nav {
  width: auto;
}

.epd-social--heading-top-left .epd-social__nav,
.epd-social--heading-top-center .epd-social__nav,
.epd-social--heading-top-right .epd-social__nav,
.epd-social--heading-bottom-left .epd-social__nav,
.epd-social--heading-bottom-center .epd-social__nav,
.epd-social--heading-bottom-right .epd-social__nav {
  width: 100%;
}

.epd-social__list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: var(--epd-social-list-justify, flex-start);
  gap: var(--epd-social-icon-gap);
  margin: 0;
  padding: 0;
  list-style: none;
}

.epd-social__link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  width: var(--epd-social-icon-size);
  height: var(--epd-social-icon-size);
  max-width: var(--epd-social-icon-size);
  max-height: var(--epd-social-icon-size);
  flex: 0 0 auto;
  border-radius: var(--epd-social-border-radius);
  background: var(--epd-social-icon-bg);
  color: var(--epd-social-icon-color);
  border: var(--epd-social-border-width) solid var(--epd-social-border-color);
  text-decoration: none;
  box-sizing: border-box;
  overflow: hidden;
  transition: transform 0.22s ease, opacity 0.22s ease, background-color 0.22s ease, color 0.22s ease, box-shadow 0.22s ease;
  will-change: transform;
}

.epd-social__link:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 3px;
}

.epd-social__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 58%;
  height: 58%;
  flex: 0 0 auto;
  max-width: 58%;
  max-height: 58%;
}

.epd-social__icon svg {
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
}

/* Hover effects */
.epd-social--hover-opacity .epd-social__link:hover,
.epd-social--hover-opacity .epd-social__link:focus-visible {
  opacity: var(--epd-social-hover-opacity);
}

.epd-social--hover-scale .epd-social__link:hover,
.epd-social--hover-scale .epd-social__link:focus-visible {
  transform: scale(1.08);
}

.epd-social--hover-lift .epd-social__link:hover,
.epd-social--hover-lift .epd-social__link:focus-visible {
  transform: translateY(-3px);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12);
}

.epd-social--hover-invert .epd-social__link:hover,
.epd-social--hover-invert .epd-social__link:focus-visible {
  background: var(--epd-social-hover-bg, var(--epd-social-icon-color));
  color: var(--epd-social-hover-color, var(--epd-social-icon-bg));
}

.epd-social--hover-brand .epd-social__link:hover,
.epd-social--hover-brand .epd-social__link:focus-visible,
.epd-social--brand_hover .epd-social__link:hover,
.epd-social--brand_hover .epd-social__link:focus-visible {
  background: var(--epd-social-hover-bg, var(--epd-social-brand-color, var(--epd-social-icon-bg)));
  color: var(--epd-social-hover-color, #fff);
}

.epd-social--hover-color .epd-social__link:hover,
.epd-social--hover-color .epd-social__link:focus-visible {
  background: var(--epd-social-hover-bg, #333333);
  color: var(--epd-social-hover-color, #ffffff);
}

/* Theme variants (design_theme keys) */
.epd-social--circles_only .epd-social__heading {
  display: none;
}

.epd-social--square_filled .epd-social__link {
  border-radius: 8px;
}

.epd-social--brand_squares .epd-social__link {
  border-radius: var(--epd-social-border-radius, 8px);
  background: var(--epd-social-brand-color, var(--epd-social-icon-bg));
  color: #fff;
}

.epd-social--brand_squares .epd-social__link--snapchat {
  color: #000;
}

.epd-social--brand_squares .epd-social__link:hover,
.epd-social--brand_squares .epd-social__link:focus-visible {
  background: #fff;
  color: var(--epd-social-brand-color, var(--epd-social-icon-color));
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.16);
  opacity: 1;
  transform: none;
  outline: none;
}

.epd-social--minimal_outline .epd-social__link {
  background: transparent;
  color: var(--epd-social-icon-color);
}

.epd-social--pill_labels .epd-social__link {
  width: auto;
  min-height: var(--epd-social-icon-size);
  height: auto;
  max-width: none;
  max-height: none;
  padding: 0.35rem 0.9rem 0.35rem 0.55rem;
  border-radius: 999px;
}

.epd-social--pill_labels .epd-social__icon {
  width: calc(var(--epd-social-icon-size) * 0.55);
  height: calc(var(--epd-social-icon-size) * 0.55);
}

.epd-social--pill_labels .epd-social__label {
  font-size: 0.875rem;
  font-weight: 600;
  color: inherit;
  white-space: nowrap;
}

.epd-social--stacked_vertical .epd-social__list {
  flex-direction: column;
  align-items: var(--epd-social-inner-align-items, center);
}

.epd-social--monochrome_bar {
  width: 100%;
  border-radius: 0;
}

.epd-bl__embed .epd-social,
.epd-bl__card--embed .epd-social,
.epd-bl__icon-item--embed .epd-social,
.epd-bl__trust-item--embed .epd-social,
.epd-bl__article--embed .epd-social {
  width: 100%;
  max-width: 100%;
}

.epd-bl__card--embed .epd-social.epd-social--align-left,
.epd-bl__icon-item--embed .epd-social.epd-social--align-left,
.epd-bl__trust-item--embed .epd-social.epd-social--align-left,
.epd-bl__article--embed .epd-social.epd-social--align-left {
  align-self: flex-start;
  width: 100%;
}

.epd-bl__card--embed .epd-social.epd-social--align-center,
.epd-bl__icon-item--embed .epd-social.epd-social--align-center,
.epd-bl__trust-item--embed .epd-social.epd-social--align-center,
.epd-bl__article--embed .epd-social.epd-social--align-center {
  align-self: center;
  width: 100%;
}

.epd-bl__card--embed .epd-social.epd-social--align-right,
.epd-bl__icon-item--embed .epd-social.epd-social--align-right,
.epd-bl__trust-item--embed .epd-social.epd-social--align-right,
.epd-bl__article--embed .epd-social.epd-social--align-right {
  align-self: flex-end;
  width: 100%;
}

section.epd-social[id^="epd-social-"] .epd-social__item {
  flex: 0 0 auto;
  max-width: 100%;
}

section.epd-social[id^="epd-social-"] a.epd-social__link {
  line-height: 1;
}

/* Alias de marca por red: valores en el bloque (--epd-social-brand-*), consumo en el enlace */
.epd-social__link--facebook { --epd-social-brand-color: var(--epd-social-brand-facebook); }
.epd-social__link--instagram { --epd-social-brand-color: var(--epd-social-brand-instagram); }
.epd-social__link--tiktok { --epd-social-brand-color: var(--epd-social-brand-tiktok); }
.epd-social__link--x { --epd-social-brand-color: var(--epd-social-brand-x); }
.epd-social__link--linkedin { --epd-social-brand-color: var(--epd-social-brand-linkedin); }
.epd-social__link--youtube { --epd-social-brand-color: var(--epd-social-brand-youtube); }
.epd-social__link--pinterest { --epd-social-brand-color: var(--epd-social-brand-pinterest); }
.epd-social__link--whatsapp { --epd-social-brand-color: var(--epd-social-brand-whatsapp); }
.epd-social__link--telegram { --epd-social-brand-color: var(--epd-social-brand-telegram); }
.epd-social__link--snapchat { --epd-social-brand-color: var(--epd-social-brand-snapchat); }
.epd-social__link--threads { --epd-social-brand-color: var(--epd-social-brand-threads); }
.epd-social__link--mastodon { --epd-social-brand-color: var(--epd-social-brand-mastodon); }
.epd-social__link--discord { --epd-social-brand-color: var(--epd-social-brand-discord); }
.epd-social__link--twitch { --epd-social-brand-color: var(--epd-social-brand-twitch); }
.epd-social__link--spotify { --epd-social-brand-color: var(--epd-social-brand-spotify); }
.epd-social__link--vimeo { --epd-social-brand-color: var(--epd-social-brand-vimeo); }
.epd-social__link--reddit { --epd-social-brand-color: var(--epd-social-brand-reddit); }
.epd-social__link--tumblr { --epd-social-brand-color: var(--epd-social-brand-tumblr); }
.epd-social__link--flickr { --epd-social-brand-color: var(--epd-social-brand-flickr); }
.epd-social__link--behance { --epd-social-brand-color: var(--epd-social-brand-behance); }
.epd-social__link--dribbble { --epd-social-brand-color: var(--epd-social-brand-dribbble); }
.epd-social__link--github { --epd-social-brand-color: var(--epd-social-brand-github); }
.epd-social__link--line { --epd-social-brand-color: var(--epd-social-brand-line); }
.epd-social__link--wechat { --epd-social-brand-color: var(--epd-social-brand-wechat); }
.epd-social__link--email { --epd-social-brand-color: var(--epd-social-brand-email); }
.epd-social__link--rss { --epd-social-brand-color: var(--epd-social-brand-rss); }
.epd-social__link--website { --epd-social-brand-color: var(--epd-social-brand-website); }

/* Inline en estrecho: texto arriba, iconos abajo (container query + fallback móvil) */
@container epd-social-inner (max-width: 576px) {
  .epd-social--heading-inline-left .epd-social__inner,
  .epd-social--heading-inline-right .epd-social__inner {
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: var(--epd-social-inner-align-items, flex-start);
    justify-content: flex-start;
  }

  .epd-social--heading-inline-left .epd-social__heading,
  .epd-social--heading-inline-right .epd-social__heading {
    width: 100%;
    max-width: 100%;
    margin-right: 0;
    margin-bottom: max(var(--epd-social-heading-mb), var(--epd-social-heading-mr));
  }

  .epd-social--heading-inline-left .epd-social__nav,
  .epd-social--heading-inline-right .epd-social__nav {
    width: 100%;
    max-width: 100%;
  }
}

@media (max-width: 575px) {
  .epd-social--heading-inline-left .epd-social__inner,
  .epd-social--heading-inline-right .epd-social__inner {
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: var(--epd-social-inner-align-items, flex-start);
    justify-content: flex-start;
  }

  .epd-social--heading-inline-left .epd-social__heading,
  .epd-social--heading-inline-right .epd-social__heading {
    width: 100%;
    max-width: 100%;
    margin-right: 0;
    margin-bottom: max(var(--epd-social-heading-mb), var(--epd-social-heading-mr));
  }

  .epd-social--heading-inline-left .epd-social__nav,
  .epd-social--heading-inline-right .epd-social__nav {
    width: 100%;
    max-width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .epd-social__link {
    transition: none;
  }
}

/* Posición fixed flotante */
.epd-social--position-fixed {
  position: fixed;
  z-index: var(--epd-social-fixed-z, 9800);
  width: auto;
  max-width: min(100vw - 32px, 100%);
  margin: 0 !important;
  pointer-events: none;
}

.epd-social--position-fixed .epd-social__inner,
.epd-social--position-fixed .epd-social__link {
  pointer-events: auto;
}

.epd-social--fixed-left {
  top: var(--epd-social-fixed-offset-top, auto);
  right: auto;
  bottom: var(--epd-social-fixed-offset-bottom, auto);
  left: var(--epd-social-fixed-offset-left, 16px);
}

.epd-social--fixed-right {
  top: var(--epd-social-fixed-offset-top, auto);
  right: var(--epd-social-fixed-offset-right, 16px);
  bottom: var(--epd-social-fixed-offset-bottom, auto);
  left: auto;
}

.epd-social--fixed-top {
  top: var(--epd-social-fixed-offset-top, 16px);
  right: var(--epd-social-fixed-offset-right, auto);
  bottom: auto;
  left: var(--epd-social-fixed-offset-left, 50%);
  transform: translateX(-50%);
}

.epd-social--fixed-bottom {
  top: auto;
  right: var(--epd-social-fixed-offset-right, auto);
  bottom: var(--epd-social-fixed-offset-bottom, 16px);
  left: var(--epd-social-fixed-offset-left, 50%);
  transform: translateX(-50%);
}

.epd-social--fixed-top-left {
  top: var(--epd-social-fixed-offset-top, 16px);
  right: auto;
  bottom: auto;
  left: var(--epd-social-fixed-offset-left, 16px);
}

.epd-social--fixed-top-right {
  top: var(--epd-social-fixed-offset-top, 16px);
  right: var(--epd-social-fixed-offset-right, 16px);
  bottom: auto;
  left: auto;
}

.epd-social--fixed-bottom-left {
  top: auto;
  right: auto;
  bottom: var(--epd-social-fixed-offset-bottom, 16px);
  left: var(--epd-social-fixed-offset-left, 16px);
}

.epd-social--fixed-bottom-right {
  top: auto;
  right: var(--epd-social-fixed-offset-right, 16px);
  bottom: var(--epd-social-fixed-offset-bottom, 16px);
  left: auto;
}

.epd-social-configure-preview-wrap .epd-social--position-fixed {
  position: relative;
  transform: none;
  pointer-events: auto;
  margin: 0 auto !important;
}