/* CSS Document */
/* Professional Links Banner Styles */

.professional-links-banner {
    background-color: #f0f6ff;
    border-bottom: 1px solid #d0e0f5;
    padding: 0.8rem 0;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
}

.professional-links {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 3rem;
}

.prof-link {
    display: flex;
    align-items: center;
    color: #1a3c5c;
    padding: 0.5rem 1.5rem;
    border-radius: 30px;
    background-color: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
    transition: all 0.3s ease;
    text-decoration: none;
    border: 1px solid #e0e0e0;
}

.prof-link:hover {
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    transform: translateY(-2px);
    color: #0066cc;
    border-color: #0066cc;
}

.prof-link.personal-site {
    border-left: 4px solid #0066cc;
}

.prof-link.business-site {
    border-left: 4px solid #5cb85c;
}

.prof-link.linkedin {
    border-left: 4px solid #0077b5;
}

.prof-link.facebook {
    border-left: 4px solid #3b5998;
}

.link-label {
    font-weight: 600;
    font-size: 1.4rem;
    margin-right: 0.8rem;
}

.link-url {
    color: #0066cc;
    font-size: 1.4rem;
}

/* Social media icon styles */
.prof-link.linkedin .link-label::before,
.prof-link.facebook .link-label::before,
.prof-link.personal-site .link-label::before,
.prof-link.business-site .link-label::before {
    content: '';
    display: inline-block;
    width: 18px;
    height: 18px;
    margin-right: 8px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    vertical-align: middle;
}

.prof-link.linkedin .link-label::before {
    background-image: url('data:image/svg+xml;charset=utf-8,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%230077B5"%3E%3Cpath d="M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433c-1.144 0-2.063-.926-2.063-2.065 0-1.138.92-2.063 2.063-2.063 1.14 0 2.064.925 2.064 2.063 0 1.139-.925 2.065-2.064 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.454C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.225 0z"%3E%3C/path%3E%3C/svg%3E');
}

.prof-link.facebook .link-label::before {
    background-image: url('data:image/svg+xml;charset=utf-8,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%233b5998"%3E%3Cpath d="M24 12.073c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.99 4.388 10.954 10.125 11.854v-8.385H7.078v-3.47h3.047V9.43c0-3.007 1.792-4.669 4.533-4.669 1.312 0 2.686.235 2.686.235v2.953H15.83c-1.491 0-1.956.925-1.956 1.874v2.25h3.328l-.532 3.47h-2.796v8.385C19.612 23.027 24 18.062 24 12.073z"%3E%3C/path%3E%3C/svg%3E');
}

.prof-link.personal-site .link-label::before {
    background-image: url('data:image/svg+xml;charset=utf-8,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%231a3c5c"%3E%3Cpath d="M12 2C6.486 2 2 6.486 2 12s4.486 10 10 10 10-4.486 10-10S17.514 2 12 2zm7.931 9h-2.764a14.67 14.67 0 0 0-1.792-6.243A8.013 8.013 0 0 1 19.931 11zM12.53 4.027c1.035 1.364 2.427 3.78 2.627 6.973H9.03c.139-2.596 1.242-5.013 2.366-6.953.204-.01.416-.02.635-.02a8 8 0 0 1 .499 0zm-2.866.97A14.67 14.67 0 0 0 7.933 11H4.059a8.013 8.013 0 0 1 5.605-6.003zM4.059 13H7.83c.028 1.101.229 2.151.593 3.135A8.008 8.008 0 0 1 4.059 13zm5.134 7.003c-1.198-.602-2.161-2.106-2.661-4.003h2.694a12.17 12.17 0 0 0 .984 1.622 8.03 8.03 0 0 1-1.017 2.38zm2.837-4.028c-.192-.03-.39-.045-.592-.045h-.798c-.951-1.992-1.358-4.174-1.348-6.432L9.3 9.43h5.7l-.008.067c.022 2.23-.405 4.384-1.349 6.347l-.59.03c-.193.001-.391.016-.589.045zm.948 3.989a8.03 8.03 0 0 1-1.017-2.38c.363-.47.7-.986.984-1.622h2.688c-.5 1.892-1.464 3.396-2.655 4.002zm1.516-6.983c.363-.984.564-2.034.592-3.135h3.771a8.008 8.008 0 0 1-4.363 3.135zm2.06-5.136h-2.764c-.298-2.234-1.039-4.41-1.792-6.243a8.025 8.025 0 0 1 4.556 6.243z"%3E%3C/path%3E%3C/svg%3E');
}

.prof-link.business-site .link-label::before {
    background-image: url('data:image/svg+xml;charset=utf-8,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%235cb85c"%3E%3Cpath d="M21 7h-6a1 1 0 0 0-1 1v3h-2V4a1 1 0 0 0-1-1H3a1 1 0 0 0-1 1v16a1 1 0 0 0 1 1h18a1 1 0 0 0 1-1V8a1 1 0 0 0-1-1zM6 18H4v-2h2v2zm0-4H4v-2h2v2zm0-4H4V8h2v2zm0-4H4V4h2v2zm4 12H8v-2h2v2zm0-4H8v-2h2v2zm0-4H8V8h2v2zm0-4H8V4h2v2zm9 12h-2v-2h2v2zm0-4h-2v-2h2v2zm0-4h-2V8h2v2z"%3E%3C/path%3E%3C/svg%3E');
}

/* Mobile styles */
@media (max-width: 768px) {
    .professional-links {
        flex-direction: column;
        gap: 1rem;
        align-items: center;
    }
    
    .prof-link {
        width: 90%;
        justify-content: center;
    }
}