/* 选购弹窗 */
    .cp-overlay {
      position: fixed; top: 0; left: 0; right: 0; bottom: 0;
      background: rgba(0,0,0,.45); z-index: 9999;
      display: flex; align-items: center; justify-content: center;
    }
    .cp-box {
      background: #fff; border-radius: 8px;
      width: 860px; max-height: 580px;
      display: flex; flex-direction: column;
      box-shadow: 0 4px 24px rgba(0,0,0,.15);
    }
    .cp-header {
      padding: 0 20px; border-bottom: 1px solid #e8eaf2;
      display: flex; flex-direction: column; flex-shrink: 0;
    }
    .cp-tabs {
      display: flex; border-bottom: 1px solid #f0f0f0; flex-shrink: 0;
    }
    .cp-tab {
      padding: 12px 20px; font-size: 14px; color: var(--text-secondary);
      cursor: pointer; position: relative; transition: color .15s;
      white-space: nowrap;
    }
    .cp-tab:hover { color: var(--text-primary); }
    .cp-tab.active { color: #4caf82; font-weight: 600; }
    .cp-tab.active::after {
      content: ''; position: absolute; bottom: -1px; left: 20px; right: 20px;
      height: 2px; background: #4caf82; border-radius: 1px;
    }
    .cp-search-row {
      display: flex; align-items: center; gap: 10px; padding: 10px 0;
    }
    .cp-search-row .cp-search {
      flex: 1; height: 30px; border: 1px solid #d9d9d9;
      border-radius: 4px; padding: 0 8px 0 30px; font-size: 13px;
      outline: none; background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23bfbfbf' stroke-width='2'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.3-4.3'/%3E%3C/svg%3E") 8px center no-repeat;
    }
    .cp-search-row .cp-search:focus { border-color: #4caf82; }
    .cp-search-row .cp-cat-select {
      height: 30px; border: 1px solid #d9d9d9; border-radius: 4px;
      padding: 0 8px; font-size: 13px; outline: none; color: var(--text-primary);
    }
    .cp-search-row .cp-btn-query {
      height: 30px; padding: 0 16px; border: none; border-radius: 4px;
      background: #4caf82; color: #fff; font-size: 13px; cursor: pointer;
    }
    .cp-body { display: flex; flex: 1; overflow: hidden; }
    .cp-main { flex: 1; display: flex; flex-direction: column; overflow: hidden; }
    .cp-table-wrap { flex: 1; overflow-y: auto; padding: 0; }
    .cp-table {
      width: 100%; border-collapse: collapse; font-size: 13px;
    }
    .cp-table thead th {
      position: sticky; top: 0; background: #fafafa;
      padding: 10px 12px; text-align: left; font-weight: 500;
      color: var(--text-secondary); border-bottom: 1px solid #e8eaf2;
      white-space: nowrap;
    }
    .cp-table tbody tr {
      border-bottom: 1px solid #f0f0f0; cursor: pointer;
      transition: background .1s;
    }
    .cp-table tbody tr:hover { background: #f9fffe; }
    .cp-table tbody tr.cp-row-selected { background: #edf9f3; }
    .cp-table td { padding: 10px 12px; vertical-align: middle; }
    .cp-table .cp-col-check { width: 36px; text-align: center; }
    .cp-table .cp-col-code { width: 120px; color: var(--text-muted); font-size: 12px; }
    .cp-table .cp-col-price { width: 80px; color: #e85858; font-weight: 500; }
    .cp-table .cp-col-vip { width: 80px; color: #4caf82; font-weight: 500; }
    .cp-table .cp-col-stock { width: 60px; text-align: center; color: var(--text-secondary); }
    .cp-good-info { display: flex; align-items: center; gap: 10px; }
    .cp-good-img {
      width: 40px; height: 40px; border-radius: 6px;
      background: #f5f7fa; display: flex; align-items: center;
      justify-content: center; font-size: 22px; flex-shrink: 0;
    }
    .cp-good-name { font-size: 13px; color: var(--text-primary); line-height: 1.4; }
    .cp-good-sub { font-size: 11px; color: var(--text-muted); margin-top: 2px; }
    .cp-footer {
      padding: 10px 20px; border-top: 1px solid #e8eaf2;
      display: flex; align-items: center; justify-content: space-between;
      flex-shrink: 0; font-size: 13px; color: var(--text-secondary);
    }
    .cp-footer-left { display: flex; align-items: center; gap: 16px; }
    .cp-footer-right { display: flex; align-items: center; gap: 12px; }
    .cp-footer .cp-btn {
      padding: 6px 20px; border-radius: 4px; font-size: 13px;
      cursor: pointer; border: 1px solid #d9d9d9; background: #fff;
    }
    .cp-footer .cp-btn-cancel { margin-right: 0; }
    .cp-footer .cp-btn-confirm {
      background: #4caf82; color: #fff; border-color: #4caf82;
    }
    .cp-footer .cp-btn-confirm:hover { background: #43a074; }
    .cp-footer .cp-page {
      display: flex; align-items: center; gap: 4px;
    }
    .cp-footer .cp-page-btn {
      width: 26px; height: 26px; border: 1px solid #d9d9d9;
      border-radius: 4px; display: flex; align-items: center;
      justify-content: center; cursor: pointer; font-size: 12px;
      background: #fff; color: var(--text-secondary);
    }
    .cp-footer .cp-page-btn.active { background: #4caf82; color: #fff; border-color: #4caf82; }
    .cp-checkbox {
      width: 15px; height: 15px; accent-color: #4caf82; cursor: pointer;
    }