/* ===================================
ICON STYLES
Simple icon system using Unicode and pseudo-elements
=================================== */
/* Social Link Icons */
.icon-github::before,
.icon-linkedin::before,
.icon-email::before {
font-size: 1.25rem;
display: inline-block;
}
/* Alternative: Using SVG as background images */
.social-icon {
display: inline-flex;
align-items: center;
justify-content: center;
width: 24px;
height: 24px;
background-size: contain;
background-repeat: no-repeat;
background-position: center;
}
.social-icon.github {
background-image: url('data:image/svg+xml,');
}
.social-icon.linkedin {
background-image: url('data:image/svg+xml,');
}
.social-icon.email {
background-image: url('data:image/svg+xml,');
}
/* Hover effect for social icons */
.social-icon:hover {
opacity: 0.7;
transition: opacity var(--transition-base);
}