/*
 * AI SaaS Review Theme - Badges & Tags
 * Version: 1.0.0
 */

/* ============================================================
   Tags / Badges
   ============================================================ */
.aisaas-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 6px;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    white-space: nowrap;
}

/* Badge Colors */
.aisaas-badge--free {
    background: var(--aisaas-badge-free-bg);
    color: var(--aisaas-badge-free-text);
    border: 1px solid var(--aisaas-badge-free-border);
}

.aisaas-badge--trial {
    background: var(--aisaas-badge-blue-bg);
    color: var(--aisaas-badge-blue-text);
    border: 1px solid var(--aisaas-badge-rating-border);
}

.aisaas-badge--deal {
    background: var(--aisaas-badge-deal-bg);
    color: var(--aisaas-badge-deal-text);
    border: 1px solid var(--aisaas-badge-deal-border);
}

.aisaas-badge--new {
    background: var(--aisaas-badge-new-bg);
    color: var(--aisaas-badge-new-text);
    border: 1px solid var(--aisaas-badge-new-border);
}

.aisaas-badge--sponsored {
    background: var(--aisaas-badge-sponsored-bg);
    color: var(--aisaas-badge-sponsored-text);
    border: 1px solid var(--aisaas-badge-sponsored-border);
}

.aisaas-badge--rating {
    background: var(--aisaas-badge-rating-bg);
    color: var(--aisaas-badge-rating-text);
    border: 1px solid var(--aisaas-badge-rating-border);
}

/* Category Pills */
.aisaas-category-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 18px;
    background: var(--aisaas-bg);
    border: 1px solid var(--aisaas-border);
    border-radius: 100px;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--aisaas-text-secondary);
    transition: all 0.2s;
    text-decoration: none;
}

.aisaas-category-pill:hover {
    background: var(--aisaas-primary-light);
    border-color: var(--aisaas-primary);
    color: var(--aisaas-primary);
}

.aisaas-category-pill svg {
    width: 16px;
    height: 16px;
}
