.bnb-ai-panel { margin: 0 0 2em; padding: 1em; border: 2px solid #2b3990; border-radius: 8px; }
.bnb-ai-panel-title { margin: 0 0 .75em; font-size: 1.2em; color: #2b3990; }
.bnb-ai-panel-row { display: flex; flex-wrap: wrap; gap: 1em; }
.bnb-ai-card { display: flex; flex-direction: column; width: 180px; text-decoration: none; }
.bnb-ai-card img { width: 100%; height: 120px; object-fit: contain; }
.bnb-ai-card-title { font-weight: 600; }
.bnb-ai-card-price { color: #2b3990; }
.bnb-ai-card-why { font-size: .85em; color: #555; }
.bnb-ai-suggest { position: absolute; top: 100%; left: 0; right: 0; z-index: 9999; background: #fff; border: 1px solid #ccc; box-shadow: 0 4px 12px rgba(0,0,0,.15); }
.bnb-ai-suggest .bnb-ai-card { flex-direction: row; width: auto; gap: .5em; padding: .5em; align-items: center; }
.bnb-ai-suggest .bnb-ai-card img { width: 40px; height: 40px; }
.bnb-ai-suggest .bnb-ai-card:hover { background: #f0f2fa; }

/* Replace mode: native results hidden while AI results load/render.
   The class is removed by JS if the AI returns nothing, revealing the grid.
   Hide Woo empty-state notices only — not cart/login errors or success messages. */
.bnb-ai-replace ul.products,
.bnb-ai-replace .woocommerce-result-count,
.bnb-ai-replace .woocommerce-ordering,
.bnb-ai-replace .woocommerce-pagination,
.bnb-ai-replace nav.woocommerce-pagination,
.bnb-ai-replace .woocommerce-info,
.bnb-ai-replace .woocommerce-no-products-found,
.bnb-ai-replace .woocommerce-no-products-found .wc-block-components-notice-banner { display: none !important; }
.bnb-ai-loading { color: #555; font-style: italic; margin: 1em 0; }
