// =============================================================================
// SOCIAL LINKS (CSS)
// =============================================================================
//
// 1. Removing the whitespace generated by display:inline-block;
// 2. Need to increase specificity for margin settings to overcome resets by u-listReset.
//
// -----------------------------------------------------------------------------
.socialLinks {
    @include clearfix;
    @include u-listReset; // 2
    line-height: lineHeight("largest");

    .icon { // 1
        @include square($socialLinks-iconSize);
        margin: 0;
        text-decoration: none;

        &:hover {
            svg {
                fill: stencilColor("icon-color-hover");
            }
        }

        svg {
            fill: stencilColor("icon-color");
            transition: all 0.15s ease;
        }
    }
}

.socialLinks-item--pinterest {
    width: 25px;
}

.pin_it_iframe_widget {
    display: none;
}

.socialLinks-item {
    display: inline-block;
    font-size: 0; // 1

    .socialLinks & { // 2
        margin-bottom: spacing("quarter");
        margin-right: spacing("half");

        &:last-child {
            margin-right: 0;
        }
    }

    .socialLinks__link {
        @include addFocusTooltip;
        height: 2rem;
        position: relative;

        // moving tooltip on the left side for avoiding by parent's cut with overflow: hidden
        &:focus::after {
            left: 0;
            right: auto;
            z-index: zIndex("low");
        }
    }
}


//
// Alternate social link styles
// -----------------------------------------------------------------------------

.socialLinks--alt {
    .icon {
        @include square($socialLinks-alt-iconSize);
    }

    svg {
        fill: $socialLinks-alt-iconColor;
    }
}
