/* Dycode Bundle Builder — Base Styles */
.wcbb-bundle-selector { max-width: 900px; margin: 24px 0; font-family: inherit; }

/* Header */
.wcbb-title { margin: 0 0 8px; font-size: 18px; font-weight: 600; }
.wcbb-counter { font-size: 14px; color: #555; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.wcbb-selected-count { font-weight: 700; font-size: 18px; }
.wcbb-discount-badge { background: #e8f4e8; color: #2d7a2d; border-radius: 20px; padding: 3px 10px; font-size: 12px; font-weight: 600; }
.wcbb-progress-bar { background: #e0e0e0; border-radius: 4px; height: 6px; margin-top: 10px; overflow: hidden; }
.wcbb-progress-fill { height: 100%; width: 0%; border-radius: 4px; transition: width 0.3s ease; }

/* Search */
.wcbb-search-bar { margin-bottom: 14px; }
.wcbb-search-input { width: 100%; padding: 10px 14px; border: 1px solid #ddd; border-radius: 8px; font-size: 14px; box-sizing: border-box; outline: none; transition: border-color 0.2s; }
.wcbb-search-input:focus { border-color: #2c7be5; }

/* Grid (columns/gap set per-instance via scoped <style>) */
.wcbb-products-grid { min-height: 200px; }
.wcbb-loading { grid-column: 1 / -1; text-align: center; padding: 40px; color: #999; }

/* Card */
.wcbb-product-card { padding: 10px; cursor: pointer; text-align: center; transition: transform 0.2s, box-shadow 0.2s; position: relative; user-select: none; }
.wcbb-product-card:hover { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(0,0,0,0.12); }

/* Image — aspect ratio maintained, no stretching */
.wcbb-product-card .wcbb-img-wrap {
    width: 100%;
    overflow: hidden;
    border-radius: 6px;
    margin-bottom: 8px;
    background: #f5f5f5;
    display: flex;
    align-items: center;
    justify-content: center;
    /* aspect-ratio set inline per instance */
}
.wcbb-product-card .wcbb-img-wrap img {
    width: 100%;
    height: 100%;
    object-fit: contain;  /* keeps aspect ratio, no cropping */
    display: block;
}

/* Product info */
.wcbb-product-name { font-size: 12px; font-weight: 500; color: #333; margin: 4px 0; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.wcbb-product-price { font-size: 13px; font-weight: 700; }

/* Qty controls */
.wcbb-qty-controls { display: none; align-items: center; justify-content: center; gap: 8px; margin-top: 8px; }
.wcbb-product-card.is-selected .wcbb-qty-controls { display: flex; }
.wcbb-qty-btn { width: 26px; height: 26px; border-radius: 50%; cursor: pointer; font-size: 16px; display: flex; align-items: center; justify-content: center; transition: all 0.15s; background: #fff; border: 1px solid; }
.wcbb-qty-value { font-weight: 700; min-width: 20px; text-align: center; }

/* Selected check */
.wcbb-check-icon { position: absolute; top: 6px; right: 6px; color: #fff; width: 20px; height: 20px; border-radius: 50%; font-size: 11px; display: none; align-items: center; justify-content: center; }
.wcbb-product-card.is-selected .wcbb-check-icon { display: flex; }

/* Pagination */
.wcbb-pagination { display: flex; align-items: center; justify-content: center; gap: 12px; margin: 16px 0; }
.wcbb-pagination button { padding: 8px 16px; border: 1px solid #ddd; background: #fff; border-radius: 6px; cursor: pointer; font-size: 13px; transition: all 0.2s; }
.wcbb-pagination button:hover:not(:disabled) { border-color: #2c7be5; color: #2c7be5; }
.wcbb-pagination button:disabled { opacity: 0.4; cursor: not-allowed; }
.wcbb-page-info { font-size: 13px; color: #777; }

/* Selected summary */
.wcbb-selected-summary { background: #f0f6ff; border: 1px solid #c8dff8; border-radius: 8px; padding: 12px 16px; margin: 12px 0; }
.wcbb-selected-summary h4 { margin: 0 0 8px; font-size: 14px; }
.wcbb-selected-list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.wcbb-selected-list li { color: #fff; border-radius: 20px; padding: 4px 12px; font-size: 12px; }

/* Button (width/colors set per-instance) */
.wcbb-add-to-cart { padding: 14px 28px; font-size: 16px; font-weight: 600; margin-top: 8px; cursor: pointer; transition: opacity 0.2s; display: block; }
.wcbb-add-to-cart:disabled { opacity: 0.5; cursor: not-allowed; }
.wcbb-add-to-cart:not(:disabled):hover { opacity: 0.88; }

/* Message */
.wcbb-message { margin-top: 10px; padding: 10px 14px; border-radius: 6px; font-size: 14px; display: none; }
.wcbb-message.success { background: #e8f5e9; color: #2e7d32; border: 1px solid #a5d6a7; display: block; }
.wcbb-message.error   { background: #ffebee; color: #c62828; border: 1px solid #ef9a9a; display: block; }