/* Insights page specifics that don't belong in the shared layer. */

/* Category filter pills.
   The row reuses .pc-chip, but this page draws a slightly roomier pill and paints the
   selected one solid blue rather than the tinted treatment .pc-chip.is-on uses elsewhere.
   Loaded after app.css, so equal-specificity rules win here. */
.ins-pill {
    padding: 8px 16px;
    font-weight: 500;
    text-decoration: none;
}

.ins-pill:hover {
    border-color: var(--pc-blue-primary);
    text-decoration: none;
}

.ins-pill.is-on {
    background: var(--pc-blue-primary);
    border-color: var(--pc-blue-primary);
    color: var(--pc-white);
    font-weight: 600;
}

/* Filtered-out article cards. The card's `display:flex` is inline — which outranks any
   selector — so hiding it needs the extra weight. */
.ins-card[hidden] {
    display: none !important;
}