/* Select buttons: label on the left, caret at the far right. Instant suggestion panels. */
.choice-button{display:flex;align-items:center;gap:8px}
.choice-label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left}
.choice-caret{flex:none;margin-left:auto;color:#667085;font-size:12px;line-height:1}

.suggest-panel{position:fixed;z-index:200;max-height:min(420px,60vh);overflow:auto;padding:6px;border:1px solid #e4e7ec;border-radius:10px;background:#fff;box-shadow:0 12px 32px #1018282e}
.suggest-item{display:flex;flex-direction:column;gap:2px;width:100%;margin:0;padding:8px 10px;border:0;border-radius:6px;background:none;color:#1d2433;text-align:left}
.suggest-item:hover,.suggest-item.active{background:var(--brand-soft)}
.suggest-item strong{font-size:14px;font-weight:600}
.suggest-group{color:var(--brand);font-size:11px;font-weight:700;letter-spacing:.3px;text-transform:uppercase}
.suggest-sub{color:#667085;font-size:12px}
.suggest-item mark{padding:0;border-radius:2px;background:color-mix(in srgb,var(--brand) 18%,transparent);color:inherit}
.suggest-empty{margin:0;padding:12px;color:#667085;font-size:13px}
.suggest-more{width:100%;margin-top:4px;padding:8px;border:0;border-top:1px solid #eaecf0;border-radius:0 0 6px 6px;background:none;color:var(--brand);font-weight:600}

/* Labeled action buttons (Sửa nhóm, Xóa nhóm, Xóa dòng). */
.label-btn{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 12px;border:1px solid #d0d5dd;border-radius:6px;background:#fff;color:#344054;font-size:13px;font-weight:600;white-space:nowrap}
.label-btn .solid-icon{width:15px;height:15px;flex-basis:15px}
.label-btn:hover,.label-btn:focus-visible{border-color:var(--brand);background:var(--brand-soft);color:var(--brand)}
.label-btn.danger{color:#d92d20}
.label-btn.danger:hover,.label-btn.danger:focus-visible{border-color:#d92d20;background:#fef3f2;color:#d92d20}

/* Customer label pills in the quote editor; system label badge. */
.label-picker{min-width:0}
.label-pills{display:flex;flex-wrap:wrap;gap:8px;margin-top:7px}
.label-pill{display:inline-flex;margin:0;cursor:pointer}
.label-pill input{position:absolute;width:1px;height:1px;margin:0;opacity:0;pointer-events:none}
.label-pill span{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border:1px solid #d0d5dd;border-radius:999px;background:#fff;color:#344054;font-size:13px}
.label-pill input:checked+span{border-color:var(--brand);background:var(--brand-soft);color:var(--brand);font-weight:600}
.label-pill input:checked+span::before{content:'✓'}
.label-pill input:focus-visible+span{outline:2px solid var(--brand);outline-offset:2px}
.label-pill.locked{cursor:default}
.label-system{display:inline-block;margin-left:8px;padding:2px 6px;border-radius:4px;background:#f2f4f7;color:#475467;font-size:11px;font-weight:600;vertical-align:middle}

/* Brands: product brand prices, quote brand picker (lock one / choose several), line brand select. */
.brand-editor{padding:12px 14px;border:1px solid #e4e7ec;border-radius:6px;background:#fcfcfd}
.brand-editor h3{display:flex;align-items:center;gap:8px;margin:0 0 4px}
.brand-editor h3 .solid-icon{width:18px;height:18px;flex-basis:18px;color:var(--brand)}
.brand-picker{min-width:0;padding:12px 14px;border:1px solid #e4e7ec;border-radius:6px;background:#fcfcfd}
.brand-picker-head{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px 12px}
.brand-picker .field-label{margin:0}
.brand-picker .segmented span{display:inline-flex;align-items:center;gap:6px;padding:7px 12px}
.brand-picker .segmented .solid-icon{width:14px;height:14px;flex-basis:14px}
.brand-picker .hint{margin:8px 0 0}
.brand-field{grid-column:1/-1;max-width:420px}
.retention-form{margin-top:18px;padding-top:16px;border-top:1px solid #eaecf0}
.retention-form h3{margin:0 0 4px}