/* Navigation Block Styles */
.block-navigation {
    display: flex;
    gap: 0.5rem;
    align-items: center;
    flex-wrap: wrap; /* Allow wrapping if items don't fit */
    max-width: 100%; /* Don't exceed parent container */
}

.block-navigation .nav-link {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 1rem;
    text-decoration: none;
    color: var(--link-color);
    font-size: 0.9375rem;
    font-weight: 500;
    border-radius: 0.5rem;
    transition: all 0.2s ease;
}

.block-navigation .nav-link:hover {
    background-color: var(--link-hover-bg);
    color: var(--link-hover-color);
}

.block-navigation .nav-link svg {
    width: 18px;
    height: 18px;
}

@media (max-width: 768px) {
    .block-navigation {
        flex-direction: column;
        width: 100%;
        gap: 0.25rem;
    }

    .block-navigation .nav-link {
        width: 100%;
        justify-content: flex-start;
    }
}