/* Tag Component - Shared Styles */

/* Base Tag */
.tag {
    background: #edf2f7;
    color: #4a5568;
    padding: 0.3rem 0.8rem;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: capitalize;
    display: inline-block;
}

/* Tag Variants */

/* New Badge (green) */
.tag.new {
    background: #dcfce7;
    color: #16a34a;
    font-weight: 700;
}

/* Source Badge (light blue - for index page) */
.tag.source {
    background: #e6f7ff;
    color: #0066cc;
    border: 1px solid #b3d9ff;
}

/* Source Badge (light red - for category page) */
.tag.source-alt {
    background: #fee2e2;
    color: #dc2626;
    border: 1px solid #fca5a5;
}

/* Category Badge (brand purple - for archive page) */
.tag.category {
    background: #eef2ff;
    color: #667eea;
    border: 1px solid #c7d2fe;
}

/* Coming Soon Badge (purple gradient) */
.tag.coming-soon {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    font-weight: 700;
}

/* Responsive Design */
@media (max-width: 768px) {
    .tag {
        font-size: 0.7rem;
        padding: 0.25rem 0.6rem;
    }
}