/* =====================================================
   Redes sociales en footer — base global para plantillas
   Cada plantilla personaliza forma y colores con variables CSS.
   ===================================================== */

:root {
    --footer-social-gap: 0.85rem;
    --footer-social-icon-size: 1.25rem;
    --footer-social-link-size: 2.65rem;
    --footer-social-link-bg: color-mix(in srgb, var(--muro-accent, #c8a45a) 12%, transparent);
    --footer-social-link-color: var(--muro-text-color, #ffffff);
    --footer-social-link-border: 1px solid color-mix(in srgb, var(--muro-accent, #c8a45a) 35%, transparent);
    --footer-social-link-radius: 50%;
    --footer-social-link-hover-bg: color-mix(in srgb, var(--muro-accent, #c8a45a) 24%, transparent);
    --footer-social-link-hover-color: var(--muro-accent, #c8a45a);
    --footer-social-link-hover-border: 1px solid color-mix(in srgb, var(--muro-accent, #c8a45a) 55%, transparent);
    --footer-social-link-hover-transform: translateY(-2px);
    --footer-social-link-hover-shadow: 0 6px 16px color-mix(in srgb, var(--muro-accent, #c8a45a) 22%, transparent);
}

.evento-red-icon,
.footer-social-auto__icon,
.tpl-social-ic {
    display: block;
    width: var(--footer-social-icon-size, 1.25rem);
    height: var(--footer-social-icon-size, 1.25rem);
    fill: currentColor;
    flex-shrink: 0;
}

.evento-red-icon--facebook {
    transform: scale(0.96);
}

.evento-red-icon--instagram {
    transform: scale(0.94);
}

.evento-red-icon--twitter {
    transform: scale(0.88);
}

.evento-red-icon--linkedin {
    transform: scale(0.9);
}

.evento-red-icon--youtube {
    transform: scale(0.92);
}

.footer-social-auto,
.social-links,
.footer-social,
.social-links-auto,
.social-links-footer,
.footer-social-a3,
.tpl3-social-links,
[class*="footer__social"] {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: var(--footer-social-gap);
    margin-top: 1.25rem;
    width: 100%;
}

.footer-social-ani2 {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: var(--footer-social-gap, 1.5rem);
    margin-top: 1.25rem;
    width: 100%;
}

.footer-social-auto a,
.footer-social-auto__link,
.social-links a,
.footer-social a,
.social-links-auto a,
.social-links-footer a,
.tpl3-social-links .footer-social-auto__link,
.footer-social-a3 a,
[class*="footer__social"] a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--footer-social-link-size);
    height: var(--footer-social-link-size);
    border-radius: var(--footer-social-link-radius);
    background: var(--footer-social-link-bg);
    color: var(--footer-social-link-color);
    border: var(--footer-social-link-border);
    text-decoration: none;
    transition: transform 0.22s ease, color 0.22s ease, background 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease;
}

.footer-social-ani2 a,
.footer-social-ani2 .footer-social-auto__link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: auto;
    height: auto;
    min-width: 0;
    min-height: 0;
    padding: 0;
    border: none;
    border-radius: 0;
    background: transparent;
    color: inherit;
    text-decoration: none;
    box-shadow: none;
}

.footer-social-ani2 .evento-red-icon,
.footer-social-ani2 .footer-social-auto__icon {
    width: 1.5rem;
    height: 1.5rem;
}

.footer-social-auto a:hover,
.footer-social-auto a:focus-visible,
.footer-social-auto__link:hover,
.footer-social-auto__link:focus-visible,
.social-links a:hover,
.social-links a:focus-visible,
.footer-social a:hover,
.footer-social a:focus-visible,
.social-links-auto a:hover,
.social-links-auto a:focus-visible,
.social-links-footer a:hover,
.social-links-footer a:focus-visible,
.footer-social-a3 a:hover,
.footer-social-a3 a:focus-visible,
[class*="footer__social"] a:hover,
[class*="footer__social"] a:focus-visible {
    background: var(--footer-social-link-hover-bg);
    color: var(--footer-social-link-hover-color);
    border: var(--footer-social-link-hover-border);
    transform: var(--footer-social-link-hover-transform);
    box-shadow: var(--footer-social-link-hover-shadow);
    outline: none;
}

.footer-social-ani2 a:hover,
.footer-social-ani2 a:focus-visible,
.footer-social-ani2 .footer-social-auto__link:hover,
.footer-social-ani2 .footer-social-auto__link:focus-visible {
    background: transparent;
    border: none;
    box-shadow: none;
    transform: none;
    outline: none;
}

.footer-social-auto svg,
.footer-social-auto__icon,
.social-links svg,
.footer-social svg,
.social-links-auto svg,
.social-links-footer svg,
.footer-social-a3 svg,
[class*="footer__social"] svg {
    width: var(--footer-social-icon-size);
    height: var(--footer-social-icon-size);
    fill: currentColor;
    flex-shrink: 0;
}