/* Bid Place Component Styles */

.budi-bidplace .budi-bid-calculation {
    padding: 12px 16px;
    border: 1px solid var(--neutral-400);
    background-color: var(--neutral-100);
    font-size: 14px;
}

.budi-bidplace .budi-bid-calculation__row p {
    margin-bottom: 0;
}

/* Bid place component: hide calculation by default */
.budi-bidplace .budi-bid-calculation {
    display: none;
 }
 
 .budi-bidplace .budi-bid-calculation.d-none {
    display: none;
 }
 
 .budi-bidplace .budi-bid-calculation:not(.d-none) {
    display: flex;
 }

/* Suggestion pills */
.budi-bidplace__suggestions {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.budi-bidplace__pill {
    border: none;
    background: var(--pink-100);
    color: var(--primary);
    font-weight: 600;
    border-radius: 8px;
    padding: 8px 12px;
    cursor: pointer;
    white-space: nowrap;
    flex: 1 1 auto; /* allow growth to share width */
}

.budi-bidplace__pill:hover {
    filter: brightness(0.98);
}

/* When there are multiple pills in a row, let them expand evenly */
.budi-bidplace__suggestions > .budi-bidplace__pill {
    flex-basis: calc((100% - 24px) / 4); /* default targeting 4, will be hidden if overflow */
}