/* Blog / Social Media Page Specific Styles */

/* ============================================================================
   CATEGORY TAGS - GRID LAYOUT
   Note: Base .category-tag styles are in shared-components.css
   This adds grid-specific layout for the blog page
   ============================================================================ */
.category-tag {
    display: inline-block;
    padding: 0.25rem 0.75rem;
    background-color: var(--light-color);
    color: var(--primary-color);
    border-radius: 50px;
    font-size: 0.875rem;
    text-decoration: none;
    transition: all 0.3s ease;
}

.category-tag:hover {
    background-color: var(--primary-color);
    color: white;
}

/* ============================================================================
   POST FILTER TAGS
   Active state for filtering posts by category/tag
   ============================================================================ */
.post-filter-tag.active {
    background-color: var(--primary-color);
    color: white;
}