/**
 * Inspira Woo Add-ons — Inline Pills frontend styles.
 *
 * Loaded only when the feature is on AND at least one variation has
 * at least one render surface active (single page position != off,
 * or any of shop_loop / related / qv / wishlist_page placements).
 *
 * Per-pill bg + text colors are inlined via style="..." on the pill
 * span (admin-configurable per variation). The base shape + icon
 * styles live here so they don't need to be repeated per render.
 */

.iwa-inline-pill {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 11px 10px;
    margin: 0px 0px 0px 0;
    border-radius: 5px;
    font-size: 0.78em;
    font-weight: 600;
    line-height: 1.3;
    vertical-align: middle;
    white-space: nowrap;
    width: 100%;
    text-align: center;
    justify-content: center;
    /* bg + color are inlined per variation via style="..." */
}

.iwa-inline-pill-icon {
    flex-shrink: 0;
    /* Icon inherits color from parent via stroke="currentColor". */
}

.iwa-inline-pill-text {
    /* No special rules — inherits parent font + color. */
}

/* ─── Under-card pills strip (Wishlist Page widget) ─────────────
   Container rendered as a sibling AFTER .iwa-wishlist-page-card__body
   but INSIDE .iwa-wishlist-page-card. Visually attaches a tag strip
   to the bottom of the card row, scrolling and stacking with it. */
.iwa-wishlist-page-card__pills {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    padding: 5px 5px;
    border-top: 1px solid #ececec;
    background: #fafafa;
}

.iwa-wishlist-page-card__pills:empty {
    /* Don't show the container chrome (padding + border) when no pills
       are eligible — the render path returns '' but we still echo the
       wrapper div for layout stability. Hide via :empty so the card
       reverts to its pre-strip layout. */
    display: none;
}
