/*
 * Canonical "Item # XXXXXX" pill used site-wide (PDP, mini cart, mini quote,
 * quote items table, checkout summary, and any other per-context variants
 * such as the listing card sku pill that match this visual token).
 *
 * Size is standardized to match the mini cart drawer pill so the same
 * visual token reads at the same scale everywhere on the site.
 */

.ims-part-number-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.175rem 0.45rem;
    background: var(--color-gold-light);
    border-radius: 999px;
    font-size: 0.6875rem;
    line-height: 1;
    color: var(--color-dark);
    width: fit-content;
}

/*
 * Tag/shield icon was historically rendered inline in PHP/JS for this badge.
 * It's now hidden site-wide so the pill is just label + value.
 */
.ims-part-number-badge__icon,
.ims-part-number-badge svg {
    display: none !important;
}

.ims-part-number-badge__label {
    font-weight: 400;
    color: var(--color-dark);
    letter-spacing: 0.02em;
}

.ims-part-number-badge__value {
    font-weight: 400;
    color: var(--color-dark);
    font-family: 'SF Mono', 'Fira Code', 'Cascadia Code', ui-monospace, monospace;
    letter-spacing: 0.04em;
}